@itwin/itwinui-react/esm/core/Table/cells/EditableCell.d.ts

A react component library for iTwinUI

import * as React from 'react';
import type { CellRendererProps } from '../../../react-table/react-table.js';
export type EditableCellProps<T extends Record<string, unknown>> = CellRendererProps<T> & {
    /**
     * Callback function when cell is edited. It is called only when `onBlur` event is fired.
     * @example
     * const onCellEdit = React.useCallback(
     *  (columnId: string, value: string, rowData: T) => {
     *    setData((oldData) => {
     *      const newData = [...oldData];
     *      const index = oldData.indexOf(rowData);
     *      const newObject = { ...newData[index] };
     *      newObject[columnId] = value;
     *      newData[index] = newObject;
     *      return newData;
     *    });
     *  },
     *  [],
     * );
     */
    onCellEdit: (columnId: string, value: string, rowData: T) => void;
} & React.ComponentPropsWithoutRef<'div'>;
/**
 * Editable cell.
 * It should be passed to `cellRenderer`.
 * @example
 * {
 *   Header: 'Name',
 *   accessor: 'name',
 *   cellRenderer: (props) => <EditableCell {...props} onCellEdit={onCellEditHandler} />,
 * }
 */
export declare const EditableCell: {
    <T extends Record<string, unknown>>(props: EditableCellProps<T>): React.JSX.Element;
    displayName: string;
};