@ledgerhq/lumen-ui-react 0.0.80 → 0.0.82

package/dist/lib/Components/AmountInput/AmountInput.js

@@ -1,8 +1,8 @@
-import { jsxs as I, jsx as l } from "react/jsx-runtime";
-import { getFontSize as V, cn as a, textFormatter as F } from "../../../libs/utils-shared/dist/index.js";
+import { jsxs as V, jsx as l } from "react/jsx-runtime";
+import { getFontSize as j, cn as a, textFormatter as F } from "../../../libs/utils-shared/dist/index.js";
 import { cva as z } from "class-variance-authority";
-import M, { useRef as p, useState as h, useMemo as _, useLayoutEffect as q, useEffect as D } from "react";
-const L = z(
+import { useRef as p, useState as h, useMemo as M, useLayoutEffect as q, useEffect as D } from "react";
+const G = z(
   [
     "bg-transparent heading-0 caret-active outline-hidden transition-colors",
     "text-base placeholder:text-muted-subtle",
@@ -28,107 +28,103 @@ const L = z(
   "group-has-[input:placeholder-shown]:text-muted-subtle",
   "group-has-[input:disabled]:cursor-not-allowed group-has-[input:disabled]:text-disabled",
   'group-has-[input[aria-invalid="true"]]:text-error'
-), W = M.forwardRef(
-  ({
-    className: x,
-    currencyText: r,
-    currencyPosition: d = "left",
-    disabled: w,
-    maxIntegerLength: S = 9,
-    maxDecimalLength: v = 9,
-    allowDecimals: y = !0,
-    thousandsSeparator: R = !0,
-    value: u,
-    onChange: C,
-    ...N
-  }, A) => {
-    const c = p(null), s = p(null), [n, f] = h(u.toString()), [E, m] = h(!1), g = p(n);
-    function j(...t) {
-      return (e) => {
-        t.forEach((o) => {
-          o && (typeof o == "function" ? o(e) : o.current = e);
-        });
-      };
-    }
-    const i = _(
-      () => V(n) + "px",
-      [n]
-    );
-    q(() => {
-      if (c.current && s.current) {
-        const t = c.current.offsetWidth, e = n === "" ? 33 : 8;
-        s.current.style.width = `${t + e}px`;
-      }
-    }, [n]), D(() => {
-      f(u.toString());
-    }, [u]);
-    const k = (t) => {
-      const e = F(t.target.value, {
-        allowDecimals: y,
-        thousandsSeparator: R,
-        maxIntegerLength: S,
-        maxDecimalLength: v
+), H = ({
+  ref: x,
+  className: S,
+  currencyText: r,
+  currencyPosition: d = "left",
+  disabled: v,
+  maxIntegerLength: w = 9,
+  maxDecimalLength: y = 9,
+  allowDecimals: C = !0,
+  thousandsSeparator: N = !0,
+  value: u,
+  onChange: A,
+  ...R
+}) => {
+  const c = p(null), s = p(null), [n, f] = h(u.toString()), [k, m] = h(!1), g = p(n);
+  function E(...t) {
+    return (e) => {
+      t.forEach((o) => {
+        o && (typeof o == "function" ? o(e) : o.current = e);
       });
-      f(e), C({ ...t, target: { ...t.target, value: e } }), e !== g.current && m(!0), g.current = e;
     };
-    return /* @__PURE__ */ I(
-      "div",
-      {
-        className: "group relative flex items-center justify-center transition-transform",
-        onPointerDown: () => {
-          const t = s.current;
-          t && window.requestAnimationFrame(() => {
-            t.focus();
-          });
-        },
-        children: [
-          r && d === "left" && /* @__PURE__ */ l(
-            "span",
-            {
-              className: a(b, "shrink-0"),
-              style: { fontSize: i, letterSpacing: "normal" },
-              children: r
-            }
-          ),
-          /* @__PURE__ */ l(
-            "span",
-            {
-              ref: c,
-              className: a("invisible absolute heading-0"),
-              "aria-hidden": "true",
-              style: { fontSize: i, letterSpacing: "normal" },
-              children: n
-            }
-          ),
-          /* @__PURE__ */ l(
-            "input",
-            {
-              ref: j(A, s),
-              type: "text",
-              inputMode: "decimal",
-              disabled: w,
-              value: n,
-              onChange: k,
-              onAnimationEnd: () => m(!1),
-              className: a(L({ isChanging: E }), x),
-              ...N,
-              style: { fontSize: i, letterSpacing: "normal" }
-            }
-          ),
-          r && d === "right" && /* @__PURE__ */ l(
-            "span",
-            {
-              className: a(b, "shrink-0"),
-              style: { fontSize: i, letterSpacing: "normal" },
-              children: r
-            }
-          )
-        ]
-      }
-    );
   }
-);
-W.displayName = "AmountInput";
+  const i = M(() => j(n) + "px", [n]);
+  q(() => {
+    if (c.current && s.current) {
+      const t = c.current.offsetWidth, e = n === "" ? 33 : 8;
+      s.current.style.width = `${t + e}px`;
+    }
+  }, [n]), D(() => {
+    f(u.toString());
+  }, [u]);
+  const I = (t) => {
+    const e = F(t.target.value, {
+      allowDecimals: C,
+      thousandsSeparator: N,
+      maxIntegerLength: w,
+      maxDecimalLength: y
+    });
+    f(e), A({ ...t, target: { ...t.target, value: e } }), e !== g.current && m(!0), g.current = e;
+  };
+  return /* @__PURE__ */ V(
+    "div",
+    {
+      className: "group relative flex items-center justify-center transition-transform",
+      onPointerDown: () => {
+        const t = s.current;
+        t && window.requestAnimationFrame(() => {
+          t.focus();
+        });
+      },
+      children: [
+        r && d === "left" && /* @__PURE__ */ l(
+          "span",
+          {
+            className: a(b, "shrink-0"),
+            style: { fontSize: i, letterSpacing: "normal" },
+            children: r
+          }
+        ),
+        /* @__PURE__ */ l(
+          "span",
+          {
+            ref: c,
+            className: a("invisible absolute heading-0"),
+            "aria-hidden": "true",
+            style: { fontSize: i, letterSpacing: "normal" },
+            children: n
+          }
+        ),
+        /* @__PURE__ */ l(
+          "input",
+          {
+            ref: E(x, s),
+            type: "text",
+            inputMode: "decimal",
+            disabled: v,
+            value: n,
+            onChange: I,
+            onAnimationEnd: () => m(!1),
+            className: a(G({ isChanging: k }), S),
+            ...R,
+            style: { fontSize: i, letterSpacing: "normal" }
+          }
+        ),
+        r && d === "right" && /* @__PURE__ */ l(
+          "span",
+          {
+            className: a(b, "shrink-0"),
+            style: { fontSize: i, letterSpacing: "normal" },
+            children: r
+          }
+        )
+      ]
+    }
+  );
+};
+H.displayName = "AmountInput";
 export {
-  W as AmountInput
+  H as AmountInput
 };

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

@@ -1,3 +1,4 @@
+import { ChangeEvent, ComponentPropsWithRef } from 'react';
 export type AmountInputProps = {
     /**
      * The controlled value of the input
@@ -8,7 +9,7 @@ export type AmountInputProps = {
      * Change handler
      * @required
      */
-    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
     /**
      * The currency text (e.g. USD, EUR)
      */
@@ -42,5 +43,5 @@ export type AmountInputProps = {
      * @default true
      */
     thousandsSeparator?: boolean;
-} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'value' | 'onChange'>;
+} & Omit<ComponentPropsWithRef<'input'>, 'size' | 'prefix' | 'value' | 'onChange'>;
 //# sourceMappingURL=types.d.ts.map

package/dist/lib/Components/AmountInput/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountInput/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;OAGG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,GAAG,IAAI,CACN,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CACzC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;OAGG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,GAAG,IAAI,CACN,qBAAqB,CAAC,OAAO,CAAC,EAC9B,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CACzC,CAAC"}

package/dist/lib/Components/Avatar/Avatar.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import { AvatarProps } from './types';
 /**
  * A circular avatar component that displays a user image or fallback icon.
  *
@@ -15,12 +15,8 @@ import { default as React } from 'react';
  * // With notification indicator
  * <Avatar src="https://example.com/photo.jpg" showNotification />
  */
-export declare const Avatar: React.ForwardRefExoticComponent<{
-    src?: string;
-    alt?: string;
-    size?: "sm" | "md";
-    showNotification?: boolean;
-    className?: string;
-    imgLoading?: "eager" | "lazy";
-} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const Avatar: {
+    ({ ref, className, src, alt, size, imgLoading, showNotification, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 //# sourceMappingURL=Avatar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmC1B;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,MAAM;;;;;;;+EA4DlB,CAAC"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAgCtC;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,MAAM;iFAShB,WAAW;;CA+Cb,CAAC"}

package/dist/lib/Components/Avatar/Avatar.js

@@ -1,9 +1,9 @@
 import { jsxs as g, jsx as r } from "react/jsx-runtime";
 import { cva as n } from "class-variance-authority";
-import t from "react";
+import l from "react";
 import { useCommonTranslation as h } from "../../../i18n/useCommonTranslation.js";
 import { User as A } from "../../Symbols/Icons/User.js";
-const d = {
+const m = {
   root: n(
     "relative inline-flex items-center justify-center rounded-full bg-muted-transparent transition-colors",
     {
@@ -29,58 +29,57 @@ const d = {
 }, j = {
   sm: 16,
   md: 24
-}, x = t.forwardRef(
-  ({
-    className: m,
-    src: a,
-    alt: c,
-    size: e = "md",
-    imgLoading: f,
-    showNotification: o = !1,
-    ...u
-  }, v) => {
-    const { t: i } = h(), [p, s] = t.useState(!1), b = !a || p, l = c || i("components.avatar.defaultAlt"), z = o ? `${l}, ${i("components.avatar.notificationAriaLabel")}` : l;
-    return t.useEffect(() => {
-      s(!1);
-    }, [a]), /* @__PURE__ */ g(
-      "div",
-      {
-        ref: v,
-        className: d.root({ size: e, className: m }),
-        role: "img",
-        "aria-label": z,
-        ...u,
-        children: [
-          o && /* @__PURE__ */ r(
-            "div",
-            {
-              className: d.notification({ size: e }),
-              "aria-hidden": "true"
-            }
-          ),
-          b ? /* @__PURE__ */ r(
-            A,
-            {
-              size: j[e],
-              "aria-label": "Fallback Icon",
-              "aria-hidden": "true"
-            }
-          ) : /* @__PURE__ */ r(
-            "img",
-            {
-              src: a,
-              alt: "",
-              loading: f,
-              onError: () => s(!0),
-              className: "size-full overflow-hidden rounded-full object-cover",
-              "aria-hidden": "true"
-            }
-          )
-        ]
-      }
-    );
-  }
-);
+}, x = ({
+  ref: d,
+  className: c,
+  src: a,
+  alt: f,
+  size: e = "md",
+  imgLoading: u,
+  showNotification: t = !1,
+  ...v
+}) => {
+  const { t: o } = h(), [p, i] = l.useState(!1), b = !a || p, s = f || o("components.avatar.defaultAlt"), z = t ? `${s}, ${o("components.avatar.notificationAriaLabel")}` : s;
+  return l.useEffect(() => {
+    i(!1);
+  }, [a]), /* @__PURE__ */ g(
+    "div",
+    {
+      ref: d,
+      className: m.root({ size: e, className: c }),
+      role: "img",
+      "aria-label": z,
+      ...v,
+      children: [
+        t && /* @__PURE__ */ r(
+          "div",
+          {
+            className: m.notification({ size: e }),
+            "aria-hidden": "true"
+          }
+        ),
+        b ? /* @__PURE__ */ r(
+          A,
+          {
+            size: j[e],
+            "aria-label": "Fallback Icon",
+            "aria-hidden": "true"
+          }
+        ) : /* @__PURE__ */ r(
+          "img",
+          {
+            src: a,
+            alt: "",
+            loading: u,
+            onError: () => i(!0),
+            className: "size-full overflow-hidden rounded-full object-cover",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+};
 x.displayName = "Avatar";
 export {
   x as Avatar

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

@@ -1,3 +1,4 @@
+import { ComponentPropsWithRef } from 'react';
 export type AvatarProps = {
     /**
      * Image source URL. When undefined or on load error, displays a fallback icon.
@@ -34,5 +35,5 @@ export type AvatarProps = {
      * @default undefined (browser default: eager)
      */
     imgLoading?: 'eager' | 'lazy';
-} & React.HTMLAttributes<HTMLDivElement>;
+} & ComponentPropsWithRef<'div'>;
 //# sourceMappingURL=types.d.ts.map

package/dist/lib/Components/Avatar/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Avatar/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACxB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC/B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Avatar/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,WAAW,GAAG;IACxB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC/B,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}

package/dist/lib/Components/Banner/Banner.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import { BannerProps } from './types';
 /**
  * A banner component for displaying informational, success, warning, or error messages with optional description, action buttons, and close button.
  *
@@ -33,13 +33,5 @@ import { default as React } from 'react';
  *   closeAriaLabel="Close banner"
  * />
  */
-export declare const Banner: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    appearance?: "info" | "success" | "warning" | "error";
-    title?: string;
-    description?: string;
-    primaryAction?: React.ReactNode;
-    secondaryAction?: React.ReactNode;
-    onClose?: () => void;
-    closeAriaLabel?: string;
-} & React.RefAttributes<HTMLDivElement>>;
+export declare const Banner: ({ ref, appearance, title, description, primaryAction, secondaryAction, className, onClose, closeAriaLabel, ...props }: BannerProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Banner.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Banner/Banner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAgC1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,MAAM;;;;0BArDP,SAAS;4BACqB,SAAS;;;wCA2GlD,CAAC"}
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Banner/Banner.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAsBtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,MAAM,0HAWhB,WAAW,4CAsCb,CAAC"}

package/dist/lib/Components/Banner/Banner.js

@@ -1,20 +1,19 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import { cn as c } from "../../../libs/utils-shared/dist/index.js";
 import { cva as b } from "class-variance-authority";
-import g from "react";
-import { useCommonTranslation as u } from "../../../i18n/useCommonTranslation.js";
+import { useCommonTranslation as g } from "../../../i18n/useCommonTranslation.js";
 import { IconButton as N } from "../IconButton/IconButton.js";
 import { Close as h } from "../../Symbols/Icons/Close.js";
-import { DeleteCircleFill as v } from "../../Symbols/Icons/DeleteCircleFill.js";
-import { WarningFill as w } from "../../Symbols/Icons/WarningFill.js";
-import { CheckmarkCircleFill as C } from "../../Symbols/Icons/CheckmarkCircleFill.js";
-import { InformationFill as k } from "../../Symbols/Icons/InformationFill.js";
-const F = {
-  info: /* @__PURE__ */ r(k, { className: "text-base" }),
-  success: /* @__PURE__ */ r(C, { className: "text-success" }),
-  warning: /* @__PURE__ */ r(w, { className: "text-warning" }),
-  error: /* @__PURE__ */ r(v, { className: "text-error" })
-}, j = {
+import { DeleteCircleFill as u } from "../../Symbols/Icons/DeleteCircleFill.js";
+import { WarningFill as v } from "../../Symbols/Icons/WarningFill.js";
+import { CheckmarkCircleFill as w } from "../../Symbols/Icons/CheckmarkCircleFill.js";
+import { InformationFill as C } from "../../Symbols/Icons/InformationFill.js";
+const k = {
+  info: /* @__PURE__ */ r(C, { className: "text-base" }),
+  success: /* @__PURE__ */ r(w, { className: "text-success" }),
+  warning: /* @__PURE__ */ r(v, { className: "text-warning" }),
+  error: /* @__PURE__ */ r(u, { className: "text-error" })
+}, F = {
   root: b("flex w-full items-start gap-8 rounded-md p-12 text-base", {
     variants: {
       appearance: {
@@ -25,52 +24,51 @@ const F = {
       }
     }
   })
-}, W = g.forwardRef(
-  ({
-    appearance: s = "info",
-    title: a,
-    description: o,
-    primaryAction: l,
-    secondaryAction: n,
-    className: m,
-    onClose: i,
-    closeAriaLabel: t,
-    ...f
-  }, p) => {
-    const { t: d } = u(), x = F[s];
-    return /* @__PURE__ */ e(
-      "div",
-      {
-        ref: p,
-        className: c(m, j.root({ appearance: s })),
-        ...f,
-        children: [
-          /* @__PURE__ */ r("div", { className: "flex shrink-0 items-start py-4", children: x }),
-          /* @__PURE__ */ e("div", { className: "mr-8 flex flex-1 flex-col gap-8 py-4", children: [
-            /* @__PURE__ */ e("div", { className: "flex flex-col gap-4", children: [
-              a && /* @__PURE__ */ r("h3", { className: "line-clamp-2 body-1-semi-bold", children: a }),
-              o && /* @__PURE__ */ r("div", { className: c("line-clamp-5 body-2", !a && "mt-2"), children: o })
-            ] }),
-            (l || n) && /* @__PURE__ */ e("div", { className: "flex gap-4", children: [
-              l,
-              n
-            ] })
+}, V = ({
+  ref: m,
+  appearance: s = "info",
+  title: a,
+  description: o,
+  primaryAction: l,
+  secondaryAction: n,
+  className: t,
+  onClose: i,
+  closeAriaLabel: f,
+  ...p
+}) => {
+  const { t: d } = g(), x = k[s];
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: m,
+      className: c(t, F.root({ appearance: s })),
+      ...p,
+      children: [
+        /* @__PURE__ */ r("div", { className: "flex shrink-0 items-start py-4", children: x }),
+        /* @__PURE__ */ e("div", { className: "mr-8 flex flex-1 flex-col gap-8 py-4", children: [
+          /* @__PURE__ */ e("div", { className: "flex flex-col gap-4", children: [
+            a && /* @__PURE__ */ r("h3", { className: "line-clamp-2 body-1-semi-bold", children: a }),
+            o && /* @__PURE__ */ r("div", { className: c("line-clamp-5 body-2", !a && "mt-2"), children: o })
           ] }),
-          i && /* @__PURE__ */ r(
-            N,
-            {
-              appearance: "transparent",
-              size: "xs",
-              icon: h,
-              onClick: () => i(),
-              "aria-label": t || d("components.banner.closeAriaLabel")
-            }
-          )
-        ]
-      }
-    );
-  }
-);
+          (l || n) && /* @__PURE__ */ e("div", { className: "flex gap-4", children: [
+            l,
+            n
+          ] })
+        ] }),
+        i && /* @__PURE__ */ r(
+          N,
+          {
+            appearance: "transparent",
+            size: "xs",
+            icon: h,
+            onClick: () => i(),
+            "aria-label": f || d("components.banner.closeAriaLabel")
+          }
+        )
+      ]
+    }
+  );
+};
 export {
-  W as Banner
+  V as Banner
 };

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

@@ -1,4 +1,5 @@
-export type BannerProps = React.HTMLAttributes<HTMLDivElement> & {
+import { ComponentPropsWithRef, HTMLAttributes, ReactNode } from 'react';
+export type BannerProps = HTMLAttributes<HTMLDivElement> & {
     /**
      * The type of banner which affects color and icon.
      * @default info
@@ -16,11 +17,11 @@ export type BannerProps = React.HTMLAttributes<HTMLDivElement> & {
      * Optional primary action.
      *
      */
-    primaryAction?: React.ReactNode;
+    primaryAction?: ReactNode;
     /**
      * Optional secondary action.
      */
-    secondaryAction?: React.ReactNode;
+    secondaryAction?: ReactNode;
     /**
      * Optional close action.
      */
@@ -29,5 +30,5 @@ export type BannerProps = React.HTMLAttributes<HTMLDivElement> & {
      * Optional aria label for the close button.
      */
     closeAriaLabel?: string;
-};
+} & ComponentPropsWithRef<'div'>;
 //# sourceMappingURL=types.d.ts.map

package/dist/lib/Components/Banner/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Banner/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/D;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IACtD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Banner/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9E,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACzD;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IACtD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}

package/dist/lib/Components/BaseInput/BaseInput.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import { BaseInputProps } from './types';
 /**
  * Base input component with floating label, error state styling, and clear button functionality.
  * Shows a clear button by default when input has content. Use hideClearButton to hide it.
@@ -18,17 +18,8 @@ import { default as React } from 'react';
  *
  * @internal
  */
-export declare const BaseInput: React.ForwardRefExoticComponent<{
-    label?: string;
-    errorMessage?: string;
-    'aria-invalid'?: boolean;
-    suffix?: React.ReactNode;
-    prefix?: React.ReactNode;
-    onClear?: () => void;
-    hideClearButton?: boolean;
-    className?: string;
-    containerClassName?: string;
-    inputClassName?: string;
-    labelClassName?: string;
-} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "prefix"> & React.RefAttributes<HTMLInputElement>>;
+export declare const BaseInput: {
+    ({ ref, className, containerClassName, inputClassName, labelClassName, label, id, disabled, errorMessage, suffix, prefix, onClear, hideClearButton, "aria-invalid": ariaInvalidProp, onChange: onChangeProp, ...props }: BaseInputProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 //# sourceMappingURL=BaseInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseInput.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/BaseInput/BaseInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AA+B1B;;;;;;;;;;;;;;;;;;GAkBG;AAEH,eAAO,MAAM,SAAS;;;;mBA3CC,SAAQ;mBAE7B,SAAQ;;;;;;;iHAmOT,CAAC"}
+{"version":3,"file":"BaseInput.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/BaseInput/BaseInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AA2BzC;;;;;;;;;;;;;;;;;;GAkBG;AAEH,eAAO,MAAM,SAAS;6NAiBnB,cAAc;;CAqKhB,CAAC"}