fixed-react-data-grid-custom
Version:
Excel-like grid component built with React, with editors, keyboard navigation, copy & paste, and the like
54 lines (53 loc) • 2.17 kB
TypeScript
import React, { KeyboardEvent } from 'react';
import { CalculatedColumn, Editor, CommitEvent, Dimension, Omit } from '../types';
import { InteractionMasksProps, InteractionMasksState } from '../../masks/InteractionMasks';
declare type SharedInteractionMasksProps<R> = Pick<InteractionMasksProps<R>, 'scrollLeft' | 'scrollTop'>;
declare type SharedInteractionMasksState = Pick<InteractionMasksState, 'firstEditorKeyPress'>;
declare type ValueType<R> = R[keyof R];
export interface Props<R> extends SharedInteractionMasksProps<R>, SharedInteractionMasksState, Omit<Dimension, 'zIndex'> {
rowIdx: number;
rowData: R;
value: ValueType<R>;
column: CalculatedColumn<R>;
onGridKeyDown?(e: KeyboardEvent): void;
onCommit(e: CommitEvent<R>): void;
onCommitCancel(): void;
}
interface State {
isInvalid: boolean;
}
export default class EditorContainer<R> extends React.Component<Props<R>, State> {
static displayName: string;
changeCommitted: boolean;
changeCanceled: boolean;
private readonly editor;
readonly state: Readonly<State>;
componentDidMount(): void;
componentDidUpdate(prevProps: Props<R>): void;
componentWillUnmount(): void;
onKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
createEditor(): JSX.Element;
onPressEnter: () => void;
onPressTab: () => void;
onPressEscape: (e: KeyboardEvent) => void;
onPressArrowUpOrDown: (e: KeyboardEvent) => void;
onPressArrowLeft: (e: KeyboardEvent) => void;
onPressArrowRight: (e: KeyboardEvent) => void;
editorHasResults: () => boolean;
editorIsSelectOpen: () => boolean;
getRowMetaData(): unknown;
getEditor: () => Editor<never>;
getInputNode: () => Element | Text | null | undefined;
getInitialValue(): ValueType<R> | string;
commit: (args?: {
key?: string;
}) => void;
commitCancel: () => void;
isNewValueValid: (value: unknown) => boolean;
isCaretAtBeginningOfInput: () => boolean;
isCaretAtEndOfInput: () => boolean;
handleRightClick: (e: React.MouseEvent<HTMLDivElement>) => void;
renderStatusIcon(): false | JSX.Element;
render(): JSX.Element;
}
export {};