@gridkitjs/react 0.4.0 → 0.6.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
-import { RowSelectEvent, RowsSelectEvent, RowSelectionChangeEvent, CellSelectEvent as CellSelectEvent$1, CellSelectionChangeEvent as CellSelectionChangeEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnSelectEvent as ColumnSelectEvent$1, ColumnSelectionChangeEvent as ColumnSelectionChangeEvent$1, ColumnsSelectEvent as ColumnsSelectEvent$1, SelectableConfig, SelectionState, CellSelectionState, ColumnSizingState, ColumnOrderState, ColumnSizeDefaults, ColumnResizeEvent, ColumnOrderEvent, ResolvedColumn as ResolvedColumn$1, SelectedCell as SelectedCell$1, SelectedColumn as SelectedColumn$1 } from '@gridkitjs/core';
+import { ReactNode, Ref } from 'react';
+import { RowSelectEvent, RowsSelectEvent, RowSelectionChangeEvent, CellSelectEvent as CellSelectEvent$1, CellSelectionChangeEvent as CellSelectionChangeEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnSelectEvent as ColumnSelectEvent$1, ColumnSelectionChangeEvent as ColumnSelectionChangeEvent$1, ColumnsSelectEvent as ColumnsSelectEvent$1, ResolvedRow, ResolvedColumn as ResolvedColumn$1, ColumnSizingState, ColumnOrderState, ColumnSortState, SelectionState, CellSelectionState, SelectableConfig, ColumnSizeDefaults, ColumnResizeEvent, ColumnOrderEvent, ColumnSortEvent, FilterState, SelectedCell as SelectedCell$1, SelectedColumn as SelectedColumn$1 } from '@gridkitjs/core';
 export { CellSelectionMode, CellSelectionState, CellTemplateContext, ColumnResizeEvent, ColumnSizeDefaults, ColumnSizingState, ResolvedRow, RowSelectEvent, RowSelectionChangeEvent, RowsSelectEvent, SelectableConfig, SelectedCellRef, SelectionMode, SelectionState } from '@gridkitjs/core';
 
 /**
@@ -53,6 +53,42 @@ type ColumnsSelectEvent<Row> = ColumnsSelectEvent$1<Row, ReactNode>;
 type ColumnSelectionChangeEvent<Row> = ColumnSelectionChangeEvent$1<Row, ReactNode>;
 type CellSelectEvent<Row> = CellSelectEvent$1<Row, ReactNode>;
 type CellSelectionChangeEvent<Row> = CellSelectionChangeEvent$1<Row, ReactNode>;
+/**
+ * Imperative handle for a mounted `DataGridComponent`, reached via its `ref`
+ * prop. Read-plus-standard-actions: getters mirror the grid's live state,
+ * and the actions are the ones every grid ref carries (focus, clear/select
+ * all, scroll-to). Sizing, order, sort, and selection stay uncontrolled via
+ * their existing `default*` props — this is not a second, imperative-only
+ * way to drive that same state.
+ */
+interface DataGridApi<Row> {
+    /** The grid's scrollable viewport element. */
+    readonly element: HTMLDivElement | null;
+    /** The grid's `<table>` element. */
+    readonly table: HTMLTableElement | null;
+    /** Rows as currently filtered and sorted — what's rendered. */
+    getRows(): readonly ResolvedRow<Row>[];
+    /** Columns as currently sized and ordered — what's rendered. */
+    getColumns(): readonly ResolvedColumn<Row>[];
+    getColumnSizing(): ColumnSizingState;
+    getColumnOrder(): ColumnOrderState;
+    getColumnSort(): ColumnSortState;
+    getRowSelection(): SelectionState;
+    getColumnSelection(): SelectionState;
+    getCellSelection(): CellSelectionState;
+    /** The cell currently holding the grid's single tab stop. */
+    getFocusedCell(): {
+        rowIndex: number;
+        columnIndex: number;
+    };
+    focusCell(rowIndex: number, columnIndex: number): void;
+    clearSelection(): void;
+    selectAllRows(): void;
+    /** Scrolls the row with the given id into view, if it is currently shown. */
+    scrollToRow(rowId: string, options?: ScrollIntoViewOptions): void;
+    /** Scrolls the column with the given id into view. */
+    scrollToColumn(columnId: string, options?: ScrollIntoViewOptions): void;
+}
 type Borders = "horizontal" | "vertical" | "all" | "none";
 /**
  * How a column's width relates to the grid's.
@@ -138,6 +174,21 @@ interface DataGridProps<Row> extends SelectionCallbacks<Row> {
      * the order as it was does not call it.
      */
     onColumnOrderChange?: ((event: ColumnOrderEvent) => void) | undefined;
+    /**
+     * Whether columns can be sorted by clicking their header toggle, unless a
+     * column says otherwise. Shift-click stacks a column into the sort instead
+     * of replacing it.
+     */
+    sortableColumns?: boolean | undefined;
+    /** The sort to start with, in priority order. Uncontrolled. */
+    defaultColumnSort?: ColumnSortState | undefined;
+    /**
+     * Called once when the user changes the sort — a toggle, a stack, or a
+     * clear back to "none".
+     */
+    onColumnSortChange?: ((event: ColumnSortEvent) => void) | undefined;
+    /** The filter to start with — every applied entry, ANDed together. Uncontrolled. */
+    defaultFilter?: FilterState<Row> | undefined;
     /**
      * The grid's accessible name, announced when it takes focus. A grid without
      * one is read only as "grid", which says nothing about which grid.
@@ -148,7 +199,9 @@ interface DataGridProps<Row> extends SelectionCallbacks<Row> {
      * Takes precedence over `label`, as `aria-labelledby` does.
      */
     labelledBy?: string | undefined;
+    /** Imperative handle for reading live grid state and triggering actions. */
+    ref?: Ref<DataGridApi<Row>> | undefined;
 }
-declare function DataGridComponent<Row>({ dataSource, columns, getRowId, borders, hoverable, selectable, defaultRowSelection, defaultColumnSelection, defaultCellSelection, resizableColumns, reorderableColumns, resizeMode, defaultColumnSizing, defaultColumnOrder, columnSizeDefaults, onColumnResize, onColumnOrderChange, label, labelledBy, ...callbacks }: DataGridProps<Row>): react.JSX.Element;
+declare function DataGridComponent<Row>({ dataSource, columns, getRowId, borders, hoverable, selectable, defaultRowSelection, defaultColumnSelection, defaultCellSelection, resizableColumns, reorderableColumns, resizeMode, defaultColumnSizing, defaultColumnOrder, columnSizeDefaults, onColumnResize, onColumnOrderChange, sortableColumns, defaultColumnSort, onColumnSortChange, defaultFilter, label, labelledBy, ref, ...callbacks }: DataGridProps<Row>): react.JSX.Element;
 
-export { type CellSelectEvent, type CellSelectionChangeEvent, type ColumnDefinition, type ColumnSelectEvent, type ColumnSelectionChangeEvent, type ColumnsSelectEvent, DataGridComponent, type DataGridProps, type ResizeMode, type ResolvedColumn, type SelectedCell, type SelectedColumn };
+export { type Borders, type CellSelectEvent, type CellSelectionChangeEvent, type ColumnDefinition, type ColumnSelectEvent, type ColumnSelectionChangeEvent, type ColumnsSelectEvent, type DataGridApi, DataGridComponent, type DataGridProps, type HoverableConfig, type ResizeMode, type ResolvedColumn, type SelectedCell, type SelectedColumn };