@ai-matrx/design-system 0.49.12 → 0.49.19

package/dist/data-table/index.cjs

@@ -34157,7 +34157,7 @@ __export(data_table_exports, {
 module.exports = __toCommonJS(data_table_exports);
 
 // src/data-table/MatrxDataTable.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_react_dom3 = require("react-dom");
 var import_core3 = require("@dnd-kit/core");
 
@@ -35238,7 +35238,11 @@ function TableTitleRow({
       "data-matrx-table-toolbar": true,
       className: cn(
         "relative flex min-w-0 shrink-0 items-center gap-2",
-        singleRow ? "flex-nowrap overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "flex-wrap",
+        // `max-w-full`: drawn into a page's row slot (`portalInto`), the row is held to the slot's
+        // width, so IT is the scroller its pinned controls stick to — never a row as wide as its
+        // content inside a narrower slot, where "sticky" had nothing to stick to and "New record"
+        // sat past the slot's edge, cut to "N" (merged-grid leftovers, 2026-09-28).
+        singleRow ? "max-w-full flex-nowrap overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "flex-wrap",
         // ONE CONTROL HEIGHT ON A TOOLBAR ROW (lane C, review 2026-09-26: 28/32/44 mixed): a host's
         // tap-target toolbar actions draw at 32px like every other control; a finger (coarse
         // pointer) keeps the 44px floor.
@@ -36731,7 +36735,7 @@ function GenericTablePagination({
 // src/data-table/TableViewTabs.tsx
 var import_react7 = require("react");
 var import_jsx_runtime24 = require("react/jsx-runtime");
-function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone }) {
+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 }) {
   const [renaming, setRenaming] = (0, import_react7.useState)(null);
   const [draft, setDraft] = (0, import_react7.useState)("");
   const opened = (0, import_react7.useRef)(null);
@@ -36754,9 +36758,11 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
     if (id) onEditCancel?.(id);
     onEditDone?.();
   };
+  const canClose = (id) => closable && tabs.length > 1 && id !== "default";
+  const canRename = (id) => renameable && id !== "default";
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 shrink-0 items-center border-b", "data-matrx-table-tabs": true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { role: "tablist", "aria-label": "Table views", className: "flex min-w-0 flex-1 items-center overflow-x-auto", children: [
-      tabs.map((tab, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "group flex shrink-0 items-center border-r", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 flex-1 items-center overflow-x-auto", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { role: "tablist", "aria-label": "Table views", className: "flex shrink-0 items-center", children: tabs.map((tab, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { role: "presentation", className: "group flex shrink-0 items-center border-r", children: [
         renaming === tab.id ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "input",
           {
@@ -36780,12 +36786,26 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
             role: "tab",
             "aria-selected": tab.id === activeId,
             tabIndex: tab.id === activeId ? 0 : -1,
+            "aria-keyshortcuts": [canClose(tab.id) ? "Delete" : "", canRename(tab.id) ? "F2" : ""].filter(Boolean).join(" ") || void 0,
             onClick: () => onSelect(tab.id),
             onDoubleClick: () => {
-              setDraft(tab.label);
-              setRenaming(tab.id);
+              if (canRename(tab.id)) {
+                setDraft(tab.label);
+                setRenaming(tab.id);
+              }
             },
             onKeyDown: (e) => {
+              if (e.key === "Delete" && canClose(tab.id)) {
+                e.preventDefault();
+                onClose(tab.id);
+                return;
+              }
+              if (e.key === "F2" && canRename(tab.id)) {
+                e.preventDefault();
+                setDraft(tab.label);
+                setRenaming(tab.id);
+                return;
+              }
               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;
               if (next >= 0) {
                 e.preventDefault();
@@ -36801,17 +36821,18 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
             ]
           }
         ),
-        tabs.length > 1 && tab.id !== "default" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
-          /* @__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" }) }) }),
+        canClose(tab.id) && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", "aria-hidden": "true", tabIndex: -1, "data-close-tab": tab.id, onClick: () => onClose(tab.id), className: "flex size-7 items-center justify-center rounded hover:bg-muted", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(X, { className: "size-4" }) }) }),
           /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(TooltipContent, { children: [
             "Close ",
-            tab.label
+            tab.label,
+            " (Delete)"
           ] })
         ] })
-      ] }, tab.id)),
+      ] }, tab.id)) }),
       /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
         /* @__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" }) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: "New view from the current one \xB7 double-click a tab to rename" })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: addHint })
       ] })
     ] }),
     related && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex shrink-0 items-center gap-1 border-l px-2", children: related })
@@ -42172,6 +42193,7 @@ CommandShortcut.displayName = "CommandShortcut";
 var MAX_LISTABLE_FACET_LENGTH = 300;
 var DEFAULT_FACET_LIMIT = 200;
 var MAX_FACET_LIMIT = 500;
+var CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT = 15;
 function facetText(raw) {
   if (raw === null || raw === void 0) return "";
   if (typeof raw === "object") {
@@ -42298,6 +42320,7 @@ function HeaderMenuItems({
     const disabled = Boolean(item.disabledReason);
     const hasSubmenu = Boolean(item.submenu && item.submenu.length > 0);
     return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col", children: [
+      item.separatorBefore ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { role: "separator", className: "-mx-1 my-1 h-px bg-border" }) : null,
       /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
         Button,
         {
@@ -42367,7 +42390,7 @@ function ColumnHeaderCell({
   compact = false,
   marker,
   filterApplyLabel,
-  filterShowCancel = false,
+  filterShowCancel,
   filterFooterHint,
   allowNegation = false,
   allowNullModes = false,
@@ -42405,7 +42428,8 @@ function ColumnHeaderCell({
   } : void 0;
   const reorderClass = reorderEnabled ? "touch-none cursor-grab active:cursor-grabbing" : void 0;
   const filterActive = isColumnFilterActive(filterValue);
-  const deferredFilter = filterApplyLabel !== void 0 || filterShowCancel || filterFooterHint !== void 0;
+  const deferredFilter = filterKind === "text" || filterApplyLabel !== void 0 || Boolean(filterShowCancel) || filterFooterHint !== void 0;
+  const showFilterCancel = filterShowCancel ?? filterKind === "text";
   const [filterOpen, setFilterOpen] = (0, import_react13.useState)(false);
   const [pendingNegation, setPendingNegation] = (0, import_react13.useState)(false);
   const [draftFilter, setDraftFilter] = (0, import_react13.useState)(filterValue);
@@ -42566,7 +42590,7 @@ function ColumnHeaderCell({
         filterKind && deferredFilter ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "mt-2 border-t border-border pt-2", children: [
           filterFooterHint ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "mb-2 text-xs text-muted-foreground", children: filterFooterHint }) : null,
           /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-end gap-2", children: [
-            filterShowCancel ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
+            showFilterCancel ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
             /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", size: "sm", onClick: applyFilter, children: filterApplyLabel ?? "Apply" })
           ] })
         ] }) : null,
@@ -42913,7 +42937,7 @@ function FacetChecklist({
   onChange
 }) {
   const [query, setQuery] = (0, import_react13.useState)("");
-  const selected = value?.kind === "select" ? value.values ?? (value.value && value.value !== "__all__" ? [value.value] : []) : [];
+  const selected = value?.kind === "select" ? (value.values ?? (value.value && value.value !== "__all__" ? [value.value] : [])).map((candidate) => candidate === SELECT_EMPTY_VALUE ? "" : candidate) : [];
   const selectedSet = new Set(selected);
   const rows = (0, import_react13.useMemo)(() => {
     if (!facets) return [];
@@ -42931,7 +42955,7 @@ function FacetChecklist({
     const next = new Set(selectedSet);
     if (next.has(candidate)) next.delete(candidate);
     else next.add(candidate);
-    const values = [...next];
+    const values = [...next].map((value2) => value2 === "" ? SELECT_EMPTY_VALUE : value2);
     onChange(
       values.length === 0 ? void 0 : { kind: "select", value: values[0] ?? "", values }
     );
@@ -45492,6 +45516,62 @@ function ToolbarListedLabel({ label, children }) {
   ] });
 }
 
+// src/data-table/pinned-fold.ts
+var import_react17 = require("react");
+function pinnedMustFold(room, full) {
+  if (room <= 0 || full === null) return false;
+  return full > room + 0.5;
+}
+function usePinnedFold(el, active) {
+  const [folded, setFolded] = (0, import_react17.useState)(false);
+  const full = (0, import_react17.useRef)(null);
+  const current = (0, import_react17.useRef)(false);
+  (0, import_react17.useEffect)(() => {
+    if (!active || !el) {
+      if (current.current) {
+        current.current = false;
+        setFolded(false);
+      }
+      return;
+    }
+    const row = el.closest("[data-matrx-table-toolbar]") ?? el.parentElement;
+    if (!row) return;
+    let pending = 0;
+    let stopped = false;
+    const measure = () => {
+      pending = 0;
+      if (stopped) return;
+      if (!current.current) {
+        const width = Math.max(el.getBoundingClientRect().width || 0, el.scrollWidth || 0);
+        if (width > 0) full.current = width;
+      }
+      const next = pinnedMustFold(row.clientWidth, full.current);
+      if (next !== current.current) {
+        current.current = next;
+        setFolded(next);
+      }
+    };
+    const schedule = () => {
+      if (pending) return;
+      pending = typeof requestAnimationFrame === "function" && typeof document !== "undefined" && document.visibilityState !== "hidden" ? requestAnimationFrame(measure) : setTimeout(measure, 0);
+    };
+    const sizes = typeof ResizeObserver === "function" ? new ResizeObserver(schedule) : null;
+    sizes?.observe(row);
+    sizes?.observe(el);
+    const content = typeof MutationObserver === "function" ? new MutationObserver(schedule) : null;
+    content?.observe(el, { childList: true, subtree: true, characterData: true });
+    if (typeof window !== "undefined") window.addEventListener("resize", schedule);
+    measure();
+    return () => {
+      stopped = true;
+      sizes?.disconnect();
+      content?.disconnect();
+      if (typeof window !== "undefined") window.removeEventListener("resize", schedule);
+    };
+  }, [el, active]);
+  return folded;
+}
+
 // src/data-table/coverage.ts
 var PARTIAL_BADGE = "Partial";
 var UNKNOWN_TOTAL_BADGE = "Unknown total";
@@ -45640,7 +45720,7 @@ function rankTableSearchRows(rows, columns, query, options = {}, extraText) {
 }
 
 // src/data-table/ColumnManager.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_core2 = require("@dnd-kit/core");
 var import_jsx_runtime43 = require("react/jsx-runtime");
 function ColumnManager({
@@ -45651,15 +45731,15 @@ function ColumnManager({
   hidden,
   onApply
 }) {
-  const byId = (0, import_react17.useMemo)(
+  const byId = (0, import_react18.useMemo)(
     () => new Map(columns.map((column) => [columnId(column), column])),
     [columns]
   );
-  const [draftOrder, setDraftOrder] = (0, import_react17.useState)(order);
-  const [draftHidden, setDraftHidden] = (0, import_react17.useState)(() => new Set(hidden));
-  const [draggedColumnId, setDraggedColumnId] = (0, import_react17.useState)(null);
-  const [dropTarget, setDropTarget] = (0, import_react17.useState)(null);
-  (0, import_react17.useEffect)(() => {
+  const [draftOrder, setDraftOrder] = (0, import_react18.useState)(order);
+  const [draftHidden, setDraftHidden] = (0, import_react18.useState)(() => new Set(hidden));
+  const [draggedColumnId, setDraggedColumnId] = (0, import_react18.useState)(null);
+  const [dropTarget, setDropTarget] = (0, import_react18.useState)(null);
+  (0, import_react18.useEffect)(() => {
     if (!open) return;
     setDraftOrder(order);
     setDraftHidden(new Set(hidden));
@@ -46146,7 +46226,7 @@ var layeredRuleSchema = import_zod2.z.object({ id: import_zod2.z.string().min(1)
 var snapshotSchema = import_zod2.z.object({
   __kind: import_zod2.z.literal("matrx-table-view"),
   version: import_zod2.z.literal(1),
-  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() }),
+  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() }),
   columns: import_zod2.z.object({
     order: import_zod2.z.array(import_zod2.z.string().min(1)).refine((order) => new Set(order).size === order.length, {
       message: "Column order must not contain duplicate IDs"
@@ -46201,7 +46281,7 @@ function parseTableViewSnapshot(raw) {
 }
 
 // src/data-table/MatrxUuidCell.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
 var SHORT_LEN = 8;
 function shortUuid(id, len = SHORT_LEN) {
@@ -46241,11 +46321,11 @@ function MatrxUuidCell({
 }) {
   const { resolveEntityDoors, ResourcePeek } = useMatrxDataTableHost();
   const { notify, notice } = useTableNotice();
-  const [copied, setCopied] = (0, import_react18.useState)(false);
-  const [opening, setOpening] = (0, import_react18.useState)(false);
-  const [peekOpen, setPeekOpen] = (0, import_react18.useState)(false);
-  const timer = (0, import_react18.useRef)(null);
-  (0, import_react18.useEffect)(
+  const [copied, setCopied] = (0, import_react19.useState)(false);
+  const [opening, setOpening] = (0, import_react19.useState)(false);
+  const [peekOpen, setPeekOpen] = (0, import_react19.useState)(false);
+  const timer = (0, import_react19.useRef)(null);
+  (0, import_react19.useEffect)(
     () => () => {
       if (timer.current) clearTimeout(timer.current);
     },
@@ -46540,7 +46620,7 @@ function DataRowInspector({
 }
 
 // src/data-table/DataRowWindow.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_jsx_runtime46 = require("react/jsx-runtime");
 function DataRowWindow({
   isOpen,
@@ -46561,8 +46641,8 @@ function DataRowWindow({
   const hasEdit = editContent != null;
   const hasTabs = hasEdit && children == null;
   const initialTab = defaultTab ?? (hasEdit ? "edit" : "view");
-  const [tab, setTab] = (0, import_react19.useState)(initialTab);
-  (0, import_react19.useEffect)(() => {
+  const [tab, setTab] = (0, import_react20.useState)(initialTab);
+  (0, import_react20.useEffect)(() => {
     if (!isOpen) return;
     setTab(defaultTab ?? (hasEdit ? "edit" : "view"));
   }, [isOpen, windowId, hasEdit, defaultTab]);
@@ -47803,7 +47883,7 @@ function DirtySavePill({
 }
 
 // src/data-table/EditableTableCell.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_jsx_runtime49 = require("react/jsx-runtime");
 function CellRefusal({ reason }) {
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -47865,12 +47945,12 @@ function EditableTableCell({
   editRequest,
   editSeed
 }) {
-  const [open, setOpen] = (0, import_react20.useState)(false);
-  const [refusal, setRefusal] = (0, import_react20.useState)(null);
-  (0, import_react20.useEffect)(() => {
+  const [open, setOpen] = (0, import_react21.useState)(false);
+  const [refusal, setRefusal] = (0, import_react21.useState)(null);
+  (0, import_react21.useEffect)(() => {
     if (editRequest !== void 0) setOpen(true);
   }, [editRequest]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!open) setRefusal(null);
   }, [open]);
   const usePencil = Boolean(href) || editTrigger === "pencil";
@@ -47974,13 +48054,13 @@ function InlineStringEditor({
   editRequest,
   editSeed
 }) {
-  const [editing, setEditing] = (0, import_react20.useState)(false);
-  const [draft, setDraft] = (0, import_react20.useState)(value);
-  const [refusal, setRefusal] = (0, import_react20.useState)(null);
-  const handledEditRequest = (0, import_react20.useRef)(void 0);
-  const seedRef = (0, import_react20.useRef)(editSeed);
+  const [editing, setEditing] = (0, import_react21.useState)(false);
+  const [draft, setDraft] = (0, import_react21.useState)(value);
+  const [refusal, setRefusal] = (0, import_react21.useState)(null);
+  const handledEditRequest = (0, import_react21.useRef)(void 0);
+  const seedRef = (0, import_react21.useRef)(editSeed);
   seedRef.current = editSeed;
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (editRequest === void 0 || handledEditRequest.current === editRequest) return;
     handledEditRequest.current = editRequest;
     setDraft(seedRef.current ?? value);
@@ -48140,8 +48220,8 @@ function DateEditor({
   onCommit,
   onCancel
 }) {
-  const [draft, setDraft] = (0, import_react20.useState)(value);
-  const done = (0, import_react20.useRef)(false);
+  const [draft, setDraft] = (0, import_react21.useState)(value);
+  const done = (0, import_react21.useRef)(false);
   const finish = () => {
     if (done.current) return;
     done.current = true;
@@ -48176,8 +48256,8 @@ function TagsEditor({
   onCommit,
   onCancel
 }) {
-  const [tags, setTags] = (0, import_react20.useState)(value);
-  const [draft, setDraft] = (0, import_react20.useState)("");
+  const [tags, setTags] = (0, import_react21.useState)(value);
+  const [draft, setDraft] = (0, import_react21.useState)("");
   const add = (raw) => {
     const next = raw.trim();
     if (!next || tags.includes(next)) return;
@@ -48274,7 +48354,7 @@ function NumberEditor({
   onCommit,
   onCancel
 }) {
-  const [draft, setDraft] = (0, import_react20.useState)(String(value));
+  const [draft, setDraft] = (0, import_react21.useState)(String(value));
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
     /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       Input,
@@ -48678,6 +48758,7 @@ function safeQueryPage(requestedPage, totalItems, pageSize) {
 
 // src/data-table/MatrxDataTable.tsx
 var import_jsx_runtime51 = require("react/jsx-runtime");
+var EMPTY_TABLE_ROWS = [];
 function TableToolbarAction({
   HostAction,
   ariaLabel,
@@ -48702,7 +48783,7 @@ function TableToolbarAction({
         disabled,
         onClick,
         children: [
-          (0, import_react21.isValidElement)(children) ? (0, import_react21.cloneElement)(children, { className: cn("h-4 w-4", children.props.className) }) : children,
+          (0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-4 w-4", children.props.className) }) : children,
           /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { children: ariaLabel })
         ]
       }
@@ -48724,7 +48805,7 @@ function TableToolbarAction({
         "aria-busy": busy || void 0,
         disabled,
         onClick,
-        children: (0, import_react21.isValidElement)(children) ? (0, import_react21.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
+        children: (0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
       }
     ) }) }),
     /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TooltipContent, { children: tooltip ?? ariaLabel })
@@ -48787,7 +48868,7 @@ function MatrxDataTableWithUrlState({
     ...urlState.history === void 0 ? {} : { history: urlState.history },
     ...urlState.textHistory === void 0 ? {} : { textHistory: urlState.textHistory }
   });
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (activeUrlTableIds.has(urlState.id)) {
       throw new Error(
         `Duplicate MatrxDataTable urlState.id "${urlState.id}" on one page. Give every table a unique stable id.`
@@ -48896,7 +48977,7 @@ var DND_MEASURING = { droppable: { strategy: import_core3.MeasuringStrategy.Alwa
 var NO_LAYERED_FILTERS = [];
 var NO_GROUPING_VALUE = "__matrx_no_grouping__";
 function useRenderEpoch(values) {
-  const held = (0, import_react21.useRef)(null);
+  const held = (0, import_react22.useRef)(null);
   const previous = held.current;
   if (previous !== null && previous.values.length === values.length && previous.values.every((value, i) => Object.is(value, values[i]))) {
     return previous.epoch;
@@ -48938,10 +49019,10 @@ function versionFacts(version2) {
 function sameBodyRow(a, b) {
   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]));
 }
-var MatrxTableBodyRow = (0, import_react21.memo)(function MatrxTableBodyRow2({ row, index, render }) {
+var MatrxTableBodyRow = (0, import_react22.memo)(function MatrxTableBodyRow2({ row, index, render }) {
   return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render(row, index) });
 }, sameBodyRow);
-var MatrxTableChrome = (0, import_react21.memo)(function MatrxTableChrome2({ render }) {
+var MatrxTableChrome = (0, import_react22.memo)(function MatrxTableChrome2({ render }) {
   return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render() });
 }, (a, b) => a.part === b.part && a.epoch === b.epoch);
 function columnsSignature(columns) {
@@ -49040,9 +49121,9 @@ function MatrxDataTableCore(coreProps) {
   } = coreProps;
   const appendQuery = query?.mode === "controlled-append" ? query : null;
   const appendQueryKey = appendQuery?.pagination.queryKey ?? null;
-  const committedAppendQueryKey = (0, import_react21.useRef)(appendQueryKey);
+  const committedAppendQueryKey = (0, import_react22.useRef)(appendQueryKey);
   const appendSourceChanged = appendQuery !== null && committedAppendQueryKey.current !== appendQueryKey;
-  const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ?? [];
+  const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ?? EMPTY_TABLE_ROWS;
   const readView = tableReadView(read, data.length, appendQuery ? appendQuery.pagination.loading : suppliedLoading);
   const isLoading = readView.loading;
   const isFetching = appendQuery ? appendQuery.pagination.isFetchingNextPage : suppliedFetching;
@@ -49053,19 +49134,21 @@ function MatrxDataTableCore(coreProps) {
   const ContextMenuBoundary = host.ContextMenuBoundary ?? TableContextPassthrough;
   const resolvedDensity = density ?? host.defaultDensity ?? "normal";
   const SavedViews = host.SavedViews;
+  const savedViewsId = tableId ?? urlState?.id;
+  const showViewTabs = viewTabs && Boolean(viewTabsStore || savedViewsId && SavedViews);
   const Link = host.Link ?? DefaultTableLink;
   const SidePanelSurface = host.SidePanelSurface ?? DefaultTableSidePanel;
   const { notify: toast, notice } = useTableNotice();
-  const [savedViewError, setSavedViewError] = (0, import_react21.useState)(null);
-  const [toolbarActionError, setToolbarActionError] = (0, import_react21.useState)(null);
-  const [toolbarActionPending, setToolbarActionPending] = (0, import_react21.useState)({ refresh: false, add: false });
-  const toolbarActionPendingRef = (0, import_react21.useRef)({ refresh: false, add: false });
+  const [savedViewError, setSavedViewError] = (0, import_react22.useState)(null);
+  const [toolbarActionError, setToolbarActionError] = (0, import_react22.useState)(null);
+  const [toolbarActionPending, setToolbarActionPending] = (0, import_react22.useState)({ refresh: false, add: false });
+  const toolbarActionPendingRef = (0, import_react22.useRef)({ refresh: false, add: false });
   const CHECKBOX_TAP_AREA = "h-4 w-4 touch-manipulation";
   const mobileCardsClass = mobileCardsBreakpoint === "lg" ? "lg:hidden" : "sm:hidden";
   const tableWithCardsClass = mobileCardsBreakpoint === "lg" ? "max-lg:hidden" : "max-sm:hidden";
   const cardsQuery = mobileCardsBreakpoint === "lg" ? "(max-width: 1023px)" : "(max-width: 639px)";
-  const [cardsActive, setCardsActive] = (0, import_react21.useState)(null);
-  (0, import_react21.useEffect)(() => {
+  const [cardsActive, setCardsActive] = (0, import_react22.useState)(null);
+  (0, import_react22.useEffect)(() => {
     if (!mobileCards || typeof window === "undefined" || !window.matchMedia) return;
     const mql = window.matchMedia(cardsQuery);
     const read2 = () => setCardsActive(mql.matches);
@@ -49081,12 +49164,12 @@ function MatrxDataTableCore(coreProps) {
   const appendDefaultsToSourceProcessing = appendQuery !== null && sourceProcessing === void 0;
   const sourceColumnFilterOwnership = sourceProcessing?.columnFilters;
   const sourceOwnsColumnFilters = appendDefaultsToSourceProcessing ? true : sourceColumnFilterOwnership === "source" || typeof sourceColumnFilterOwnership === "object" && sourceColumnFilterOwnership.source.length > 0;
-  const remoteQueryUsesLocalColumnFilters = remoteQuery !== null && sourceColumnFilterOwnership === "local";
+  const remoteQueryUsesLocalProcessing = remoteQuery !== null && (sourceColumnFilterOwnership === "local" || remoteQuery.mode === "controlled" && (sourceProcessing?.search === "local" || sourceProcessing?.sort === "local"));
   const sourceOwnsSort = appendQuery !== null && sourceProcessing === void 0 ? true : sourceProcessing?.sort === "source";
   const sourceOwnsIntelligentSearch = sourceProcessing?.intelligentSearch === "source";
-  const sourceOwnsSearch = remoteQuery?.mode === "controlled" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
+  const sourceOwnsSearch = remoteQuery?.mode === "controlled" && sourceProcessing?.search !== "local" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
   const intelligentSearchEnabled = toolbar?.intelligentSearch !== void 0 && (sourceOwnsIntelligentSearch || remoteQuery === null && !sourceOwnsSearch);
-  const emitControlledQueryChange = (0, import_react21.useCallback)(
+  const emitControlledQueryChange = (0, import_react22.useCallback)(
     (patch, options) => {
       if (!controlledQuery) return;
       controlledQuery.onStateChange(
@@ -49095,8 +49178,8 @@ function MatrxDataTableCore(coreProps) {
     },
     [controlledQuery]
   );
-  const [internalSearch, setInternalSearch] = (0, import_react21.useState)("");
-  const [draggedRowId, setDraggedRowId] = (0, import_react21.useState)(null);
+  const [internalSearch, setInternalSearch] = (0, import_react22.useState)("");
+  const [draggedRowId, setDraggedRowId] = (0, import_react22.useState)(null);
   const hierarchySensors = (0, import_core3.useSensors)((0, import_core3.useSensor)(import_core3.PointerSensor, POINTER_SENSOR_OPTIONS));
   const toolbarSearchControlled = toolbar?.searchValue !== void 0;
   const searchValue = controlledQuery ? controlledQuery.state.search : toolbarSearchControlled ? toolbar?.searchValue ?? "" : internalSearch;
@@ -49108,7 +49191,7 @@ function MatrxDataTableCore(coreProps) {
     }
     toolbar?.onSearchChange?.(v);
   };
-  const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react21.useState)(
+  const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react22.useState)(
     toolbar?.searchMatch?.defaultMode ?? "contains"
   );
   const searchMatchMode = controlledQuery ? controlledQuery.state.searchMatchMode ?? toolbar?.searchMatch?.defaultMode ?? "contains" : internalSearchMatchMode;
@@ -49119,7 +49202,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalSearchMatchMode(mode);
   };
-  const [internalSearchScope, setInternalSearchScope] = (0, import_react21.useState)("all");
+  const [internalSearchScope, setInternalSearchScope] = (0, import_react22.useState)("all");
   const searchScope = controlledQuery ? controlledQuery.state.searchScope ?? "all" : internalSearchScope;
   const setSearchScope = (scope) => {
     if (controlledQuery) {
@@ -49128,7 +49211,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalSearchScope(scope);
   };
-  const [internalAnyOf, setInternalAnyOf] = (0, import_react21.useState)("");
+  const [internalAnyOf, setInternalAnyOf] = (0, import_react22.useState)("");
   const toolbarAnyOfControlled = toolbar?.anyOf?.value !== void 0;
   const anyOfValue = controlledQuery ? controlledQuery.state.anyOf : toolbarAnyOfControlled ? toolbar?.anyOf?.value ?? "" : internalAnyOf;
   const setAnyOfValue = (v) => {
@@ -49139,7 +49222,7 @@ function MatrxDataTableCore(coreProps) {
     }
     toolbar?.anyOf?.onChange?.(v);
   };
-  const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react21.useState)([]);
+  const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react22.useState)([]);
   const layeredFilters = controlledQuery ? controlledQuery.state.layeredFilters ?? NO_LAYERED_FILTERS : internalLayeredFilters;
   const setLayeredFilters = (next) => {
     if (controlledQuery) {
@@ -49148,9 +49231,9 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalLayeredFilters(next);
   };
-  const [internalColumnFilters, setInternalColumnFilters] = (0, import_react21.useState)({});
+  const [internalColumnFilters, setInternalColumnFilters] = (0, import_react22.useState)({});
   const columnFilters = controlledQuery ? controlledQuery.state.columnFilters : internalColumnFilters;
-  const localColumnFilters = (0, import_react21.useMemo)(() => {
+  const localColumnFilters = (0, import_react22.useMemo)(() => {
     if (appendDefaultsToSourceProcessing) return {};
     if (sourceColumnFilterOwnership === "source") return {};
     if (sourceColumnFilterOwnership === void 0 || sourceColumnFilterOwnership === "local") {
@@ -49172,7 +49255,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalColumnFilters(nextFilters);
   };
-  const [internalSort, setInternalSort] = (0, import_react21.useState)(defaultSort);
+  const [internalSort, setInternalSort] = (0, import_react22.useState)(defaultSort);
   const sort = controlledQuery ? controlledQuery.state.sort : internalSort;
   const setSort = (next) => {
     if (controlledQuery) {
@@ -49181,7 +49264,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalSort(next);
   };
-  const [internalPage, setInternalPage] = (0, import_react21.useState)(1);
+  const [internalPage, setInternalPage] = (0, import_react22.useState)(1);
   const page = controlledQuery ? controlledQuery.state.page : internalPage;
   const setPage = (next) => {
     if (controlledQuery) {
@@ -49190,7 +49273,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalPage(next);
   };
-  const [internalPageSize, setInternalPageSize] = (0, import_react21.useState)(
+  const [internalPageSize, setInternalPageSize] = (0, import_react22.useState)(
     defaultPageSize
   );
   const pageSize = controlledQuery ? controlledQuery.state.pageSize : internalPageSize;
@@ -49201,28 +49284,28 @@ function MatrxDataTableCore(coreProps) {
     }
     setInternalPageSize(next);
   };
-  const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react21.useState)(null);
+  const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react22.useState)(null);
   const rawSelectedId = controlledSelectedId !== void 0 ? controlledSelectedId : uncontrolledSelectedId;
   const selectedId = appendSourceChanged ? null : rawSelectedId;
   const setSelectedId = (id) => {
     if (controlledSelectedId === void 0) setUncontrolledSelectedId(id);
     onSelectedIdChange?.(id);
   };
-  const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react21.useState)(null);
+  const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react22.useState)(null);
   const rawWindowRowId = controlledWindowRowId !== void 0 ? controlledWindowRowId : uncontrolledWindowRowId;
   const windowRowId = appendSourceChanged ? null : rawWindowRowId;
   const setWindowRowId = (id) => {
     if (controlledWindowRowId === void 0) setUncontrolledWindowRowId(id);
     onWindowRowIdChange?.(id);
   };
-  const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react21.useState)(null);
+  const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react22.useState)(null);
   const editScopeKey = appendQueryKey === null ? "\0local" : `append:${appendQueryKey}`;
-  const [editsByScope, setEditsByScope] = (0, import_react21.useState)({});
-  const editRevisionRef = (0, import_react21.useRef)({});
-  const [savingByScope, setSavingByScope] = (0, import_react21.useState)({});
-  const savingScopesRef = (0, import_react21.useRef)(/* @__PURE__ */ new Set());
-  const [editRequest, setEditRequest] = (0, import_react21.useState)(null);
-  const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react21.useState)(false);
+  const [editsByScope, setEditsByScope] = (0, import_react22.useState)({});
+  const editRevisionRef = (0, import_react22.useRef)({});
+  const [savingByScope, setSavingByScope] = (0, import_react22.useState)({});
+  const savingScopesRef = (0, import_react22.useRef)(/* @__PURE__ */ new Set());
+  const [editRequest, setEditRequest] = (0, import_react22.useState)(null);
+  const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react22.useState)(false);
   const edits = editsByScope[editScopeKey]?.values ?? {};
   const saving = (savingByScope[editScopeKey] ?? 0) > 0;
   const setEdits = (next) => {
@@ -49289,7 +49372,7 @@ function MatrxDataTableCore(coreProps) {
     rows: Object.entries(draft.values).map(([rowId, columns2]) => ({ rowId, columns: columns2 }))
   }));
   const selection = appendSourceChanged && selectionConfig ? { ...selectionConfig, selectedIds: [] } : selectionConfig;
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     const previous = committedAppendQueryKey.current;
     committedAppendQueryKey.current = appendQueryKey;
     if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
@@ -49307,14 +49390,14 @@ function MatrxDataTableCore(coreProps) {
     onWindowRowIdChange,
     selectionConfig
   ]);
-  const scrollRef = (0, import_react21.useRef)(null);
-  const tableRef = (0, import_react21.useRef)(null);
-  const tableHeaderRef = (0, import_react21.useRef)(null);
-  const cardsScrollRef = (0, import_react21.useRef)(null);
-  const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react21.useState)(false);
-  const documentStickyHeaderRef = (0, import_react21.useRef)(false);
-  const previousAppendKeyForScrollReset = (0, import_react21.useRef)(appendQueryKey);
-  (0, import_react21.useLayoutEffect)(() => {
+  const scrollRef = (0, import_react22.useRef)(null);
+  const tableRef = (0, import_react22.useRef)(null);
+  const tableHeaderRef = (0, import_react22.useRef)(null);
+  const cardsScrollRef = (0, import_react22.useRef)(null);
+  const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react22.useState)(false);
+  const documentStickyHeaderRef = (0, import_react22.useRef)(false);
+  const previousAppendKeyForScrollReset = (0, import_react22.useRef)(appendQueryKey);
+  (0, import_react22.useLayoutEffect)(() => {
     const previous = previousAppendKeyForScrollReset.current;
     previousAppendKeyForScrollReset.current = appendQueryKey;
     if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
@@ -49339,14 +49422,14 @@ function MatrxDataTableCore(coreProps) {
     ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.thresholdPx !== void 0 ? { thresholdPx: appendScrollPolicy.thresholdPx } : {},
     ...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.intentTimeoutMs !== void 0 ? { intentTimeoutMs: appendScrollPolicy.intentTimeoutMs } : {}
   });
-  const rootRef = (0, import_react21.useRef)(null);
+  const rootRef = (0, import_react22.useRef)(null);
   useClippedContentGuard(rootRef, {
     label: typeof copy === "object" && copy.listLabel ? `Table: ${copy.listLabel}` : "MatrxDataTable"
   });
-  const [scrollHintRight, setScrollHintRight] = (0, import_react21.useState)(false);
-  const [scrollHintLeft, setScrollHintLeft] = (0, import_react21.useState)(false);
-  const [scrollHintRightInset, setScrollHintRightInset] = (0, import_react21.useState)(6);
-  const updateScrollHint = (0, import_react21.useCallback)(() => {
+  const [scrollHintRight, setScrollHintRight] = (0, import_react22.useState)(false);
+  const [scrollHintLeft, setScrollHintLeft] = (0, import_react22.useState)(false);
+  const [scrollHintRightInset, setScrollHintRightInset] = (0, import_react22.useState)(6);
+  const updateScrollHint = (0, import_react22.useCallback)(() => {
     const el = scrollRef.current;
     if (!el) return;
     const hasRows = Boolean(el.querySelector("tbody tr[data-row-id]"));
@@ -49363,7 +49446,7 @@ function MatrxDataTableCore(coreProps) {
       behavior: "smooth"
     });
   };
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     updateScrollHint();
     window.addEventListener("resize", updateScrollHint);
     const el = scrollRef.current;
@@ -49378,7 +49461,7 @@ function MatrxDataTableCore(coreProps) {
       observer?.disconnect();
     };
   }, [updateScrollHint, data, columns]);
-  (0, import_react21.useLayoutEffect)(() => {
+  (0, import_react22.useLayoutEffect)(() => {
     const scroll = scrollRef.current;
     const table = tableRef.current;
     const header = tableHeaderRef.current;
@@ -49437,30 +49520,30 @@ function MatrxDataTableCore(coreProps) {
       window.removeEventListener("resize", requestUpdate);
     };
   }, [stickyHeader, data, columns]);
-  const [columnOrder, setColumnOrder] = (0, import_react21.useState)(() => columnState?.order ?? columns.map(columnId));
-  const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react21.useState)(
+  const [columnOrder, setColumnOrder] = (0, import_react22.useState)(() => columnState?.order ?? columns.map(columnId));
+  const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react22.useState)(
     () => new Set(columnState?.hidden ?? columns.filter((column) => column.hidden).map(columnId))
   );
-  const [columnWidths, setColumnWidths] = (0, import_react21.useState)(
+  const [columnWidths, setColumnWidths] = (0, import_react22.useState)(
     () => normalizeColumnWidthsForColumns(columnState?.widths, columns)
   );
-  const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react21.useState)(null);
-  const knownColumnIds = (0, import_react21.useRef)(new Set(columns.map(columnId)));
-  const draggedColumnId = (0, import_react21.useRef)(null);
-  const columnDragActive = (0, import_react21.useRef)(false);
-  const columnDragRaf = (0, import_react21.useRef)(null);
-  const columnDragScrollDirection = (0, import_react21.useRef)(0);
-  const [columnDragPreview, setColumnDragPreview] = (0, import_react21.useState)(null);
-  const stopColumnDragScroll = (0, import_react21.useCallback)(() => {
+  const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react22.useState)(null);
+  const knownColumnIds = (0, import_react22.useRef)(new Set(columns.map(columnId)));
+  const draggedColumnId = (0, import_react22.useRef)(null);
+  const columnDragActive = (0, import_react22.useRef)(false);
+  const columnDragRaf = (0, import_react22.useRef)(null);
+  const columnDragScrollDirection = (0, import_react22.useRef)(0);
+  const [columnDragPreview, setColumnDragPreview] = (0, import_react22.useState)(null);
+  const stopColumnDragScroll = (0, import_react22.useCallback)(() => {
     if (columnDragRaf.current !== null) cancelAnimationFrame(columnDragRaf.current);
     columnDragRaf.current = null;
     columnDragScrollDirection.current = 0;
   }, []);
-  (0, import_react21.useEffect)(() => () => {
+  (0, import_react22.useEffect)(() => () => {
     columnDragActive.current = false;
     stopColumnDragScroll();
   }, [stopColumnDragScroll]);
-  const startColumnDragScroll = (0, import_react21.useCallback)(() => {
+  const startColumnDragScroll = (0, import_react22.useCallback)(() => {
     if (!columnDragActive.current || columnDragRaf.current !== null) return;
     const scrollStep = () => {
       const scroll = scrollRef.current;
@@ -49487,25 +49570,25 @@ function MatrxDataTableCore(coreProps) {
     };
     columnDragRaf.current = requestAnimationFrame(scrollStep);
   }, []);
-  const commitColumnState = (0, import_react21.useCallback)((order, hidden) => {
+  const commitColumnState = (0, import_react22.useCallback)((order, hidden) => {
     if (columnState) columnState.onChange({ order, hidden: [...hidden] });
     else {
       setColumnOrder(order);
       setHiddenColumnIds(hidden);
     }
   }, [columnState]);
-  const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react21.useState)(false);
+  const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react22.useState)(false);
   const columnManagerOpen = controlledColumnManager?.open ?? internalColumnManagerOpen;
   const setColumnManagerOpen = controlledColumnManager?.onOpenChange ?? setInternalColumnManagerOpen;
-  const columnIds = (0, import_react21.useMemo)(() => columns.map(columnId), [columns]);
-  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]);
-  const effectiveHiddenColumnIds = (0, import_react21.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
-  const effectiveColumnWidths = (0, import_react21.useMemo)(
+  const columnIds = (0, import_react22.useMemo)(() => columns.map(columnId), [columns]);
+  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]);
+  const effectiveHiddenColumnIds = (0, import_react22.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
+  const effectiveColumnWidths = (0, import_react22.useMemo)(
     () => normalizeColumnWidthsForColumns(columnState?.widths ?? columnWidths, columns),
     [columns, columnState?.widths, columnWidths]
   );
-  const resizeGestureSnapshotRef = (0, import_react21.useRef)(null);
-  const measureVisibleColumnWidths = (0, import_react21.useCallback)(() => {
+  const resizeGestureSnapshotRef = (0, import_react22.useRef)(null);
+  const measureVisibleColumnWidths = (0, import_react22.useCallback)(() => {
     const measured = {};
     const headers = tableRef.current ? Array.from(tableRef.current.querySelectorAll(
       "thead th[data-matrx-table-column-id]"
@@ -49519,7 +49602,7 @@ function MatrxDataTableCore(coreProps) {
     }
     return normalizeColumnWidthsForColumns(measured, columns);
   }, [columns]);
-  const measureFixedTableGeometry = (0, import_react21.useCallback)(() => {
+  const measureFixedTableGeometry = (0, import_react22.useCallback)(() => {
     const table = tableRef.current;
     const headers = table ? Array.from(table.querySelectorAll("thead th")) : [];
     const widthFor = (selector) => {
@@ -49554,16 +49637,16 @@ function MatrxDataTableCore(coreProps) {
       ...actionsWidth === void 0 ? {} : { actionsWidth }
     };
   }, [resolvedDensity]);
-  const captureResizeGestureSnapshot = (0, import_react21.useCallback)(() => {
+  const captureResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
     resizeGestureSnapshotRef.current = {
       widths: measureVisibleColumnWidths(),
       geometry: measureFixedTableGeometry()
     };
   }, [measureFixedTableGeometry, measureVisibleColumnWidths]);
-  const clearResizeGestureSnapshot = (0, import_react21.useCallback)(() => {
+  const clearResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
     resizeGestureSnapshotRef.current = null;
   }, []);
-  const commitColumnWidths = (0, import_react21.useCallback)((next, captureInitialWidths = false) => {
+  const commitColumnWidths = (0, import_react22.useCallback)((next, captureInitialWidths = false) => {
     const gestureSnapshot = captureInitialWidths ? resizeGestureSnapshotRef.current : null;
     resizeGestureSnapshotRef.current = null;
     const normalized = normalizeColumnWidthsForColumns(
@@ -49582,7 +49665,7 @@ function MatrxDataTableCore(coreProps) {
     }
     setColumnWidths(normalized);
   }, [columnIds, columnState, columns, measureFixedTableGeometry, measureVisibleColumnWidths]);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     const ids = columns.map(columnId);
     if (columnState) return;
     const previousIds = knownColumnIds.current;
@@ -49601,31 +49684,31 @@ function MatrxDataTableCore(coreProps) {
     setColumnWidths((current) => normalizeColumnWidthsForColumns(current, columns));
     knownColumnIds.current = new Set(ids);
   }, [columns, columnState]);
-  (0, import_react21.useLayoutEffect)(() => {
+  (0, import_react22.useLayoutEffect)(() => {
     for (const id of columnIds) {
       tableRef.current?.style.removeProperty(columnResizeCssVar(id));
     }
   });
-  const previewColumnOrder = (0, import_react21.useMemo)(
+  const previewColumnOrder = (0, import_react22.useMemo)(
     () => projectColumnDragOrder(effectiveColumnOrder, columnDragPreview),
     [columnDragPreview, effectiveColumnOrder]
   );
   useColumnReorderAnimation(tableRef, previewColumnOrder.join("\0"), columnDragPreview !== null);
-  const visibleColumns = (0, import_react21.useMemo)(() => {
+  const visibleColumns = (0, import_react22.useMemo)(() => {
     const byId = new Map(columns.map((column) => [columnId(column), column]));
     return previewColumnOrder.map((id) => byId.get(id)).filter(
       (column) => column !== void 0 && !effectiveHiddenColumnIds.has(columnId(column))
     );
   }, [columns, effectiveHiddenColumnIds, previewColumnOrder]);
   const usesMeasuredFixedLayout = visibleColumns.length > 0 && visibleColumns.every((column) => effectiveColumnWidths[columnId(column)] !== void 0);
-  (0, import_react21.useLayoutEffect)(() => {
+  (0, import_react22.useLayoutEffect)(() => {
     if (!usesMeasuredFixedLayout) {
       if (fixedTableGeometry !== null) setFixedTableGeometry(null);
       return;
     }
     if (fixedTableGeometry === null) setFixedTableGeometry(measureFixedTableGeometry());
   }, [fixedTableGeometry, measureFixedTableGeometry, usesMeasuredFixedLayout]);
-  (0, import_react21.useLayoutEffect)(() => {
+  (0, import_react22.useLayoutEffect)(() => {
     if (!usesMeasuredFixedLayout) return;
     const table = tableRef.current;
     if (!table) return;
@@ -49649,8 +49732,8 @@ function MatrxDataTableCore(coreProps) {
   const fixedLayoutActive = usesMeasuredFixedLayout && fixedTableGeometry !== null;
   const freezeWanted = visibleColumns.some((column) => column.frozen);
   const selectionColumnWidth = fixedTableGeometry?.selectionWidth ?? (selection && (freezeWanted || fitToWidth) ? SELECTION_COLUMN_PX : void 0);
-  const [fitSpace, setFitSpace] = (0, import_react21.useState)(null);
-  (0, import_react21.useLayoutEffect)(() => {
+  const [fitSpace, setFitSpace] = (0, import_react22.useState)(null);
+  (0, import_react22.useLayoutEffect)(() => {
     if (!fitToWidth) {
       setFitSpace(null);
       return;
@@ -49665,19 +49748,28 @@ function MatrxDataTableCore(coreProps) {
         ...strips.map((strip) => Math.ceil(strip.scrollWidth) + 16),
         actionsHeader ? Math.ceil(actionsHeader.scrollWidth) : 0
       );
-      const next = { width: el.clientWidth, actions };
-      setFitSpace((now) => now && now.width === next.width && now.actions === next.actions ? now : next);
+      const table2 = el.querySelector(":scope > table");
+      const spill = table2 && table2.hasAttribute("data-matrx-table-fit") ? Math.max(0, el.scrollWidth - el.clientWidth) : 0;
+      setFitSpace((now) => {
+        const sameWidth = now !== null && now.width === el.clientWidth;
+        const slack = sameWidth ? now.slack + spill : spill;
+        const next = { width: el.clientWidth, actions, slack };
+        return now && now.width === next.width && now.actions === next.actions && now.slack === next.slack ? now : next;
+      });
     };
     read2();
     if (typeof ResizeObserver === "undefined") return;
     const observer = new ResizeObserver(read2);
     observer.observe(el);
+    const table = el.querySelector(":scope > table");
+    if (table) observer.observe(table);
     return () => observer.disconnect();
   }, [fitToWidth, data.length]);
-  const fittedWidths = (0, import_react21.useMemo)(() => {
+  const fittedWidths = (0, import_react22.useMemo)(() => {
     if (!fitToWidth || !fitSpace) return null;
-    const scaling = visibleColumns.filter((col) => resolveColumnMarker(col) === void 0);
-    const fixed = visibleColumns.filter((col) => resolveColumnMarker(col) !== void 0).reduce((sum, col) => sum + (pixelWidth(col.width) ?? 40), 0);
+    const keepsItsWidth = (col) => resolveColumnMarker(col) !== void 0 || col.resizable === false && pixelWidth(col.width) !== void 0;
+    const scaling = visibleColumns.filter((col) => !keepsItsWidth(col));
+    const fixed = visibleColumns.filter(keepsItsWidth).reduce((sum, col) => sum + (pixelWidth(col.width) ?? 40), 0);
     const utilities = (selection ? selectionColumnWidth ?? SELECTION_COLUMN_PX : 0) + fitSpace.actions;
     return fitColumnWidths(
       scaling.map(columnId),
@@ -49685,12 +49777,12 @@ function MatrxDataTableCore(coreProps) {
         const col = scaling.find((c) => columnId(c) === id);
         return effectiveColumnWidths[id] ?? pixelWidth(col?.width) ?? FIT_DEFAULT_COLUMN_PX;
       },
-      fitSpace.width - utilities - fixed
+      fitSpace.width - utilities - fixed - fitSpace.slack
     );
   }, [fitToWidth, fitSpace, visibleColumns, selection, selectionColumnWidth, effectiveColumnWidths]);
   const fitActive = fittedWidths !== null;
   const actionsColumnWidth = fitActive && fitSpace ? fitSpace.actions : fixedTableGeometry?.actionsWidth;
-  const frozenColumns = (0, import_react21.useMemo)(() => {
+  const frozenColumns = (0, import_react22.useMemo)(() => {
     if (!freezeWanted) return NO_FROZEN_COLUMNS;
     const ids = visibleColumns.map(columnId);
     const byId = new Map(visibleColumns.map((column) => [columnId(column), column]));
@@ -49738,15 +49830,15 @@ function MatrxDataTableCore(coreProps) {
     const color = cellTintColor(row, id, colId);
     return color ? CELL_TINT_CLASS[color] : void 0;
   };
-  const declaredVisibleCopyColumns = (0, import_react21.useMemo)(
+  const declaredVisibleCopyColumns = (0, import_react22.useMemo)(
     () => visibleColumns.filter((column) => column.accessorFn !== void 0 || column.accessorKey !== void 0),
     [visibleColumns]
   );
-  const tableCopySourceNamespace = (0, import_react21.useId)();
-  const tableContextMenuInstanceId = (0, import_react21.useId)();
-  const tableDndContextId = (0, import_react21.useId)();
+  const tableCopySourceNamespace = (0, import_react22.useId)();
+  const tableContextMenuInstanceId = (0, import_react22.useId)();
+  const tableDndContextId = (0, import_react22.useId)();
   const defaultCopyTitle = toolbar?.title || "Table";
-  const defaultCopy = (0, import_react21.useMemo)(() => ({
+  const defaultCopy = (0, import_react22.useMemo)(() => ({
     label: defaultCopyTitle,
     listLabel: defaultCopyTitle,
     location: defaultCopyTitle,
@@ -49763,14 +49855,14 @@ function MatrxDataTableCore(coreProps) {
   const effectiveCopy = copy === false ? void 0 : copy ?? defaultCopy;
   const effectiveCopyColumns = copy === void 0 ? declaredVisibleCopyColumns : visibleColumns;
   const copySubsetVariant2 = useCopySubsetVariant();
-  const chromeLatest = (0, import_react21.useRef)({
+  const chromeLatest = (0, import_react22.useRef)({
     processed: [],
     data: [],
     toggleAllOnPage: () => void 0,
     showMore: async () => void 0,
     applySavedView: () => void 0
   });
-  const applyLatestSavedView = (0, import_react21.useCallback)((snapshot) => chromeLatest.current.applySavedView(snapshot), []);
+  const applyLatestSavedView = (0, import_react22.useCallback)((snapshot) => chromeLatest.current.applySavedView(snapshot), []);
   const copySubsetColumns = () => effectiveCopyColumns.filter((c) => c.filter !== false || c.accessorKey || c.accessorFn).map((c) => ({
     id: columnId(c),
     header: typeof c.header === "string" ? c.header : columnId(c),
@@ -49791,7 +49883,7 @@ function MatrxDataTableCore(coreProps) {
       serializer: (shaped) => buildViewAgentInput(effectiveCopy, shaped, chromeLatest.current.data, { scope: "custom" })
     }), copySubsetSize(rows().length, copySubsetColumns().length))
   ] : [];
-  const filterMeta = (0, import_react21.useMemo)(() => {
+  const filterMeta = (0, import_react22.useMemo)(() => {
     const meta = /* @__PURE__ */ new Map();
     for (const col of visibleColumns) {
       const id = columnId(col);
@@ -49799,15 +49891,15 @@ function MatrxDataTableCore(coreProps) {
     }
     return meta;
   }, [visibleColumns, data, remoteQuery]);
-  const intelligentSearchScopes = (0, import_react21.useMemo)(
+  const intelligentSearchScopes = (0, import_react22.useMemo)(
     () => resolveTableSearchScopes(data, columns, {
       ...toolbar?.intelligentSearch?.roles === void 0 ? {} : { roles: toolbar.intelligentSearch.roles },
       ...toolbar?.intelligentSearch?.scopes === void 0 ? {} : { scopes: toolbar.intelligentSearch.scopes }
     }),
     [columns, data, toolbar?.intelligentSearch?.roles, toolbar?.intelligentSearch?.scopes]
   );
-  const processed = (0, import_react21.useMemo)(() => {
-    if (remoteQuery && !appendUsesLocalProcessing && !remoteQueryUsesLocalColumnFilters) return data;
+  const processed = (0, import_react22.useMemo)(() => {
+    if (remoteQuery && !appendUsesLocalProcessing && !remoteQueryUsesLocalProcessing) return data;
     if (processLocalRows) {
       return processLocalRows(data, {
         page,
@@ -49863,15 +49955,15 @@ function MatrxDataTableCore(coreProps) {
     pageSize,
     remoteQuery,
     appendUsesLocalProcessing,
-    remoteQueryUsesLocalColumnFilters,
+    remoteQueryUsesLocalProcessing,
     sourceOwnsColumnFilters,
     sourceOwnsSort,
     sourceOwnsSearch,
     intelligentSearchEnabled,
     searchScope
   ]);
-  const lastNotifiedViewRows = (0, import_react21.useRef)(null);
-  (0, import_react21.useEffect)(() => {
+  const lastNotifiedViewRows = (0, import_react22.useRef)(null);
+  (0, import_react22.useEffect)(() => {
     if (!onViewChange) {
       lastNotifiedViewRows.current = null;
       return;
@@ -49880,7 +49972,7 @@ function MatrxDataTableCore(coreProps) {
     lastNotifiedViewRows.current = processed;
     if (changed) onViewChange(processed);
   }, [processed, onViewChange]);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (controlledQuery) return;
     setInternalPage(1);
   }, [
@@ -49924,7 +50016,7 @@ function MatrxDataTableCore(coreProps) {
     numberedPageHasMore: !hidePagination && !isLoading && !isFetching && processed.length > 0 && safePage < pageCount && (remoteQuery?.mode === "controlled" || !remoteQuery),
     onPageAdvance: setPage
   });
-  const paginated = (0, import_react21.useMemo)(() => {
+  const paginated = (0, import_react22.useMemo)(() => {
     if (remoteQuery) return processed;
     if (hidePagination) return processed;
     if (localProgressiveEnabled) return [...progressiveRows.rows];
@@ -49933,16 +50025,16 @@ function MatrxDataTableCore(coreProps) {
     return processed.slice(start, start + effectivePageSize);
   }, [processed, safePage, effectivePageSize, pageSize, remoteQuery, hidePagination, localProgressiveEnabled, progressiveRows.rows]);
   const groupingColumnId = grouping?.columnId ?? null;
-  const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0, import_react21.useState)([]);
+  const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0, import_react22.useState)([]);
   const collapsedGroups = grouping?.collapsed ?? uncontrolledCollapsed;
-  const setCollapsedGroups = (0, import_react21.useCallback)(
+  const setCollapsedGroups = (0, import_react22.useCallback)(
     (next) => {
       if (grouping?.onCollapsedChange) grouping.onCollapsedChange(next);
       else setUncontrolledCollapsed(next);
     },
     [grouping]
   );
-  const groups = (0, import_react21.useMemo)(() => {
+  const groups = (0, import_react22.useMemo)(() => {
     if (!grouping || !groupingColumnId) return null;
     const groupColumn = columns.find((col) => columnId(col) === groupingColumnId);
     if (!groupColumn) return null;
@@ -49961,7 +50053,7 @@ function MatrxDataTableCore(coreProps) {
       ...grouping.emptyLabel ? { emptyLabel: grouping.emptyLabel } : {}
     });
   }, [grouping, groupingColumnId, columns, paginated]);
-  const groupableColumns = (0, import_react21.useMemo)(() => {
+  const groupableColumns = (0, import_react22.useMemo)(() => {
     const allowed = grouping?.groupableColumnIds;
     return visibleColumns.filter((col) => {
       const id = columnId(col);
@@ -49969,7 +50061,7 @@ function MatrxDataTableCore(coreProps) {
       return col.accessorKey !== void 0 || col.accessorFn !== void 0;
     });
   }, [visibleColumns, grouping?.groupableColumnIds]);
-  const groupedRenderRows = (0, import_react21.useMemo)(
+  const groupedRenderRows = (0, import_react22.useMemo)(
     () => groups ? flattenGroups(groups, collapsedGroups) : null,
     [groups, collapsedGroups]
   );
@@ -49981,7 +50073,7 @@ function MatrxDataTableCore(coreProps) {
   const bodyEntryCount = groupedRenderRows ? groupedRenderRows.length : paginated.length;
   const virtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && bodyEntryCount > virtualThreshold && !hierarchy && expandedDetail === void 0;
   const columnWindowWidth = virtualizeConfig?.columnWidth ?? 160;
-  const frozenRunLength = (0, import_react21.useMemo)(() => {
+  const frozenRunLength = (0, import_react22.useMemo)(() => {
     let run = 0;
     for (const col of visibleColumns) {
       if (frozenColumns.offsets[columnId(col)] === void 0) break;
@@ -49990,9 +50082,9 @@ function MatrxDataTableCore(coreProps) {
     return run;
   }, [visibleColumns, frozenColumns]);
   const columnVirtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && virtualizeConfig.columns === true && visibleColumns.length - frozenRunLength > 30 && !hierarchy && mobileCards === void 0;
-  const [rowWindow, setRowWindow] = (0, import_react21.useState)(null);
-  const [columnWindow, setColumnWindow] = (0, import_react21.useState)(null);
-  const windowInputs = (0, import_react21.useRef)({
+  const [rowWindow, setRowWindow] = (0, import_react22.useState)(null);
+  const [columnWindow, setColumnWindow] = (0, import_react22.useState)(null);
+  const windowInputs = (0, import_react22.useRef)({
     virtualizeActive: false,
     bodyEntryCount: 0,
     virtualRowHeight: 40,
@@ -50012,7 +50104,7 @@ function MatrxDataTableCore(coreProps) {
     columnWindowWidth,
     frozenRunLength
   };
-  const recomputeWindows = (0, import_react21.useCallback)(() => {
+  const recomputeWindows = (0, import_react22.useCallback)(() => {
     const el = scrollRef.current;
     const input = windowInputs.current;
     const nextRow = input.virtualizeActive ? computeWindow({
@@ -50033,7 +50125,7 @@ function MatrxDataTableCore(coreProps) {
     setRowWindow((prev) => sameWindow(prev, nextRow) ? prev : nextRow);
     setColumnWindow((prev) => sameWindow(prev, nextColumn) ? prev : nextColumn);
   }, []);
-  const effectiveRowWindow = (0, import_react21.useMemo)(() => {
+  const effectiveRowWindow = (0, import_react22.useMemo)(() => {
     if (!virtualizeActive) return null;
     if (rowWindow && rowWindow.end <= bodyEntryCount) return rowWindow;
     return computeWindow({
@@ -50044,7 +50136,7 @@ function MatrxDataTableCore(coreProps) {
       overscan: virtualizeConfig?.overscan ?? 8
     });
   }, [virtualizeActive, rowWindow, bodyEntryCount, virtualRowHeight, virtualizeConfig?.overscan]);
-  const effectiveColumnWindow = (0, import_react21.useMemo)(() => {
+  const effectiveColumnWindow = (0, import_react22.useMemo)(() => {
     if (!columnVirtualizeActive) return null;
     if (columnWindow && columnWindow.end <= visibleColumns.length) return columnWindow;
     return computeWindow({
@@ -50064,7 +50156,7 @@ function MatrxDataTableCore(coreProps) {
     frozenRunLength
   ]);
   const metricsWanted = virtualizeActive || columnVirtualizeActive;
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     recomputeWindows();
   }, [
     recomputeWindows,
@@ -50076,7 +50168,7 @@ function MatrxDataTableCore(coreProps) {
     columnWindowWidth,
     frozenRunLength
   ]);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (!metricsWanted) return;
     const el = scrollRef.current;
     if (!el) return;
@@ -50097,7 +50189,7 @@ function MatrxDataTableCore(coreProps) {
       observer?.disconnect();
     };
   }, [metricsWanted, recomputeWindows]);
-  const renderedColumns = (0, import_react21.useMemo)(
+  const renderedColumns = (0, import_react22.useMemo)(
     () => effectiveColumnWindow ? [
       ...visibleColumns.slice(0, frozenRunLength),
       ...visibleColumns.slice(effectiveColumnWindow.start, effectiveColumnWindow.end)
@@ -50105,7 +50197,7 @@ function MatrxDataTableCore(coreProps) {
     [effectiveColumnWindow, visibleColumns, frozenRunLength]
   );
   const columnSpacers = effectiveColumnWindow ? { start: effectiveColumnWindow.padStart, end: effectiveColumnWindow.padEnd } : null;
-  const windowedWidthFor = (0, import_react21.useCallback)(
+  const windowedWidthFor = (0, import_react22.useCallback)(
     (id, declared) => {
       const fitted = fittedWidths?.[id];
       if (fitted !== void 0) return fitted;
@@ -50117,7 +50209,7 @@ function MatrxDataTableCore(coreProps) {
     [effectiveColumnWindow, effectiveColumnWidths, frozenColumns, columnWindowWidth, fittedWidths]
   );
   const coverageUnanswered = readView.failure || read?.status === "loading" && data.length === 0;
-  const coverageResult = (0, import_react21.useMemo)(() => {
+  const coverageResult = (0, import_react22.useMemo)(() => {
     if (!coverage || coverageUnanswered) return null;
     return describeCoverage({
       loaded: coverage.loaded ?? data.length,
@@ -50128,7 +50220,7 @@ function MatrxDataTableCore(coreProps) {
       ...coverage.noun === void 0 ? {} : { noun: coverage.noun }
     });
   }, [coverage, coverageUnanswered, data.length]);
-  const bodyEntries = (0, import_react21.useMemo)(() => {
+  const bodyEntries = (0, import_react22.useMemo)(() => {
     const from = effectiveRowWindow ? effectiveRowWindow.start : 0;
     const to = effectiveRowWindow ? effectiveRowWindow.end : void 0;
     const windowed = groupedRenderRows ? groupedRenderRows.slice(from, to).map(
@@ -50145,28 +50237,28 @@ function MatrxDataTableCore(coreProps) {
       windowed.push({ kind: "spacer", height: effectiveRowWindow.padEnd, place: "end" });
     return windowed;
   }, [groupedRenderRows, collapsedGroups, paginated, effectiveRowWindow]);
-  const getRowIdRef = (0, import_react21.useRef)(getRowId);
+  const getRowIdRef = (0, import_react22.useRef)(getRowId);
   getRowIdRef.current = getRowId;
-  const spreadsheetRowIds = (0, import_react21.useMemo)(
+  const spreadsheetRowIds = (0, import_react22.useMemo)(
     () => paginated.map((row) => getRowIdRef.current(row)),
     [paginated]
   );
-  const spreadsheetColumnIds = (0, import_react21.useMemo)(
+  const spreadsheetColumnIds = (0, import_react22.useMemo)(
     () => visibleColumns.map((col) => columnId(col)),
     [visibleColumns]
   );
-  const spreadsheetRowById = (0, import_react21.useMemo)(() => {
+  const spreadsheetRowById = (0, import_react22.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     for (const row of paginated) map.set(getRowIdRef.current(row), row);
     return map;
   }, [paginated]);
-  const spreadsheetColumnById = (0, import_react21.useMemo)(() => {
+  const spreadsheetColumnById = (0, import_react22.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     for (const col of visibleColumns) map.set(columnId(col), col);
     return map;
   }, [visibleColumns]);
   const spreadsheetEnabled = Boolean(spreadsheet && spreadsheet.enabled !== false);
-  const openRowRef = (0, import_react21.useRef)(() => void 0);
+  const openRowRef = (0, import_react22.useRef)(() => void 0);
   const sheet = useSpreadsheetGrid(
     spreadsheetEnabled && spreadsheet ? {
       rowIds: spreadsheetRowIds,
@@ -50208,12 +50300,12 @@ function MatrxDataTableCore(coreProps) {
     } : null
   );
   if (spreadsheet?.controllerRef) spreadsheet.controllerRef.current = spreadsheetEnabled ? sheet.controller : null;
-  const sheetRef = (0, import_react21.useRef)(sheet);
+  const sheetRef = (0, import_react22.useRef)(sheet);
   sheetRef.current = sheet;
-  const onSheetSelectionRef = (0, import_react21.useRef)(spreadsheet?.onSelectionChange);
+  const onSheetSelectionRef = (0, import_react22.useRef)(spreadsheet?.onSelectionChange);
   onSheetSelectionRef.current = spreadsheet?.onSelectionChange;
   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}` : ""}` : "";
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     const tell = onSheetSelectionRef.current;
     if (!tell) return;
     const current = sheetRef.current;
@@ -50230,11 +50322,12 @@ function MatrxDataTableCore(coreProps) {
       tsv: current.selectionTsv()
     });
   }, [sheetSelectionKey]);
-  const searchValueRef = (0, import_react21.useRef)(searchValue);
+  const searchValueRef = (0, import_react22.useRef)(searchValue);
   searchValueRef.current = searchValue;
   const facetsEnabled = Boolean(facets && facets.enabled !== false);
-  const [facetState, setFacetState] = (0, import_react21.useState)({});
-  const facetReadCell = (0, import_react21.useCallback)(
+  const coreSuggestionsEnabled = facets?.enabled !== false;
+  const [facetState, setFacetState] = (0, import_react22.useState)({});
+  const facetReadCell = (0, import_react22.useCallback)(
     (row, colId) => {
       if (facets?.readCell) return facets.readCell(row, colId);
       const col = visibleColumns.find((candidate) => columnId(candidate) === colId);
@@ -50242,12 +50335,37 @@ function MatrxDataTableCore(coreProps) {
     },
     [facets, visibleColumns]
   );
-  const facetInputsRef = (0, import_react21.useRef)({ data, facets, facetReadCell });
-  facetInputsRef.current = { data, facets, facetReadCell };
-  const facetRequestRef = (0, import_react21.useRef)(/* @__PURE__ */ new Map());
-  const requestFacets = (0, import_react21.useCallback)((colId) => {
-    const { data: rows, facets: config, facetReadCell: readCell } = facetInputsRef.current;
-    if (!config || config.enabled === false) return;
+  const coreFacetTotal = remoteQuery?.mode === "controlled" ? remoteQuery.totalItems : appendQuery?.pagination.sourceRecords?.total ?? coverage?.matched ?? coverage?.total;
+  const coreFacetLoaded = appendQuery?.pagination.sourceRecords?.loaded;
+  const facetInputsRef = (0, import_react22.useRef)({ data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded });
+  facetInputsRef.current = { data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded };
+  const facetRequestRef = (0, import_react22.useRef)(/* @__PURE__ */ new Map());
+  const requestFacets = (0, import_react22.useCallback)((colId) => {
+    const { data: rows, facets: config, facetReadCell: readCell, coreFacetTotal: total, coreFacetLoaded: loaded } = facetInputsRef.current;
+    if (!config || config.enabled === false) {
+      const complete2 = localFacetsAreComplete(loaded ?? rows.length, total ?? rows.length);
+      const hasArrayValue = rows.some((row) => {
+        try {
+          return Array.isArray(readCell(row, colId));
+        } catch {
+          return false;
+        }
+      });
+      const suggestions = computeColumnFacets({
+        columnId: colId,
+        rows,
+        readValue: readCell,
+        complete: complete2
+      });
+      setFacetState((current) => ({
+        ...current,
+        [colId]: {
+          loading: false,
+          data: !hasArrayValue && suggestions.distinctCount + (suggestions.blank > 0 ? 1 : 0) < CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT ? suggestions : null
+        }
+      }));
+      return;
+    }
     const complete = localFacetsAreComplete(rows.length, config.totalRows);
     const limit = config.limit;
     if (complete || !config.source) {
@@ -50304,21 +50422,20 @@ function MatrxDataTableCore(coreProps) {
       }));
     });
   }, []);
-  (0, import_react21.useEffect)(() => {
-    if (!facetsEnabled) return;
+  (0, import_react22.useEffect)(() => {
     setFacetState({});
     facetRequestRef.current = /* @__PURE__ */ new Map();
-  }, [facetsEnabled, data, searchValue]);
+  }, [facetsEnabled, data, searchValue, coreFacetTotal, coreFacetLoaded]);
   const totalIsKnown = !isLoading && !readView.failure;
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (!controlledQuery || !totalIsKnown || controlledQuery.state.page === safePage) return;
     emitControlledQueryChange({ page: safePage });
   }, [controlledQuery, emitControlledQueryChange, safePage, totalIsKnown]);
-  const selectedRow = (0, import_react21.useMemo)(() => {
+  const selectedRow = (0, import_react22.useMemo)(() => {
     if (!selectedId) return null;
     return data.find((r) => getRowId(r) === selectedId) ?? null;
   }, [data, selectedId, getRowId]);
-  const windowRow = (0, import_react21.useMemo)(() => {
+  const windowRow = (0, import_react22.useMemo)(() => {
     if (!windowRowId) return null;
     return data.find((r) => getRowId(r) === windowRowId) ?? (windowRowSnapshot && windowRowSnapshot.queryKey === appendQueryKey && getRowId(windowRowSnapshot.row) === windowRowId ? windowRowSnapshot.row : null);
   }, [data, windowRowId, windowRowSnapshot, getRowId, appendQueryKey]);
@@ -50337,39 +50454,60 @@ function MatrxDataTableCore(coreProps) {
     const target = toolbar.portalInto;
     return target ? (0, import_react_dom3.createPortal)(node, target) : null;
   };
+  const [pinnedEl, setPinnedEl] = (0, import_react22.useState)(null);
+  const pinnedRowActive = Boolean(
+    toolbar?.singleRow && toolbar.overflow && toolbar.overflow.mode !== "sheet" && (toolbar.overflow.pinned || toolbar.overflow.mode === "menu")
+  );
+  const pinnedFolded = usePinnedFold(pinnedEl, pinnedRowActive);
+  const toolbarEnd = { node: null };
   const renderToolbarControls = (controls) => {
+    toolbarEnd.node = null;
     const overflow = toolbar?.overflow;
     const mode = overflow?.mode ?? "inline";
-    const stick = (node) => toolbar?.singleRow ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-      "span",
-      {
-        "data-matrx-table-toolbar-pinned": "",
-        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",
-        children: node
-      }
-    ) : node;
-    if (mode === "menu") {
-      return stick(
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
+    if (mode === "sheet") {
+      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
+        controls,
+        overflow?.pinned,
+        overflow?.sheetExtras
+      ] });
+    }
+    if (!pinnedRowActive) {
+      if (mode === "menu") {
+        return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
           overflow?.pinned,
           /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
             controls,
             overflow?.sheetExtras
           ] })
-        ] })
-      );
-    }
-    if (mode === "sheet") {
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
+        ] });
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
         controls,
-        overflow?.pinned,
-        overflow?.sheetExtras
+        overflow?.pinned
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
-      controls,
-      overflow?.pinned ? stick(overflow.pinned) : null
-    ] });
+    const folded = pinnedFolded;
+    toolbarEnd.node = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      "span",
+      {
+        ref: setPinnedEl,
+        "data-matrx-table-toolbar-pinned": "",
+        ...folded ? { "data-matrx-table-toolbar-pinned-folded": "" } : {},
+        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",
+        children: folded ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
+          controls,
+          overflow?.pinned,
+          overflow?.sheetExtras
+        ] }) : mode === "menu" ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
+          overflow?.pinned,
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
+            controls,
+            overflow?.sheetExtras
+          ] })
+        ] }) : overflow?.pinned
+      }
+    );
+    return folded || mode === "menu" ? null : controls;
   };
   const renderRowActions = (row, controls) => {
     const actions = rowActions?.(row, controls);
@@ -50434,7 +50572,7 @@ function MatrxDataTableCore(coreProps) {
     ...resolveSummaryValue(summary?.source?.totals?.[id], value)
   }));
   const hasSummaryTotals = summaryTotals.length > 0;
-  const changeCount = (0, import_react21.useMemo)(() => {
+  const changeCount = (0, import_react22.useMemo)(() => {
     let n2 = 0;
     for (const fields of Object.values(edits)) {
       n2 += Object.keys(fields).length;
@@ -50525,7 +50663,7 @@ function MatrxDataTableCore(coreProps) {
     }
     resetToolbarFacets(toolbar?.facets);
   };
-  const renderedEmptyState = (remoteQuery === null || remoteQueryUsesLocalColumnFilters) && data.length > 0 && hasActiveFilters ? {
+  const renderedEmptyState = (remoteQuery === null || remoteQueryUsesLocalProcessing) && data.length > 0 && hasActiveFilters ? {
     title: "No matching rows",
     description: "No rows match the current search or filters.",
     action: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Button, { type: "button", variant: "outline", size: "sm", onClick: clearAllFilters, children: "Clear filters" }),
@@ -50618,7 +50756,7 @@ function MatrxDataTableCore(coreProps) {
     }));
     return true;
   };
-  const requestCellEditRef = (0, import_react21.useRef)(requestCellEdit);
+  const requestCellEditRef = (0, import_react22.useRef)(requestCellEdit);
   requestCellEditRef.current = requestCellEdit;
   const buildRecordControls = (row) => {
     const rowId = getRowId(row);
@@ -50645,7 +50783,7 @@ function MatrxDataTableCore(coreProps) {
   };
   const hierarchyRows = hierarchy?.rows ?? data;
   const hierarchyGetParentId = hierarchy?.getParentId;
-  const hierarchyIndex = (0, import_react21.useMemo)(() => {
+  const hierarchyIndex = (0, import_react22.useMemo)(() => {
     if (!hierarchyGetParentId) return null;
     const byId = /* @__PURE__ */ new Map();
     const parentById = /* @__PURE__ */ new Map();
@@ -50677,7 +50815,7 @@ function MatrxDataTableCore(coreProps) {
     return { byId, parentById, depthById };
   }, [hierarchyGetParentId, hierarchyRows, getRowId]);
   const draggedRow = draggedRowId && hierarchyIndex ? hierarchyIndex.byId.get(draggedRowId) : void 0;
-  const hierarchyBlockedIds = (0, import_react21.useMemo)(() => {
+  const hierarchyBlockedIds = (0, import_react22.useMemo)(() => {
     if (!draggedRowId || !hierarchyIndex) return null;
     const childrenById = /* @__PURE__ */ new Map();
     for (const [id, parentId] of hierarchyIndex.parentById) {
@@ -50964,16 +51102,16 @@ function MatrxDataTableCore(coreProps) {
       return [];
     }
   };
-  const menuSectionsForRef = (0, import_react21.useRef)(menuSectionsFor);
+  const menuSectionsForRef = (0, import_react22.useRef)(menuSectionsFor);
   menuSectionsForRef.current = menuSectionsFor;
   const hasMenuSections = Boolean(contextMenu?.sections);
-  const boundarySections = (0, import_react21.useCallback)(
+  const boundarySections = (0, import_react22.useCallback)(
     (target) => menuSectionsForRef.current(target),
     []
   );
-  const resolveMenuLevelRef = (0, import_react21.useRef)(resolveMenuLevel);
+  const resolveMenuLevelRef = (0, import_react22.useRef)(resolveMenuLevel);
   resolveMenuLevelRef.current = resolveMenuLevel;
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     if (!host.rowContextRegistry) return;
     return host.rowContextRegistry.register(
       tableContextMenuInstanceId,
@@ -50982,7 +51120,7 @@ function MatrxDataTableCore(coreProps) {
   }, [host.rowContextRegistry, tableContextMenuInstanceId]);
   const showActionsCol = windowEnabled || Boolean(rowActions) || showInlineRowCopy;
   const getSelectionId = selection?.getSelectionId ?? getRowId;
-  const selectedIdSet = (0, import_react21.useMemo)(
+  const selectedIdSet = (0, import_react22.useMemo)(
     () => new Set(selection?.selectedIds ?? []),
     [selection?.selectedIds]
   );
@@ -50994,7 +51132,7 @@ function MatrxDataTableCore(coreProps) {
   );
   const allOnPageSelected = selectableRows.length > 0 && selectedOnPage.length === selectableRows.length;
   const someOnPageSelected = selectedOnPage.length > 0 && !allOnPageSelected;
-  const selectedRows = (0, import_react21.useMemo)(() => {
+  const selectedRows = (0, import_react22.useMemo)(() => {
     const resolved = /* @__PURE__ */ new Set();
     return data.filter((row) => {
       const id = getSelectionId(row);
@@ -51003,7 +51141,7 @@ function MatrxDataTableCore(coreProps) {
       return true;
     });
   }, [data, getSelectionId, selectedIdSet]);
-  const lastToggledIndex = (0, import_react21.useRef)(null);
+  const lastToggledIndex = (0, import_react22.useRef)(null);
   const setSelectedIds = (next) => selection?.onSelectedIdsChange([...next]);
   const toggleRowSelected = (index, shiftKey) => {
     if (!selection) return;
@@ -51044,7 +51182,7 @@ function MatrxDataTableCore(coreProps) {
       }
     } : facet
   ) : toolbar?.facets;
-  const rowLatest = (0, import_react21.useRef)(null);
+  const rowLatest = (0, import_react22.useRef)(null);
   const renderRecordCell = (row, col, index) => {
     const id = getRowId(row);
     const field = col.accessorKey ? String(col.accessorKey) : columnId(col);
@@ -51080,7 +51218,7 @@ function MatrxDataTableCore(coreProps) {
     }
     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;
   };
-  const currentViewSnapshot = (0, import_react21.useMemo)(
+  const currentViewSnapshot = (0, import_react22.useMemo)(
     () => ({
       __kind: "matrx-table-view",
       version: 1,
@@ -51115,7 +51253,7 @@ function MatrxDataTableCore(coreProps) {
       sort
     ]
   );
-  const declaredDefaultViewSnapshot = (0, import_react21.useMemo)(
+  const declaredDefaultViewSnapshot = (0, import_react22.useMemo)(
     () => defaultViewSnapshot ?? {
       __kind: "matrx-table-view",
       version: 1,
@@ -51123,7 +51261,6 @@ function MatrxDataTableCore(coreProps) {
         pageSize: defaultPageSize,
         search: "",
         anyOf: "",
-        layeredFilters: [],
         columnFilters: {},
         sort: defaultSort
       },
@@ -51134,7 +51271,7 @@ function MatrxDataTableCore(coreProps) {
     },
     [columns, defaultPageSize, defaultSort, defaultViewSnapshot]
   );
-  const applySavedView = (0, import_react21.useCallback)(
+  const applySavedView = (0, import_react22.useCallback)(
     (rawSnapshot) => {
       const snapshot = parseTableViewSnapshot(rawSnapshot);
       if (!snapshot) {
@@ -51359,6 +51496,7 @@ function MatrxDataTableCore(coreProps) {
     allRowsAreLoaded,
     effectivePageSize,
     safePage,
+    isFetching,
     controlledQuery,
     emitControlledQueryChange,
     ...pageSizeOptions
@@ -51366,6 +51504,8 @@ function MatrxDataTableCore(coreProps) {
   const toolbarReadsRows = showToolbarCopy && copyDrawsFromRows(effectiveCopy);
   const toolbarEpoch = useRenderEpoch([
     hideToolbar,
+    pinnedFolded,
+    pinnedRowActive,
     viewTabs,
     toolbar,
     showSearch,
@@ -51758,7 +51898,7 @@ function MatrxDataTableCore(coreProps) {
       },
       `${id}:expanded-detail`
     ) : null;
-    return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react21.Fragment, { children: [
+    return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         HierarchyDroppableRow,
         {
@@ -51768,7 +51908,7 @@ function MatrxDataTableCore(coreProps) {
         }
       ),
       inlineDetail
-    ] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react21.Fragment, { children: [
+    ] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
       wrappedRow,
       inlineDetail
     ] }, id);
@@ -51877,43 +52017,40 @@ function MatrxDataTableCore(coreProps) {
                 "data-matrx-table-density": resolvedDensity,
                 "data-url-state-table": urlState?.id,
                 className: cn(
-                  "flex h-full min-h-0 flex-col gap-2 px-0 py-2",
+                  "flex h-full min-h-0 flex-col gap-2 px-0 pt-2 pb-0",
                   className
                 ),
                 children: [
                   notice,
                   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,
                   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,
-                  summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+                  summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                     "section",
                     {
                       "data-matrx-table-summary": true,
                       "data-matrx-table-summary-scope": summaryUsesSource ? "source" : summaryCoverage,
                       "aria-label": `Table summary: ${summaryCaption}`,
-                      className: "flex shrink-0 flex-wrap items-stretch gap-2",
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "flex items-center px-1 text-xs font-medium text-muted-foreground", children: summaryCaption }),
-                        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: [
-                          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-xs text-muted-foreground", children: metric.label }),
-                          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "mt-0.5 text-sm font-semibold tabular-nums text-foreground", children: [
-                            metric.value,
-                            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
-                          ] })
-                        ] }, metric.id))
-                      ]
+                      className: "flex w-full min-w-0 shrink-0 flex-nowrap items-stretch gap-2 overflow-x-auto overscroll-x-contain",
+                      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: [
+                        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-xs text-muted-foreground", children: metric.label }),
+                        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "mt-0.5 text-sm font-semibold tabular-nums text-foreground", children: [
+                          metric.value,
+                          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
+                        ] })
+                      ] }, metric.id))
                     }
                   ) : null,
-                  /* @__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)(
+                  /* @__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)(
                     TableTitleRow,
                     {
                       ...toolbar?.singleRow ? { singleRow: true } : {},
-                      tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} }, tableId ?? "table") : void 0,
+                      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,
                       ...toolbar?.title === void 0 ? {} : { title: toolbar.title },
                       ...toolbar?.titleCount === void 0 ? {} : { count: toolbar.titleCount },
-                      context: tableId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+                      context: savedViewsId && SavedViews && !viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                         SavedViews,
                         {
-                          tableId,
+                          tableId: savedViewsId,
                           snapshot: currentViewSnapshot,
                           defaultSnapshot: declaredDefaultViewSnapshot,
                           onApply: applyLatestSavedView
@@ -52215,7 +52352,8 @@ function MatrxDataTableCore(coreProps) {
                               ] }))
                             ]
                           }
-                        )
+                        ),
+                        toolbarEnd.node
                       ]
                     }
                   )) }),
@@ -52529,7 +52667,7 @@ function MatrxDataTableCore(coreProps) {
                                                   {
                                                     label: col.header,
                                                     labelText: headerLabel,
-                                                    ...facetsEnabled ? {
+                                                    ...facetsEnabled || meta?.kind !== void 0 && meta.kind !== null && coreSuggestionsEnabled ? {
                                                       facets: facetState[id]?.data ?? null,
                                                       facetsLoading: facetState[id]?.loading ?? false,
                                                       ...facetState[id]?.error === void 0 ? {} : { facetsError: facetState[id]?.error },
@@ -52654,12 +52792,12 @@ function MatrxDataTableCore(coreProps) {
                                         },
                                         "matrx-column-spacer-end"
                                       ) : null
-                                    ] }, `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)(
+                                    ] }, `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)(
                                       "td",
                                       {
                                         colSpan: renderedColSpan,
                                         "data-matrx-table-message-cell": true,
-                                        className: "px-0 py-12 text-center",
+                                        className: "overflow-visible! px-0 py-12 text-center",
                                         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: [
                                           renderedEmptyState?.icon,
                                           /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-sm font-medium text-foreground", children: renderedEmptyState?.title ?? "No rows" }),
@@ -52749,62 +52887,61 @@ function MatrxDataTableCore(coreProps) {
                                     "border-t-2 border-border bg-muted/50 font-semibold",
                                     hasSummaryTotals && "sticky bottom-0 z-10 bg-muted/95 backdrop-blur-sm"
                                   ), children: [
-                                    hasSummaryTotals ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
-                                      /* @__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: [
-                                        summaryCaption,
-                                        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
-                                      ] }) }),
-                                      /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { "data-matrx-table-summary-totals": true, children: [
-                                        selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
-                                        columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
-                                          "td",
-                                          {
-                                            "aria-hidden": "true",
-                                            "data-matrx-table-column-spacer": "start",
-                                            className: "border-0 p-0",
-                                            style: { width: `${columnSpacers.start}px`, minWidth: `${columnSpacers.start}px` }
-                                          },
-                                          "matrx-summary-column-spacer-start"
-                                        ) : null,
-                                        renderedColumns.map((column) => {
-                                          const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
-                                          return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
-                                            "td",
-                                            {
-                                              className: cn(
-                                                "px-2 py-2 align-middle",
-                                                (column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
-                                                column.className,
-                                                column.align === "center" && "text-center",
-                                                column.align === "right" && "text-right"
-                                              ),
-                                              style: columnWidthVar(
-                                                resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
-                                                windowedWidthFor(columnId(column), column.width),
-                                                columnId(column),
-                                                resizableColumns && column.resizable !== false
-                                              ),
-                                              children: [
-                                                total?.value,
-                                                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
-                                              ]
-                                            },
-                                            columnId(column)
-                                          );
-                                        }),
-                                        columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+                                    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: [
+                                      selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
+                                      columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+                                        "td",
+                                        {
+                                          "aria-hidden": "true",
+                                          "data-matrx-table-column-spacer": "start",
+                                          className: "border-0 p-0",
+                                          style: { width: `${columnSpacers.start}px`, minWidth: `${columnSpacers.start}px` }
+                                        },
+                                        "matrx-summary-column-spacer-start"
+                                      ) : null,
+                                      renderedColumns.map((column, columnIndex) => {
+                                        const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
+                                        return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
                                           "td",
                                           {
-                                            "aria-hidden": "true",
-                                            "data-matrx-table-column-spacer": "end",
-                                            className: "border-0 p-0",
-                                            style: { width: `${columnSpacers.end}px`, minWidth: `${columnSpacers.end}px` }
+                                            className: cn(
+                                              "px-2 py-2 align-middle font-semibold",
+                                              (column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
+                                              column.className,
+                                              column.align === "center" && "text-center",
+                                              column.align === "right" && "text-right"
+                                            ),
+                                            style: columnWidthVar(
+                                              resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
+                                              windowedWidthFor(columnId(column), column.width),
+                                              columnId(column),
+                                              resizableColumns && column.resizable !== false
+                                            ),
+                                            children: [
+                                              columnIndex === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { "data-matrx-table-summary-total-label": true, className: "text-sm font-semibold text-foreground", children: [
+                                                summaryCaption,
+                                                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
+                                              ] }) : null,
+                                              columnIndex === 0 && total?.value != null ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-2", children: total.value }) : null,
+                                              columnIndex !== 0 ? total?.value : null,
+                                              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
+                                            ]
                                           },
-                                          "matrx-summary-column-spacer-end"
-                                        ) : null,
-                                        showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", {}) : null
-                                      ] })
-                                    ] }) : null,
+                                          columnId(column)
+                                        );
+                                      }),
+                                      columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+                                        "td",
+                                        {
+                                          "aria-hidden": "true",
+                                          "data-matrx-table-column-spacer": "end",
+                                          className: "border-0 p-0",
+                                          style: { width: `${columnSpacers.end}px`, minWidth: `${columnSpacers.end}px` }
+                                        },
+                                        "matrx-summary-column-spacer-end"
+                                      ) : null,
+                                      showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", {}) : null
+                                    ] }) }) : null,
                                     footerRows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { children: [
                                       selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
                                       columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
@@ -53034,6 +53171,7 @@ function MatrxDataTableCore(coreProps) {
                           showAllOption: allRowsAreLoaded,
                           allValue: 0,
                           allOptionLabel: "All loaded",
+                          isFetching,
                           compact: true,
                           hideEntriesInfo: false
                         }
@@ -53388,7 +53526,7 @@ function HierarchyDragIndicatorLayer({
   scrollRef,
   resolve: resolve2
 }) {
-  const [indicator, setIndicator] = (0, import_react21.useState)(
+  const [indicator, setIndicator] = (0, import_react22.useState)(
     null
   );
   (0, import_core3.useDndMonitor)({
@@ -53492,9 +53630,9 @@ function HierarchyDroppableRow({
   children
 }) {
   const { setNodeRef } = (0, import_core3.useDroppable)({ id, disabled });
-  if (!(0, import_react21.isValidElement)(children) || children.type !== "tr") return children;
+  if (!(0, import_react22.isValidElement)(children) || children.type !== "tr") return children;
   const row = children;
-  return (0, import_react21.cloneElement)(row, {
+  return (0, import_react22.cloneElement)(row, {
     ref: setNodeRef,
     className: row.props.className
   });
@@ -53604,7 +53742,7 @@ function columnWidthVar(width, resizedWidth, id, resizable) {
   };
 }
 function DefaultJsonCell({ value }) {
-  const [open, setOpen] = (0, import_react21.useState)(false);
+  const [open, setOpen] = (0, import_react22.useState)(false);
   const host = useMatrxDataTableHost();
   const Viewer = host.JsonViewer;
   const text = JSON.stringify(value, null, 2);
@@ -53687,7 +53825,7 @@ function resolveStringTitle(title, fallback) {
 }
 
 // src/data-table/SavedViewsControl.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 
 // src/dropdown-menu.tsx
 var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
@@ -53834,14 +53972,26 @@ function SavedViewsControl({
   onSelect,
   onSaveNew,
   onUpdate,
-  onReload
+  onReload,
+  presentation = "menu",
+  onRename,
+  related
 }) {
-  const unsavedChangesId = (0, import_react22.useId)();
-  const [saveOpen, setSaveOpen] = (0, import_react22.useState)(false);
-  const [name, setName] = (0, import_react22.useState)("");
-  const [saving, setSaving] = (0, import_react22.useState)(false);
-  const [actionError, setActionError] = (0, import_react22.useState)(null);
+  const unsavedChangesId = (0, import_react23.useId)();
+  const [saveOpen, setSaveOpen] = (0, import_react23.useState)(false);
+  const [name, setName] = (0, import_react23.useState)("");
+  const [saving, setSaving] = (0, import_react23.useState)(false);
+  const [actionError, setActionError] = (0, import_react23.useState)(null);
+  const [pendingSelect, setPendingSelect] = (0, import_react23.useState)(void 0);
   const visibleError = actionError ?? error;
+  const select = (id) => {
+    if (id === activeId) return;
+    if (dirty) {
+      setPendingSelect(id);
+      return;
+    }
+    onSelect(id);
+  };
   const save = async () => {
     const next = name.trim();
     if (!next) return;
@@ -53883,7 +54033,31 @@ function SavedViewsControl({
   };
   const activeName = activeId ? views.find((view) => view.id === activeId)?.name : void 0;
   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: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenu, { children: [
+    presentation === "tabs" ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        TableViewTabs,
+        {
+          tabs: [{ id: "default", label: "Default view" }, ...views.map((view) => ({ id: view.id, label: view.name }))],
+          activeId: activeId ?? "default",
+          onSelect: (id) => select(id === "default" ? null : id),
+          onAdd: () => {
+            setActionError(null);
+            setSaveOpen(true);
+          },
+          onClose: () => {
+          },
+          onRename: (id, label) => {
+            if (onRename) void Promise.resolve(onRename(id, label)).catch((cause) => setActionError(cause instanceof Error ? cause.message : String(cause)));
+          },
+          closable: false,
+          renameable: Boolean(onRename),
+          addHint: "Save a named view to your account",
+          related
+        }
+      ),
+      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,
+      loading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { role: "status", className: "text-xs text-muted-foreground", children: "Loading views\u2026" }) : null
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenu, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Tooltip, { children: [
         /* @__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)(
           Button,
@@ -53906,7 +54080,7 @@ function SavedViewsControl({
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuContent, { align: "end", children: [
         /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuLabel, { children: "Views" }),
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => onSelect(value === "__default__" ? null : value), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => select(value === "__default__" ? null : value), children: [
           /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: "__default__", children: "Default view" }),
           views.map((view) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: view.id, children: view.name }, view.id))
         ] }),
@@ -53919,7 +54093,10 @@ function SavedViewsControl({
         onReload ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuItem, { disabled: saving || loading, onSelect: () => void reload(), children: "Reload views" }) : null
       ] })
     ] }),
-    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,
+    dirty ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { id: presentation === "menu" ? unsavedChangesId : void 0, role: presentation === "tabs" ? "status" : void 0, className: "sr-only", children: [
+      "This table view has unsaved changes. ",
+      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."
+    ] }) : null,
     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,
     /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: saveOpen, onOpenChange: setSaveOpen, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Save current view" }) }),
@@ -53929,6 +54106,20 @@ function SavedViewsControl({
         /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setSaveOpen(false), children: "Cancel" }),
         /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", disabled: !name.trim() || saving, onClick: () => void save(), children: saving ? "Saving\u2026" : "Save view" })
       ] })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: pendingSelect !== void 0, onOpenChange: (open) => {
+      if (!open) setPendingSelect(void 0);
+    }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Unsaved view changes" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm text-muted-foreground", children: "Switching views will discard the changes you have not saved." }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogFooter, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setPendingSelect(void 0), children: "Stay on this view" }),
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", onClick: () => {
+          const next = pendingSelect;
+          setPendingSelect(void 0);
+          if (next !== void 0) onSelect(next);
+        }, children: "Discard changes and switch" })
+      ] })
     ] }) })
   ] });
 }