/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2026 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ import { GridProps } from './interfaces/GridProps'; import { GridColumnProps } from './interfaces/GridColumnProps'; /** * Represent the `ref` of the Grid component. */ export interface GridHandle { /** * Returns the HTML element of the Grid component. */ element: HTMLDivElement | null; /** * The props values of the Grid. */ props: GridProps; /** * 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. * */ columns: GridColumnProps[]; /** * 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; /** * 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; } /** * Represents the [KendoVue Grid component]({% slug overview_grid %}). * * @remarks * Supported children components are: {@link GridColumn}, {@link GridToolbar}, {@link GridNoRecords}, {@link StatusBar}. * * * export default App; * ``` */ export declare const RootGrid: import('vue').DefineComponent; autoProcessData: import('vue').PropType; topCacheCount: { type: import('vue').PropType; /** * Represent the `ref` of the Grid component. */ default: number; }; collapsedGroups: { type: import('vue').PropType; default: () => any[]; }; uniqueField: import('vue').PropType; totalGroupedHeight: import('vue').PropType; allGroupedItems: import('vue').PropType; alternatePerGroup: import('vue').PropType; columns: import('vue').PropType; columnsState: { type: import('vue').PropType; default: () => any; }; cells: import('vue').PropType; contextMenu: import('vue').PropType boolean | import('.').GridContextMenuOptions)>; rows: import('vue').PropType; defaultColumnsState: { type: import('vue').PropType; default: () => any; }; columnVirtualization: import('vue').PropType; dataItems: import('vue').PropType; sortable: import('vue').PropType; defaultSort: import('vue').PropType; sort: import('vue').PropType; filterable: import('vue').PropType; filterOperators: import('vue').PropType; filterCellRender: import('vue').PropType; headerCellRender: import('vue').PropType; showLoader: { type: import('vue').PropType; default: any; }; loader: import('vue').PropType; lockGroups: import('vue').PropType; pinnable: import('vue').PropType; defaultPinnedTopRows: import('vue').PropType; defaultPinnedBottomRows: import('vue').PropType; pinnedTopRows: import('vue').PropType; pinnedBottomRows: import('vue').PropType; defaultFilter: import('vue').PropType; filter: import('vue').PropType; defaultSearch: import('vue').PropType; search: import('vue').PropType; searchFields: import('vue').PropType<(string | import('@progress/kendo-vue-data-tools').SearchField)[]>; highlight: import('vue').PropType<{ [id: string]: boolean | { [id: string]: boolean; }; }>; pageable: import('vue').PropType; pageSize: import('vue').PropType; total: import('vue').PropType; fixedScroll: import('vue').PropType; skip: import('vue').PropType; defaultSkip: import('vue').PropType; take: import('vue').PropType; defaultTake: import('vue').PropType; expandField: import('vue').PropType; expandColumn: import('vue').PropType; selectedField: import('vue').PropType; cellRender: import('vue').PropType any)>; rowRender: import('vue').PropType any)>; rowSpannable: import('vue').PropType; resizable: import('vue').PropType; reorderable: import('vue').PropType; group: import('vue').PropType; defaultGroup: import('vue').PropType; groupable: import('vue').PropType; groupExpand: import('vue').PropType; defaultGroupExpand: import('vue').PropType; detailExpand: import('vue').PropType; defaultDetailExpand: import('vue').PropType; editField: import('vue').PropType; rowClass: import('vue').PropType; select: import('vue').PropType; defaultSelect: import('vue').PropType; selectable: import('vue').PropType; scrollable: { type: import('vue').PropType; default: string; }; size: { type: import('vue').PropType; default: string; validator: (value: string) => any; }; pager: import('vue').PropType; rowHeight: import('vue').PropType; detailRowHeight: import('vue').PropType; detail: import('vue').PropType; columnMenu: import('vue').PropType; columnMenuAnimate: { type: import('vue').PropType; default: () => boolean; }; columnMenuIcon: import('vue').DefineComponent, {}, {}, { wrapperClass(this: import('@progress/kendo-vue-common').SvgIconAll): { [x: string]: any; [x: number]: any; 'k-icon': boolean; 'k-svg-icon': boolean; 'k-flip-h': boolean; 'k-flip-v': boolean; }; }, { handleClick(e: any): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, { click: any; }, string, import('vue').PublicProps, Readonly> & Readonly<{ onClick?: (...args: any[] | unknown[]) => any; }>, { viewBox: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; dataItemKey: StringConstructor; navigatable: { type: import('vue').PropType; default: boolean; }; onItemchange: import('vue').PropType<(event: import('.').GridItemChangeEvent) => void>; onExpandchange: import('vue').PropType<(event: import('.').GridExpandChangeEvent) => void>; onDatastatechange: import('vue').PropType<(event: import('.').GridDataStateChangeEvent) => void>; onPagechange: import('vue').PropType<(event: import('.').GridPageChangeEvent) => void>; onSortchange: import('vue').PropType<(event: import('.').GridSortChangeEvent) => void>; onFilterchange: import('vue').PropType<(event: import('.').GridFilterChangeEvent) => void>; onGroupchange: import('vue').PropType<(event: import('.').GridGroupChangeEvent) => void>; onSearchchange: import('vue').PropType<(event: import('.').GridSearchChangeEvent) => void>; onGroupexpandchange: import('vue').PropType<(event: import('.').GridGroupExpandChangeEvent) => void>; onDetailexpandchange: import('vue').PropType<(event: import('.').GridDetailExpandChangeEvent) => void>; onContextmenu: import('vue').PropType<(event: import('.').GridContextMenuEvent) => void>; onContextmenuitemclick: import('vue').PropType<(event: import('.').GridContextMenuItemClickEvent) => void>; }>, void, {}, { columnsWithTemplates(): any[]; cellsWithTemplates(): any; rowsWithTemplates(): any; }, { transformTemplate(template: any, listeners: any): any; transformGroupTemplates(group: any, listeners: any): { groupHeader: any; data: any; groupFooter: any; }; transformCellTemplates(cells: any, listeners: any): { headerCell: any; filterCell: any; footerCell: any; groupHeader: any; data: any; groupFooter: any; select: any; hierarchy: any; group: any; edit: { text: any; numeric: any; boolean: any; date: any; }; }; transformRowTemplates(rows: any, listeners: any): { groupHeader: any; data: any; groupFooter: any; pinnedData: any; }; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly; autoProcessData: import('vue').PropType; topCacheCount: { type: import('vue').PropType; /** * Represent the `ref` of the Grid component. */ default: number; }; collapsedGroups: { type: import('vue').PropType; default: () => any[]; }; uniqueField: import('vue').PropType; totalGroupedHeight: import('vue').PropType; allGroupedItems: import('vue').PropType; alternatePerGroup: import('vue').PropType; columns: import('vue').PropType; columnsState: { type: import('vue').PropType; default: () => any; }; cells: import('vue').PropType; contextMenu: import('vue').PropType boolean | import('.').GridContextMenuOptions)>; rows: import('vue').PropType; defaultColumnsState: { type: import('vue').PropType; default: () => any; }; columnVirtualization: import('vue').PropType; dataItems: import('vue').PropType; sortable: import('vue').PropType; defaultSort: import('vue').PropType; sort: import('vue').PropType; filterable: import('vue').PropType; filterOperators: import('vue').PropType; filterCellRender: import('vue').PropType; headerCellRender: import('vue').PropType; showLoader: { type: import('vue').PropType; default: any; }; loader: import('vue').PropType; lockGroups: import('vue').PropType; pinnable: import('vue').PropType; defaultPinnedTopRows: import('vue').PropType; defaultPinnedBottomRows: import('vue').PropType; pinnedTopRows: import('vue').PropType; pinnedBottomRows: import('vue').PropType; defaultFilter: import('vue').PropType; filter: import('vue').PropType; defaultSearch: import('vue').PropType; search: import('vue').PropType; searchFields: import('vue').PropType<(string | import('@progress/kendo-vue-data-tools').SearchField)[]>; highlight: import('vue').PropType<{ [id: string]: boolean | { [id: string]: boolean; }; }>; pageable: import('vue').PropType; pageSize: import('vue').PropType; total: import('vue').PropType; fixedScroll: import('vue').PropType; skip: import('vue').PropType; defaultSkip: import('vue').PropType; take: import('vue').PropType; defaultTake: import('vue').PropType; expandField: import('vue').PropType; expandColumn: import('vue').PropType; selectedField: import('vue').PropType; cellRender: import('vue').PropType any)>; rowRender: import('vue').PropType any)>; rowSpannable: import('vue').PropType; resizable: import('vue').PropType; reorderable: import('vue').PropType; group: import('vue').PropType; defaultGroup: import('vue').PropType; groupable: import('vue').PropType; groupExpand: import('vue').PropType; defaultGroupExpand: import('vue').PropType; detailExpand: import('vue').PropType; defaultDetailExpand: import('vue').PropType; editField: import('vue').PropType; rowClass: import('vue').PropType; select: import('vue').PropType; defaultSelect: import('vue').PropType; selectable: import('vue').PropType; scrollable: { type: import('vue').PropType; default: string; }; size: { type: import('vue').PropType; default: string; validator: (value: string) => any; }; pager: import('vue').PropType; rowHeight: import('vue').PropType; detailRowHeight: import('vue').PropType; detail: import('vue').PropType; columnMenu: import('vue').PropType; columnMenuAnimate: { type: import('vue').PropType; default: () => boolean; }; columnMenuIcon: import('vue').DefineComponent, {}, {}, { wrapperClass(this: import('@progress/kendo-vue-common').SvgIconAll): { [x: string]: any; [x: number]: any; 'k-icon': boolean; 'k-svg-icon': boolean; 'k-flip-h': boolean; 'k-flip-v': boolean; }; }, { handleClick(e: any): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, { click: any; }, string, import('vue').PublicProps, Readonly> & Readonly<{ onClick?: (...args: any[] | unknown[]) => any; }>, { viewBox: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; dataItemKey: StringConstructor; navigatable: { type: import('vue').PropType; default: boolean; }; onItemchange: import('vue').PropType<(event: import('.').GridItemChangeEvent) => void>; onExpandchange: import('vue').PropType<(event: import('.').GridExpandChangeEvent) => void>; onDatastatechange: import('vue').PropType<(event: import('.').GridDataStateChangeEvent) => void>; onPagechange: import('vue').PropType<(event: import('.').GridPageChangeEvent) => void>; onSortchange: import('vue').PropType<(event: import('.').GridSortChangeEvent) => void>; onFilterchange: import('vue').PropType<(event: import('.').GridFilterChangeEvent) => void>; onGroupchange: import('vue').PropType<(event: import('.').GridGroupChangeEvent) => void>; onSearchchange: import('vue').PropType<(event: import('.').GridSearchChangeEvent) => void>; onGroupexpandchange: import('vue').PropType<(event: import('.').GridGroupExpandChangeEvent) => void>; onDetailexpandchange: import('vue').PropType<(event: import('.').GridDetailExpandChangeEvent) => void>; onContextmenu: import('vue').PropType<(event: import('.').GridContextMenuEvent) => void>; onContextmenuitemclick: import('vue').PropType<(event: import('.').GridContextMenuItemClickEvent) => void>; }>> & Readonly<{}>, { size: string; scrollable: string; navigatable: boolean; columnMenuAnimate: boolean; topCacheCount: number; collapsedGroups: any[][]; columnsState: import('.').GridColumnState[]; defaultColumnsState: import('.').GridColumnState[]; showLoader: boolean; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;