@rafal.lemieszewski/tide-ui 0.87.7 → 0.87.9

package/dist/es/components/fundamental/tabs.js

@@ -1,6 +1,6 @@
 import { jsx as i, jsxs as b } from "react/jsx-runtime";
 import * as o from "react";
-import * as t from "@radix-ui/react-tabs";
+import * as s from "@radix-ui/react-tabs";
 import { cva as v } from "class-variance-authority";
 import { cn as l } from "../../lib/utils.js";
 const m = v(
@@ -8,7 +8,7 @@ const m = v(
   {
     variants: {
       variant: {
-        pilled: "bg-[var(--color-surface-deepest)] p-[4px] rounded-m gap-[var(--space-2xs)]",
+        pilled: "bg-[var(--color-surface-deepest)] p-[4px] rounded-[var(--border-radius-m)] gap-[var(--space-2xs)]",
         line: "border-b border-[var(--grey-100)] gap-[var(--space-s)] p-0"
       },
       size: {
@@ -44,7 +44,7 @@ const m = v(
       fullWidth: !1
     }
   }
-), x = v(
+), f = v(
   [
     "inline-flex items-center justify-center whitespace-nowrap cursor-pointer gap-[var(--space-s)]",
     "transition-all ring-offset-[var(--color-surface-primary)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-border-focus)] focus-visible:ring-offset-2",
@@ -54,8 +54,8 @@ const m = v(
     variants: {
       variant: {
         pilled: [
-          "rounded-s bg-transparent",
-          "data-[state=active]:bg-[var(--color-surface-primary)] data-[state=active]:text-[var(--color-text-brand-bold-selected)] data-[state=active]:[&_svg]:text-[var(--color-text-brand-bold-selected)] data-[state=active]:shadow-xs",
+          "rounded-[var(--border-radius-s)] bg-transparent",
+          "data-[state=active]:bg-[var(--color-surface-primary)] data-[state=active]:text-[var(--color-text-brand-bold-selected)] data-[state=active]:[&_svg]:text-[var(--color-text-brand-bold-selected)] data-[state=active]:shadow-[var(--shadow-100)]",
           "hover:bg-[var(--grey-alpha-50)] hover:text-[var(--color-text-primary)]",
           "disabled:opacity-50"
         ],
@@ -101,41 +101,41 @@ const m = v(
       fullWidth: !1
     }
   }
-), f = /* @__PURE__ */ o.forwardRef(({ className: a, ...e }, s) => /* @__PURE__ */ i(
-  t.Root,
+), x = /* @__PURE__ */ o.forwardRef(({ className: a, ...e }, r) => /* @__PURE__ */ i(
+  s.Root,
   {
-    ref: s,
+    ref: r,
     className: l("flex flex-col gap-[var(--space-s)]", a),
     ...e
   }
 ));
-f.displayName = t.Root.displayName;
-const u = /* @__PURE__ */ o.forwardRef(({ className: a, variant: e, size: s, fullWidth: r, ...c }, d) => /* @__PURE__ */ i(
-  t.List,
+x.displayName = s.Root.displayName;
+const u = /* @__PURE__ */ o.forwardRef(({ className: a, variant: e, size: r, fullWidth: t, ...d }, c) => /* @__PURE__ */ i(
+  s.List,
   {
-    ref: d,
-    className: l(m({ variant: e, size: s, fullWidth: r }), a),
-    ...c
+    ref: c,
+    className: l(m({ variant: e, size: r, fullWidth: t }), a),
+    ...d
   }
 ));
-u.displayName = t.List.displayName;
-const g = /* @__PURE__ */ o.forwardRef(({ className: a, variant: e, size: s, fullWidth: r, icon: c, children: d, ...n }, p) => /* @__PURE__ */ b(
-  t.Trigger,
+u.displayName = s.List.displayName;
+const g = /* @__PURE__ */ o.forwardRef(({ className: a, variant: e, size: r, fullWidth: t, icon: d, children: c, ...n }, p) => /* @__PURE__ */ b(
+  s.Trigger,
   {
     ref: p,
-    className: l(x({ variant: e, size: s, fullWidth: r }), a),
+    className: l(f({ variant: e, size: r, fullWidth: t }), a),
     ...n,
     children: [
-      c && /* @__PURE__ */ i("span", { className: "shrink-0", children: c }),
-      d
+      d && /* @__PURE__ */ i("span", { className: "shrink-0", children: d }),
+      c
     ]
   }
 ));
-g.displayName = t.Trigger.displayName;
-const y = /* @__PURE__ */ o.forwardRef(({ className: a, ...e }, s) => /* @__PURE__ */ i(
-  t.Content,
+g.displayName = s.Trigger.displayName;
+const y = /* @__PURE__ */ o.forwardRef(({ className: a, ...e }, r) => /* @__PURE__ */ i(
+  s.Content,
   {
-    ref: s,
+    ref: r,
     className: l(
       "mt-[var(--space-s)] ring-offset-[var(--color-surface-primary)] focus-visible:ring-2 focus-visible:ring-[var(--color-border-focus)] focus-visible:ring-offset-2 focus-visible:outline-none",
       a
@@ -143,28 +143,28 @@ const y = /* @__PURE__ */ o.forwardRef(({ className: a, ...e }, s) => /* @__PURE
     ...e
   }
 ));
-y.displayName = t.Content.displayName;
+y.displayName = s.Content.displayName;
 const h = /* @__PURE__ */ o.forwardRef(
-  ({ className: a, children: e, ...s }, r) => /* @__PURE__ */ i(
+  ({ className: a, children: e, ...r }, t) => /* @__PURE__ */ i(
     "div",
     {
-      ref: r,
+      ref: t,
       className: l(
         "text-caption-sm mb-[var(--space-s)] font-medium text-[var(--color-text-tertiary)]",
         a
       ),
-      ...s,
+      ...r,
       children: e
     }
   )
 );
 h.displayName = "TabsGroupLabel";
 export {
-  f as Tabs,
+  x as Tabs,
   y as TabsContent,
   h as TabsGroupLabel,
   u as TabsList,
   g as TabsTrigger,
   m as tabsListVariants,
-  x as tabsTriggerVariants
+  f as tabsTriggerVariants
 };

package/dist/es/components/fundamental/tag.js

@@ -17,8 +17,8 @@ const E = {
   success: "green",
   warning: "orange",
   destructive: "red"
-}, Q = ({ width: n, interactive: s = !1, className: a }) => {
-  const e = n - 0.5, l = `
+}, Q = ({ width: n, interactive: s = !1, className: l }) => {
+  const e = n - 0.5, a = `
     M 11.8333 0.5
     L ${e - 4} 0.5
     Q ${e} 0.5 ${e} ${0.5 + 4}
@@ -40,12 +40,12 @@ const E = {
       viewBox: `0 0 ${n} 24`,
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
-      className: i("absolute inset-0 pointer-events-none overflow-visible", a),
+      className: i("absolute inset-0 pointer-events-none overflow-visible", l),
       preserveAspectRatio: "none",
       children: /* @__PURE__ */ t(
         "path",
         {
-          d: l,
+          d: a,
           stroke: "var(--grey-100)",
           className: i(
             "fill-[var(--neutral-white)] transition-[fill]",
@@ -55,8 +55,8 @@ const E = {
       )
     }
   );
-}, _ = ({ width: n, interactive: s = !1, className: a }) => {
-  const e = n - 0.5, l = `
+}, _ = ({ width: n, interactive: s = !1, className: l }) => {
+  const e = n - 0.5, a = `
     M 11.1 0.5
     L ${e - 4} 0.5
     Q ${e} 0.5 ${e} ${0.5 + 4}
@@ -78,12 +78,12 @@ const E = {
       viewBox: `0 0 ${n} 20`,
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
-      className: i("absolute inset-0 pointer-events-none overflow-visible", a),
+      className: i("absolute inset-0 pointer-events-none overflow-visible", l),
       preserveAspectRatio: "none",
       children: /* @__PURE__ */ t(
         "path",
         {
-          d: l,
+          d: a,
           stroke: "var(--grey-100)",
           className: i(
             "fill-[var(--neutral-white)] transition-[fill]",
@@ -112,24 +112,24 @@ const E = {
     closeMargin: "ml-1",
     paddingX: "px-[var(--space-s)]"
   }
-}, b = /* @__PURE__ */ p.forwardRef(
+}, w = /* @__PURE__ */ p.forwardRef(
   ({
     className: n,
     size: s = "m",
-    variant: a = "triangular",
+    variant: l = "triangular",
     children: g,
     intent: h,
     color: e,
-    showDot: l,
+    showDot: a,
     closable: f = !1,
     onClose: x,
     disabled: c = !1,
-    onClick: w,
+    onClick: b,
     interactive: r = !1,
     style: $,
     ...S
   }, m) => {
-    const [y, N] = p.useState(0), v = p.useRef(null), o = j[s], u = a === "triangular";
+    const [y, N] = p.useState(0), v = p.useRef(null), o = j[s], u = l === "triangular";
     p.useEffect(() => {
       if (u && v.current) {
         const d = new ResizeObserver((B) => {
@@ -144,10 +144,10 @@ const E = {
     const z = (d) => {
       d.stopPropagation(), c || x?.();
     }, L = () => {
-      !c && r && w && w();
+      !c && r && b && b();
     }, M = (d) => {
       r && (d.key === "Enter" || d.key === " ") && (d.preventDefault(), L());
-    }, k = e || (h ? I[h] : void 0), R = k ? E[k] : void 0, O = l ?? k !== void 0, A = s === "s" ? _ : Q;
+    }, k = e || (h ? I[h] : void 0), R = k ? E[k] : void 0, O = a ?? k !== void 0, A = s === "s" ? _ : Q;
     return /* @__PURE__ */ C(
       "div",
       {
@@ -185,7 +185,7 @@ const E = {
                 u && "pl-[12px]",
                 // notch width clearance
                 !u && [
-                  "border border-[var(--grey-100)] rounded-m",
+                  "border border-[var(--grey-100)] rounded-[var(--border-radius-m)]",
                   "bg-[var(--neutral-white)]",
                   r && "group-hover:bg-[var(--grey-25)]",
                   "transition-[background-color]"
@@ -210,7 +210,7 @@ const E = {
                   {
                     type: "button",
                     className: i(
-                      "inline-flex items-center justify-center shrink-0 hover:bg-[var(--grey-alpha-50)] rounded-xs transition-colors",
+                      "inline-flex items-center justify-center shrink-0 hover:bg-[var(--grey-alpha-50)] rounded-[var(--border-radius-xs)] transition-colors",
                       o.closeMargin,
                       o.closeSize
                     ),
@@ -235,20 +235,20 @@ const E = {
     );
   }
 );
-b.displayName = "Tag";
+w.displayName = "Tag";
 const G = /* @__PURE__ */ p.forwardRef(
   ({
     className: n,
     tags: s,
-    onTagRemove: a,
+    onTagRemove: l,
     onTagClick: g,
     closable: h = !1,
     interactive: e = !1,
-    size: l = "m",
+    size: a = "m",
     variant: f,
     intent: x,
     color: c,
-    showDot: w,
+    showDot: b,
     maxVisible: r,
     ...$
   }, S) => {
@@ -261,28 +261,28 @@ const G = /* @__PURE__ */ p.forwardRef(
         ...$,
         children: [
           N.map((o) => /* @__PURE__ */ t(
-            b,
+            w,
             {
               intent: o.intent || x,
               color: o.color || c,
-              size: l,
+              size: a,
               variant: f,
               closable: h,
               interactive: e,
               disabled: o.disabled,
-              showDot: w,
-              onClose: a ? () => a(o.id) : void 0,
+              showDot: b,
+              onClose: l ? () => l(o.id) : void 0,
               onClick: g ? () => g(o.id) : void 0,
               children: o.label
             },
             o.id
           )),
-          v > 0 && /* @__PURE__ */ C(b, { size: l, variant: f, interactive: !0, onClick: () => y(!0), children: [
+          v > 0 && /* @__PURE__ */ C(w, { size: a, variant: f, interactive: !0, onClick: () => y(!0), children: [
             "+",
             v,
             " more"
           ] }),
-          m && r && /* @__PURE__ */ t(b, { size: l, variant: f, interactive: !0, onClick: () => y(!1), children: "Show less" })
+          m && r && /* @__PURE__ */ t(w, { size: a, variant: f, interactive: !0, onClick: () => y(!1), children: "Show less" })
         ]
       }
     );
@@ -290,6 +290,6 @@ const G = /* @__PURE__ */ p.forwardRef(
 );
 G.displayName = "TagGroup";
 export {
-  b as Tag,
+  w as Tag,
   G as TagGroup
 };

package/dist/es/components/fundamental/textarea.js

@@ -1,9 +1,9 @@
 import { jsx as i } from "react/jsx-runtime";
 import * as s from "react";
-import { cva as c } from "class-variance-authority";
-import { cn as l } from "../../lib/utils.js";
-const p = c(
-  "flex min-h-[80px] w-full rounded-m border transition-colors placeholder:text-[var(--color-text-tertiary)] focus-visible:outline-none focus-visible:shadow-[0px_0px_0px_2px_rgba(0,95,133,0.2),0px_3px_4px_0px_rgba(0,14,20,0.03)] disabled:cursor-not-allowed disabled:opacity-50 resize-y",
+import { cva as d } from "class-variance-authority";
+import { cn as c } from "../../lib/utils.js";
+const l = d(
+  "flex min-h-[80px] w-full rounded-[var(--border-radius-m)] border transition-colors placeholder:text-[var(--color-text-tertiary)] focus-visible:outline-none focus-visible:shadow-[0px_0px_0px_2px_rgba(0,95,133,0.2),0px_3px_4px_0px_rgba(0,14,20,0.03)] disabled:cursor-not-allowed disabled:opacity-50 resize-y",
   {
     variants: {
       variant: {
@@ -30,18 +30,18 @@ const p = c(
       size: "m"
     }
   }
-), d = /* @__PURE__ */ s.forwardRef(
+), p = /* @__PURE__ */ s.forwardRef(
   ({ className: r, variant: e, size: o, ...a }, t) => /* @__PURE__ */ i(
     "textarea",
     {
-      className: l(p({ variant: e, size: o }), r),
+      className: c(l({ variant: e, size: o }), r),
       ref: t,
       ...a
     }
   )
 );
-d.displayName = "Textarea";
+p.displayName = "Textarea";
 export {
-  d as Textarea,
-  p as textareaVariants
+  p as Textarea,
+  l as textareaVariants
 };

package/dist/es/components/fundamental/toast.js

@@ -2,9 +2,9 @@ import { jsx as o, jsxs as l } from "react/jsx-runtime";
 import { Toaster as s } from "sonner";
 import { toast as C } from "sonner";
 import { cn as r } from "../../lib/utils.js";
-import { Spinner as n } from "./spinner.js";
-import { Icon as i } from "./icon.js";
-import { CircleAlert as d, TriangleAlert as m, CircleCheck as v } from "lucide-react";
+import { Spinner as i } from "./spinner.js";
+import { Icon as n } from "./icon.js";
+import { CircleAlert as d, TriangleAlert as v, CircleCheck as m } from "lucide-react";
 const a = ({ name: e, color: t, blurColor: c }) => /* @__PURE__ */ l("div", { className: "relative", children: [
   c && /* @__PURE__ */ o(
     "div",
@@ -16,15 +16,15 @@ const a = ({ name: e, color: t, blurColor: c }) => /* @__PURE__ */ l("div", { cl
       }
     }
   ),
-  /* @__PURE__ */ o(i, { name: e, size: "m", className: t })
+  /* @__PURE__ */ o(n, { name: e, size: "m", className: t })
 ] }), h = ({ className: e, ...t }) => /* @__PURE__ */ o(
   s,
   {
     className: r("toaster group", e),
     icons: {
-      loading: /* @__PURE__ */ o(n, { size: "m", variant: "primary", className: "mt-1" }),
-      success: /* @__PURE__ */ o(a, { name: v, color: "text-[var(--color-icon-success-bold)]", blurColor: "#1C741F" }),
-      error: /* @__PURE__ */ o(a, { name: m, color: "text-[var(--color-icon-error-bold)]", blurColor: "#D9493E" }),
+      loading: /* @__PURE__ */ o(i, { size: "m", variant: "primary", className: "mt-1" }),
+      success: /* @__PURE__ */ o(a, { name: m, color: "text-[var(--color-icon-success-bold)]", blurColor: "#1C741F" }),
+      error: /* @__PURE__ */ o(a, { name: v, color: "text-[var(--color-icon-error-bold)]", blurColor: "#D9493E" }),
       warning: /* @__PURE__ */ o(a, { name: d, color: "text-[var(--color-icon-warning-bold)]", blurColor: "#E57F19" }),
       info: null
     },
@@ -37,9 +37,9 @@ const a = ({ name: e, color: t, blurColor: c }) => /* @__PURE__ */ l("div", { cl
           // Background & borders
           "bg-[var(--color-surface-primary)]",
           "!border !border-[var(--color-border-primary-medium)] !border-solid",
-          "rounded-m",
+          "rounded-[var(--border-radius-m)]",
           // Shadow
-          "shadow-lg",
+          "shadow-[var(--shadow-400)]",
           // Contain blur effect
           "overflow-hidden",
           // Flex layout
@@ -53,7 +53,7 @@ const a = ({ name: e, color: t, blurColor: c }) => /* @__PURE__ */ l("div", { cl
         actionButton: r(
           // Base button styling
           "h-[var(--size-m)] px-[var(--space-m)]",
-          "rounded-s",
+          "rounded-[var(--border-radius-s)]",
           "text-label-md",
           // Primary action colors
           "bg-[var(--color-background-blue-bold)]",
@@ -66,7 +66,7 @@ const a = ({ name: e, color: t, blurColor: c }) => /* @__PURE__ */ l("div", { cl
         cancelButton: r(
           // Base button styling
           "h-[var(--size-m)] px-[var(--space-m)]",
-          "rounded-s",
+          "rounded-[var(--border-radius-s)]",
           "text-label-md",
           // Secondary action colors
           "bg-[var(--color-background-neutral-subtlest)]",

package/dist/es/components/fundamental/toggle.js

@@ -1,9 +1,9 @@
 import { jsx as l } from "react/jsx-runtime";
-import * as c from "react";
+import * as d from "react";
 import * as e from "@radix-ui/react-toggle";
-import { cva as d } from "class-variance-authority";
+import { cva as c } from "class-variance-authority";
 import { cn as n } from "../../lib/utils.js";
-const b = d(
+const b = c(
   "inline-flex items-center justify-center font-medium ring-offset-[var(--color-surface-primary)] transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:transition-colors gap-[var(--space-s)] cursor-pointer",
   {
     variants: {
@@ -26,9 +26,9 @@ const b = d(
         ]
       },
       size: {
-        s: "text-label-sm rounded-s px-[var(--space-s)] py-[var(--space-xs)]",
-        m: "text-label-md rounded-m px-[var(--space-m)] py-[var(--dimension-150)]",
-        l: "text-label-md rounded-m px-[var(--space-l)] py-[var(--space-m)]"
+        s: "text-label-sm rounded-[var(--border-radius-s)] px-[var(--space-s)] py-[var(--space-xs)]",
+        m: "text-label-md rounded-[var(--border-radius-m)] px-[var(--space-m)] py-[var(--dimension-150)]",
+        l: "text-label-md rounded-[var(--border-radius-m)] px-[var(--space-l)] py-[var(--space-m)]"
       }
     },
     defaultVariants: {
@@ -36,7 +36,7 @@ const b = d(
       size: "s"
     }
   }
-), i = /* @__PURE__ */ c.forwardRef(({ className: r, variant: a, size: t, ...o }, s) => /* @__PURE__ */ l(
+), i = /* @__PURE__ */ d.forwardRef(({ className: r, variant: a, size: t, ...o }, s) => /* @__PURE__ */ l(
   e.Root,
   {
     ref: s,

package/dist/es/components/fundamental/tooltip.js

@@ -5,16 +5,16 @@ import { cn as s } from "../../lib/utils.js";
 const p = ({
   delayDuration: t = 400,
   ...e
-}) => /* @__PURE__ */ a(o.Provider, { delayDuration: t, ...e }), c = o.Root, f = o.Trigger, m = /* @__PURE__ */ d.forwardRef(({ className: t, sideOffset: e = 4, ...i }, r) => /* @__PURE__ */ a(
+}) => /* @__PURE__ */ a(o.Provider, { delayDuration: t, ...e }), c = o.Root, f = o.Trigger, m = /* @__PURE__ */ d.forwardRef(({ className: t, sideOffset: e = 4, ...r }, i) => /* @__PURE__ */ a(
   o.Content,
   {
-    ref: r,
+    ref: i,
     sideOffset: e,
     className: s(
-      "[&]:text-body-sm animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-w-[320px] overflow-hidden rounded-m bg-[var(--color-background-inverse)] px-[var(--space-m)] py-[var(--space-s)] text-[var(--color-text-inverse)] shadow-lg",
+      "[&]:text-body-sm animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-w-[320px] overflow-hidden rounded-[var(--border-radius-m)] bg-[var(--color-background-inverse)] px-[var(--space-m)] py-[var(--space-s)] text-[var(--color-text-inverse)] shadow-[var(--shadow-400)]",
       t
     ),
-    ...i
+    ...r
   }
 ));
 m.displayName = o.Content.displayName;

package/dist/es/components/fundamental/tree.js

@@ -9,15 +9,15 @@ const T = n.createContext(null), R = () => {
     throw new Error("useTree must be used within a TreeProvider");
   return e;
 }, k = /* @__PURE__ */ n.forwardRef(
-  ({ item: e, level: l }, c) => {
+  ({ item: e, level: d }, c) => {
     const {
-      selectedItemId: d,
+      selectedItemId: l,
       expandedItems: t,
       handleExpand: h,
       handleSelect: I,
       defaultNodeIcon: b,
       defaultLeafIcon: p
-    } = R(), a = t.has(e.id), f = d === e.id, o = e.children && e.children.length > 0, i = f && !o, v = n.useMemo(() => e.disabled ? p || g : f && e.selectedIcon ? e.selectedIcon : o ? a && e.openIcon ? e.openIcon : e.icon || b || S : e.icon || p || g, [
+    } = R(), a = t.has(e.id), f = l === e.id, o = e.children && e.children.length > 0, i = f && !o, v = n.useMemo(() => e.disabled ? p || g : f && e.selectedIcon ? e.selectedIcon : o ? a && e.openIcon ? e.openIcon : e.icon || b || S : e.icon || p || g, [
       e.disabled,
       e.selectedIcon,
       e.openIcon,
@@ -37,12 +37,12 @@ const T = n.createContext(null), R = () => {
         "div",
         {
           className: u(
-            "flex items-center gap-1 rounded-s py-1 pr-1 cursor-pointer transition-colors",
+            "flex items-center gap-1 rounded-[var(--border-radius-s)] py-1 pr-1 cursor-pointer transition-colors",
             "hover:bg-[var(--color-background-neutral-subtlest-hovered)]",
             i && "bg-[var(--color-background-blue-subtle-selected)] hover:bg-[var(--color-background-blue-subtle-selected-hovered)]",
             e.disabled && "opacity-50 cursor-not-allowed"
           ),
-          style: { paddingLeft: `${l * 16 + 8}px` },
+          style: { paddingLeft: `${d * 16 + 8}px` },
           onClick: y,
           children: [
             o ? /* @__PURE__ */ s(
@@ -85,7 +85,7 @@ const T = n.createContext(null), R = () => {
           ]
         }
       ),
-      o && a && /* @__PURE__ */ s("div", { children: e.children?.map((r) => /* @__PURE__ */ s(k, { item: r, level: l + 1 }, r.id)) })
+      o && a && /* @__PURE__ */ s("div", { children: e.children?.map((r) => /* @__PURE__ */ s(k, { item: r, level: d + 1 }, r.id)) })
     ] });
   }
 );
@@ -93,22 +93,22 @@ k.displayName = "TreeItem";
 const L = /* @__PURE__ */ n.forwardRef(
   ({
     data: e,
-    initialSelectedItemId: l,
+    initialSelectedItemId: d,
     onSelectChange: c,
-    expandAll: d = !1,
+    expandAll: l = !1,
     defaultNodeIcon: t = S,
     defaultLeafIcon: h = g,
     className: I,
     ...b
   }, p) => {
     const [a, f] = n.useState(
-      l
+      d
     ), [o, m] = n.useState(
-      new Set(d ? N(Array.isArray(e) ? e : [e]) : [])
+      new Set(l ? N(Array.isArray(e) ? e : [e]) : [])
     );
     n.useEffect(() => {
-      d && m(new Set(N(Array.isArray(e) ? e : [e])));
-    }, [e, d]);
+      l && m(new Set(N(Array.isArray(e) ? e : [e])));
+    }, [e, l]);
     const i = n.useCallback((r) => {
       m((E) => {
         const x = new Set(E);
@@ -149,12 +149,12 @@ const L = /* @__PURE__ */ n.forwardRef(
 );
 L.displayName = "Tree";
 function N(e) {
-  const l = [];
-  function c(d) {
-    for (const t of d)
-      l.push(t.id), t.children && c(t.children);
+  const d = [];
+  function c(l) {
+    for (const t of l)
+      d.push(t.id), t.children && c(t.children);
   }
-  return c(e), l;
+  return c(e), d;
 }
 export {
   L as Tree