@versini/ui-table 4.0.17 → 5.0.0

package/dist/components/Table/Table.js

@@ -1,8 +1,8 @@
-import { jsx as o, jsxs as N, Fragment as ce } from "react/jsx-runtime";
-import z, { useRef as w, useLayoutEffect as q, useEffect as U, useState as ne, useMemo as K, useCallback as de, useContext as B } from "react";
+import { jsx as o, jsxs as N } from "react/jsx-runtime";
+import z, { useRef as w, useLayoutEffect as q, useEffect as W, useState as ce, useMemo as K, useCallback as ne, useContext as B } from "react";
 import l from "clsx";
 import { TableCellSortDirections as R } from "../TableConstants/TableConstants.js";
-const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
+const Y = "av-button", P = "icon", Q = "button", U = "link", de = ({
   type: e,
   size: r,
   labelRight: t,
@@ -13,13 +13,13 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
   const c = "max-h-8 py-0 px-2", d = "max-h-9 h-8 px-3", n = "max-h-12 py-2 px-4";
   switch (e) {
     case Q:
-    case P:
+    case U:
       return l({
         [c]: r === "small",
         [d]: r === "medium",
         [n]: r === "large"
       });
-    case W:
+    case P:
       return l("flex items-center", {
         "justify-center": s === "center",
         "justify-start": s === "left",
@@ -38,7 +38,7 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
         "h-12": r === "large" && i && (t || a)
       });
   }
-}, ge = ({
+}, he = ({
   type: e,
   size: r,
   labelRight: t,
@@ -47,21 +47,21 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
   const s = "text-sm font-medium", i = "text-base font-medium", c = "text-lg font-medium";
   switch (e) {
     case Q:
-    case P:
+    case U:
       return l({
-        "text-center": e === P,
+        "text-center": e === U,
         [s]: r === "small",
         [i]: r === "medium",
         [c]: r === "large"
       });
-    case W:
+    case P:
       return l({
         [s]: r === "small" && (t || a),
         [i]: r === "medium" && (t || a),
         [c]: r === "large" && (t || a)
       });
   }
-}, me = ({
+}, ge = ({
   mode: e,
   noBackground: r,
   truncate: t,
@@ -97,7 +97,7 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     return l("not-prose text-copy-lighter", {
       truncate: t
     });
-}, be = ({
+}, me = ({
   mode: e,
   noBackground: r,
   variant: t
@@ -127,13 +127,13 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     if (t === "selected")
       return "bg-action-selected-dark";
   }
-}, ue = ({
+}, be = ({
   radius: e
 }) => l({
   "rounded-full": e === "large",
   "rounded-md": e === "medium",
   "rounded-xs": e === "small"
-}), ye = ({
+}), ue = ({
   mode: e,
   disabled: r,
   variant: t
@@ -171,7 +171,7 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     });
   if (t === "selected")
     return "hover:text-copy-light-hover hover:bg-action-selected-dark-hover";
-}, ke = ({
+}, ye = ({
   mode: e,
   disabled: r,
   variant: t
@@ -209,7 +209,7 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     });
   if (t === "selected")
     return "active:text-copy-lighter-active active:bg-action-selected-dark-active";
-}, ve = ({
+}, ke = ({
   mode: e,
   noBorder: r,
   variant: t
@@ -239,14 +239,14 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     });
   if (t === "selected")
     return "border border-border-selected-dark";
-}, pe = ({
+}, ve = ({
   focusMode: e
 }) => l("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
   "focus:outline-focus-dark": e === "dark",
   "focus:outline-focus-light": e === "light",
   "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
   "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
-}), fe = ({
+}), pe = ({
   mode: e,
   raw: r,
   iconClassName: t,
@@ -273,11 +273,11 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
   } : a === "selected" && (s = {
     "text-copy-lighter": !0
   }), l(s, t);
-}, xe = ({
+}, fe = ({
   animated: e
 }) => l({
   "transition-opacity duration-300 ease-in-out": e
-}), _e = ({
+}), xe = ({
   type: e,
   className: r,
   raw: t,
@@ -297,15 +297,15 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
   animated: T
 }) => (m || (m = "primary"), t ? l(Y, r) : l(
   Y,
-  me({
+  ge({
     mode: a,
     variant: m,
     noBackground: h,
     truncate: p
   }),
-  be({ mode: a, noBackground: h, variant: m }),
-  ue({ radius: M }),
-  he({
+  me({ mode: a, noBackground: h, variant: m }),
+  be({ radius: M }),
+  de({
     type: e,
     size: d,
     labelRight: g,
@@ -313,11 +313,11 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     align: L,
     animated: T
   }),
-  ge({ type: e, size: d, labelRight: g, labelLeft: b }),
-  ve({ mode: a, variant: m, noBorder: n }),
-  pe({ focusMode: s }),
+  he({ type: e, size: d, labelRight: g, labelLeft: b }),
+  ke({ mode: a, variant: m, noBorder: n }),
+  ve({ focusMode: s }),
+  ue({ mode: a, variant: m, disabled: i }),
   ye({ mode: a, variant: m, disabled: i }),
-  ke({ mode: a, variant: m, disabled: i }),
   {
     "w-full": c,
     "disabled:cursor-not-allowed disabled:opacity-50": i
@@ -326,7 +326,7 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     "transition-[width] duration-300 ease-in": T
   }),
   r
-)), we = (e, r, t) => {
+)), _e = (e, r, t) => {
   !r && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof e?.currentTarget?.focus == "function" && e.currentTarget.focus(), typeof t == "function" && t(e);
 }, X = z.forwardRef((e, r) => {
   const { onClick: t, noInternalClick: a = !1, ...s } = e;
@@ -335,20 +335,20 @@ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
     {
       ref: r,
       onClick: (i) => {
-        we(i, a, t);
+        _e(i, a, t);
       },
       ...s
     }
   );
 });
 X.displayName = "BaseButton";
-function Ne() {
+function we() {
   const e = w(!1);
-  return U(() => (e.current = !0, () => {
+  return W(() => (e.current = !0, () => {
     e.current = !1;
-  }), []), de(() => e.current, []);
+  }), []), ne(() => e.current, []);
 }
-function Ce(e) {
+function Ne(e) {
   return K(() => e.every((r) => r == null) ? () => {
   } : (r) => {
     e.forEach((t) => {
@@ -356,7 +356,7 @@ function Ce(e) {
     });
   }, [...e]);
 }
-const Be = {
+const Ce = {
   x: 0,
   y: 0,
   width: 0,
@@ -366,14 +366,14 @@ const Be = {
   bottom: 0,
   right: 0
 };
-function A(e) {
-  const r = Ne(), t = w(0), a = w(null), [s, i] = ne(Be), c = K(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
+function j(e) {
+  const r = we(), t = w(0), a = w(null), [s, i] = ce(Ce), c = K(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
     const n = d[0];
     n && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
       a.current && r() && i(n.contentRect);
     }));
   }), [r]);
-  return U(() => (a.current && c?.observe(a.current, e), () => {
+  return W(() => (a.current && c?.observe(a.current, e), () => {
     c?.disconnect(), t.current && cancelAnimationFrame(t.current);
   }), [c, e]), [a, s];
 }
@@ -384,14 +384,14 @@ const E = {
   // w-8
   large: 48
   // w-12
-}, Te = {
+}, Be = {
   small: 16,
   // px-2 x 2
   medium: 24,
   // px-3 x 2
   large: 32
   // px-4 x 2
-}, Ie = 2, Re = 300, Z = z.forwardRef(
+}, Te = 2, Ie = 300, Z = z.forwardRef(
   ({
     children: e,
     disabled: r = !1,
@@ -415,8 +415,8 @@ const E = {
     animated: k = !1,
     ...re
   }, ae) => {
-    const se = _e({
-      type: W,
+    const se = xe({
+      type: P,
       mode: t,
       focusMode: a,
       fullWidth: s,
@@ -432,15 +432,15 @@ const E = {
       radius: T,
       variant: D,
       animated: k
-    }), le = fe({ mode: t, raw: d, iconClassName: te, variant: D }), F = xe({ animated: k }), ie = "flex items-center justify-center relative w-full h-full overflow-hidden", [u, V] = A(), [y, O] = A(), [I, G] = A(), j = w(0), v = w(null), f = w(null), oe = Ce([ae, v]);
+    }), le = pe({ mode: t, raw: d, iconClassName: te, variant: D }), F = fe({ animated: k }), ie = "flex items-center justify-center relative w-full h-full overflow-hidden", [u, V] = j(), [y, O] = j(), [I, G] = j(), A = w(0), v = w(null), f = w(null), oe = Ne([ae, v]);
     return q(() => {
-      I && I.current && k && (j.current = G.width + Te[h] + (n ? 0 : Ie), v.current && !v.current.style.width && (v.current.style.width = `${E[h]}px`));
+      I && I.current && k && (A.current = G.width + Be[h] + (n ? 0 : Te), v.current && !v.current.style.width && (v.current.style.width = `${E[h]}px`));
     }, [G, I, h, n, k]), q(() => {
       if (v && v.current && k) {
         let x = E[h];
-        m && u && V.width > 0 ? x = V.width + j.current : p && y && O.width > 0 && (x = O.width + j.current), f.current && clearTimeout(f.current), x !== parseInt(v.current.style.width || "0", 10) && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"), v.current.style.width = `${x}px`, x > E[h] && (f.current = setTimeout(() => {
+        m && u && V.width > 0 ? x = V.width + A.current : p && y && O.width > 0 && (x = O.width + A.current), f.current && clearTimeout(f.current), x !== parseInt(v.current.style.width || "0", 10) && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"), v.current.style.width = `${x}px`, x > E[h] && (f.current = setTimeout(() => {
           u.current && m && (u.current.style.opacity = "1"), y.current && p && (y.current.style.opacity = "1"), f.current = null;
-        }, Re * 0.8))), x === E[h] && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"));
+        }, Ie * 0.8))), x === E[h] && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"));
       }
     }, [
       V,
@@ -451,7 +451,7 @@ const E = {
       y,
       h,
       k
-    ]), U(() => () => {
+    ]), W(() => () => {
       f.current && clearTimeout(f.current);
     }, []), /* @__PURE__ */ o(
       X,
@@ -505,13 +505,13 @@ const E = {
 );
 Z.displayName = "ButtonIcon";
 /*!
-  @versini/ui-button v7.1.5
+  @versini/ui-button v8.0.0
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
-    version: "7.1.5",
-    buildTime: "08/30/2025 02:56 PM EDT",
+    version: "8.0.0",
+    buildTime: "09/01/2025 03:17 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
@@ -570,7 +570,7 @@ const $ = ({
   ...n
 }) => {
   const g = l(i, a);
-  return /* @__PURE__ */ o(ce, { children: /* @__PURE__ */ N(
+  return /* @__PURE__ */ N(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -586,22 +586,22 @@ const $ = ({
         e
       ]
     }
-  ) });
+  );
 };
 /*!
-  @versini/ui-svgicon v4.2.0
+  @versini/ui-svgicon v4.2.1
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_SVGICON__ || (window.__VERSINI_UI_SVGICON__ = {
-    version: "4.2.0",
-    buildTime: "05/17/2025 06:18 PM EDT",
+    version: "4.2.1",
+    buildTime: "08/27/2025 08:27 AM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
 } catch {
 }
-const Ee = ({
+const Re = ({
   className: e,
   viewBox: r,
   title: t,
@@ -627,7 +627,7 @@ const Ee = ({
       /* @__PURE__ */ o("path", { d: "M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l96-96c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 370.7V64c0-17.7-14.3-32-32-32s-32 14.3-32 32v306.7l-41.4-41.3c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l96 96z" })
     ]
   }
-), ze = ({
+), Ee = ({
   className: e,
   viewBox: r,
   title: t,
@@ -653,7 +653,7 @@ const Ee = ({
       /* @__PURE__ */ o("path", { d: "M128 480c9 0 17.5-3.8 23.6-10.4l88-96c11.9-13 11.1-33.3-2-45.2s-33.3-11.1-45.2 2L160 365.7V64c0-17.7-14.3-32-32-32S96 46.3 96 64v301.7l-32.4-35.3c-11.9-13-32.2-13.9-45.2-2s-13.9 32.2-2 45.2l88 96c6.1 6.6 14.6 10.4 23.6 10.4" })
     ]
   }
-), Se = ({
+), ze = ({
   className: e,
   viewBox: r,
   title: t,
@@ -681,13 +681,13 @@ const Ee = ({
   }
 );
 /*!
-  @versini/ui-icons v4.10.0
+  @versini/ui-icons v4.11.0
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
-    version: "4.10.0",
-    buildTime: "05/17/2025 06:18 PM EDT",
+    version: "4.11.0",
+    buildTime: "08/27/2025 08:28 AM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
@@ -699,7 +699,7 @@ const C = z.createContext({
   stickyHeader: !1,
   stickyFooter: !1,
   compact: !1
-}), S = "thead", H = "tfoot", _ = "tbody", Le = ({
+}), S = "thead", H = "tfoot", _ = "tbody", Se = ({
   mode: e,
   className: r,
   wrapperClassName: t,
@@ -734,7 +734,7 @@ const C = z.createContext({
     "text-copy-light dark:text-copy-dark": e === "system",
     "text-copy-dark dark:text-copy-light": e === "alt-system"
   })
-}), Me = ({
+}), Le = ({
   className: e,
   stickyHeader: r,
   mode: t
@@ -747,7 +747,7 @@ const C = z.createContext({
     "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "alt-system"
   },
   e
-), Ve = ({
+), Me = ({
   className: e,
   stickyFooter: r,
   mode: t
@@ -760,7 +760,7 @@ const C = z.createContext({
     "shadow-[rgb(65_65_65_/30%)_-0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "alt-system"
   },
   e
-), Oe = ({
+), Ve = ({
   mode: e,
   className: r,
   cellWrapper: t
@@ -785,7 +785,7 @@ const C = z.createContext({
     "odd:bg-table-light-odd even:bg-table-light-even dark:odd:bg-table-dark-odd dark:even:bg-table-dark-even": t === _ && e === "alt-system"
   },
   r
-), je = ({
+), Oe = ({
   cellWrapper: e,
   className: r,
   compact: t,
@@ -811,7 +811,7 @@ const C = z.createContext({
   )
 }), Ae = ({
   buttonClassName: e
-}) => l("rounded-none text-sm", e), De = ({
+}) => l("rounded-none text-sm", e), He = ({
   children: e,
   mode: r = "system",
   caption: t,
@@ -824,7 +824,7 @@ const C = z.createContext({
   stickyFooter: g,
   ...b
 }) => {
-  const h = Le({
+  const h = Se({
     mode: r,
     className: i,
     wrapperClassName: c,
@@ -850,54 +850,54 @@ const C = z.createContext({
       )
     }
   );
-}, Fe = ({
+}, De = ({
   children: e,
   className: r,
   ...t
 }) => {
   const a = B(C);
   a.cellWrapper = S;
-  const s = Me({
+  const s = Le({
     className: r,
     mode: a.mode,
     stickyHeader: a.stickyHeader
   });
   return /* @__PURE__ */ o("thead", { className: s, ...t, children: e });
-}, Ge = ({
+}, Fe = ({
   children: e,
   className: r,
   ...t
 }) => {
   const a = B(C);
   a.cellWrapper = H;
-  const s = Ve({
+  const s = Me({
     className: r,
     mode: a.mode,
     stickyFooter: a.stickyFooter
   });
   return /* @__PURE__ */ o("tfoot", { className: s, ...t, children: e });
-}, qe = ({ children: e, ...r }) => {
+}, Ge = ({ children: e, ...r }) => {
   const t = B(C);
   return t.cellWrapper = _, /* @__PURE__ */ o("tbody", { ...r, children: e });
-}, Ye = ({
+}, qe = ({
   children: e,
   className: r,
   ...t
 }) => {
-  const a = B(C), s = Oe({
+  const a = B(C), s = Ve({
     mode: a.mode,
     cellWrapper: a.cellWrapper,
     className: r
   });
   return /* @__PURE__ */ o("tr", { className: s, ...t, children: e });
-}, Pe = ({
+}, je = ({
   children: e,
   component: r,
   className: t,
   align: a,
   ...s
 }) => {
-  const i = B(C), c = r || (i.cellWrapper === S ? "th" : "td"), { mainClasses: d, alignClasses: n } = je({
+  const i = B(C), c = r || (i.cellWrapper === S ? "th" : "td"), { mainClasses: d, alignClasses: n } = Oe({
     cellWrapper: i.cellWrapper,
     className: t,
     mode: i.mode,
@@ -905,7 +905,7 @@ const C = z.createContext({
     align: a
   });
   return a ? /* @__PURE__ */ o(c, { className: d, ...s, children: /* @__PURE__ */ o("div", { className: n, children: e }) }) : /* @__PURE__ */ o(c, { className: d, ...s, children: e });
-}, Je = ({
+}, Ye = ({
   align: e,
   children: r,
   buttonClassName: t,
@@ -921,7 +921,7 @@ const C = z.createContext({
 }) => {
   const m = Ae({ buttonClassName: t });
   return /* @__PURE__ */ o(
-    Pe,
+    je,
     {
       component: s,
       className: a,
@@ -940,18 +940,18 @@ const C = z.createContext({
           mode: c,
           fullWidth: !0,
           labelRight: r,
-          children: n === R.ASC && g === b ? /* @__PURE__ */ o(Se, { className: "size-4", monotone: !0 }) : n === R.DESC && g === b ? /* @__PURE__ */ o(ze, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ o(Ee, { className: "size-4", monotone: !0 })
+          children: n === R.ASC && g === b ? /* @__PURE__ */ o(ze, { className: "size-4", monotone: !0 }) : n === R.DESC && g === b ? /* @__PURE__ */ o(Ee, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ o(Re, { className: "size-4", monotone: !0 })
         }
       )
     }
   );
 };
 export {
-  De as Table,
-  qe as TableBody,
-  Pe as TableCell,
-  Je as TableCellSort,
-  Ge as TableFooter,
-  Fe as TableHead,
-  Ye as TableRow
+  He as Table,
+  Ge as TableBody,
+  je as TableCell,
+  Ye as TableCellSort,
+  Fe as TableFooter,
+  De as TableHead,
+  qe as TableRow
 };

package/dist/index.js

@@ -1,13 +1,13 @@
 import { Table as r, TableBody as i, TableCell as T, TableCellSort as a, TableFooter as t, TableHead as _, TableRow as b } from "./components/Table/Table.js";
 import { TableCellSortDirections as I } from "./components/TableConstants/TableConstants.js";
 /*!
-  @versini/ui-table v4.0.17
+  @versini/ui-table v5.0.0
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_TABLE__ || (window.__VERSINI_UI_TABLE__ = {
-    version: "4.0.17",
-    buildTime: "08/30/2025 02:58 PM EDT",
+    version: "5.0.0",
+    buildTime: "09/01/2025 03:18 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-table",
-	"version": "4.0.17",
+	"version": "5.0.0",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -51,22 +51,22 @@
 		"test": "vitest run"
 	},
 	"peerDependencies": {
-		"react": "^18.3.1 || ^19.0.0",
-		"react-dom": "^18.3.1 || ^19.0.0"
+		"react": "^19.0.0",
+		"react-dom": "^19.0.0"
 	},
 	"devDependencies": {
 		"@testing-library/jest-dom": "6.8.0",
-		"@versini/ui-types": "../ui-types"
+		"@versini/ui-types": "6.0.0"
 	},
 	"dependencies": {
 		"@tailwindcss/typography": "0.5.16",
-		"@versini/ui-button": "../ui-button",
-		"@versini/ui-icons": "4.10.0",
+		"@versini/ui-button": "8.0.0",
+		"@versini/ui-icons": "4.11.0",
 		"clsx": "2.1.1",
 		"tailwindcss": "4.1.12"
 	},
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "9309d65ae499da20d8170cdaa583bedbf7896ce9"
+	"gitHead": "70a47e9e30172dbb7b36306773fe9511e437fba6"
 }