@progress/kendo-react-grid/interfaces/GridCellProps.d.ts

React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { GridClassStructure } from '@progress/kendo-react-common';
import { GridCellsSettings } from './GridCellsSettings.js';
import { GridRowType } from './GridRowType.js';
import { CellProps, GroupState } from '@progress/kendo-react-data-tools';
import { GridColumnType } from './ColumnType.js';
import { IntlService, LocalizationService } from '@progress/kendo-react-intl';
/**
 * Represents the props of the GridCell component
 * ([more information](https://www.telerik.com/kendo-react-ui/components/grid/cells#toc-grid-cells)).
 */
export interface GridCellProps extends Omit<CellProps, 'onChange' | 'render'> {
    /**
     * The zero-based index of the data item in the data collection.
     */
    dataIndex: number;
    /**
     * The index of the column in the rendered columns collection. Optional.
     */
    columnIndex?: number;
    /**
     * The total number of rendered columns in the Grid. Optional.
     */
    columnsCount?: number;
    /**
     * Defines a set of custom cell components that the Grid will render instead of the default cell.
     */
    cells?: GridCellsSettings;
    /**
     * Specifies the type of the row (e.g., data row, group header, etc.). Optional.
     */
    rowType?: GridRowType;
    /**
     * @hidden
     */
    level?: number;
    /**
     * Triggered when the cell is selected. Provides the event object.
     */
    selectionChange?: (event: {
        syntheticEvent: React.SyntheticEvent<any>;
    }) => void;
    /**
     * Triggered when the cell value is changed. Provides details about the change event.
     */
    onChange?: (event: {
        dataItem: any;
        dataIndex: number;
        syntheticEvent: React.SyntheticEvent<any>;
        field?: string;
        value?: any;
        /** @hidden */
        _expand?: boolean;
        /** @hidden */
        _group?: GroupState;
    }) => void;
    /**
     * Specifies the type of editor to be used when the cell is in edit mode.
     * Supported values are `text`, `numeric`, `boolean`, and `date`.
     */
    editor?: 'text' | 'numeric' | 'boolean' | 'date';
    /**
     * @hidden
     */
    locked?: boolean | undefined;
    /**
     * Triggered when the ContextMenu is activated on the cell.
     * Provides the event object, data item, and field name.
     */
    onContextMenu?: (event: React.MouseEvent<HTMLElement>, dataItem: any, field?: string) => void;
    /**
     * @hidden
     */
    isRtl?: boolean;
    /**
     * @hidden
     */
    unstyled?: GridClassStructure;
    /**
     * @hidden
     */
    rowDataIndex?: number;
    /**
     * @hidden
     */
    columnType?: GridColumnType;
    /**
     * @hidden
     */
    rowReorderable?: boolean;
    /**
     * @hidden
     */
    columnPosition: any;
    /** @hidden */
    group?: GroupState;
    /** @hidden */
    localization?: LocalizationService;
    /** @hidden */
    intl?: IntlService;
    /** @hidden */
    _rowSpan?: {
        count: number | null;
        value: any;
    };
}