@dataverse-kit/grid-kit 0.3.0 → 0.5.0

package/dist/hosts/GroupedGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GroupedGrid.d.ts","sourceRoot":"","sources":["../../src/hosts/GroupedGrid.tsx"],"names":[],"mappings":";AAUA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAqBjD;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CAwGtG"}
+{"version":3,"file":"GroupedGrid.d.ts","sourceRoot":"","sources":["../../src/hosts/GroupedGrid.tsx"],"names":[],"mappings":";AAYA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAqBjD;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CA6HtG"}

package/dist/hosts/ReadOnlyGrid.d.ts

@@ -1,9 +1,16 @@
 /// <reference types="react" />
 import type { ReadOnlyGridProps } from '../types';
 /**
- * Read-only grid: `<DataGrid>` with selection off, editing off, and command-bar
- * commands stripped (search is kept). Mirrors the Grid Customizer's "Read-Only
- * Grid" type — a presentation preset, no extra config.
+ * Read-only grid: `<DataGrid>` with selection off and editing off. Mirrors the
+ * Grid Customizer's "Read-Only Grid" type — a presentation preset.
+ *
+ * The full `toolbar` config is forwarded (including `commands`) so a read-only
+ * grid can still host non-selection toolbar actions — New / Refresh / Export and
+ * the injected Filter / Columns. Selection-DEPENDENT commands (delete/activate)
+ * are inert here because `selectionMode` is forced to `"none"` (nothing can be
+ * selected); the consumer is expected to omit them. Previously this preset
+ * stripped `commands` entirely (search-only); forwarding them is what lets the
+ * read-only bar consolidate into a single host toolbar instead of an external one.
  */
 export declare function ReadOnlyGrid<T extends Record<string, unknown>>(props: ReadOnlyGridProps<T>): JSX.Element;
 //# sourceMappingURL=ReadOnlyGrid.d.ts.map

package/dist/hosts/ReadOnlyGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReadOnlyGrid.d.ts","sourceRoot":"","sources":["../../src/hosts/ReadOnlyGrid.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGlD;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CAMxG"}
+{"version":3,"file":"ReadOnlyGrid.d.ts","sourceRoot":"","sources":["../../src/hosts/ReadOnlyGrid.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGlD;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CAExG"}

package/dist/index.esm.js

@@ -2070,15 +2070,19 @@ function DataGrid(props) {
 }
 
 /**
- * Read-only grid: `<DataGrid>` with selection off, editing off, and command-bar
- * commands stripped (search is kept). Mirrors the Grid Customizer's "Read-Only
- * Grid" type — a presentation preset, no extra config.
+ * Read-only grid: `<DataGrid>` with selection off and editing off. Mirrors the
+ * Grid Customizer's "Read-Only Grid" type — a presentation preset.
+ *
+ * The full `toolbar` config is forwarded (including `commands`) so a read-only
+ * grid can still host non-selection toolbar actions — New / Refresh / Export and
+ * the injected Filter / Columns. Selection-DEPENDENT commands (delete/activate)
+ * are inert here because `selectionMode` is forced to `"none"` (nothing can be
+ * selected); the consumer is expected to omit them. Previously this preset
+ * stripped `commands` entirely (search-only); forwarding them is what lets the
+ * read-only bar consolidate into a single host toolbar instead of an external one.
  */
 function ReadOnlyGrid(props) {
-    const toolbar = props.toolbar
-        ? { showSearch: props.toolbar.showSearch, searchPlaceholder: props.toolbar.searchPlaceholder, onSearch: props.toolbar.onSearch }
-        : undefined;
-    return jsx(DataGrid, { ...props, selectionMode: "none", editable: false, toolbar: toolbar });
+    return jsx(DataGrid, { ...props, selectionMode: "none", editable: false });
 }
 
 // Shared card-layout primitives for the card hosts (`<CardGrid>` flat cards +
@@ -2253,13 +2257,29 @@ const GROUP_CHEVRON_WIDTH = 36;
  * groups + count badges), reusing the same columns/registry as `<DataGrid>`.
  */
 function GroupedGrid(props) {
-    const { items, columns, group, selectionMode = 'none', isLoading, pagination, onPageChange, aggregateItems, toolbar, compact, alternateRowColors, fill, height, rowCommands } = props;
+    const { items, columns, group, selectionMode = 'none', onSelectionChanged, isLoading, pagination, onPageChange, aggregateItems, toolbar, compact, alternateRowColors, fill, height, rowCommands } = props;
     const edit = useEditState();
-    const { ctx } = useGridContext(props, edit);
+    const { ctx, getKeyFn } = useGridContext(props, edit);
     const dlColumns = useMemo(() => toDetailsListColumns(columns, ctx), [columns, ctx]);
     // Per-row right-click menu (DetailsList path, same as DataGrid/NestedInline). No-op when
     // rowCommands is unset (onItemContextMenu is undefined → no handler attached).
     const { onItemContextMenu, contextMenuElement } = useRowContextMenu(rowCommands);
+    // Fluent Selection so a toolbar's selection-gated commands can read the checked rows via
+    // onSelectionChanged. Ported verbatim from <DataGrid> (the grouped DetailsList supports
+    // selection + groups together: the Selection is over the flattened `orderedItems`, and
+    // group headers select-all per group). `getKey` (= the consumer's getKey via getKeyFn) keys
+    // the selection per row; null-safe for enableShimmer placeholder rows. selectionMode='none'
+    // (the default) passes no selection → display-only / per-row-menu-only grids are unchanged.
+    const safeRowKey = (it, index) => it == null ? `__gridkit_shimmer_${index ?? 0}` : getKeyFn(it);
+    const onSelectionChangedRef = useRef(onSelectionChanged);
+    onSelectionChangedRef.current = onSelectionChanged;
+    const selectionRef = useRef();
+    if (!selectionRef.current) {
+        selectionRef.current = new Selection({
+            getKey: (it, index) => safeRowKey(it, index),
+            onSelectionChanged: () => onSelectionChangedRef.current?.(selectionRef.current.getSelection()),
+        });
+    }
     // Bucket by groupBy → ordered items + IGroup[] (DetailsList needs contiguous
     // group ranges). See buildGroups (pure + unit-tested).
     const { orderedItems, groups } = useMemo(() => buildGroups(items, group), [items, group]);
@@ -2291,7 +2311,7 @@ function GroupedGrid(props) {
             });
         }
         : undefined, [alternateRowColors]);
-    return (jsxs(Stack, { styles: fillStackStyles(fill, height), children: [toolbar && jsx(GridToolbar, { config: toolbar }), jsx(FillRegion, { fill: fill, children: jsx(ShimmeredDetailsList, { items: orderedItems, columns: dlColumns, groups: groups, selectionMode: mapSelectionMode$1(selectionMode), layoutMode: DetailsListLayoutMode.justified, compact: compact, setKey: "grid-kit-grouped", onRenderRow: onRenderRow, onItemContextMenu: onItemContextMenu, styles: getDetailsListStyles(), ariaLabelForGrid: "Grouped grid", groupProps: {
+    return (jsxs(Stack, { styles: fillStackStyles(fill, height), children: [toolbar && jsx(GridToolbar, { config: toolbar }), jsx(FillRegion, { fill: fill, children: jsx(ShimmeredDetailsList, { items: orderedItems, columns: dlColumns, groups: groups, selectionMode: mapSelectionMode$1(selectionMode), selection: selectionMode !== 'none' ? selectionRef.current : undefined, getKey: (it, index) => safeRowKey(it, index), layoutMode: DetailsListLayoutMode.justified, compact: compact, setKey: "grid-kit-grouped", onRenderRow: onRenderRow, onItemContextMenu: onItemContextMenu, styles: getDetailsListStyles(), ariaLabelForGrid: "Grouped grid", groupProps: {
                         showEmptyGroups: false,
                         // Render a subtotal under each EXPANDED group. Fluent v8 calls the group
                         // footer renderer even for collapsed groups, so guard on isCollapsed —