@ai-matrx/design-system 0.49.12 → 0.49.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/CHANGELOG.md +33 -0
  2. package/dist/data-table/copy-helpers.d.cts +1 -1
  3. package/dist/data-table/copy-helpers.d.ts +1 -1
  4. package/dist/data-table/facets.cjs +2 -0
  5. package/dist/data-table/facets.cjs.map +1 -1
  6. package/dist/data-table/facets.d.cts +3 -1
  7. package/dist/data-table/facets.d.ts +3 -1
  8. package/dist/data-table/facets.js +2 -0
  9. package/dist/data-table/facets.js.map +1 -1
  10. package/dist/data-table/filter-engine.d.cts +1 -1
  11. package/dist/data-table/filter-engine.d.ts +1 -1
  12. package/dist/data-table/host.d.cts +1 -1
  13. package/dist/data-table/host.d.ts +1 -1
  14. package/dist/data-table/index.cjs +501 -325
  15. package/dist/data-table/index.cjs.map +1 -1
  16. package/dist/data-table/index.d.cts +7 -3
  17. package/dist/data-table/index.d.ts +7 -3
  18. package/dist/data-table/index.js +432 -256
  19. package/dist/data-table/index.js.map +1 -1
  20. package/dist/data-table/infer-filter.d.cts +1 -1
  21. package/dist/data-table/infer-filter.d.ts +1 -1
  22. package/dist/data-table/layered-filters.d.cts +1 -1
  23. package/dist/data-table/layered-filters.d.ts +1 -1
  24. package/dist/data-table/menu-targets.cjs.map +1 -1
  25. package/dist/data-table/menu-targets.d.cts +5 -0
  26. package/dist/data-table/menu-targets.d.ts +5 -0
  27. package/dist/data-table/menu-targets.js.map +1 -1
  28. package/dist/data-table/query-control.d.cts +1 -1
  29. package/dist/data-table/query-control.d.ts +1 -1
  30. package/dist/data-table/types.cjs.map +1 -1
  31. package/dist/data-table/types.d.cts +1 -1
  32. package/dist/data-table/types.d.ts +1 -1
  33. package/dist/data-table/url-state.d.cts +1 -1
  34. package/dist/data-table/url-state.d.ts +1 -1
  35. package/dist/data-table/xlsx.d.cts +1 -1
  36. package/dist/data-table/xlsx.d.ts +1 -1
  37. package/dist/{layered-filters-B-znwvFV.d.cts → layered-filters-BltsILT3.d.cts} +7 -1
  38. package/dist/{layered-filters-Dhfam7uI.d.ts → layered-filters-DrGJ_nuG.d.ts} +7 -1
  39. package/package.json +1 -1
@@ -34157,7 +34157,7 @@ __export(data_table_exports, {
34157
34157
  module.exports = __toCommonJS(data_table_exports);
34158
34158
 
34159
34159
  // src/data-table/MatrxDataTable.tsx
34160
- var import_react21 = require("react");
34160
+ var import_react22 = require("react");
34161
34161
  var import_react_dom3 = require("react-dom");
34162
34162
  var import_core3 = require("@dnd-kit/core");
34163
34163
 
@@ -35238,7 +35238,11 @@ function TableTitleRow({
35238
35238
  "data-matrx-table-toolbar": true,
35239
35239
  className: cn(
35240
35240
  "relative flex min-w-0 shrink-0 items-center gap-2",
35241
- singleRow ? "flex-nowrap overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "flex-wrap",
35241
+ // `max-w-full`: drawn into a page's row slot (`portalInto`), the row is held to the slot's
35242
+ // width, so IT is the scroller its pinned controls stick to — never a row as wide as its
35243
+ // content inside a narrower slot, where "sticky" had nothing to stick to and "New record"
35244
+ // sat past the slot's edge, cut to "N" (merged-grid leftovers, 2026-09-28).
35245
+ singleRow ? "max-w-full flex-nowrap overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "flex-wrap",
35242
35246
  // ONE CONTROL HEIGHT ON A TOOLBAR ROW (lane C, review 2026-09-26: 28/32/44 mixed): a host's
35243
35247
  // tap-target toolbar actions draw at 32px like every other control; a finger (coarse
35244
35248
  // pointer) keeps the 44px floor.
@@ -36731,7 +36735,7 @@ function GenericTablePagination({
36731
36735
  // src/data-table/TableViewTabs.tsx
36732
36736
  var import_react7 = require("react");
36733
36737
  var import_jsx_runtime24 = require("react/jsx-runtime");
36734
- function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone }) {
36738
+ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone, closable = true, addHint = "New view from the current one \xB7 double-click a tab to rename", renameable = true }) {
36735
36739
  const [renaming, setRenaming] = (0, import_react7.useState)(null);
36736
36740
  const [draft, setDraft] = (0, import_react7.useState)("");
36737
36741
  const opened = (0, import_react7.useRef)(null);
@@ -36782,8 +36786,10 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
36782
36786
  tabIndex: tab.id === activeId ? 0 : -1,
36783
36787
  onClick: () => onSelect(tab.id),
36784
36788
  onDoubleClick: () => {
36785
- setDraft(tab.label);
36786
- setRenaming(tab.id);
36789
+ if (renameable && tab.id !== "default") {
36790
+ setDraft(tab.label);
36791
+ setRenaming(tab.id);
36792
+ }
36787
36793
  },
36788
36794
  onKeyDown: (e) => {
36789
36795
  const next = e.key === "ArrowRight" ? (index + 1) % tabs.length : e.key === "ArrowLeft" ? (index + tabs.length - 1) % tabs.length : e.key === "Home" ? 0 : e.key === "End" ? tabs.length - 1 : -1;
@@ -36801,7 +36807,7 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
36801
36807
  ]
36802
36808
  }
36803
36809
  ),
36804
- tabs.length > 1 && tab.id !== "default" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
36810
+ closable && tabs.length > 1 && tab.id !== "default" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
36805
36811
  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", "aria-label": `Close ${tab.label}`, onClick: () => onClose(tab.id), className: "flex size-7 items-center justify-center rounded hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(X, { className: "size-4" }) }) }),
36806
36812
  /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(TooltipContent, { children: [
36807
36813
  "Close ",
@@ -36811,7 +36817,7 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
36811
36817
  ] }, tab.id)),
36812
36818
  /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
36813
36819
  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", "aria-label": "New table tab", onClick: onAdd, className: "flex size-8 shrink-0 items-center justify-center rounded hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Plus, { className: "size-4" }) }) }),
36814
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: "New view from the current one \xB7 double-click a tab to rename" })
36820
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: addHint })
36815
36821
  ] })
36816
36822
  ] }),
36817
36823
  related && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex shrink-0 items-center gap-1 border-l px-2", children: related })
@@ -42172,6 +42178,7 @@ CommandShortcut.displayName = "CommandShortcut";
42172
42178
  var MAX_LISTABLE_FACET_LENGTH = 300;
42173
42179
  var DEFAULT_FACET_LIMIT = 200;
42174
42180
  var MAX_FACET_LIMIT = 500;
42181
+ var CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT = 15;
42175
42182
  function facetText(raw) {
42176
42183
  if (raw === null || raw === void 0) return "";
42177
42184
  if (typeof raw === "object") {
@@ -42298,6 +42305,7 @@ function HeaderMenuItems({
42298
42305
  const disabled = Boolean(item.disabledReason);
42299
42306
  const hasSubmenu = Boolean(item.submenu && item.submenu.length > 0);
42300
42307
  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col", children: [
42308
+ item.separatorBefore ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { role: "separator", className: "-mx-1 my-1 h-px bg-border" }) : null,
42301
42309
  /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
42302
42310
  Button,
42303
42311
  {
@@ -42367,7 +42375,7 @@ function ColumnHeaderCell({
42367
42375
  compact = false,
42368
42376
  marker,
42369
42377
  filterApplyLabel,
42370
- filterShowCancel = false,
42378
+ filterShowCancel,
42371
42379
  filterFooterHint,
42372
42380
  allowNegation = false,
42373
42381
  allowNullModes = false,
@@ -42405,7 +42413,8 @@ function ColumnHeaderCell({
42405
42413
  } : void 0;
42406
42414
  const reorderClass = reorderEnabled ? "touch-none cursor-grab active:cursor-grabbing" : void 0;
42407
42415
  const filterActive = isColumnFilterActive(filterValue);
42408
- const deferredFilter = filterApplyLabel !== void 0 || filterShowCancel || filterFooterHint !== void 0;
42416
+ const deferredFilter = filterKind === "text" || filterApplyLabel !== void 0 || Boolean(filterShowCancel) || filterFooterHint !== void 0;
42417
+ const showFilterCancel = filterShowCancel ?? filterKind === "text";
42409
42418
  const [filterOpen, setFilterOpen] = (0, import_react13.useState)(false);
42410
42419
  const [pendingNegation, setPendingNegation] = (0, import_react13.useState)(false);
42411
42420
  const [draftFilter, setDraftFilter] = (0, import_react13.useState)(filterValue);
@@ -42566,7 +42575,7 @@ function ColumnHeaderCell({
42566
42575
  filterKind && deferredFilter ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "mt-2 border-t border-border pt-2", children: [
42567
42576
  filterFooterHint ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "mb-2 text-xs text-muted-foreground", children: filterFooterHint }) : null,
42568
42577
  /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-end gap-2", children: [
42569
- filterShowCancel ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
42578
+ showFilterCancel ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
42570
42579
  /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", size: "sm", onClick: applyFilter, children: filterApplyLabel ?? "Apply" })
42571
42580
  ] })
42572
42581
  ] }) : null,
@@ -42913,7 +42922,7 @@ function FacetChecklist({
42913
42922
  onChange
42914
42923
  }) {
42915
42924
  const [query, setQuery] = (0, import_react13.useState)("");
42916
- const selected = value?.kind === "select" ? value.values ?? (value.value && value.value !== "__all__" ? [value.value] : []) : [];
42925
+ const selected = value?.kind === "select" ? (value.values ?? (value.value && value.value !== "__all__" ? [value.value] : [])).map((candidate) => candidate === SELECT_EMPTY_VALUE ? "" : candidate) : [];
42917
42926
  const selectedSet = new Set(selected);
42918
42927
  const rows = (0, import_react13.useMemo)(() => {
42919
42928
  if (!facets) return [];
@@ -42931,7 +42940,7 @@ function FacetChecklist({
42931
42940
  const next = new Set(selectedSet);
42932
42941
  if (next.has(candidate)) next.delete(candidate);
42933
42942
  else next.add(candidate);
42934
- const values = [...next];
42943
+ const values = [...next].map((value2) => value2 === "" ? SELECT_EMPTY_VALUE : value2);
42935
42944
  onChange(
42936
42945
  values.length === 0 ? void 0 : { kind: "select", value: values[0] ?? "", values }
42937
42946
  );
@@ -45492,6 +45501,62 @@ function ToolbarListedLabel({ label, children }) {
45492
45501
  ] });
45493
45502
  }
45494
45503
 
45504
+ // src/data-table/pinned-fold.ts
45505
+ var import_react17 = require("react");
45506
+ function pinnedMustFold(room, full) {
45507
+ if (room <= 0 || full === null) return false;
45508
+ return full > room + 0.5;
45509
+ }
45510
+ function usePinnedFold(el, active) {
45511
+ const [folded, setFolded] = (0, import_react17.useState)(false);
45512
+ const full = (0, import_react17.useRef)(null);
45513
+ const current = (0, import_react17.useRef)(false);
45514
+ (0, import_react17.useEffect)(() => {
45515
+ if (!active || !el) {
45516
+ if (current.current) {
45517
+ current.current = false;
45518
+ setFolded(false);
45519
+ }
45520
+ return;
45521
+ }
45522
+ const row = el.closest("[data-matrx-table-toolbar]") ?? el.parentElement;
45523
+ if (!row) return;
45524
+ let pending = 0;
45525
+ let stopped = false;
45526
+ const measure = () => {
45527
+ pending = 0;
45528
+ if (stopped) return;
45529
+ if (!current.current) {
45530
+ const width = Math.max(el.getBoundingClientRect().width || 0, el.scrollWidth || 0);
45531
+ if (width > 0) full.current = width;
45532
+ }
45533
+ const next = pinnedMustFold(row.clientWidth, full.current);
45534
+ if (next !== current.current) {
45535
+ current.current = next;
45536
+ setFolded(next);
45537
+ }
45538
+ };
45539
+ const schedule = () => {
45540
+ if (pending) return;
45541
+ pending = typeof requestAnimationFrame === "function" && typeof document !== "undefined" && document.visibilityState !== "hidden" ? requestAnimationFrame(measure) : setTimeout(measure, 0);
45542
+ };
45543
+ const sizes = typeof ResizeObserver === "function" ? new ResizeObserver(schedule) : null;
45544
+ sizes?.observe(row);
45545
+ sizes?.observe(el);
45546
+ const content = typeof MutationObserver === "function" ? new MutationObserver(schedule) : null;
45547
+ content?.observe(el, { childList: true, subtree: true, characterData: true });
45548
+ if (typeof window !== "undefined") window.addEventListener("resize", schedule);
45549
+ measure();
45550
+ return () => {
45551
+ stopped = true;
45552
+ sizes?.disconnect();
45553
+ content?.disconnect();
45554
+ if (typeof window !== "undefined") window.removeEventListener("resize", schedule);
45555
+ };
45556
+ }, [el, active]);
45557
+ return folded;
45558
+ }
45559
+
45495
45560
  // src/data-table/coverage.ts
45496
45561
  var PARTIAL_BADGE = "Partial";
45497
45562
  var UNKNOWN_TOTAL_BADGE = "Unknown total";
@@ -45640,7 +45705,7 @@ function rankTableSearchRows(rows, columns, query, options = {}, extraText) {
45640
45705
  }
45641
45706
 
45642
45707
  // src/data-table/ColumnManager.tsx
45643
- var import_react17 = require("react");
45708
+ var import_react18 = require("react");
45644
45709
  var import_core2 = require("@dnd-kit/core");
45645
45710
  var import_jsx_runtime43 = require("react/jsx-runtime");
45646
45711
  function ColumnManager({
@@ -45651,15 +45716,15 @@ function ColumnManager({
45651
45716
  hidden,
45652
45717
  onApply
45653
45718
  }) {
45654
- const byId = (0, import_react17.useMemo)(
45719
+ const byId = (0, import_react18.useMemo)(
45655
45720
  () => new Map(columns.map((column) => [columnId(column), column])),
45656
45721
  [columns]
45657
45722
  );
45658
- const [draftOrder, setDraftOrder] = (0, import_react17.useState)(order);
45659
- const [draftHidden, setDraftHidden] = (0, import_react17.useState)(() => new Set(hidden));
45660
- const [draggedColumnId, setDraggedColumnId] = (0, import_react17.useState)(null);
45661
- const [dropTarget, setDropTarget] = (0, import_react17.useState)(null);
45662
- (0, import_react17.useEffect)(() => {
45723
+ const [draftOrder, setDraftOrder] = (0, import_react18.useState)(order);
45724
+ const [draftHidden, setDraftHidden] = (0, import_react18.useState)(() => new Set(hidden));
45725
+ const [draggedColumnId, setDraggedColumnId] = (0, import_react18.useState)(null);
45726
+ const [dropTarget, setDropTarget] = (0, import_react18.useState)(null);
45727
+ (0, import_react18.useEffect)(() => {
45663
45728
  if (!open) return;
45664
45729
  setDraftOrder(order);
45665
45730
  setDraftHidden(new Set(hidden));
@@ -46146,7 +46211,7 @@ var layeredRuleSchema = import_zod2.z.object({ id: import_zod2.z.string().min(1)
46146
46211
  var snapshotSchema = import_zod2.z.object({
46147
46212
  __kind: import_zod2.z.literal("matrx-table-view"),
46148
46213
  version: import_zod2.z.literal(1),
46149
- query: import_zod2.z.object({ pageSize: import_zod2.z.number().int().positive(), search: import_zod2.z.string(), searchMatchMode: import_zod2.z.enum(["contains", "whole_words"]).optional(), searchScope: import_zod2.z.string().min(1).optional(), anyOf: import_zod2.z.string(), layeredFilters: import_zod2.z.array(layeredRuleSchema).optional(), columnFilters: import_zod2.z.record(import_zod2.z.string(), filterSchema.optional()), sort: import_zod2.z.object({ id: import_zod2.z.string().min(1), direction: import_zod2.z.enum(["asc", "desc"]) }).nullable() }),
46214
+ query: import_zod2.z.object({ pageSize: import_zod2.z.number().int().nonnegative(), search: import_zod2.z.string(), searchMatchMode: import_zod2.z.enum(["contains", "whole_words"]).optional(), searchScope: import_zod2.z.string().min(1).optional(), anyOf: import_zod2.z.string(), layeredFilters: import_zod2.z.array(layeredRuleSchema).optional(), columnFilters: import_zod2.z.record(import_zod2.z.string(), filterSchema.optional()), sort: import_zod2.z.object({ id: import_zod2.z.string().min(1), direction: import_zod2.z.enum(["asc", "desc"]) }).nullable() }),
46150
46215
  columns: import_zod2.z.object({
46151
46216
  order: import_zod2.z.array(import_zod2.z.string().min(1)).refine((order) => new Set(order).size === order.length, {
46152
46217
  message: "Column order must not contain duplicate IDs"
@@ -46201,7 +46266,7 @@ function parseTableViewSnapshot(raw) {
46201
46266
  }
46202
46267
 
46203
46268
  // src/data-table/MatrxUuidCell.tsx
46204
- var import_react18 = require("react");
46269
+ var import_react19 = require("react");
46205
46270
  var import_jsx_runtime44 = require("react/jsx-runtime");
46206
46271
  var SHORT_LEN = 8;
46207
46272
  function shortUuid(id, len = SHORT_LEN) {
@@ -46241,11 +46306,11 @@ function MatrxUuidCell({
46241
46306
  }) {
46242
46307
  const { resolveEntityDoors, ResourcePeek } = useMatrxDataTableHost();
46243
46308
  const { notify, notice } = useTableNotice();
46244
- const [copied, setCopied] = (0, import_react18.useState)(false);
46245
- const [opening, setOpening] = (0, import_react18.useState)(false);
46246
- const [peekOpen, setPeekOpen] = (0, import_react18.useState)(false);
46247
- const timer = (0, import_react18.useRef)(null);
46248
- (0, import_react18.useEffect)(
46309
+ const [copied, setCopied] = (0, import_react19.useState)(false);
46310
+ const [opening, setOpening] = (0, import_react19.useState)(false);
46311
+ const [peekOpen, setPeekOpen] = (0, import_react19.useState)(false);
46312
+ const timer = (0, import_react19.useRef)(null);
46313
+ (0, import_react19.useEffect)(
46249
46314
  () => () => {
46250
46315
  if (timer.current) clearTimeout(timer.current);
46251
46316
  },
@@ -46540,7 +46605,7 @@ function DataRowInspector({
46540
46605
  }
46541
46606
 
46542
46607
  // src/data-table/DataRowWindow.tsx
46543
- var import_react19 = require("react");
46608
+ var import_react20 = require("react");
46544
46609
  var import_jsx_runtime46 = require("react/jsx-runtime");
46545
46610
  function DataRowWindow({
46546
46611
  isOpen,
@@ -46561,8 +46626,8 @@ function DataRowWindow({
46561
46626
  const hasEdit = editContent != null;
46562
46627
  const hasTabs = hasEdit && children == null;
46563
46628
  const initialTab = defaultTab ?? (hasEdit ? "edit" : "view");
46564
- const [tab, setTab] = (0, import_react19.useState)(initialTab);
46565
- (0, import_react19.useEffect)(() => {
46629
+ const [tab, setTab] = (0, import_react20.useState)(initialTab);
46630
+ (0, import_react20.useEffect)(() => {
46566
46631
  if (!isOpen) return;
46567
46632
  setTab(defaultTab ?? (hasEdit ? "edit" : "view"));
46568
46633
  }, [isOpen, windowId, hasEdit, defaultTab]);
@@ -47803,7 +47868,7 @@ function DirtySavePill({
47803
47868
  }
47804
47869
 
47805
47870
  // src/data-table/EditableTableCell.tsx
47806
- var import_react20 = require("react");
47871
+ var import_react21 = require("react");
47807
47872
  var import_jsx_runtime49 = require("react/jsx-runtime");
47808
47873
  function CellRefusal({ reason }) {
47809
47874
  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -47865,12 +47930,12 @@ function EditableTableCell({
47865
47930
  editRequest,
47866
47931
  editSeed
47867
47932
  }) {
47868
- const [open, setOpen] = (0, import_react20.useState)(false);
47869
- const [refusal, setRefusal] = (0, import_react20.useState)(null);
47870
- (0, import_react20.useEffect)(() => {
47933
+ const [open, setOpen] = (0, import_react21.useState)(false);
47934
+ const [refusal, setRefusal] = (0, import_react21.useState)(null);
47935
+ (0, import_react21.useEffect)(() => {
47871
47936
  if (editRequest !== void 0) setOpen(true);
47872
47937
  }, [editRequest]);
47873
- (0, import_react20.useEffect)(() => {
47938
+ (0, import_react21.useEffect)(() => {
47874
47939
  if (!open) setRefusal(null);
47875
47940
  }, [open]);
47876
47941
  const usePencil = Boolean(href) || editTrigger === "pencil";
@@ -47974,13 +48039,13 @@ function InlineStringEditor({
47974
48039
  editRequest,
47975
48040
  editSeed
47976
48041
  }) {
47977
- const [editing, setEditing] = (0, import_react20.useState)(false);
47978
- const [draft, setDraft] = (0, import_react20.useState)(value);
47979
- const [refusal, setRefusal] = (0, import_react20.useState)(null);
47980
- const handledEditRequest = (0, import_react20.useRef)(void 0);
47981
- const seedRef = (0, import_react20.useRef)(editSeed);
48042
+ const [editing, setEditing] = (0, import_react21.useState)(false);
48043
+ const [draft, setDraft] = (0, import_react21.useState)(value);
48044
+ const [refusal, setRefusal] = (0, import_react21.useState)(null);
48045
+ const handledEditRequest = (0, import_react21.useRef)(void 0);
48046
+ const seedRef = (0, import_react21.useRef)(editSeed);
47982
48047
  seedRef.current = editSeed;
47983
- (0, import_react20.useEffect)(() => {
48048
+ (0, import_react21.useEffect)(() => {
47984
48049
  if (editRequest === void 0 || handledEditRequest.current === editRequest) return;
47985
48050
  handledEditRequest.current = editRequest;
47986
48051
  setDraft(seedRef.current ?? value);
@@ -48140,8 +48205,8 @@ function DateEditor({
48140
48205
  onCommit,
48141
48206
  onCancel
48142
48207
  }) {
48143
- const [draft, setDraft] = (0, import_react20.useState)(value);
48144
- const done = (0, import_react20.useRef)(false);
48208
+ const [draft, setDraft] = (0, import_react21.useState)(value);
48209
+ const done = (0, import_react21.useRef)(false);
48145
48210
  const finish = () => {
48146
48211
  if (done.current) return;
48147
48212
  done.current = true;
@@ -48176,8 +48241,8 @@ function TagsEditor({
48176
48241
  onCommit,
48177
48242
  onCancel
48178
48243
  }) {
48179
- const [tags, setTags] = (0, import_react20.useState)(value);
48180
- const [draft, setDraft] = (0, import_react20.useState)("");
48244
+ const [tags, setTags] = (0, import_react21.useState)(value);
48245
+ const [draft, setDraft] = (0, import_react21.useState)("");
48181
48246
  const add = (raw) => {
48182
48247
  const next = raw.trim();
48183
48248
  if (!next || tags.includes(next)) return;
@@ -48274,7 +48339,7 @@ function NumberEditor({
48274
48339
  onCommit,
48275
48340
  onCancel
48276
48341
  }) {
48277
- const [draft, setDraft] = (0, import_react20.useState)(String(value));
48342
+ const [draft, setDraft] = (0, import_react21.useState)(String(value));
48278
48343
  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
48279
48344
  /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
48280
48345
  Input,
@@ -48678,6 +48743,7 @@ function safeQueryPage(requestedPage, totalItems, pageSize) {
48678
48743
 
48679
48744
  // src/data-table/MatrxDataTable.tsx
48680
48745
  var import_jsx_runtime51 = require("react/jsx-runtime");
48746
+ var EMPTY_TABLE_ROWS = [];
48681
48747
  function TableToolbarAction({
48682
48748
  HostAction,
48683
48749
  ariaLabel,
@@ -48702,7 +48768,7 @@ function TableToolbarAction({
48702
48768
  disabled,
48703
48769
  onClick,
48704
48770
  children: [
48705
- (0, import_react21.isValidElement)(children) ? (0, import_react21.cloneElement)(children, { className: cn("h-4 w-4", children.props.className) }) : children,
48771
+ (0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-4 w-4", children.props.className) }) : children,
48706
48772
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { children: ariaLabel })
48707
48773
  ]
48708
48774
  }
@@ -48724,7 +48790,7 @@ function TableToolbarAction({
48724
48790
  "aria-busy": busy || void 0,
48725
48791
  disabled,
48726
48792
  onClick,
48727
- children: (0, import_react21.isValidElement)(children) ? (0, import_react21.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
48793
+ children: (0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
48728
48794
  }
48729
48795
  ) }) }),
48730
48796
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TooltipContent, { children: tooltip ?? ariaLabel })
@@ -48787,7 +48853,7 @@ function MatrxDataTableWithUrlState({
48787
48853
  ...urlState.history === void 0 ? {} : { history: urlState.history },
48788
48854
  ...urlState.textHistory === void 0 ? {} : { textHistory: urlState.textHistory }
48789
48855
  });
48790
- (0, import_react21.useEffect)(() => {
48856
+ (0, import_react22.useEffect)(() => {
48791
48857
  if (activeUrlTableIds.has(urlState.id)) {
48792
48858
  throw new Error(
48793
48859
  `Duplicate MatrxDataTable urlState.id "${urlState.id}" on one page. Give every table a unique stable id.`
@@ -48896,7 +48962,7 @@ var DND_MEASURING = { droppable: { strategy: import_core3.MeasuringStrategy.Alwa
48896
48962
  var NO_LAYERED_FILTERS = [];
48897
48963
  var NO_GROUPING_VALUE = "__matrx_no_grouping__";
48898
48964
  function useRenderEpoch(values) {
48899
- const held = (0, import_react21.useRef)(null);
48965
+ const held = (0, import_react22.useRef)(null);
48900
48966
  const previous = held.current;
48901
48967
  if (previous !== null && previous.values.length === values.length && previous.values.every((value, i) => Object.is(value, values[i]))) {
48902
48968
  return previous.epoch;
@@ -48938,10 +49004,10 @@ function versionFacts(version2) {
48938
49004
  function sameBodyRow(a, b) {
48939
49005
  return a.row === b.row && a.index === b.index && a.epoch === b.epoch && a.rowId === b.rowId && a.facts.length === b.facts.length && a.facts.every((fact, i) => Object.is(fact, b.facts[i]));
48940
49006
  }
48941
- var MatrxTableBodyRow = (0, import_react21.memo)(function MatrxTableBodyRow2({ row, index, render }) {
49007
+ var MatrxTableBodyRow = (0, import_react22.memo)(function MatrxTableBodyRow2({ row, index, render }) {
48942
49008
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render(row, index) });
48943
49009
  }, sameBodyRow);
48944
- var MatrxTableChrome = (0, import_react21.memo)(function MatrxTableChrome2({ render }) {
49010
+ var MatrxTableChrome = (0, import_react22.memo)(function MatrxTableChrome2({ render }) {
48945
49011
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render() });
48946
49012
  }, (a, b) => a.part === b.part && a.epoch === b.epoch);
48947
49013
  function columnsSignature(columns) {
@@ -49040,9 +49106,9 @@ function MatrxDataTableCore(coreProps) {
49040
49106
  } = coreProps;
49041
49107
  const appendQuery = query?.mode === "controlled-append" ? query : null;
49042
49108
  const appendQueryKey = appendQuery?.pagination.queryKey ?? null;
49043
- const committedAppendQueryKey = (0, import_react21.useRef)(appendQueryKey);
49109
+ const committedAppendQueryKey = (0, import_react22.useRef)(appendQueryKey);
49044
49110
  const appendSourceChanged = appendQuery !== null && committedAppendQueryKey.current !== appendQueryKey;
49045
- const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ?? [];
49111
+ const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ?? EMPTY_TABLE_ROWS;
49046
49112
  const readView = tableReadView(read, data.length, appendQuery ? appendQuery.pagination.loading : suppliedLoading);
49047
49113
  const isLoading = readView.loading;
49048
49114
  const isFetching = appendQuery ? appendQuery.pagination.isFetchingNextPage : suppliedFetching;
@@ -49053,19 +49119,21 @@ function MatrxDataTableCore(coreProps) {
49053
49119
  const ContextMenuBoundary = host.ContextMenuBoundary ?? TableContextPassthrough;
49054
49120
  const resolvedDensity = density ?? host.defaultDensity ?? "normal";
49055
49121
  const SavedViews = host.SavedViews;
49122
+ const savedViewsId = tableId ?? urlState?.id;
49123
+ const showViewTabs = viewTabs && Boolean(viewTabsStore || savedViewsId && SavedViews);
49056
49124
  const Link = host.Link ?? DefaultTableLink;
49057
49125
  const SidePanelSurface = host.SidePanelSurface ?? DefaultTableSidePanel;
49058
49126
  const { notify: toast, notice } = useTableNotice();
49059
- const [savedViewError, setSavedViewError] = (0, import_react21.useState)(null);
49060
- const [toolbarActionError, setToolbarActionError] = (0, import_react21.useState)(null);
49061
- const [toolbarActionPending, setToolbarActionPending] = (0, import_react21.useState)({ refresh: false, add: false });
49062
- const toolbarActionPendingRef = (0, import_react21.useRef)({ refresh: false, add: false });
49127
+ const [savedViewError, setSavedViewError] = (0, import_react22.useState)(null);
49128
+ const [toolbarActionError, setToolbarActionError] = (0, import_react22.useState)(null);
49129
+ const [toolbarActionPending, setToolbarActionPending] = (0, import_react22.useState)({ refresh: false, add: false });
49130
+ const toolbarActionPendingRef = (0, import_react22.useRef)({ refresh: false, add: false });
49063
49131
  const CHECKBOX_TAP_AREA = "h-4 w-4 touch-manipulation";
49064
49132
  const mobileCardsClass = mobileCardsBreakpoint === "lg" ? "lg:hidden" : "sm:hidden";
49065
49133
  const tableWithCardsClass = mobileCardsBreakpoint === "lg" ? "max-lg:hidden" : "max-sm:hidden";
49066
49134
  const cardsQuery = mobileCardsBreakpoint === "lg" ? "(max-width: 1023px)" : "(max-width: 639px)";
49067
- const [cardsActive, setCardsActive] = (0, import_react21.useState)(null);
49068
- (0, import_react21.useEffect)(() => {
49135
+ const [cardsActive, setCardsActive] = (0, import_react22.useState)(null);
49136
+ (0, import_react22.useEffect)(() => {
49069
49137
  if (!mobileCards || typeof window === "undefined" || !window.matchMedia) return;
49070
49138
  const mql = window.matchMedia(cardsQuery);
49071
49139
  const read2 = () => setCardsActive(mql.matches);
@@ -49081,12 +49149,12 @@ function MatrxDataTableCore(coreProps) {
49081
49149
  const appendDefaultsToSourceProcessing = appendQuery !== null && sourceProcessing === void 0;
49082
49150
  const sourceColumnFilterOwnership = sourceProcessing?.columnFilters;
49083
49151
  const sourceOwnsColumnFilters = appendDefaultsToSourceProcessing ? true : sourceColumnFilterOwnership === "source" || typeof sourceColumnFilterOwnership === "object" && sourceColumnFilterOwnership.source.length > 0;
49084
- const remoteQueryUsesLocalColumnFilters = remoteQuery !== null && sourceColumnFilterOwnership === "local";
49152
+ const remoteQueryUsesLocalProcessing = remoteQuery !== null && (sourceColumnFilterOwnership === "local" || remoteQuery.mode === "controlled" && (sourceProcessing?.search === "local" || sourceProcessing?.sort === "local"));
49085
49153
  const sourceOwnsSort = appendQuery !== null && sourceProcessing === void 0 ? true : sourceProcessing?.sort === "source";
49086
49154
  const sourceOwnsIntelligentSearch = sourceProcessing?.intelligentSearch === "source";
49087
- const sourceOwnsSearch = remoteQuery?.mode === "controlled" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
49155
+ const sourceOwnsSearch = remoteQuery?.mode === "controlled" && sourceProcessing?.search !== "local" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
49088
49156
  const intelligentSearchEnabled = toolbar?.intelligentSearch !== void 0 && (sourceOwnsIntelligentSearch || remoteQuery === null && !sourceOwnsSearch);
49089
- const emitControlledQueryChange = (0, import_react21.useCallback)(
49157
+ const emitControlledQueryChange = (0, import_react22.useCallback)(
49090
49158
  (patch, options) => {
49091
49159
  if (!controlledQuery) return;
49092
49160
  controlledQuery.onStateChange(
@@ -49095,8 +49163,8 @@ function MatrxDataTableCore(coreProps) {
49095
49163
  },
49096
49164
  [controlledQuery]
49097
49165
  );
49098
- const [internalSearch, setInternalSearch] = (0, import_react21.useState)("");
49099
- const [draggedRowId, setDraggedRowId] = (0, import_react21.useState)(null);
49166
+ const [internalSearch, setInternalSearch] = (0, import_react22.useState)("");
49167
+ const [draggedRowId, setDraggedRowId] = (0, import_react22.useState)(null);
49100
49168
  const hierarchySensors = (0, import_core3.useSensors)((0, import_core3.useSensor)(import_core3.PointerSensor, POINTER_SENSOR_OPTIONS));
49101
49169
  const toolbarSearchControlled = toolbar?.searchValue !== void 0;
49102
49170
  const searchValue = controlledQuery ? controlledQuery.state.search : toolbarSearchControlled ? toolbar?.searchValue ?? "" : internalSearch;
@@ -49108,7 +49176,7 @@ function MatrxDataTableCore(coreProps) {
49108
49176
  }
49109
49177
  toolbar?.onSearchChange?.(v);
49110
49178
  };
49111
- const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react21.useState)(
49179
+ const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react22.useState)(
49112
49180
  toolbar?.searchMatch?.defaultMode ?? "contains"
49113
49181
  );
49114
49182
  const searchMatchMode = controlledQuery ? controlledQuery.state.searchMatchMode ?? toolbar?.searchMatch?.defaultMode ?? "contains" : internalSearchMatchMode;
@@ -49119,7 +49187,7 @@ function MatrxDataTableCore(coreProps) {
49119
49187
  }
49120
49188
  setInternalSearchMatchMode(mode);
49121
49189
  };
49122
- const [internalSearchScope, setInternalSearchScope] = (0, import_react21.useState)("all");
49190
+ const [internalSearchScope, setInternalSearchScope] = (0, import_react22.useState)("all");
49123
49191
  const searchScope = controlledQuery ? controlledQuery.state.searchScope ?? "all" : internalSearchScope;
49124
49192
  const setSearchScope = (scope) => {
49125
49193
  if (controlledQuery) {
@@ -49128,7 +49196,7 @@ function MatrxDataTableCore(coreProps) {
49128
49196
  }
49129
49197
  setInternalSearchScope(scope);
49130
49198
  };
49131
- const [internalAnyOf, setInternalAnyOf] = (0, import_react21.useState)("");
49199
+ const [internalAnyOf, setInternalAnyOf] = (0, import_react22.useState)("");
49132
49200
  const toolbarAnyOfControlled = toolbar?.anyOf?.value !== void 0;
49133
49201
  const anyOfValue = controlledQuery ? controlledQuery.state.anyOf : toolbarAnyOfControlled ? toolbar?.anyOf?.value ?? "" : internalAnyOf;
49134
49202
  const setAnyOfValue = (v) => {
@@ -49139,7 +49207,7 @@ function MatrxDataTableCore(coreProps) {
49139
49207
  }
49140
49208
  toolbar?.anyOf?.onChange?.(v);
49141
49209
  };
49142
- const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react21.useState)([]);
49210
+ const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react22.useState)([]);
49143
49211
  const layeredFilters = controlledQuery ? controlledQuery.state.layeredFilters ?? NO_LAYERED_FILTERS : internalLayeredFilters;
49144
49212
  const setLayeredFilters = (next) => {
49145
49213
  if (controlledQuery) {
@@ -49148,9 +49216,9 @@ function MatrxDataTableCore(coreProps) {
49148
49216
  }
49149
49217
  setInternalLayeredFilters(next);
49150
49218
  };
49151
- const [internalColumnFilters, setInternalColumnFilters] = (0, import_react21.useState)({});
49219
+ const [internalColumnFilters, setInternalColumnFilters] = (0, import_react22.useState)({});
49152
49220
  const columnFilters = controlledQuery ? controlledQuery.state.columnFilters : internalColumnFilters;
49153
- const localColumnFilters = (0, import_react21.useMemo)(() => {
49221
+ const localColumnFilters = (0, import_react22.useMemo)(() => {
49154
49222
  if (appendDefaultsToSourceProcessing) return {};
49155
49223
  if (sourceColumnFilterOwnership === "source") return {};
49156
49224
  if (sourceColumnFilterOwnership === void 0 || sourceColumnFilterOwnership === "local") {
@@ -49172,7 +49240,7 @@ function MatrxDataTableCore(coreProps) {
49172
49240
  }
49173
49241
  setInternalColumnFilters(nextFilters);
49174
49242
  };
49175
- const [internalSort, setInternalSort] = (0, import_react21.useState)(defaultSort);
49243
+ const [internalSort, setInternalSort] = (0, import_react22.useState)(defaultSort);
49176
49244
  const sort = controlledQuery ? controlledQuery.state.sort : internalSort;
49177
49245
  const setSort = (next) => {
49178
49246
  if (controlledQuery) {
@@ -49181,7 +49249,7 @@ function MatrxDataTableCore(coreProps) {
49181
49249
  }
49182
49250
  setInternalSort(next);
49183
49251
  };
49184
- const [internalPage, setInternalPage] = (0, import_react21.useState)(1);
49252
+ const [internalPage, setInternalPage] = (0, import_react22.useState)(1);
49185
49253
  const page = controlledQuery ? controlledQuery.state.page : internalPage;
49186
49254
  const setPage = (next) => {
49187
49255
  if (controlledQuery) {
@@ -49190,7 +49258,7 @@ function MatrxDataTableCore(coreProps) {
49190
49258
  }
49191
49259
  setInternalPage(next);
49192
49260
  };
49193
- const [internalPageSize, setInternalPageSize] = (0, import_react21.useState)(
49261
+ const [internalPageSize, setInternalPageSize] = (0, import_react22.useState)(
49194
49262
  defaultPageSize
49195
49263
  );
49196
49264
  const pageSize = controlledQuery ? controlledQuery.state.pageSize : internalPageSize;
@@ -49201,28 +49269,28 @@ function MatrxDataTableCore(coreProps) {
49201
49269
  }
49202
49270
  setInternalPageSize(next);
49203
49271
  };
49204
- const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react21.useState)(null);
49272
+ const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react22.useState)(null);
49205
49273
  const rawSelectedId = controlledSelectedId !== void 0 ? controlledSelectedId : uncontrolledSelectedId;
49206
49274
  const selectedId = appendSourceChanged ? null : rawSelectedId;
49207
49275
  const setSelectedId = (id) => {
49208
49276
  if (controlledSelectedId === void 0) setUncontrolledSelectedId(id);
49209
49277
  onSelectedIdChange?.(id);
49210
49278
  };
49211
- const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react21.useState)(null);
49279
+ const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react22.useState)(null);
49212
49280
  const rawWindowRowId = controlledWindowRowId !== void 0 ? controlledWindowRowId : uncontrolledWindowRowId;
49213
49281
  const windowRowId = appendSourceChanged ? null : rawWindowRowId;
49214
49282
  const setWindowRowId = (id) => {
49215
49283
  if (controlledWindowRowId === void 0) setUncontrolledWindowRowId(id);
49216
49284
  onWindowRowIdChange?.(id);
49217
49285
  };
49218
- const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react21.useState)(null);
49286
+ const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react22.useState)(null);
49219
49287
  const editScopeKey = appendQueryKey === null ? "\0local" : `append:${appendQueryKey}`;
49220
- const [editsByScope, setEditsByScope] = (0, import_react21.useState)({});
49221
- const editRevisionRef = (0, import_react21.useRef)({});
49222
- const [savingByScope, setSavingByScope] = (0, import_react21.useState)({});
49223
- const savingScopesRef = (0, import_react21.useRef)(/* @__PURE__ */ new Set());
49224
- const [editRequest, setEditRequest] = (0, import_react21.useState)(null);
49225
- const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react21.useState)(false);
49288
+ const [editsByScope, setEditsByScope] = (0, import_react22.useState)({});
49289
+ const editRevisionRef = (0, import_react22.useRef)({});
49290
+ const [savingByScope, setSavingByScope] = (0, import_react22.useState)({});
49291
+ const savingScopesRef = (0, import_react22.useRef)(/* @__PURE__ */ new Set());
49292
+ const [editRequest, setEditRequest] = (0, import_react22.useState)(null);
49293
+ const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react22.useState)(false);
49226
49294
  const edits = editsByScope[editScopeKey]?.values ?? {};
49227
49295
  const saving = (savingByScope[editScopeKey] ?? 0) > 0;
49228
49296
  const setEdits = (next) => {
@@ -49289,7 +49357,7 @@ function MatrxDataTableCore(coreProps) {
49289
49357
  rows: Object.entries(draft.values).map(([rowId, columns2]) => ({ rowId, columns: columns2 }))
49290
49358
  }));
49291
49359
  const selection = appendSourceChanged && selectionConfig ? { ...selectionConfig, selectedIds: [] } : selectionConfig;
49292
- (0, import_react21.useEffect)(() => {
49360
+ (0, import_react22.useEffect)(() => {
49293
49361
  const previous = committedAppendQueryKey.current;
49294
49362
  committedAppendQueryKey.current = appendQueryKey;
49295
49363
  if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
@@ -49307,14 +49375,14 @@ function MatrxDataTableCore(coreProps) {
49307
49375
  onWindowRowIdChange,
49308
49376
  selectionConfig
49309
49377
  ]);
49310
- const scrollRef = (0, import_react21.useRef)(null);
49311
- const tableRef = (0, import_react21.useRef)(null);
49312
- const tableHeaderRef = (0, import_react21.useRef)(null);
49313
- const cardsScrollRef = (0, import_react21.useRef)(null);
49314
- const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react21.useState)(false);
49315
- const documentStickyHeaderRef = (0, import_react21.useRef)(false);
49316
- const previousAppendKeyForScrollReset = (0, import_react21.useRef)(appendQueryKey);
49317
- (0, import_react21.useLayoutEffect)(() => {
49378
+ const scrollRef = (0, import_react22.useRef)(null);
49379
+ const tableRef = (0, import_react22.useRef)(null);
49380
+ const tableHeaderRef = (0, import_react22.useRef)(null);
49381
+ const cardsScrollRef = (0, import_react22.useRef)(null);
49382
+ const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react22.useState)(false);
49383
+ const documentStickyHeaderRef = (0, import_react22.useRef)(false);
49384
+ const previousAppendKeyForScrollReset = (0, import_react22.useRef)(appendQueryKey);
49385
+ (0, import_react22.useLayoutEffect)(() => {
49318
49386
  const previous = previousAppendKeyForScrollReset.current;
49319
49387
  previousAppendKeyForScrollReset.current = appendQueryKey;
49320
49388
  if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
@@ -49339,14 +49407,14 @@ function MatrxDataTableCore(coreProps) {
49339
49407
  ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.thresholdPx !== void 0 ? { thresholdPx: appendScrollPolicy.thresholdPx } : {},
49340
49408
  ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.intentTimeoutMs !== void 0 ? { intentTimeoutMs: appendScrollPolicy.intentTimeoutMs } : {}
49341
49409
  });
49342
- const rootRef = (0, import_react21.useRef)(null);
49410
+ const rootRef = (0, import_react22.useRef)(null);
49343
49411
  useClippedContentGuard(rootRef, {
49344
49412
  label: typeof copy === "object" && copy.listLabel ? `Table: ${copy.listLabel}` : "MatrxDataTable"
49345
49413
  });
49346
- const [scrollHintRight, setScrollHintRight] = (0, import_react21.useState)(false);
49347
- const [scrollHintLeft, setScrollHintLeft] = (0, import_react21.useState)(false);
49348
- const [scrollHintRightInset, setScrollHintRightInset] = (0, import_react21.useState)(6);
49349
- const updateScrollHint = (0, import_react21.useCallback)(() => {
49414
+ const [scrollHintRight, setScrollHintRight] = (0, import_react22.useState)(false);
49415
+ const [scrollHintLeft, setScrollHintLeft] = (0, import_react22.useState)(false);
49416
+ const [scrollHintRightInset, setScrollHintRightInset] = (0, import_react22.useState)(6);
49417
+ const updateScrollHint = (0, import_react22.useCallback)(() => {
49350
49418
  const el = scrollRef.current;
49351
49419
  if (!el) return;
49352
49420
  const hasRows = Boolean(el.querySelector("tbody tr[data-row-id]"));
@@ -49363,7 +49431,7 @@ function MatrxDataTableCore(coreProps) {
49363
49431
  behavior: "smooth"
49364
49432
  });
49365
49433
  };
49366
- (0, import_react21.useEffect)(() => {
49434
+ (0, import_react22.useEffect)(() => {
49367
49435
  updateScrollHint();
49368
49436
  window.addEventListener("resize", updateScrollHint);
49369
49437
  const el = scrollRef.current;
@@ -49378,7 +49446,7 @@ function MatrxDataTableCore(coreProps) {
49378
49446
  observer?.disconnect();
49379
49447
  };
49380
49448
  }, [updateScrollHint, data, columns]);
49381
- (0, import_react21.useLayoutEffect)(() => {
49449
+ (0, import_react22.useLayoutEffect)(() => {
49382
49450
  const scroll = scrollRef.current;
49383
49451
  const table = tableRef.current;
49384
49452
  const header = tableHeaderRef.current;
@@ -49437,30 +49505,30 @@ function MatrxDataTableCore(coreProps) {
49437
49505
  window.removeEventListener("resize", requestUpdate);
49438
49506
  };
49439
49507
  }, [stickyHeader, data, columns]);
49440
- const [columnOrder, setColumnOrder] = (0, import_react21.useState)(() => columnState?.order ?? columns.map(columnId));
49441
- const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react21.useState)(
49508
+ const [columnOrder, setColumnOrder] = (0, import_react22.useState)(() => columnState?.order ?? columns.map(columnId));
49509
+ const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react22.useState)(
49442
49510
  () => new Set(columnState?.hidden ?? columns.filter((column) => column.hidden).map(columnId))
49443
49511
  );
49444
- const [columnWidths, setColumnWidths] = (0, import_react21.useState)(
49512
+ const [columnWidths, setColumnWidths] = (0, import_react22.useState)(
49445
49513
  () => normalizeColumnWidthsForColumns(columnState?.widths, columns)
49446
49514
  );
49447
- const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react21.useState)(null);
49448
- const knownColumnIds = (0, import_react21.useRef)(new Set(columns.map(columnId)));
49449
- const draggedColumnId = (0, import_react21.useRef)(null);
49450
- const columnDragActive = (0, import_react21.useRef)(false);
49451
- const columnDragRaf = (0, import_react21.useRef)(null);
49452
- const columnDragScrollDirection = (0, import_react21.useRef)(0);
49453
- const [columnDragPreview, setColumnDragPreview] = (0, import_react21.useState)(null);
49454
- const stopColumnDragScroll = (0, import_react21.useCallback)(() => {
49515
+ const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react22.useState)(null);
49516
+ const knownColumnIds = (0, import_react22.useRef)(new Set(columns.map(columnId)));
49517
+ const draggedColumnId = (0, import_react22.useRef)(null);
49518
+ const columnDragActive = (0, import_react22.useRef)(false);
49519
+ const columnDragRaf = (0, import_react22.useRef)(null);
49520
+ const columnDragScrollDirection = (0, import_react22.useRef)(0);
49521
+ const [columnDragPreview, setColumnDragPreview] = (0, import_react22.useState)(null);
49522
+ const stopColumnDragScroll = (0, import_react22.useCallback)(() => {
49455
49523
  if (columnDragRaf.current !== null) cancelAnimationFrame(columnDragRaf.current);
49456
49524
  columnDragRaf.current = null;
49457
49525
  columnDragScrollDirection.current = 0;
49458
49526
  }, []);
49459
- (0, import_react21.useEffect)(() => () => {
49527
+ (0, import_react22.useEffect)(() => () => {
49460
49528
  columnDragActive.current = false;
49461
49529
  stopColumnDragScroll();
49462
49530
  }, [stopColumnDragScroll]);
49463
- const startColumnDragScroll = (0, import_react21.useCallback)(() => {
49531
+ const startColumnDragScroll = (0, import_react22.useCallback)(() => {
49464
49532
  if (!columnDragActive.current || columnDragRaf.current !== null) return;
49465
49533
  const scrollStep = () => {
49466
49534
  const scroll = scrollRef.current;
@@ -49487,25 +49555,25 @@ function MatrxDataTableCore(coreProps) {
49487
49555
  };
49488
49556
  columnDragRaf.current = requestAnimationFrame(scrollStep);
49489
49557
  }, []);
49490
- const commitColumnState = (0, import_react21.useCallback)((order, hidden) => {
49558
+ const commitColumnState = (0, import_react22.useCallback)((order, hidden) => {
49491
49559
  if (columnState) columnState.onChange({ order, hidden: [...hidden] });
49492
49560
  else {
49493
49561
  setColumnOrder(order);
49494
49562
  setHiddenColumnIds(hidden);
49495
49563
  }
49496
49564
  }, [columnState]);
49497
- const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react21.useState)(false);
49565
+ const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react22.useState)(false);
49498
49566
  const columnManagerOpen = controlledColumnManager?.open ?? internalColumnManagerOpen;
49499
49567
  const setColumnManagerOpen = controlledColumnManager?.onOpenChange ?? setInternalColumnManagerOpen;
49500
- const columnIds = (0, import_react21.useMemo)(() => columns.map(columnId), [columns]);
49501
- const effectiveColumnOrder = (0, import_react21.useMemo)(() => columnState ? [...columnState.order.filter((id, index, values) => columnIds.includes(id) && values.indexOf(id) === index), ...columnIds.filter((id) => !columnState.order.includes(id))] : columnOrder, [columnIds, columnOrder, columnState]);
49502
- const effectiveHiddenColumnIds = (0, import_react21.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
49503
- const effectiveColumnWidths = (0, import_react21.useMemo)(
49568
+ const columnIds = (0, import_react22.useMemo)(() => columns.map(columnId), [columns]);
49569
+ const effectiveColumnOrder = (0, import_react22.useMemo)(() => columnState ? [...columnState.order.filter((id, index, values) => columnIds.includes(id) && values.indexOf(id) === index), ...columnIds.filter((id) => !columnState.order.includes(id))] : columnOrder, [columnIds, columnOrder, columnState]);
49570
+ const effectiveHiddenColumnIds = (0, import_react22.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
49571
+ const effectiveColumnWidths = (0, import_react22.useMemo)(
49504
49572
  () => normalizeColumnWidthsForColumns(columnState?.widths ?? columnWidths, columns),
49505
49573
  [columns, columnState?.widths, columnWidths]
49506
49574
  );
49507
- const resizeGestureSnapshotRef = (0, import_react21.useRef)(null);
49508
- const measureVisibleColumnWidths = (0, import_react21.useCallback)(() => {
49575
+ const resizeGestureSnapshotRef = (0, import_react22.useRef)(null);
49576
+ const measureVisibleColumnWidths = (0, import_react22.useCallback)(() => {
49509
49577
  const measured = {};
49510
49578
  const headers = tableRef.current ? Array.from(tableRef.current.querySelectorAll(
49511
49579
  "thead th[data-matrx-table-column-id]"
@@ -49519,7 +49587,7 @@ function MatrxDataTableCore(coreProps) {
49519
49587
  }
49520
49588
  return normalizeColumnWidthsForColumns(measured, columns);
49521
49589
  }, [columns]);
49522
- const measureFixedTableGeometry = (0, import_react21.useCallback)(() => {
49590
+ const measureFixedTableGeometry = (0, import_react22.useCallback)(() => {
49523
49591
  const table = tableRef.current;
49524
49592
  const headers = table ? Array.from(table.querySelectorAll("thead th")) : [];
49525
49593
  const widthFor = (selector) => {
@@ -49554,16 +49622,16 @@ function MatrxDataTableCore(coreProps) {
49554
49622
  ...actionsWidth === void 0 ? {} : { actionsWidth }
49555
49623
  };
49556
49624
  }, [resolvedDensity]);
49557
- const captureResizeGestureSnapshot = (0, import_react21.useCallback)(() => {
49625
+ const captureResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
49558
49626
  resizeGestureSnapshotRef.current = {
49559
49627
  widths: measureVisibleColumnWidths(),
49560
49628
  geometry: measureFixedTableGeometry()
49561
49629
  };
49562
49630
  }, [measureFixedTableGeometry, measureVisibleColumnWidths]);
49563
- const clearResizeGestureSnapshot = (0, import_react21.useCallback)(() => {
49631
+ const clearResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
49564
49632
  resizeGestureSnapshotRef.current = null;
49565
49633
  }, []);
49566
- const commitColumnWidths = (0, import_react21.useCallback)((next, captureInitialWidths = false) => {
49634
+ const commitColumnWidths = (0, import_react22.useCallback)((next, captureInitialWidths = false) => {
49567
49635
  const gestureSnapshot = captureInitialWidths ? resizeGestureSnapshotRef.current : null;
49568
49636
  resizeGestureSnapshotRef.current = null;
49569
49637
  const normalized = normalizeColumnWidthsForColumns(
@@ -49582,7 +49650,7 @@ function MatrxDataTableCore(coreProps) {
49582
49650
  }
49583
49651
  setColumnWidths(normalized);
49584
49652
  }, [columnIds, columnState, columns, measureFixedTableGeometry, measureVisibleColumnWidths]);
49585
- (0, import_react21.useEffect)(() => {
49653
+ (0, import_react22.useEffect)(() => {
49586
49654
  const ids = columns.map(columnId);
49587
49655
  if (columnState) return;
49588
49656
  const previousIds = knownColumnIds.current;
@@ -49601,31 +49669,31 @@ function MatrxDataTableCore(coreProps) {
49601
49669
  setColumnWidths((current) => normalizeColumnWidthsForColumns(current, columns));
49602
49670
  knownColumnIds.current = new Set(ids);
49603
49671
  }, [columns, columnState]);
49604
- (0, import_react21.useLayoutEffect)(() => {
49672
+ (0, import_react22.useLayoutEffect)(() => {
49605
49673
  for (const id of columnIds) {
49606
49674
  tableRef.current?.style.removeProperty(columnResizeCssVar(id));
49607
49675
  }
49608
49676
  });
49609
- const previewColumnOrder = (0, import_react21.useMemo)(
49677
+ const previewColumnOrder = (0, import_react22.useMemo)(
49610
49678
  () => projectColumnDragOrder(effectiveColumnOrder, columnDragPreview),
49611
49679
  [columnDragPreview, effectiveColumnOrder]
49612
49680
  );
49613
49681
  useColumnReorderAnimation(tableRef, previewColumnOrder.join("\0"), columnDragPreview !== null);
49614
- const visibleColumns = (0, import_react21.useMemo)(() => {
49682
+ const visibleColumns = (0, import_react22.useMemo)(() => {
49615
49683
  const byId = new Map(columns.map((column) => [columnId(column), column]));
49616
49684
  return previewColumnOrder.map((id) => byId.get(id)).filter(
49617
49685
  (column) => column !== void 0 && !effectiveHiddenColumnIds.has(columnId(column))
49618
49686
  );
49619
49687
  }, [columns, effectiveHiddenColumnIds, previewColumnOrder]);
49620
49688
  const usesMeasuredFixedLayout = visibleColumns.length > 0 && visibleColumns.every((column) => effectiveColumnWidths[columnId(column)] !== void 0);
49621
- (0, import_react21.useLayoutEffect)(() => {
49689
+ (0, import_react22.useLayoutEffect)(() => {
49622
49690
  if (!usesMeasuredFixedLayout) {
49623
49691
  if (fixedTableGeometry !== null) setFixedTableGeometry(null);
49624
49692
  return;
49625
49693
  }
49626
49694
  if (fixedTableGeometry === null) setFixedTableGeometry(measureFixedTableGeometry());
49627
49695
  }, [fixedTableGeometry, measureFixedTableGeometry, usesMeasuredFixedLayout]);
49628
- (0, import_react21.useLayoutEffect)(() => {
49696
+ (0, import_react22.useLayoutEffect)(() => {
49629
49697
  if (!usesMeasuredFixedLayout) return;
49630
49698
  const table = tableRef.current;
49631
49699
  if (!table) return;
@@ -49649,8 +49717,8 @@ function MatrxDataTableCore(coreProps) {
49649
49717
  const fixedLayoutActive = usesMeasuredFixedLayout && fixedTableGeometry !== null;
49650
49718
  const freezeWanted = visibleColumns.some((column) => column.frozen);
49651
49719
  const selectionColumnWidth = fixedTableGeometry?.selectionWidth ?? (selection && (freezeWanted || fitToWidth) ? SELECTION_COLUMN_PX : void 0);
49652
- const [fitSpace, setFitSpace] = (0, import_react21.useState)(null);
49653
- (0, import_react21.useLayoutEffect)(() => {
49720
+ const [fitSpace, setFitSpace] = (0, import_react22.useState)(null);
49721
+ (0, import_react22.useLayoutEffect)(() => {
49654
49722
  if (!fitToWidth) {
49655
49723
  setFitSpace(null);
49656
49724
  return;
@@ -49665,19 +49733,28 @@ function MatrxDataTableCore(coreProps) {
49665
49733
  ...strips.map((strip) => Math.ceil(strip.scrollWidth) + 16),
49666
49734
  actionsHeader ? Math.ceil(actionsHeader.scrollWidth) : 0
49667
49735
  );
49668
- const next = { width: el.clientWidth, actions };
49669
- setFitSpace((now) => now && now.width === next.width && now.actions === next.actions ? now : next);
49736
+ const table2 = el.querySelector(":scope > table");
49737
+ const spill = table2 && table2.hasAttribute("data-matrx-table-fit") ? Math.max(0, el.scrollWidth - el.clientWidth) : 0;
49738
+ setFitSpace((now) => {
49739
+ const sameWidth = now !== null && now.width === el.clientWidth;
49740
+ const slack = sameWidth ? now.slack + spill : spill;
49741
+ const next = { width: el.clientWidth, actions, slack };
49742
+ return now && now.width === next.width && now.actions === next.actions && now.slack === next.slack ? now : next;
49743
+ });
49670
49744
  };
49671
49745
  read2();
49672
49746
  if (typeof ResizeObserver === "undefined") return;
49673
49747
  const observer = new ResizeObserver(read2);
49674
49748
  observer.observe(el);
49749
+ const table = el.querySelector(":scope > table");
49750
+ if (table) observer.observe(table);
49675
49751
  return () => observer.disconnect();
49676
49752
  }, [fitToWidth, data.length]);
49677
- const fittedWidths = (0, import_react21.useMemo)(() => {
49753
+ const fittedWidths = (0, import_react22.useMemo)(() => {
49678
49754
  if (!fitToWidth || !fitSpace) return null;
49679
- const scaling = visibleColumns.filter((col) => resolveColumnMarker(col) === void 0);
49680
- const fixed = visibleColumns.filter((col) => resolveColumnMarker(col) !== void 0).reduce((sum, col) => sum + (pixelWidth(col.width) ?? 40), 0);
49755
+ const keepsItsWidth = (col) => resolveColumnMarker(col) !== void 0 || col.resizable === false && pixelWidth(col.width) !== void 0;
49756
+ const scaling = visibleColumns.filter((col) => !keepsItsWidth(col));
49757
+ const fixed = visibleColumns.filter(keepsItsWidth).reduce((sum, col) => sum + (pixelWidth(col.width) ?? 40), 0);
49681
49758
  const utilities = (selection ? selectionColumnWidth ?? SELECTION_COLUMN_PX : 0) + fitSpace.actions;
49682
49759
  return fitColumnWidths(
49683
49760
  scaling.map(columnId),
@@ -49685,12 +49762,12 @@ function MatrxDataTableCore(coreProps) {
49685
49762
  const col = scaling.find((c) => columnId(c) === id);
49686
49763
  return effectiveColumnWidths[id] ?? pixelWidth(col?.width) ?? FIT_DEFAULT_COLUMN_PX;
49687
49764
  },
49688
- fitSpace.width - utilities - fixed
49765
+ fitSpace.width - utilities - fixed - fitSpace.slack
49689
49766
  );
49690
49767
  }, [fitToWidth, fitSpace, visibleColumns, selection, selectionColumnWidth, effectiveColumnWidths]);
49691
49768
  const fitActive = fittedWidths !== null;
49692
49769
  const actionsColumnWidth = fitActive && fitSpace ? fitSpace.actions : fixedTableGeometry?.actionsWidth;
49693
- const frozenColumns = (0, import_react21.useMemo)(() => {
49770
+ const frozenColumns = (0, import_react22.useMemo)(() => {
49694
49771
  if (!freezeWanted) return NO_FROZEN_COLUMNS;
49695
49772
  const ids = visibleColumns.map(columnId);
49696
49773
  const byId = new Map(visibleColumns.map((column) => [columnId(column), column]));
@@ -49738,15 +49815,15 @@ function MatrxDataTableCore(coreProps) {
49738
49815
  const color = cellTintColor(row, id, colId);
49739
49816
  return color ? CELL_TINT_CLASS[color] : void 0;
49740
49817
  };
49741
- const declaredVisibleCopyColumns = (0, import_react21.useMemo)(
49818
+ const declaredVisibleCopyColumns = (0, import_react22.useMemo)(
49742
49819
  () => visibleColumns.filter((column) => column.accessorFn !== void 0 || column.accessorKey !== void 0),
49743
49820
  [visibleColumns]
49744
49821
  );
49745
- const tableCopySourceNamespace = (0, import_react21.useId)();
49746
- const tableContextMenuInstanceId = (0, import_react21.useId)();
49747
- const tableDndContextId = (0, import_react21.useId)();
49822
+ const tableCopySourceNamespace = (0, import_react22.useId)();
49823
+ const tableContextMenuInstanceId = (0, import_react22.useId)();
49824
+ const tableDndContextId = (0, import_react22.useId)();
49748
49825
  const defaultCopyTitle = toolbar?.title || "Table";
49749
- const defaultCopy = (0, import_react21.useMemo)(() => ({
49826
+ const defaultCopy = (0, import_react22.useMemo)(() => ({
49750
49827
  label: defaultCopyTitle,
49751
49828
  listLabel: defaultCopyTitle,
49752
49829
  location: defaultCopyTitle,
@@ -49763,14 +49840,14 @@ function MatrxDataTableCore(coreProps) {
49763
49840
  const effectiveCopy = copy === false ? void 0 : copy ?? defaultCopy;
49764
49841
  const effectiveCopyColumns = copy === void 0 ? declaredVisibleCopyColumns : visibleColumns;
49765
49842
  const copySubsetVariant2 = useCopySubsetVariant();
49766
- const chromeLatest = (0, import_react21.useRef)({
49843
+ const chromeLatest = (0, import_react22.useRef)({
49767
49844
  processed: [],
49768
49845
  data: [],
49769
49846
  toggleAllOnPage: () => void 0,
49770
49847
  showMore: async () => void 0,
49771
49848
  applySavedView: () => void 0
49772
49849
  });
49773
- const applyLatestSavedView = (0, import_react21.useCallback)((snapshot) => chromeLatest.current.applySavedView(snapshot), []);
49850
+ const applyLatestSavedView = (0, import_react22.useCallback)((snapshot) => chromeLatest.current.applySavedView(snapshot), []);
49774
49851
  const copySubsetColumns = () => effectiveCopyColumns.filter((c) => c.filter !== false || c.accessorKey || c.accessorFn).map((c) => ({
49775
49852
  id: columnId(c),
49776
49853
  header: typeof c.header === "string" ? c.header : columnId(c),
@@ -49791,7 +49868,7 @@ function MatrxDataTableCore(coreProps) {
49791
49868
  serializer: (shaped) => buildViewAgentInput(effectiveCopy, shaped, chromeLatest.current.data, { scope: "custom" })
49792
49869
  }), copySubsetSize(rows().length, copySubsetColumns().length))
49793
49870
  ] : [];
49794
- const filterMeta = (0, import_react21.useMemo)(() => {
49871
+ const filterMeta = (0, import_react22.useMemo)(() => {
49795
49872
  const meta = /* @__PURE__ */ new Map();
49796
49873
  for (const col of visibleColumns) {
49797
49874
  const id = columnId(col);
@@ -49799,15 +49876,15 @@ function MatrxDataTableCore(coreProps) {
49799
49876
  }
49800
49877
  return meta;
49801
49878
  }, [visibleColumns, data, remoteQuery]);
49802
- const intelligentSearchScopes = (0, import_react21.useMemo)(
49879
+ const intelligentSearchScopes = (0, import_react22.useMemo)(
49803
49880
  () => resolveTableSearchScopes(data, columns, {
49804
49881
  ...toolbar?.intelligentSearch?.roles === void 0 ? {} : { roles: toolbar.intelligentSearch.roles },
49805
49882
  ...toolbar?.intelligentSearch?.scopes === void 0 ? {} : { scopes: toolbar.intelligentSearch.scopes }
49806
49883
  }),
49807
49884
  [columns, data, toolbar?.intelligentSearch?.roles, toolbar?.intelligentSearch?.scopes]
49808
49885
  );
49809
- const processed = (0, import_react21.useMemo)(() => {
49810
- if (remoteQuery && !appendUsesLocalProcessing && !remoteQueryUsesLocalColumnFilters) return data;
49886
+ const processed = (0, import_react22.useMemo)(() => {
49887
+ if (remoteQuery && !appendUsesLocalProcessing && !remoteQueryUsesLocalProcessing) return data;
49811
49888
  if (processLocalRows) {
49812
49889
  return processLocalRows(data, {
49813
49890
  page,
@@ -49863,15 +49940,15 @@ function MatrxDataTableCore(coreProps) {
49863
49940
  pageSize,
49864
49941
  remoteQuery,
49865
49942
  appendUsesLocalProcessing,
49866
- remoteQueryUsesLocalColumnFilters,
49943
+ remoteQueryUsesLocalProcessing,
49867
49944
  sourceOwnsColumnFilters,
49868
49945
  sourceOwnsSort,
49869
49946
  sourceOwnsSearch,
49870
49947
  intelligentSearchEnabled,
49871
49948
  searchScope
49872
49949
  ]);
49873
- const lastNotifiedViewRows = (0, import_react21.useRef)(null);
49874
- (0, import_react21.useEffect)(() => {
49950
+ const lastNotifiedViewRows = (0, import_react22.useRef)(null);
49951
+ (0, import_react22.useEffect)(() => {
49875
49952
  if (!onViewChange) {
49876
49953
  lastNotifiedViewRows.current = null;
49877
49954
  return;
@@ -49880,7 +49957,7 @@ function MatrxDataTableCore(coreProps) {
49880
49957
  lastNotifiedViewRows.current = processed;
49881
49958
  if (changed) onViewChange(processed);
49882
49959
  }, [processed, onViewChange]);
49883
- (0, import_react21.useEffect)(() => {
49960
+ (0, import_react22.useEffect)(() => {
49884
49961
  if (controlledQuery) return;
49885
49962
  setInternalPage(1);
49886
49963
  }, [
@@ -49924,7 +50001,7 @@ function MatrxDataTableCore(coreProps) {
49924
50001
  numberedPageHasMore: !hidePagination && !isLoading && !isFetching && processed.length > 0 && safePage < pageCount && (remoteQuery?.mode === "controlled" || !remoteQuery),
49925
50002
  onPageAdvance: setPage
49926
50003
  });
49927
- const paginated = (0, import_react21.useMemo)(() => {
50004
+ const paginated = (0, import_react22.useMemo)(() => {
49928
50005
  if (remoteQuery) return processed;
49929
50006
  if (hidePagination) return processed;
49930
50007
  if (localProgressiveEnabled) return [...progressiveRows.rows];
@@ -49933,16 +50010,16 @@ function MatrxDataTableCore(coreProps) {
49933
50010
  return processed.slice(start, start + effectivePageSize);
49934
50011
  }, [processed, safePage, effectivePageSize, pageSize, remoteQuery, hidePagination, localProgressiveEnabled, progressiveRows.rows]);
49935
50012
  const groupingColumnId = grouping?.columnId ?? null;
49936
- const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0, import_react21.useState)([]);
50013
+ const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0, import_react22.useState)([]);
49937
50014
  const collapsedGroups = grouping?.collapsed ?? uncontrolledCollapsed;
49938
- const setCollapsedGroups = (0, import_react21.useCallback)(
50015
+ const setCollapsedGroups = (0, import_react22.useCallback)(
49939
50016
  (next) => {
49940
50017
  if (grouping?.onCollapsedChange) grouping.onCollapsedChange(next);
49941
50018
  else setUncontrolledCollapsed(next);
49942
50019
  },
49943
50020
  [grouping]
49944
50021
  );
49945
- const groups = (0, import_react21.useMemo)(() => {
50022
+ const groups = (0, import_react22.useMemo)(() => {
49946
50023
  if (!grouping || !groupingColumnId) return null;
49947
50024
  const groupColumn = columns.find((col) => columnId(col) === groupingColumnId);
49948
50025
  if (!groupColumn) return null;
@@ -49961,7 +50038,7 @@ function MatrxDataTableCore(coreProps) {
49961
50038
  ...grouping.emptyLabel ? { emptyLabel: grouping.emptyLabel } : {}
49962
50039
  });
49963
50040
  }, [grouping, groupingColumnId, columns, paginated]);
49964
- const groupableColumns = (0, import_react21.useMemo)(() => {
50041
+ const groupableColumns = (0, import_react22.useMemo)(() => {
49965
50042
  const allowed = grouping?.groupableColumnIds;
49966
50043
  return visibleColumns.filter((col) => {
49967
50044
  const id = columnId(col);
@@ -49969,7 +50046,7 @@ function MatrxDataTableCore(coreProps) {
49969
50046
  return col.accessorKey !== void 0 || col.accessorFn !== void 0;
49970
50047
  });
49971
50048
  }, [visibleColumns, grouping?.groupableColumnIds]);
49972
- const groupedRenderRows = (0, import_react21.useMemo)(
50049
+ const groupedRenderRows = (0, import_react22.useMemo)(
49973
50050
  () => groups ? flattenGroups(groups, collapsedGroups) : null,
49974
50051
  [groups, collapsedGroups]
49975
50052
  );
@@ -49981,7 +50058,7 @@ function MatrxDataTableCore(coreProps) {
49981
50058
  const bodyEntryCount = groupedRenderRows ? groupedRenderRows.length : paginated.length;
49982
50059
  const virtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && bodyEntryCount > virtualThreshold && !hierarchy && expandedDetail === void 0;
49983
50060
  const columnWindowWidth = virtualizeConfig?.columnWidth ?? 160;
49984
- const frozenRunLength = (0, import_react21.useMemo)(() => {
50061
+ const frozenRunLength = (0, import_react22.useMemo)(() => {
49985
50062
  let run = 0;
49986
50063
  for (const col of visibleColumns) {
49987
50064
  if (frozenColumns.offsets[columnId(col)] === void 0) break;
@@ -49990,9 +50067,9 @@ function MatrxDataTableCore(coreProps) {
49990
50067
  return run;
49991
50068
  }, [visibleColumns, frozenColumns]);
49992
50069
  const columnVirtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && virtualizeConfig.columns === true && visibleColumns.length - frozenRunLength > 30 && !hierarchy && mobileCards === void 0;
49993
- const [rowWindow, setRowWindow] = (0, import_react21.useState)(null);
49994
- const [columnWindow, setColumnWindow] = (0, import_react21.useState)(null);
49995
- const windowInputs = (0, import_react21.useRef)({
50070
+ const [rowWindow, setRowWindow] = (0, import_react22.useState)(null);
50071
+ const [columnWindow, setColumnWindow] = (0, import_react22.useState)(null);
50072
+ const windowInputs = (0, import_react22.useRef)({
49996
50073
  virtualizeActive: false,
49997
50074
  bodyEntryCount: 0,
49998
50075
  virtualRowHeight: 40,
@@ -50012,7 +50089,7 @@ function MatrxDataTableCore(coreProps) {
50012
50089
  columnWindowWidth,
50013
50090
  frozenRunLength
50014
50091
  };
50015
- const recomputeWindows = (0, import_react21.useCallback)(() => {
50092
+ const recomputeWindows = (0, import_react22.useCallback)(() => {
50016
50093
  const el = scrollRef.current;
50017
50094
  const input = windowInputs.current;
50018
50095
  const nextRow = input.virtualizeActive ? computeWindow({
@@ -50033,7 +50110,7 @@ function MatrxDataTableCore(coreProps) {
50033
50110
  setRowWindow((prev) => sameWindow(prev, nextRow) ? prev : nextRow);
50034
50111
  setColumnWindow((prev) => sameWindow(prev, nextColumn) ? prev : nextColumn);
50035
50112
  }, []);
50036
- const effectiveRowWindow = (0, import_react21.useMemo)(() => {
50113
+ const effectiveRowWindow = (0, import_react22.useMemo)(() => {
50037
50114
  if (!virtualizeActive) return null;
50038
50115
  if (rowWindow && rowWindow.end <= bodyEntryCount) return rowWindow;
50039
50116
  return computeWindow({
@@ -50044,7 +50121,7 @@ function MatrxDataTableCore(coreProps) {
50044
50121
  overscan: virtualizeConfig?.overscan ?? 8
50045
50122
  });
50046
50123
  }, [virtualizeActive, rowWindow, bodyEntryCount, virtualRowHeight, virtualizeConfig?.overscan]);
50047
- const effectiveColumnWindow = (0, import_react21.useMemo)(() => {
50124
+ const effectiveColumnWindow = (0, import_react22.useMemo)(() => {
50048
50125
  if (!columnVirtualizeActive) return null;
50049
50126
  if (columnWindow && columnWindow.end <= visibleColumns.length) return columnWindow;
50050
50127
  return computeWindow({
@@ -50064,7 +50141,7 @@ function MatrxDataTableCore(coreProps) {
50064
50141
  frozenRunLength
50065
50142
  ]);
50066
50143
  const metricsWanted = virtualizeActive || columnVirtualizeActive;
50067
- (0, import_react21.useEffect)(() => {
50144
+ (0, import_react22.useEffect)(() => {
50068
50145
  recomputeWindows();
50069
50146
  }, [
50070
50147
  recomputeWindows,
@@ -50076,7 +50153,7 @@ function MatrxDataTableCore(coreProps) {
50076
50153
  columnWindowWidth,
50077
50154
  frozenRunLength
50078
50155
  ]);
50079
- (0, import_react21.useEffect)(() => {
50156
+ (0, import_react22.useEffect)(() => {
50080
50157
  if (!metricsWanted) return;
50081
50158
  const el = scrollRef.current;
50082
50159
  if (!el) return;
@@ -50097,7 +50174,7 @@ function MatrxDataTableCore(coreProps) {
50097
50174
  observer?.disconnect();
50098
50175
  };
50099
50176
  }, [metricsWanted, recomputeWindows]);
50100
- const renderedColumns = (0, import_react21.useMemo)(
50177
+ const renderedColumns = (0, import_react22.useMemo)(
50101
50178
  () => effectiveColumnWindow ? [
50102
50179
  ...visibleColumns.slice(0, frozenRunLength),
50103
50180
  ...visibleColumns.slice(effectiveColumnWindow.start, effectiveColumnWindow.end)
@@ -50105,7 +50182,7 @@ function MatrxDataTableCore(coreProps) {
50105
50182
  [effectiveColumnWindow, visibleColumns, frozenRunLength]
50106
50183
  );
50107
50184
  const columnSpacers = effectiveColumnWindow ? { start: effectiveColumnWindow.padStart, end: effectiveColumnWindow.padEnd } : null;
50108
- const windowedWidthFor = (0, import_react21.useCallback)(
50185
+ const windowedWidthFor = (0, import_react22.useCallback)(
50109
50186
  (id, declared) => {
50110
50187
  const fitted = fittedWidths?.[id];
50111
50188
  if (fitted !== void 0) return fitted;
@@ -50117,7 +50194,7 @@ function MatrxDataTableCore(coreProps) {
50117
50194
  [effectiveColumnWindow, effectiveColumnWidths, frozenColumns, columnWindowWidth, fittedWidths]
50118
50195
  );
50119
50196
  const coverageUnanswered = readView.failure || read?.status === "loading" && data.length === 0;
50120
- const coverageResult = (0, import_react21.useMemo)(() => {
50197
+ const coverageResult = (0, import_react22.useMemo)(() => {
50121
50198
  if (!coverage || coverageUnanswered) return null;
50122
50199
  return describeCoverage({
50123
50200
  loaded: coverage.loaded ?? data.length,
@@ -50128,7 +50205,7 @@ function MatrxDataTableCore(coreProps) {
50128
50205
  ...coverage.noun === void 0 ? {} : { noun: coverage.noun }
50129
50206
  });
50130
50207
  }, [coverage, coverageUnanswered, data.length]);
50131
- const bodyEntries = (0, import_react21.useMemo)(() => {
50208
+ const bodyEntries = (0, import_react22.useMemo)(() => {
50132
50209
  const from = effectiveRowWindow ? effectiveRowWindow.start : 0;
50133
50210
  const to = effectiveRowWindow ? effectiveRowWindow.end : void 0;
50134
50211
  const windowed = groupedRenderRows ? groupedRenderRows.slice(from, to).map(
@@ -50145,28 +50222,28 @@ function MatrxDataTableCore(coreProps) {
50145
50222
  windowed.push({ kind: "spacer", height: effectiveRowWindow.padEnd, place: "end" });
50146
50223
  return windowed;
50147
50224
  }, [groupedRenderRows, collapsedGroups, paginated, effectiveRowWindow]);
50148
- const getRowIdRef = (0, import_react21.useRef)(getRowId);
50225
+ const getRowIdRef = (0, import_react22.useRef)(getRowId);
50149
50226
  getRowIdRef.current = getRowId;
50150
- const spreadsheetRowIds = (0, import_react21.useMemo)(
50227
+ const spreadsheetRowIds = (0, import_react22.useMemo)(
50151
50228
  () => paginated.map((row) => getRowIdRef.current(row)),
50152
50229
  [paginated]
50153
50230
  );
50154
- const spreadsheetColumnIds = (0, import_react21.useMemo)(
50231
+ const spreadsheetColumnIds = (0, import_react22.useMemo)(
50155
50232
  () => visibleColumns.map((col) => columnId(col)),
50156
50233
  [visibleColumns]
50157
50234
  );
50158
- const spreadsheetRowById = (0, import_react21.useMemo)(() => {
50235
+ const spreadsheetRowById = (0, import_react22.useMemo)(() => {
50159
50236
  const map = /* @__PURE__ */ new Map();
50160
50237
  for (const row of paginated) map.set(getRowIdRef.current(row), row);
50161
50238
  return map;
50162
50239
  }, [paginated]);
50163
- const spreadsheetColumnById = (0, import_react21.useMemo)(() => {
50240
+ const spreadsheetColumnById = (0, import_react22.useMemo)(() => {
50164
50241
  const map = /* @__PURE__ */ new Map();
50165
50242
  for (const col of visibleColumns) map.set(columnId(col), col);
50166
50243
  return map;
50167
50244
  }, [visibleColumns]);
50168
50245
  const spreadsheetEnabled = Boolean(spreadsheet && spreadsheet.enabled !== false);
50169
- const openRowRef = (0, import_react21.useRef)(() => void 0);
50246
+ const openRowRef = (0, import_react22.useRef)(() => void 0);
50170
50247
  const sheet = useSpreadsheetGrid(
50171
50248
  spreadsheetEnabled && spreadsheet ? {
50172
50249
  rowIds: spreadsheetRowIds,
@@ -50208,12 +50285,12 @@ function MatrxDataTableCore(coreProps) {
50208
50285
  } : null
50209
50286
  );
50210
50287
  if (spreadsheet?.controllerRef) spreadsheet.controllerRef.current = spreadsheetEnabled ? sheet.controller : null;
50211
- const sheetRef = (0, import_react21.useRef)(sheet);
50288
+ const sheetRef = (0, import_react22.useRef)(sheet);
50212
50289
  sheetRef.current = sheet;
50213
- const onSheetSelectionRef = (0, import_react21.useRef)(spreadsheet?.onSelectionChange);
50290
+ const onSheetSelectionRef = (0, import_react22.useRef)(spreadsheet?.onSelectionChange);
50214
50291
  onSheetSelectionRef.current = spreadsheet?.onSelectionChange;
50215
50292
  const sheetSelectionKey = sheet.range ? `${sheet.range.anchor.rowId}\0${sheet.range.anchor.fieldName}\0${sheet.range.focus.rowId}\0${sheet.range.focus.fieldName}\0${sheet.bounds ? `${sheet.bounds.r0}:${sheet.bounds.r1}:${sheet.bounds.c0}:${sheet.bounds.c1}` : ""}` : "";
50216
- (0, import_react21.useEffect)(() => {
50293
+ (0, import_react22.useEffect)(() => {
50217
50294
  const tell = onSheetSelectionRef.current;
50218
50295
  if (!tell) return;
50219
50296
  const current = sheetRef.current;
@@ -50230,11 +50307,12 @@ function MatrxDataTableCore(coreProps) {
50230
50307
  tsv: current.selectionTsv()
50231
50308
  });
50232
50309
  }, [sheetSelectionKey]);
50233
- const searchValueRef = (0, import_react21.useRef)(searchValue);
50310
+ const searchValueRef = (0, import_react22.useRef)(searchValue);
50234
50311
  searchValueRef.current = searchValue;
50235
50312
  const facetsEnabled = Boolean(facets && facets.enabled !== false);
50236
- const [facetState, setFacetState] = (0, import_react21.useState)({});
50237
- const facetReadCell = (0, import_react21.useCallback)(
50313
+ const coreSuggestionsEnabled = facets?.enabled !== false;
50314
+ const [facetState, setFacetState] = (0, import_react22.useState)({});
50315
+ const facetReadCell = (0, import_react22.useCallback)(
50238
50316
  (row, colId) => {
50239
50317
  if (facets?.readCell) return facets.readCell(row, colId);
50240
50318
  const col = visibleColumns.find((candidate) => columnId(candidate) === colId);
@@ -50242,12 +50320,37 @@ function MatrxDataTableCore(coreProps) {
50242
50320
  },
50243
50321
  [facets, visibleColumns]
50244
50322
  );
50245
- const facetInputsRef = (0, import_react21.useRef)({ data, facets, facetReadCell });
50246
- facetInputsRef.current = { data, facets, facetReadCell };
50247
- const facetRequestRef = (0, import_react21.useRef)(/* @__PURE__ */ new Map());
50248
- const requestFacets = (0, import_react21.useCallback)((colId) => {
50249
- const { data: rows, facets: config, facetReadCell: readCell } = facetInputsRef.current;
50250
- if (!config || config.enabled === false) return;
50323
+ const coreFacetTotal = remoteQuery?.mode === "controlled" ? remoteQuery.totalItems : appendQuery?.pagination.sourceRecords?.total ?? coverage?.matched ?? coverage?.total;
50324
+ const coreFacetLoaded = appendQuery?.pagination.sourceRecords?.loaded;
50325
+ const facetInputsRef = (0, import_react22.useRef)({ data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded });
50326
+ facetInputsRef.current = { data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded };
50327
+ const facetRequestRef = (0, import_react22.useRef)(/* @__PURE__ */ new Map());
50328
+ const requestFacets = (0, import_react22.useCallback)((colId) => {
50329
+ const { data: rows, facets: config, facetReadCell: readCell, coreFacetTotal: total, coreFacetLoaded: loaded } = facetInputsRef.current;
50330
+ if (!config || config.enabled === false) {
50331
+ const complete2 = localFacetsAreComplete(loaded ?? rows.length, total ?? rows.length);
50332
+ const hasArrayValue = rows.some((row) => {
50333
+ try {
50334
+ return Array.isArray(readCell(row, colId));
50335
+ } catch {
50336
+ return false;
50337
+ }
50338
+ });
50339
+ const suggestions = computeColumnFacets({
50340
+ columnId: colId,
50341
+ rows,
50342
+ readValue: readCell,
50343
+ complete: complete2
50344
+ });
50345
+ setFacetState((current) => ({
50346
+ ...current,
50347
+ [colId]: {
50348
+ loading: false,
50349
+ data: !hasArrayValue && suggestions.distinctCount + (suggestions.blank > 0 ? 1 : 0) < CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT ? suggestions : null
50350
+ }
50351
+ }));
50352
+ return;
50353
+ }
50251
50354
  const complete = localFacetsAreComplete(rows.length, config.totalRows);
50252
50355
  const limit = config.limit;
50253
50356
  if (complete || !config.source) {
@@ -50304,21 +50407,20 @@ function MatrxDataTableCore(coreProps) {
50304
50407
  }));
50305
50408
  });
50306
50409
  }, []);
50307
- (0, import_react21.useEffect)(() => {
50308
- if (!facetsEnabled) return;
50410
+ (0, import_react22.useEffect)(() => {
50309
50411
  setFacetState({});
50310
50412
  facetRequestRef.current = /* @__PURE__ */ new Map();
50311
- }, [facetsEnabled, data, searchValue]);
50413
+ }, [facetsEnabled, data, searchValue, coreFacetTotal, coreFacetLoaded]);
50312
50414
  const totalIsKnown = !isLoading && !readView.failure;
50313
- (0, import_react21.useEffect)(() => {
50415
+ (0, import_react22.useEffect)(() => {
50314
50416
  if (!controlledQuery || !totalIsKnown || controlledQuery.state.page === safePage) return;
50315
50417
  emitControlledQueryChange({ page: safePage });
50316
50418
  }, [controlledQuery, emitControlledQueryChange, safePage, totalIsKnown]);
50317
- const selectedRow = (0, import_react21.useMemo)(() => {
50419
+ const selectedRow = (0, import_react22.useMemo)(() => {
50318
50420
  if (!selectedId) return null;
50319
50421
  return data.find((r) => getRowId(r) === selectedId) ?? null;
50320
50422
  }, [data, selectedId, getRowId]);
50321
- const windowRow = (0, import_react21.useMemo)(() => {
50423
+ const windowRow = (0, import_react22.useMemo)(() => {
50322
50424
  if (!windowRowId) return null;
50323
50425
  return data.find((r) => getRowId(r) === windowRowId) ?? (windowRowSnapshot && windowRowSnapshot.queryKey === appendQueryKey && getRowId(windowRowSnapshot.row) === windowRowId ? windowRowSnapshot.row : null);
50324
50426
  }, [data, windowRowId, windowRowSnapshot, getRowId, appendQueryKey]);
@@ -50337,39 +50439,60 @@ function MatrxDataTableCore(coreProps) {
50337
50439
  const target = toolbar.portalInto;
50338
50440
  return target ? (0, import_react_dom3.createPortal)(node, target) : null;
50339
50441
  };
50442
+ const [pinnedEl, setPinnedEl] = (0, import_react22.useState)(null);
50443
+ const pinnedRowActive = Boolean(
50444
+ toolbar?.singleRow && toolbar.overflow && toolbar.overflow.mode !== "sheet" && (toolbar.overflow.pinned || toolbar.overflow.mode === "menu")
50445
+ );
50446
+ const pinnedFolded = usePinnedFold(pinnedEl, pinnedRowActive);
50447
+ const toolbarEnd = { node: null };
50340
50448
  const renderToolbarControls = (controls) => {
50449
+ toolbarEnd.node = null;
50341
50450
  const overflow = toolbar?.overflow;
50342
50451
  const mode = overflow?.mode ?? "inline";
50343
- const stick = (node) => toolbar?.singleRow ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
50344
- "span",
50345
- {
50346
- "data-matrx-table-toolbar-pinned": "",
50347
- className: "sticky right-0 z-[1] flex shrink-0 items-center gap-1 bg-background pl-1 before:pointer-events-none before:absolute before:inset-y-0 before:-left-6 before:w-6 before:bg-gradient-to-l before:from-background before:to-transparent",
50348
- children: node
50349
- }
50350
- ) : node;
50351
- if (mode === "menu") {
50352
- return stick(
50353
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
50452
+ if (mode === "sheet") {
50453
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
50454
+ controls,
50455
+ overflow?.pinned,
50456
+ overflow?.sheetExtras
50457
+ ] });
50458
+ }
50459
+ if (!pinnedRowActive) {
50460
+ if (mode === "menu") {
50461
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
50354
50462
  overflow?.pinned,
50355
50463
  /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
50356
50464
  controls,
50357
50465
  overflow?.sheetExtras
50358
50466
  ] })
50359
- ] })
50360
- );
50361
- }
50362
- if (mode === "sheet") {
50363
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
50467
+ ] });
50468
+ }
50469
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
50364
50470
  controls,
50365
- overflow?.pinned,
50366
- overflow?.sheetExtras
50471
+ overflow?.pinned
50367
50472
  ] });
50368
50473
  }
50369
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
50370
- controls,
50371
- overflow?.pinned ? stick(overflow.pinned) : null
50372
- ] });
50474
+ const folded = pinnedFolded;
50475
+ toolbarEnd.node = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
50476
+ "span",
50477
+ {
50478
+ ref: setPinnedEl,
50479
+ "data-matrx-table-toolbar-pinned": "",
50480
+ ...folded ? { "data-matrx-table-toolbar-pinned-folded": "" } : {},
50481
+ className: "sticky right-0 z-[1] -ml-1 flex shrink-0 items-center gap-1 bg-background pl-1 before:pointer-events-none before:absolute before:inset-y-0 before:-left-6 before:w-6 before:bg-gradient-to-l before:from-background before:to-transparent",
50482
+ children: folded ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
50483
+ controls,
50484
+ overflow?.pinned,
50485
+ overflow?.sheetExtras
50486
+ ] }) : mode === "menu" ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
50487
+ overflow?.pinned,
50488
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
50489
+ controls,
50490
+ overflow?.sheetExtras
50491
+ ] })
50492
+ ] }) : overflow?.pinned
50493
+ }
50494
+ );
50495
+ return folded || mode === "menu" ? null : controls;
50373
50496
  };
50374
50497
  const renderRowActions = (row, controls) => {
50375
50498
  const actions = rowActions?.(row, controls);
@@ -50434,7 +50557,7 @@ function MatrxDataTableCore(coreProps) {
50434
50557
  ...resolveSummaryValue(summary?.source?.totals?.[id], value)
50435
50558
  }));
50436
50559
  const hasSummaryTotals = summaryTotals.length > 0;
50437
- const changeCount = (0, import_react21.useMemo)(() => {
50560
+ const changeCount = (0, import_react22.useMemo)(() => {
50438
50561
  let n2 = 0;
50439
50562
  for (const fields of Object.values(edits)) {
50440
50563
  n2 += Object.keys(fields).length;
@@ -50525,7 +50648,7 @@ function MatrxDataTableCore(coreProps) {
50525
50648
  }
50526
50649
  resetToolbarFacets(toolbar?.facets);
50527
50650
  };
50528
- const renderedEmptyState = (remoteQuery === null || remoteQueryUsesLocalColumnFilters) && data.length > 0 && hasActiveFilters ? {
50651
+ const renderedEmptyState = (remoteQuery === null || remoteQueryUsesLocalProcessing) && data.length > 0 && hasActiveFilters ? {
50529
50652
  title: "No matching rows",
50530
50653
  description: "No rows match the current search or filters.",
50531
50654
  action: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Button, { type: "button", variant: "outline", size: "sm", onClick: clearAllFilters, children: "Clear filters" }),
@@ -50618,7 +50741,7 @@ function MatrxDataTableCore(coreProps) {
50618
50741
  }));
50619
50742
  return true;
50620
50743
  };
50621
- const requestCellEditRef = (0, import_react21.useRef)(requestCellEdit);
50744
+ const requestCellEditRef = (0, import_react22.useRef)(requestCellEdit);
50622
50745
  requestCellEditRef.current = requestCellEdit;
50623
50746
  const buildRecordControls = (row) => {
50624
50747
  const rowId = getRowId(row);
@@ -50645,7 +50768,7 @@ function MatrxDataTableCore(coreProps) {
50645
50768
  };
50646
50769
  const hierarchyRows = hierarchy?.rows ?? data;
50647
50770
  const hierarchyGetParentId = hierarchy?.getParentId;
50648
- const hierarchyIndex = (0, import_react21.useMemo)(() => {
50771
+ const hierarchyIndex = (0, import_react22.useMemo)(() => {
50649
50772
  if (!hierarchyGetParentId) return null;
50650
50773
  const byId = /* @__PURE__ */ new Map();
50651
50774
  const parentById = /* @__PURE__ */ new Map();
@@ -50677,7 +50800,7 @@ function MatrxDataTableCore(coreProps) {
50677
50800
  return { byId, parentById, depthById };
50678
50801
  }, [hierarchyGetParentId, hierarchyRows, getRowId]);
50679
50802
  const draggedRow = draggedRowId && hierarchyIndex ? hierarchyIndex.byId.get(draggedRowId) : void 0;
50680
- const hierarchyBlockedIds = (0, import_react21.useMemo)(() => {
50803
+ const hierarchyBlockedIds = (0, import_react22.useMemo)(() => {
50681
50804
  if (!draggedRowId || !hierarchyIndex) return null;
50682
50805
  const childrenById = /* @__PURE__ */ new Map();
50683
50806
  for (const [id, parentId] of hierarchyIndex.parentById) {
@@ -50964,16 +51087,16 @@ function MatrxDataTableCore(coreProps) {
50964
51087
  return [];
50965
51088
  }
50966
51089
  };
50967
- const menuSectionsForRef = (0, import_react21.useRef)(menuSectionsFor);
51090
+ const menuSectionsForRef = (0, import_react22.useRef)(menuSectionsFor);
50968
51091
  menuSectionsForRef.current = menuSectionsFor;
50969
51092
  const hasMenuSections = Boolean(contextMenu?.sections);
50970
- const boundarySections = (0, import_react21.useCallback)(
51093
+ const boundarySections = (0, import_react22.useCallback)(
50971
51094
  (target) => menuSectionsForRef.current(target),
50972
51095
  []
50973
51096
  );
50974
- const resolveMenuLevelRef = (0, import_react21.useRef)(resolveMenuLevel);
51097
+ const resolveMenuLevelRef = (0, import_react22.useRef)(resolveMenuLevel);
50975
51098
  resolveMenuLevelRef.current = resolveMenuLevel;
50976
- (0, import_react21.useEffect)(() => {
51099
+ (0, import_react22.useEffect)(() => {
50977
51100
  if (!host.rowContextRegistry) return;
50978
51101
  return host.rowContextRegistry.register(
50979
51102
  tableContextMenuInstanceId,
@@ -50982,7 +51105,7 @@ function MatrxDataTableCore(coreProps) {
50982
51105
  }, [host.rowContextRegistry, tableContextMenuInstanceId]);
50983
51106
  const showActionsCol = windowEnabled || Boolean(rowActions) || showInlineRowCopy;
50984
51107
  const getSelectionId = selection?.getSelectionId ?? getRowId;
50985
- const selectedIdSet = (0, import_react21.useMemo)(
51108
+ const selectedIdSet = (0, import_react22.useMemo)(
50986
51109
  () => new Set(selection?.selectedIds ?? []),
50987
51110
  [selection?.selectedIds]
50988
51111
  );
@@ -50994,7 +51117,7 @@ function MatrxDataTableCore(coreProps) {
50994
51117
  );
50995
51118
  const allOnPageSelected = selectableRows.length > 0 && selectedOnPage.length === selectableRows.length;
50996
51119
  const someOnPageSelected = selectedOnPage.length > 0 && !allOnPageSelected;
50997
- const selectedRows = (0, import_react21.useMemo)(() => {
51120
+ const selectedRows = (0, import_react22.useMemo)(() => {
50998
51121
  const resolved = /* @__PURE__ */ new Set();
50999
51122
  return data.filter((row) => {
51000
51123
  const id = getSelectionId(row);
@@ -51003,7 +51126,7 @@ function MatrxDataTableCore(coreProps) {
51003
51126
  return true;
51004
51127
  });
51005
51128
  }, [data, getSelectionId, selectedIdSet]);
51006
- const lastToggledIndex = (0, import_react21.useRef)(null);
51129
+ const lastToggledIndex = (0, import_react22.useRef)(null);
51007
51130
  const setSelectedIds = (next) => selection?.onSelectedIdsChange([...next]);
51008
51131
  const toggleRowSelected = (index, shiftKey) => {
51009
51132
  if (!selection) return;
@@ -51044,7 +51167,7 @@ function MatrxDataTableCore(coreProps) {
51044
51167
  }
51045
51168
  } : facet
51046
51169
  ) : toolbar?.facets;
51047
- const rowLatest = (0, import_react21.useRef)(null);
51170
+ const rowLatest = (0, import_react22.useRef)(null);
51048
51171
  const renderRecordCell = (row, col, index) => {
51049
51172
  const id = getRowId(row);
51050
51173
  const field = col.accessorKey ? String(col.accessorKey) : columnId(col);
@@ -51080,7 +51203,7 @@ function MatrxDataTableCore(coreProps) {
51080
51203
  }
51081
51204
  return href ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Link, { href, onClick: (event) => event.stopPropagation(), className: "block w-full min-w-0 rounded outline-none focus-visible:ring-2 focus-visible:ring-ring", children: display }) : display;
51082
51205
  };
51083
- const currentViewSnapshot = (0, import_react21.useMemo)(
51206
+ const currentViewSnapshot = (0, import_react22.useMemo)(
51084
51207
  () => ({
51085
51208
  __kind: "matrx-table-view",
51086
51209
  version: 1,
@@ -51115,7 +51238,7 @@ function MatrxDataTableCore(coreProps) {
51115
51238
  sort
51116
51239
  ]
51117
51240
  );
51118
- const declaredDefaultViewSnapshot = (0, import_react21.useMemo)(
51241
+ const declaredDefaultViewSnapshot = (0, import_react22.useMemo)(
51119
51242
  () => defaultViewSnapshot ?? {
51120
51243
  __kind: "matrx-table-view",
51121
51244
  version: 1,
@@ -51123,7 +51246,6 @@ function MatrxDataTableCore(coreProps) {
51123
51246
  pageSize: defaultPageSize,
51124
51247
  search: "",
51125
51248
  anyOf: "",
51126
- layeredFilters: [],
51127
51249
  columnFilters: {},
51128
51250
  sort: defaultSort
51129
51251
  },
@@ -51134,7 +51256,7 @@ function MatrxDataTableCore(coreProps) {
51134
51256
  },
51135
51257
  [columns, defaultPageSize, defaultSort, defaultViewSnapshot]
51136
51258
  );
51137
- const applySavedView = (0, import_react21.useCallback)(
51259
+ const applySavedView = (0, import_react22.useCallback)(
51138
51260
  (rawSnapshot) => {
51139
51261
  const snapshot = parseTableViewSnapshot(rawSnapshot);
51140
51262
  if (!snapshot) {
@@ -51359,6 +51481,7 @@ function MatrxDataTableCore(coreProps) {
51359
51481
  allRowsAreLoaded,
51360
51482
  effectivePageSize,
51361
51483
  safePage,
51484
+ isFetching,
51362
51485
  controlledQuery,
51363
51486
  emitControlledQueryChange,
51364
51487
  ...pageSizeOptions
@@ -51366,6 +51489,8 @@ function MatrxDataTableCore(coreProps) {
51366
51489
  const toolbarReadsRows = showToolbarCopy && copyDrawsFromRows(effectiveCopy);
51367
51490
  const toolbarEpoch = useRenderEpoch([
51368
51491
  hideToolbar,
51492
+ pinnedFolded,
51493
+ pinnedRowActive,
51369
51494
  viewTabs,
51370
51495
  toolbar,
51371
51496
  showSearch,
@@ -51758,7 +51883,7 @@ function MatrxDataTableCore(coreProps) {
51758
51883
  },
51759
51884
  `${id}:expanded-detail`
51760
51885
  ) : null;
51761
- return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react21.Fragment, { children: [
51886
+ return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
51762
51887
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
51763
51888
  HierarchyDroppableRow,
51764
51889
  {
@@ -51768,7 +51893,7 @@ function MatrxDataTableCore(coreProps) {
51768
51893
  }
51769
51894
  ),
51770
51895
  inlineDetail
51771
- ] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react21.Fragment, { children: [
51896
+ ] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
51772
51897
  wrappedRow,
51773
51898
  inlineDetail
51774
51899
  ] }, id);
@@ -51877,43 +52002,40 @@ function MatrxDataTableCore(coreProps) {
51877
52002
  "data-matrx-table-density": resolvedDensity,
51878
52003
  "data-url-state-table": urlState?.id,
51879
52004
  className: cn(
51880
- "flex h-full min-h-0 flex-col gap-2 px-0 py-2",
52005
+ "flex h-full min-h-0 flex-col gap-2 px-0 pt-2 pb-0",
51881
52006
  className
51882
52007
  ),
51883
52008
  children: [
51884
52009
  notice,
51885
52010
  savedViewError ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { className: "shrink-0 text-xs text-destructive", message: savedViewError, operation: "Save or apply a saved view", origin: "design-system/MatrxDataTable" }) : null,
51886
52011
  toolbarActionError ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { className: "shrink-0 text-xs text-destructive", message: toolbarActionError, operation: "Run a table toolbar action", origin: "design-system/MatrxDataTable" }) : null,
51887
- summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
52012
+ summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
51888
52013
  "section",
51889
52014
  {
51890
52015
  "data-matrx-table-summary": true,
51891
52016
  "data-matrx-table-summary-scope": summaryUsesSource ? "source" : summaryCoverage,
51892
52017
  "aria-label": `Table summary: ${summaryCaption}`,
51893
- className: "flex shrink-0 flex-wrap items-stretch gap-2",
51894
- children: [
51895
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "flex items-center px-1 text-xs font-medium text-muted-foreground", children: summaryCaption }),
51896
- summaryMetrics.map((metric) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "min-w-24 rounded-md border border-border bg-card px-3 py-2 shadow-xs", children: [
51897
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-xs text-muted-foreground", children: metric.label }),
51898
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "mt-0.5 text-sm font-semibold tabular-nums text-foreground", children: [
51899
- metric.value,
51900
- metric.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${metric.label} is unavailable`, operation: "Summarize this table", origin: "design-system/MatrxDataTable" }) : null
51901
- ] })
51902
- ] }, metric.id))
51903
- ]
52018
+ className: "flex w-full min-w-0 shrink-0 flex-nowrap items-stretch gap-2 overflow-x-auto overscroll-x-contain",
52019
+ children: summaryMetrics.map((metric) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "min-w-24 shrink-0 whitespace-nowrap rounded-md border border-border bg-card px-3 py-2 shadow-xs", children: [
52020
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-xs text-muted-foreground", children: metric.label }),
52021
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "mt-0.5 text-sm font-semibold tabular-nums text-foreground", children: [
52022
+ metric.value,
52023
+ metric.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${metric.label} is unavailable`, operation: "Summarize this table", origin: "design-system/MatrxDataTable" }) : null
52024
+ ] })
52025
+ ] }, metric.id))
51904
52026
  }
51905
52027
  ) : null,
51906
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(MatrxTableChrome, { part: "toolbar", epoch: toolbarEpoch, render: () => placeToolbar(!hideToolbar && (viewTabs || toolbar?.title || toolbar?.titleCount || showSearch || toolbar?.customSearch || toolbar?.anyOf || toolbar?.layeredFilters || toolbar?.facets && toolbar.facets.length > 0 || toolbar?.leading || toolbar?.actions || toolbar?.refresh || toolbar?.add || tableId && SavedViews || hasActiveFilters || showToolbarCopy || columns.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
52028
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(MatrxTableChrome, { part: "toolbar", epoch: toolbarEpoch, render: () => placeToolbar(!hideToolbar && (showViewTabs || toolbar?.title || toolbar?.titleCount || showSearch || toolbar?.customSearch || toolbar?.anyOf || toolbar?.layeredFilters || toolbar?.facets && toolbar.facets.length > 0 || toolbar?.leading || toolbar?.actions || toolbar?.refresh || toolbar?.add || savedViewsId && SavedViews || hasActiveFilters || showToolbarCopy || columns.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
51907
52029
  TableTitleRow,
51908
52030
  {
51909
52031
  ...toolbar?.singleRow ? { singleRow: true } : {},
51910
- tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} }, tableId ?? "table") : void 0,
52032
+ tabs: viewTabs && viewTabsStore ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} }, savedViewsId ?? "table") : viewTabs && savedViewsId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SavedViews, { tableId: savedViewsId, snapshot: currentViewSnapshot, defaultSnapshot: declaredDefaultViewSnapshot, onApply: applyLatestSavedView, presentation: "tabs", related: relatedTableActions }) : void 0,
51911
52033
  ...toolbar?.title === void 0 ? {} : { title: toolbar.title },
51912
52034
  ...toolbar?.titleCount === void 0 ? {} : { count: toolbar.titleCount },
51913
- context: tableId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52035
+ context: savedViewsId && SavedViews && !viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
51914
52036
  SavedViews,
51915
52037
  {
51916
- tableId,
52038
+ tableId: savedViewsId,
51917
52039
  snapshot: currentViewSnapshot,
51918
52040
  defaultSnapshot: declaredDefaultViewSnapshot,
51919
52041
  onApply: applyLatestSavedView
@@ -52215,7 +52337,8 @@ function MatrxDataTableCore(coreProps) {
52215
52337
  ] }))
52216
52338
  ]
52217
52339
  }
52218
- )
52340
+ ),
52341
+ toolbarEnd.node
52219
52342
  ]
52220
52343
  }
52221
52344
  )) }),
@@ -52529,7 +52652,7 @@ function MatrxDataTableCore(coreProps) {
52529
52652
  {
52530
52653
  label: col.header,
52531
52654
  labelText: headerLabel,
52532
- ...facetsEnabled ? {
52655
+ ...facetsEnabled || meta?.kind !== void 0 && meta.kind !== null && coreSuggestionsEnabled ? {
52533
52656
  facets: facetState[id]?.data ?? null,
52534
52657
  facetsLoading: facetState[id]?.loading ?? false,
52535
52658
  ...facetState[id]?.error === void 0 ? {} : { facetsError: facetState[id]?.error },
@@ -52654,12 +52777,12 @@ function MatrxDataTableCore(coreProps) {
52654
52777
  },
52655
52778
  "matrx-column-spacer-end"
52656
52779
  ) : null
52657
- ] }, `sk-${i}`)) : readFailure ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { colSpan: renderedColSpan, "data-matrx-table-message-cell": true, className: "px-0 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: readFailure }) }) }) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52780
+ ] }, `sk-${i}`)) : readFailure ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { colSpan: renderedColSpan, "data-matrx-table-message-cell": true, className: "overflow-visible! px-0 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: readFailure }) }) }) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52658
52781
  "td",
52659
52782
  {
52660
52783
  colSpan: renderedColSpan,
52661
52784
  "data-matrx-table-message-cell": true,
52662
- className: "px-0 py-12 text-center",
52785
+ className: "overflow-visible! px-0 py-12 text-center",
52663
52786
  children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { "data-matrx-table-empty-state": true, className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: [
52664
52787
  renderedEmptyState?.icon,
52665
52788
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-sm font-medium text-foreground", children: renderedEmptyState?.title ?? "No rows" }),
@@ -52749,62 +52872,61 @@ function MatrxDataTableCore(coreProps) {
52749
52872
  "border-t-2 border-border bg-muted/50 font-semibold",
52750
52873
  hasSummaryTotals && "sticky bottom-0 z-10 bg-muted/95 backdrop-blur-sm"
52751
52874
  ), children: [
52752
- hasSummaryTotals ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
52753
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { "data-matrx-table-summary-total-caption": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("td", { colSpan: renderedColSpan, className: "px-2 pt-2 text-xs font-medium text-muted-foreground", children: [
52754
- summaryCaption,
52755
- readView.stale ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-1 text-amber-700 dark:text-amber-300", children: "Retained rows may be out of date." }) : null
52756
- ] }) }),
52757
- /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { "data-matrx-table-summary-totals": true, children: [
52758
- selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
52759
- columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52760
- "td",
52761
- {
52762
- "aria-hidden": "true",
52763
- "data-matrx-table-column-spacer": "start",
52764
- className: "border-0 p-0",
52765
- style: { width: `${columnSpacers.start}px`, minWidth: `${columnSpacers.start}px` }
52766
- },
52767
- "matrx-summary-column-spacer-start"
52768
- ) : null,
52769
- renderedColumns.map((column) => {
52770
- const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
52771
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
52772
- "td",
52773
- {
52774
- className: cn(
52775
- "px-2 py-2 align-middle",
52776
- (column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
52777
- column.className,
52778
- column.align === "center" && "text-center",
52779
- column.align === "right" && "text-right"
52780
- ),
52781
- style: columnWidthVar(
52782
- resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
52783
- windowedWidthFor(columnId(column), column.width),
52784
- columnId(column),
52785
- resizableColumns && column.resizable !== false
52786
- ),
52787
- children: [
52788
- total?.value,
52789
- total?.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${columnId(column)} total is unavailable`, operation: "Total this column", origin: "design-system/MatrxDataTable" }) : null
52790
- ]
52791
- },
52792
- columnId(column)
52793
- );
52794
- }),
52795
- columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52875
+ hasSummaryTotals ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { "data-matrx-table-summary-totals": true, children: [
52876
+ selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
52877
+ columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52878
+ "td",
52879
+ {
52880
+ "aria-hidden": "true",
52881
+ "data-matrx-table-column-spacer": "start",
52882
+ className: "border-0 p-0",
52883
+ style: { width: `${columnSpacers.start}px`, minWidth: `${columnSpacers.start}px` }
52884
+ },
52885
+ "matrx-summary-column-spacer-start"
52886
+ ) : null,
52887
+ renderedColumns.map((column, columnIndex) => {
52888
+ const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
52889
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
52796
52890
  "td",
52797
52891
  {
52798
- "aria-hidden": "true",
52799
- "data-matrx-table-column-spacer": "end",
52800
- className: "border-0 p-0",
52801
- style: { width: `${columnSpacers.end}px`, minWidth: `${columnSpacers.end}px` }
52892
+ className: cn(
52893
+ "px-2 py-2 align-middle font-semibold",
52894
+ (column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
52895
+ column.className,
52896
+ column.align === "center" && "text-center",
52897
+ column.align === "right" && "text-right"
52898
+ ),
52899
+ style: columnWidthVar(
52900
+ resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
52901
+ windowedWidthFor(columnId(column), column.width),
52902
+ columnId(column),
52903
+ resizableColumns && column.resizable !== false
52904
+ ),
52905
+ children: [
52906
+ columnIndex === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { "data-matrx-table-summary-total-label": true, className: "text-sm font-semibold text-foreground", children: [
52907
+ summaryCaption,
52908
+ readView.stale ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-1 text-xs text-amber-700 dark:text-amber-300", children: "Retained rows may be out of date." }) : null
52909
+ ] }) : null,
52910
+ columnIndex === 0 && total?.value != null ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-2", children: total.value }) : null,
52911
+ columnIndex !== 0 ? total?.value : null,
52912
+ total?.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${columnId(column)} total is unavailable`, operation: "Total this column", origin: "design-system/MatrxDataTable" }) : null
52913
+ ]
52802
52914
  },
52803
- "matrx-summary-column-spacer-end"
52804
- ) : null,
52805
- showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", {}) : null
52806
- ] })
52807
- ] }) : null,
52915
+ columnId(column)
52916
+ );
52917
+ }),
52918
+ columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
52919
+ "td",
52920
+ {
52921
+ "aria-hidden": "true",
52922
+ "data-matrx-table-column-spacer": "end",
52923
+ className: "border-0 p-0",
52924
+ style: { width: `${columnSpacers.end}px`, minWidth: `${columnSpacers.end}px` }
52925
+ },
52926
+ "matrx-summary-column-spacer-end"
52927
+ ) : null,
52928
+ showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", {}) : null
52929
+ ] }) }) : null,
52808
52930
  footerRows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { children: [
52809
52931
  selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
52810
52932
  columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
@@ -53034,6 +53156,7 @@ function MatrxDataTableCore(coreProps) {
53034
53156
  showAllOption: allRowsAreLoaded,
53035
53157
  allValue: 0,
53036
53158
  allOptionLabel: "All loaded",
53159
+ isFetching,
53037
53160
  compact: true,
53038
53161
  hideEntriesInfo: false
53039
53162
  }
@@ -53388,7 +53511,7 @@ function HierarchyDragIndicatorLayer({
53388
53511
  scrollRef,
53389
53512
  resolve: resolve2
53390
53513
  }) {
53391
- const [indicator, setIndicator] = (0, import_react21.useState)(
53514
+ const [indicator, setIndicator] = (0, import_react22.useState)(
53392
53515
  null
53393
53516
  );
53394
53517
  (0, import_core3.useDndMonitor)({
@@ -53492,9 +53615,9 @@ function HierarchyDroppableRow({
53492
53615
  children
53493
53616
  }) {
53494
53617
  const { setNodeRef } = (0, import_core3.useDroppable)({ id, disabled });
53495
- if (!(0, import_react21.isValidElement)(children) || children.type !== "tr") return children;
53618
+ if (!(0, import_react22.isValidElement)(children) || children.type !== "tr") return children;
53496
53619
  const row = children;
53497
- return (0, import_react21.cloneElement)(row, {
53620
+ return (0, import_react22.cloneElement)(row, {
53498
53621
  ref: setNodeRef,
53499
53622
  className: row.props.className
53500
53623
  });
@@ -53604,7 +53727,7 @@ function columnWidthVar(width, resizedWidth, id, resizable) {
53604
53727
  };
53605
53728
  }
53606
53729
  function DefaultJsonCell({ value }) {
53607
- const [open, setOpen] = (0, import_react21.useState)(false);
53730
+ const [open, setOpen] = (0, import_react22.useState)(false);
53608
53731
  const host = useMatrxDataTableHost();
53609
53732
  const Viewer = host.JsonViewer;
53610
53733
  const text = JSON.stringify(value, null, 2);
@@ -53687,7 +53810,7 @@ function resolveStringTitle(title, fallback) {
53687
53810
  }
53688
53811
 
53689
53812
  // src/data-table/SavedViewsControl.tsx
53690
- var import_react22 = require("react");
53813
+ var import_react23 = require("react");
53691
53814
 
53692
53815
  // src/dropdown-menu.tsx
53693
53816
  var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
@@ -53834,14 +53957,26 @@ function SavedViewsControl({
53834
53957
  onSelect,
53835
53958
  onSaveNew,
53836
53959
  onUpdate,
53837
- onReload
53960
+ onReload,
53961
+ presentation = "menu",
53962
+ onRename,
53963
+ related
53838
53964
  }) {
53839
- const unsavedChangesId = (0, import_react22.useId)();
53840
- const [saveOpen, setSaveOpen] = (0, import_react22.useState)(false);
53841
- const [name, setName] = (0, import_react22.useState)("");
53842
- const [saving, setSaving] = (0, import_react22.useState)(false);
53843
- const [actionError, setActionError] = (0, import_react22.useState)(null);
53965
+ const unsavedChangesId = (0, import_react23.useId)();
53966
+ const [saveOpen, setSaveOpen] = (0, import_react23.useState)(false);
53967
+ const [name, setName] = (0, import_react23.useState)("");
53968
+ const [saving, setSaving] = (0, import_react23.useState)(false);
53969
+ const [actionError, setActionError] = (0, import_react23.useState)(null);
53970
+ const [pendingSelect, setPendingSelect] = (0, import_react23.useState)(void 0);
53844
53971
  const visibleError = actionError ?? error;
53972
+ const select = (id) => {
53973
+ if (id === activeId) return;
53974
+ if (dirty) {
53975
+ setPendingSelect(id);
53976
+ return;
53977
+ }
53978
+ onSelect(id);
53979
+ };
53845
53980
  const save = async () => {
53846
53981
  const next = name.trim();
53847
53982
  if (!next) return;
@@ -53883,7 +54018,31 @@ function SavedViewsControl({
53883
54018
  };
53884
54019
  const activeName = activeId ? views.find((view) => view.id === activeId)?.name : void 0;
53885
54020
  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-1", "data-matrx-table-saved-views": true, children: [
53886
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenu, { children: [
54021
+ presentation === "tabs" ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
54022
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
54023
+ TableViewTabs,
54024
+ {
54025
+ tabs: [{ id: "default", label: "Default view" }, ...views.map((view) => ({ id: view.id, label: view.name }))],
54026
+ activeId: activeId ?? "default",
54027
+ onSelect: (id) => select(id === "default" ? null : id),
54028
+ onAdd: () => {
54029
+ setActionError(null);
54030
+ setSaveOpen(true);
54031
+ },
54032
+ onClose: () => {
54033
+ },
54034
+ onRename: (id, label) => {
54035
+ if (onRename) void Promise.resolve(onRename(id, label)).catch((cause) => setActionError(cause instanceof Error ? cause.message : String(cause)));
54036
+ },
54037
+ closable: false,
54038
+ renameable: Boolean(onRename),
54039
+ addHint: "Save a named view to your account",
54040
+ related
54041
+ }
54042
+ ),
54043
+ dirty ? onUpdate ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "ghost", size: "sm", disabled: saving, onClick: () => void update(), className: "h-8 shrink-0 text-xs", children: "Save changes" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "ghost", size: "sm", disabled: saving, onClick: () => setSaveOpen(true), className: "h-8 shrink-0 text-xs", children: "Save as view" }) : null,
54044
+ loading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { role: "status", className: "text-xs text-muted-foreground", children: "Loading views\u2026" }) : null
54045
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenu, { children: [
53887
54046
  /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Tooltip, { children: [
53888
54047
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
53889
54048
  Button,
@@ -53906,7 +54065,7 @@ function SavedViewsControl({
53906
54065
  ] }),
53907
54066
  /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuContent, { align: "end", children: [
53908
54067
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuLabel, { children: "Views" }),
53909
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => onSelect(value === "__default__" ? null : value), children: [
54068
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => select(value === "__default__" ? null : value), children: [
53910
54069
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: "__default__", children: "Default view" }),
53911
54070
  views.map((view) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: view.id, children: view.name }, view.id))
53912
54071
  ] }),
@@ -53919,7 +54078,10 @@ function SavedViewsControl({
53919
54078
  onReload ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuItem, { disabled: saving || loading, onSelect: () => void reload(), children: "Reload views" }) : null
53920
54079
  ] })
53921
54080
  ] }),
53922
- dirty ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { id: unsavedChangesId, className: "sr-only", children: "This table view has unsaved changes. Open the view menu to save or update it." }) : null,
54081
+ dirty ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { id: presentation === "menu" ? unsavedChangesId : void 0, role: presentation === "tabs" ? "status" : void 0, className: "sr-only", children: [
54082
+ "This table view has unsaved changes. ",
54083
+ presentation === "tabs" ? onUpdate ? "Use Save changes to update it." : "Use Save as view to keep it." : "Open the view menu to save or update it."
54084
+ ] }) : null,
53923
54085
  visibleError && !saveOpen ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ErrorBox, { className: "basis-full break-words text-xs text-destructive", message: visibleError, operation: "Load or save a saved view", origin: "design-system/SavedViewsControl" }) : null,
53924
54086
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: saveOpen, onOpenChange: setSaveOpen, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
53925
54087
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Save current view" }) }),
@@ -53929,6 +54091,20 @@ function SavedViewsControl({
53929
54091
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setSaveOpen(false), children: "Cancel" }),
53930
54092
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", disabled: !name.trim() || saving, onClick: () => void save(), children: saving ? "Saving\u2026" : "Save view" })
53931
54093
  ] })
54094
+ ] }) }),
54095
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: pendingSelect !== void 0, onOpenChange: (open) => {
54096
+ if (!open) setPendingSelect(void 0);
54097
+ }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
54098
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Unsaved view changes" }) }),
54099
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm text-muted-foreground", children: "Switching views will discard the changes you have not saved." }),
54100
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogFooter, { children: [
54101
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setPendingSelect(void 0), children: "Stay on this view" }),
54102
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", onClick: () => {
54103
+ const next = pendingSelect;
54104
+ setPendingSelect(void 0);
54105
+ if (next !== void 0) onSelect(next);
54106
+ }, children: "Discard changes and switch" })
54107
+ ] })
53932
54108
  ] }) })
53933
54109
  ] });
53934
54110
  }