Skip to main content

Expand Menu Icon

The renderExpandIcon prop allows you to customize the icon used for expanding the menu. The renderExpandIcon prop takes a RenderExpandIconParams object as a parameter. This function allows you to fully customize the expand menu icon based on different conditions or states.

Propsโ€‹

The RenderExpandIconParams object passed to the renderExpandIcon function contains the following properties:

type renderExpandIcon?: (params: RenderExpandIconParams) => ReactElement

type RenderExpandIconParams = {
open: boolean
level: number
active: boolean
disabled: boolean
}
PropertyDescription
openWhether the menu section is open or closed.
levelRepresenting the depth level of the menu section.
activeWhether the menu section is currently active or selected.
disabledWhether the menu item is disabled or not

With Parameterโ€‹

The renderExpandIcon prop is a function that takes a RenderExpandIconParams object as a parameter.

Exampleโ€‹

/vertical-menu/menu/expand-icon/with-params

Source Codeโ€‹


Without Parameterโ€‹

The renderExpandIcon prop takes a ReactElement. You can also customize the expand menu icon without any parameters.

Exampleโ€‹

/vertical-menu/menu/expand-icon/without-params

Source Codeโ€‹