@ztwoint/z-ui 0.1.116 → 0.1.118

package/dist/components/dynamic-table/z2-table.js

@@ -1,11 +1,12 @@
-import { jsxs as p, jsx as n, Fragment as z } from "react/jsx-runtime";
+import { jsxs as m, jsx as o, Fragment as z } from "react/jsx-runtime";
 import { Fragment as P } from "react";
-import { Z2Checkbox as R } from "../checkbox/checkbox.js";
+import { Z2Checkbox as w } from "../checkbox/checkbox.js";
 import { useZ2Table as g } from "./z2-table-context.js";
-import { flexRender as w } from "@tanstack/react-table";
-import { cva as N } from "class-variance-authority";
-import { cn as m } from "../../lib/utils.js";
-const B = N("", {
+import { flexRender as k } from "@tanstack/react-table";
+import { cva as v } from "class-variance-authority";
+import { cn as p } from "../../lib/utils.js";
+import { Z2Skeleton as Z } from "../skeleton/skeleton.js";
+const B = v("", {
   variants: {
     size: {
       dense: "p-2 h-8",
@@ -15,7 +16,7 @@ const B = N("", {
   defaultVariants: {
     size: "default"
   }
-}), S = N("", {
+}), S = v("", {
   variants: {
     size: {
       dense: "p-2",
@@ -26,7 +27,7 @@ const B = N("", {
     size: "default"
   }
 });
-function v(l) {
+function N(l) {
   const e = l.getIsPinned();
   return {
     left: e === "left" ? `${l.getStart("left")}px` : void 0,
@@ -36,14 +37,14 @@ function v(l) {
     zIndex: e ? 1 : 0
   };
 }
-function I({ children: l }) {
+function _({ children: l }) {
   var t, r, a;
   const { props: e } = g();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "table",
     {
       "data-slot": "data-grid-table",
-      className: m(
+      className: p(
         "w-full align-middle text-left rtl:text-right text-neutral-secondary",
         !((t = e.tableLayout) != null && t.columnsDraggable) && "border-separate border-spacing-0",
         ((r = e.tableLayout) == null ? void 0 : r.width) === "fixed" ? "table-fixed" : "table-auto",
@@ -53,13 +54,13 @@ function I({ children: l }) {
     }
   );
 }
-function T({ children: l }) {
+function I({ children: l }) {
   var t, r, a;
   const { props: e } = g();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "thead",
     {
-      className: m(
+      className: p(
         "",
         (t = e.tableClassNames) == null ? void 0 : t.header,
         ((r = e.tableLayout) == null ? void 0 : r.headerSticky) && ((a = e.tableClassNames) == null ? void 0 : a.headerSticky)
@@ -68,22 +69,22 @@ function T({ children: l }) {
     }
   );
 }
-function Z({
+function T({
   children: l,
   headerGroup: e
 }) {
-  var r, a, o, d, i;
+  var r, a, n, d, s;
   const { props: t } = g();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "tr",
     {
-      className: m(
-        "bg-transparent leading-none-medium-sm tracking-wider rounded-xl",
+      className: p(
+        "bg-transparent tracking-wider rounded-xl",
         ((r = t.tableLayout) == null ? void 0 : r.headerBorder) && "[&>th]:border-b border-stroke-solid-light",
         ((a = t.tableLayout) == null ? void 0 : a.cellBorder) && "[&_>:last-child]:border-e-0",
-        ((o = t.tableLayout) == null ? void 0 : o.stripped) && "bg-transparent",
+        ((n = t.tableLayout) == null ? void 0 : n.stripped) && "bg-transparent",
         ((d = t.tableLayout) == null ? void 0 : d.headerBackground) !== !1 && "bg-background-neutral-medium",
-        (i = t.tableClassNames) == null ? void 0 : i.headerRow
+        (s = t.tableClassNames) == null ? void 0 : s.headerRow
       ),
       children: l
     },
@@ -96,11 +97,11 @@ function D({
   dndRef: t,
   dndStyle: r
 }) {
-  var c, b, h, f, y, C, x, k;
-  const { props: a } = g(), { column: o } = e, d = o.getIsPinned(), i = d === "left" && o.getIsLastColumn("left"), s = d === "right" && o.getIsFirstColumn("right"), u = B({
+  var c, b, h, f, C, y, x, R;
+  const { props: a } = g(), { column: n } = e, d = n.getIsPinned(), s = d === "left" && n.getIsLastColumn("left"), i = d === "right" && n.getIsFirstColumn("right"), u = B({
     size: (c = a.tableLayout) != null && c.dense ? "dense" : "default"
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "th",
     {
       ref: t,
@@ -108,28 +109,28 @@ function D({
         ...((b = a.tableLayout) == null ? void 0 : b.width) === "fixed" && {
           width: `${e.getSize()}px`
         },
-        ...((h = a.tableLayout) == null ? void 0 : h.columnsPinnable) && o.getCanPin() && v(o),
+        ...((h = a.tableLayout) == null ? void 0 : h.columnsPinnable) && n.getCanPin() && N(n),
         ...r || null
       },
       "data-pinned": d || void 0,
-      "data-last-col": i ? "left" : s ? "right" : void 0,
-      className: m(
+      "data-last-col": s ? "left" : i ? "right" : void 0,
+      className: p(
         "relative h-10 text-left rtl:text-right align-middle [&:has([role=checkbox])]:pe-0 border-stroke-solid-light leading-none-medium-sm dark:text-inverted-secondary",
         u,
         ((f = a.tableLayout) == null ? void 0 : f.cellBorder) && "border-e",
-        ((y = a.tableLayout) == null ? void 0 : y.columnsResizable) && o.getCanResize() && "truncate",
-        ((C = a.tableLayout) == null ? void 0 : C.columnsPinnable) && o.getCanPin() && "[&:not([data-pinned]):has(+[data-pinned])_div.cursor-col-resize:last-child]:opacity-0 [&[data-last-col=left]_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right]:last-child_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-muted/90 data-pinned:backdrop-blur-xs",
+        ((C = a.tableLayout) == null ? void 0 : C.columnsResizable) && n.getCanResize() && "truncate",
+        ((y = a.tableLayout) == null ? void 0 : y.columnsPinnable) && n.getCanPin() && "[&:not([data-pinned]):has(+[data-pinned])_div.cursor-col-resize:last-child]:opacity-0 [&[data-last-col=left]_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right]:last-child_div.cursor-col-resize:last-child]:opacity-0 [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-muted/90 data-pinned:backdrop-blur-xs",
         (x = e.column.columnDef.meta) == null ? void 0 : x.headerClassName,
-        o.getIndex() === 0 || o.getIndex() === e.headerGroup.headers.length - 1 ? (k = a.tableClassNames) == null ? void 0 : k.edgeCell : ""
+        n.getIndex() === 0 || n.getIndex() === e.headerGroup.headers.length - 1 ? (R = a.tableClassNames) == null ? void 0 : R.edgeCell : ""
       ),
       children: l
     },
     e.id
   );
 }
-function _({ header: l }) {
+function A({ header: l }) {
   const { column: e } = l;
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "div",
     {
       onDoubleClick: () => e.resetSize(),
@@ -139,16 +140,16 @@ function _({ header: l }) {
     }
   );
 }
-function A() {
-  return /* @__PURE__ */ n("tbody", { "aria-hidden": "true", className: "h-2" });
+function M() {
+  return /* @__PURE__ */ o("tbody", { "aria-hidden": "true", className: "h-2" });
 }
 function V({ children: l }) {
   var t, r;
   const { props: e } = g();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "tbody",
     {
-      className: m(
+      className: p(
         "[&_tr:last-child]:border-0",
         ((t = e.tableLayout) == null ? void 0 : t.rowRounded) && "[&_td:first-child]:rounded-s-lg [&_td:last-child]:rounded-e-lg",
         (r = e.tableClassNames) == null ? void 0 : r.body
@@ -158,19 +159,19 @@ function V({ children: l }) {
   );
 }
 function F({ children: l }) {
-  var r, a, o, d, i;
+  var r, a, n, d, s;
   const { table: e, props: t } = g();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "tr",
     {
-      className: m(
+      className: p(
         "hover:bg-background-neutral-medium data-[state=selected]:bg-muted/50 border-stroke-solid-light",
         t.onRowClick && "cursor-pointer",
         !((r = t.tableLayout) != null && r.stripped) && ((a = t.tableLayout) == null ? void 0 : a.rowBorder) && "[&:not(:last-child)>td]:border-b [&:not(:last-child)>td]:border-stroke-solid-light",
-        ((o = t.tableLayout) == null ? void 0 : o.cellBorder) && "[&_>:last-child]:border-e-0",
+        ((n = t.tableLayout) == null ? void 0 : n.cellBorder) && "[&_>:last-child]:border-e-0",
         ((d = t.tableLayout) == null ? void 0 : d.stripped) && "odd:bg-background-neutral-medium hover:bg-transparent odd:hover:bg-background-neutral-medium",
         e.options.enableRowSelection && "[&_>:first-child]:relative",
-        (i = t.tableClassNames) == null ? void 0 : i.bodyRow
+        (s = t.tableClassNames) == null ? void 0 : s.bodyRow
       ),
       children: l
     }
@@ -180,11 +181,11 @@ function H({
   children: l,
   column: e
 }) {
-  var o, d, i, s, u, c, b;
+  var n, d, s, i, u, c, b;
   const { props: t, table: r } = g(), a = S({
-    size: (o = t.tableLayout) != null && o.dense ? "dense" : "default"
+    size: (n = t.tableLayout) != null && n.dense ? "dense" : "default"
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "td",
     {
       style: {
@@ -192,11 +193,11 @@ function H({
           width: `${e.getSize()}px`
         }
       },
-      className: m(
+      className: p(
         "align-middle",
         a,
-        ((i = t.tableLayout) == null ? void 0 : i.cellBorder) && "border-e border-stroke-solid-light",
-        ((s = t.tableLayout) == null ? void 0 : s.columnsResizable) && e.getCanResize() && "truncate",
+        ((s = t.tableLayout) == null ? void 0 : s.cellBorder) && "border-e border-stroke-solid-light",
+        ((i = t.tableLayout) == null ? void 0 : i.columnsResizable) && e.getCanResize() && "truncate",
         (u = e.columnDef.meta) == null ? void 0 : u.cellClassName,
         ((c = t.tableLayout) == null ? void 0 : c.columnsPinnable) && e.getCanPin() && '[&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-stroke-solid-light data-pinned:bg-background/90 data-pinned:backdrop-blur-xs"',
         e.getIndex() === 0 || e.getIndex() === r.getVisibleFlatColumns().length - 1 ? (b = t.tableClassNames) == null ? void 0 : b.edgeCell : ""
@@ -205,144 +206,168 @@ function H({
     }
   );
 }
-function M({
+function E({
   children: l,
   row: e,
   dndRef: t,
   dndStyle: r
 }) {
-  var d, i, s, u, c;
-  const { props: a, table: o } = g();
-  return /* @__PURE__ */ n(
+  var d, s, i, u, c;
+  const { props: a, table: n } = g();
+  return /* @__PURE__ */ o(
     "tr",
     {
       ref: t,
       style: { ...r || null },
-      "data-state": o.options.enableRowSelection && e.getIsSelected() ? "selected" : void 0,
+      "data-state": n.options.enableRowSelection && e.getIsSelected() ? "selected" : void 0,
       onClick: () => a.onRowClick && a.onRowClick(e.original),
-      className: m(
-        "hover:bg-background-neutral-medium data-[state=selected]:bg-muted/50 border-stroke-solid-light",
+      className: p(
+        "hover:bg-background-neutral-medium data-[state=selected]:bg-muted/50 leading-none-medium-sm text-neutral-primary dark:text-inverted-primary",
         a.onRowClick && "cursor-pointer",
-        !((d = a.tableLayout) != null && d.stripped) && ((i = a.tableLayout) == null ? void 0 : i.rowBorder) && "border-b [&:not(:last-child)>td]:border-b",
-        ((s = a.tableLayout) == null ? void 0 : s.cellBorder) && "[&_>:last-child]:border-e-0",
+        !((d = a.tableLayout) != null && d.stripped) && ((s = a.tableLayout) == null ? void 0 : s.rowBorder) && "[&:not(:last-child)>td]:border-b [&:not(:last-child)>td]:border-stroke-solid-light",
+        ((i = a.tableLayout) == null ? void 0 : i.cellBorder) && "[&_>:last-child]:border-e-0",
         ((u = a.tableLayout) == null ? void 0 : u.stripped) && "odd:bg-background-neutral-medium hover:bg-transparent odd:hover:bg-background-neutral-medium",
-        o.options.enableRowSelection && "[&_>:first-child]:relative",
+        n.options.enableRowSelection && "[&_>:first-child]:relative",
         (c = a.tableClassNames) == null ? void 0 : c.bodyRow
       ),
       children: l
     }
   );
 }
-function $({ row: l }) {
-  var a, o, d, i, s, u;
+function j({ row: l }) {
+  var a, n, d, s, i, u;
   const { props: e, table: t } = g();
-  return ((o = (a = t.getAllColumns().find((c) => {
+  return ((n = (a = t.getAllColumns().find((c) => {
     var b;
     return (b = c.columnDef.meta) == null ? void 0 : b.expandedContent;
-  })) == null ? void 0 : a.columnDef.meta) == null ? void 0 : o.expandedContent) ? /* @__PURE__ */ n(
+  })) == null ? void 0 : a.columnDef.meta) == null ? void 0 : n.expandedContent) ? /* @__PURE__ */ o(
     "tr",
     {
-      className: m(
+      className: p(
         ((d = e.tableLayout) == null ? void 0 : d.rowBorder) && "[&:not(:last-child)>td]:border-b [&:not(:last-child)>td]:border-stroke-solid-light"
       ),
-      children: /* @__PURE__ */ n("td", { colSpan: l.getVisibleCells().length, children: (u = (s = (i = t.getAllColumns().find((c) => {
+      children: /* @__PURE__ */ o("td", { colSpan: l.getVisibleCells().length, children: (u = (i = (s = t.getAllColumns().find((c) => {
         var b;
         return (b = c.columnDef.meta) == null ? void 0 : b.expandedContent;
-      })) == null ? void 0 : i.columnDef.meta) == null ? void 0 : s.expandedContent) == null ? void 0 : u.call(s, l.original) })
+      })) == null ? void 0 : s.columnDef.meta) == null ? void 0 : i.expandedContent) == null ? void 0 : u.call(i, l.original) })
     }
   ) : null;
 }
-function j({
+function $({
   children: l,
   cell: e,
   dndRef: t,
   dndStyle: r
 }) {
-  var b, h, f, y, C, x, k, L;
-  const { props: a } = g(), { column: o, row: d } = e, i = o.getIsPinned(), s = i === "left" && o.getIsLastColumn("left"), u = i === "right" && o.getIsFirstColumn("right"), c = S({
+  var b, h, f, C, y, x, R, L;
+  const { props: a } = g(), { column: n, row: d } = e, s = n.getIsPinned(), i = s === "left" && n.getIsLastColumn("left"), u = s === "right" && n.getIsFirstColumn("right"), c = S({
     size: (b = a.tableLayout) != null && b.dense ? "dense" : "default"
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ o(
     "td",
     {
       ref: t,
-      ...(h = a.tableLayout) != null && h.columnsDraggable && !i ? { cell: e } : {},
+      ...(h = a.tableLayout) != null && h.columnsDraggable && !s ? { cell: e } : {},
       style: {
-        ...((f = a.tableLayout) == null ? void 0 : f.columnsPinnable) && o.getCanPin() && v(o),
+        ...((f = a.tableLayout) == null ? void 0 : f.columnsPinnable) && n.getCanPin() && N(n),
         ...r || null
       },
-      "data-pinned": i || void 0,
-      "data-last-col": s ? "left" : u ? "right" : void 0,
-      className: m(
-        "align-middle border-stroke-solid-light leading-none-medium-sm text-neutral-primary dark:text-inverted-primary",
+      "data-pinned": s || void 0,
+      "data-last-col": i ? "left" : u ? "right" : void 0,
+      className: p(
+        "align-middle",
         c,
-        ((y = a.tableLayout) == null ? void 0 : y.cellBorder) && "border-e border-stroke-solid-light",
-        ((C = a.tableLayout) == null ? void 0 : C.columnsResizable) && o.getCanResize() && "truncate",
+        ((C = a.tableLayout) == null ? void 0 : C.cellBorder) && "border-e border-stroke-solid-light",
+        ((y = a.tableLayout) == null ? void 0 : y.columnsResizable) && n.getCanResize() && "truncate",
         (x = e.column.columnDef.meta) == null ? void 0 : x.cellClassName,
-        ((k = a.tableLayout) == null ? void 0 : k.columnsPinnable) && o.getCanPin() && '[&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-background/90 data-pinned:backdrop-blur-xs"',
-        o.getIndex() === 0 || o.getIndex() === d.getVisibleCells().length - 1 ? (L = a.tableClassNames) == null ? void 0 : L.edgeCell : ""
+        ((R = a.tableLayout) == null ? void 0 : R.columnsPinnable) && n.getCanPin() && '[&[data-pinned=left][data-last-col=left]]:border-e! [&[data-pinned=right][data-last-col=right]]:border-s! [&[data-pinned][data-last-col]]:border-border data-pinned:bg-background/90 data-pinned:backdrop-blur-xs"',
+        n.getIndex() === 0 || n.getIndex() === d.getVisibleCells().length - 1 ? (L = a.tableClassNames) == null ? void 0 : L.edgeCell : ""
       ),
       children: l
     },
     e.id
   );
 }
-function E() {
+function G() {
   const { table: l, props: e } = g(), t = l.getAllColumns().length;
-  return /* @__PURE__ */ n("tr", { children: /* @__PURE__ */ n("td", { colSpan: t, className: "text-center text-muted-foreground py-6", children: e.emptyMessage || "No data available" }) });
+  return /* @__PURE__ */ o("tr", { children: /* @__PURE__ */ o("td", { colSpan: t, className: "text-center text-muted-foreground py-6", children: e.emptyMessage || "No data available" }) });
 }
-function G() {
+function O() {
   const { table: l, props: e } = g(), t = l.getAllColumns().length;
-  return /* @__PURE__ */ n("tr", { children: /* @__PURE__ */ n("td", { colSpan: t, className: "text-center text-muted-foreground py-6", children: /* @__PURE__ */ p("div", { className: "text-muted-foreground bg-card  flex items-center gap-2 px-4 py-2 font-medium leading-none text-sm", children: [
-    /* @__PURE__ */ p(
+  return /* @__PURE__ */ o("tr", { style: { height: l.getState().pagination.pageSize * 43 }, children: /* @__PURE__ */ o("td", { colSpan: t, className: "text-center text-muted-foreground py-6", children: /* @__PURE__ */ m("div", { className: "text-neutral-muted flex items-center gap-2 px-4 py-2 leading-none-medium-sm justify-center", children: [
+    /* @__PURE__ */ m(
       "svg",
       {
-        className: "animate-spin -ml-1 h-5 w-5 text-muted-foreground",
         xmlns: "http://www.w3.org/2000/svg",
+        width: "32",
+        height: "32",
+        viewBox: "0 0 32 32",
         fill: "none",
-        viewBox: "0 0 24 24",
+        className: "animate-spin",
         children: [
-          /* @__PURE__ */ n(
-            "circle",
+          /* @__PURE__ */ o("g", { clipPath: "url(#paint0_angular_20785_14982_clip_path)", "data-figma-skip-parse": "true", children: /* @__PURE__ */ o("g", { transform: "matrix(0.016 0 0 0.016 16 16)", children: /* @__PURE__ */ o("foreignObject", { x: "-1083.33", y: "-1083.33", width: "2166.67", height: "2166.67", children: /* @__PURE__ */ o(
+            "div",
             {
-              className: "opacity-25",
-              cx: "12",
-              cy: "12",
-              r: "10",
-              stroke: "currentColor",
-              strokeWidth: "3"
+              style: {
+                background: "conic-gradient(from 90deg,rgba(37, 99, 235, 0) 0deg,rgba(37, 99, 235, 0) 0.036deg,rgba(37, 99, 235, 1) 360deg)",
+                height: "100%",
+                width: "100%",
+                opacity: 1
+              }
+            }
+          ) }) }) }),
+          /* @__PURE__ */ o(
+            "path",
+            {
+              fillRule: "evenodd",
+              clipRule: "evenodd",
+              d: "M16 32C24.8366 32 32 24.8366 32 16C32 7.16344 24.8366 0 16 0C7.16344 0 0 7.16344 0 16C0 24.8366 7.16344 32 16 32ZM16 29.3333C23.3638 29.3333 29.3333 23.3638 29.3333 16C29.3333 8.6362 23.3638 2.66667 16 2.66667C8.6362 2.66667 2.66667 8.6362 2.66667 16C2.66667 23.3638 8.6362 29.3333 16 29.3333Z",
+              "data-figma-gradient-fill": '{"type":"GRADIENT_ANGULAR","stops":[{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":0.0},"position":0.0},{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":0.0},"position":9.9999997473787516e-05},{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":1.0},"position":1.0}],"stopsVar":[{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":0.0},"position":0.0},{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":0.0},"position":9.9999997473787516e-05},{"color":{"r":0.14509804546833038,"g":0.38823530077934265,"b":0.92156863212585449,"a":1.0},"position":1.0}],"transform":{"m00":32.0,"m01":3.0381143971023802e-14,"m02":-2.8421709430404007e-14,"m10":-1.6170289255821799e-14,"m11":32.0,"m12":-7.1054273576010019e-15},"opacity":1.0,"blendMode":"NORMAL","visible":true}'
             }
           ),
-          /* @__PURE__ */ n(
+          /* @__PURE__ */ o(
             "path",
             {
-              className: "opacity-75",
-              fill: "currentColor",
-              d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+              fillRule: "evenodd",
+              clipRule: "evenodd",
+              d: "M30.3755 12.8009C31.1058 12.7067 31.7743 13.2223 31.8685 13.9527C31.9561 14.6316 32 15.3154 32 16C32 16.7364 31.4031 17.3333 30.6667 17.3333C29.9303 17.3333 29.3333 16.7364 29.3333 16C29.3333 15.4295 29.2967 14.8597 29.2237 14.2939C29.1295 13.5636 29.6452 12.8951 30.3755 12.8009Z",
+              fill: "#2563EB",
+              style: {
+                fill: "#2563EB",
+                fillOpacity: 1
+              }
             }
-          )
+          ),
+          /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: "paint0_angular_20785_14982_clip_path", children: /* @__PURE__ */ o(
+            "path",
+            {
+              fillRule: "evenodd",
+              clipRule: "evenodd",
+              d: "M16 32C24.8366 32 32 24.8366 32 16C32 7.16344 24.8366 0 16 0C7.16344 0 0 7.16344 0 16C0 24.8366 7.16344 32 16 32ZM16 29.3333C23.3638 29.3333 29.3333 23.3638 29.3333 16C29.3333 8.6362 23.3638 2.66667 16 2.66667C8.6362 2.66667 2.66667 8.6362 2.66667 16C2.66667 23.3638 8.6362 29.3333 16 29.3333Z"
+            }
+          ) }) })
         ]
       }
     ),
     e.loadingMessage || "Loading..."
   ] }) }) });
 }
-function X({
+function ee({
   row: l
   //   size,
 }) {
-  return /* @__PURE__ */ p(z, { children: [
-    /* @__PURE__ */ n(
+  return /* @__PURE__ */ m(z, { children: [
+    /* @__PURE__ */ o(
       "div",
       {
-        className: m(
+        className: p(
           "hidden absolute top-0 bottom-0 start-0 w-[2px] bg-primary",
           l.getIsSelected() && "block"
         )
       }
     ),
-    /* @__PURE__ */ n(
-      R,
+    /* @__PURE__ */ o(
+      w,
       {
         checked: l.getIsSelected(),
         onCheckedChange: (e) => l.toggleSelected(!!e),
@@ -352,10 +377,10 @@ function X({
     )
   ] });
 }
-function Y(l) {
+function te(l) {
   const { table: e, recordCount: t, isLoading: r } = g();
-  return /* @__PURE__ */ n(
-    R,
+  return /* @__PURE__ */ o(
+    w,
     {
       checked: e.getIsAllPageRowsSelected() || e.getIsSomePageRowsSelected() && "indeterminate",
       disabled: r || t === 0,
@@ -365,44 +390,44 @@ function Y(l) {
     }
   );
 }
-function ee() {
-  var a, o;
+function ae() {
+  var a, n;
   const { table: l, isLoading: e, props: t } = g(), r = l.getState().pagination;
-  return /* @__PURE__ */ p(I, { children: [
-    /* @__PURE__ */ n(T, { children: l.getHeaderGroups().map((d, i) => /* @__PURE__ */ n(Z, { headerGroup: d, children: d.headers.map((s, u) => {
+  return /* @__PURE__ */ m(_, { children: [
+    (((a = t.tableLayout) == null ? void 0 : a.stripped) || !((n = t.tableLayout) != null && n.rowBorder)) && /* @__PURE__ */ o(M, {}),
+    /* @__PURE__ */ o(V, { children: e && (r != null && r.pageSize) ? t.loadingMode === "skeleton" ? Array.from({ length: r.pageSize }).map((d, s) => /* @__PURE__ */ o(F, { children: l.getVisibleFlatColumns().map((i, u) => {
+      var c;
+      return /* @__PURE__ */ o(H, { column: i, children: ((c = i.columnDef.meta) == null ? void 0 : c.skeleton) || /* @__PURE__ */ o(Z, { className: "h-4 w-full" }) }, u);
+    }) }, s)) : /* @__PURE__ */ o(O, {}) : l.getRowModel().rows.length ? l.getRowModel().rows.map((d, s) => /* @__PURE__ */ m(P, { children: [
+      /* @__PURE__ */ o(E, { row: d, children: d.getVisibleCells().map((i, u) => /* @__PURE__ */ o($, { cell: i, children: k(i.column.columnDef.cell, i.getContext()) }, u)) }, s),
+      d.getIsExpanded() && /* @__PURE__ */ o(j, { row: d })
+    ] }, d.id)) : /* @__PURE__ */ o(G, {}) }),
+    /* @__PURE__ */ o(I, { children: l.getHeaderGroups().map((d, s) => /* @__PURE__ */ o(T, { headerGroup: d, children: d.headers.map((i, u) => {
       var b;
-      const { column: c } = s;
-      return /* @__PURE__ */ p(D, { header: s, children: [
-        s.isPlaceholder ? null : w(s.column.columnDef.header, s.getContext()),
-        ((b = t.tableLayout) == null ? void 0 : b.columnsResizable) && c.getCanResize() && /* @__PURE__ */ n(_, { header: s })
+      const { column: c } = i;
+      return /* @__PURE__ */ m(D, { header: i, children: [
+        i.isPlaceholder ? null : k(i.column.columnDef.header, i.getContext()),
+        ((b = t.tableLayout) == null ? void 0 : b.columnsResizable) && c.getCanResize() && /* @__PURE__ */ o(A, { header: i })
       ] }, u);
-    }) }, i)) }),
-    (((a = t.tableLayout) == null ? void 0 : a.stripped) || !((o = t.tableLayout) != null && o.rowBorder)) && /* @__PURE__ */ n(A, {}),
-    /* @__PURE__ */ n(V, { children: e && (r != null && r.pageSize) ? t.loadingMode === "skeleton" ? Array.from({ length: r.pageSize }).map((d, i) => /* @__PURE__ */ n(F, { children: l.getVisibleFlatColumns().map((s, u) => {
-      var c;
-      return /* @__PURE__ */ n(H, { column: s, children: (c = s.columnDef.meta) == null ? void 0 : c.skeleton }, u);
-    }) }, i)) : /* @__PURE__ */ n(G, {}) : l.getRowModel().rows.length ? l.getRowModel().rows.map((d, i) => /* @__PURE__ */ p(P, { children: [
-      /* @__PURE__ */ n(M, { row: d, children: d.getVisibleCells().map((s, u) => /* @__PURE__ */ n(j, { cell: s, children: w(s.column.columnDef.cell, s.getContext()) }, u)) }, i),
-      d.getIsExpanded() && /* @__PURE__ */ n($, { row: d })
-    ] }, d.id)) : /* @__PURE__ */ n(E, {}) })
+    }) }, s)) })
   ] });
 }
 export {
-  ee as Z2Table,
-  I as Z2TableBase,
+  ae as Z2Table,
+  _ as Z2TableBase,
   V as Z2TableBody,
-  M as Z2TableBodyRow,
-  j as Z2TableBodyRowCell,
-  $ as Z2TableBodyRowExpandded,
+  E as Z2TableBodyRow,
+  $ as Z2TableBodyRowCell,
+  j as Z2TableBodyRowExpandded,
   F as Z2TableBodyRowSkeleton,
   H as Z2TableBodyRowSkeletonCell,
-  E as Z2TableEmpty,
-  T as Z2TableHead,
-  Z as Z2TableHeadRow,
+  G as Z2TableEmpty,
+  I as Z2TableHead,
+  T as Z2TableHeadRow,
   D as Z2TableHeadRowCell,
-  _ as Z2TableHeadRowCellResize,
-  G as Z2TableLoader,
-  X as Z2TableRowSelect,
-  Y as Z2TableRowSelectAll,
-  A as Z2TableRowSpacer
+  A as Z2TableHeadRowCellResize,
+  O as Z2TableLoader,
+  ee as Z2TableRowSelect,
+  te as Z2TableRowSelectAll,
+  M as Z2TableRowSpacer
 };

package/dist/components/skeleton/skeleton.js

@@ -1,16 +1,16 @@
 import { jsx as o } from "react/jsx-runtime";
 import "react";
-import { cn as n } from "../../lib/utils.js";
-function i({ className: t, ...e }) {
+import { cn as r } from "../../lib/utils.js";
+function s({ className: e, ...t }) {
   return /* @__PURE__ */ o(
     "div",
     {
       "data-slot": "skeleton",
-      className: n("bg-accent animate-pulse rounded-md", t),
-      ...e
+      className: r("bg-surface-neutral-disabled animate-pulse rounded-md", e),
+      ...t
     }
   );
 }
 export {
-  i as Z2Skeleton
+  s as Z2Skeleton
 };

package/dist/components/table/table.const.d.ts

@@ -5,7 +5,7 @@ export declare const TABLE_CSS_CLASSES: {
         readonly true: "[&_td:first-child]:border-l-1 [&_th:first-child]:border-l-1 ";
         readonly false: "";
     };
-    readonly header: "bg-background-neutral-medium text-text-neutral-secondary table-fixed";
+    readonly header: "bg-background-neutral-light text-text-neutral-secondary table-fixed";
     readonly cell: {
         readonly default: "p-0 align-middle relative h-4 ";
         readonly hasBorder: {
@@ -14,13 +14,13 @@ export declare const TABLE_CSS_CLASSES: {
         };
     };
     readonly headerCell: {
-        readonly default: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider border-stroke-solid-light";
+        readonly default: "p-3 text-left text-xs font-medium tracking-wider border-stroke-solid-light";
         readonly hasBorder: {
             readonly true: " [box-shadow:inset_-1px_0_0_0_var(--color-stroke-solid-light),_inset_0_-1px_0_0_var(--color-stroke-solid-light)] border-stroke-solid-light dark:shadow-none dark:border-0";
             readonly false: "border-stroke-solid-light ";
         };
     };
-    readonly sortableHeaderCell: "p-3 text-left text-xs font-medium uppercase tracking-wider cursor-pointer transition-colors duration-200";
+    readonly sortableHeaderCell: "p-3 text-left text-xs font-medium tracking-wider cursor-pointer transition-colors duration-200";
     readonly headerCellContent: "flex items-center justify-between";
     readonly sortIcon: "ml-2 w-4 h-4 text-gray-400";
     readonly sortIconActive: "ml-2 w-4 h-4 text-gray-600";

package/dist/components/table/table.const.js

@@ -1,10 +1,10 @@
-const e = "No data available", t = {
+const t = "No data available", e = {
   table: "w-full",
   bordered: {
     true: "[&_td:first-child]:border-l-1 [&_th:first-child]:border-l-1 ",
     false: ""
   },
-  header: "bg-background-neutral-medium text-text-neutral-secondary table-fixed",
+  header: "bg-background-neutral-light text-text-neutral-secondary table-fixed",
   cell: {
     default: "p-0 align-middle relative h-4 ",
     hasBorder: {
@@ -13,13 +13,13 @@ const e = "No data available", t = {
     }
   },
   headerCell: {
-    default: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider border-stroke-solid-light",
+    default: "p-3 text-left text-xs font-medium tracking-wider border-stroke-solid-light",
     hasBorder: {
       true: " [box-shadow:inset_-1px_0_0_0_var(--color-stroke-solid-light),_inset_0_-1px_0_0_var(--color-stroke-solid-light)] border-stroke-solid-light dark:shadow-none dark:border-0",
       false: "border-stroke-solid-light "
     }
   },
-  sortableHeaderCell: "p-3 text-left text-xs font-medium uppercase tracking-wider cursor-pointer transition-colors duration-200",
+  sortableHeaderCell: "p-3 text-left text-xs font-medium tracking-wider cursor-pointer transition-colors duration-200",
   headerCellContent: "flex items-center justify-between",
   sortIcon: "ml-2 w-4 h-4 text-gray-400",
   sortIconActive: "ml-2 w-4 h-4 text-gray-600",
@@ -29,6 +29,6 @@ const e = "No data available", t = {
   loading: "px-4 py-8 text-center text-gray-500"
 };
 export {
-  e as DEFAULT_EMPTY_MESSAGE,
-  t as TABLE_CSS_CLASSES
+  t as DEFAULT_EMPTY_MESSAGE,
+  e as TABLE_CSS_CLASSES
 };