DrawerProps
The properties of the KendoReact Drawer component.
animation?
boolean | DrawerAnimation
Specifies the animation settings of the Drawer. If boolean enables or disables the default animation. Use DrawerAnimation to set slide animation with customizable duration option. Accepts a number in milliseconds.
children?
any
Sets the Drawer items declaratively.
className?
string
Specifies a list of CSS classes that will be added to the Drawer element.
dir?
string
Represents the dir
HTML attribute. This is used to switch from LTR to RTL.
expanded?
boolean
Specifies the state of the Drawer. Defaults to false
(see example).
item?
React.ComponentType<DrawerItemProps>
Overrides the default component responsible for visualizing a single item (see example).
The default Component is: DrawerItem.
items?
Array<DrawerItemProps>
The collection of items that will be rendered in the Drawer (see example).
mini?
boolean
Enables the mini (compact) view of the Drawer which is displayed when the component is collapsed (see example)).
miniWidth?
number
Defines the width of the Drawer when the mini view is enabled and the component is collapsed. Defaults to 50
.
mode?
"overlay" | "push"
Specifies the mode in which the Drawer will be displayed.
The possible values are overlay
and push
.
Defaults to overlay
(see example).
onOverlayClick?
(event: MouseEvent<HTMLDivElement>) => void
The event handler that will be fired when the overlay is clicked. Used in overlay mode only.
onSelect?
(event: DrawerSelectEvent) => void
Fires when a Drawer item is selected.
position?
"start" | "end"
Specifies the position of the Drawer.
The possible values are start
and end
(see example).
style?
CSSProperties
Sets additional CSS styles to the Drawer.
tabIndex?
number
Sets the tabIndex
property of the Drawer.
width?
number
Defines the width of the Drawer when it is expanded. Defaults to 240
.