New to KendoReact? Start a free 30-day trial

BottomNavigationItemProps

Interface

The interface for describing items that can be passed to the items prop of the BottomNavigation component.

Definition

Package:@progress/kendo-react-layout

Properties

className?

string

Sets additional CSS classes to the BottomNavigation item.

Example:

jsx

<BottomNavigationItem className="custom-class" />

disabled?

boolean

Disables the BottomNavigationItem.

Default:

false

Example:

jsx

<BottomNavigationItem disabled={true} />

icon?

string

Defines the name for an existing icon in a KendoReact theme. The icon is rendered inside the BottomNavigationItem by a span.k-icon element.

Example:

jsx

<BottomNavigationItem icon="home" />

selected?

boolean

Specifies if the BottomNavigationItem is selected.

Default:

false

Example:

jsx

<BottomNavigationItem selected={true} />

style?

CSSProperties

Sets additional CSS styles to the BottomNavigation item.

Example:

jsx

<BottomNavigationItem style={{ color: 'red' }} />

svgIcon?

SVGIcon

Defines an SVG icon. The icon is rendered inside the BottomNavigationItem.

Example:

jsx

import { gearIcon } from '@progress/kendo-svg-icons';

<BottomNavigationItem svgIcon={gearIcon} />

tabIndex?

number

Sets the tabIndex prop of the BottomNavigationItem.

Default:

Example:

jsx

<BottomNavigationItem tabIndex={-1} />

text?

ReactNode

Specifies the text content of the BottomNavigationItem.

Example:

jsx

<BottomNavigationItem text="Home" />