@ledgerhq/lumen-ui-react 0.1.62 → 0.1.63

package/dist/lib/Components/core/Select/Select.js

@@ -5,26 +5,27 @@ import { useLayoutEffect as F } from "react";
 import { SelectProvider as M, useSelectContext as p } from "./SelectContext.js";
 import { useControllableState as W } from "../../../../utils/useControllableState/useControllableState.js";
 import { useSelectItems as A } from "./useSelectItems/useSelectItems.js";
-import { resolveValue as f } from "./utils/groupItems.js";
-import { SearchInput as B } from "../SearchInput/SearchInput.js";
-import { Check as H } from "../../symbols/icons/Check.js";
-import { Divider as J } from "../Divider/Divider.js";
-import { ChevronDown as K } from "../../symbols/icons/ChevronDown.js";
-import { ComboboxRoot as O } from "../../../../node_modules/@base-ui/react/esm/combobox/root/ComboboxRoot.js";
-import { ComboboxTrigger as x } from "../../../../node_modules/@base-ui/react/esm/combobox/trigger/ComboboxTrigger.js";
-import { ComboboxPortal as Q } from "../../../../node_modules/@base-ui/react/esm/combobox/portal/ComboboxPortal.js";
-import { ComboboxPositioner as U } from "../../../../node_modules/@base-ui/react/esm/combobox/positioner/ComboboxPositioner.js";
-import { ComboboxPopup as X } from "../../../../node_modules/@base-ui/react/esm/combobox/popup/ComboboxPopup.js";
-import { ComboboxInput as Y } from "../../../../node_modules/@base-ui/react/esm/combobox/input/ComboboxInput.js";
-import { ComboboxList as Z } from "../../../../node_modules/@base-ui/react/esm/combobox/list/ComboboxList.js";
-import { ComboboxGroup as _ } from "../../../../node_modules/@base-ui/react/esm/combobox/group/ComboboxGroup.js";
-import { ComboboxCollection as $ } from "../../../../node_modules/@base-ui/react/esm/combobox/collection/ComboboxCollection.js";
-import { ComboboxItem as ee } from "../../../../node_modules/@base-ui/react/esm/combobox/item/ComboboxItem.js";
-import { ComboboxItemIndicator as te } from "../../../../node_modules/@base-ui/react/esm/combobox/item-indicator/ComboboxItemIndicator.js";
-import { ComboboxEmpty as oe } from "../../../../node_modules/@base-ui/react/esm/combobox/empty/ComboboxEmpty.js";
-import { ComboboxValue as g } from "../../../../node_modules/@base-ui/react/esm/combobox/value/ComboboxValue.js";
-import { ComboboxGroupLabel as ae } from "../../../../node_modules/@base-ui/react/esm/combobox/group-label/ComboboxGroupLabel.js";
-function re({
+import { resolveValue as h } from "./utils/groupItems.js";
+import { useCommonTranslation as B } from "../../../../translations/translations.js";
+import { SearchInput as H } from "../SearchInput/SearchInput.js";
+import { Check as J } from "../../symbols/icons/Check.js";
+import { Divider as K } from "../Divider/Divider.js";
+import { ChevronDown as O } from "../../symbols/icons/ChevronDown.js";
+import { ComboboxRoot as Q } from "../../../../node_modules/@base-ui/react/esm/combobox/root/ComboboxRoot.js";
+import { ComboboxTrigger as g } from "../../../../node_modules/@base-ui/react/esm/combobox/trigger/ComboboxTrigger.js";
+import { ComboboxPortal as U } from "../../../../node_modules/@base-ui/react/esm/combobox/portal/ComboboxPortal.js";
+import { ComboboxPositioner as X } from "../../../../node_modules/@base-ui/react/esm/combobox/positioner/ComboboxPositioner.js";
+import { ComboboxPopup as Y } from "../../../../node_modules/@base-ui/react/esm/combobox/popup/ComboboxPopup.js";
+import { ComboboxInput as Z } from "../../../../node_modules/@base-ui/react/esm/combobox/input/ComboboxInput.js";
+import { ComboboxList as _ } from "../../../../node_modules/@base-ui/react/esm/combobox/list/ComboboxList.js";
+import { ComboboxGroup as $ } from "../../../../node_modules/@base-ui/react/esm/combobox/group/ComboboxGroup.js";
+import { ComboboxCollection as ee } from "../../../../node_modules/@base-ui/react/esm/combobox/collection/ComboboxCollection.js";
+import { ComboboxItem as te } from "../../../../node_modules/@base-ui/react/esm/combobox/item/ComboboxItem.js";
+import { ComboboxItemIndicator as oe } from "../../../../node_modules/@base-ui/react/esm/combobox/item-indicator/ComboboxItemIndicator.js";
+import { ComboboxEmpty as ae } from "../../../../node_modules/@base-ui/react/esm/combobox/empty/ComboboxEmpty.js";
+import { ComboboxValue as S } from "../../../../node_modules/@base-ui/react/esm/combobox/value/ComboboxValue.js";
+import { ComboboxGroupLabel as re } from "../../../../node_modules/@base-ui/react/esm/combobox/group-label/ComboboxGroupLabel.js";
+function le({
   value: o,
   defaultValue: a,
   onValueChange: e,
@@ -35,7 +36,7 @@ function re({
   searchValue: c,
   defaultSearchValue: m,
   onSearchValueChange: b,
-  open: y,
+  open: f,
   defaultOpen: C,
   onOpenChange: v,
   name: N,
@@ -45,7 +46,7 @@ function re({
   const V = G({
     consumerName: "Select",
     mergeWith: { disabled: r }
-  }), [h, L] = W(
+  }), [x, T] = W(
     {
       prop: o,
       defaultProp: a ?? null,
@@ -54,10 +55,10 @@ function re({
       }
     }
   ), {
-    isGrouped: T,
-    groupedItems: R,
-    filteredItemsForRoot: q,
-    resolvedSearchValue: P,
+    isGrouped: L,
+    groupedItems: P,
+    filteredItemsForRoot: R,
+    resolvedSearchValue: q,
     searchMounted: j,
     registerSearch: z,
     handleSearchValueChange: D
@@ -70,18 +71,18 @@ function re({
     onSearchValueChange: b
   });
   return /* @__PURE__ */ t(
-    O,
+    Q,
     {
       "data-slot": "select",
       filter: null,
-      items: R ?? s,
-      filteredItems: q,
-      inputValue: P,
+      items: P ?? s,
+      filteredItems: R,
+      inputValue: q,
       onInputValueChange: D,
-      value: h,
-      onValueChange: (d) => L(f(d)),
-      isItemEqualToValue: (d, E) => f(d) === f(E),
-      open: y,
+      value: x,
+      onValueChange: (d) => T(h(d)),
+      isItemEqualToValue: (d, E) => h(d) === h(E),
+      open: f,
       defaultOpen: C,
       onOpenChange: v,
       name: N,
@@ -90,27 +91,27 @@ function re({
       children: /* @__PURE__ */ t(
         M,
         {
-          value: { selectedValue: h, registerSearch: z, isGrouped: T, searchMounted: j },
+          value: { selectedValue: x, registerSearch: z, isGrouped: L, searchMounted: j },
           children: I
         }
       )
     }
   );
 }
-const le = l(
+const se = l(
   "group relative flex h-48 w-full cursor-pointer items-center justify-between gap-8",
   "rounded-sm bg-muted px-16",
   "body-2 text-base",
   "hover:bg-muted-hover",
   "transition-colors duration-200 focus:ring-2 focus:ring-active focus:outline-hidden",
   "disabled:cursor-not-allowed disabled:text-disabled"
-), se = l(
+), ne = l(
   "pointer-events-none absolute left-16 origin-left text-muted transition-all duration-300",
   "top-10 -translate-y-4 body-4",
   "group-data-placeholder:top-14 group-data-placeholder:translate-y-0 group-data-placeholder:body-2",
   "group-data-disabled:text-disabled",
   "max-w-[calc(100%-var(--size-56))] truncate"
-), ne = ({
+), ie = ({
   ref: o,
   className: a,
   labelClassName: e,
@@ -122,15 +123,15 @@ const le = l(
     contextRequired: !0
   }), i = n !== null && n !== "";
   return /* @__PURE__ */ u(
-    x,
+    g,
     {
       ref: o,
       "data-slot": "select-trigger",
       "data-placeholder": i ? void 0 : "",
-      className: l(le, a),
+      className: l(se, a),
       ...s,
       children: [
-        r && /* @__PURE__ */ t("label", { className: l(se, e), children: r }),
+        r && /* @__PURE__ */ t("label", { className: l(ne, e), children: r }),
         /* @__PURE__ */ t(
           "span",
           {
@@ -139,11 +140,11 @@ const le = l(
               r && "mt-16 opacity-100 transition-opacity delay-100 duration-300",
               r && !i && "mt-0 opacity-0"
             ),
-            children: /* @__PURE__ */ t(g, {})
+            children: /* @__PURE__ */ t(S, {})
           }
         ),
         /* @__PURE__ */ t(
-          K,
+          O,
           {
             size: 20,
             className: "text-muted group-data-disabled:text-disabled"
@@ -152,7 +153,7 @@ const le = l(
       ]
     }
   );
-}, ie = ({
+}, ce = ({
   render: o,
   disabled: a,
   ...e
@@ -160,9 +161,9 @@ const le = l(
   const { selectedValue: r } = p({
     consumerName: "SelectTrigger",
     contextRequired: !0
-  }), s = /* @__PURE__ */ t(g, {});
+  }), s = /* @__PURE__ */ t(S, {});
   return o ? /* @__PURE__ */ t(
-    x,
+    g,
     {
       disabled: a,
       ref: e.ref,
@@ -172,8 +173,8 @@ const le = l(
         selectedContent: s
       })
     }
-  ) : /* @__PURE__ */ t(ne, { ...e, disabled: a });
-}, ce = k(
+  ) : /* @__PURE__ */ t(ie, { ...e, disabled: a });
+}, de = k(
   [
     "group/select-content relative flex max-h-(--available-height) w-(--anchor-width) flex-col overflow-hidden",
     "rounded-sm bg-surface",
@@ -201,7 +202,7 @@ const le = l(
       }
     }
   }
-), de = ({
+), me = ({
   ref: o,
   className: a,
   children: e,
@@ -210,8 +211,8 @@ const le = l(
   align: n = "start",
   initialFocus: i = !0,
   ...c
-}) => /* @__PURE__ */ t(Q, { "data-slot": "select-portal", children: /* @__PURE__ */ t(
-  U,
+}) => /* @__PURE__ */ t(U, { "data-slot": "select-portal", children: /* @__PURE__ */ t(
+  X,
   {
     "data-slot": "select-positioner",
     className: "pointer-events-auto z-select",
@@ -219,18 +220,18 @@ const le = l(
     sideOffset: s,
     align: n,
     children: /* @__PURE__ */ t(
-      X,
+      Y,
       {
         ref: o,
         "data-slot": "select-content",
         initialFocus: i,
-        className: l(ce({ side: r }), a),
+        className: l(de({ side: r }), a),
         ...c,
         children: e
       }
     )
   }
-) }), me = ({
+) }), ue = ({
   ref: o,
   className: a,
   renderItem: e,
@@ -241,7 +242,7 @@ const le = l(
     contextRequired: !0
   });
   return /* @__PURE__ */ t(
-    Z,
+    _,
     {
       ref: o,
       "data-slot": "select-list",
@@ -251,29 +252,29 @@ const le = l(
       ),
       ...r,
       children: s ? (n, i) => /* @__PURE__ */ u(
-        _,
+        $,
         {
           items: n.items,
           "data-slot": "select-group",
           children: [
-            i > 0 && /* @__PURE__ */ t(S, {}),
-            n.label && /* @__PURE__ */ t(ue, { children: n.label }),
-            /* @__PURE__ */ t($, { children: e })
+            i > 0 && /* @__PURE__ */ t(y, {}),
+            n.label && /* @__PURE__ */ t(pe, { children: n.label }),
+            /* @__PURE__ */ t(ee, { children: e })
           ]
         },
         n.label
       ) : e
     }
   );
-}, ue = ({ ref: o, className: a, ...e }) => /* @__PURE__ */ t(
-  ae,
+}, pe = ({ ref: o, className: a, ...e }) => /* @__PURE__ */ t(
+  re,
   {
     ref: o,
     "data-slot": "select-label",
     className: l("mb-4 px-8 pt-8 pb-0 body-3-semi-bold text-muted", a),
     ...e
   }
-), pe = l(
+), be = l(
   "group/item flex w-full min-w-0 cursor-pointer items-center gap-12 bg-base-transparent select-none",
   "rounded-sm p-8",
   "body-2 text-base",
@@ -281,28 +282,28 @@ const le = l(
   "data-highlighted:bg-base-transparent-hover",
   "active:bg-base-transparent-pressed",
   "data-disabled:cursor-not-allowed data-disabled:text-disabled"
-), be = ({
+), fe = ({
   ref: o,
   className: a,
   children: e,
   ...r
 }) => /* @__PURE__ */ u(
-  ee,
+  te,
   {
     ref: o,
     "data-slot": "select-item",
-    className: l(pe, a),
+    className: l(be, a),
     ...r,
     children: [
       e,
-      /* @__PURE__ */ t(te, { className: "ml-auto flex shrink-0 items-center justify-center", children: /* @__PURE__ */ t(H, { size: 24, className: "shrink-0 text-active" }) })
+      /* @__PURE__ */ t(oe, { className: "ml-auto flex shrink-0 items-center justify-center", children: /* @__PURE__ */ t(J, { size: 24, className: "shrink-0 text-active" }) })
     ]
   }
-), S = ({
+), y = ({
   ref: o,
   className: a,
   ...e
-}) => /* @__PURE__ */ t(J, { ref: o, className: l("mx-8 my-4 w-auto", a), ...e }), fe = ({ ref: o, className: a, ...e }) => /* @__PURE__ */ t(
+}) => /* @__PURE__ */ t(K, { ref: o, className: l("mx-8 my-4 w-auto", a), ...e }), he = ({ ref: o, className: a, ...e }) => /* @__PURE__ */ t(
   "span",
   {
     ref: o,
@@ -310,7 +311,7 @@ const le = l(
     className: l("truncate body-2", a),
     ...e
   }
-), he = ({
+), xe = ({
   ref: o,
   className: a,
   children: e,
@@ -324,7 +325,7 @@ const le = l(
     ...r,
     children: e
   }
-), xe = ({
+), ge = ({
   ref: o,
   className: a,
   children: e,
@@ -342,9 +343,9 @@ const le = l(
     ...r,
     children: e
   }
-), ge = ({
+), Se = ({
   className: o,
-  placeholder: a = "Search",
+  placeholder: a,
   helperText: e,
   status: r,
   "aria-invalid": s,
@@ -355,35 +356,35 @@ const le = l(
   const { registerSearch: m } = p({
     consumerName: "SelectSearch",
     contextRequired: !0
-  });
+  }), { t: b } = B();
   return F(() => m(), [m]), /* @__PURE__ */ t(
-    Y,
+    Z,
     {
-      render: (b) => /* @__PURE__ */ t(
-        B,
+      render: (f) => /* @__PURE__ */ t(
+        H,
         {
-          ...b,
+          ...f,
           "aria-invalid": s,
           helperText: e,
           status: r,
           suffix: n,
           onClear: i,
           hideClearButton: c,
-          placeholder: a,
+          placeholder: a ?? b("components.select.searchPlaceholder"),
           containerClassName: "rounded-b-none ring-inset",
           className: l(o, "rounded-b-none ring-inset")
         }
       )
     }
   );
-}, Se = ({
+}, ye = ({
   ref: o,
   className: a,
   title: e,
   description: r,
   ...s
 }) => /* @__PURE__ */ u(
-  oe,
+  ae,
   {
     ref: o,
     "data-slot": "select-empty-state",
@@ -399,32 +400,32 @@ const le = l(
     ]
   }
 );
-function Oe() {
+function Ue() {
   return {
-    Select: re,
-    SelectTrigger: ie,
-    SelectContent: de,
-    SelectSearch: ge,
-    SelectList: me,
-    SelectItemText: fe,
-    SelectItemContent: he,
-    SelectItemDescription: xe,
-    SelectItem: be,
-    SelectSeparator: S,
-    SelectEmptyState: Se
+    Select: le,
+    SelectTrigger: ce,
+    SelectContent: me,
+    SelectSearch: Se,
+    SelectList: ue,
+    SelectItemText: he,
+    SelectItemContent: xe,
+    SelectItemDescription: ge,
+    SelectItem: fe,
+    SelectSeparator: y,
+    SelectEmptyState: ye
   };
 }
 export {
-  re as Select,
-  de as SelectContent,
-  Se as SelectEmptyState,
-  be as SelectItem,
-  he as SelectItemContent,
-  xe as SelectItemDescription,
-  fe as SelectItemText,
-  me as SelectList,
-  ge as SelectSearch,
-  S as SelectSeparator,
-  ie as SelectTrigger,
-  Oe as createSelect
+  le as Select,
+  me as SelectContent,
+  ye as SelectEmptyState,
+  fe as SelectItem,
+  xe as SelectItemContent,
+  ge as SelectItemDescription,
+  he as SelectItemText,
+  ue as SelectList,
+  Se as SelectSearch,
+  y as SelectSeparator,
+  ce as SelectTrigger,
+  Ue as createSelect
 };

package/dist/lib/Components/core/SideBar/SideBar.js

@@ -3,11 +3,11 @@ import { createSafeContext as V, cn as m, useDisabledContext as q } from "../../
 import { cva as C } from "class-variance-authority";
 import { useCallback as S } from "react";
 import { Tooltip as N, TooltipTrigger as T, TooltipContent as w } from "../Tooltip/Tooltip.js";
-import { useCommonTranslation as A } from "../../../../i18n/useCommonTranslation.js";
+import { useCommonTranslation as A } from "../../../../translations/translations.js";
 import { useControllableState as B } from "../../../../utils/useControllableState/useControllableState.js";
 import { ExpandRight as z } from "../../symbols/icons/ExpandRight.js";
 import { ExpandLeft as E } from "../../symbols/icons/ExpandLeft.js";
-const [O, L] = V("SideBar"), f = {
+const [F, y] = V("SideBar"), f = {
   root: C(
     [
       "flex h-full flex-col justify-between gap-16 overflow-y-auto rounded-xl bg-surface-transparent p-16",
@@ -50,13 +50,13 @@ const [O, L] = V("SideBar"), f = {
       }
     }
   )
-}, D = ({
+}, O = ({
   ref: n,
   collapsed: t,
-  defaultCollapsed: r = !1,
+  defaultCollapsed: s = !1,
   onCollapsedChange: a,
   active: o,
-  defaultActive: s,
+  defaultActive: r,
   onActiveChange: i,
   children: d,
   className: l,
@@ -64,15 +64,15 @@ const [O, L] = V("SideBar"), f = {
 }) => {
   const { t: c } = A(), [b, g] = B({
     prop: t,
-    defaultProp: r,
+    defaultProp: s,
     onChange: a
   }), [v, u] = B({
     prop: o,
-    defaultProp: s ?? "",
+    defaultProp: r ?? "",
     onChange: i ? (h) => i(h) : void 0
   });
   return /* @__PURE__ */ e(
-    O,
+    F,
     {
       value: { collapsed: b, setCollapsed: g, active: v, onActiveChange: u },
       children: /* @__PURE__ */ e(
@@ -87,39 +87,39 @@ const [O, L] = V("SideBar"), f = {
       )
     }
   );
-}, F = ({
+}, D = ({
   ref: n,
   children: t,
-  className: r,
+  className: s,
   ...a
 }) => /* @__PURE__ */ e(
   "div",
   {
     ref: n,
-    className: m(f.section(), r),
+    className: m(f.section(), s),
     ...a,
     children: t
   }
 ), W = ({
   ref: n,
   children: t,
-  className: r,
+  className: s,
   ...a
 }) => /* @__PURE__ */ e(
   "div",
   {
     ref: n,
-    className: m("mt-auto", f.section(), r),
+    className: m("mt-auto", f.section(), s),
     ...a,
     children: t
   }
 ), G = ({
   ref: n,
   value: t,
-  icon: r,
+  icon: s,
   activeIcon: a,
   label: o,
-  tooltipContent: s,
+  tooltipContent: r,
   disabled: i = !1,
   className: d,
   onClick: l,
@@ -128,10 +128,10 @@ const [O, L] = V("SideBar"), f = {
   const c = q({
     consumerName: "SideBarItem",
     mergeWith: { disabled: i }
-  }), { collapsed: b, active: g, onActiveChange: v } = L({
+  }), { collapsed: b, active: g, onActiveChange: v } = y({
     consumerName: "SideBarItem",
     contextRequired: !0
-  }), u = g === t, h = u ? a : r, y = s ?? o, I = S(
+  }), u = g === t, h = u ? a : s, I = r ?? o, L = S(
     (P) => {
       c || (l?.(P), v?.(t));
     },
@@ -145,7 +145,7 @@ const [O, L] = V("SideBar"), f = {
       ref: n,
       type: "button",
       disabled: c,
-      onClick: I,
+      onClick: L,
       className: m(
         f.item({ active: u, disabled: c }),
         d
@@ -157,19 +157,19 @@ const [O, L] = V("SideBar"), f = {
   );
   return /* @__PURE__ */ x(N, { open: b ? void 0 : !1, children: [
     /* @__PURE__ */ e(T, { asChild: !0, children: k }),
-    /* @__PURE__ */ e(w, { side: "right", sideOffset: 8, children: y })
+    /* @__PURE__ */ e(w, { side: "right", sideOffset: 8, children: I })
   ] });
 }, H = ({
   className: n,
   tooltipContent: t,
-  ...r
+  ...s
 }) => {
-  const { t: a } = A(), { collapsed: o, setCollapsed: s } = L({
+  const { t: a } = A(), { collapsed: o, setCollapsed: r } = y({
     consumerName: "SideBarCollapseToggle",
     contextRequired: !0
   }), i = S(() => {
-    s(!o);
-  }, [o, s]), d = o ? z : E, l = /* @__PURE__ */ e(
+    r(!o);
+  }, [o, r]), d = o ? z : E, l = /* @__PURE__ */ e(
     "button",
     {
       type: "button",
@@ -179,7 +179,7 @@ const [O, L] = V("SideBar"), f = {
         n
       ),
       "aria-label": a(o ? "components.sideBar.expandAriaLabel" : "components.sideBar.collapseAriaLabel"),
-      ...r,
+      ...s,
       children: /* @__PURE__ */ e(d, { size: 20 })
     }
   ), p = t ?? a("components.sideBar.collapseAriaLabel");
@@ -190,18 +190,18 @@ const [O, L] = V("SideBar"), f = {
 };
 function $() {
   return {
-    SideBar: D,
-    SideBarLeading: F,
+    SideBar: O,
+    SideBarLeading: D,
     SideBarTrailing: W,
     SideBarItem: G,
     SideBarCollapseToggle: H
   };
 }
 export {
-  D as SideBar,
+  O as SideBar,
   H as SideBarCollapseToggle,
   G as SideBarItem,
-  F as SideBarLeading,
+  D as SideBarLeading,
   W as SideBarTrailing,
   $ as createSideBar
 };

package/dist/lib/Components/core/Spinner/Spinner.js

@@ -1,17 +1,17 @@
 import { jsx as o } from "react/jsx-runtime";
 import { cn as s } from "../../../../libs/utils-shared/dist/index.js";
-import { useCommonTranslation as a } from "../../../../i18n/useCommonTranslation.js";
+import { useCommonTranslation as a } from "../../../../translations/translations.js";
 const c = ({
   ref: r,
-  className: e,
+  className: t,
   size: n = 16,
-  ...t
+  ...e
 }) => {
   const { t: i } = a();
   return /* @__PURE__ */ o(
     "svg",
     {
-      className: s("shrink-0 animate-spin text-base", e),
+      className: s("shrink-0 animate-spin text-base", t),
       xmlns: "http://www.w3.org/2000/svg",
       width: n,
       height: n,
@@ -20,7 +20,7 @@ const c = ({
       "aria-label": i("components.spinner.loadingAriaLabel"),
       role: "img",
       ref: r,
-      ...t,
+      ...e,
       children: /* @__PURE__ */ o(
         "path",
         {