New to KendoReact? Start a free 30-day trial

GridToolbarProps

Interface

The properties of the GridToolbar component.

Definition

Package:@progress/kendo-react-grid

Properties

ariaLabel?

string

Represents the aria-label HTML attribute of the Toolbar component.

buttonScrollSpeed?

number

Sets the Toolbar scroll speed in pixels when scrolling via clicking the previous or next button. Applicable when the overflow property is set to scroll.

Default:

100

children?

ReactNode

Determines the children nodes.

className?

string

Sets additional classes to the Toolbar.

dir?

string

Represents the dir HTML attribute.

fillMode?

"flat" | "solid" | "outline"

Configures the fillMode of the Toolbar. The available options are:

solid - Applies a background color and solid borders.
flat - Sets a transparent background and solid bottom border.
outline - Sets a transparent background and solid borders.

Default:

undefined (theme-controlled)

id?

string

Sets the id property of the top div element of the component.

keyboardNavigation?

boolean

If set to false, it will turn off the built-in keyboard navigation.

nextButton?

ComponentType<object>

Defines the custom component that will be rendered as a next button. To remove the button, set a function which returns null () => null.

onResize?

(event: ToolbarResizeEvent) => void

The resize event of the Toolbar.

Parameters:eventToolbarResizeEvent

overflow?

"section" | "none" | "scroll"

Represents the possible overflow mode options of the Toolbar. Applicable when there is not enough space to render all tools.

Default:

none

prevButton?

ComponentType<object>

Defines the custom component that will be rendered as a previous button. To remove the button, set a function which returns null () => null.

scrollButtons?

"auto" | "hidden" | "visible"

Determines the Toolbar scroll buttons visibility. Applicable when the overflow property is set to scroll.

Default:

auto

scrollButtonsPosition?

"split" | "end" | "start"

Determines the Toolbar scroll buttons position. Applicable when the overflow property is set to scroll.

Default:

split

size?

"small" | "medium" | "large"

Configures the size of the Toolbar. The available options are:

small - Sets the padding of the component to 4px 4px.
medium - Sets the padding of the component to 8px 8px.
large - Sets the padding of the component to 10px 10px.

Default:

undefined (theme-controlled)

style?

CSSProperties

The styles that are applied to the Toolbar.

tabIndex?

number

Specifies the tabIndex of the Toolbar.