DrawerItemProps

Updated on Sep 5, 2025

An interface for the Drawer items.

Name	Type	Default	Description
children?	any		Represents the children that are passed to the DrawerItem. Example: jsx <DrawerItem>Item Content</DrawerItem>
className?	string		Specifies a list of CSS classes that will be added to the DrawerItem element.
disabled?	boolean	false	Specifies if the Drawer item is disabled. Example: jsx <DrawerItem disabled={true} />
icon?	string		Defines the name for an existing icon in a KendoReact theme. Example: jsx <DrawerItem icon="home" />
index?	number		Sets the index of the DrawerItem that is used to identify it. Example: jsx <DrawerItem index={0} />
level?	number		This property is used in scenarios with hierarchical drawer. The rendering of the component requires each node to have a "k-level- + the level of nesting" className. Example: jsx <DrawerItem level={1} />
selected?	boolean	false	Specifies if the Drawer item is initially selected. Example: jsx <DrawerItem selected={true} />
separator?	boolean	false	Specifies if this is a separator item. Example: jsx <DrawerItem separator={true} />
style?	React.CSSProperties		Sets additional CSS styles to the Drawer item.
svgIcon?	SVGIcon		Defines the SVG icon of the item. Example: jsx import { gearIcon } from '@progress/kendo-svg-icons'; <DrawerItem svgIcon={gearIcon} />
tabIndex?	number	0	Sets the tabIndex property of the DrawerItem. Example: jsx <DrawerItem tabIndex={1} />
text?	string		Specifies the text content of the Drawer item. Example: jsx <DrawerItem text="Dashboard" />