@ai-matrx/design-system 0.48.1 → 0.48.5

package/CHANGELOG.md

@@ -1,5 +1,52 @@
 # Changelog
 
+## 0.48.5
+### Unreleased
+### page-pass shared fix (2026-09-27): one field surface
+
+- **Input, BasicInput, Textarea (both looks) and the Select trigger share one surface — `FIELD_SURFACE_CLASS` (`border border-border bg-card`), now exported.** Input and the elevated Textarea filled with `bg-background` (the grey page colour in light mode) and BasicInput / the control Textarea were `bg-transparent`, while the Select trigger was `bg-card`: on one form every text field looked disabled beside white Selects (/hr/settings/employer, the message-template editor). Input's autofill paint follows (`--card`). A caller wanting no fill still passes `bg-transparent`.
+- Proof: `field-surface.test.tsx`.
+
+#### Consumer action
+- None required. Hosts drawing their own field controls use `FIELD_SURFACE_CLASS` (matrx-frontend's ProInput / ProTextarea do).
+
+## 0.48.4
+### (2026-09-27 — phone cards without a frame)
+
+- **The mobile cards scroller draws no frame** (no border, card fill or padding): each card carries its own border, and a bordered panel of bordered cards was box-in-box on every phone list.
+- **The table's touch floor also applies below 640px** (`(pointer: coarse), (max-width: 639px)`): row actions, the footer (rows per page, pager) and search controls are 44px on a phone-width table even when the pointer reports fine.
+- Proof: `MatrxDataTable.cards-no-frame.test.tsx`; the touch floor is CSS (checked live at 375px).
+
+### Consumer action
+
+None.
+
+## 0.48.3
+### (2026-09-27 — OrganizationPicker: row labels, a host fold, a quiet empty state)
+
+- **"No organization selected — pick one below." is muted text, not destructive red.** Nothing selected is a routine state; red is for a real failure.
+- **`detail` per row**: a short trailing label ("Open", "Finish setup", "Turn on HR") inside the row's one button.
+- **`folded` per row + `foldedLabel`**: the host's rarely-wanted rows sit behind one counted `ArchivedDisclosure`; the fold opens by itself when it is all there is or when a search matches inside it. Search (above eight rows) covers every row.
+- **`hideStatus`**: hides the "Working in …" line for a host whose choice is not the active organization (HR's employer chooser).
+- Proof: `organization-picker.test.tsx` — 4 of 25 red against 0.48.1's picker, 25 green.
+
+### Consumer action
+
+None required; all new props are optional. A test that asserted the red status line now asserts muted text.
+
+## 0.48.2
+### (2026-09-27 — list chrome, page-pass shared defects)
+
+- **The row actions column is pinned right** (from `sm:` up; phones unchanged): a table wider than its container no longer scrolls each row's own actions (Open, Study, the kebab) off the right edge. The header cell and every row cell are sticky with the row's opaque frozen background and a hairline.
+- **The "Clear all filters" eraser is absent when nothing is filtered**, instead of an always-present disabled control that reads as dead.
+- **`toolbar.columns: false`** hides the table's Columns button for a placing page that owns the one column picker (two pickers that disagree about which columns exist is worse than one).
+- **Working view tabs can be kept: `viewTabsStore`** (`{ views, onChange }`, types `TableViewTabsStore` / `SavedTableViewTab`). "+" opens the new view's name field at once (Escape discards it), named views are written to the store, the open saved view follows the layout, and a fresh mount (a reload) lists and applies them. Without a store the tabs stay in memory as before. The default tab has no close button (closing it did nothing).
+- Proof: `MatrxDataTable.toolbar-actions.test.tsx` (eraser absent after clearing; `columns: false`); `TableViewTabs.test.tsx` "saved view tabs" (name → store → remount applies it; Escape discards).
+
+### Consumer action
+
+A test that asserted a disabled "Clear all filters" button now asserts its absence. A test that clicked "+" and then another tab now names the new view first (its name field is open).
+
 ## 0.48.1 (2026-09-26 — floating layers, review round)
 
 - **A Popover or combobox a floating layer opens counts as part of it.** It portals to `<body>`, outside the window's element and the modal's React tree, so pressing its option still dismissed the modal. `isInsideFloatingLayer` now also accepts Radix popper content while a floating layer is open.

package/dist/data-table/copy-helpers.d.cts

@@ -1,5 +1,5 @@
 import { AgentPayloadInput } from './copy-types.cjs';
-import { g as MatrxDataTableCopyConfig, M as MatrxColumnDef } from '../types-DuvXeW4i.cjs';
+import { g as MatrxDataTableCopyConfig, M as MatrxColumnDef } from '../types-Dh3wRc0N.cjs';
 import '../content-transfer.cjs';
 import 'react';
 import '@ai-matrx/kit/content-transfer';

package/dist/data-table/copy-helpers.d.ts

@@ -1,5 +1,5 @@
 import { AgentPayloadInput } from './copy-types.js';
-import { g as MatrxDataTableCopyConfig, M as MatrxColumnDef } from '../types-oza_vuRW.js';
+import { g as MatrxDataTableCopyConfig, M as MatrxColumnDef } from '../types-hMqC2Fwn.js';
 import '../content-transfer.js';
 import 'react';
 import '@ai-matrx/kit/content-transfer';

package/dist/data-table/filter-engine.d.cts

@@ -1,4 +1,4 @@
-import { M as MatrxColumnDef, C as ColumnFiltersState, S as SortState, L as LayeredFilterRule, T as TableSearchMatchMode, a as ColumnFilterValue } from '../types-DuvXeW4i.cjs';
+import { M as MatrxColumnDef, C as ColumnFiltersState, S as SortState, L as LayeredFilterRule, T as TableSearchMatchMode, a as ColumnFilterValue } from '../types-Dh3wRc0N.cjs';
 import '../content-transfer.cjs';
 import 'react';
 import '@ai-matrx/kit/content-transfer';

package/dist/data-table/filter-engine.d.ts

@@ -1,4 +1,4 @@
-import { M as MatrxColumnDef, C as ColumnFiltersState, S as SortState, L as LayeredFilterRule, T as TableSearchMatchMode, a as ColumnFilterValue } from '../types-oza_vuRW.js';
+import { M as MatrxColumnDef, C as ColumnFiltersState, S as SortState, L as LayeredFilterRule, T as TableSearchMatchMode, a as ColumnFilterValue } from '../types-hMqC2Fwn.js';
 import '../content-transfer.js';
 import 'react';
 import '@ai-matrx/kit/content-transfer';

package/dist/data-table/host.d.cts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ComponentType, ReactNode, MouseEventHandler } from 'react';
 import { CopyControlProps } from './copy-types.cjs';
 export { AgentPayloadInput, AiCustomSource, AiVariant, CopyExportConfig } from './copy-types.cjs';
-import { b as TableSavedViewsProps, c as MatrxDataTableDensity, d as MatrxDataTableRecordControls } from '../types-DuvXeW4i.cjs';
+import { b as TableSavedViewsProps, c as MatrxDataTableDensity, d as MatrxDataTableRecordControls } from '../types-Dh3wRc0N.cjs';
 import { MatrxTableMenuTarget, MatrxTableMenuPayload, MatrxTableMenuSectionsResolver, MatrxTableMenuIconName } from './menu-targets.cjs';
 export { MatrxTableMenuItem, MatrxTableMenuSection } from './menu-targets.cjs';
 import '../content-transfer.cjs';

package/dist/data-table/host.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ComponentType, ReactNode, MouseEventHandler } from 'react';
 import { CopyControlProps } from './copy-types.js';
 export { AgentPayloadInput, AiCustomSource, AiVariant, CopyExportConfig } from './copy-types.js';
-import { b as TableSavedViewsProps, c as MatrxDataTableDensity, d as MatrxDataTableRecordControls } from '../types-oza_vuRW.js';
+import { b as TableSavedViewsProps, c as MatrxDataTableDensity, d as MatrxDataTableRecordControls } from '../types-hMqC2Fwn.js';
 import { MatrxTableMenuTarget, MatrxTableMenuPayload, MatrxTableMenuSectionsResolver, MatrxTableMenuIconName } from './menu-targets.js';
 export { MatrxTableMenuItem, MatrxTableMenuSection } from './menu-targets.js';
 import '../content-transfer.js';

package/dist/data-table/index.cjs

@@ -34939,17 +34939,22 @@ function ConfirmDialog({
 
 // src/input.tsx
 var React7 = __toESM(require("react"), 1);
+
+// src/field-surface.ts
+var FIELD_SURFACE_CLASS = "border border-border bg-card";
+
+// src/input.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var getVariantStyles = (variant = "default") => {
-  const baseStyles = `flex h-10 w-full border border-border bg-background text-foreground shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
+  const baseStyles = `flex h-10 w-full ${FIELD_SURFACE_CLASS} text-foreground shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
     file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground
     focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-ring
     disabled:cursor-not-allowed disabled:opacity-50
     dark:shadow-none
     transition duration-400
-    [&:-webkit-autofill]:bg-background [&:-webkit-autofill]:shadow-[0_0_0_1000px_hsl(var(--background))_inset] [&:-webkit-autofill]:[caret-color:currentColor]
-    dark:[&:-webkit-autofill]:shadow-[0_0_0_1000px_hsl(var(--background))_inset] dark:[&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))]
-    [&:-webkit-autofill:hover]:shadow-[0_0_0_1000px_hsl(var(--background))_inset] [&:-webkit-autofill:focus]:shadow-[0_0_0_1000px_hsl(var(--background))_inset]`;
+    [&:-webkit-autofill]:bg-card [&:-webkit-autofill]:shadow-[0_0_0_1000px_hsl(var(--card))_inset] [&:-webkit-autofill]:[caret-color:currentColor]
+    dark:[&:-webkit-autofill]:shadow-[0_0_0_1000px_hsl(var(--card))_inset] dark:[&:-webkit-autofill]:[-webkit-text-fill-color:hsl(var(--foreground))]
+    [&:-webkit-autofill:hover]:shadow-[0_0_0_1000px_hsl(var(--card))_inset] [&:-webkit-autofill:focus]:shadow-[0_0_0_1000px_hsl(var(--card))_inset]`;
   switch (variant) {
     case "destructive":
       return `${baseStyles} bg-destructive text-destructive-foreground`;
@@ -35014,7 +35019,7 @@ var BasicInput = React7.forwardRef(
       {
         type,
         className: cn(
-          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          `flex h-9 w-full rounded-md ${FIELD_SURFACE_CLASS} px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50`,
           className
         ),
         ref,
@@ -35047,7 +35052,7 @@ var import_jsx_runtime11 = require("react/jsx-runtime");
 var Select = SelectPrimitive.Root;
 var SelectValue = SelectPrimitive.Value;
 var selectTriggerVariants = (0, import_class_variance_authority2.cva)(
-  "flex w-full items-center justify-between gap-2 whitespace-nowrap rounded-md border border-border bg-card text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground transition-colors hover:bg-accent hover:border-accent-foreground/20 focus:outline-none focus:ring-1 focus:ring-primary/30 focus:border-primary/40 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:min-w-0 [&>span]:line-clamp-1",
+  `flex w-full items-center justify-between gap-2 whitespace-nowrap rounded-md ${FIELD_SURFACE_CLASS} text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground transition-colors hover:bg-accent hover:border-accent-foreground/20 focus:outline-none focus:ring-1 focus:ring-primary/30 focus:border-primary/40 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:min-w-0 [&>span]:line-clamp-1`,
   {
     variants: {
       size: {
@@ -36703,12 +36708,28 @@ 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 }) {
+function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone }) {
   const [renaming, setRenaming] = (0, import_react7.useState)(null);
   const [draft, setDraft] = (0, import_react7.useState)("");
+  const opened = (0, import_react7.useRef)(null);
+  (0, import_react7.useEffect)(() => {
+    if (!editingId || opened.current === editingId) return;
+    const tab = tabs.find((t) => t.id === editingId);
+    if (!tab) return;
+    opened.current = editingId;
+    setDraft(tab.label);
+    setRenaming(editingId);
+  }, [editingId, tabs]);
   const commit = () => {
     if (renaming && draft.trim()) onRename(renaming, draft.trim());
     setRenaming(null);
+    onEditDone?.();
+  };
+  const cancel = () => {
+    const id = renaming;
+    setRenaming(null);
+    if (id) onEditCancel?.(id);
+    onEditDone?.();
   };
   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: [
@@ -36721,9 +36742,11 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
             value: draft,
             onChange: (e) => setDraft(e.target.value),
             onBlur: commit,
+            onFocus: (e) => e.currentTarget.select(),
+            placeholder: "Name this view",
             onKeyDown: (e) => {
               if (e.key === "Enter") commit();
-              if (e.key === "Escape") setRenaming(null);
+              if (e.key === "Escape") cancel();
             },
             className: "h-8 w-32 bg-transparent px-2 text-xs outline-none focus-visible:ring-2 focus-visible:ring-ring"
           }
@@ -36755,7 +36778,7 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
             ]
           }
         ),
-        tabs.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
+        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" }) }) }),
           /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(TooltipContent, { children: [
             "Close ",
@@ -36765,21 +36788,33 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
       ] }, 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 tab from current view \xB7 double-click a tab to rename" })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: "New view from the current one \xB7 double-click a tab to rename" })
       ] })
     ] }),
     related && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex shrink-0 items-center gap-1 border-l px-2", children: related })
   ] });
 }
-function TableViewWorkspace({ snapshot, onApply, related }) {
-  const [tabs, setTabs] = (0, import_react7.useState)([{ id: "default", label: "Default view", snapshot }]);
+var same = (a, b) => JSON.stringify(a) === JSON.stringify(b);
+function TableViewWorkspace({ snapshot, onApply, related, store }) {
+  const [localViews, setLocalViews] = (0, import_react7.useState)([]);
+  const [defaultSnapshot, setDefaultSnapshot] = (0, import_react7.useState)(snapshot);
   const [activeId, setActiveId] = (0, import_react7.useState)("default");
+  const [namingId, setNamingId] = (0, import_react7.useState)(null);
+  const saved = store ? store.views : localViews;
+  const write = (next) => store ? store.onChange(next) : setLocalViews(next);
+  const tabs = [{ id: "default", label: "Default view", snapshot: defaultSnapshot }, ...saved];
+  const stashed = () => saved.map((tab) => tab.id === activeId && !same(tab.snapshot, snapshot) ? { ...tab, snapshot } : tab);
+  const activeSaved = saved.find((tab) => tab.id === activeId);
+  (0, import_react7.useEffect)(() => {
+    if (store && activeSaved && !same(activeSaved.snapshot, snapshot)) write(stashed());
+  }, [snapshot]);
   const select = (id) => {
     if (id === activeId) return;
     const target = tabs.find((tab) => tab.id === id);
     if (!target) return;
-    if (JSON.stringify(target.snapshot) !== JSON.stringify(snapshot)) onApply(target.snapshot);
-    setTabs((current) => current.map((tab) => tab.id === activeId ? { ...tab, snapshot } : tab));
+    if (!same(target.snapshot, snapshot)) onApply(target.snapshot);
+    if (activeId === "default") setDefaultSnapshot(snapshot);
+    else write(stashed());
     setActiveId(id);
   };
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
@@ -36789,17 +36824,31 @@ function TableViewWorkspace({ snapshot, onApply, related }) {
       activeId,
       onSelect: select,
       related,
+      editingId: namingId,
+      onEditDone: () => setNamingId(null),
+      onEditCancel: (id) => {
+        if (id !== namingId) return;
+        write(saved.filter((tab) => tab.id !== id));
+        if (activeId === id) setActiveId("default");
+      },
       onAdd: () => {
         const id = crypto.randomUUID();
-        setTabs((current) => [...current.map((tab) => tab.id === activeId ? { ...tab, snapshot } : tab), { id, label: `View ${current.length + 1}`, snapshot }]);
+        if (activeId === "default") setDefaultSnapshot(snapshot);
+        write([...stashed(), { id, label: `View ${saved.length + 2}`, snapshot }]);
         setActiveId(id);
+        setNamingId(id);
       },
       onClose: (id) => {
         if (tabs.length < 2) return;
-        if (id === activeId) select(tabs.find((tab) => tab.id !== id).id);
-        setTabs((current) => current.filter((tab) => tab.id !== id));
+        const rest = saved.filter((tab) => tab.id !== id);
+        if (id === activeId) {
+          const next = tabs.find((tab) => tab.id !== id);
+          if (!same(next.snapshot, snapshot)) onApply(next.snapshot);
+          setActiveId(next.id);
+        }
+        write(rest);
       },
-      onRename: (id, label) => setTabs((current) => current.map((tab) => tab.id === id ? { ...tab, label } : tab))
+      onRename: (id, label) => write(saved.map((tab) => tab.id === id ? { ...tab, label } : tab))
     }
   );
 }
@@ -47594,6 +47643,7 @@ function MatrxDataTableCore(coreProps) {
     tableId,
     defaultViewSnapshot,
     viewTabs = true,
+    viewTabsStore,
     relatedTableActions,
     columnState,
     reorderableColumns = true,
@@ -50144,7 +50194,16 @@ function MatrxDataTableCore(coreProps) {
             "td",
             {
               "data-matrx-table-row-action-cell": true,
-              className: "text-right align-middle",
+              className: cn(
+                "text-right align-middle",
+                // PINNED RIGHT from sm: up (page-pass 2026-09-27): a table wider than its
+                // container scrolled the row's own actions off the right edge at 1280px.
+                // The row's opaque frozen background keeps scrolled cells from showing
+                // through; the hairline says the column floats.
+                "sm:sticky sm:right-0 sm:z-20 sm:shadow-[inset_1px_0_0_var(--color-border)]",
+                frozenRowBackgroundClass,
+                canHoverFrozenCell && "sm:group-hover/matrx-row:bg-[color-mix(in_oklab,var(--color-muted)_50%,var(--color-card))]"
+              ),
               style: fixedUtilityWidth(fixedTableGeometry?.actionsWidth),
               children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
                 "div",
@@ -50340,7 +50399,7 @@ function MatrxDataTableCore(coreProps) {
                     TableTitleRow,
                     {
                       ...toolbar?.singleRow ? { singleRow: true } : {},
-                      tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions }, tableId ?? "table") : void 0,
+                      tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} }, tableId ?? "table") : void 0,
                       ...toolbar?.title === void 0 ? {} : { title: toolbar.title },
                       ...toolbar?.titleCount === void 0 ? {} : { count: toolbar.titleCount },
                       context: tableId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
@@ -50500,17 +50559,16 @@ function MatrxDataTableCore(coreProps) {
                                 /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(TooltipContent, { className: "max-w-xs", children: coverageResult.notice })
                               ] }) : null,
                               renderToolbarControls(/* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+                                hasActiveFilters ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                                   TableToolbarAction,
                                   {
                                     HostAction: host.ToolbarAction,
                                     ariaLabel: "Clear all filters",
-                                    tooltip: hasActiveFilters ? "Clear search and filters; keep columns and sort" : "No search or filters to clear",
-                                    disabled: !hasActiveFilters,
+                                    tooltip: "Clear search and filters; keep columns and sort",
                                     onClick: clearAllFilters,
                                     children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Eraser, {})
                                   }
-                                ),
+                                ) : null,
                                 showToolbarCopy && effectiveCopy ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ToolbarListedLabel, { label: "Copy or export", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                                   CopyButtons,
                                   {
@@ -50585,7 +50643,7 @@ function MatrxDataTableCore(coreProps) {
                                     ]
                                   }
                                 ) : null,
-                                columns.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+                                columns.length > 0 && toolbar?.columns !== false ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
                                   TableToolbarAction,
                                   {
                                     HostAction: host.ToolbarAction,
@@ -50677,7 +50735,9 @@ function MatrxDataTableCore(coreProps) {
                           "aria-busy": isLoading || isFetching,
                           ...appendQuery === null ? {} : { style: { containerType: "inline-size" } },
                           className: cn(
-                            "relative flex h-full min-h-0 flex-col gap-2 overflow-y-auto rounded-md border border-border bg-card p-2",
+                            // No frame around the cards: each card carries its own border, and a bordered
+                            // panel of bordered cards is box-in-box (page-pass 2026-09-27).
+                            "relative flex h-full min-h-0 flex-col gap-2 overflow-y-auto",
                             mobileCardsClass
                           ),
                           children: [
@@ -51032,7 +51092,7 @@ function MatrxDataTableCore(coreProps) {
                                           "th",
                                           {
                                             "data-matrx-table-actions-column": true,
-                                            className: "h-9 w-px whitespace-nowrap px-2 text-right align-middle text-xs font-semibold uppercase tracking-wide text-muted-foreground",
+                                            className: "h-9 w-px whitespace-nowrap px-2 text-right align-middle text-xs font-semibold uppercase tracking-wide text-muted-foreground sm:sticky sm:right-0 sm:z-30 sm:bg-muted sm:shadow-[inset_1px_0_0_var(--color-border)]",
                                             style: fixedUtilityWidth(fixedTableGeometry?.actionsWidth),
                                             children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "data-matrx-table-actions-label": true, className: "inline-block whitespace-nowrap", children: "Actions" })
                                           }