@gridkitjs/react 0.10.0 → 0.11.1

package/README.md

@@ -1,7 +1,9 @@
 # @gridkitjs/react
 
 React data-grid components built on
-[`@gridkitjs/core`](https://www.npmjs.com/package/@gridkitjs/core).
+[`@gridkitjs/core`](https://www.npmjs.com/package/@gridkitjs/core) for the
+grid's logic and [`@gridkitjs/dom`](https://www.npmjs.com/package/@gridkitjs/dom)
+for its browser behaviours. Both are installed with it.
 
 > **Early development.** The API is still moving and may break between minor
 > versions.
@@ -58,6 +60,14 @@ The grid is an ARIA grid: one tab stop, with the arrow keys moving cell to cell
 within it, `Ctrl+Arrow` reordering a column and `Alt+Arrow` resizing one. Name
 it with `label`, or a screen reader announces only "grid".
 
+`contextMenu` gives headers, cells and group rows a menu of their own — sort,
+group, autofit, hide and choose columns, select and clear, expand and collapse
+— and `toolbar` puts a toolbar above the grid, with a search box, "Clear
+filters" and "Choose columns" by default. Both list built-in commands by id,
+and `commands` adds your own beside them; the column chooser shows and hides
+columns from either. `messages` translates every string the grid shows or
+announces, and `locale` formats dates and numbers.
+
 Requires React 19.
 
 Full documentation: [github.com/blagojablazhevski/gridkit](https://github.com/blagojablazhevski/gridkit#readme)

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ReactNode, Ref, RefObject } from 'react';
-import { CellSelectEvent as CellSelectEvent$1, CellSelectionChangeEvent as CellSelectionChangeEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnSelectEvent as ColumnSelectEvent$1, ColumnSelectionChangeEvent as ColumnSelectionChangeEvent$1, ColumnsSelectEvent as ColumnsSelectEvent$1, DataColumn as DataColumn$1, GridOptions, PaginationState, SelectionCallbacks as SelectionCallbacks$1, ResolvedRow, DisplayRow, ResolvedColumn as ResolvedColumn$1, ColumnSizingState, ColumnOrderState, ColumnVisibilityState, ColumnSortState, FilterState, GroupByState, GroupExpansionState, AggregateResults, SelectionState, CellSelectionState, GridState, SerializedGridState, SelectedCell as SelectedCell$1, SelectedColumn as SelectedColumn$1 } from '@gridkitjs/core';
-export { Borders, CellSelectionMode, CellSelectionState, CellTemplateContext, ColumnResizeEvent, ColumnSizeDefaults, ColumnSizingState, ColumnVisibilityEvent, ColumnVisibilityState, FilterChangeEvent, FilterEntry, FilterState, GridMessages, GridOptions, GridState, GroupByBarVisibility, HoverableConfig, ResizeMode, ResolvedRow, RowPointerEvent, RowProps, RowSelectEvent, RowSelectionChangeEvent, RowsSelectEvent, SelectableConfig, SelectedCellRef, SelectionMode, SelectionState, SerializedGridState, serializeGridState } from '@gridkitjs/core';
+import { CellSelectEvent as CellSelectEvent$1, CellSelectionChangeEvent as CellSelectionChangeEvent$1, ColumnDefinition as ColumnDefinition$1, ColumnSelectEvent as ColumnSelectEvent$1, ColumnSelectionChangeEvent as ColumnSelectionChangeEvent$1, ColumnsSelectEvent as ColumnsSelectEvent$1, DataColumn as DataColumn$1, GridOptions, PaginationState, SelectionCallbacks as SelectionCallbacks$1, ResolvedRow, DisplayRow, ResolvedColumn as ResolvedColumn$1, ColumnSizingState, ColumnOrderState, ColumnVisibilityState, ColumnSortState, FilterState, GroupByState, GroupExpansionState, AggregateResults, SelectionState, CellSelectionState, GridState, SerializedGridState, GridContextMenuTarget, GridCommandTarget, SelectedCell as SelectedCell$1, SelectedColumn as SelectedColumn$1 } from '@gridkitjs/core';
+export { Borders, CellSelectionMode, CellSelectionState, CellTemplateContext, ColumnResizeEvent, ColumnSizeDefaults, ColumnSizingState, ColumnVisibilityEvent, ColumnVisibilityState, ContextMenuOpenChangeEvent, FilterChangeEvent, FilterEntry, FilterState, GridCommand, GridCommandEvent, GridCommandTarget, GridContextMenuOptions, GridContextMenuRequest, GridContextMenuTarget, GridMessages, GridOptions, GridState, GridToolbarOptions, GroupByBarVisibility, HoverableConfig, MenuEntry, ResizeMode, ResolvedRow, RowPointerEvent, RowProps, RowSelectEvent, RowSelectionChangeEvent, RowsSelectEvent, SelectableConfig, SelectedCellRef, SelectionMode, SelectionState, SerializedGridState, ToolbarEntry, serializeGridState } from '@gridkitjs/core';
 
 /**
  * A column whose header and cells may render arbitrary React content.
@@ -126,7 +126,7 @@ interface DataGridApi<Row> {
      * callbacks once for the whole call, and none when nothing changed.
      */
     selectRows(rowIds: readonly string[], intent?: "replace" | "toggle"): void;
-    /** Expands every group at once — there is no dedicated UI control for it. */
+    /** Expands every group at once, as the `group.expandAll` command does. */
     expandAllGroups(): void;
     /** Collapses every group currently shown at once — see `collapseAllGroups` in `@gridkitjs/core` for what "currently shown" means for a group already nested under a collapsed one. */
     collapseAllGroups(): void;
@@ -186,6 +186,36 @@ interface DataGridApi<Row> {
      * with no rows to measure, is left as it is.
      */
     autoFitColumn(columnId: string): void;
+    /**
+     * `autoFitColumn` for each of the given columns, or for every column shown
+     * when given none.
+     */
+    autoFitColumns(columnIds?: readonly string[]): void;
+    /**
+     * Opens the context menu `target` has, as a right-click there would —
+     * selecting it and focusing its cell first — beside `anchor`, a point in
+     * viewport coordinates or an element, or else below its cell. Says whether
+     * it opened: not for a target not on screen, nor where `contextMenu`
+     * gives no menu.
+     */
+    openContextMenu(target: GridContextMenuTarget, anchor?: {
+        readonly x: number;
+        readonly y: number;
+    } | Element): boolean;
+    /** Closes the context menu, if one is open. */
+    closeContextMenu(): void;
+    /**
+     * Opens the column chooser at the grid's top-end corner, in place of any
+     * panel open; it gives focus back to what had it when it closes.
+     */
+    openColumnChooser(): void;
+    /**
+     * Runs a command by id — a built-in or one of `commands` — on `target`,
+     * `{ area: "grid" }` when left out, when it is visible and enabled there.
+     * Reports it through `onCommand` with `source: "api"`, and says whether it
+     * ran.
+     */
+    runCommand(commandId: string, target?: GridCommandTarget): boolean;
     /** 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. */
@@ -263,7 +293,8 @@ interface InfiniteScrollConfig {
 /**
  * The props that name a React type, and so have no place in the
  * framework-free `GridOptions`: columns whose templates return `ReactNode`,
- * and the pager and infinite-scroll configs whose templates do too.
+ * the pager and infinite-scroll configs whose templates do too, and the
+ * toolbar's custom entries.
  */
 interface ReactRenderSlots<Row> {
     columns?: readonly ColumnDefinition<Row>[] | undefined;
@@ -277,6 +308,8 @@ interface ReactRenderSlots<Row> {
      * bound, so the mounted row count never grows with it either.
      */
     infiniteScroll?: InfiniteScrollConfig | undefined;
+    /** Draws the toolbar's custom entries — `{ type: "custom", id }` — by id. */
+    renderToolbarItem?: ((id: string) => ReactNode) | undefined;
 }
 /**
  * Every grid setting in `@gridkitjs/core`'s `GridOptions`, plus what only
@@ -410,8 +443,8 @@ interface FilterStateApi<Row> {
 }
 /**
  * Reactive filter state read off a mounted `DataGrid`'s `ref`, for a filter
- * bar or search box living outside the grid's own DOM — which, while the grid
- * has no filter UI of its own, is where filtering happens. `setFilter`
+ * bar or search box living outside the grid's own DOM, which sees every change
+ * however it was made — the toolbar's search box included. `setFilter`
  * replaces the whole filter and sends the grid back to its first page.
  *
  * Before the grid mounts, `filter` reads as an empty array and `setFilter`