@stokelp/ui 1.40.0 → 1.40.2

package/dist/ui.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as C, jsxs as d, Fragment as s1 } from "react/jsx-runtime";
-import { Accordion as K, ark as M, Checkbox as W, Dialog as P, Portal as C1, Tooltip as O, Switch as q, Tabs as G, Select as s, DatePicker as p, RadioGroup as H, Popover as D, switchAnatomy as T5, dialogAnatomy as P5, accordionAnatomy as k5, checkboxAnatomy as I5, tabsAnatomy as z5, selectAnatomy as U1, datePickerAnatomy as B5, radioGroupAnatomy as Y1, tooltipAnatomy as F5, popoverAnatomy as D5 } from "@ark-ui/react";
-import { styled as o, splitCssProps as U, Circle as A5 } from "@stokelp/styled-system/jsx";
+import { Accordion as C1, ark as M, Checkbox as W, Dialog as P, Portal as O, Tooltip as G, Switch as J, Tabs as U, Select as s, DatePicker as p, RadioGroup as H, Popover as D, switchAnatomy as T5, dialogAnatomy as P5, accordionAnatomy as k5, checkboxAnatomy as I5, tabsAnatomy as z5, selectAnatomy as U1, datePickerAnatomy as B5, radioGroupAnatomy as Y1, tooltipAnatomy as F5, popoverAnatomy as D5 } from "@ark-ui/react";
+import { styled as o, splitCssProps as Y, Circle as A5 } from "@stokelp/styled-system/jsx";
 import { accordion as E5, button as N5, checkbox as H1, drawer as W5, formControl as j5, tooltip as $5, formLabel as Z1, formHelperText as O5, heading as G5, switchRecipe as w1, text as U5, textarea as Y5, tabs as X5, select as q5, input as J5, inputAddon as Q5, inputGroup as K5, datepicker as C2, tag as V1, radioButtonGroup as e2, radioGroup as l2, chip as r2, actionCard as o2, iconButton as t2, alert as i2, tableContainer as n2, tableGroupTitle as L2, tableEmptyRow as d2, table as a2, breadcrumb as c2, popover as u2, pagination as M2, illustration as p2, buttonFilter as s2, statusTagSelect as Z2, productCardCatalog as h2 } from "@stokelp/styled-system/recipes";
 import { createContext as X1, forwardRef as f, useContext as q1, createElement as J1, useMemo as L1, useReducer as f2, useEffect as v2, useRef as g1, useLayoutEffect as R1, Children as g2, cloneElement as h1, useState as Q1 } from "react";
 import { cx as j, css as e1, sva as R2 } from "@stokelp/styled-system/css";
@@ -41,12 +41,12 @@ const _1 = (...e) => e.filter(Boolean).join(" "), R = (e, l) => {
       ) });
     })
   };
-}, { withProvider: V2, withContext: d1 } = R(E5), H9 = V2(o(K.Root), "root"), w9 = d1(o(K.Item), "item"), V9 = d1(o(K.ItemContent), "itemContent"), _9 = d1(o(K.ItemIndicator), "itemIndicator", {
+}, { withProvider: V2, withContext: d1 } = R(E5), H9 = V2(o(C1.Root), "root"), w9 = d1(o(C1.Item), "item"), V9 = d1(o(C1.ItemContent), "itemContent"), _9 = d1(o(C1.ItemIndicator), "itemIndicator", {
   defaultProps: {
     children: /* @__PURE__ */ C("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ C("path", { d: "M4.94 6.03L8 9.08333L11.06 6.03L12 6.97L8 10.97L4 6.97L4.94 6.03Z", fill: "currentColor" }) })
   }
-}), S9 = d1(o(K.ItemTrigger), "itemTrigger"), f1 = o(M.button, N5), _2 = f((e, l) => {
-  const [r, t] = H1.splitVariantProps(e), [i, a] = U(t), { children: n, className: L, ...u } = a, c = H1(r);
+}), S9 = d1(o(C1.ItemTrigger), "itemTrigger"), f1 = o(M.button, N5), _2 = f((e, l) => {
+  const [r, t] = H1.splitVariantProps(e), [i, a] = Y(t), { children: n, className: L, ...u } = a, c = H1(r);
   return /* @__PURE__ */ d(W.Root, { ref: l, className: j(c.root, e1(i), L), ...u, children: [
     /* @__PURE__ */ d(W.Control, { className: c.control, children: [
       /* @__PURE__ */ C(W.Indicator, { children: /* @__PURE__ */ C(S2, {}) }),
@@ -88,7 +88,7 @@ const S2 = () => /* @__PURE__ */ d("svg", { viewBox: "0 0 12 13", fill: "none",
 );
 K1.displayName = "DrawerHeader";
 const I9 = k(K1, "header"), z9 = k(o(P.Title), "title"), B9 = k(o(P.Trigger), "trigger"), I2 = k(o(P.Positioner), "positioner"), z2 = k(o(P.Backdrop), "backdrop"), C5 = f(
-  ({ children: e, ...l }, r) => /* @__PURE__ */ d(C1, { children: [
+  ({ children: e, ...l }, r) => /* @__PURE__ */ d(O, { children: [
     /* @__PURE__ */ C(z2, {}),
     /* @__PURE__ */ C(I2, { children: /* @__PURE__ */ C(P.Content, { ref: r, ...l, children: e }) })
   ] })
@@ -104,7 +104,7 @@ const F9 = k(o(C5), "content"), D9 = P.Context, B2 = o("div", j5, {
     ...l ? { "aria-required": !0 } : {}
   };
   return /* @__PURE__ */ C(B2, { ...t, ...r });
-}, { withProvider: F2, withContext: l1 } = R($5), D2 = F2(o(O.Root), void 0, {
+}, { withProvider: F2, withContext: l1 } = R($5), D2 = F2(o(G.Root), void 0, {
   defaultProps: {
     closeDelay: 50,
     closeOnPointerDown: !1,
@@ -113,17 +113,17 @@ const F9 = k(o(C5), "content"), D9 = P.Context, B2 = o("div", j5, {
     openDelay: 200,
     unmountOnExit: !0
   }
-}), A2 = l1(o(O.Arrow), "arrow"), E2 = l1(o(O.ArrowTip), "arrowTip"), N2 = l1(o(O.Content), "content"), W2 = l1(o(O.Positioner), "positioner"), j2 = l1(o(O.Trigger), "trigger"), $2 = ({ label: e, children: l, withArrow: r = !0, ...t }) => {
-  const [i, a] = U(t);
+}), A2 = l1(o(G.Arrow), "arrow"), E2 = l1(o(G.ArrowTip), "arrowTip"), N2 = l1(o(G.Content), "content"), W2 = l1(o(G.Positioner), "positioner"), j2 = l1(o(G.Trigger), "trigger"), $2 = ({ label: e, children: l, withArrow: r = !0, ...t }) => {
+  const [i, a] = Y(t);
   return /* @__PURE__ */ d(D2, { ...a, children: [
     /* @__PURE__ */ C(j2, { asChild: !0, children: l }),
-    /* @__PURE__ */ C(W2, { children: /* @__PURE__ */ d(N2, { ...i, children: [
+    /* @__PURE__ */ C(O, { children: /* @__PURE__ */ C(W2, { children: /* @__PURE__ */ d(N2, { ...i, children: [
       r ? /* @__PURE__ */ C(A2, { children: /* @__PURE__ */ C(E2, {}) }) : null,
       e
-    ] }) })
+    ] }) }) })
   ] });
 }, O2 = o("label", Z1), E9 = (e) => {
-  const [l, r] = Z1.splitVariantProps(e), [t, i] = U(r), { children: a, className: n, addon: L, tooltipInformation: u, ...c } = i, h = Z1(l);
+  const [l, r] = Z1.splitVariantProps(e), [t, i] = Y(r), { children: a, className: n, addon: L, tooltipInformation: u, ...c } = i, h = Z1(l);
   return /* @__PURE__ */ d(O2, { className: j(h.root, e1(t), n), ...c, children: [
     a,
     L ? /* @__PURE__ */ C(o.span, { className: h.addon, children: L }) : null,
@@ -152,28 +152,28 @@ const F9 = k(o(C5), "content"), D9 = P.Context, B2 = o("div", j5, {
   const { as: l = "h2", ...r } = e, t = L1(() => o(l, G5), [l]);
   return /* @__PURE__ */ C(t, { size: l, ...r });
 }, G2 = f((e, l) => {
-  const [r, t] = w1.splitVariantProps(e), [i, a] = U(t), { children: n, className: L, ...u } = a, c = w1(r);
-  return /* @__PURE__ */ d(q.Root, { ref: l, className: j(c.root, e1(i), L), ...u, children: [
-    /* @__PURE__ */ C(q.Control, { className: c.control, children: /* @__PURE__ */ C(q.Thumb, { className: c.thumb }) }),
-    n ? /* @__PURE__ */ C(q.Label, { className: c.label, children: n }) : null,
-    /* @__PURE__ */ C(q.HiddenInput, {})
+  const [r, t] = w1.splitVariantProps(e), [i, a] = Y(t), { children: n, className: L, ...u } = a, c = w1(r);
+  return /* @__PURE__ */ d(J.Root, { ref: l, className: j(c.root, e1(i), L), ...u, children: [
+    /* @__PURE__ */ C(J.Control, { className: c.control, children: /* @__PURE__ */ C(J.Thumb, { className: c.thumb }) }),
+    n ? /* @__PURE__ */ C(J.Label, { className: c.label, children: n }) : null,
+    /* @__PURE__ */ C(J.HiddenInput, {})
   ] });
 });
 G2.displayName = "Switch";
 const U2 = (e) => {
   const { as: l = "p", ...r } = e, t = L1(() => o(l, U5), [l]);
   return /* @__PURE__ */ C(t, { ...r });
-}, j9 = o(M.textarea, Y5), { withProvider: Y2, withContext: a1 } = R(X5), $9 = Y2(o(G.Root), "root", {
+}, j9 = o(M.textarea, Y5), { withProvider: Y2, withContext: a1 } = R(X5), $9 = Y2(o(U.Root), "root", {
   defaultProps: {
     lazyMount: !0
   }
-}), O9 = a1(o(G.Content), "content"), G9 = a1(o(G.Trigger), "trigger"), X2 = a1(o(G.Indicator), "indicator"), e5 = f(
-  ({ children: e, ...l }, r) => /* @__PURE__ */ d(G.List, { ref: r, ...l, children: [
+}), O9 = a1(o(U.Content), "content"), G9 = a1(o(U.Trigger), "trigger"), X2 = a1(o(U.Indicator), "indicator"), e5 = f(
+  ({ children: e, ...l }, r) => /* @__PURE__ */ d(U.List, { ref: r, ...l, children: [
     e,
     /* @__PURE__ */ C(X2, {})
   ] })
 );
-e5.displayName = G.List.displayName;
+e5.displayName = U.List.displayName;
 const U9 = a1(o(e5), "list"), l5 = ({ children: e, when: l, wrapper: r }) => l === !0 ? r(e) : e, { withProvider: q2, withContext: V } = R(q5), J2 = q2(o(s.Root), "root", {
   defaultProps: {
     loopFocus: !0
@@ -214,7 +214,7 @@ const U9 = a1(o(e5), "list"), l5 = ({ children: e, when: l, wrapper: r }) => l =
           }
         ) }) }) })
       ] }),
-      /* @__PURE__ */ C(l5, { when: t, wrapper: (n) => /* @__PURE__ */ C(C1, { children: n }), children: /* @__PURE__ */ C(t4, { children: /* @__PURE__ */ C(K2, { children: e.length === 0 ? /* @__PURE__ */ C(U2, { px: "space-8", textAlign: "center", children: r ?? "Aucun résultat" }) : e.map((n) => /* @__PURE__ */ d(l4, { item: n, children: [
+      /* @__PURE__ */ C(l5, { when: t, wrapper: (n) => /* @__PURE__ */ C(O, { children: n }), children: /* @__PURE__ */ C(t4, { children: /* @__PURE__ */ C(K2, { children: e.length === 0 ? /* @__PURE__ */ C(U2, { px: "space-8", textAlign: "center", children: r ?? "Aucun résultat" }) : e.map((n) => /* @__PURE__ */ d(l4, { item: n, children: [
         /* @__PURE__ */ C(o4, { truncate: !0, children: n.label }),
         a.multiple ? /* @__PURE__ */ C(r4, { children: "✓" }) : null
       ] }, n.value)) }) }) }),
@@ -300,7 +300,7 @@ const U9 = a1(o(e5), "list"), l5 = ({ children: e, when: l, wrapper: r }) => l =
         ] })
       ] }) : null
     ] }) }),
-    /* @__PURE__ */ C(C1, { children: /* @__PURE__ */ C(p4, { className: l, children: /* @__PURE__ */ C(a4, { children: /* @__PURE__ */ C(b4, { view: "day", children: /* @__PURE__ */ C(p.Context, { children: (n) => /* @__PURE__ */ d(s1, { children: [
+    /* @__PURE__ */ C(O, { children: /* @__PURE__ */ C(p4, { className: l, children: /* @__PURE__ */ C(a4, { children: /* @__PURE__ */ C(b4, { view: "day", children: /* @__PURE__ */ C(p.Context, { children: (n) => /* @__PURE__ */ d(s1, { children: [
       /* @__PURE__ */ d(m4, { children: [
         /* @__PURE__ */ C(s4, { asChild: !0, children: /* @__PURE__ */ C(f1, { p: "space-8", variant: "secondary", size: "sm", children: /* @__PURE__ */ C(x4, {}) }) }),
         /* @__PURE__ */ C(u4, {}),
@@ -314,7 +314,7 @@ const U9 = a1(o(e5), "list"), l5 = ({ children: e, when: l, wrapper: r }) => l =
     ] }) }) }) }) }) })
   ] });
 }, J9 = f((e, l) => {
-  const [r, t] = V1.splitVariantProps(e), [i, a] = U(t), { children: n, className: L, ...u } = a, c = V1(r);
+  const [r, t] = V1.splitVariantProps(e), [i, a] = Y(t), { children: n, className: L, ...u } = a, c = V1(r);
   return /* @__PURE__ */ d(M.div, { ref: l, className: j(c.root, e1(i), L), ...u, children: [
     n,
     /* @__PURE__ */ C(A5, { className: j(c.badge) })
@@ -571,7 +571,7 @@ const { withProvider: l3, withContext: x1 } = R(c2), r3 = l3(o("nav"), "root"),
     portalled: !0
   }
 }), R8 = M1(o(D.CloseTrigger), "closeTrigger"), m8 = M1(o(D.Trigger), "trigger"), n3 = M1(o(D.Positioner), "positioner"), o5 = f(
-  ({ children: e, ...l }, r) => /* @__PURE__ */ C(C1, { children: /* @__PURE__ */ C(n3, { children: /* @__PURE__ */ C(D.Content, { ref: r, ...l, children: e }) }) })
+  ({ children: e, ...l }, r) => /* @__PURE__ */ C(O, { children: /* @__PURE__ */ C(n3, { children: /* @__PURE__ */ C(D.Content, { ref: r, ...l, children: e }) }) })
 );
 o5.displayName = D.Content.displayName;
 const b8 = M1(o(o5), "content"), y8 = D.Context;
@@ -591,7 +591,7 @@ function z(e, l) {
   const r = l - e + 1;
   return Array.from({ length: r }, (t, i) => i + e);
 }
-const J = Symbol("dots"), d3 = ({
+const Q = Symbol("dots"), d3 = ({
   total: e,
   siblings: l = 1,
   boundaries: r = 1,
@@ -611,20 +611,20 @@ const J = Symbol("dots"), d3 = ({
     range: L1(() => {
       if (l * 2 + 3 + r * 2 >= n)
         return z(1, n);
-      const N = Math.max(L - l, r), T = Math.min(L + l, n - r), F = N > r + 2, Y = T < n - (r + 1);
-      if (!F && Y) {
-        const X = l * 2 + r + 2;
-        return [...z(1, X), J, ...z(n - (r - 1), n)];
+      const N = Math.max(L - l, r), T = Math.min(L + l, n - r), F = N > r + 2, X = T < n - (r + 1);
+      if (!F && X) {
+        const q = l * 2 + r + 2;
+        return [...z(1, q), Q, ...z(n - (r - 1), n)];
       }
-      if (F && !Y) {
-        const X = r + 1 + 2 * l;
-        return [...z(1, r), J, ...z(n - X, n)];
+      if (F && !X) {
+        const q = r + 1 + 2 * l;
+        return [...z(1, r), Q, ...z(n - q, n)];
       }
       return [
         ...z(1, r),
-        J,
+        Q,
         ...z(N, T),
-        J,
+        Q,
         ...z(n - r + 1, n)
       ];
     }, [n, l, r, L]),
@@ -669,7 +669,7 @@ const J = Symbol("dots"), d3 = ({
         children: /* @__PURE__ */ C("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ C("path", { d: "M10.47 11.06L7.4167 8L10.47 4.94L9.53003 4L5.53003 8L9.53003 12L10.47 11.06Z", fill: "currentColor" }) })
       }
     ),
-    h.map((T, F) => T === J ? /* @__PURE__ */ J1(M3, { ...i ? { "data-disabled": !0 } : {}, key: F }, "...") : /* @__PURE__ */ C(
+    h.map((T, F) => T === Q ? /* @__PURE__ */ J1(M3, { ...i ? { "data-disabled": !0 } : {}, key: F }, "...") : /* @__PURE__ */ C(
       u3,
       {
         disabled: i,
@@ -9629,8 +9629,8 @@ const J = Symbol("dots"), d3 = ({
   ids: N,
   immediate: T,
   invalid: F,
-  isItemDisabled: Y,
-  itemToString: X,
+  isItemDisabled: X,
+  itemToString: q,
   itemToValue: c5,
   loopFocus: u5,
   name: M5,
@@ -9678,8 +9678,8 @@ const J = Symbol("dots"), d3 = ({
       ids: N,
       immediate: T,
       invalid: F,
-      isItemDisabled: Y,
-      itemToString: X,
+      isItemDisabled: X,
+      itemToString: q,
       itemToValue: c5,
       loopFocus: u5,
       name: M5,
@@ -9706,7 +9706,7 @@ const J = Symbol("dots"), d3 = ({
             }
           ) }) })
         ] }),
-        /* @__PURE__ */ C(l5, { when: r, wrapper: (m) => /* @__PURE__ */ C(C1, { children: m }), children: /* @__PURE__ */ C(S3, { children: /* @__PURE__ */ C(H3, { children: e.map((m) => /* @__PURE__ */ C(V3, { item: m, children: /* @__PURE__ */ C(_3, { truncate: !0, children: m.label }) }, m.value)) }) }) }),
+        /* @__PURE__ */ C(l5, { when: r, wrapper: (m) => /* @__PURE__ */ C(O, { children: m }), children: /* @__PURE__ */ C(S3, { children: /* @__PURE__ */ C(H3, { children: e.map((m) => /* @__PURE__ */ C(V3, { item: m, children: /* @__PURE__ */ C(_3, { truncate: !0, children: m.label }) }, m.value)) }) }) }),
         /* @__PURE__ */ C(s.HiddenSelect, {})
       ]
     }
@@ -9776,7 +9776,7 @@ const J = Symbol("dots"), d3 = ({
     size: "md"
   }
 }), k3 = f((e, l) => {
-  const [r, t] = E1.splitVariantProps(e), [i, a] = U(t), { className: n, unit: L, price: u, ...c } = a, h = E1(r), y = !!L;
+  const [r, t] = E1.splitVariantProps(e), [i, a] = Y(t), { className: n, unit: L, price: u, ...c } = a, h = E1(r), y = !!L;
   return /* @__PURE__ */ d("span", { ref: l, className: j("price-tag", h.root, e1(i), n), ...c, children: [
     /* @__PURE__ */ C("span", { className: h.price, children: u }),
     y ? /* @__PURE__ */ d("span", { className: h.unit, children: [
@@ -11786,12 +11786,12 @@ function h6(e) {
 function f6(e) {
   return Array.isArray(e) ? [] : {};
 }
-function Q(e, l) {
+function K(e, l) {
   return l.clone !== !1 && l.isMergeableObject(e) ? $(f6(e), e, l) : e;
 }
 function v6(e, l, r) {
   return e.concat(l).map(function(t) {
-    return Q(t, r);
+    return K(t, r);
   });
 }
 function g6(e, l) {
@@ -11821,15 +11821,15 @@ function m6(e, l) {
 function b6(e, l, r) {
   var t = {};
   return r.isMergeableObject(e) && W1(e).forEach(function(i) {
-    t[i] = Q(e[i], r);
+    t[i] = K(e[i], r);
   }), W1(l).forEach(function(i) {
-    m6(e, i) || (L5(e, i) && r.isMergeableObject(l[i]) ? t[i] = g6(i, r)(e[i], l[i], r) : t[i] = Q(l[i], r));
+    m6(e, i) || (L5(e, i) && r.isMergeableObject(l[i]) ? t[i] = g6(i, r)(e[i], l[i], r) : t[i] = K(l[i], r));
   }), t;
 }
 function $(e, l, r) {
-  r = r || {}, r.arrayMerge = r.arrayMerge || v6, r.isMergeableObject = r.isMergeableObject || u6, r.cloneUnlessOtherwiseSpecified = Q;
+  r = r || {}, r.arrayMerge = r.arrayMerge || v6, r.isMergeableObject = r.isMergeableObject || u6, r.cloneUnlessOtherwiseSpecified = K;
   var t = Array.isArray(l), i = Array.isArray(e), a = t === i;
-  return a ? t ? r.arrayMerge(e, l, r) : b6(e, l, r) : Q(l, r);
+  return a ? t ? r.arrayMerge(e, l, r) : b6(e, l, r) : K(l, r);
 }
 $.all = function(l, r) {
   if (!Array.isArray(l))
@@ -12016,7 +12016,10 @@ const H6 = /* @__PURE__ */ c6(x6), w6 = H6(
           pr: "space-16"
         },
         pr: "space-16",
-        py: "space-16"
+        py: "space-16",
+        "&:has(.table__sortIndicatorRoot)": {
+          pr: "space-24"
+        }
       }
     },
     tbody: {
@@ -12062,7 +12065,7 @@ const H6 = /* @__PURE__ */ c6(x6), w6 = H6(
       bottom: 0,
       height: "size-16",
       display: "flex",
-      pr: "space-8",
+      px: "space-8",
       flexDirection: "column",
       ml: "auto"
     },