BottomNavigationProps
Represents the props of the KendoReact BottomNavigation component.
Definition
Package:@progress/kendo-react-layout
Properties
border?
boolean
Sets a border to the BottomNavigation.
false
className?
string
Sets additional CSS classes to the BottomNavigation.
dir?
string
Represents the dir HTML attribute. Use this to switch from LTR to RTL.
disabled?
boolean
Disables the whole BottomNavigation.
false
The BottomNavigation fill style (see example).
The possible values are:
flat— Sets the theme color as the text color. The background will be white.solid— Sets the theme color as a background color.
undefined (theme-controlled)
id?
string
Sets the id property of the root BottomNavigation element.
item?
ComponentType<BottomNavigationItemProps>
Overrides the default component's content responsible for visualizing a single item (see example).
Specifies how the icon and text label are positioned in each BottomNavigation item (see example).
The possible values are:
vertical(Default) — Renders the text below the icon.horizontal— Renders the text and the icon on the same line.
vertical
Fires when a BottomNavigation item is about to be rendered (see example). Used to override the default appearance of the items.
ReactNode
The collection of items that will be rendered in the BottomNavigation (see example).
onKeyDown?
(event: BottomNavigationEvent) => void
Triggered on onKeyDown event.
onSelect?
(event: BottomNavigationSelectEvent) => void
Fires when a BottomNavigation item is selected.
Specifies the BottomNavigation position and behavior when the page is scrolled (see example).
The possible values are:
fixed(Default) — The BottomNavigation always stays at the bottom of the viewport, regardless of the page scroll position.sticky— Positions the BottomNavigation based on the user's scroll position. A sticky element toggles between static
and fixed CSS position property, depending on the scroll position.
It is positioned static until a given offset position is met in the viewport - then it "sticks" in place like fixed positionMode.
fixed
style?
CSSProperties
Sets additional CSS styles to the BottomNavigation.
Specifies the BottomNavigation theme color (see example).
The possible values are:
base— Applies coloring based on the base theme color.primary— Applies coloring based on the primary theme color.secondary— Applies coloring based on the secondary theme color.tertiary— Applies coloring based on the tertiary theme color.inverse— Applies coloring based on the inverted theme color.
undefined (theme-controlled)