ToolbarItemProps

The ToolbarItem component allows for the rendering of individual items within a Toolbar.

import { Toolbar, ToolbarItem } from '@syncfusion/react-navigations';
export default function App() {
  return (
      <Toolbar>
          <ToolbarItem className="action-button" style={{ backgroundColor: '#f0f0f0' }}>
              <button>Cut</button>
          </ToolbarItem>
      </Toolbar>
  );
}

import { Toolbar, ToolbarItem } from '@syncfusion/react-navigations';
export default function App() {
  return (
      <Toolbar>
          <ToolbarItem className="action-button" style={{ backgroundColor: '#f0f0f0' }}>
              <button>Cut</button>
          </ToolbarItem>
      </Toolbar>
  );
}

Props

The following table outlines the props for the ToolbarItemProps:

Name	Type	Default	Description
children	node	-	Specifies the content of the toolbar item. Can be text or any valid React node.
className	string	-	Specifies an optional CSS class to apply to the toolbar item. This is useful for reusing styling in a custom template.

ToolbarItemProps

Props

Enhance your React apps with Syncfusion components today