@progress/kendo-react-grid 11.0.0-develop.2 → 11.0.0-develop.21

package/index.d.mts

@@ -6,6 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import { BaseEvent } from '@progress/kendo-react-common';
+import { ButtonProps } from '@progress/kendo-react-buttons';
 import { CellProps } from '@progress/kendo-react-data-tools';
 import { ClipboardSettings } from '@progress/kendo-react-data-tools';
 import { ColumnBaseProps } from '@progress/kendo-react-data-tools';
@@ -60,6 +61,7 @@ import { TableSelectableSettings } from '@progress/kendo-react-data-tools';
 import { TableSelectionChangeEvent } from '@progress/kendo-react-data-tools';
 import { TextBoxChangeEvent } from '@progress/kendo-react-inputs';
 import { TextBoxProps } from '@progress/kendo-react-inputs';
+import { ToolbarProps } from '@progress/kendo-react-buttons';
 
 /**
  * The value of the filter operators displayed in the boolean filter menu.
@@ -251,6 +253,8 @@ declare interface ExtendedColumnProps extends GridColumnProps {
     /** @hidden _internal usage only */
     _type?: 'edit' | 'expand';
     rowSpannable?: Required<GridRowSpannableSettings>;
+    defaultCell?: any;
+    defaultHeaderCell?: any;
 }
 
 /**
@@ -273,6 +277,9 @@ export declare const getStatusData: (args: StatusDataArgs) => StatusItem[];
 /**
  * Represents the [KendoReact Grid component]({% slug overview_grid %}).
  *
+ * @remarks
+ * Supported children components are: {@link GridColumn}, {@link GridToolbar}, {@link GridNoRecords}, {@link StatusBar}.
+ *
  * @example
  * ```jsx
  * const App = () => {
@@ -304,7 +311,12 @@ export declare const GRID_PREVENT_SELECTION_ELEMENT = "data-prevent-selection";
 /** The attribute required by the Grid selection on Grid `tr` elements. */
 export declare const GRID_ROW_INDEX_ATTRIBUTE = "data-grid-row-index";
 
-export declare const GridCell: (props: GridCellProps) => JSX.Element | null;
+/**
+ * @hidden
+ */
+export declare const GridCell: (props: {
+    cellProps: GridCellProps;
+}) => JSX.Element | null;
 
 /**
  * Represents the `GridCellBaseOptions` object that are passed to the handler.
@@ -368,11 +380,6 @@ export declare interface GridCellProps extends Omit<CellProps, 'onChange' | 'ren
      * Supported values are `text`, `numeric`, `boolean`, and `date`.
      */
     editor?: 'text' | 'numeric' | 'boolean' | 'date';
-    /**
-     * A function to override the default rendering of the cell.
-     * Accepts the default rendering and props as arguments and returns a React element.
-     */
-    render?: (defaultRendering: React.ReactElement<HTMLTableCellElement> | null, props: GridCellProps) => React.ReactElement<HTMLTableCellElement> | null;
     /**
      * @hidden
      */
@@ -467,7 +474,9 @@ export declare type GridColSpanProps = {
 };
 
 /**
- * @hidden
+ * Represents the GridColumn component.
+ *
+ * @returns null
  */
 export declare const GridColumn: React_2.FunctionComponent<GridColumnProps>;
 
@@ -911,7 +920,7 @@ declare interface GridColumnMenuItemProps {
     /**
      * The class of the icon that is rendered next to the title.
      */
-    iconClass: string;
+    iconClass?: string;
     /**
      * The SVG icon that is rendered next to the title.
      */
@@ -1199,16 +1208,6 @@ export declare interface GridColumnProps extends Omit<ColumnBaseProps, 'cell'> {
      * ```
      */
     media?: string;
-    /**
-     * Defines the component that will be rendered as a cell. If not set, a `GridCell` will be rendered by default.
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridcolumnprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     * @example
-     * ```jsx
-     * <GridColumn cell={CustomCell} />
-     * ```
-     */
-    cell?: ComponentType<GridCellProps>;
     /**
      * Specifies a set of cell components that the Grid will render instead of the built-in cell.
      *
@@ -1218,42 +1217,6 @@ export declare interface GridColumnProps extends Omit<ColumnBaseProps, 'cell'> {
      * ```
      */
     cells?: GridCellsSettings;
-    /**
-     * Defines the component that will be rendered as a filter cell. If not set, a `GridFilterCell` will be rendered by default.
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridcolumnprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     * @example
-     * ```jsx
-     * <GridColumn filterCell={CustomFilterCell} />
-     * ```
-     */
-    filterCell?: ComponentType<GridFilterCellProps>;
-    /**
-     * Defines the component that will be rendered as a header cell. If not set, a `GridHeaderCell` will be rendered by default.
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridcolumnprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     * @example
-     * ```jsx
-     * <GridColumn headerCell={CustomHeaderCell} />
-     * ```
-     */
-    headerCell?: ComponentType<GridHeaderCellProps>;
-    /**
-     * Defines the component that will be rendered as a footer cell.
-     * The footer has to render an HTML `<td>` element and applies the `style` and `colspan` values from its props.
-     *
-     * @example
-     * ```jsx-no-run
-     * <GridColumn
-     *  footerCell={props => (
-     *    <td className='k-table-td' colSpan={props.colSpan} style={props.style} role={'gridcell'}>Sum: 50</td>
-     *  )}
-     * />
-     * ```
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridcolumnprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     */
-    footerCell?: ComponentType<GridFooterCellProps>;
     /**
      * Sets the type of the column and renders a dedicated column for interaction.
      *
@@ -1663,7 +1626,7 @@ export declare interface GridDetailExpandChangeEvent extends GridEvent {
 }
 
 /**
- * Represents the detail row class of the KendoReact Grid. Used to define custom details for each row. Can be applied for building the hierarchy. If `expandField` is set, the details for each row will be visible or hidden depending on the current data item and its `expandField` value.
+ * Represents the detail row class of the KendoReact Grid. Used to define custom details for each row. Can be applied for building the hierarchy. The details for each row will be visible or hidden depending on the current `detailExpand` prop.
  *
  * @example
  * ```jsx
@@ -1726,7 +1689,9 @@ declare interface GridEditableSettings extends TableEditableSettings {
 /**
  * @hidden
  */
-export declare const GridEditCell: (props: GridCellProps) => JSX.Element;
+export declare const GridEditCell: (props: {
+    cellProps: GridCellProps;
+}) => JSX.Element | null;
 
 /**
  * Represents the object of the `onEditChange` Grid event.
@@ -1763,25 +1728,7 @@ export declare type GridEditDialogProps = DialogProps & {
 export declare interface GridEvent extends BaseEvent<GridHandle> {
 }
 
-/**
- * Represents the object of the `onExpandChange` Grid event.
- */
-export declare interface GridExpandChangeEvent extends GridEvent {
-    /**
-     * The data item that is expanded or collapsed.
-     */
-    dataItem: any;
-    /**
-     * Indicates whether the data item is expanded or collapsed
-     */
-    value: boolean;
-    /**
-     * Zero based index of the data item.
-     */
-    dataIndex: number;
-}
-
-export declare const GridFilterCell: (props: GridFilterCellProps) => string | number | bigint | boolean | Iterable<React_2.ReactNode> | Promise<string | number | bigint | boolean | React_2.ReactPortal | React_2.ReactElement<unknown, string | React_2.JSXElementConstructor<any>> | Iterable<React_2.ReactNode> | null | undefined> | JSX.Element | null | undefined;
+export declare const GridFilterCell: (props: GridFilterCellProps) => JSX.Element;
 
 /**
  * The props of the GridFilterCell component
@@ -1825,10 +1772,6 @@ export declare interface GridFilterCellProps {
      * The list of values for the Boolean filter.
      */
     booleanValues: GridFilterOperator[];
-    /**
-     * A function for overriding the default rendering of the filter cell.
-     */
-    render?: (row: React.ReactElement<any>, dataItem: GridFilterCellProps) => React.ReactNode;
     /**
      * Accessible label of the filter.
      */
@@ -1956,7 +1899,9 @@ export declare interface GridGroupableSettings {
 /**
  * @hidden
  */
-export declare const GridGroupCell: (props: GridCellProps) => JSX.Element;
+export declare const GridGroupCell: (props: {
+    cellProps: GridCellProps;
+}) => JSX.Element | null;
 
 /**
  * Represents the object of the `onGroupChange` Grid event.
@@ -2039,6 +1984,11 @@ export declare interface GridHandle {
      * @param columnIds - Array of column ids to be fitted.
      */
     fitColumns: (columnIds: string[]) => void;
+    /**
+     * Method to trigger a PDF export of the Grid.
+     * The 'pdf' prop of the Grid should be set to true or object of setting that will be applied the exported Grid.
+     */
+    exportAsPdf: () => void;
 }
 
 /**
@@ -2075,17 +2025,13 @@ export declare interface GridHandle {
  * export default App;
  * ```
  */
-export declare const GridHeaderCell: (props: GridHeaderCellProps) => string | number | bigint | boolean | Iterable<React_2.ReactNode> | Promise<string | number | bigint | boolean | React_2.ReactPortal | React_2.ReactElement<unknown, string | React_2.JSXElementConstructor<any>> | Iterable<React_2.ReactNode> | null | undefined> | JSX.Element | null | undefined;
+export declare const GridHeaderCell: (props: GridHeaderCellProps) => JSX.Element;
 
 /**
  * The props of the GridHeaderCell component
  * ([more information]({% slug cells_grid %}#toc-header-cells)).
  */
 export declare interface GridHeaderCellProps extends Omit<HeaderCellBaseProps, 'render'> {
-    /**
-     * A function for overriding the default rendering of the header cell.
-     */
-    render?: (defaultRendering: React.ReactNode | null, props: GridHeaderCellProps) => React.ReactNode;
     /**
      * The props of the Grid column menu wrapper.
      */
@@ -2112,16 +2058,14 @@ export declare interface GridHeaderSelectionChangeEvent extends GridEvent {
      * The current Grid leaf data items.
      */
     dataItems: any[];
-    /**
-     * The `selectedField` prop of the Grid.
-     */
-    selectedField: string;
 }
 
 /**
  * @hidden
  */
-export declare const GridHierarchyCell: (props: GridCellProps) => JSX.Element;
+export declare const GridHierarchyCell: (props: {
+    cellProps: GridCellProps;
+}) => JSX.Element | null;
 
 /**
  * Represents the object of the `onItemChange` Grid event.
@@ -2163,12 +2107,20 @@ export declare const gridMessages: {
     "grid.groupPanelEmpty": string;
     "grid.filterApplyButton": string;
     "grid.filterClearButton": string;
+    "grid.filterClearAllButton": string;
     "grid.filterResetButton": string;
     "grid.filterSubmitButton": string;
     "grid.filterTitle": string;
     "grid.sortAscending": string;
     "grid.sortDescending": string;
+    "grid.sortClearButton": string;
+    "grid.sortApplyButton": string;
     "grid.sortAriaLabel": string;
+    "grid.adaptiveToolbarSortTitle": string;
+    "grid.toolbarSort": string;
+    "grid.toolbarFilter": string;
+    "grid.toolbarColumnsChooser": string;
+    "grid.toolbarCheckboxFilter": string;
     "grid.groupColumn": string;
     "grid.ungroupColumn": string;
     "grid.columnMenu": string;
@@ -2184,6 +2136,7 @@ export declare const gridMessages: {
     "grid.pagerTotalPages": string;
     "grid.searchPlaceholder": string;
     "grid.searchboxPlaceholder": string;
+    "grid.exportPDF": string;
     "grid.filterCheckAll": string;
     "grid.editDialogTitle": string;
     "grid.editDialogSaveButtonTitle": string;
@@ -2321,9 +2274,20 @@ export declare interface GridPagerSettings {
      */
     previousNext?: boolean;
     /**
-     * Defines if the pager will be responsive. Defaults to `true`.
+     * Defines if the pager will be responsive.
+     * If true, hides the tools that do not fit to the available space.
+     *
+     * @default `true`
      */
     responsive?: boolean;
+    /**
+     * Providing different rendering of the page sizes select element based on the screen dimensions.
+     */
+    adaptive?: boolean;
+    /**
+     * Specifies the text that is rendered as title in the adaptive page sizes select element.
+     */
+    adaptiveTitle?: string;
     /**
      * Defines if the pager will be navigatable.
      */
@@ -2349,6 +2313,14 @@ export declare interface GridPagerSettings {
  */
 declare type GridPagerType = 'numeric' | 'input';
 
+/**
+ * Represents the properties of the KendoReact GridPdfExportButton component.
+ */
+export declare const GridPdfExportButton: (props: GridPdfExportButtonProps) => JSX.Element;
+
+export declare interface GridPdfExportButtonProps extends ButtonProps {
+}
+
 /**
  * Represents the props of the [KendoReact Grid component]({% slug overview_grid %}).
  */
@@ -2661,8 +2633,12 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * - `info: Boolean`&mdash;Toggles the information about the current page and the total number of records.
      * - `type: PagerType`&mdash;Accepts the `numeric` (buttons with numbers) and `input` (input for typing the page number) values.
      * - `pageSizes: Boolean` or `Array<number>`&mdash;Shows a menu for selecting the page size.
+     * - `pageSizeValue: String or Number`&mdash;Sets the selected value of the page size Dropdownlist. It is useful when the selected value could also be a string not only a number.
      * - `previousNext: Boolean`&mdash;Toggles the **Previous** and **Next** buttons.
      * - `navigatable: Boolean`&mdash;Defines if the pager will be navigatable.
+     * - `responsive: Boolean`&mdash;Defines if the pager will be responsive. If true, hides the tools that do not fit to the available space.
+     * - `adaptive: Boolean`&mdash;Providing different rendering of the page sizes select element based on the screen dimensions.
+     * - `adaptiveTitle: String`&mdash;Specifies the text that is rendered as title in the adaptive page sizes select element.
      *
      * @example
      * ```jsx
@@ -2689,6 +2665,31 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     pager?: null | ComponentType<PagerProps>;
+    /**
+     * When set to true the Grid pdf export will be enabled.
+     * If set to an object, the Grid will use the provided settings to export the PDF.
+     *
+     * @example
+     * ```jsx
+     * <Grid pdf={true} />
+     * ```
+     */
+    pdf?: boolean | GridProps;
+    /**
+     * Fires when the user clicks the PDF export button.
+     *
+     * @example
+     * ```jsx
+     *
+     * <Grid onPdfExport={async (event) => {
+     *        const pdf = await import('@progress/kendo-react-pdf');
+     *        await pdf.saveGridPDF(event.target);
+     *  }} />
+     * ```
+     */
+    onPdfExport?: (event: {
+        target: HTMLDivElement;
+    }) => Promise<void>;
     /**
      * Alias for the `pageSize` property. If `take` is set, `pageSize` will be ignored.
      *
@@ -2806,24 +2807,6 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     onGroupExpandChange?: (event: GridGroupExpandChangeEvent) => void;
-    /**
-     * Fires when the user tries to expand or collapse a row.
-     *
-     * @deprecated This prop is deprecated in favor of the [onDetailExpandChange]({% slug api_grid_gridprops %}#toc-ondetailexpandchange) and [onGroupExpandChange]({% slug api_grid_gridprops %}#toc-ongroupexpandchange) props.
-     * We’re removing this prop in version 11.0.0.
-     * ```
-     */
-    onExpandChange?: (event: GridExpandChangeEvent) => void;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation of the expanded state of the item.
-     *
-     * Specifies the name of the field which will provide a Boolean representation of the expanded state of the item ([see example]({% slug detailrow_grid %})).
-     *
-     * @deprecated This prop is deprecated in favor of the ([detailExpand]({% slug api_grid_gridprops %}#toc-detailexpand)) and ([groupExpand]({% slug api_grid_gridprops %}#toc-groupexpand)) props.
-     * We’re removing this prop in version 11.0.0.
-     * ```
-     */
-    expandField?: string;
     /**
      * The [descriptor]({% slug api_data-tools_selectdescriptor %}) by which the selected state of an item is defined.
      * Passing a boolean value will select the whole row, while passing an array of strings will select individual.
@@ -2852,16 +2835,6 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     selectable?: boolean | GridSelectableSettings;
-    /**
-     * Specifies the name of the field which will provide a:
-     * - Boolean representation of the selected state of the item ([see example]({% slug selection_grid %})) for row selection
-     * - String array of the selected columns of the item  for cell selection
-     *
-     * @deprecated This prop is deprecated in favor of the ([select]({% slug api_grid_gridprops %}#toc-select)) prop.
-     * We’re removing this prop in version 11.0.0.
-     * ```
-     */
-    selectedField?: string;
     /**
      * Fires when the user tries to select or deselect a row or cell.
      *
@@ -2872,7 +2845,7 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      */
     onSelectionChange?: (event: GridSelectionChangeEvent) => void;
     /**
-     * Fires when the user clicks the checkbox of a column header whose `field` matches `selectedField`.
+     * Fires when the user clicks the checkbox of a column header whose type is set to `checkbox`.
      *
      * @example
      * ```jsx
@@ -2943,16 +2916,6 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     onEditChange?: (event: GridEditChangeEvent) => void;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation of the edit state
-     *  of the current item ([more information and examples]({% slug editing_inline_grid %})).
-     *
-     * @example
-     * ```jsx
-     * <Grid editField="inEdit" />
-     * ```
-     */
-    editField?: string;
     /**
      * Defines the scroll mode that is used by the Grid ([see example]({% slug scrollmodes_grid %})).
      *
@@ -3102,30 +3065,6 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     onColumnReorder?: (event: GridColumnReorderEvent) => void;
-    /**
-     * Fires when a row is about to be rendered. Overrides the default appearance of the row.
-     *
-     * @deprecated This prop is deprecated in favor of the ([rows]({% slug api_grid_gridprops %}#toc-rows)) prop. We’re removing this prop in version 11.0.0.
-     */
-    rowRender?: (row: React.ReactElement<HTMLTableRowElement>, props: GridRowProps) => React.ReactNode;
-    /**
-     * Fires when a cell is about to be rendered. Used to override the default appearance of the cell ([see example]({% slug groupingaggregates_grid %})).
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     */
-    cellRender?: (defaultRendering: React.ReactElement<HTMLTableCellElement> | null, props: GridCellProps) => React.ReactElement<HTMLTableCellElement> | React.ReactElement<HTMLTableCellElement>[] | null;
-    /**
-     * Fires when a filter cell is about to be rendered. Overrides the default appearance of the filter cell.
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     */
-    filterCellRender?: (defaultRendering: React.ReactElement<any> | null, props: GridFilterCellProps) => React.ReactElement<any> | null;
-    /**
-     * Fires when a header cell is about to be rendered. Overrides the default appearance of the header cell.
-     *
-     * @deprecated This prop is deprecated in favor of the ([cells]({% slug api_grid_gridprops %}#toc-cells)) prop. We’re removing this prop in version 11.0.0.
-     */
-    headerCellRender?: (defaultRendering: React.ReactNode | null, props: GridHeaderCellProps) => React.ReactNode;
     /**
      * Fires when Grid is scrolled. Only fired when the Grid is run as a client component.
      *
@@ -3172,15 +3111,6 @@ export declare interface GridProps extends KendoReactComponentBaseProps {
      * ```
      */
     onKeyDown?: (event: GridKeyDownEvent) => void;
-    /**
-     * The accessible label of the Grid.
-     */
-    /**
-     * **Deprecated**. The accessible label of the Grid. Use ([messages]({% slug globalization_grid %})) instead.
-     *
-     * @deprecated
-     */
-    ariaLabel?: string;
     /**
      * Defines if the group descriptor columns are locked (frozen or sticky).
      * Locked columns are the columns that are visible at all times while the user scrolls the component horizontally.
@@ -3303,7 +3233,7 @@ export declare type GridReorderDropPosition = 'before' | 'after' | 'forbidden';
 /**
  * The component for each of the items in the `data` property which the Grid renders.
  */
-export declare const GridRow: (props: GridRowProps) => string | number | bigint | boolean | Iterable<React_2.ReactNode> | Promise<string | number | bigint | boolean | React_2.ReactPortal | React_2.ReactElement<unknown, string | React_2.JSXElementConstructor<any>> | Iterable<React_2.ReactNode> | null | undefined> | JSX.Element | null | undefined;
+export declare const GridRow: (props: GridRowProps) => JSX.Element;
 
 /**
  * Represents the object of the `onRowClick` Grid event.
@@ -3326,7 +3256,7 @@ export declare interface GridRowDoubleClickEvent extends GridEvent {
 }
 
 /**
- * The props that the Grid passes to the GridRow component when creating it. Accessible during the `rowRender` callback of the Grid.
+ * The props that the Grid passes to the GridRow component when creating it. Accessible when passing a custom row to the `rows` prop of the Grid.
  */
 export declare interface GridRowProps extends KendoReactComponentBaseProps {
     /**
@@ -3353,10 +3283,6 @@ export declare interface GridRowProps extends KendoReactComponentBaseProps {
      * The event that is fired when the row is double clicked.
      */
     onDoubleClick: any;
-    /**
-     * The name of the field which will provide a Boolean representation of the selected state of the item.
-     */
-    selectedField?: string;
     /**
      * Sets the height of the row.
      */
@@ -3365,10 +3291,6 @@ export declare interface GridRowProps extends KendoReactComponentBaseProps {
      * The type of the row.
      */
     rowType: GridRowType;
-    /**
-     * A function for overriding the default rendering of the row.
-     */
-    render?: (row: React.ReactElement<HTMLTableRowElement>, props: GridRowProps) => React.ReactNode;
     /**
      * Sets a set of rows components that the Grid will render instead of the built-in row.
      */
@@ -3522,7 +3444,9 @@ export declare interface GridSelectableSettings extends TableSelectableSettings
 /**
  * @hidden
  */
-export declare const GridSelectionCell: (props: GridCellProps) => JSX.Element;
+export declare const GridSelectionCell: (props: {
+    cellProps: GridCellProps;
+}) => JSX.Element | null;
 
 /**
  * Represents the object of the `onSelectionChange` Grid event.
@@ -3613,37 +3537,254 @@ export declare const GridToolbar: {
 };
 
 /**
- * The properties of the GridToolbar component.
+ * Represents the GridToolbarCheckboxFilter component.
  */
-export declare interface GridToolbarProps {
+export declare const GridToolbarCheckboxFilter: {
+    (props: GridToolbarCheckboxFilterProps): JSX.Element;
+    displayName: string;
+};
+
+export declare interface GridToolbarCheckboxFilterProps {
     /**
-     * The React elements that will be rendered inside the toolbar of the Grid.
+     * Sets the items collection that will be rendered by the GridToolbarCheckboxFilter component.
      */
-    children?: React.ReactNode;
+    data: Array<string | object>;
     /**
-     * Specifies the name of the CSS class which is set to the GridToolbar.
+     * Defines the icon rendered in the GridToolbarCheckboxFilter tool ([see example]({% slug overview_icon %})).
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarCheckboxFilter icon="home" />
+     * ```
      */
-    className?: string;
+    icon?: string;
     /**
-     * Configures the `size` of the Toolbar.
+     * Defines the SVG icon rendered in the GridToolbarCheckboxFilter tool ([see example]({% slug overview_svgicon %})).
      *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null&mdash;Does not set a size `className`.
+     * @example
+     * ```jsx
+     * import { gearIcon } from '@progress/kendo-svg-icons';
      *
-     * @default `medium`
+     * <GridToolbarCheckboxFilter svgIcon={gearIcon} />
+     * ```
      */
-    size?: null | 'small' | 'medium' | 'large';
+    svgIcon?: SVGIcon;
     /**
-     * The accessible label of the GridToolbar component.
+     * Defines the component that will be rendered as a search box.
+     *
      */
-    ariaLabel?: string;
+    searchBox?: React_2.ComponentType<any>;
+    /**
+     * Defines the filter operator that will be used to filter the values via the search box.
+     * "startswith"
+     * "endswith"
+     * "contains"
+     * "doesnotcontain"
+     * "isempty"
+     * "isnotempty"
+     * "eq" (equal to)
+     * "eq" (equal to)
+     * "neq" (not equal to)
+     * "isnull" (is equal to null)
+     * "isnotnull" (is not equal to null)
+     */
+    searchBoxFilterOperator?: string | Function;
+    /**
+     * Determines if the data in the component will be unique. By default the property is set to true.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarCheckboxFilter uniqueData={true} />
+     * ```
+     */
+    uniqueData?: boolean;
+    /**
+     * Specifies if the popup will be displayed.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarCheckboxFilter show={true} />
+     * ```
+     */
+    show?: boolean;
+    /**
+     * The method that will be called to close the column menu.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarCheckboxFilter onCloseMenu={() => console.log('close menu');} />
+     * ```
+     */
+    onCloseMenu?: Function;
+}
+
+/**
+ * Represents the GridToolbarColumnsChooser component.
+ */
+export declare const GridToolbarColumnsChooser: {
+    (props: GridToolbarColumnsChooserProps): JSX.Element;
+    displayName: string;
+};
+
+export declare interface GridToolbarColumnsChooserProps {
+    /**
+     * Defines the icon rendered in the GridToolbarSort tool ([see example]({% slug overview_icon %})).
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarSort icon="home" />
+     * ```
+     */
+    icon?: string;
+    /**
+     * Defines the SVG icon rendered in the GridToolbarSort tool ([see example]({% slug overview_svgicon %})).
+     *
+     * @example
+     * ```jsx
+     * import { gearIcon } from '@progress/kendo-svg-icons';
+     *
+     * <GridToolbarSort svgIcon={gearIcon} />
+     * ```
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Specifies if the popup will be displayed.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarColumnsChooser show={true} />
+     * ```
+     */
+    show?: boolean;
+    /**
+     * The method that will be called to close the column menu.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarColumnsChooser onCloseMenu={() => console.log('close menu');} />
+     */
+    onCloseMenu?: Function;
+}
+
+/**
+ * Represents the GridToolbarFilter component.
+ */
+export declare const GridToolbarFilter: {
+    (props: GridToolbarFilterProps): JSX.Element;
+    displayName: string;
+};
+
+export declare interface GridToolbarFilterProps {
+    /**
+     * Defines the icon rendered in the GridToolbarFilter tool ([see example]({% slug overview_icon %})).
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarFilter icon="home" />
+     * ```
+     */
+    icon?: string;
+    /**
+     * Defines the SVG icon rendered in the GridToolbarFilter tool ([see example]({% slug overview_svgicon %})).
+     *
+     * @example
+     * ```jsx
+     * import { gearIcon } from '@progress/kendo-svg-icons';
+     *
+     * <GridToolbarFilter svgIcon={gearIcon} />
+     * ```
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * If set to `false`, the second filter operator and the input will be hidden.
+     */
+    hideSecondFilter?: boolean;
+    /**
+     * Specifies a React element that will be cloned and rendered inside the UI of the column-menu filter component
+     * ([see example]({% slug column_menu_grid %}#toc-customizing-the-filter-component)).
+     */
+    filterUI?: ComponentType<GridColumnMenuFilterUIProps>;
+    /**
+     * Specifies if the popup will be displayed.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarFilter show={true} />
+     * ```
+     */
+    show?: boolean;
+    /**
+     * The method that will be called to close the column menu.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarFilter onCloseMenu={() => console.log('close menu');} />
+     * ```
+     */
+    onCloseMenu?: Function;
+    /**
+     * The method that will be called to notify the parent Grid about a filter change.
+     */
+    onFilterChange?: (filter: CompositeFilterDescriptor | null, syntheticEvent: React_2.SyntheticEvent<any>) => any;
+}
+
+/**
+ * The properties of the GridToolbar component.
+ */
+export declare interface GridToolbarProps extends ToolbarProps {
     /**
      * @hidden
      */
-    ariaControls?: string;
+    _ariaControls?: string;
+}
+
+/**
+ * Represents the GridToolbarSort component.
+ */
+export declare const GridToolbarSort: {
+    (props: GridToolbarSortProps): any;
+    displayName: string;
+};
+
+export declare interface GridToolbarSortProps {
+    /**
+     * Defines the icon rendered in the GridToolbarSort tool ([see example]({% slug overview_icon %})).
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarSort icon="home" />
+     * ```
+     */
+    icon?: string;
+    /**
+     * Defines the SVG icon rendered in the GridToolbarSort tool ([see example]({% slug overview_svgicon %})).
+     *
+     * @example
+     * ```jsx
+     * import { gearIcon } from '@progress/kendo-svg-icons';
+     *
+     * <GridToolbarSort svgIcon={gearIcon} />
+     * ```
+     */
+    svgIcon?: SVGIcon_2;
+    /**
+     * Specifies if the popup will be displayed.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarSort show={true} />
+     * ```
+     */
+    show?: boolean;
+    /**
+     * The method that will be called to close the column menu.
+     *
+     * @example
+     * ```jsx
+     * <GridToolbarSort onCloseMenu={() => console.log('close menu');} />
+     * ```
+     */
+    onCloseMenu?: Function;
 }
 
 /**
@@ -3744,9 +3885,9 @@ export declare interface StatusBarProps {
 /**
  * Represents the arguments of the getStatusData function.
  */
-export declare type StatusDataArgs = Pick<GridSelectionChangeEvent, 'dataItems' | 'target' | 'selectedField'> | (Pick<GridSelectionChangeEvent, 'dataItems' | 'target' | 'select'> & {
+export declare type StatusDataArgs = Pick<GridSelectionChangeEvent, 'dataItems' | 'target' | 'select'> & {
     dataItemKey: Required<GridProps>['dataItemKey'];
-});
+};
 
 /**
  * Represents the KendoReact Grid's StatusItem object.