twenty-ui 2.52.0 → 2.53.0

package/dist/{data-display-CHKKTmH_.js → data-display-DVEhI2Rt.js}

@@ -1,58 +1,58 @@
 import { t as m } from "./isDefined-fMi6eQ4r.js";
 import { t as z } from "./isRenderableSlot-DT_depzM.js";
-import { Dt as re, Et as oe, It as ne, U as K, Va as ae, rc as te, sn as se } from "./TablerIcons-CqzhliLC.js";
-import { t as le } from "./doNotTranslate-BSVT8Xyd.js";
+import { Dt as re, Et as oe, Ha as ne, Lt as ae, U as K, cn as te, ic as le } from "./TablerIcons-B6BhOlW_.js";
+import { t as se } from "./doNotTranslate-BSVT8Xyd.js";
 import { a as T, h as ie, r as X } from "./theme-CuGIQBsJ.js";
 import { t as ce } from "./VisuallyHidden-CFZP7ybO.js";
 import { t as de } from "./ProgressRing-8mYV9cxE.js";
 import { s as _e } from "./utilities-D0KcLLtO.js";
 import { useRender as N } from "@base-ui/react/use-render";
-import { isArray as ue, isBoolean as me, isNonEmptyArray as P, isNonEmptyString as D, isNumber as Q, isString as ve } from "@sniptt/guards";
+import { isArray as ue, isBoolean as me, isNonEmptyArray as H, isNonEmptyString as V, isNumber as Q, isString as ve } from "@sniptt/guards";
 import { clsx as d } from "clsx";
-import { Children as L, createContext as he, isValidElement as pe, useContext as be, useId as Ce, useState as Ne } from "react";
+import { Children as E, createContext as he, isValidElement as pe, useContext as be, useId as Ce, useState as Ne } from "react";
 import { Fragment as y, jsx as o, jsxs as c } from "react/jsx-runtime";
-import { Collapsible as H } from "@base-ui/react/collapsible";
-var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCountContainer_5cu4g_22", xe = "_overflowCount_5cu4g_22", x = {
+import { Collapsible as P } from "@base-ui/react/collapsible";
+var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", xe = "_overflowCountContainer_5cu4g_22", Ie = "_overflowCount_5cu4g_22", I = {
   container: fe,
   itemContainer: ge,
-  overflowCountContainer: Ie,
-  overflowCount: xe
-}, we = 4, Lr = ({ avatars: e, className: r, maxVisible: n = we, total: a, renderOverflow: s, overflowShape: l = "square", overlap: t = "right", overlapOffset: i = "3px", render: h, ref: p, ..._ }) => {
-  const u = L.toArray(e), A = Number.isNaN(n) ? 0 : Math.max(0, Math.floor(n)), g = u.slice(0, A), C = a ?? u.length, I = (Number.isFinite(C) ? Math.max(u.length, Math.floor(C)) : u.length) - g.length, S = m(s), k = I > 0 && (S ? s(I) : /* @__PURE__ */ c("span", {
-    className: x.overflowCount,
-    "data-shape": l,
-    children: ["+", I]
-  })), F = P(L.toArray(k)), M = { "--avatar-group-overlap-offset": i }, ee = N({
+  overflowCountContainer: xe,
+  overflowCount: Ie
+}, we = 4, Er = ({ avatars: e, className: r, maxVisible: n = we, total: a, renderOverflow: l, overflowShape: s = "square", overlap: t = "right", overlapOffset: i = "3px", render: h, ref: p, ..._ }) => {
+  const u = E.toArray(e), A = Number.isNaN(n) ? 0 : Math.max(0, Math.floor(n)), g = u.slice(0, A), C = a ?? u.length, x = (Number.isFinite(C) ? Math.max(u.length, Math.floor(C)) : u.length) - g.length, S = m(l), k = x > 0 && (S ? l(x) : /* @__PURE__ */ c("span", {
+    className: I.overflowCount,
+    "data-shape": s,
+    children: ["+", x]
+  })), F = H(E.toArray(k)), M = { "--avatar-group-overlap-offset": i }, ee = N({
     render: h,
     ref: p,
     props: {
       ..._,
-      className: d(x.container, r),
-      children: /* @__PURE__ */ c(y, { children: [L.map(g, (E) => /* @__PURE__ */ o("span", {
-        className: x.itemContainer,
+      className: d(I.container, r),
+      children: /* @__PURE__ */ c(y, { children: [E.map(g, (L) => /* @__PURE__ */ o("span", {
+        className: I.itemContainer,
         "data-overlap": t,
         style: M,
-        children: E
-      }, pe(E) ? E.key : void 0)), F && /* @__PURE__ */ o("span", {
-        className: d(x.itemContainer, !S && x.overflowCountContainer),
+        children: L
+      }, pe(L) ? L.key : void 0)), F && /* @__PURE__ */ o("span", {
+        className: d(I.itemContainer, !S && I.overflowCountContainer),
         "data-overlap": t,
         style: M,
         children: k
       })] })
     }
   });
-  return P(g) || F ? ee : null;
+  return H(g) || F ? ee : null;
 }, Te = "_container_1j72k_1", ye = "_commands_1j72k_13", Ae = "_actions_1j72k_25", Se = "_prompt_1j72k_32", $ = {
   container: Te,
   commands: ye,
   actions: Ae,
   prompt: Se
-}, jr = ({ commands: e, actions: r, render: n, ref: a, className: s, ...l }) => N({
+}, jr = ({ commands: e, actions: r, render: n, ref: a, className: l, ...s }) => N({
   render: n,
   ref: a,
   props: {
-    ...l,
-    className: d($.container, s),
+    ...s,
+    className: d($.container, l),
     children: /* @__PURE__ */ c(y, { children: [/* @__PURE__ */ o("pre", {
       className: $.commands,
       children: /* @__PURE__ */ o("code", { children: e.map((t, i) => /* @__PURE__ */ c("span", { children: [
@@ -70,21 +70,21 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
       children: r
     })] })
   }
-}), ke = "_row_1usvs_1", $e = "_label_1usvs_11", Je = "_labelText_1usvs_22", Ee = "_icon_1usvs_27", Le = "_description_1usvs_34", je = "_value_1usvs_43", Re = "_action_1usvs_54", b = {
+}), ke = "_row_1usvs_1", $e = "_label_1usvs_11", Je = "_labelText_1usvs_22", Le = "_icon_1usvs_27", Ee = "_description_1usvs_34", je = "_value_1usvs_43", Re = "_action_1usvs_54", b = {
   row: ke,
   label: $e,
   labelText: Je,
-  icon: Ee,
-  description: Le,
+  icon: Le,
+  description: Ee,
   value: je,
   action: Re
-}, Rr = ({ label: e, children: r, startIcon: n, action: a, labelWidth: s = "7rem", render: l, ref: t, className: i, style: h, ...p }) => {
+}, Rr = ({ label: e, children: r, startIcon: n, action: a, labelWidth: l = "7rem", render: s, ref: t, className: i, style: h, ...p }) => {
   const _ = {
-    "--details-row-label-width": Q(s) ? `${s}px` : s,
+    "--details-row-label-width": Q(l) ? `${l}px` : l,
     ...h
   };
   return N({
-    render: l,
+    render: s,
     ref: t,
     props: {
       ...p,
@@ -115,23 +115,23 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
 }, Oe = "_list_1i4lv_1", qe = "_nested_1i4lv_8", U = {
   list: Oe,
   nested: qe
-}, Ve = ({ depth: e, className: r, children: n }) => /* @__PURE__ */ o("ul", {
+}, De = ({ depth: e, className: r, children: n }) => /* @__PURE__ */ o("ul", {
   className: d(U.list, e > 0 && U.nested, r),
   children: n
 }), Y = he(void 0), f = () => {
   const e = be(Y);
-  if (!m(e)) throw new Error(le("useJsonTreeContextOrThrow must be used within a JsonTreeContextProvider"));
+  if (!m(e)) throw new Error(se("useJsonTreeContextOrThrow must be used within a JsonTreeContextProvider"));
   return e;
-}, De = "_button_1e3ij_1", Be = "_red_1e3ij_17", Fe = "_chevron_1e3ij_22", j = {
-  button: De,
+}, Ve = "_button_1e3ij_1", Be = "_red_1e3ij_17", Fe = "_chevron_1e3ij_22", j = {
+  button: Ve,
   red: Be,
   chevron: Fe
 }, Me = ({ isOpen: e, onClick: r, variant: n }) => {
-  const a = X(), { arrowButtonCollapsedLabel: s, arrowButtonExpandedLabel: l } = f(), t = n === "blue" ? T.color.blue : n === "red" ? T.font.color.danger : T.font.color.secondary;
+  const a = X(), { arrowButtonCollapsedLabel: l, arrowButtonExpandedLabel: s } = f(), t = n === "blue" ? T.color.blue : n === "red" ? T.font.color.danger : T.font.color.secondary;
   return /* @__PURE__ */ c("button", {
     className: d(j.button, n === "red" && j.red),
     onClick: r,
-    children: [/* @__PURE__ */ o(ce, { children: e ? l : s }), /* @__PURE__ */ o("div", {
+    children: [/* @__PURE__ */ o(ce, { children: e ? s : l }), /* @__PURE__ */ o("div", {
       className: j.chevron,
       "data-open": e || void 0,
       children: /* @__PURE__ */ o(re, {
@@ -140,8 +140,8 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
       })
     })]
   });
-}, ze = ({ label: e, value: r, depth: n, keyPath: a, highlighting: s }) => {
-  const { emptyArrayLabel: l } = f();
+}, ze = ({ label: e, value: r, depth: n, keyPath: a, highlighting: l }) => {
+  const { emptyArrayLabel: s } = f();
   return /* @__PURE__ */ o(B, {
     elements: [...r.entries()].map(([t, i]) => ({
       id: t,
@@ -152,12 +152,12 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
     label: e,
     Icon: K,
     depth: n,
-    emptyElementsText: l,
+    emptyElementsText: s,
     keyPath: a,
-    highlighting: s
+    highlighting: l
   });
-}, Pe = ({ label: e, value: r, depth: n, keyPath: a, highlighting: s }) => {
-  const { emptyObjectLabel: l } = f();
+}, He = ({ label: e, value: r, depth: n, keyPath: a, highlighting: l }) => {
+  const { emptyObjectLabel: s } = f();
   return /* @__PURE__ */ o(B, {
     elements: Object.entries(r).map(([t, i]) => ({
       id: t,
@@ -166,14 +166,14 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
     })),
     renderElementsCount: (t) => `{${t}}`,
     label: e,
-    Icon: se,
+    Icon: te,
     depth: n,
-    emptyElementsText: l,
+    emptyElementsText: s,
     keyPath: a,
-    highlighting: s
+    highlighting: l
   });
-}, He = "_labelContainer_1pq94_1", Ue = "_blue_1pq94_23", Ge = "_red_1pq94_29", R = {
-  labelContainer: He,
+}, Pe = "_labelContainer_1pq94_1", Ue = "_blue_1pq94_23", Ge = "_red_1pq94_29", R = {
+  labelContainer: Pe,
   blue: Ue,
   red: Ge
 }, Z = ({ label: e, Icon: r, highlighting: n }) => {
@@ -191,16 +191,16 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
   red: Qe,
   button: Ye
 }, Ze = ({ valueAsString: e, highlighting: r }) => {
-  const { onNodeValueClick: n } = f(), a = m(n), s = () => {
+  const { onNodeValueClick: n } = f(), a = m(n), l = () => {
     n?.(e);
-  }, l = d(J.text, r === "blue" && J.blue, r === "red" && J.red);
+  }, s = d(J.text, r === "blue" && J.blue, r === "red" && J.red);
   return a ? /* @__PURE__ */ o("button", {
-    className: d(l, J.button),
+    className: d(s, J.button),
     type: "button",
-    onClick: s,
+    onClick: l,
     children: e
   }) : /* @__PURE__ */ o("span", {
-    className: l,
+    className: s,
     children: e
   });
 }, We = "_listItem_1i7if_1", er = { listItem: We }, w = (e) => /* @__PURE__ */ c("li", {
@@ -214,16 +214,16 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
     highlighting: e.highlighting
   })]
 }), rr = (e) => ue(e), W = ({ label: e, value: r, depth: n, keyPath: a }) => {
-  const { getNodeHighlighting: s, emptyStringLabel: l } = f(), t = s?.(a);
+  const { getNodeHighlighting: l, emptyStringLabel: s } = f(), t = l?.(a);
   return m(r) ? ve(r) ? /* @__PURE__ */ o(w, {
     label: e,
-    valueAsString: D(r) ? r : l,
-    Icon: te,
+    valueAsString: V(r) ? r : s,
+    Icon: le,
     highlighting: t
   }) : Q(r) ? /* @__PURE__ */ o(w, {
     label: e,
     valueAsString: String(r),
-    Icon: ae,
+    Icon: ne,
     highlighting: t
   }) : me(r) ? /* @__PURE__ */ o(w, {
     label: e,
@@ -236,7 +236,7 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
     depth: n,
     keyPath: a,
     highlighting: t
-  }) : /* @__PURE__ */ o(Pe, {
+  }) : /* @__PURE__ */ o(He, {
     label: e,
     value: r,
     depth: n,
@@ -245,32 +245,32 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
   }) : /* @__PURE__ */ o(w, {
     label: e,
     valueAsString: "null",
-    Icon: ne,
+    Icon: ae,
     highlighting: t
   });
-}, or = "_container_d0cqx_1", nr = "_labelContainer_d0cqx_6", ar = "_elementsCount_d0cqx_12", tr = "_elementsCountRed_d0cqx_16", sr = "_panel_d0cqx_20", lr = "_list_d0cqx_30", ir = "_nested_d0cqx_37", v = {
+}, or = "_container_d0cqx_1", nr = "_labelContainer_d0cqx_6", ar = "_elementsCount_d0cqx_12", tr = "_elementsCountRed_d0cqx_16", lr = "_panel_d0cqx_20", sr = "_list_d0cqx_30", ir = "_nested_d0cqx_37", v = {
   container: or,
   labelContainer: nr,
   elementsCount: ar,
   elementsCountRed: tr,
-  panel: sr,
-  list: lr,
+  panel: lr,
+  list: sr,
   nested: ir
-}, B = ({ label: e, Icon: r, elements: n, renderElementsCount: a, emptyElementsText: s, depth: l, keyPath: t, highlighting: i }) => {
+}, B = ({ label: e, Icon: r, elements: n, renderElementsCount: a, emptyElementsText: l, depth: s, keyPath: t, highlighting: i }) => {
   const { shouldExpandNodeInitially: h } = f(), p = !m(e), [_, u] = Ne(h({
     keyPath: t,
-    depth: l
+    depth: s
   })), A = /* @__PURE__ */ o("ul", {
-    className: d(v.list, l > 0 && v.nested),
+    className: d(v.list, s > 0 && v.nested),
     children: n.length === 0 ? /* @__PURE__ */ o(w, {
-      valueAsString: s,
+      valueAsString: l,
       highlighting: void 0
-    }) : n.map(({ id: C, label: I, value: S }) => {
-      const k = D(t) ? `${t}.${C}` : String(C);
+    }) : n.map(({ id: C, label: x, value: S }) => {
+      const k = V(t) ? `${t}.${C}` : String(C);
       return /* @__PURE__ */ o(W, {
-        label: I,
+        label: x,
         value: S,
-        depth: l + 1,
+        depth: s + 1,
         keyPath: k
       }, C);
     })
@@ -280,7 +280,7 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
   return p ? /* @__PURE__ */ o("li", {
     className: v.container,
     children: A
-  }) : /* @__PURE__ */ c(H.Root, {
+  }) : /* @__PURE__ */ c(P.Root, {
     className: v.container,
     open: _,
     render: /* @__PURE__ */ o("li", {}),
@@ -302,7 +302,7 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
           children: a(n.length)
         })
       ]
-    }), /* @__PURE__ */ o(H.Panel, {
+    }), /* @__PURE__ */ o(P.Panel, {
       className: v.panel,
       children: A
     })]
@@ -315,7 +315,7 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
     ...a,
     shouldExpandNodeInitially: n
   },
-  children: /* @__PURE__ */ o(Ve, {
+  children: /* @__PURE__ */ o(De, {
     depth: 0,
     children: m(r) ? /* @__PURE__ */ o(B, {
       elements: r,
@@ -333,8 +333,8 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
   row: _r,
   label: ur,
   icon: mr
-}, qr = ({ children: e, startIcon: r, value: n, progress: a, progressColor: s, progressValueText: l, render: t, ref: i, className: h, ...p }) => {
-  const _ = Ce(), u = l ?? n;
+}, qr = ({ children: e, startIcon: r, value: n, progress: a, progressColor: l, progressValueText: s, render: t, ref: i, className: h, ...p }) => {
+  const _ = Ce(), u = s ?? n;
   return N({
     render: t,
     ref: i,
@@ -354,9 +354,9 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
       }), m(a) ? /* @__PURE__ */ o(de, {
         value: a,
         size: "sm",
-        barColor: s,
+        barColor: l,
         "aria-labelledby": _,
-        ...D(u) ? { "aria-valuetext": u } : {},
+        ...V(u) ? { "aria-valuetext": u } : {},
         children: n
       }) : /* @__PURE__ */ o("span", { children: n })] })
     }
@@ -364,11 +364,11 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
 }, vr = "_root_7l8sk_1", hr = "_stackedIcon_7l8sk_14", G = {
   root: vr,
   stackedIcon: hr
-}, Vr = ({ icon: e, stackedIcon: r, className: n, render: a, ref: s, ...l }) => N({
+}, Dr = ({ icon: e, stackedIcon: r, className: n, render: a, ref: l, ...s }) => N({
   render: a,
-  ref: s,
+  ref: l,
   props: {
-    ...l,
+    ...s,
     className: d(G.root, n),
     children: /* @__PURE__ */ c(y, { children: [/* @__PURE__ */ o("span", {
       "aria-hidden": "true",
@@ -383,18 +383,18 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
   background: 4,
   border: 6,
   icon: 10
-}, V = (e, r) => T.color[`${e}${r}`] ?? T.tag.text[e], pr = (e) => {
+}, D = (e, r) => T.color[`${e}${r}`] ?? T.tag.text[e], pr = (e) => {
   const r = _e(e);
   return {
-    backgroundColor: V(r, q.background),
-    iconColor: V(r, q.icon),
-    borderColor: V(r, q.border)
+    backgroundColor: D(r, q.background),
+    iconColor: D(r, q.icon),
+    borderColor: D(r, q.border)
   };
-}, br = "_root_9ntdy_1", Cr = { root: br }, Dr = ({ icon: e, color: r = ie, className: n, style: a, render: s, ref: l, ...t }) => {
+}, br = "_root_9ntdy_1", Cr = { root: br }, Vr = ({ icon: e, color: r = ie, className: n, style: a, render: l, ref: s, ...t }) => {
   const i = pr(r);
   return N({
-    render: s,
-    ref: l,
+    render: l,
+    ref: s,
     props: {
       ...t,
       className: d(Cr.root, n),
@@ -412,11 +412,11 @@ var fe = "_container_5cu4g_1", ge = "_itemContainer_5cu4g_6", Ie = "_overflowCou
 };
 export {
   Or as a,
-  Lr as c,
+  Er as c,
   qr as i,
   pr as n,
   Rr as o,
-  Vr as r,
+  Dr as r,
   jr as s,
-  Dr as t
+  Vr as t
 };