@ledgerhq/lumen-ui-react 0.1.15 → 0.1.17

package/dist/lib/Components/BaseInput/BaseInput.js

@@ -1,150 +1,143 @@
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import { useDisabledContext as _, cn as a } from "../../../libs/utils-shared/dist/index.js";
-import d from "react";
-import { useCommonTranslation as $ } from "../../../i18n/useCommonTranslation.js";
-import { InteractiveIcon as q } from "../InteractiveIcon/InteractiveIcon.js";
-import { DeleteCircleFill as x } from "../../Symbols/Icons/DeleteCircleFill.js";
-const H = a(
+import { jsxs as u, jsx as t } from "react/jsx-runtime";
+import { useDisabledContext as O, useMergedRef as $, cn as n } from "../../../libs/utils-shared/dist/index.js";
+import { useRef as q, useId as H, useState as P, useCallback as U } from "react";
+import { useCommonTranslation as W } from "../../../i18n/useCommonTranslation.js";
+import { InteractiveIcon as G } from "../InteractiveIcon/InteractiveIcon.js";
+import { DeleteCircleFill as w } from "../../Symbols/Icons/DeleteCircleFill.js";
+const J = n(
   "group relative flex h-48 w-full cursor-text items-center gap-8 rounded-sm bg-muted px-16 transition-colors",
   "focus-within:ring-2 focus-within:ring-active hover:bg-muted-hover",
   "has-disabled:cursor-not-allowed has-disabled:bg-disabled has-disabled:text-disabled",
   "has-invalid:border-error has-invalid:ring-1 has-invalid:ring-error",
   'has-[input[aria-invalid="true"]]:border-error has-[input[aria-invalid="true"]]:ring-1 has-[input[aria-invalid="true"]]:ring-error'
-), P = a(
+), K = n(
   "peer w-full flex-1 bg-muted body-1 text-base caret-active outline-hidden transition-colors",
   "group-hover:bg-muted-hover group-disabled:bg-disabled",
   "group-has-disabled:cursor-not-allowed group-has-disabled:bg-disabled group-has-disabled:text-disabled",
   "placeholder:text-muted group-has-disabled:placeholder:text-disabled",
   "[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
   "truncate"
-), U = a(
+), Q = n(
   "pointer-events-none absolute top-6 left-16 origin-left body-4 text-muted transition-all duration-300",
   "peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:scale-100 peer-placeholder-shown:body-2",
   "group-has-disabled:text-disabled",
   "peer-focus:top-6 peer-focus:translate-y-0 peer-focus:body-4",
   "w-[calc(100%-var(--size-56))] truncate"
-), W = ({
-  ref: y,
-  className: I,
-  containerClassName: C,
-  inputClassName: S,
-  labelClassName: N,
-  label: u,
-  id: k,
+), X = ({
+  ref: x,
+  className: y,
+  containerClassName: I,
+  inputClassName: C,
+  labelClassName: S,
+  label: l,
+  id: N,
   disabled: R,
-  errorMessage: o,
-  suffix: B,
-  prefix: D,
-  onClear: E,
+  errorMessage: r,
+  suffix: k,
+  prefix: B,
+  onClear: D,
   hideClearButton: j = !1,
-  "aria-invalid": b,
-  onChange: h,
-  ...i
+  "aria-invalid": c,
+  onChange: p,
+  ...a
 }) => {
-  const m = _({
+  const b = O({
     consumerName: "BaseInput",
     mergeWith: { disabled: R }
-  }), { t: z } = $(), n = d.useRef(null), F = d.useId(), c = k || `input-${F}`, L = b || (o ? !0 : void 0), s = i.value !== void 0, [T, f] = d.useState(
-    i.defaultValue?.toString() || ""
-  ), V = d.useCallback(
-    (t) => {
-      s || f(t.target.value), h?.(t);
+  }), { t: z } = W(), e = q(null), E = H(), d = N || `input-${E}`, F = c || (r ? !0 : void 0), s = a.value !== void 0, [L, h] = P(
+    a.defaultValue?.toString() || ""
+  ), T = U(
+    (o) => {
+      s || h(o.target.value), p?.(o);
     },
-    [s, h]
-  ), v = (s ? !!i.value && i.value.toString().length > 0 : T.length > 0) && !m && !j, g = `${c}-error`, A = () => {
-    if (!n.current) return;
+    [s, p]
+  ), m = (s ? !!a.value && a.value.toString().length > 0 : L.length > 0) && !b && !j, v = `${d}-error`, V = () => {
+    if (!e.current) return;
     Object.getOwnPropertyDescriptor(
       window.HTMLInputElement.prototype,
       "value"
-    )?.set?.call(n.current, ""), s || f("");
-    const l = new Event("input", { bubbles: !0 });
-    n.current.dispatchEvent(l), n.current.focus(), E?.();
-  };
-  function O(...t) {
-    return (l) => {
-      t.forEach((e) => {
-        e && (typeof e == "function" ? e(l) : e.current = l);
-      });
-    };
-  }
-  return /* @__PURE__ */ p("div", { className: I, children: [
-    /* @__PURE__ */ p(
+    )?.set?.call(e.current, ""), s || h("");
+    const g = new Event("input", { bubbles: !0 });
+    e.current.dispatchEvent(g), e.current.focus(), D?.();
+  }, A = $(x, e);
+  return /* @__PURE__ */ u("div", { className: y, children: [
+    /* @__PURE__ */ u(
       "div",
       {
-        className: a(H, C),
-        onPointerDown: (t) => {
-          if (t.target.closest("input, button, a")) return;
-          const e = n.current;
-          if (!e) return;
-          const w = e.value.length > 0 ? e.value.length : 0;
+        className: n(J, I),
+        onPointerDown: (o) => {
+          if (o.target.closest("input, button, a")) return;
+          const i = e.current;
+          if (!i) return;
+          const f = i.value.length > 0 ? i.value.length : 0;
           window.requestAnimationFrame(() => {
             try {
-              e.setSelectionRange(w, w);
+              i.setSelectionRange(f, f);
             } catch {
             }
-            e.focus();
+            i.focus();
           });
         },
         children: [
-          D,
-          /* @__PURE__ */ r(
+          B,
+          /* @__PURE__ */ t(
             "input",
             {
-              ref: O(y, n),
-              id: c,
-              disabled: m,
+              ref: A,
+              id: d,
+              disabled: b,
               placeholder: " ",
-              "aria-invalid": L,
-              "aria-describedby": o ? g : void 0,
-              className: a(
-                P,
-                u && "pt-12 body-2",
-                S
+              "aria-invalid": F,
+              "aria-describedby": r ? v : void 0,
+              className: n(
+                K,
+                l && "pt-12 body-2",
+                C
               ),
-              onChange: V,
-              ...i
+              onChange: T,
+              ...a
             }
           ),
-          u && /* @__PURE__ */ r(
+          l && /* @__PURE__ */ t(
             "label",
             {
-              htmlFor: c,
-              className: a(
-                U,
-                o && "text-error",
-                N
+              htmlFor: d,
+              className: n(
+                Q,
+                r && "text-error",
+                S
               ),
-              children: u
+              children: l
             }
           ),
-          v && /* @__PURE__ */ r(
-            q,
+          m && /* @__PURE__ */ t(
+            G,
             {
               iconType: "filled",
-              onClick: A,
+              onClick: V,
               "aria-label": z("components.baseInput.clearInputAriaLabel"),
-              children: /* @__PURE__ */ r(x, { size: 20 })
+              children: /* @__PURE__ */ t(w, { size: 20 })
             }
           ),
-          !v && B
+          !m && k
         ]
       }
     ),
-    o && /* @__PURE__ */ p(
+    r && /* @__PURE__ */ u(
       "div",
       {
-        id: g,
+        id: v,
         className: "mt-8 flex items-center gap-2 body-3 text-error",
         role: "alert",
         children: [
-          /* @__PURE__ */ r(x, { size: 16, className: "shrink-0 text-error" }),
-          /* @__PURE__ */ r("span", { children: o })
+          /* @__PURE__ */ t(w, { size: 16, className: "text-error" }),
+          /* @__PURE__ */ t("span", { children: r })
         ]
       }
     )
   ] });
 };
-W.displayName = "BaseInput";
+X.displayName = "BaseInput";
 export {
-  W as BaseInput
+  X as BaseInput
 };

package/dist/lib/Components/CardButton/CardButton.js

@@ -18,10 +18,10 @@ const h = f(
 ), x = ({
   ref: i,
   className: d,
-  appearance: l,
-  icon: n,
-  title: o,
-  description: s,
+  appearance: o,
+  icon: l,
+  title: n,
+  description: t,
   hideChevron: r,
   disabled: u,
   ...b
@@ -29,7 +29,7 @@ const h = f(
   const c = m({
     consumerName: "CardButton",
     mergeWith: { disabled: u }
-  }), t = n;
+  }), s = l;
   return /* @__PURE__ */ a(
     "button",
     {
@@ -37,22 +37,22 @@ const h = f(
       className: p(
         d,
         h({
-          appearance: l
+          appearance: o
         })
       ),
       disabled: c,
       ...b,
       children: [
-        t && /* @__PURE__ */ e(t, { size: 24, className: "shrink-0" }),
+        s && /* @__PURE__ */ e(s, { size: 24 }),
         /* @__PURE__ */ a("div", { className: "flex min-w-0 flex-1 flex-col gap-4 text-left", children: [
-          /* @__PURE__ */ e("div", { className: "min-w-0 truncate body-2-semi-bold", children: o }),
-          s && /* @__PURE__ */ e("div", { className: "line-clamp-2 min-w-0 body-3 text-muted group-disabled:text-disabled", children: s })
+          /* @__PURE__ */ e("div", { className: "min-w-0 truncate body-2-semi-bold", children: n }),
+          t && /* @__PURE__ */ e("div", { className: "line-clamp-2 min-w-0 body-3 text-muted group-disabled:text-disabled", children: t })
         ] }),
         !r && /* @__PURE__ */ e(
           v,
           {
             size: 24,
-            className: "shrink-0 text-muted group-disabled:text-disabled"
+            className: "text-muted group-disabled:text-disabled"
           }
         )
       ]

package/dist/lib/Components/Dialog/Dialog.js

@@ -1,8 +1,8 @@
 import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { createSafeContext as u, cn as l } from "../../../libs/utils-shared/dist/index.js";
+import { createSafeContext as f, cn as l } from "../../../libs/utils-shared/dist/index.js";
 import * as n from "@radix-ui/react-dialog";
-import { cva as f } from "class-variance-authority";
-const [y, r] = u("Dialog"), h = f(
+import { cva as u } from "class-variance-authority";
+const [y, r] = f("Dialog"), p = u(
   [
     "flex w-400 max-w-[calc(100%-2rem)] flex-col overflow-hidden rounded-2xl bg-canvas-sheet pb-24",
     "fixed top-[50%] left-[50%] z-dialog-content translate-[-50%]",
@@ -11,33 +11,33 @@ const [y, r] = u("Dialog"), h = f(
   {
     variants: {
       height: {
-        hug: "max-h-560",
+        fit: "max-h-560",
         fixed: "h-560"
       }
     },
     defaultVariants: {
-      height: "hug"
+      height: "fit"
     }
   }
 );
-function k({ height: a = "hug", ...t }) {
-  return /* @__PURE__ */ o(y, { value: { height: a }, children: /* @__PURE__ */ o(n.Root, { "data-slot": "dialog", ...t }) });
+function k({ height: t = "fit", ...a }) {
+  return /* @__PURE__ */ o(y, { value: { height: t }, children: /* @__PURE__ */ o(n.Root, { "data-slot": "dialog", ...a }) });
 }
-function w({ ...a }) {
-  return /* @__PURE__ */ o(n.Trigger, { "data-slot": "dialog-trigger", ...a });
+function w({ ...t }) {
+  return /* @__PURE__ */ o(n.Trigger, { "data-slot": "dialog-trigger", ...t });
 }
-function p({
-  ...a
+function x({
+  ...t
 }) {
-  return /* @__PURE__ */ o(n.Portal, { "data-slot": "dialog-portal", ...a });
+  return /* @__PURE__ */ o(n.Portal, { "data-slot": "dialog-portal", ...t });
 }
-const s = ({ ref: a, className: t, ...e }) => /* @__PURE__ */ o(
+const s = ({ ref: t, className: a, ...e }) => /* @__PURE__ */ o(
   n.Overlay,
   {
-    ref: a,
+    ref: t,
     "data-slot": "dialog-overlay",
     className: l(
-      t,
+      a,
       "fixed inset-0 z-dialog-overlay bg-canvas-overlay backdrop-blur-sm data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in"
     ),
     ...e
@@ -45,84 +45,84 @@ const s = ({ ref: a, className: t, ...e }) => /* @__PURE__ */ o(
 );
 s.displayName = "DialogOverlay";
 function B({
-  className: a,
-  children: t,
+  className: t,
+  children: a,
   ...e
 }) {
   const { height: i } = r({
     consumerName: "DialogContent",
     contextRequired: !0
   });
-  return /* @__PURE__ */ m(p, { "data-slot": "dialog-portal", children: [
+  return /* @__PURE__ */ m(x, { "data-slot": "dialog-portal", children: [
     /* @__PURE__ */ o(s, {}),
     /* @__PURE__ */ o(
       n.Content,
       {
         "data-slot": "dialog-content",
-        className: l(h({ height: i }), a),
+        className: l(p({ height: i }), t),
         ...e,
-        children: t
+        children: a
       }
     )
   ] });
 }
-const x = ({
-  ref: a,
-  className: t,
+const h = ({
+  ref: t,
+  className: a,
   children: e,
   scrollbarWidth: i = "none",
   style: d,
-  ...g
+  ...c
 }) => {
-  const { height: c } = r({
+  const { height: g } = r({
     consumerName: "DialogBody",
     contextRequired: !0
   });
   return /* @__PURE__ */ o(
     "div",
     {
-      ref: a,
+      ref: t,
       "data-slot": "dialog-body",
       style: d,
       className: l(
         "-mb-24 flex min-h-0 grow flex-col overflow-y-auto px-24 pb-24",
-        c === "hug" ? "basis-auto" : "basis-0",
-        t,
+        g === "fit" ? "basis-auto" : "basis-0",
+        a,
         i === "auto" ? "scrollbar-custom" : "scrollbar-none"
       ),
-      ...g,
+      ...c,
       children: e
     }
   );
 };
-x.displayName = "DialogBody";
+h.displayName = "DialogBody";
 const v = ({
-  ref: a,
-  className: t,
+  ref: t,
+  className: a,
   children: e,
   ...i
 }) => /* @__PURE__ */ o(
   "div",
   {
-    ref: a,
+    ref: t,
     "data-slot": "dialog-body-sticky-content",
-    className: l("sticky top-0 bg-canvas-sheet py-8", t),
+    className: l("sticky top-0 bg-canvas-sheet py-8", a),
     ...i,
     children: e
   }
 );
 v.displayName = "DialogBodyStickyContent";
 const D = ({
-  ref: a,
-  className: t,
+  ref: t,
+  className: a,
   children: e,
   ...i
 }) => /* @__PURE__ */ o(
   "div",
   {
-    ref: a,
+    ref: t,
     "data-slot": "dialog-footer",
-    className: l("flex shrink-0 justify-end gap-8 px-24 pt-24", t),
+    className: l("flex shrink-0 justify-end gap-8 px-24 pt-24", a),
     ...i,
     children: e
   }
@@ -130,7 +130,7 @@ const D = ({
 D.displayName = "DialogFooter";
 export {
   k as Dialog,
-  x as DialogBody,
+  h as DialogBody,
   v as DialogBodyStickyContent,
   B as DialogContent,
   D as DialogFooter,

package/dist/lib/Components/Dialog/types.d.ts

@@ -1,5 +1,5 @@
 import { ComponentPropsWithRef, ReactNode } from 'react';
-export type DialogHeight = 'hug' | 'fixed';
+export type DialogHeight = 'fit' | 'fixed';
 export type DialogProps = {
     /**
      * The content to display inside the dialog.
@@ -22,9 +22,9 @@ export type DialogProps = {
     defaultOpen?: boolean;
     /**
      * The height behavior of the dialog.
-     * - `hug`: Content-fit height up to max 560px (default)
+     * - `fit`: Content-fit height up to max 560px (default)
      * - `fixed`: Always exactly 560px height
-     * @default 'hug'
+     * @default 'fit'
      */
     height?: DialogHeight;
     /**

package/dist/lib/Components/Icon/Icon.js

@@ -1,7 +1,7 @@
 import { cn as s } from "../../../libs/utils-shared/dist/index.js";
 import { cva as a } from "class-variance-authority";
 import { createElement as k } from "react";
-const l = a("inline-block", {
+const h = a("inline-block shrink-0", {
   variants: {
     size: {
       12: "icon-w-12 icon-h-12 icon-stroke-12",
@@ -17,7 +17,7 @@ const l = a("inline-block", {
   defaultVariants: {
     size: 24
   }
-}), h = ({
+}), l = ({
   ref: o,
   size: n = 24,
   className: i = "",
@@ -33,12 +33,12 @@ const l = a("inline-block", {
     "aria-hidden": "true",
     xmlns: r,
     viewBox: e,
-    className: s(i, l({ size: n }), "inline-block"),
+    className: s(i, h({ size: n }), "inline-block"),
     ...t
   },
   c
 );
-h.displayName = "Icon";
+l.displayName = "Icon";
 export {
-  h as Icon
+  l as Icon
 };

package/dist/lib/Components/Icon/createIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createIcon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Icon/createIcon.ts"],"names":[],"mappings":"AAKA,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC;;;;;;GAMG;AACH,QAAA,MAAM,UAAU,GACd,UAAU,MAAM,EAChB,SAAS,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;6CAOjD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;;CAkB/B,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"createIcon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Icon/createIcon.ts"],"names":[],"mappings":"AAKA,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC;;;;;;GAMG;AACH,QAAA,MAAM,UAAU,GACd,UAAU,MAAM,EAChB,SAAS,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;6CAOjD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;;CAkB/B,CAAC;AAGF,eAAe,UAAU,CAAC"}

package/dist/lib/Components/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Link/Link.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAmCpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,IAAI;6HAYd,SAAS;;CAsDX,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Link/Link.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAmCpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,IAAI;6HAYd,SAAS;;CAgDX,CAAC"}

package/dist/lib/Components/Link/Link.js

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as l, Fragment as c } from "react/jsx-runtime";
-import { useDisabledContext as h, cn as x } from "../../../libs/utils-shared/dist/index.js";
+import { useDisabledContext as x, cn as h } from "../../../libs/utils-shared/dist/index.js";
 import { Slot as k } from "@radix-ui/react-slot";
-import { cva as N } from "class-variance-authority";
-import { ExternalLink as g } from "../../Symbols/Icons/ExternalLink.js";
-const y = N(
+import { cva as g } from "class-variance-authority";
+import { ExternalLink as y } from "../../Symbols/Icons/ExternalLink.js";
+const z = g(
   "inline-flex w-fit max-w-full items-center justify-center transition-colors focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-focus",
   {
     variants: {
@@ -33,62 +33,55 @@ const y = N(
       disabled: !1
     }
   }
-), z = ({
+), N = ({
   ref: d,
   className: m,
-  children: s,
+  children: a,
   appearance: p,
-  size: t = "inherit",
+  size: i = "inherit",
   underline: f = !0,
   icon: u,
   isExternal: n = !1,
-  asChild: i = !1,
+  asChild: t = !1,
   disabled: b,
   ...v
 }) => {
-  const a = h({
+  const s = x({
     consumerName: "Link",
     mergeWith: { disabled: b }
-  }), r = t ? {
+  }), r = i ? {
     sm: 16,
     md: 20
-  }[t] : 20, o = u;
+  }[i] : 20, o = u;
   return /* @__PURE__ */ e(
-    i ? k : "a",
+    t ? k : "a",
     {
       ref: d,
-      className: x(
+      className: h(
         m,
-        y({
+        z({
           appearance: p,
-          size: t,
+          size: i,
           underline: f,
-          disabled: a
+          disabled: s
         })
       ),
-      "aria-disabled": a || void 0,
-      target: n && !i ? "_blank" : void 0,
-      rel: n && !i ? "noopener noreferrer" : void 0,
+      "aria-disabled": s || void 0,
+      target: n && !t ? "_blank" : void 0,
+      rel: n && !t ? "noopener noreferrer" : void 0,
       ...v,
-      children: i ? s : /* @__PURE__ */ l(c, { children: [
-        o && /* @__PURE__ */ e(o, { size: r, className: "shrink-0" }),
-        /* @__PURE__ */ e("span", { className: "min-w-0 truncate", children: s }),
+      children: t ? a : /* @__PURE__ */ l(c, { children: [
+        o && /* @__PURE__ */ e(o, { size: r }),
+        /* @__PURE__ */ e("span", { className: "min-w-0 truncate", children: a }),
         n && /* @__PURE__ */ l(c, { children: [
-          /* @__PURE__ */ e(
-            g,
-            {
-              size: r,
-              className: "shrink-0",
-              "aria-hidden": "true"
-            }
-          ),
+          /* @__PURE__ */ e(y, { size: r, "aria-hidden": "true" }),
           /* @__PURE__ */ e("span", { className: "sr-only", children: "(opens in a new tab)" })
         ] })
       ] })
     }
   );
 };
-z.displayName = "Link";
+N.displayName = "Link";
 export {
-  z as Link
+  N as Link
 };