chordia-ui 3.3.2 → 3.3.3

package/dist/components/data.es.js

@@ -1,21 +1,21 @@
 import { jsxs as l, jsx as o, Fragment as je } from "react/jsx-runtime";
-import xe, { useState as h, useRef as E, useEffect as P, Suspense as ft, useMemo as I, useCallback as de } from "react";
-import { u as gt, a as _e, D as ht, c as mt, S as xt, h as bt, b as yt, s as vt, K as wt, P as St, d as be, e as kt, C as Ct } from "../sortable.esm.es.js";
+import xe, { useState as m, useRef as T, useEffect as P, Suspense as ft, useMemo as I, useCallback as de } from "react";
+import { u as gt, a as _e, D as mt, c as ht, S as xt, h as yt, b as bt, s as vt, K as wt, P as St, d as ye, e as kt, C as Ct } from "../sortable.esm.es.js";
 import { CalendarClock as Ae, Download as Dt, ChevronDown as ve, ChevronUp as Ie, Filter as Pe, GripVertical as Re } from "lucide-react";
 import { createPortal as Nt } from "react-dom";
 import { C as Ft, P as zt } from "../CustomFilterChips.es.js";
 function Ot({
   dateRangePicker: g,
   onWeekToDate: d,
-  exportConfig: b,
+  exportConfig: y,
   filterChipsConfig: p,
   trailingActions: C
   // Optional extra actions rendered after Export (e.g., Add Users button)
 }) {
-  const [R, j] = h(!1), v = E(null), T = E(null);
+  const [R, j] = m(!1), v = T(null), E = T(null);
   P(() => {
     const c = (z) => {
-      T.current && !T.current.contains(z.target) && v.current && !v.current.contains(z.target) && j(!1);
+      E.current && !E.current.contains(z.target) && v.current && !v.current.contains(z.target) && j(!1);
     };
     if (R)
       return document.addEventListener("mousedown", c), () => {
@@ -25,11 +25,11 @@ function Ot({
   const J = () => {
     j((c) => !c);
   }, q = (c) => {
-    j(!1), b != null && b.onExport && b.onExport(c);
+    j(!1), y != null && y.onExport && y.onExport(c);
   }, S = (() => {
     if (!(p != null && p.filters))
       return !1;
-    const c = p.filters, z = p.customFilters || [], O = Object.entries(c).some(([m, w]) => !!(Array.isArray(w) && w.length || typeof w == "string" && w.trim() !== "" || w && typeof w == "object" && (w.min != null || w.max != null))), G = z.some((m) => m.active);
+    const c = p.filters, z = p.customFilters || [], O = Object.entries(c).some(([h, w]) => !!(Array.isArray(w) && w.length || typeof w == "string" && w.trim() !== "" || w && typeof w == "object" && (w.min != null || w.max != null))), G = z.some((h) => h.active);
     return O || G;
   })();
   return /* @__PURE__ */ l("div", { className: "flex items-center gap-3 flex-wrap", children: [
@@ -55,19 +55,19 @@ function Ot({
         children: g
       }
     ),
-    b && /* @__PURE__ */ l("div", { className: "relative", children: [
+    y && /* @__PURE__ */ l("div", { className: "relative", children: [
       /* @__PURE__ */ l(
         "button",
         {
           ref: v,
           onClick: J,
-          disabled: b.isExporting,
+          disabled: y.isExporting,
           className: "inline-flex items-center justify-between gap-2 rounded-lg border border-gray-300 bg-white/80 px-4 py-2.5 transition-colors hover:bg-white text-sm font-medium text-gray-900 disabled:opacity-50 disabled:cursor-not-allowed min-w-[120px]",
           style: { fontFamily: "var(--font-sans)" },
           children: [
             /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ o(Dt, { size: 16 }),
-              /* @__PURE__ */ o("span", { children: b.isExporting ? "Exporting..." : "Export" })
+              /* @__PURE__ */ o("span", { children: y.isExporting ? "Exporting..." : "Export" })
             ] }),
             /* @__PURE__ */ o(ve, { size: 16 })
           ]
@@ -76,9 +76,9 @@ function Ot({
       R && /* @__PURE__ */ o(
         "div",
         {
-          ref: T,
+          ref: E,
           className: "absolute top-full right-0 mt-2 bg-white rounded-lg shadow-lg border border-gray-200 py-1 z-50 min-w-[120px]",
-          children: (b.types || ["csv"]).map((c) => /* @__PURE__ */ l(
+          children: (y.types || ["csv"]).map((c) => /* @__PURE__ */ l(
             "button",
             {
               onClick: () => q(c),
@@ -112,17 +112,17 @@ function Ot({
     ] })
   ] });
 }
-function ye() {
+function be() {
   return /* @__PURE__ */ o("div", { style: { height: 1, background: "rgba(52,58,64,0.08)" } });
 }
-const Lt = () => ({ userData: { email: "anonymous" } }), Et = (g) => /* @__PURE__ */ o("img", { ...g });
-function Tt({ children: g }) {
+const Lt = () => ({ userData: { email: "anonymous" } }), Tt = (g) => /* @__PURE__ */ o("img", { ...g });
+function Et({ children: g }) {
   return g;
 }
 function jt({
   data: g = [],
   columns: d = [],
-  initialPageSize: b = 10,
+  initialPageSize: y = 10,
   onRowClick: p,
   // Server-side pagination props (optional)
   totalCount: C = null,
@@ -133,7 +133,7 @@ function jt({
   // Controlled pageSize (null = use internal state)
   onPageChange: v = null,
   // Callback for page changes (null = use internal state)
-  onPageSizeChange: T = null,
+  onPageSizeChange: E = null,
   // Callback for pageSize changes (null = use internal state)
   onFilterChange: J = null,
   // Callback for filter changes (null = use client-side filtering)
@@ -153,8 +153,8 @@ function jt({
   // Configuration for filters (dateRangePicker, onWeekToDate, exportConfig, filterChipsConfig)
 }) {
   var Me;
-  const { userData: G } = Lt(), m = (G == null ? void 0 : G.email) || "anonymous", w = xe.memo(({ children: e, content: t, className: r = "" }) => {
-    const n = E(null), [s, a] = h(!1);
+  const { userData: G } = Lt(), h = (G == null ? void 0 : G.email) || "anonymous", w = xe.memo(({ children: e, content: t, className: r = "" }) => {
+    const n = T(null), [s, a] = m(!1);
     P(() => {
       const u = () => {
         if (n.current) {
@@ -170,7 +170,7 @@ function jt({
     }, [e, t]);
     const i = /* @__PURE__ */ o("span", { className: `truncate block ${r}`, ref: n, children: e });
     return s && t ? /* @__PURE__ */ o(
-      Tt,
+      Et,
       {
         content: t,
         styling: "bg-green-2 text-gray-900 px-3 py-2 text-sm rounded-lg shadow-md border border-gray-300 max-w-xs whitespace-normal",
@@ -181,11 +181,11 @@ function jt({
     ) : i;
   });
   w.displayName = "TruncatedCell";
-  const Z = C !== null && v !== null, ce = J !== null, B = Q !== null, [Be, ue] = h(1), [We, Ve] = h(b), pe = R !== null ? R : Be, ee = j !== null ? j : We, te = (e) => {
+  const Z = C !== null && v !== null, ce = J !== null, B = Q !== null, [Be, ue] = m(1), [We, Ve] = m(y), pe = R !== null ? R : Be, ee = j !== null ? j : We, te = (e) => {
     v ? v(e) : ue(e);
   }, we = (e) => {
-    T ? T(e) : Ve(e);
-  }, D = 9, y = "action", $ = E(!1), W = I(() => c ? `dataTable_columns_${c}:${m}` : `dataTable_columns_${d.map((t) => t.id || t.key).sort().join("_")}:${m}`, [c, d, m]), V = I(() => c ? `dataTable_manual_change_${c}:${m}` : null, [c, m]);
+    E ? E(e) : Ve(e);
+  }, D = 9, b = "action", $ = T(!1), W = I(() => c ? `dataTable_columns_${c}:${h}` : `dataTable_columns_${d.map((t) => t.id || t.key).sort().join("_")}:${h}`, [c, d, h]), V = I(() => c ? `dataTable_manual_change_${c}:${h}` : null, [c, h]);
   de((e, t) => {
     if (typeof window > "u" || !e || !t || t.length === 0)
       return null;
@@ -203,22 +203,22 @@ function jt({
     }
     return null;
   }, []);
-  const [M, He] = h({}), [Se, Ke] = h(null), [ke, Ce] = h("asc");
+  const [M, He] = m({}), [Se, Ke] = m(null), [ke, Ce] = m("asc");
   de((e, t) => e === "csat_score" && t === "evaluation.csat_score" ? t : e, []);
-  const Y = B && S.length > 0 ? S[0][0] : Se, re = B && S.length > 0 ? S[0][1] : ke, [$t, De] = h(
+  const Y = B && S.length > 0 ? S[0][0] : Se, re = B && S.length > 0 ? S[0][1] : ke, [$t, De] = m(
     () => d.map((e) => e.id || e.key)
   ), L = de((e) => {
     if (!e || e.length === 0)
       return e;
     let t = Array.from(new Set(e));
     t.length > D && (t = t.slice(0, D));
-    const n = d.map((i) => i.id || i.key).includes(y);
-    return !t.includes(y) && n && (t.length >= D ? t = [...t.slice(0, D - 1), y] : t = [...t, y]), [...t.filter((i) => i !== y), y];
-  }, [d]), [f, _] = h(() => {
+    const n = d.map((i) => i.id || i.key).includes(b);
+    return !t.includes(b) && n && (t.length >= D ? t = [...t.slice(0, D - 1), b] : t = [...t, b]), [...t.filter((i) => i !== b), b];
+  }, [d]), [f, _] = m(() => {
     if (typeof window < "u" && c)
       try {
-        if (localStorage.getItem(`dataTable_manual_change_${c}:${m}`) === "true") {
-          const n = localStorage.getItem(`dataTable_columns_${c}:${m}`);
+        if (localStorage.getItem(`dataTable_manual_change_${c}:${h}`) === "true") {
+          const n = localStorage.getItem(`dataTable_columns_${c}:${h}`);
           if (n) {
             const s = JSON.parse(n);
             if (Array.isArray(s) && s.length > 0) {
@@ -236,7 +236,7 @@ function jt({
       }
     const t = d.map((r) => r.id || r.key).slice(0, D);
     return L(t);
-  }), [k, Ne] = h(!1), [fe, Ue] = h({ top: 0, left: 0, width: 0 }), [Je, Fe] = h(/* @__PURE__ */ new Set()), [ze, Oe] = h(/* @__PURE__ */ new Set()), [N, ge] = h(null), [Ge, ne] = h(null), H = E(null), he = E(null), K = E(null), [Le, Ee] = h(null), Ye = E(null), x = (e) => e.id || e.key, Xe = gt(
+  }), [k, Ne] = m(!1), [fe, Ue] = m({ top: 0, left: 0, width: 0 }), [Je, Fe] = m(/* @__PURE__ */ new Set()), [ze, Oe] = m(/* @__PURE__ */ new Set()), [N, ge] = m(null), [Ge, ne] = m(null), H = T(null), me = T(null), K = T(null), [Le, Te] = m(null), Ye = T(null), x = (e) => e.id || e.key, Xe = gt(
     _e(St),
     _e(wt, {
       coordinateGetter: vt
@@ -246,16 +246,16 @@ function jt({
     r && t.id !== r.id && ($.current = !0, _((n) => {
       const s = n.indexOf(t.id), a = n.indexOf(r.id);
       if (s !== -1 && a !== -1) {
-        const i = be(n, s, a);
+        const i = ye(n, s, a);
         return ie(i), i;
       }
       return n;
     }), De((n) => {
       const s = n.indexOf(t.id), a = n.indexOf(r.id);
-      return be(n, s, a);
-    })), Ee(null);
+      return ye(n, s, a);
+    })), Te(null);
   }, Qe = (e) => {
-    Ee(e.active.id);
+    Te(e.active.id);
   }, oe = I(() => ce ? g || [] : !g || g.length === 0 ? [] : g.filter((e) => Object.keys(M).every((t) => {
     const r = M[t];
     if (!r || r.trim() === "")
@@ -284,7 +284,7 @@ function jt({
     }
   }, [g, se, pe, ee, Z]), Ze = (e) => {
     B && Q ? (Q(e), v ? v(1) : ue(1)) : (Se === e ? Ce(ke === "asc" ? "desc" : "asc") : (Ke(e), Ce("asc")), te(1));
-  }, Te = (e, t) => {
+  }, Ee = (e, t) => {
     const r = t && t.trim() !== "" ? { ...M, [e]: t } : Object.fromEntries(Object.entries(M).filter(([n]) => n !== e));
     He(r), ce && J && J(r), v ? v(1) : ue(1);
   }, et = (e) => {
@@ -298,8 +298,8 @@ function jt({
       } catch (t) {
         console.warn("Failed to save columns to localStorage:", t);
       }
-  }, [W, V]), me = (e) => {
-    e !== y && ($.current = !0, _((t) => t.includes(e) ? (K.current && (clearTimeout(K.current), K.current = null), t.length === 1 || (Oe((r) => new Set(r).add(e)), setTimeout(() => {
+  }, [W, V]), he = (e) => {
+    e !== b && ($.current = !0, _((t) => t.includes(e) ? (K.current && (clearTimeout(K.current), K.current = null), t.length === 1 || (Oe((r) => new Set(r).add(e)), setTimeout(() => {
       _((r) => {
         const n = r.filter((a) => a !== e), s = L(n);
         return ie(s), s;
@@ -317,7 +317,7 @@ function jt({
       });
     }, 200), t)));
   }, tt = (e, t) => {
-    f[t] !== y && ge(t);
+    f[t] !== b && ge(t);
   }, rt = () => {
     ge(null), ne(null);
   }, nt = (e, t) => {
@@ -325,8 +325,8 @@ function jt({
   }, ot = () => {
     ne(null);
   }, st = (e, t) => {
-    e.preventDefault(), N !== null && N !== t && f[t] !== y && f[N] !== y && ($.current = !0, _((r) => {
-      const n = be(r, N, t), s = L(n);
+    e.preventDefault(), N !== null && N !== t && f[t] !== b && f[N] !== b && ($.current = !0, _((r) => {
+      const n = ye(r, N, t), s = L(n);
       return ie(s), s;
     })), ge(null), ne(null);
   };
@@ -347,8 +347,8 @@ function jt({
     if (d.length > 0 && f.length === 0) {
       if (typeof window < "u" && c)
         try {
-          if (localStorage.getItem(`dataTable_manual_change_${c}:${m}`) === "true") {
-            const r = localStorage.getItem(`dataTable_columns_${c}:${m}`);
+          if (localStorage.getItem(`dataTable_manual_change_${c}:${h}`) === "true") {
+            const r = localStorage.getItem(`dataTable_columns_${c}:${h}`);
             if (r) {
               const n = JSON.parse(r);
               if (Array.isArray(n) && n.length > 0) {
@@ -368,7 +368,7 @@ function jt({
       const e = d.map((t) => t.id || t.key);
       _(L(e.slice(0, D)));
     }
-  }, [d, c, m, L]);
+  }, [d, c, h, L]);
   const A = I(() => {
     const e = f.map((t) => d.find((r) => x(r) === t)).filter(Boolean);
     return L(e.map(x)).map((t) => d.find((r) => x(r) === t)).filter(Boolean);
@@ -392,7 +392,7 @@ function jt({
     };
   }, [k]), P(() => {
     const e = (t) => {
-      k && H.current && !H.current.contains(t.target) && he.current && !he.current.contains(t.target) && Ne(!1);
+      k && H.current && !H.current.contains(t.target) && me.current && !me.current.contains(t.target) && Ne(!1);
     };
     if (k)
       return document.addEventListener("mousedown", e), () => {
@@ -401,7 +401,7 @@ function jt({
   }, [k]);
   const it = f.length === 1 ? ((Me = d.find((e) => (e.id || e.key) === f[0])) == null ? void 0 : Me.label) || "1 selected" : `${f.length} selected`;
   function lt({ column: e, isHeaderRow: t = !0 }) {
-    const r = x(e), n = r === y, {
+    const r = x(e), n = r === b, {
       attributes: s,
       listeners: a,
       setNodeRef: i,
@@ -439,7 +439,7 @@ function jt({
           width: e.width || "auto",
           borderRight: "1px solid rgba(52, 58, 64, 0.06)",
           userSelect: "none",
-          background: "rgba(255, 255, 255, 0.95)",
+          background: "var(--primary-foreground)",
           borderBottom: "1px solid rgba(52, 58, 64, 0.12)",
           position: "sticky",
           top: 0,
@@ -483,9 +483,10 @@ function jt({
       {
         style: {
           width: e.width || "auto",
-          minWidth: e.width || "auto"
+          minWidth: e.width || "auto",
+          backgroundColor: "var(--primary-foreground)"
         },
-        className: "sticky top-[57px] z-10 bg-[var(--paper-elevated)] border-b border-[var(--border-strong)] px-4 py-2 text-left",
+        className: "sticky top-[57px] z-10 border-b border-[var(--border-strong)] px-4 py-2 text-left",
         children: pt ? /* @__PURE__ */ l("div", { className: "relative", children: [
           /* @__PURE__ */ o(
             Pe,
@@ -501,12 +502,12 @@ function jt({
               placeholder: "Filter...",
               value: M[r] || "",
               onChange: (F) => {
-                F.stopPropagation(), Te(r, F.target.value);
+                F.stopPropagation(), Ee(r, F.target.value);
               },
               onKeyDown: (F) => F.stopPropagation(),
               onMouseDown: (F) => F.stopPropagation(),
-              className: "w-full pl-7 pr-2 py-1.5 text-xs border border-[var(--border)] rounded bg-[var(--paper)] text-[var(--text-ink)] placeholder:text-[var(--text-faint)] focus:outline-none focus:border-[var(--border-hover)] focus:ring-1 focus:ring-[var(--focus)] transition-colors",
-              style: { fontFamily: "var(--font-sans)" },
+              className: "w-full pl-7 pr-2 py-1.5 text-xs border border-[var(--border)] rounded text-[var(--text-ink)] placeholder:text-[var(--text-faint)] focus:outline-none focus:border-[var(--border-hover)] focus:ring-1 focus:ring-[var(--focus)] transition-colors",
+              style: { fontFamily: "var(--font-sans)", backgroundColor: "var(--primary-foreground)" },
               autoComplete: "off"
             }
           )
@@ -517,8 +518,8 @@ function jt({
   const $e = Le ? d.find((e) => x(e) === Le) : null, dt = k ? /* @__PURE__ */ l(
     "div",
     {
-      ref: he,
-      className: "flex flex-col bg-white overflow-auto z-[49] min-w-[220px]",
+      ref: me,
+      className: "flex flex-col overflow-auto z-[49] min-w-[220px]",
       style: {
         position: "fixed",
         top: `${fe.top}px`,
@@ -526,6 +527,7 @@ function jt({
         width: fe.width || 220,
         maxHeight: "400px",
         fontFamily: "var(--font-sans)",
+        backgroundColor: "var(--primary-foreground)",
         borderRadius: "0 0 8px 8px",
         // Rounded corners only on bottom
         boxShadow: "4px 4px 6px 0px #6D70681A, -4px 0px 6px 0px #6D70681A",
@@ -538,7 +540,7 @@ function jt({
           const r = d.find((u) => x(u) === e);
           if (!r)
             return null;
-          const n = f.indexOf(e), s = N === n, a = Ge === n, i = e === y;
+          const n = f.indexOf(e), s = N === n, a = Ge === n, i = e === b;
           return /* @__PURE__ */ l(xe.Fragment, { children: [
             /* @__PURE__ */ l(
               "div",
@@ -574,7 +576,7 @@ function jt({
                     {
                       type: "button",
                       onClick: (u) => {
-                        u.preventDefault(), u.stopPropagation(), i || me(e);
+                        u.preventDefault(), u.stopPropagation(), i || he(e);
                       },
                       className: `h-4 w-4 rounded-[2px] border flex items-center justify-center transition-colors flex-shrink-0 ${i ? "bg-green-2 border-green-2 cursor-default" : ze.has(e) ? "bg-white border-gray-300" : "bg-green-2 border-green-2"}`,
                       children: !ze.has(e) && /* @__PURE__ */ o(
@@ -602,19 +604,19 @@ function jt({
                 ]
               }
             ),
-            t < f.length - 1 && /* @__PURE__ */ o(ye, {})
+            t < f.length - 1 && /* @__PURE__ */ o(be, {})
           ] }, `selected-${e}-${t}`);
         }),
         d.filter((e) => !f.includes(x(e))).map((e, t) => {
           const r = x(e), n = Je.has(r), s = d.filter((a) => !f.includes(x(a))).indexOf(e);
           return /* @__PURE__ */ l(xe.Fragment, { children: [
-            f.length > 0 && s === 0 && /* @__PURE__ */ o(ye, {}),
+            f.length > 0 && s === 0 && /* @__PURE__ */ o(be, {}),
             /* @__PURE__ */ l(
               "label",
               {
                 className: "flex items-center gap-2 px-3 py-2 hover:bg-gray-50 rounded cursor-pointer transition-colors",
                 onClick: (a) => {
-                  a.preventDefault(), me(r);
+                  a.preventDefault(), he(r);
                 },
                 children: [
                   /* @__PURE__ */ o(
@@ -622,7 +624,7 @@ function jt({
                     {
                       type: "button",
                       onClick: (a) => {
-                        a.preventDefault(), a.stopPropagation(), me(r);
+                        a.preventDefault(), a.stopPropagation(), he(r);
                       },
                       className: `h-4 w-4 rounded-[2px] border flex items-center justify-center transition-colors flex-shrink-0 ${n ? "bg-green-2 border-green-2" : "bg-white border-gray-300"}`,
                       children: n && /* @__PURE__ */ o(
@@ -650,13 +652,13 @@ function jt({
                 ]
               }
             ),
-            s < d.filter((a) => !f.includes(x(a))).length - 1 && /* @__PURE__ */ o(ye, {})
+            s < d.filter((a) => !f.includes(x(a))).length - 1 && /* @__PURE__ */ o(be, {})
           ] }, `unselected-${r}`);
         })
       ]
     }
   ) : null;
-  return /* @__PURE__ */ l("div", { className: "w-full", style: { top: "130px", position: "sticky", zIndex: 35, backgroundColor: "#F4F1E6" }, children: [
+  return /* @__PURE__ */ l("div", { className: "w-full", style: { top: "130px", position: "sticky", zIndex: 35, backgroundColor: "var(--primary-foreground)" }, children: [
     d.length > 0 && /* @__PURE__ */ o(
       "div",
       {
@@ -664,7 +666,7 @@ function jt({
         style: {
           position: "sticky",
           zIndex: 35,
-          backgroundColor: "#F4F1E6"
+          backgroundColor: "var(--primary-foreground)"
         },
         children: /* @__PURE__ */ l("div", { className: "flex items-center gap-3 flex-wrap", children: [
           /* @__PURE__ */ l("div", { className: "flex-shrink-0", children: [
@@ -673,10 +675,11 @@ function jt({
               "div",
               {
                 ref: H,
-                className: "inline-flex items-center justify-between gap-2 px-4 py-2.5 bg-white/80 cursor-pointer hover:bg-white transition-colors text-sm font-medium text-gray-900 border border-gray-300 min-w-[220px]",
+                className: "inline-flex items-center justify-between gap-2 px-4 py-2.5 cursor-pointer transition-colors text-sm font-medium text-gray-900 border border-gray-300 min-w-[220px]",
                 onClick: () => Ne(!k),
                 style: {
                   fontFamily: "var(--font-sans)",
+                  backgroundColor: "var(--primary-foreground)",
                   borderRadius: k ? "8px 8px 0 0" : "8px"
                   // Rounded top corners when open, all corners when closed
                 },
@@ -705,18 +708,18 @@ function jt({
       }
     ),
     d.length > 0 && A.length > 0 ? /* @__PURE__ */ l(
-      ht,
+      mt,
       {
         sensors: Xe,
-        collisionDetection: mt,
+        collisionDetection: ht,
         onDragStart: Qe,
         onDragEnd: qe,
         children: [
           /* @__PURE__ */ l("div", { className: "rounded-t-[14px]", style: {
             border: "1px solid rgba(52, 58, 64, 0.12)",
-            borderBottom: "none",
+            borderBottom: "1px solid rgba(52, 58, 64, 0.12)",
             overflow: "hidden",
-            background: "rgba(255, 255, 255, 0.82)",
+            background: "var(--primary-foreground)",
             position: "relative",
             top: "0.5rem"
           }, children: [
@@ -743,7 +746,7 @@ function jt({
                 margin: 0
               }, children: "Loading..." }),
               /* @__PURE__ */ o(
-                Et,
+                Tt,
                 {
                   src: "/BrandLoading.gif",
                   alt: "Loading",
@@ -765,7 +768,7 @@ function jt({
                   xt,
                   {
                     items: f,
-                    strategy: bt,
+                    strategy: yt,
                     children: A.map((e) => /* @__PURE__ */ o(lt, { column: e, isHeaderRow: !0 }, `header-${x(e)}`))
                   }
                 ) }),
@@ -776,7 +779,7 @@ function jt({
                     {
                       style: {
                         padding: "8px 14px",
-                        background: "rgba(244, 241, 230, 0.35)",
+                        background: "var(--primary-foreground)",
                         borderBottom: "1px solid rgba(52, 58, 64, 0.10)",
                         position: "sticky",
                         top: "41px",
@@ -792,7 +795,7 @@ function jt({
                             placeholder: "Filter...",
                             value: M[t] || "",
                             onChange: (n) => {
-                              n.stopPropagation(), Te(t, n.target.value);
+                              n.stopPropagation(), Ee(t, n.target.value);
                             },
                             onKeyDown: (n) => n.stopPropagation(),
                             onMouseDown: (n) => n.stopPropagation(),
@@ -802,16 +805,16 @@ function jt({
                               fontSize: "11.5px",
                               border: "1px solid rgba(52, 58, 64, 0.16)",
                               borderRadius: "6px",
-                              background: "rgba(255, 255, 255, 0.85)",
+                              background: "var(--primary-foreground)",
                               color: "rgba(30, 33, 37, 0.78)",
                               outline: "none",
                               fontFamily: "var(--font-sans)"
                             },
                             onFocus: (n) => {
-                              n.target.style.borderColor = "rgba(231, 212, 162, 0.65)", n.target.style.background = "rgba(255, 255, 255, 1)";
+                              n.target.style.borderColor = "rgba(231, 212, 162, 0.65)", n.target.style.background = "var(--primary-foreground)";
                             },
                             onBlur: (n) => {
-                              n.target.style.borderColor = "rgba(52, 58, 64, 0.16)", n.target.style.background = "rgba(255, 255, 255, 0.85)";
+                              n.target.style.borderColor = "rgba(52, 58, 64, 0.16)", n.target.style.background = "var(--primary-foreground)";
                             },
                             autoComplete: "off"
                           }
@@ -891,14 +894,14 @@ function jt({
               )) : null })
             ] }) })
           ] }),
-          /* @__PURE__ */ o(yt, { children: $e ? /* @__PURE__ */ o("div", { className: "bg-[var(--paper-high)] border border-[var(--border-strong)] rounded px-4 py-2 shadow-lg", children: /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ o(bt, { children: $e ? /* @__PURE__ */ o("div", { className: "bg-[var(--paper-high)] border border-[var(--border-strong)] rounded px-4 py-2 shadow-lg", children: /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ o(Re, { size: 14, className: "text-[var(--text-faint)]" }),
             /* @__PURE__ */ o("span", { className: "text-sm font-semibold text-[var(--text-ink)]", children: $e.label })
           ] }) }) : null })
         ]
       }
     ) : null,
-    (Z ? C > 0 : se.length > 0) && /* @__PURE__ */ o("div", { className: "border-t border-gray-200 bg-white rounded-b-[14px]", children: /* @__PURE__ */ o(
+    (Z ? C > 0 : se.length > 0) && /* @__PURE__ */ o("div", { className: "border-t border-gray-200 rounded-b-[14px]", style: { backgroundColor: "var(--primary-foreground)" }, children: /* @__PURE__ */ o(
       zt,
       {
         page: pe,
@@ -907,7 +910,7 @@ function jt({
         totalCount: Z ? C : se.length,
         currentDataLength: ae.length,
         onPageChange: te,
-        onPageSizeChange: T ? (e) => {
+        onPageSizeChange: E ? (e) => {
           we(e), te(1);
         } : (e) => {
           we(e), te(1);
@@ -920,7 +923,7 @@ function jt({
 function Bt({
   title: g = "Summary stats",
   stats: d = [],
-  columns: b = 2
+  columns: y = 2
 }) {
   return /* @__PURE__ */ l("div", { style: { fontFamily: "system-ui, -apple-system, sans-serif" }, children: [
     /* @__PURE__ */ o(
@@ -936,7 +939,7 @@ function Bt({
       {
         style: {
           display: "grid",
-          gridTemplateColumns: `repeat(${b}, minmax(0, 1fr))`,
+          gridTemplateColumns: `repeat(${y}, minmax(0, 1fr))`,
           gap: "10px"
         },
         children: d.map((p, C) => /* @__PURE__ */ l(