react-konva-grid/dist/hooks/useEditable.d.ts

Declarative React Canvas Grid primitive for Data table, Pivot table, Excel Worksheets

import React from "react";
import { CellInterface, ScrollCoords, CellPosition, GridRef, SelectionArea } from "../Grid";
export interface UseEditableOptions {
    getEditor?: (cell: CellInterface | null) => React.ElementType;
    gridRef: React.MutableRefObject<GridRef>;
    getValue: (cell: CellInterface) => any;
    onChange?: (value: string, coords: CellInterface) => void;
    onCancel?: () => void;
    onSubmit?: (value: string, coords: CellInterface, nextCoords?: CellInterface) => void;
    onDelete?: (activeCell: CellInterface, selections: SelectionArea[]) => void;
    selections: SelectionArea[];
    activeCell: CellInterface | null;
    onBeforeEdit?: (coords: CellInterface) => boolean;
}
export interface EditableResults {
    editorComponent: React.ReactNode;
    onDoubleClick: (e: React.MouseEvent<HTMLInputElement>) => void;
    onScroll: (props: ScrollCoords) => void;
    onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;
    onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => void;
}
export interface EditorProps extends CellInterface {
    onChange: (value: string) => void;
    onSubmit?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
    onCancel?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    scrollPosition: ScrollCoords;
    position: CellPosition;
}
/**
 * Hook to make grid editable
 * @param param
 */
declare const useEditable: ({ getEditor, gridRef, getValue, onChange, onSubmit, onCancel, onDelete, selections, activeCell, onBeforeEdit, }: UseEditableOptions) => EditableResults;
export default useEditable;