@progress/kendo-react-grid 7.2.4-develop.3 → 7.3.0-develop.1

package/index.d.mts

@@ -1,5 +1,2777 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
-export * from './index';
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { BaseEvent } from '@progress/kendo-react-common';
+import { CellProps } from '@progress/kendo-react-data-tools';
+import { ClipboardDataEvent } from '@progress/kendo-react-data-tools';
+import { ClipboardSettings } from '@progress/kendo-react-data-tools';
+import { ColumnBaseProps } from '@progress/kendo-react-data-tools';
+import { ColumnSortSettings } from '@progress/kendo-react-data-tools';
+import { ComponentType } from 'react';
+import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
+import { DataResult } from '@progress/kendo-data-query';
+import { DragClue } from '@progress/kendo-react-data-tools';
+import { DropClue } from '@progress/kendo-react-data-tools';
+import { FilterOperator } from '@progress/kendo-react-data-tools';
+import { ForwardRefExoticComponent } from 'react';
+import { getSelectedState } from '@progress/kendo-react-data-tools';
+import { getSelectedStateFromKeyDown } from '@progress/kendo-react-data-tools';
+import { GroupDescriptor } from '@progress/kendo-data-query';
+import { HeaderCellBaseProps } from '@progress/kendo-react-data-tools';
+import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { KendoReactComponentBaseProps } from '@progress/kendo-react-common';
+import { PagerProps } from '@progress/kendo-react-data-tools';
+import { PagerTargetEvent } from '@progress/kendo-react-data-tools';
+import PropTypes from 'prop-types';
+import * as React_2 from 'react';
+import { ReactElement } from 'react';
+import { RefAttributes } from 'react';
+import { setSelectedState } from '@progress/kendo-react-data-tools';
+import { SortDescriptor } from '@progress/kendo-data-query';
+import { SortSettings } from '@progress/kendo-react-data-tools';
+import { State } from '@progress/kendo-data-query';
+import { SVGIcon } from '@progress/kendo-react-common';
+import { TABLE_COL_INDEX_ATTRIBUTE } from '@progress/kendo-react-data-tools';
+import { TableDragSelectionReleaseEvent } from '@progress/kendo-react-data-tools';
+import { TableKeyboardNavigationContextType } from '@progress/kendo-react-data-tools';
+import { TableKeyDownEvent } from '@progress/kendo-react-data-tools';
+import { TableSelectableMode } from '@progress/kendo-react-data-tools';
+import { TableSelectableSettings } from '@progress/kendo-react-data-tools';
+import { TableSelectionChangeEvent } from '@progress/kendo-react-data-tools';
+
+/**
+ * The value of the filter operators displayed in the boolean filter menu.
+ */
+export declare const booleanFilterValues: ({
+    text: string;
+    operator: string;
+} | {
+    text: string;
+    operator: boolean;
+})[];
+
+/**
+ * Normalize data for calling onChange.
+ */
+export declare const cellBoolDropdownChange: (event: any, onChange: Function) => void;
+
+/**
+ * Normalize data for calling onChange.
+ */
+export declare const cellInputChange: (value: any, e: React_2.SyntheticEvent<any>, props: any) => void;
+
+/**
+ * Normalize data for calling onChange.
+ */
+export declare const cellOperatorChange: (event: any, currentValue: any, onChange: Function) => void;
+
+/**
+ * @hidden
+ */
+declare interface ColumnMenuStateProps {
+    show: boolean;
+}
+
+/**
+ * @hidden
+ */
+declare interface ExtendedColumnProps extends GridColumnProps {
+    declarationIndex: number;
+    parentIndex: number;
+    colSpan: number;
+    rowSpan: number;
+    depth: number;
+    kFirst?: boolean;
+    index: number;
+    children: ExtendedColumnProps[];
+    left: number;
+    right: number;
+    rightBorder: boolean;
+    ariaColumnIndex: number;
+    isAccessible: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare const filterGroupByField: (field: string, filter: CompositeFilterDescriptor | undefined) => CompositeFilterDescriptor | null;
+
+export { getSelectedState }
+
+export { getSelectedStateFromKeyDown }
+
+/**
+ * Calculates the status data.
+ *
+ * @param args StatusDataArgs
+ * @returns StatusItem[]
+ */
+export declare const getStatusData: (args: StatusDataArgs) => StatusItem[];
+
+/** @hidden */
+export declare const Grid: ForwardRefExoticComponent<GridProps & RefAttributes<any>>;
+
+/** The attribute required by the Grid selection on Grid `td` elements. */
+export declare const GRID_COL_INDEX_ATTRIBUTE = "data-grid-col-index";
+
+/** Attribute which disable selection start from this element. */
+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_2.Element | null;
+
+/**
+ * Represents the props of the GridCell component
+ * ([more information]({% slug cells_grid %}#toc-grid-cells)).
+ */
+export declare interface GridCellProps extends Omit<CellProps, 'onChange' | 'render'> {
+    /**
+     * Zero-based index of the dataItem.
+     */
+    dataIndex: number;
+    /**
+     * The index of the column in the rendered columns collection.
+     */
+    columnIndex?: number;
+    /**
+     * The number of rendered columns in the Grid.
+     */
+    columnsCount?: number;
+    /**
+     * Sets a set of cells components that the Grid will render instead of the built-in cell.
+     */
+    cells?: GridCellsSettings;
+    /**
+     * The type of the row.
+     */
+    rowType?: GridRowType;
+    /**
+     * @hidden
+     */
+    level?: number;
+    /**
+     * The event that is fired when the cell is selected.
+     */
+    selectionChange?: (event: {
+        syntheticEvent: React.SyntheticEvent<any>;
+    }) => void;
+    /**
+     * The event that is fired when the cell value is changed.
+     */
+    onChange?: (event: {
+        dataItem: any;
+        dataIndex: number;
+        syntheticEvent: React.SyntheticEvent<any>;
+        field?: string;
+        value?: any;
+    }) => void;
+    /**
+     * The type of the editor which will be used when the cell is in edit mode.
+     */
+    editor?: 'text' | 'numeric' | 'boolean' | 'date';
+    /**
+     * A function for overriding the default rendering of the cell.
+     */
+    render?: (defaultRendering: React.ReactElement<HTMLTableCellElement> | null, props: GridCellProps) => React.ReactElement<HTMLTableCellElement> | null;
+    /**
+     * @hidden
+     */
+    locked?: boolean | undefined;
+    /**
+     * The event that is fired when the ContextMenu is activated.
+     */
+    onContextMenu?: (event: React.MouseEvent<HTMLElement>, dataItem: any, field?: string) => void;
+    /**
+     * @hidden
+     */
+    isRtl?: boolean;
+}
+
+/**
+ * The settings of the cells prop options.
+ */
+export declare interface GridCellsSettings {
+    headerCell?: ComponentType<GridCustomHeaderCellProps>;
+    filterCell?: ComponentType<GridCustomFilterCellProps>;
+    footerCell?: ComponentType<GridCustomFooterCellProps>;
+    groupHeader?: ComponentType<GridCustomCellProps>;
+    data?: ComponentType<GridCustomCellProps>;
+    groupFooter?: ComponentType<GridCustomCellProps>;
+    select?: {
+        groupHeader?: ComponentType<GridCustomCellProps>;
+        data?: ComponentType<GridCustomCellProps>;
+        groupFooter?: ComponentType<GridCustomCellProps>;
+    };
+    hierarchy?: {
+        groupHeader?: ComponentType<GridCustomCellProps>;
+        data?: ComponentType<GridCustomCellProps>;
+        groupFooter?: ComponentType<GridCustomCellProps>;
+    };
+    group?: {
+        groupHeader?: ComponentType<GridCustomCellProps>;
+        data?: ComponentType<GridCustomCellProps>;
+        groupFooter?: ComponentType<GridCustomCellProps>;
+    };
+    edit?: {
+        text?: ComponentType<GridCustomCellProps>;
+        numeric?: ComponentType<GridCustomCellProps>;
+        boolean?: ComponentType<GridCustomCellProps>;
+        date?: ComponentType<GridCustomCellProps>;
+    };
+}
+
+/**
+ * Represents the [KendoReact Grid component]({% slug overview_grid %}).
+ *
+ * @example
+ * ```jsx
+ * class App extends React.Component {
+ *    constructor(props) {
+ *        super(props);
+ *        this.state = {
+ *            data: [
+ *                { 'foo': 'A1', 'bar': 'B1' },
+ *                { 'foo': 'A2', 'bar': 'B2' },
+ *                { 'foo': 'A3', 'bar': 'B2' }
+ *            ]
+ *        };
+ *    }
+ *    render() {
+ *        return (
+ *            <Grid
+ *                data={this.state.data}
+ *                reorderable={true}
+ *            >
+ *                <GridColumn field="foo" />
+ *                <GridColumn field="bar" />
+ *            </Grid>
+ *        );
+ *    }
+ * }
+ * ReactDOM.render(<App />, document.querySelector('my-app'));
+ * ```
+ */
+export declare class GridClassComponent extends React_2.Component<GridProps> {
+    /**
+     * @hidden
+     */
+    static displayName: string;
+    /**
+     * @hidden
+     */
+    static defaultProps: {};
+    /**
+     * @hidden
+     */
+    static propTypes: {
+        data: PropTypes.Requireable<NonNullable<any[] | PropTypes.InferProps<{
+            data: PropTypes.Requireable<any[]>;
+            total: PropTypes.Requireable<number>;
+        }> | null | undefined>>;
+        sortable: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
+            mode: PropTypes.Requireable<string>;
+            allowUnsort: PropTypes.Requireable<boolean>;
+        }> | null | undefined>>;
+        onSortChange: PropTypes.Requireable<(...args: any[]) => any>;
+        sort: PropTypes.Requireable<any[]>;
+        filterable: PropTypes.Requireable<boolean>;
+        filter: PropTypes.Requireable<any>;
+        onFilterChange: PropTypes.Requireable<(...args: any[]) => any>;
+        pageable: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
+            buttonCount: PropTypes.Requireable<number>;
+            responsive: PropTypes.Requireable<boolean>;
+            info: PropTypes.Requireable<boolean>;
+            type: PropTypes.Requireable<string>;
+            pageSizes: PropTypes.Requireable<NonNullable<boolean | (NonNullable<string | number | null | undefined> | null | undefined)[] | null | undefined>>;
+            previousNext: PropTypes.Requireable<boolean>;
+        }> | null | undefined>>;
+        pageSize: PropTypes.Requireable<number>;
+        onPageChange: PropTypes.Requireable<(...args: any[]) => any>;
+        total: PropTypes.Requireable<number>;
+        skip: PropTypes.Requireable<number>;
+        take: PropTypes.Requireable<number>;
+        fixedScroll: PropTypes.Requireable<boolean>;
+        onExpandChange: PropTypes.Requireable<(...args: any[]) => any>;
+        expandField: PropTypes.Requireable<string>;
+        selectedField: PropTypes.Requireable<string>;
+        onSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onHeaderSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
+        resizable: PropTypes.Requireable<boolean>;
+        reorderable: PropTypes.Requireable<boolean>;
+        group: PropTypes.Requireable<any>;
+        groupable: PropTypes.Requireable<NonNullable<boolean | PropTypes.InferProps<{
+            enabled: PropTypes.Requireable<boolean>;
+            footer: PropTypes.Requireable<string>;
+        }> | null | undefined>>;
+        onGroupChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onRowClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onRowDoubleClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onItemChange: PropTypes.Requireable<(...args: any[]) => any>;
+        editField: PropTypes.Requireable<string>;
+        scrollable: PropTypes.Requireable<string>;
+        rowHeight: PropTypes.Requireable<number>;
+        detailRowHeight: PropTypes.Requireable<number>;
+        detail: PropTypes.Requireable<any>;
+        style: PropTypes.Requireable<object>;
+        onDataStateChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onColumnResize: PropTypes.Requireable<(...args: any[]) => any>;
+        onColumnReorder: PropTypes.Requireable<(...args: any[]) => any>;
+        dataItemKey: PropTypes.Requireable<string>;
+        navigatable: PropTypes.Requireable<boolean>;
+        size: PropTypes.Requireable<string>;
+    };
+    /** @hidden */
+    static contextType: React_2.Context<TableKeyboardNavigationContextType | undefined>;
+    protected dragLogic: GridCommonDragLogic;
+    private _columns;
+    private _columnsMap;
+    private _columnsMutations;
+    private _resized;
+    private _shouldUpdateLeftRight;
+    private contextStateRef;
+    private navigationStateRef;
+    private _data;
+    private _slicedData;
+    private wrapperScrollTop;
+    private showLicenseWatermark;
+    /**
+     * A getter of the current columns. Gets the current column width or current columns, or any other [`GridColumnProps`]({% slug api_grid_gridcolumnprops %}) for each defined column. Can be used on each Grid instance. To obtain the instance of the rendered Grid, use the `ref` callback. The following example demonstrates how to reorder the columns by dragging their handlers and check the properties afterwards. You can check the result in the browser console.
+     *
+     * @example
+     * ```jsx
+     * class App extends React.Component {
+     *     constructor(props) {
+     *         super(props);
+     *         this.state = {
+     *             data: [
+     *                 { 'foo': 'A1', 'bar': 'B1' },
+     *                 { 'foo': 'A2', 'bar': 'B2' },
+     *                 { 'foo': 'A3', 'bar': 'B2' }
+     *             ]
+     *         };
+     *         this.grid = null;
+     *     }
+     *     render() {
+     *         return (
+     *             <div>
+     *                 <Grid
+     *                     data={this.state.data}
+     *                     reorderable={true}
+     *                     ref={(g) => { this.grid = g; }}
+     *                 >
+     *                     <GridColumn field="foo" />
+     *                     <GridColumn field="bar" />
+     *                 </Grid>
+     *                 <button onClick={() => console.log(JSON.stringify(this.grid.columns))}>
+     *                     log current properties into browser console.
+     *                 </button>
+     *             </div>
+     *         );
+     *     }
+     * }
+     * ReactDOM.render(<App />, document.querySelector('my-app'));
+     * ```
+     */
+    get columns(): GridColumnProps[];
+    /**
+     * Returns the HTML element of the Grid component.
+     */
+    get element(): HTMLDivElement | null;
+    private get document();
+    private clipboardService?;
+    private headerRef;
+    private headerElementRef;
+    private _element;
+    private tableElement;
+    private containerRef;
+    private tableBodyRef;
+    private vs;
+    private columnResize;
+    private _footer;
+    private forceUpdateTimeout;
+    private isRtl;
+    private rowIndex;
+    private get _header();
+    private get _gridId();
+    private observer;
+    constructor(props: GridProps);
+    private handleIntersection;
+    private setCurrentOnTop;
+    /**
+     * Method to allow the scroll to be set to a specific row index when the Grid is scrollable. It is zero based.
+     *
+     * @param options - Object, containing the rowIndex to which is going to be scrolled.
+     */
+    scrollIntoView: (options: {
+        rowIndex: number;
+    }) => void;
+    /**
+     * Method to fit columns according to their content.
+     *
+     * @param columnIds - Array of column ids to be fitted.
+     */
+    fitColumns: (columnIds: string[]) => void;
+    /**
+     * @hidden
+     */
+    componentDidMount(): void;
+    /**
+     * @hidden
+     */
+    getSnapshotBeforeUpdate(): null;
+    /**
+     * @hidden
+     */
+    componentDidUpdate(): void;
+    /**
+     * @hidden
+     */
+    componentWillUnmount(): void;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+    private onContextMenu;
+    private getVirtualScroll;
+    private isAllData;
+    private initializeVirtualization;
+    private scrollHandler;
+    private onKeyDown;
+    private onFocus;
+    private onNavigationAction;
+    private rowClick;
+    private rowDblClick;
+    private itemChange;
+    private selectionChange;
+    private onHeaderSelectionChange;
+    private selectionRelease;
+    private pageChange;
+    private pagerPageChange;
+    private sortChange;
+    private filterChange;
+    private groupChange;
+    private raiseDataEvent;
+    private columnReorder;
+    private groupReorder;
+    private columnToGroup;
+    private resetTableWidth;
+    private onClipboard;
+    private inActiveElement;
+    private onResize;
+    private reInitVirtualization;
+    private flatData;
+    private rowHeightService;
+    private childrenToArray;
+    private readColumns;
+    private mapColumns;
+    private initColumns;
+    private configureColumns;
+    private getHeaderRow;
+    private resolveTitle;
+    private getDataState;
+    private getArguments;
+    private getLeafDataItems;
+}
+
+/**
+ * @hidden
+ */
+export declare const GridColumn: React_2.FunctionComponent<GridColumnProps>;
+
+/**
+ * @hidden
+ */
+declare interface GridColumnMenuBaseProps {
+    /**
+     * The current column options.
+     */
+    column: GridColumnMenuColumnProps;
+    /**
+     * The method that will be called to close the column menu.
+     */
+    onCloseMenu?: Function;
+}
+
+export declare class GridColumnMenuCheckboxFilter extends React_2.Component<GridColumnMenuCheckboxFilterProps, GridColumnMenuFilterStateProps_2> {
+    /**
+     * @hidden
+     */
+    static defaultProps: {
+        uniqueData: boolean;
+    };
+    /**
+     * @hidden
+     */
+    compositeFilterIndex: number;
+    constructor(props: GridColumnMenuCheckboxFilterProps);
+    /**
+     * @hidden
+     */
+    componentDidUpdate(): void;
+    /**
+     * @hidden
+     */
+    defaultFilter: () => any;
+    /**
+     * @hidden
+     */
+    isControlled: () => boolean;
+    /**
+     * @hidden
+     */
+    parseData: (originalData: any, isUnique: any) => any;
+    /**
+     * @hidden
+     */
+    getFilterIndex: () => any;
+    /**
+     * @hidden
+     */
+    onFilterExpand: () => void;
+    /**
+     * @hidden
+     */
+    handleSearchChange: (e: any) => void;
+    /**
+     * @hidden
+     */
+    handleClear: () => void;
+    /**
+     * @hidden
+     */
+    clear: (e: React_2.SyntheticEvent<any>) => void;
+    /**
+     * @hidden
+     */
+    submit: (e: React_2.SyntheticEvent<any>) => void;
+    /**
+     * @hidden
+     */
+    handleCheckBoxChange: (e: any, value: any) => void;
+    /**
+     * @hidden
+     */
+    isAllSelected: () => boolean;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props of the GridColumnMenuFilter component.
+ */
+export declare interface GridColumnMenuCheckboxFilterProps extends GridColumnMenuFilterBaseProps {
+    /**
+     * Controls the expand state of the filter component.
+     */
+    expanded?: boolean;
+    /**
+     * Sets the items collection that will be rendered by the GridColumnMenuCheckboxFilter component.
+     */
+    data: Array<string | object>;
+    /**
+     * Triggered on each subsequent expand state of the filter component.
+     */
+    onExpandChange?: (nextExpandState: boolean) => void;
+    /**
+     * Defines the component that will be rendered as a search box.
+     */
+    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.
+     */
+    uniqueData?: boolean;
+}
+
+/**
+ * The column props passed by the ColumnMenu.
+ */
+declare interface GridColumnMenuColumnProps {
+    /**
+     * The field to which the column is bound.
+     */
+    field?: string;
+    /**
+     * Defines the filter type that is displayed inside the filter row. Defaults to `text`.
+     */
+    filter?: 'text' | 'numeric' | 'boolean' | 'date';
+    /**
+     * The column locked state.
+     */
+    locked?: boolean;
+    /**
+     * @hidden
+     */
+    title?: string;
+    /**
+     * The column id.
+     */
+    id?: string;
+}
+
+/**
+ * Represents the KendoReact GridColumnMenuColumnsList component.
+ */
+export declare const GridColumnMenuColumnsList: React_2.FunctionComponent<GridColumnMenuColumnsListProps>;
+
+/**
+ * Represents the props of the KendoReact GridColumnMenuColumnsList component.
+ */
+export declare interface GridColumnMenuColumnsListProps {
+    /**
+     * The columns state of the KendoReact GridColumnMenuColumnsList component.
+     */
+    columnsState: GridColumnProps[];
+    /**
+     * The initial columns of the KendoReact GridColumnMenuColumnsList component.
+     */
+    columns: GridColumnProps[];
+    /**
+     * The onColumnsChange event handler of the KendoReact GridColumnMenuColumnsList component.
+     */
+    onColumnsChange: (cols: GridColumnProps[]) => void;
+    /**
+     * The onCloseMenu event handler of the KendoReact GridColumnMenuColumnsList component.
+     */
+    onCloseMenu: Function;
+}
+
+/**
+ * @example
+ * ```jsx-no-run
+ * class TextColumnMenu extends React.Component {
+ *     render() {
+ *         return (
+ *         <div>
+ *             <GridColumnMenuSort {...this.props} />
+ *             <GridColumnMenuFilter {...this.props} />
+ *         </div>);
+ *     }
+ * }
+ *
+ * class App extends React.PureComponent {
+ *     constructor(props) {
+ *         super(props);
+ *
+ *         this.state = this.createAppState({
+ *             take: 10,
+ *             skip: 0
+ *         });
+ *     }
+ *
+ *     createAppState(dataState) {
+ *         return {
+ *             result: process(products.slice(0), dataState),
+ *             dataState: dataState
+ *         };
+ *     }
+ *
+ *     dataStateChange = (event) => {
+ *         this.setState(this.createAppState(event.dataState));
+ *     }
+ *
+ *     render() {
+ *         return (
+ *             <div>
+ *                 <Grid
+ *                     data={this.state.result}
+ *                     {...this.state.dataState}
+ *                     onDataStateChange={this.dataStateChange}
+ *                     sortable={true}
+ *                     pageable={true}
+ *                 >
+ *                     <Column field="ProductID" title="Product ID" />
+ *                     <Column field="ProductName" columnMenu={TextColumnMenu} />
+ *                 </Grid>
+ *                 <br />
+ *             </div>
+ *         );
+ *     }
+ * }
+ *
+ * ReactDOM.render(<App />, document.querySelector('my-app'));
+ * ```
+ */
+export declare class GridColumnMenuFilter extends React_2.Component<GridColumnMenuFilterProps, GridColumnMenuFilterStateProps> {
+    /**
+     * Can be used to check if filtering is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active filter indicators.
+     */
+    static active: (field: string, filter?: CompositeFilterDescriptor) => boolean;
+    constructor(props: GridColumnMenuFilterProps);
+    /**
+     * @hidden
+     */
+    removeGroup: (group: CompositeFilterDescriptor, rootFilter: CompositeFilterDescriptor) => CompositeFilterDescriptor;
+    /**
+     * @hidden
+     */
+    insertGroup: (group: CompositeFilterDescriptor, rootFilter: CompositeFilterDescriptor) => CompositeFilterDescriptor;
+    /**
+     * @hidden
+     */
+    isControlled: () => boolean;
+    /**
+     * @hidden
+     */
+    onFilterExpand: () => void;
+    /**
+     * @hidden
+     */
+    firstFilterChange: (event: any) => void;
+    /**
+     * @hidden
+     */
+    secondFilterChange: (event: any) => void;
+    /**
+     * @hidden
+     */
+    filterChange: (filterIndex: number, e: {
+        value: number;
+        operator: string;
+    }) => void;
+    /**
+     * @hidden
+     */
+    logicChange: (event: any) => void;
+    /**
+     * @hidden
+     */
+    clear: (event: React_2.SyntheticEvent<any>) => void;
+    /**
+     * @hidden
+     */
+    currentFilterGroup: () => CompositeFilterDescriptor;
+    /**
+     * @hidden
+     */
+    submit: (event: React_2.SyntheticEvent<any>) => void;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props passed to the ColumnMenu filter component.
+ */
+declare interface GridColumnMenuFilterBaseProps extends GridColumnMenuBaseProps {
+    /**
+     * The current filter state of the Grid.
+     */
+    filter?: CompositeFilterDescriptor;
+    /**
+     * The filterable option of the column.
+     */
+    filterable?: boolean | undefined;
+    /**
+     * The filter operators for the Grid filters.
+     */
+    filterOperators: GridFilterOperators;
+    /**
+     * The method that will be called to notify the parent Grid about a filter change.
+     */
+    onFilterChange?: (filter: CompositeFilterDescriptor | null, syntheticEvent: React.SyntheticEvent<any>) => any;
+}
+
+/**
+ * @hidden
+ */
+export declare class GridColumnMenuFilterCell extends React_2.Component<GridColumnMenuFilterCellProps, {}> {
+    constructor(props: GridColumnMenuFilterCellProps);
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+    private renderOperatorEditor;
+    private inputChange;
+    private operatorChange;
+    private boolDropdownChange;
+    private filterComponent;
+}
+
+/**
+ * @hidden
+ */
+export declare interface GridColumnMenuFilterCellProps {
+    field?: string;
+    filterType: 'text' | 'numeric' | 'boolean' | 'date';
+    value: any;
+    operator?: string | Function;
+    operators: GridFilterOperator[];
+    booleanValues: GridFilterOperator[];
+    onChange: (event: {
+        value: any;
+        operator: string | Function;
+        syntheticEvent: React_2.SyntheticEvent<any>;
+    }) => void;
+}
+
+/**
+ * The props of the GridColumnMenuFilter component.
+ */
+export declare interface GridColumnMenuFilterProps extends GridColumnMenuFilterBaseProps {
+    /**
+     * Controls the expand state of the filter component.
+     */
+    expanded?: boolean;
+    /**
+     * Triggered on each subsequent expand state of the filter component.
+     */
+    onExpandChange?: (nextExpandState: boolean) => void;
+    /**
+     * 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>;
+    children?: React_2.ReactNode;
+    /**
+     * If set to `true`, filter expand button will not be rendered and filter menu will be expanded.
+     */
+    alwaysExpand?: boolean;
+}
+
+/**
+ * @hidden
+ */
+declare interface GridColumnMenuFilterStateProps {
+    expanded: boolean;
+    filterGroup: CompositeFilterDescriptor;
+}
+
+/**
+ * @hidden
+ */
+declare interface GridColumnMenuFilterStateProps_2 {
+    expanded: boolean;
+    value: string;
+    data: Array<string | object>;
+    dataFromProps: Array<string | object>;
+    currentFilter: CompositeFilterDescriptor;
+}
+
+/**
+ * @hidden
+ */
+export declare class GridColumnMenuFilterUI extends React_2.Component<GridColumnMenuFilterUIProps, {}> {
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props that will be passed to the UI of the ColumnMenu filter component.
+ */
+export declare interface GridColumnMenuFilterUIProps {
+    /**
+     * The options of the first filter.
+     */
+    firstFilterProps: GridFilterCellProps;
+    /**
+     * The options of the second filter.
+     */
+    secondFilterProps: GridFilterCellProps;
+    /**
+     * The current value of the filter logic.
+     */
+    logicValue?: GridFilterOperator;
+    /**
+     * The list of the filter logic options.
+     */
+    logicData: GridFilterOperator[];
+    /**
+     * The method that will be called to notify the parent about a change in the filter logic.
+     */
+    onLogicChange: (e: any) => void;
+    /**
+     * Indicates if the second filter will be hidden.
+     */
+    hideSecondFilter?: boolean;
+}
+
+/**
+ * @example
+ * ```jsx-no-run
+ * class TextColumnMenu extends React.Component {
+ *     render() {
+ *         return (
+ *         <div>
+ *             <GridColumnMenuSort {...this.props} />
+ *             <GridColumnMenuGroup {...this.props} />
+ *         </div>);
+ *     }
+ * }
+ *
+ * class App extends React.PureComponent {
+ *     constructor(props) {
+ *         super(props);
+ *
+ *         this.state = this.createAppState({
+ *             take: 10,
+ *             skip: 0
+ *         });
+ *     }
+ *
+ *     createAppState(dataState) {
+ *         return {
+ *             result: process(products.slice(0), dataState),
+ *             dataState: dataState
+ *         };
+ *     }
+ *
+ *     dataStateChange = (event) => {
+ *         this.setState(this.createAppState(event.dataState));
+ *     }
+ *
+ *     render() {
+ *         return (
+ *             <div>
+ *                 <Grid
+ *                     data={this.state.result}
+ *                     {...this.state.dataState}
+ *                     onDataStateChange={this.dataStateChange}
+ *                     sortable={true}
+ *                     pageable={true}
+ *                 >
+ *                     <Column field="ProductID" title="Product ID" />
+ *                     <Column field="ProductName" columnMenu={TextColumnMenu} />
+ *                 </Grid>
+ *                 <br />
+ *             </div>
+ *         );
+ *     }
+ * }
+ *
+ * ReactDOM.render(<App />, document.querySelector('my-app'));
+ * ```
+ */
+export declare class GridColumnMenuGroup extends React_2.Component<GridColumnMenuGroupProps, {}> {
+    /**
+     * @hidden
+     */
+    onGroupClick: (event: React_2.MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ *  The props passed to the ColumnMenu group component.
+ */
+declare interface GridColumnMenuGroupBaseProps extends GridColumnMenuBaseProps {
+    /**
+     * The groupable option of the column.
+     */
+    groupable?: boolean;
+    /**
+     * The current group state of the Grid.
+     */
+    group?: GroupDescriptor[];
+    /**
+     * The method that will be called to notify the parent Grid about a group change.
+     */
+    onGroupChange?: (groups: GroupDescriptor[], event: React.MouseEvent<HTMLAnchorElement>) => void;
+}
+
+/**
+ * The props of the GridColumnMenuGroup component.
+ */
+declare interface GridColumnMenuGroupProps extends GridColumnMenuGroupBaseProps {
+}
+
+/**
+ * The GridColumnMenuItem component that is used inside the Grid ColumnMenu.
+ */
+export declare class GridColumnMenuItem extends React_2.Component<GridColumnMenuItemProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The GridColumnMenuItemContent that will be used inside the Grid ColumnMenu.
+ */
+export declare class GridColumnMenuItemContent extends React_2.Component<GridColumnMenuItemContentProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props of the GridColumnMenuItemContent component.
+ */
+declare interface GridColumnMenuItemContentProps extends KendoReactComponentBaseProps {
+    /**
+     * The `show` state of the component. Each change is animated with the Reveal animation.
+     */
+    show: boolean;
+}
+
+/**
+ * The GridColumnMenuItemGroup that will be used inside the Grid ColumnMenu.
+ */
+export declare class GridColumnMenuItemGroup extends React_2.Component<GridColumnMenuItemGroupProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props of the GridColumnMenuItemGroup component.
+ */
+declare interface GridColumnMenuItemGroupProps extends KendoReactComponentBaseProps {
+}
+
+/**
+ * The props of the GridColumnMenuItem component.
+ */
+declare interface GridColumnMenuItemProps {
+    /**
+     * Triggered each time the title is clicked.
+     */
+    onClick: React_2.MouseEventHandler<HTMLElement>;
+    /**
+     * The title of the GridColumnMenuItem component.
+     */
+    title: string;
+    /**
+     * The class of the icon that is rendered next to the title.
+     */
+    iconClass: string;
+    /**
+     * The SVG icon that is rendered next to the title.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * The selected state of the component.
+     */
+    selected?: boolean;
+}
+
+/**
+ * The props which the ColumnMenu passes to its children.
+ */
+export declare interface GridColumnMenuProps extends GridColumnMenuFilterBaseProps, GridColumnMenuSortBaseProps, GridColumnMenuGroupBaseProps {
+}
+
+/**
+ * @example
+ * ```jsx-no-run
+ * class ColumnMenu extends React.Component {
+ *     render() {
+ *         return (
+ *         <div>
+ *             <GridColumnMenuSort {...this.props} />
+ *         </div>);
+ *     }
+ * }
+ *
+ * class App extends React.PureComponent {
+ *     constructor(props) {
+ *         super(props);
+ *
+ *         this.state = this.createAppState({
+ *             take: 10,
+ *             skip: 0
+ *         });
+ *     }
+ *
+ *     createAppState(dataState) {
+ *         return {
+ *             result: process(products.slice(0), dataState),
+ *             dataState: dataState
+ *         };
+ *     }
+ *
+ *     dataStateChange = (event) => {
+ *         this.setState(this.createAppState(event.dataState));
+ *     }
+ *
+ *     render() {
+ *         return (
+ *             <div>
+ *                 <Grid
+ *                     data={this.state.result}
+ *                     {...this.state.dataState}
+ *                     onDataStateChange={this.dataStateChange}
+ *                     sortable={true}
+ *                     pageable={true}
+ *                 >
+ *                     <Column field="ProductID" title="Product ID" columnMenu={ColumnMenu}/>
+ *                     <Column field="ProductName" />
+ *                 </Grid>
+ *                 <br />
+ *             </div>
+ *         );
+ *     }
+ * }
+ *
+ * ReactDOM.render(<App />, document.querySelector('my-app'));
+ * ```
+ */
+export declare class GridColumnMenuSort extends React_2.Component<GridColumnMenuSortProps, {}> {
+    /**
+     * Can be used to check if sorting is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active sort indicators.
+     */
+    static active: (field: string, sort?: SortDescriptor[]) => boolean;
+    /**
+     * @hidden
+     */
+    onAscClick: (event: any) => void;
+    /**
+     * @hidden
+     */
+    onDescClick: (event: any) => void;
+    /**
+     * @hidden
+     */
+    onSort: (event: React_2.MouseEvent<HTMLAnchorElement>, selectedDir: 'asc' | 'desc') => void;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ *  The props passed to the ColumnMenu sort component.
+ */
+declare interface GridColumnMenuSortBaseProps extends GridColumnMenuBaseProps {
+    /**
+     * The sortable option of the column.
+     */
+    sortable?: GridSortSettings;
+    /**
+     * The current sort state of the Grid.
+     */
+    sort?: SortDescriptor[];
+    /**
+     * The method that will be called to notify the parent Grid about a sort change.
+     */
+    onSortChange?: (descriptors: SortDescriptor[], e: React.SyntheticEvent<any>) => void;
+}
+
+/**
+ * The props of the GridColumnMenuSort component.
+ */
+declare interface GridColumnMenuSortProps extends GridColumnMenuSortBaseProps {
+}
+
+/**
+ * The GridColumnMenuWrapper component.
+ */
+export declare class GridColumnMenuWrapper extends React_2.Component<GridColumnMenuWrapperProps, ColumnMenuStateProps> {
+    /** @hidden */
+    readonly state: ColumnMenuStateProps;
+    /** @hidden */
+    _anchor: HTMLAnchorElement | null;
+    /** @hidden */
+    _content: HTMLDivElement | null;
+    /** @hidden */
+    blurTimeout: any;
+    /** @hidden */
+    willBlur: boolean;
+    /** @hidden */
+    blur: () => void;
+    /** @hidden */
+    focus: () => void;
+    /** @hidden */
+    anchorClick: (event: React_2.MouseEvent<HTMLAnchorElement>) => void;
+    /** @hidden */
+    closeMenu: () => void;
+    /** @hidden */
+    onAnchorMouseDown: (event: React_2.MouseEvent<HTMLAnchorElement>) => void;
+    /** @hidden */
+    onAnchorKeyDown: (event: React_2.KeyboardEvent<HTMLAnchorElement>) => void;
+    render(): JSX_2.Element;
+}
+
+/**
+ * The props of the GridColumnMenuWrapper component.
+ */
+export declare interface GridColumnMenuWrapperProps extends GridColumnMenuProps {
+    /**
+     * The component to be rendered as content of the Grid column menu.
+     */
+    columnMenu?: React_2.ComponentType<GridColumnMenuProps> | null;
+}
+
+/**
+ * The props of the GridColumn component.
+ */
+export declare interface GridColumnProps extends Omit<ColumnBaseProps, 'cell'> {
+    /**
+     * Allows the column headers to be clicked and the `sortChange` event emitted.
+     * You have to handle the `sortChange` event yourself and sort the data.
+     * Defaults to `true`.
+     */
+    sortable?: boolean | GridColumnSortSettings;
+    /**
+     * Defines if the column is locked (frozen or sticky).
+     * Locked columns are the columns that are visible at all times while the user scrolls the component horizontally.
+     * Defaults to `false`.
+     */
+    locked?: boolean;
+    /**
+     * A collection of child columns.
+     */
+    children?: GridColumnProps[] | ReactElement<GridColumnProps>[];
+    /**
+     * Specifies a React element that will be cloned and rendered inside the column menu of the Grid ([see example]({% slug column_menu_grid %}#toc-basic-usage)).
+     */
+    columnMenu?: ComponentType<GridColumnMenuProps>;
+    /**
+     * Determines if the column can be dragged to the group panel. Defaults to `true`.
+     */
+    groupable?: boolean;
+    /**
+     * Defines whether the column is editable ([more information and examples]({% slug editing_inline_grid %})).
+     */
+    editable?: boolean;
+    /**
+     * Defines if a filter UI will be rendered for this column. Defaults to `true`.
+     */
+    filterable?: boolean;
+    /**
+     * Defines the title which will be set to the input element in the filter cell.
+     */
+    filterTitle?: string;
+    /**
+     * Defines the filter type that will be rendered inside the filter row. Defaults to `text`.
+     */
+    filter?: 'text' | 'numeric' | 'boolean' | 'date';
+    /**
+     * Defines the editor type. Used when the column enters the edit mode ([more information and examples]({% slug editing_inline_grid %})). Defaults to `text`.
+     */
+    editor?: 'text' | 'numeric' | 'boolean' | 'date';
+    /**
+     * Defines the component that will be rendered as a cell. If not set, a `GridCell` will be rendered by default.
+     */
+    cell?: ComponentType<GridCellProps>;
+    /**
+     * Sets a set of cells components that the Grid will render instead of the built-in cell.
+     */
+    cells?: GridCellsSettings;
+    /**
+     * Defines the component that will be rendered as a filter cell. If not set, a `GridFilterCell` will be rendered by default.
+     */
+    filterCell?: ComponentType<GridFilterCellProps>;
+    /**
+     * Defines the component that will be rendered as a header cell. If not set, a `GridHeaderCell` will be rendered by default.
+     */
+    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>
+     *  )}
+     * />
+     * ```
+     */
+    footerCell?: ComponentType<GridFooterCellProps>;
+}
+
+/**
+ * Represents the object of the `onColumnReorder` Grid event.
+ */
+export declare interface GridColumnReorderEvent {
+    /**
+     * An event target.
+     */
+    target: GridClassComponent;
+    /**
+     * A native DOM event.
+     */
+    nativeEvent: any;
+    /**
+     * The current columns collection.
+     */
+    columns: GridColumnProps[];
+    /**
+     * The id of the dragged column.
+     */
+    columnId?: string;
+}
+
+/**
+ * Represents the object of the `onColumnResize` Grid event.
+ */
+export declare interface GridColumnResizeEvent {
+    /**
+     * An event target.
+     */
+    target: GridClassComponent;
+    /**
+     * A native DOM event.
+     * Can be `null` when the callback source is not user action (e.g.: method call).
+     */
+    nativeEvent: any;
+    /**
+     * The current columns collection.
+     */
+    columns: GridColumnProps[];
+    /**
+     * **Deprecated**. Use `targetColumnId` instead.
+     * The index of the column.
+     */
+    index: number;
+    /**
+     * **Deprecated**.
+     * The new width of the column.
+     */
+    newWidth: number;
+    /**
+     * **Deprecated**.
+     * The actual width of the column prior to resizing.
+     */
+    oldWidth: number;
+    /**
+     * Indicates that resizing is complete and the user has dropped the resize handler.
+     */
+    end: boolean;
+    /**
+     * The id of the clicked/dragged column.
+     * When the callback source is not user action (e.g.: method call), contains only the first column id from the list.
+     */
+    targetColumnId?: string;
+}
+
+/**
+ * The settings for sorting the Grid columns.
+ */
+declare type GridColumnSortSettings = ColumnSortSettings;
+
+/**
+ * @hidden
+ */
+export declare class GridCommonDragLogic {
+    refDragElementClue: React_2.RefObject<DragClue>;
+    refDropElementClue: React_2.RefObject<DropClue>;
+    columns: ExtendedColumnProps[];
+    reorderable: boolean;
+    groupable: boolean;
+    private startColumn;
+    private startGroup;
+    private currentColumn;
+    private currentGroup;
+    private columnReorder;
+    private groupReorder;
+    private columnToGroup;
+    private groupPanelDivElement;
+    get dragClueRef(): React_2.RefObject<DragClue | null>;
+    get dropClueRef(): React_2.RefObject<DropClue | null>;
+    private get dragElementClue();
+    private get dropElementClue();
+    constructor(columnReorder: handler, groupReorder: handler, columnToGroup: handler);
+    refGroupPanelDiv: (e: any) => void;
+    pressHandler: (event: any, element: HTMLTableRowElement | HTMLDivElement) => void;
+    dragHandler: (event: any, element: HTMLTableRowElement | HTMLDivElement) => void;
+    releaseHandler: (event: any) => void;
+    private getColumnIndex;
+    private isTargetGroupingContainer;
+    private getGroupIndex;
+    private isValid;
+    private updateDragElementClue;
+    private updateDropElementClue;
+}
+
+/**
+ * Represents the object of the `onContextMenu` Grid event.
+ */
+export declare interface GridContextMenuEvent extends GridEvent {
+    /**
+     * The data object that represents the current row.
+     */
+    dataItem: any;
+    /**
+     * The field to which the cell is bound.
+     */
+    field?: string;
+    /**
+     * A React Synthetic Event.
+     */
+    syntheticEvent: React.MouseEvent<any>;
+}
+
+/**
+ * The properties of the default Grid Cell.
+ */
+export declare interface GridCustomCellProps extends GridCellProps {
+    /**
+     * The props and attributes that are applied to the td element by default.
+     */
+    tdProps?: React.TdHTMLAttributes<HTMLTableCellElement> | null;
+    /**
+     * The props and attributes that are applied to the second td. Such element is
+     * rendered in very rare cases when we have grouping and sticky columns.
+     */
+    td2Props?: React.TdHTMLAttributes<HTMLTableCellElement> | null;
+    /**
+     * The default children of the table cell.
+     */
+    children?: React.ReactNode | React.ReactNode[];
+}
+
+/**
+ * The properties of the filter Grid Cell.
+ */
+export declare interface GridCustomFilterCellProps extends GridFilterCellProps {
+    /**
+     * The props and attributes that are applied to the td element by default.
+     */
+    thProps?: GridThAttributes | null;
+    /**
+     * The default children of the table cell.
+     */
+    children?: React.ReactNode | React.ReactNode[];
+    /**
+     * The index of the column.
+     */
+    index?: number;
+}
+
+/**
+ * The properties of the footer Grid Cell.
+ */
+export declare interface GridCustomFooterCellProps extends GridFooterCellProps {
+    /**
+     * The props and attributes that are applied to the td element by default.
+     */
+    tdProps?: React.TdHTMLAttributes<HTMLTableCellElement> | null;
+    /**
+     * The index of the column that is rendered.
+     */
+    index?: number;
+}
+
+/**
+ * The properties of the header Grid Cell.
+ */
+export declare interface GridCustomHeaderCellProps extends GridHeaderCellProps {
+    /**
+     * The props and attributes that are applied to the td element by default.
+     */
+    thProps?: GridThAttributes | null;
+    /**
+     * The default children of the table cell.
+     */
+    children: React.ReactNode | React.ReactNode[];
+    /**
+     * The index of the column.
+     */
+    index?: number;
+}
+
+/**
+ * Represents the object of the `onDataStateChange` Grid event.
+ */
+export declare interface GridDataStateChangeEvent extends GridEvent {
+    /**
+     * The state of the Grid based on the user action.
+     */
+    dataState: State;
+    targetEvent?: PagerTargetEvent;
+}
+
+/**
+ * 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.
+ *
+ * @example
+ * ```jsx
+ * class CustomGridDetailRow extends GridDetailRow {
+ *     render() {
+ *         const detailData = this.props.dataItem.MasterField2;
+ *         return (
+ *             <div>
+ *               This is detail template with another grid inside it
+ *               <Grid scrollable="none" data={detailData} />
+ *             </div>
+ *         );
+ *     }
+ * }
+ *
+ * class App extends React.Component {
+ *     constructor(props) {
+ *         super(props);
+ *         this.state = {
+ *             data: [{MasterField1:'A1', MasterField2: [{DetailField1: 1, DetailField2: 2}]},
+ *                   {MasterField1:'B1', MasterField2: [{DetailField1: 3, DetailField2: 4}]},
+ *                   {MasterField1:'C1', MasterField2: [{DetailField1: 5, DetailField2: 6}]}]
+ *         };
+ *     }
+ *     render() {
+ *         return (
+ *             <Grid
+ *                  data={this.state.data}
+ *                  detail={CustomGridDetailRow}
+ *              >
+ *              <GridColumn field="MasterField1" />
+ *             </Grid>
+ *         );
+ *     }
+ * }
+ * ReactDOM.render(
+ *     <App />,
+ *     document.querySelector('my-app')
+ * );
+ * ```
+ */
+export declare class GridDetailRow extends React_2.Component<GridDetailRowProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): JSX.Element | null;
+}
+
+/**
+ * The props of the GridDetailRow component ([see example]({% slug detailrow_grid %})).
+ */
+export declare interface GridDetailRowProps {
+    /**
+     * The data object that represents the current row.
+     */
+    dataItem: any;
+    /**
+     * Zero-based index of the dataItem.
+     */
+    dataIndex: number;
+}
+
+/** @hidden */
+export declare interface GridDragSelectionReleaseEvent extends TableDragSelectionReleaseEvent {
+}
+
+/**
+ * @hidden
+ */
+export declare const GridEditCell: (props: GridCellProps) => JSX_2.Element | null;
+
+/**
+ * Represents the base event object of the Grid.
+ */
+export declare interface GridEvent extends BaseEvent<GridClassComponent> {
+}
+
+/**
+ * Represents the object of the `onExpandChange` Grid event.
+ */
+export declare interface GridExpandChangeEvent extends GridEvent {
+    /**
+     * The data item that is expanded or collapsed.
+     */
+    dataItem: any;
+    /**
+     * The available values are:
+     * - `true`&mdash;If the data item is expanded.
+     * - `false`&mdash;If the data item is collapsed.
+     */
+    value: boolean;
+    /**
+     * Zero based index of the data item.
+     */
+    dataIndex: number;
+}
+
+export declare class GridFilterCell extends React_2.Component<GridFilterCellProps, {}> {
+    private _inputRef;
+    constructor(props: GridFilterCellProps);
+    /**
+     * @hidden
+     */
+    render(): string | number | boolean | Iterable<React_2.ReactNode> | JSX_2.Element | null | undefined;
+    private renderOperatorEditor;
+    private inputChange;
+    private operatorChange;
+    private boolDropdownChange;
+    private clear;
+    private filterComponent;
+}
+
+/**
+ * The props of the GridFilterCell component
+ * ([more information]({% slug cells_grid %}#toc-filter-cells)
+ * and [example]({% slug filtering_grid %}#toc-custom-filter-cells)).
+ */
+export declare interface GridFilterCellProps {
+    /**
+     * The column field in which the cell is located.
+     */
+    field?: string;
+    /**
+     * The method that will be called if the cell needs to inform its parent Grid about a change.
+     */
+    onChange: (event: {
+        value: any;
+        operator: string | Function;
+        syntheticEvent: React.SyntheticEvent<any>;
+    }) => void;
+    /**
+     * The list of the default operators for the current filter type.
+     */
+    operators: GridFilterOperator[];
+    /**
+     * The title which will be set to the input element in the filter cell.
+     */
+    title?: string;
+    /**
+     * The type of the filter. Determines which editor will be rendered for filtering.
+     */
+    filterType: 'text' | 'numeric' | 'boolean' | 'date';
+    /**
+     * The value of the cell.
+     */
+    value: any;
+    /**
+     * The operator that will be used for the cell filtering.
+     */
+    operator?: string | Function;
+    /**
+     * 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.
+     */
+    ariaLabel?: string;
+    /**
+     * Configures the `size` of the cell.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null&mdash;Does not set a size `className`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large';
+}
+
+/**
+ * Represents the object of the `onFilterChange` Grid event.
+ */
+export declare interface GridFilterChangeEvent extends GridEvent {
+    /**
+     * The new `CompositeFilterDescriptor` based on the user action.
+     */
+    filter: CompositeFilterDescriptor;
+}
+
+/**
+ * The filter operator for the Grid filters.
+ */
+export declare interface GridFilterOperator extends FilterOperator {
+}
+
+/**
+ * The filter operators for the Grid filters.
+ *
+ * @example
+ * ```jsx-no-run
+ * // Default Grid filter operators:
+ * const filterOperators: {
+ *     'text': [
+ *         { text: 'grid.filterContainsOperator', operator: 'contains' },
+ *         { text: 'grid.filterNotContainsOperator', operator: 'doesnotcontain' },
+ *         { text: 'grid.filterEqOperator', operator: 'eq' },
+ *         { text: 'grid.filterNotEqOperator', operator: 'neq' },
+ *         { text: 'grid.filterStartsWithOperator', operator: 'startswith' },
+ *         { text: 'grid.filterEndsWithOperator', operator: 'endswith' },
+ *         { text: 'grid.filterIsNullOperator', operator: 'isnull' },
+ *         { text: 'grid.filterIsNotNullOperator', operator: 'isnotnull' },
+ *         { text: 'grid.filterIsEmptyOperator', operator: 'isempty' },
+ *         { text: 'grid.filterIsNotEmptyOperator', operator: 'isnotempty' }
+ *     ],
+ *     'numeric': [
+ *         { text: 'grid.filterEqOperator', operator: 'eq' },
+ *         { text: 'grid.filterNotEqOperator', operator: 'neq' },
+ *         { text: 'grid.filterGteOperator', operator: 'gte' },
+ *         { text: 'grid.filterGtOperator', operator: 'gt' },
+ *         { text: 'grid.filterLteOperator', operator: 'lte' },
+ *         { text: 'grid.filterLtOperator', operator: 'lt' },
+ *         { text: 'grid.filterIsNullOperator', operator: 'isnull' },
+ *         { text: 'grid.filterIsNotNullOperator', operator: 'isnotnull' }
+ *     ],
+ *     'date': [
+ *         { text: 'grid.filterEqOperator', operator: 'eq' },
+ *         { text: 'grid.filterNotEqOperator', operator: 'neq' },
+ *         { text: 'grid.filterAfterOrEqualOperator', operator: 'gte' },
+ *         { text: 'grid.filterAfterOperator', operator: 'gt' },
+ *         { text: 'grid.filterBeforeOperator', operator: 'lt' },
+ *         { text: 'grid.filterBeforeOrEqualOperator', operator: 'lte' },
+ *         { text: 'grid.filterIsNullOperator', operator: 'isnull' },
+ *         { text: 'grid.filterIsNotNullOperator', operator: 'isnotnull' }
+ *     ],
+ *     'boolean': [
+ *         { text: 'grid.filterEqOperator', operator: 'eq' }
+ *     ]
+ * }
+ * ```
+ */
+export declare interface GridFilterOperators {
+    [type: string]: GridFilterOperator[];
+}
+
+/**
+ * The props of the GridFooterCell component
+ * ([see example]({% slug cells_grid %}#toc-footer-cells)).
+ */
+export declare interface GridFooterCellProps {
+    /**
+     * The field to which the footer cell is bound.
+     */
+    field?: string;
+    /**
+     * The styles of the footer cell.
+     */
+    style?: React.CSSProperties;
+    /**
+     * The `colSpan` of the footer cell.
+     */
+    colSpan?: number;
+    /**
+     * The index to be applied to the `aria-colindex` attribute.
+     */
+    ariaColumnIndex: number;
+}
+
+/**
+ * The settings for grouping the data of the Grid ([see example]({% slug groupingaggregates_grid %})).
+ */
+export declare interface GridGroupableSettings {
+    /**
+     * Determines if grouping by dragging and dropping the column headers is allowed and if the group header is visible.
+     */
+    enabled?: boolean;
+    /**
+     * Determines if the group footer row is visible when the group is collapsed. Defaults to `none`.
+     */
+    footer?: 'always' | 'visible' | 'none';
+}
+
+/**
+ * @hidden
+ */
+export declare const GridGroupCell: (props: GridCellProps) => JSX_2.Element | null;
+
+/**
+ * Represents the object of the `onGroupChange` Grid event.
+ */
+export declare interface GridGroupChangeEvent extends GridEvent {
+    /**
+     * An array of `GroupDescriptor` that corresponds to the user action.
+     */
+    group: GroupDescriptor[];
+}
+
+/**
+ * Represent the `ref` of the Grid component.
+ */
+export declare interface GridHandle extends Pick<GridClassComponent, keyof GridClassComponent> {
+}
+
+/**
+ * @example
+ * ```jsx
+ * class App extends React.PureComponent {
+ *    state = {
+ *        details: false,
+ *        data: [
+ *               { foo: 'A1', bar: 'B1', b1: 1, b2:2 },
+ *               { foo: 'A2', bar: 'B2', b1: 3, b2:4 },
+ *               { foo: 'A3', bar: 'B2', b1: 5, b2:6 }
+ *           ]
+ *    };
+ *
+ *    CustomHeaderCell = (props) =>
+ *        <span>
+ *            {props.title || props.field + ' '}
+ *            <button onClick={() => this.setState({ barDetails: !this.state.barDetails })}>
+ *                {this.state.barDetails ? 'collapse' : 'expand'}
+ *            </button>
+ *            {props.children}
+ *        </span>
+ *
+ *    render() {
+ *        return (
+ *            <Grid
+ *                style={{ height: '420px' }}
+ *                data={this.state.data}
+ *                reorderable={true}
+ *            >
+ *                <GridColumn field="foo" />
+ *                <GridColumn field="bar" headerCell={this.CustomHeaderCell}>
+ *                    {this.state.barDetails && [
+ *                        <GridColumn field="b1" />,
+ *                        <GridColumn field="b2" />
+ *                    ]}
+ *                </GridColumn>
+ *            </Grid>
+ *        );
+ *    }
+ * }
+ *
+ * ReactDOM.render(<App />, document.querySelector('my-app'));
+ * ```
+ */
+export declare class GridHeaderCell extends React_2.Component<GridHeaderCellProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): string | number | boolean | Iterable<React_2.ReactNode> | JSX_2.Element | null | undefined;
+}
+
+/**
+ * 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.
+     */
+    columnMenuWrapperProps: GridColumnMenuWrapperProps;
+    /**
+     * @hidden
+     */
+    id?: string;
+}
+
+/**
+ * Represents the object of the `onHeaderSelectionChange` Grid event.
+ */
+export declare interface GridHeaderSelectionChangeEvent extends GridEvent {
+    /**
+     * The field of the column in which the cell is located.
+     */
+    field?: string;
+    /**
+     * The current Grid leaf data items.
+     */
+    dataItems: any[];
+    /**
+     * The `selectedField` prop of the Grid.
+     */
+    selectedField: string;
+}
+
+/**
+ * @hidden
+ */
+export declare const GridHierarchyCell: (props: GridCellProps) => JSX_2.Element | null;
+
+/**
+ * Represents the object of the `onItemChange` Grid event.
+ */
+export declare interface GridItemChangeEvent extends GridEvent {
+    /**
+     * The data object that represents the current row.
+     */
+    dataItem: any;
+    /**
+     * The field to which the cell is bound.
+     */
+    field?: string;
+    /**
+     * The value of the item.
+     */
+    value: any;
+}
+
+/**
+ * Represents the object of the `GridKeyDownEvent` Grid event.
+ */
+export declare interface GridKeyDownEvent extends GridEvent, TableKeyDownEvent<GridClassComponent> {
+}
+
+/**
+ * @hidden
+ */
+export declare const gridMessages: {
+    "grid.detailExpand": string;
+    "grid.detailCollapse": string;
+    "grid.groupExpand": string;
+    "grid.groupCollapse": string;
+    "grid.noRecords": string;
+    "grid.groupPanelEmpty": string;
+    "grid.filterClearButton": string;
+    "grid.filterSubmitButton": string;
+    "grid.filterTitle": string;
+    "grid.sortAscending": string;
+    "grid.sortDescending": string;
+    "grid.sortAriaLabel": string;
+    "grid.groupColumn": string;
+    "grid.ungroupColumn": string;
+    "grid.columnMenu": string;
+    "grid.pagerItemsPerPage": string;
+    "grid.pagerInfo": string;
+    "grid.pagerFirstPage": string;
+    "grid.pagerPreviousPage": string;
+    "grid.pagerNextPage": string;
+    "grid.pagerLastPage": string;
+    "grid.pagerPage": string;
+    "grid.pagerPageSizeAriaLabel": string;
+    "grid.pagerOf": string;
+    "grid.pagerTotalPages": string;
+    "grid.searchPlaceholder": string;
+    "grid.filterCheckAll": string;
+    "grid.filterChooseOperator": string;
+    "grid.filterSelectedItems": string;
+    "grid.filterAriaLabel": string;
+    "grid.groupPanelAriaLabel": string;
+    "grid.gridAriaLabel": string;
+    "grid.selectRow": string;
+    'grid.filterEqOperator': string;
+    'grid.filterNotEqOperator': string;
+    'grid.filterIsNullOperator': string;
+    'grid.filterIsNotNullOperator': string;
+    'grid.filterIsEmptyOperator': string;
+    'grid.filterIsNotEmptyOperator': string;
+    'grid.filterStartsWithOperator': string;
+    'grid.filterContainsOperator': string;
+    'grid.filterNotContainsOperator': string;
+    'grid.filterEndsWithOperator': string;
+    'grid.filterGteOperator': string;
+    'grid.filterGtOperator': string;
+    'grid.filterLteOperator': string;
+    'grid.filterLtOperator': string;
+    'grid.filterIsTrue': string;
+    'grid.filterIsFalse': string;
+    'grid.filterBooleanAll': string;
+    'grid.filterAfterOrEqualOperator': string;
+    'grid.filterAfterOperator': string;
+    'grid.filterBeforeOperator': string;
+    'grid.filterBeforeOrEqualOperator': string;
+    'grid.filterAndLogic': string;
+    'grid.filterOrLogic': string;
+};
+
+/**
+ * Represents the object of the `GridNavigationActionEvent` Grid event.
+ */
+export declare interface GridNavigationActionEvent extends GridEvent {
+    /**
+     * The focused element.
+     */
+    focusElement: any;
+}
+
+/**
+ * Represents the GridNoRecords component. The component is rendered when the `data` property of the Grid is empty or `null`.
+ *
+ * @example
+ * ```jsx
+ * class App extends React.Component {
+ *     render() {
+ *         return (
+ *             <Grid data={[]}>
+ *                 <GridNoRecords>
+ *                     There is no data available
+ *                 </GridNoRecords>
+ *                 <GridColumn field="id" />
+ *                 <GridColumn field="name" />
+ *             </Grid>
+ *         );
+ *     }
+ * }
+ * ReactDOM.render(
+ *     <App />,
+ *     document.querySelector('my-app')
+ * );
+ * ```
+ */
+export declare class GridNoRecords extends React_2.Component<GridNoRecordsProps, {}> {
+    /**
+     * @hidden
+     */
+    static displayName: string;
+    /**
+     * @hidden
+     */
+    render(): any;
+}
+
+/**
+ * The props of the GridNoRecords component.
+ */
+export declare interface GridNoRecordsProps {
+    /**
+     * The React elements that will be rendered inside the Grid when no records are available.
+     */
+    children?: React.ReactNode;
+}
+
+/**
+ * Represents the object of the `onPageChange` Grid event.
+ */
+export declare interface GridPageChangeEvent extends GridEvent {
+    page: Page;
+    targetEvent?: PagerTargetEvent;
+}
+
+/**
+ * The pager settings of the Grid ([see example]({% slug paging_grid %})).
+ *
+ * @example
+ * ```tsx-no-run
+ *
+ * <Grid
+ *    pageable="{{
+ *        buttonCount: 2,
+ *        info: false
+ *    }}">
+ * </Grid>
+ * ```
+ */
+export declare interface GridPagerSettings {
+    /**
+     * 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.
+     */
+    pageSizeValue?: string | number;
+    /**
+     * Sets the maximum numeric buttons count before the buttons are collapsed.
+     */
+    buttonCount?: number;
+    /**
+     * Toggles the information about the current page and the total number of records.
+     */
+    info?: boolean;
+    /**
+     * Defines the type of the Grid pager.
+     */
+    type?: GridPagerType;
+    /**
+     * Shows a menu for selecting the page size.
+     */
+    pageSizes?: boolean | Array<number> | Array<number | string>;
+    /**
+     * Toggles the **Previous** and **Next** buttons.
+     */
+    previousNext?: boolean;
+    /**
+     * Defines if the pager will be responsive. Defaults to `true`.
+     */
+    responsive?: boolean;
+}
+
+/**
+ * The type of the Grid pager.
+ *
+ * The available values are:
+ * * `numeric`&mdash;Buttons with numbers.
+ * * `input`&mdash;Input for typing the page number.
+ *
+ * @example
+ * ```tsx-no-run
+ *
+ * <Grid
+ *    pageable="{{
+ *        type: 'numeric'
+ *    }}">
+ * </Grid>
+ * ```
+ */
+declare type GridPagerType = 'numeric' | 'input';
+
+/**
+ * Represents the props of the [KendoReact Grid component]({% slug overview_grid %}).
+ */
+export declare interface GridProps extends KendoReactComponentBaseProps {
+    /**
+     * Sets the Grid row key prop to the value of this field in the dataItem.
+     * If not set, the dataItem index will be used for the row key, which might lead to row not updated during paging or scrolling.
+     */
+    dataItemKey?: string;
+    /**
+     * Sets a class of the Grid DOM element.
+     */
+    className?: string;
+    /**
+     * Sets a set of custom components that the Grid will render instead of the built-in cell.
+     */
+    cells?: GridCellsSettings;
+    /**
+     * Sets the data of the Grid ([see example]({% slug paging_grid %})). If you use paging, the `data` option has to contain only the items for the current page.
+     */
+    data?: any[] | DataResult | null;
+    /**
+     * Enables the sorting for the columns with their `field` option set ([see example]({% slug sorting_grid %})).
+     */
+    sortable?: GridSortSettings;
+    /**
+     * When set enables the clipboard copy, cut and paste manipulations. It takes values of type [ClipboardSettings]({% slug api_data-tools_clipboardsettings %}) or boolean.
+     */
+    clipboard?: ClipboardSettings | boolean;
+    /**
+     * Fires when clipboard support is enabled and the one of the actions 'copy'. The event accepts type [ClipboardDataEvent]({% slug api_data-tools_clipboarddataevent %}).
+     */
+    onClipboard?: (event: ClipboardDataEvent) => void;
+    /**
+     * Fires when the sorting of the Grid is changed ([see example]({% slug sorting_grid %})). You have to handle the event yourself and sort the data.
+     */
+    onSortChange?: (event: GridSortChangeEvent) => void;
+    /**
+     * The descriptors by which the data is sorted. Applies the sorting styles and buttons to the affected columns.
+     */
+    sort?: SortDescriptor[];
+    /**
+     * Enables the filtering of the columns with their `field` option set ([more information and examples]({% slug filtering_grid %})).
+     */
+    filterable?: boolean;
+    /**
+     * The descriptor by which the data is filtered ([more information and examples]({% slug filtering_grid %})). This affects the values and buttons in the `FilterRow` of the Grid.
+     */
+    filter?: CompositeFilterDescriptor;
+    /**
+     * The filter operators for the Grid filters.
+     *
+     * @example
+     * ```jsx
+     * const customFilterOperators = {
+     *     'text': [
+     *         { text: 'grid.filterContainsOperator', operator: 'contains' }
+     *     ],
+     *     'numeric': [
+     *         { text: 'grid.filterGtOperator', operator: 'gt' }
+     *     ],
+     *     'date': [
+     *         { text: 'grid.filterAfterOperator', operator: 'gt' }
+     *     ]
+     * }
+     *
+     * class App extends React.Component {
+     *     constructor(props) {
+     *         super(props);
+     *         this.state = {
+     *             data: [
+     *                 { 'foo': 'A1', 'bar': 'B1' },
+     *                 { 'foo': 'A2', 'bar': 'B2' },
+     *                 { 'foo': 'A3', 'bar': 'B2' }
+     *             ]
+     *         };
+     *     }
+     *     render() {
+     *         return (
+     *             <div>
+     *                 <Grid
+     *                     data={this.state.data}
+     *                     reorderable={true}
+     *                     filterable
+     *                     filterOperators={customFilterOperators}
+     *                 >
+     *                     <GridColumn field="foo" />
+     *                     <GridColumn field="bar" />
+     *                 </Grid>
+     *             </div>
+     *         );
+     *     }
+     * }
+     * ReactDOM.render(<App />, document.querySelector('my-app'));
+     * ```
+     */
+    filterOperators?: GridFilterOperators;
+    /**
+     * Fires when the Grid filter is modified through the UI ([more information and examples]({% slug filtering_grid %})). You have to handle the event yourself and filter the data.
+     */
+    onFilterChange?: (event: GridFilterChangeEvent) => void;
+    /**
+     * Specifies a React element that will be cloned and rendered inside the column menu of the Grid. Can be overridden on column level.
+     */
+    columnMenu?: null | ComponentType<GridColumnMenuProps>;
+    /**
+     * The descriptors by which the data will be grouped
+     * ([more information and examples]({% slug groupingbasics_grid %})).
+     */
+    group?: GroupDescriptor[];
+    /**
+     * Fires when the grouping of the Grid is changed. You have to handle the event yourself and group the data
+     * ([more information and examples]({% slug groupingbasics_grid %})).
+     */
+    onGroupChange?: (event: GridGroupChangeEvent) => void;
+    /**
+     * Configures the pager of the Grid ([see example]({% slug paging_grid %})).
+     *
+     * The available options are:
+     * - `buttonCount: Number`&mdash;Sets the maximum numeric buttons count before the buttons are collapsed.
+     * - `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.
+     * - `previousNext: Boolean`&mdash;Toggles the **Previous** and **Next** buttons.
+     */
+    pageable?: GridPagerSettings | boolean;
+    /**
+     * Defines the page size that is used by the Grid pager ([see example]({% slug paging_grid %})). Required by the paging functionality.
+     */
+    pageSize?: number;
+    /**
+     * The pager component that the Grid will render instead of the built-in pager.
+     */
+    pager?: null | ComponentType<PagerProps>;
+    /**
+     * Alias of `pageSize` property. If `take` is set, `pageSize` will be ignored.
+     */
+    take?: number;
+    /**
+     * Fires when the page of the Grid is changed ([see example]({% slug paging_grid %})). You have to handle the event yourself and page the data.
+     */
+    onPageChange?: (event: GridPageChangeEvent) => void;
+    /**
+     * Defines the total number of data items in all pages ([see example]({% slug paging_grid %})). Required by the paging functionality.
+     */
+    total?: number;
+    /**
+     * Defines the number of records that will be skipped by the pager ([see example]({% slug paging_grid %})). Required by the paging functionality.
+     */
+    skip?: number;
+    /**
+     * Determines if the scroll position will be updated after data change. If set to `true` the scroll will remain on the same position.
+     */
+    fixedScroll?: boolean;
+    /**
+     * Fires when the user tries to expand or collapse a row.
+     */
+    onExpandChange?: (event: GridExpandChangeEvent) => void;
+    /**
+     * Specifies the name of the field which will provide a Boolean representation of the expanded state of the item ([see example]({% slug detailrow_grid %})).
+     */
+    expandField?: string;
+    /**
+     * The Grid selectable settings.
+     */
+    selectable?: 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
+     */
+    selectedField?: string;
+    /**
+     * Fires when the user tries to select or deselect a row or cell.
+     */
+    onSelectionChange?: (event: GridSelectionChangeEvent) => void;
+    /**
+     * Fires when the user clicks the checkbox of a column header whose `field` matches `selectedField` ([more information and example]({% slug selection_grid %})).
+     */
+    onHeaderSelectionChange?: (event: GridHeaderSelectionChangeEvent) => void;
+    /**
+     * Fires when the user clicks a row.
+     */
+    onRowClick?: (event: GridRowClickEvent) => void;
+    /**
+     * Fires when the user double clicks a row.
+     */
+    onRowDoubleClick?: (event: GridRowDoubleClickEvent) => void;
+    /**
+     * Fires when the user changes the values of the item. The event is not debounced and fires on every `onChange` event of the input in the current `EditCell` ([more information and examples]({% slug editing_inline_grid %})).
+     */
+    onItemChange?: (event: GridItemChangeEvent) => 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 %})).
+     */
+    editField?: string;
+    /**
+     * Defines the scroll mode that is used by the Grid ([see example]({% slug scrollmodes_grid %})).
+     *
+     * The available options are:
+     *  - `none`&mdash;Renders no scrollbar.
+     *  - `scrollable`&mdash;This is the default scroll mode. It requires the setting of the `height` option.
+     *  - `virtual`&mdash;Displays no pager and renders a portion of the data (optimized rendering) while the user is scrolling the content.
+     */
+    scrollable?: ScrollMode;
+    /**
+     * Defines the row height and forces an equal height to all rows ([see example]({% slug scrollmodes_grid %})).
+     */
+    rowHeight?: number;
+    /**
+     * Defines the detail row height and forces an equal height to all detail rows.
+     */
+    detailRowHeight?: number;
+    /**
+     * Specifies a React element that will be cloned and rendered inside the detail rows of the currently expanded items ([see example]({% slug hierarchy_grid %})). An item will be rendered as expanded if the value of its `expandField` is `true`.
+     */
+    detail?: null | ComponentType<GridDetailRowProps>;
+    /**
+     * Represents the `style` HTML attribute.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Fires when the data state of the Grid is changed ([more information]({% slug localoperations_grid %}) and [example]({% slug odataserveroperations_grid %})).
+     */
+    onDataStateChange?: (event: GridDataStateChangeEvent) => void;
+    /**
+     * If set to `true`, the user can resize columns by dragging the edges (resize handles) of their header cells ([see example]({% slug resizing_columns_grid %})).
+     */
+    resizable?: boolean;
+    /**
+     * If set to `true`, the user can reorder columns by dragging their header cells ([see example]({% slug reordering_columns_grid %})).
+     */
+    reorderable?: boolean;
+    /**
+     * Determines if grouping by dragging and dropping the column headers is allowed ([more information and examples]({% slug groupingbasics_grid %})).
+     */
+    groupable?: GridGroupableSettings | boolean;
+    /**
+     * Fires when a column is resized.
+     */
+    onColumnResize?: (event: GridColumnResizeEvent) => void;
+    /**
+     * Fires when the columns are reordered.
+     */
+    onColumnReorder?: (event: GridColumnReorderEvent) => void;
+    /**
+     * Fires when a row is about to be rendered. Overrides the default appearance of the row.
+     */
+    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 %})).
+     */
+    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.
+     */
+    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.
+     */
+    headerCellRender?: (defaultRendering: React.ReactNode | null, props: GridHeaderCellProps) => React.ReactNode;
+    /**
+     * Fires when Grid is scrolled.
+     */
+    onScroll?: (event: GridEvent) => void;
+    /**
+     * Enables virtualization of the columns. If virtualization is enabled, the columns outside the view are not rendered.
+     */
+    columnVirtualization?: boolean;
+    /**
+     * If set to `true`, the user can use dedicated shortcuts to interact with the Grid.
+     * By default, navigation is disabled and the Grid content is accessible in the normal tab sequence.
+     */
+    navigatable?: boolean;
+    /**
+     * Fires when Grid keyboard navigation position is changed.
+     */
+    onNavigationAction?: (event: GridNavigationActionEvent) => void;
+    /**
+     * Fires when the user press keyboard key.
+     */
+    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.
+     * Defaults to `false`.
+     */
+    lockGroups?: boolean;
+    /**
+     * Configures the `size` of the Grid.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     *
+     * @default `medium`
+     */
+    size?: 'small' | 'medium';
+    /**
+     * The event that is fired when the ContextMenu is activated.
+     */
+    onContextMenu?: (event: GridContextMenuEvent) => void;
+    /**
+     * Sets the `id` property of the top div element of the component.
+     */
+    id?: string;
+}
+
+/**
+ * The component for each of the items in the `data` property which the Grid renders.
+ */
+export declare class GridRow extends React_2.Component<GridRowProps, {}> {
+    /**
+     * @hidden
+     */
+    render(): string | number | boolean | Iterable<React_2.ReactNode> | JSX_2.Element | null | undefined;
+}
+
+/**
+ * Represents the object of the `onRowClick` Grid event.
+ */
+export declare interface GridRowClickEvent extends GridEvent {
+    /**
+     * The item from the `data` property of the Grid which corresponds to the row that is clicked.
+     */
+    dataItem: any;
+}
+
+/**
+ * Represents the object of the `onRowDoubleClick` Grid event.
+ */
+export declare interface GridRowDoubleClickEvent extends GridEvent {
+    /**
+     * The item from the `data` property of the Grid which corresponds to the row that is clicked.
+     */
+    dataItem: any;
+}
+
+/**
+ * The props that the Grid passes to the GridRow component when creating it. Accessible during the `rowRender` callback of the Grid.
+ */
+export declare interface GridRowProps extends KendoReactComponentBaseProps {
+    /**
+     * The `data` object that represents the current row.
+     */
+    dataItem: any;
+    /**
+     * Indicates whether the row is an alternating row.
+     */
+    isAltRow: boolean;
+    /**
+     * Indicates whether the row has at least one edit cell.
+     */
+    isInEdit: boolean;
+    /**
+     * Indicates if the row is hidden. The hidden row is rendered above the visible area of the Grid. Occurs when the Grid uses virtualization and the row is on the current page. When `rowHeight` is set, `isHidden` is always `true`.
+     */
+    isHidden: boolean;
+    /**
+     * The event that is fired when the row is clicked.
+     */
+    onClick: any;
+    /**
+     * 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.
+     */
+    rowHeight?: number;
+    /**
+     * 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;
+    /**
+     * The index to be applied to the `aria-rowindex` attribute.
+     */
+    ariaRowIndex?: number;
+    /**
+     * The index of the leaf dataItem in data. Used by selection.
+     */
+    dataIndex: number;
+    /**
+     * Indicates if the row is selected.
+     */
+    isSelected: boolean;
+    /**
+     * @hidden
+     */
+    absoluteRowIndex: number;
+}
+
+/**
+ * The type of the GridRow component.
+ *
+ * The available values are:
+ * - `groupHeader`&mdash;The row is a group header.
+ * - `groupFooter`&mdash;The row is a group footer.
+ * - `data`&mdash;The row corresponds to an item from the `data` collection which is passed to the Grid.
+ */
+declare type GridRowType = 'groupFooter' | 'groupHeader' | 'data';
+
+/**
+ * Represents the available selection modes.
+ */
+export declare type GridSelectableMode = TableSelectableMode;
+
+/**
+ * Represents the Grid selectable settings.
+ */
+export declare interface GridSelectableSettings extends TableSelectableSettings {
+    /**
+     * The available values are:
+     * * `single`
+     * * `multiple`
+     *
+     * @default "multiple"
+     */
+    mode?: GridSelectableMode;
+}
+
+/**
+ * @hidden
+ */
+export declare const GridSelectionCell: (props: GridCellProps) => JSX_2.Element | null;
+
+/**
+ * Represents the object of the `onSelectionChange` Grid event.
+ */
+export declare interface GridSelectionChangeEvent extends GridEvent, TableSelectionChangeEvent<GridClassComponent> {
+}
+
+/**
+ * Represents the object of the `onSortChange` Grid event.
+ */
+export declare interface GridSortChangeEvent extends GridEvent {
+    /**
+     * The new `SortDescriptor` according to the user action.
+     */
+    sort: SortDescriptor[];
+}
+
+/**
+ * The settings for sorting the Grid data.
+ */
+export declare type GridSortSettings = SortSettings;
+
+export declare interface GridTdAttributes extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    [TABLE_COL_INDEX_ATTRIBUTE]?: number;
+    key?: string;
+}
+
+export declare interface GridThAttributes extends React.ThHTMLAttributes<HTMLTableCellElement> {
+    columnId: string;
+    key?: string;
+}
+
+/**
+ * Represents the GridToolbar component.
+ *
+ * @example
+ * ```jsx
+ * class App extends React.Component {
+ *    state = {
+ *       data: [
+ *            {'Column1':'A1', 'Column2':'A2'},
+ *            {'Column1':'B1', 'Column2':'B2'},
+ *            {'Column1':'C1', 'Column2':'C2'}
+ *        ]
+ *    }
+ *
+ *    customClick = () => {
+ *        alert("Custom handler in custom toolbar");
+ *    }
+ *    render() {
+ *        return (
+ *           <Grid data={this.state.data}>
+ *                <GridToolbar>
+ *                    <button
+ *                        title="Click"
+ *                        className="k-button k-primary"
+ *                        onClick={this.customClick}
+ *                    >Click
+ *                    </button>
+ *                </GridToolbar>
+ *            </Grid>
+ *        );
+ *    }
+ * }
+ * ReactDOM.render(
+ *    <App />,
+ *    document.querySelector('my-app')
+ * );
+ * ```
+ */
+export declare class GridToolbar extends React_2.Component<GridToolbarProps, {}> {
+    /**
+     * @hidden
+     */
+    static displayName: string;
+    /**
+     * @hidden
+     */
+    render(): JSX_2.Element;
+}
+
+/**
+ * The properties of the GridToolbar component.
+ */
+export declare interface GridToolbarProps {
+    /**
+     * The React elements that will be rendered inside the toolbar of the Grid.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specifies the name of the CSS class which is set to the GridToolbar.
+     */
+    className?: string;
+    /**
+     * Configures the `size` of the Toolbar.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null&mdash;Does not set a size `className`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large';
+    /**
+     * The accessible label of the GridToolbar component.
+     */
+    ariaLabel?: string;
+    /**
+     * @hidden
+     */
+    ariaControls?: string;
+}
+
+/**
+ * @hidden
+ */
+declare type handler = (prevIndex: number, nextIndex: number, nativeEvent: any) => void;
+
+/**
+ * @hidden
+ */
+export declare const leafColumns: (columns: GridColumnProps[]) => GridColumnProps[];
+
+/**
+ * The text of the filter operators displayed in the filter menu.
+ */
+export declare const operators: GridFilterOperators;
+
+/**
+ * Represents the `skip` and `take` configurations which are wrapped in the `Page` object.
+ */
+declare interface Page {
+    /**
+     * The number of records that will be skipped.
+     */
+    skip: number;
+    /**
+     * The number of records that will be taken.
+     */
+    take: number;
+}
+
+/**
+ * @hidden
+ */
+export declare const pagerFirstPage = "grid.pagerFirstPage";
+
+/**
+ * @hidden
+ */
+export declare const pagerInfo = "grid.pagerInfo";
+
+/**
+ * @hidden
+ */
+export declare const pagerItemPerPage = "grid.pagerItemsPerPage";
+
+/**
+ * @hidden
+ */
+export declare const pagerLastPage = "grid.pagerLastPage";
+
+/**
+ * @hidden
+ */
+export declare const pagerNextPage = "grid.pagerNextPage";
+
+/**
+ * @hidden
+ */
+export declare const pagerPreviousPage = "grid.pagerPreviousPage";
+
+/**
+ * @hidden
+ */
+export declare const rootFilterOrDefault: (rootFilter: CompositeFilterDescriptor | undefined) => CompositeFilterDescriptor;
+
+declare type ScrollMode = 'none' | 'scrollable' | 'virtual';
+
+export { setSelectedState }
+
+/**
+ * Represents the KendoReact Grid's StatusBar component.
+ */
+export declare const StatusBar: React_2.FunctionComponent<StatusBarProps>;
+
+/**
+ * Represents the props of the KendoReact Grid's StatusBar component.
+ */
+export declare interface StatusBarProps {
+    data: StatusItem[];
+}
+
+/**
+ * Represents the arguments of the getStatusData function.
+ */
+export declare interface StatusDataArgs extends Pick<GridSelectionChangeEvent, 'selectedField' | 'dataItems' | 'target'> {
+}
+
+/**
+ * Represents the KendoReact Grid's StatusItem object.
+ */
+export declare interface StatusItem {
+    /**
+     * The type of the status item.
+     * Could be `sum`, `min`, `max`, `average`, `count`, `isTrue`, `isFalse`, `earliest` or `latest`.
+     */
+    type: string;
+    /**
+     * The calculated value of the status item.
+     */
+    value: number | boolean | Date;
+    /**
+     * The formatted value of the status item.
+     */
+    formattedValue: string;
+}
+
+export { }