@actioneer/ads 0.5.8 → 0.6.0

package/components/table.js

@@ -1,9 +1,9 @@
 "use client";
-import { jsx as d, jsxs as _ } from "react/jsx-runtime";
+import { jsx as p, jsxs as T } from "react/jsx-runtime";
 import * as o from "react";
 import { cn as u } from "../lib/cn.js";
 import { Checkbox as re } from "./checkbox.js";
-import { ChevronUp as be, ChevronDown as ge, SortIcon as he } from "../lib/icons.js";
+import { ChevronUp as ge, ChevronDown as he, SortIcon as we } from "../lib/icons.js";
 const ne = (e) => e === "center" ? "text-center" : e === "right" ? "text-right" : "text-left", ae = (e, t = !1) => e === "left" ? u(
   "sticky left-0 z-10",
   // Scroll-aware: the smudge only appears once content is actually
@@ -21,7 +21,7 @@ const ne = (e) => e === "center" ? "text-center" : e === "right" ? "text-right"
 ) : u(
   "group-first/row:before:pointer-events-none group-first/row:before:absolute group-first/row:before:left-0 group-first/row:before:top-0 group-first/row:before:size-3 group-first/row:before:content-[''] group-first/row:before:[background:radial-gradient(circle_at_100%_100%,transparent_11.5px,var(--table-shell)_12px)]",
   "group-last/row:after:pointer-events-none group-last/row:after:absolute group-last/row:after:left-0 group-last/row:after:bottom-0 group-last/row:after:size-3 group-last/row:after:content-[''] group-last/row:after:[background:radial-gradient(circle_at_100%_0%,transparent_11.5px,var(--table-shell)_12px)]"
-), ie = (e) => u(
+), le = (e) => u(
   "bg-card align-middle transition-colors",
   // Row separators — functional hairline, none under the last row.
   "border-b border-border group-last/row:border-b-0",
@@ -33,15 +33,15 @@ const ne = (e) => e === "center" ? "text-center" : e === "right" ? "text-right"
     "group-hover/row:bg-(--table-row-hover) group-focus-within/row:bg-(--table-row-hover)",
     "group-data-[selected]/row:bg-(--table-row-selected)"
   )
-), we = u(
+), ve = u(
   "group-first/row:rounded-tl-(--table-card-radius)",
   "group-last/row:rounded-bl-(--table-card-radius)"
-), ve = u(
+), ye = u(
   "group-first/row:first:rounded-tl-(--table-card-radius)",
   "group-first/row:last:rounded-tr-(--table-card-radius)",
   "group-last/row:first:rounded-bl-(--table-card-radius)",
   "group-last/row:last:rounded-br-(--table-card-radius)"
-), le = u(
+), ie = u(
   "after:pointer-events-none after:absolute after:right-0 after:top-1/2",
   "after:h-4 after:w-px after:-translate-y-1/2 after:rounded-sm",
   "after:bg-border-strong last:after:hidden"
@@ -59,17 +59,17 @@ function V(e) {
     t.push(a);
   }), t;
 }
-function U(e) {
+function X(e) {
   if (e == null || typeof e == "boolean")
     return "";
   if (typeof e == "number" || typeof e == "string") return e;
   if (Array.isArray(e))
-    return e.map((n) => String(U(n))).join(" ").trim();
+    return e.map((n) => String(X(n))).join(" ").trim();
   if (!o.isValidElement(e)) return "";
   const t = e.props.sortValue;
   if (typeof t == "string" || typeof t == "number" || t instanceof Date)
     return t;
-  const a = U(e.props.children);
+  const a = X(e.props.children);
   if (String(a).trim()) return a;
   for (const n of [
     "value",
@@ -98,47 +98,47 @@ function oe(e) {
   const s = /^\d{4}[-/]\d{1,2}[-/]\d{1,2}/.test(t) || /\b(?:Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)\b/i.test(t) ? Date.parse(t) : Number.NaN;
   return Number.isNaN(s) ? { kind: "text", value: t } : { kind: "number", value: s };
 }
-function ye(e, t, a) {
+function Ce(e, t, a) {
   const n = oe(e), s = oe(t);
   if (n.kind === "empty") return s.kind === "empty" ? 0 : 1;
   if (s.kind === "empty") return -1;
-  const l = n.kind === "number" && s.kind === "number" ? n.value - s.value : xe.compare(String(n.value), String(s.value));
-  return a === "ascending" ? l : -l;
+  const i = n.kind === "number" && s.kind === "number" ? n.value - s.value : xe.compare(String(n.value), String(s.value));
+  return a === "ascending" ? i : -i;
 }
-const ce = o.createContext(null), q = () => o.useContext(ce), Q = o.createContext("body");
-function Ce(e) {
-  const t = [], n = V(e.props.children).map((s, l) => {
+const ce = o.createContext(null), j = () => o.useContext(ce), Q = o.createContext("body");
+function Ne(e) {
+  const t = [], n = V(e.props.children).map((s, i) => {
     if (!o.isValidElement(s) || s.type !== Y)
       return s;
-    let i = 0;
+    let l = 0;
     const w = V(s.props.children).map((r) => {
       if (!o.isValidElement(r)) return r;
-      for (; (t[i] ?? 0) > l; )
-        i += 1;
-      const T = Math.max(1, Number(r.props.colSpan ?? 1)), y = Math.max(1, Number(r.props.rowSpan ?? 1)), v = i;
-      for (let C = 0; C < T; C += 1)
+      for (; (t[l] ?? 0) > i; )
+        l += 1;
+      const E = Math.max(1, Number(r.props.colSpan ?? 1)), x = Math.max(1, Number(r.props.rowSpan ?? 1)), v = l;
+      for (let C = 0; C < E; C += 1)
         t[v + C] = Math.max(
           t[v + C] ?? 0,
-          l + y
+          i + x
         );
-      return i += T, r.type !== fe ? r : o.cloneElement(r, { _sortColumnIndex: v });
+      return l += E, r.type !== fe ? r : o.cloneElement(r, { _sortColumnIndex: v });
     });
     return o.cloneElement(s, void 0, w);
   });
   return o.cloneElement(e, void 0, n);
 }
-function Ne(e, t, a) {
-  const n = V(e.props.children).map((s, l) => {
+function ze(e, t, a) {
+  const n = V(e.props.children).map((s, i) => {
     if (!o.isValidElement(s) || s.type !== Y)
-      return { row: s, index: l, value: "" };
-    const i = V(s.props.children);
+      return { row: s, index: i, value: "" };
+    const l = V(s.props.children);
     return {
       row: s,
-      index: l,
-      value: U(i[t])
+      index: i,
+      value: X(l[t])
     };
   });
-  return n.sort((s, l) => ye(s.value, l.value, a) || s.index - l.index), o.cloneElement(
+  return n.sort((s, i) => Ce(s.value, i.value, a) || s.index - i.index), o.cloneElement(
     e,
     void 0,
     n.map(({ row: s }) => s)
@@ -150,78 +150,79 @@ function ue(e, t) {
     n,
     void 0,
     ue(n.props.children, t)
-  ) : n.type === de ? Ce(n) : n.type === pe && t && Number.isInteger(a) && a >= 0 ? Ne(n, a, t.direction) : n : n);
+  ) : n.type === de ? Ne(n) : n.type === pe && t && Number.isInteger(a) && a >= 0 ? ze(n, a, t.direction) : n : n);
 }
-const ze = o.forwardRef(
+const Se = o.forwardRef(
   ({
     className: e,
     wrapperClassName: t,
     footer: a,
     children: n,
     selectionMode: s = "none",
-    selectedKeys: l,
-    onSelectionChange: i,
+    selectedKeys: i,
+    onSelectionChange: l,
     rowKeys: h,
     elevatedActionColumn: w = !1,
     actionColumnWidth: r = "4rem",
-    sortDescriptor: T,
-    onSortChange: y,
+    sortDescriptor: E,
+    onSortChange: x,
     allowsSorting: v = !0,
     isStatic: C = !1,
     resizableColumns: A = !0,
+    maxBodyHeight: z,
     ...W
-  }, M) => {
-    const N = o.useMemo(() => h ?? [], [h]), z = l === "all", b = z ? null : l ?? /* @__PURE__ */ new Set(), E = o.useCallback(
-      (c) => z || !!(b != null && b.has(c)),
-      [z, b]
-    ), k = N.length > 0 && (z || N.every((c) => b == null ? void 0 : b.has(c))), B = !k && (z || N.some((c) => b == null ? void 0 : b.has(c))), O = o.useCallback(
+  }, O) => {
+    const N = o.useMemo(() => h ?? [], [h]), y = i === "all", b = y ? null : i ?? /* @__PURE__ */ new Set(), k = o.useCallback(
+      (c) => y || !!(b != null && b.has(c)),
+      [y, b]
+    ), R = N.length > 0 && (y || N.every((c) => b == null ? void 0 : b.has(c))), $ = !R && (y || N.some((c) => b == null ? void 0 : b.has(c))), M = o.useCallback(
       (c) => {
-        if (!i) return;
+        if (!l) return;
         if (s === "single") {
-          i(E(c) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([c]));
+          l(k(c) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([c]));
           return;
         }
-        const m = new Set(z ? N : b ?? /* @__PURE__ */ new Set());
-        m.has(c) ? m.delete(c) : m.add(c), i(m);
+        const m = new Set(y ? N : b ?? /* @__PURE__ */ new Set());
+        m.has(c) ? m.delete(c) : m.add(c), l(m);
       },
-      [i, s, E, z, N, b]
-    ), I = o.useCallback(() => {
-      i && i(k ? /* @__PURE__ */ new Set() : new Set(N));
-    }, [i, k, N]), [F, H] = o.useState(), R = v && !y, x = R ? F ?? T : T, f = o.useCallback(
+      [l, s, k, y, N, b]
+    ), H = o.useCallback(() => {
+      l && l(R ? /* @__PURE__ */ new Set() : new Set(N));
+    }, [l, R, N]), [U, q] = o.useState(), S = v && !x, d = S ? U ?? E : E, f = o.useCallback(
       (c) => {
         if (!v) return;
-        const m = (x == null ? void 0 : x.column) === c && x.direction === "ascending" ? "descending" : "ascending", g = { column: c, direction: m };
-        y ? y(g) : H(g);
+        const m = (d == null ? void 0 : d.column) === c && d.direction === "ascending" ? "descending" : "ascending", g = { column: c, direction: m };
+        x ? x(g) : q(g);
       },
-      [x, v, y]
-    ), p = o.useMemo(
-      () => R ? ue(n, x) : n,
-      [x, R, n]
-    ), S = o.useRef(null), [D, X] = o.useState({
+      [d, v, x]
+    ), _ = o.useMemo(
+      () => S ? ue(n, d) : n,
+      [d, S, n]
+    ), D = o.useRef(null), [I, me] = o.useState({
       left: !1,
       right: !1
-    }), $ = o.useCallback(() => {
-      const c = S.current;
+    }), F = o.useCallback(() => {
+      const c = D.current;
       if (!c) return;
       const m = c.scrollWidth - c.clientWidth, g = c.scrollLeft > 1, L = c.scrollLeft < m - 1;
-      X(
+      me(
         (J) => J.left === g && J.right === L ? J : { left: g, right: L }
       );
     }, []);
     o.useEffect(() => {
-      $();
-      const c = S.current;
+      F();
+      const c = D.current;
       if (!c || typeof ResizeObserver > "u") return;
-      const m = new ResizeObserver($);
+      const m = new ResizeObserver(F);
       m.observe(c);
       const g = c.querySelector("table");
       return g && m.observe(g), () => m.disconnect();
-    }, [$]);
-    const [P, j] = o.useState(
+    }, [F]);
+    const [P, B] = o.useState(
       null
     ), Z = o.useCallback(
       (c) => {
-        j(
+        B(
           (m) => m ?? Array.from(
             c.cells,
             (g) => g.getBoundingClientRect().width
@@ -231,7 +232,7 @@ const ze = o.forwardRef(
       []
     ), ee = o.useCallback(
       (c, m) => {
-        j((g) => {
+        B((g) => {
           if (!g) return g;
           const L = [...g];
           return L[c] = Math.max(G, m), L;
@@ -239,52 +240,54 @@ const ze = o.forwardRef(
       },
       []
     ), te = o.useCallback(
-      () => j(null),
+      () => B(null),
       []
-    ), me = o.useMemo(
+    ), be = o.useMemo(
       () => ({
         selectionMode: s,
-        isSelected: E,
-        toggleKey: O,
-        toggleAll: I,
-        allSelected: k,
-        someSelected: B,
+        isSelected: k,
+        toggleKey: M,
+        toggleAll: H,
+        allSelected: R,
+        someSelected: $,
         isStatic: C,
-        sortDescriptor: x,
+        sortDescriptor: d,
         requestSort: v ? f : void 0,
-        automaticSorting: R,
+        automaticSorting: S,
         elevatedActionColumn: w,
         resizableColumns: A,
         columnWidths: P,
         snapshotColumnWidths: Z,
         setColumnWidth: ee,
-        resetColumnWidths: te
+        resetColumnWidths: te,
+        stickyHeader: z != null
       }),
       [
         s,
-        E,
-        O,
-        I,
         k,
-        B,
+        M,
+        H,
+        R,
+        $,
         C,
-        x,
+        d,
         v,
-        R,
+        S,
         f,
         w,
         A,
         P,
         Z,
         ee,
-        te
+        te,
+        z
       ]
     );
-    return /* @__PURE__ */ d(ce.Provider, { value: me, children: /* @__PURE__ */ _(
+    return /* @__PURE__ */ p(ce.Provider, { value: be, children: /* @__PURE__ */ T(
       "div",
       {
-        "data-scroll-left": D.left ? "true" : "false",
-        "data-scroll-right": D.right ? "true" : "false",
+        "data-scroll-left": I.left ? "true" : "false",
+        "data-scroll-right": I.right ? "true" : "false",
         className: u(
           "group/table-shell overflow-clip rounded-2xl bg-table-shell px-1 pb-1",
           // Concentric inner radius for the white body card: shell radius
@@ -294,7 +297,7 @@ const ze = o.forwardRef(
           t
         ),
         children: [
-          /* @__PURE__ */ _(
+          /* @__PURE__ */ T(
             "div",
             {
               className: "relative",
@@ -302,16 +305,20 @@ const ze = o.forwardRef(
                 "--table-action-column-width": r
               } : void 0,
               children: [
-                /* @__PURE__ */ d(
+                /* @__PURE__ */ p(
                   "div",
                   {
-                    ref: S,
-                    onScroll: $,
-                    className: "overflow-x-auto rounded-(--table-card-radius)",
-                    children: /* @__PURE__ */ _(
+                    ref: D,
+                    onScroll: F,
+                    className: u(
+                      "overflow-x-auto rounded-(--table-card-radius)",
+                      z != null && "overflow-y-auto"
+                    ),
+                    style: z != null ? { maxHeight: z } : void 0,
+                    children: /* @__PURE__ */ T(
                       "table",
                       {
-                        ref: M,
+                        ref: O,
                         "data-slot": "table",
                         className: u(
                           "w-full border-separate border-spacing-0 text-base",
@@ -322,14 +329,14 @@ const ze = o.forwardRef(
                         ),
                         ...W,
                         children: [
-                          P && /* @__PURE__ */ d("colgroup", { children: P.map((c, m) => /* @__PURE__ */ d("col", { style: { width: c } }, m)) }),
-                          p
+                          P && /* @__PURE__ */ p("colgroup", { children: P.map((c, m) => /* @__PURE__ */ p("col", { style: { width: c } }, m)) }),
+                          _
                         ]
                       }
                     )
                   }
                 ),
-                /* @__PURE__ */ d(
+                /* @__PURE__ */ p(
                   "div",
                   {
                     "aria-hidden": "true",
@@ -338,12 +345,12 @@ const ze = o.forwardRef(
                       "pointer-events-none absolute inset-y-0 z-20 w-10",
                       "bg-gradient-to-l from-(--table-scroll-hint) to-transparent",
                       "opacity-0 transition-opacity duration-150 ease-out motion-reduce:transition-none",
-                      D.right && "opacity-100",
+                      I.right && "opacity-100",
                       w ? "right-[var(--table-action-column-width)]" : "right-0"
                     )
                   }
                 ),
-                w && /* @__PURE__ */ d(
+                w && /* @__PURE__ */ p(
                   "div",
                   {
                     "aria-hidden": "true",
@@ -362,16 +369,16 @@ const ze = o.forwardRef(
               ]
             }
           ),
-          a && /* @__PURE__ */ d("div", { className: "flex items-center px-4 py-2.5", children: a })
+          a && /* @__PURE__ */ p("div", { className: "flex items-center px-4 py-2.5", children: a })
         ]
       }
     ) });
   }
 );
-ze.displayName = "Table";
+Se.displayName = "Table";
 const de = o.forwardRef(({ className: e, ...t }, a) => {
-  const n = q();
-  return /* @__PURE__ */ d(Q.Provider, { value: "header", children: /* @__PURE__ */ d(
+  const n = j();
+  return /* @__PURE__ */ p(Q.Provider, { value: "header", children: /* @__PURE__ */ p(
     "thead",
     {
       ref: a,
@@ -385,12 +392,12 @@ const de = o.forwardRef(({ className: e, ...t }, a) => {
   ) });
 });
 de.displayName = "TableHeader";
-const pe = o.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ d(Q.Provider, { value: "body", children: /* @__PURE__ */ d("tbody", { ref: a, className: u(e), ...t }) }));
+const pe = o.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ p(Q.Provider, { value: "body", children: /* @__PURE__ */ p("tbody", { ref: a, className: u(e), ...t }) }));
 pe.displayName = "TableBody";
 const Y = o.forwardRef(
   ({ className: e, rowKey: t, children: a, ...n }, s) => {
-    const l = q(), i = o.useContext(Q), h = !!l && l.selectionMode !== "none", w = h && i === "body" && t !== void 0 ? l.isSelected(t) : !1;
-    return /* @__PURE__ */ _(
+    const i = j(), l = o.useContext(Q), h = !!i && i.selectionMode !== "none", w = h && l === "body" && t !== void 0 ? i.isSelected(t) : !1;
+    return /* @__PURE__ */ T(
       "tr",
       {
         ref: s,
@@ -398,13 +405,13 @@ const Y = o.forwardRef(
         className: u("group/row", e),
         ...n,
         children: [
-          h && (i === "header" ? /* @__PURE__ */ _(
+          h && (l === "header" ? /* @__PURE__ */ T(
             "th",
             {
               scope: "col",
               className: u(
                 "w-10 px-4 py-2.5",
-                le,
+                ie,
                 // Sticky without the baked shadow — an always-on smudge
                 // muddies the shell's corners (elevation = actionability).
                 // (sticky is positioned, so the ::after tick anchors to it —
@@ -412,38 +419,38 @@ const Y = o.forwardRef(
                 "sticky left-0 z-10 bg-table-shell"
               ),
               children: [
-                /* @__PURE__ */ d("span", { className: "sr-only", children: "Row selection" }),
-                l.selectionMode === "multiple" && /* @__PURE__ */ d(
+                /* @__PURE__ */ p("span", { className: "sr-only", children: "Row selection" }),
+                i.selectionMode === "multiple" && /* @__PURE__ */ p(
                   re,
                   {
                     size: "sm",
                     "aria-label": "Select all rows",
-                    checked: l.allSelected,
-                    indeterminate: l.someSelected,
-                    onChange: l.toggleAll
+                    checked: i.allSelected,
+                    indeterminate: i.someSelected,
+                    onChange: i.toggleAll
                   }
                 )
               ]
             }
-          ) : /* @__PURE__ */ d(
+          ) : /* @__PURE__ */ p(
             "td",
             {
               className: u(
                 "w-10 px-4 py-3",
-                ie(l.isStatic),
-                we,
+                le(i.isStatic),
+                ve,
                 "sticky left-0 z-10",
                 // Same white-behind-white corner problem as pinned data cells.
                 se("left")
               ),
               onClick: (r) => r.stopPropagation(),
-              children: t !== void 0 && /* @__PURE__ */ d(
+              children: t !== void 0 && /* @__PURE__ */ p(
                 re,
                 {
                   size: "sm",
                   "aria-label": `Select ${t}`,
                   checked: w,
-                  onChange: () => l.toggleKey(t)
+                  onChange: () => i.toggleKey(t)
                 }
               )
             }
@@ -455,55 +462,58 @@ const Y = o.forwardRef(
   }
 );
 Y.displayName = "TableRow";
-const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allowsSorting: s = !0, _sortColumnIndex: l, children: i, ...h }, w) => {
-  var H, R, x;
-  const r = q(), y = (r != null && r.automaticSorting && l !== void 0 ? `${K}${l}` : void 0) ?? n, v = Number(h.colSpan ?? 1) === 1, C = String(U(i)).trim(), A = C.length > 0, W = s && v && a !== "right" && A && !!y && !!(r != null && r.requestSort), M = W && ((H = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : H.column) === y, N = (R = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : R.direction, z = !!(r != null && r.resizableColumns) && v && a !== "right", b = o.useRef(null), [E, k] = o.useState(!1), B = (f) => {
-    if (f.button !== 0 || !r) return;
-    const p = f.currentTarget.parentElement, S = p == null ? void 0 : p.parentElement;
-    if (!(!p || !S)) {
-      r.snapshotColumnWidths(S), b.current = {
-        index: p.cellIndex,
-        startX: f.clientX,
-        startWidth: p.getBoundingClientRect().width
+const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allowsSorting: s = !0, _sortColumnIndex: i, children: l, ...h }, w) => {
+  var U, q, S;
+  const r = j(), x = (r != null && r.automaticSorting && i !== void 0 ? `${K}${i}` : void 0) ?? n, v = Number(h.colSpan ?? 1) === 1, C = String(X(l)).trim(), A = C.length > 0, z = s && v && a !== "right" && A && !!x && !!(r != null && r.requestSort), W = z && ((U = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : U.column) === x, O = (q = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : q.direction, N = !!(r != null && r.resizableColumns) && v && a !== "right", y = o.useRef(null), [b, k] = o.useState(!1), R = (d) => {
+    if (d.button !== 0 || !r) return;
+    const f = d.currentTarget.parentElement, _ = f == null ? void 0 : f.parentElement;
+    if (!(!f || !_)) {
+      r.snapshotColumnWidths(_), y.current = {
+        index: f.cellIndex,
+        startX: d.clientX,
+        startWidth: f.getBoundingClientRect().width
       }, k(!0);
       try {
-        f.currentTarget.setPointerCapture(f.pointerId);
+        d.currentTarget.setPointerCapture(d.pointerId);
       } catch {
       }
-      f.preventDefault();
+      d.preventDefault();
     }
-  }, O = (f) => {
-    const p = b.current;
-    !p || !r || r.setColumnWidth(
-      p.index,
-      p.startWidth + (f.clientX - p.startX)
+  }, $ = (d) => {
+    const f = y.current;
+    !f || !r || r.setColumnWidth(
+      f.index,
+      f.startWidth + (d.clientX - f.startX)
     );
-  }, I = () => {
-    b.current = null, k(!1);
-  }, F = (f) => {
-    if (f.key !== "ArrowLeft" && f.key !== "ArrowRight" || !r) return;
-    f.preventDefault();
-    const p = f.currentTarget.parentElement, S = p == null ? void 0 : p.parentElement;
-    if (!p || !S) return;
-    r.snapshotColumnWidths(S);
-    const D = f.shiftKey ? 32 : 8, X = f.key === "ArrowRight" ? D : -D;
-    r.setColumnWidth(p.cellIndex, p.getBoundingClientRect().width + X);
+  }, M = () => {
+    y.current = null, k(!1);
+  }, H = (d) => {
+    if (d.key !== "ArrowLeft" && d.key !== "ArrowRight" || !r) return;
+    d.preventDefault();
+    const f = d.currentTarget.parentElement, _ = f == null ? void 0 : f.parentElement;
+    if (!f || !_) return;
+    r.snapshotColumnWidths(_);
+    const D = d.shiftKey ? 32 : 8, I = d.key === "ArrowRight" ? D : -D;
+    r.setColumnWidth(f.cellIndex, f.getBoundingClientRect().width + I);
   };
-  return /* @__PURE__ */ _(
+  return /* @__PURE__ */ T(
     "th",
     {
       ref: w,
       scope: "col",
-      "aria-sort": M ? N === "ascending" ? "ascending" : "descending" : W ? "none" : void 0,
+      "aria-sort": W ? O === "ascending" ? "ascending" : "descending" : z ? "none" : void 0,
       className: u(
         // whitespace-nowrap: header labels hug their content — the table
         // scrolls horizontally, so wrapping "Null %" to two lines only
         // wastes header height without saving any width.
         "relative whitespace-nowrap px-4 py-2.5 font-normal",
-        le,
+        ie,
         // The resize handle carries its own tick visual, so drop the
         // decorative one; the last column never shows a handle.
-        z && "after:hidden [&:last-child>[data-slot=resize-handle]]:hidden",
+        N && "after:hidden [&:last-child>[data-slot=resize-handle]]:hidden",
+        // Capped-height tables scroll under the header: pin it to the
+        // viewport top, painted on the shell gray so rows pass beneath.
+        (r == null ? void 0 : r.stickyHeader) && "sticky top-0 z-30 bg-table-shell",
         ne(t),
         a && (a === "right" && (r != null && r.elevatedActionColumn) ? u(
           // Preserve the semantic column width, but do not pin or paint
@@ -518,24 +528,24 @@ const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allows
       ),
       ...h,
       children: [
-        W ? /* @__PURE__ */ _(
+        z ? /* @__PURE__ */ T(
           "button",
           {
             type: "button",
-            onClick: () => r.requestSort(y),
+            onClick: () => r.requestSort(x),
             className: u(
               "group/sort -mx-1 inline-flex items-center gap-1 rounded px-1 outline-none transition-colors",
               "hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring",
               t === "right" && "flex-row-reverse",
-              M && "text-foreground"
+              W && "text-foreground"
             ),
             children: [
-              i,
-              M ? N === "ascending" ? /* @__PURE__ */ d(be, { className: "size-3.5" }) : /* @__PURE__ */ d(ge, { className: "size-3.5" }) : /* @__PURE__ */ d(he, { className: "size-3.5 opacity-0 transition-opacity group-hover/sort:opacity-60" })
+              l,
+              W ? O === "ascending" ? /* @__PURE__ */ p(ge, { className: "size-3.5" }) : /* @__PURE__ */ p(he, { className: "size-3.5" }) : /* @__PURE__ */ p(we, { className: "size-3.5 opacity-0 transition-opacity group-hover/sort:opacity-60" })
             ]
           }
-        ) : A ? i : /* @__PURE__ */ d("span", { className: "sr-only", children: h["aria-label"] ?? "Table column" }),
-        z && /* @__PURE__ */ d(
+        ) : A ? l : /* @__PURE__ */ p("span", { className: "sr-only", children: h["aria-label"] ?? "Table column" }),
+        N && /* @__PURE__ */ p(
           "span",
           {
             "data-slot": "resize-handle",
@@ -544,14 +554,14 @@ const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allows
             "aria-label": `Resize ${C || "this"} column`,
             "aria-valuemin": G,
             "aria-valuemax": 2e3,
-            "aria-valuenow": ((x = r == null ? void 0 : r.columnWidths) == null ? void 0 : x[l ?? -1]) ?? G,
+            "aria-valuenow": ((S = r == null ? void 0 : r.columnWidths) == null ? void 0 : S[i ?? -1]) ?? G,
             tabIndex: 0,
-            "data-resizing": E ? "true" : void 0,
-            onPointerDown: B,
-            onPointerMove: O,
-            onPointerUp: I,
-            onPointerCancel: I,
-            onKeyDown: F,
+            "data-resizing": b ? "true" : void 0,
+            onPointerDown: R,
+            onPointerMove: $,
+            onPointerUp: M,
+            onPointerCancel: M,
+            onKeyDown: H,
             onDoubleClick: () => r == null ? void 0 : r.resetColumnWidths(),
             className: u(
               // 12px hit area straddling the column edge; the 1px tick inside
@@ -559,7 +569,7 @@ const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allows
               "group/resize absolute -right-1.5 top-0 z-10 flex h-full w-3 cursor-col-resize touch-none select-none items-center justify-center rounded-sm outline-none",
               "focus-visible:ring-2 focus-visible:ring-ring"
             ),
-            children: /* @__PURE__ */ d(
+            children: /* @__PURE__ */ p(
               "span",
               {
                 "aria-hidden": "true",
@@ -579,13 +589,13 @@ const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allows
   );
 });
 fe.displayName = "TableColumn";
-const Se = o.forwardRef(
-  ({ className: e, align: t, sticky: a, sortValue: n, ...s }, l) => {
-    const i = q(), h = a === "right" && (i == null ? void 0 : i.elevatedActionColumn);
-    return /* @__PURE__ */ d(
+const ke = o.forwardRef(
+  ({ className: e, align: t, sticky: a, sortValue: n, ...s }, i) => {
+    const l = j(), h = a === "right" && (l == null ? void 0 : l.elevatedActionColumn);
+    return /* @__PURE__ */ p(
       "td",
       {
-        ref: l,
+        ref: i,
         "data-sort-value": n instanceof Date ? n.toISOString() : n,
         className: u(
           // whitespace-nowrap: cell content never wraps — the table's
@@ -593,10 +603,10 @@ const Se = o.forwardRef(
           // header cells. Opt back into wrapping with `whitespace-normal` for
           // deliberate multi-line content (e.g. an EmptyState in a colSpan cell).
           "whitespace-nowrap px-4 py-3",
-          ie((i == null ? void 0 : i.isStatic) ?? !1),
-          ve,
+          le((l == null ? void 0 : l.isStatic) ?? !1),
+          ye,
           ne(t),
-          a && ae(a, i == null ? void 0 : i.elevatedActionColumn),
+          a && ae(a, l == null ? void 0 : l.elevatedActionColumn),
           a && se(a),
           h && u(
             "w-[var(--table-action-column-width)]",
@@ -612,11 +622,11 @@ const Se = o.forwardRef(
     );
   }
 );
-Se.displayName = "TableCell";
+ke.displayName = "TableCell";
 export {
-  ze as Table,
+  Se as Table,
   pe as TableBody,
-  Se as TableCell,
+  ke as TableCell,
   fe as TableColumn,
   de as TableHeader,
   Y as TableRow