@ledgerhq/lumen-ui-react 0.1.35 → 0.1.37

package/dist/index.js

@@ -9,7 +9,7 @@ import { Button as C } from "./lib/Components/Button/Button.js";
 import { BaseButton as g } from "./lib/Components/Button/BaseButton.js";
 import { Card as B, CardContent as b, CardContentDescription as s, CardContentRow as D, CardContentTitle as M, CardFooter as L, CardFooterActions as h, CardHeader as v, CardLeading as R, CardTrailing as w } from "./lib/Components/Card/Card.js";
 import { CardButton as y } from "./lib/Components/CardButton/CardButton.js";
-import { Checkbox as P } from "./lib/Components/Checkbox/Checkbox.js";
+import { Checkbox as N } from "./lib/Components/Checkbox/Checkbox.js";
 import { ContentBanner as k, ContentBannerContent as z, ContentBannerDescription as G, ContentBannerTitle as E } from "./lib/Components/ContentBanner/ContentBanner.js";
 import { DataTable as O, DataTableGlobalSearchInput as V, DataTableRoot as _ } from "./lib/Components/DataTable/DataTable.js";
 import { useLumenDataTable as q } from "./lib/Components/DataTable/useLumenDataTable/useLumenDataTable.js";
@@ -25,35 +25,35 @@ import { DotSymbol as Be, mediaImageDotSizeMap as be, spotDotSizeMap as se } fro
 import { IconButton as Me } from "./lib/Components/IconButton/IconButton.js";
 import { InteractiveIcon as he } from "./lib/Components/InteractiveIcon/InteractiveIcon.js";
 import { Link as Re } from "./lib/Components/Link/Link.js";
-import { ListItem as Ae, ListItemContent as ye, ListItemContentRow as He, ListItemDescription as Pe, ListItemLeading as Ne, ListItemTitle as ke, ListItemTrailing as ze } from "./lib/Components/ListItem/ListItem.js";
+import { ListItem as Ae, ListItemContent as ye, ListItemContentRow as He, ListItemDescription as Ne, ListItemLeading as Pe, ListItemTitle as ke, ListItemTrailing as ze } from "./lib/Components/ListItem/ListItem.js";
 import { MediaBanner as Ee, MediaBannerDescription as Fe, MediaBannerTitle as Oe } from "./lib/Components/MediaBanner/MediaBanner.js";
 import { MediaButton as _e } from "./lib/Components/MediaButton/MediaButton.js";
 import { MediaCard as qe, MediaCardTitle as Je } from "./lib/Components/MediaCard/MediaCard.js";
 import { MediaImage as Qe } from "./lib/Components/MediaImage/MediaImage.js";
 import { MediaTag as We } from "./lib/Components/MediaTag/MediaTag.js";
-import { Menu as Ye, MenuCheckboxItem as Ze, MenuContent as $e, MenuGroup as eo, MenuItem as oo, MenuLabel as to, MenuPortal as ro, MenuRadioGroup as ao, MenuRadioItem as no, MenuSeparator as io, MenuSub as po, MenuSubContent as mo, MenuSubTrigger as lo, MenuTrigger as xo } from "./lib/Components/Menu/Menu.js";
-import { NavBar as fo, NavBarBackButton as uo, NavBarCoinCapsule as So, NavBarDescription as Co, NavBarLeading as co, NavBarTitle as go, NavBarTrailing as Io } from "./lib/Components/NavBar/NavBar.js";
-import { Popover as bo, PopoverContent as so, PopoverTrigger as Do, createPopoverHandle as Mo } from "./lib/Components/Popover/Popover.js";
-import { PageIndicator as ho } from "./lib/Components/PageIndicator/PageIndicator.js";
-import { SearchInput as Ro } from "./lib/Components/SearchInput/SearchInput.js";
-import { SegmentedControl as Ao, SegmentedControlButton as yo } from "./lib/Components/SegmentedControl/SegmentedControl.js";
-import { Select as Po, SelectContent as No, SelectEmptyState as ko, SelectItem as zo, SelectItemContent as Go, SelectItemDescription as Eo, SelectItemText as Fo, SelectList as Oo, SelectSearch as Vo, SelectSeparator as _o, SelectTrigger as jo } from "./lib/Components/Select/Select.js";
-import { SideBar as Jo, SideBarCollapseToggle as Ko, SideBarItem as Qo, SideBarLeading as Uo, SideBarTrailing as Wo } from "./lib/Components/SideBar/SideBar.js";
-import { Skeleton as Yo } from "./lib/Components/Skeleton/Skeleton.js";
-import { Spinner as $o } from "./lib/Components/Spinner/Spinner.js";
-import { Spot as ot } from "./lib/Components/Spot/Spot.js";
-import { Stepper as rt } from "./lib/Components/Stepper/Stepper.js";
-import { Subheader as nt, SubheaderCount as it, SubheaderDescription as pt, SubheaderInfo as mt, SubheaderRow as lt, SubheaderShowMore as dt, SubheaderTitle as xt } from "./lib/Components/Subheader/Subheader.js";
-import { Switch as ft } from "./lib/Components/Switch/Switch.js";
-import { Table as St, TableActionBar as Ct, TableActionBarLeading as ct, TableActionBarTrailing as gt, TableBody as It, TableCell as Bt, TableCellContent as bt, TableGroupHeaderRow as st, TableHeader as Dt, TableHeaderCell as Mt, TableHeaderRow as Lt, TableInfoIcon as ht, TableLoadingRow as vt, TableRoot as Rt, TableRow as wt, TableSortButton as At } from "./lib/Components/Table/Table.js";
-import { Tag as Ht } from "./lib/Components/Tag/Tag.js";
+import { Menu as Ye, MenuCheckboxItem as Ze, MenuContent as $e, MenuGroup as eo, MenuItem as oo, MenuLabel as to, MenuRadioGroup as ro, MenuRadioItem as ao, MenuSeparator as no, MenuSub as io, MenuSubContent as po, MenuSubTrigger as mo, MenuTrigger as lo } from "./lib/Components/Menu/Menu.js";
+import { NavBar as To, NavBarBackButton as fo, NavBarCoinCapsule as uo, NavBarDescription as So, NavBarLeading as Co, NavBarTitle as co, NavBarTrailing as go } from "./lib/Components/NavBar/NavBar.js";
+import { Popover as Bo, PopoverContent as bo, PopoverTrigger as so, createPopoverHandle as Do } from "./lib/Components/Popover/Popover.js";
+import { PageIndicator as Lo } from "./lib/Components/PageIndicator/PageIndicator.js";
+import { SearchInput as vo } from "./lib/Components/SearchInput/SearchInput.js";
+import { SegmentedControl as wo, SegmentedControlButton as Ao } from "./lib/Components/SegmentedControl/SegmentedControl.js";
+import { Select as Ho, SelectContent as No, SelectEmptyState as Po, SelectItem as ko, SelectItemContent as zo, SelectItemDescription as Go, SelectItemText as Eo, SelectList as Fo, SelectSearch as Oo, SelectSeparator as Vo, SelectTrigger as _o } from "./lib/Components/Select/Select.js";
+import { SideBar as qo, SideBarCollapseToggle as Jo, SideBarItem as Ko, SideBarLeading as Qo, SideBarTrailing as Uo } from "./lib/Components/SideBar/SideBar.js";
+import { Skeleton as Xo } from "./lib/Components/Skeleton/Skeleton.js";
+import { Spinner as Zo } from "./lib/Components/Spinner/Spinner.js";
+import { Spot as et } from "./lib/Components/Spot/Spot.js";
+import { Stepper as tt } from "./lib/Components/Stepper/Stepper.js";
+import { Subheader as at, SubheaderCount as nt, SubheaderDescription as it, SubheaderInfo as pt, SubheaderRow as mt, SubheaderShowMore as lt, SubheaderTitle as dt } from "./lib/Components/Subheader/Subheader.js";
+import { Switch as Tt } from "./lib/Components/Switch/Switch.js";
+import { Table as ut, TableActionBar as St, TableActionBarLeading as Ct, TableActionBarTrailing as ct, TableBody as gt, TableCell as It, TableCellContent as Bt, TableGroupHeaderRow as bt, TableHeader as st, TableHeaderCell as Dt, TableHeaderRow as Mt, TableInfoIcon as Lt, TableLoadingRow as ht, TableRoot as vt, TableRow as Rt, TableSortButton as wt } from "./lib/Components/Table/Table.js";
+import { Tag as yt } from "./lib/Components/Tag/Tag.js";
 import { TextInput as Nt } from "./lib/Components/TextInput/TextInput.js";
-import { Tile as zt, TileContent as Gt, TileDescription as Et, TileSecondaryAction as Ft, TileTitle as Ot, TileTrailingContent as Vt } from "./lib/Components/Tile/Tile.js";
-import { TileButton as jt } from "./lib/Components/TileButton/TileButton.js";
-import { Tooltip as Jt, TooltipContent as Kt, TooltipProvider as Qt, TooltipTrigger as Ut } from "./lib/Components/Tooltip/Tooltip.js";
-import { Trend as Xt } from "./lib/Components/Trend/Trend.js";
-import { ThemeProvider as Zt, useTheme as $t } from "./lib/Components/ThemeProvider/ThemeProvider.js";
-import { COLOR_SCHEMES as or } from "./lib/Components/ThemeProvider/ThemeProvider.types.js";
+import { Tile as kt, TileContent as zt, TileDescription as Gt, TileSecondaryAction as Et, TileTitle as Ft, TileTrailingContent as Ot } from "./lib/Components/Tile/Tile.js";
+import { TileButton as _t } from "./lib/Components/TileButton/TileButton.js";
+import { Tooltip as qt, TooltipContent as Jt, TooltipProvider as Kt, TooltipTrigger as Qt } from "./lib/Components/Tooltip/Tooltip.js";
+import { Trend as Wt } from "./lib/Components/Trend/Trend.js";
+import { ThemeProvider as Yt, useTheme as Zt } from "./lib/Components/ThemeProvider/ThemeProvider.js";
+import { COLOR_SCHEMES as er } from "./lib/Components/ThemeProvider/ThemeProvider.types.js";
 export {
   a as AddressInput,
   m as AmountDisplay,
@@ -63,7 +63,7 @@ export {
   g as BaseButton,
   u as BaseInput,
   C as Button,
-  or as COLOR_SCHEMES,
+  er as COLOR_SCHEMES,
   B as Card,
   y as CardButton,
   b as CardContent,
@@ -75,7 +75,7 @@ export {
   v as CardHeader,
   R as CardLeading,
   w as CardTrailing,
-  P as Checkbox,
+  N as Checkbox,
   k as ContentBanner,
   z as ContentBannerContent,
   G as ContentBannerDescription,
@@ -108,8 +108,8 @@ export {
   Ae as ListItem,
   ye as ListItemContent,
   He as ListItemContentRow,
-  Pe as ListItemDescription,
-  Ne as ListItemLeading,
+  Ne as ListItemDescription,
+  Pe as ListItemLeading,
   ke as ListItemTitle,
   ze as ListItemTrailing,
   Ee as MediaBanner,
@@ -126,93 +126,92 @@ export {
   eo as MenuGroup,
   oo as MenuItem,
   to as MenuLabel,
-  ro as MenuPortal,
-  ao as MenuRadioGroup,
-  no as MenuRadioItem,
-  io as MenuSeparator,
-  po as MenuSub,
-  mo as MenuSubContent,
-  lo as MenuSubTrigger,
-  xo as MenuTrigger,
-  fo as NavBar,
-  uo as NavBarBackButton,
-  So as NavBarCoinCapsule,
-  Co as NavBarDescription,
-  co as NavBarLeading,
-  go as NavBarTitle,
-  Io as NavBarTrailing,
-  ho as PageIndicator,
-  bo as Popover,
-  so as PopoverContent,
-  Do as PopoverTrigger,
-  Ro as SearchInput,
-  Ao as SegmentedControl,
-  yo as SegmentedControlButton,
-  Po as Select,
+  ro as MenuRadioGroup,
+  ao as MenuRadioItem,
+  no as MenuSeparator,
+  io as MenuSub,
+  po as MenuSubContent,
+  mo as MenuSubTrigger,
+  lo as MenuTrigger,
+  To as NavBar,
+  fo as NavBarBackButton,
+  uo as NavBarCoinCapsule,
+  So as NavBarDescription,
+  Co as NavBarLeading,
+  co as NavBarTitle,
+  go as NavBarTrailing,
+  Lo as PageIndicator,
+  Bo as Popover,
+  bo as PopoverContent,
+  so as PopoverTrigger,
+  vo as SearchInput,
+  wo as SegmentedControl,
+  Ao as SegmentedControlButton,
+  Ho as Select,
   No as SelectContent,
-  ko as SelectEmptyState,
-  zo as SelectItem,
-  Go as SelectItemContent,
-  Eo as SelectItemDescription,
-  Fo as SelectItemText,
-  Oo as SelectList,
-  Vo as SelectSearch,
-  _o as SelectSeparator,
-  jo as SelectTrigger,
-  Jo as SideBar,
-  Ko as SideBarCollapseToggle,
-  Qo as SideBarItem,
-  Uo as SideBarLeading,
-  Wo as SideBarTrailing,
-  Yo as Skeleton,
-  $o as Spinner,
-  ot as Spot,
-  rt as Stepper,
-  nt as Subheader,
-  it as SubheaderCount,
-  pt as SubheaderDescription,
-  mt as SubheaderInfo,
-  lt as SubheaderRow,
-  dt as SubheaderShowMore,
-  xt as SubheaderTitle,
-  ft as Switch,
-  St as Table,
-  Ct as TableActionBar,
-  ct as TableActionBarLeading,
-  gt as TableActionBarTrailing,
-  It as TableBody,
-  Bt as TableCell,
-  bt as TableCellContent,
-  st as TableGroupHeaderRow,
-  Dt as TableHeader,
-  Mt as TableHeaderCell,
-  Lt as TableHeaderRow,
-  ht as TableInfoIcon,
-  vt as TableLoadingRow,
-  Rt as TableRoot,
-  wt as TableRow,
-  At as TableSortButton,
-  Ht as Tag,
+  Po as SelectEmptyState,
+  ko as SelectItem,
+  zo as SelectItemContent,
+  Go as SelectItemDescription,
+  Eo as SelectItemText,
+  Fo as SelectList,
+  Oo as SelectSearch,
+  Vo as SelectSeparator,
+  _o as SelectTrigger,
+  qo as SideBar,
+  Jo as SideBarCollapseToggle,
+  Ko as SideBarItem,
+  Qo as SideBarLeading,
+  Uo as SideBarTrailing,
+  Xo as Skeleton,
+  Zo as Spinner,
+  et as Spot,
+  tt as Stepper,
+  at as Subheader,
+  nt as SubheaderCount,
+  it as SubheaderDescription,
+  pt as SubheaderInfo,
+  mt as SubheaderRow,
+  lt as SubheaderShowMore,
+  dt as SubheaderTitle,
+  Tt as Switch,
+  ut as Table,
+  St as TableActionBar,
+  Ct as TableActionBarLeading,
+  ct as TableActionBarTrailing,
+  gt as TableBody,
+  It as TableCell,
+  Bt as TableCellContent,
+  bt as TableGroupHeaderRow,
+  st as TableHeader,
+  Dt as TableHeaderCell,
+  Mt as TableHeaderRow,
+  Lt as TableInfoIcon,
+  ht as TableLoadingRow,
+  vt as TableRoot,
+  Rt as TableRow,
+  wt as TableSortButton,
+  yt as Tag,
   Nt as TextInput,
-  Zt as ThemeProvider,
-  zt as Tile,
-  jt as TileButton,
-  Gt as TileContent,
-  Et as TileDescription,
-  Ft as TileSecondaryAction,
-  Ot as TileTitle,
-  Vt as TileTrailingContent,
-  Jt as Tooltip,
-  Kt as TooltipContent,
-  Qt as TooltipProvider,
-  Ut as TooltipTrigger,
-  Xt as Trend,
-  Mo as createPopoverHandle,
+  Yt as ThemeProvider,
+  kt as Tile,
+  _t as TileButton,
+  zt as TileContent,
+  Gt as TileDescription,
+  Et as TileSecondaryAction,
+  Ft as TileTitle,
+  Ot as TileTrailingContent,
+  qt as Tooltip,
+  Jt as TooltipContent,
+  Kt as TooltipProvider,
+  Qt as TooltipTrigger,
+  Wt as Trend,
+  Do as createPopoverHandle,
   ue as dotIconSizeMap,
   Se as mediaImageDotIconSizeMap,
   be as mediaImageDotSizeMap,
   Ce as spotDotIconSizeMap,
   se as spotDotSizeMap,
   q as useLumenDataTable,
-  $t as useTheme
+  Zt as useTheme
 };

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

@@ -32,5 +32,5 @@ import { AmountDisplayProps } from './types';
  * <AmountDisplay value={1234.56} formatter={usdFormatter} hidden={true} />
  * ```
  */
-export declare const AmountDisplay: ({ value, formatter, hidden, loading, animate, className, ...props }: AmountDisplayProps) => import("react/jsx-runtime").JSX.Element;
+export declare function AmountDisplay({ value, formatter, hidden, loading, animate, size, className, ...props }: AmountDisplayProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AmountDisplay.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AmountDisplay.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/AmountDisplay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,kBAAkB,EAGnB,MAAM,SAAS,CAAC;AA8EjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,aAAa,GAAI,qEAQ3B,kBAAkB,4CA4DpB,CAAC"}
+{"version":3,"file":"AmountDisplay.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/AmountDisplay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,kBAAkB,EAMnB,MAAM,SAAS,CAAC;AAkHjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,SAAS,EACT,MAAc,EACd,OAAe,EACf,OAAc,EACd,IAAW,EACX,SAAS,EACT,GAAG,KAAK,EACT,EAAE,kBAAkB,2CA6DpB"}

package/dist/lib/Components/AmountDisplay/AmountDisplay.js

@@ -1,109 +1,148 @@
 import { jsx as e, jsxs as c } from "react/jsx-runtime";
-import { useSplitText as x, buildAriaLabel as b, cn as p } from "../../../libs/utils-shared/dist/index.js";
-import { memo as d } from "react";
+import { useSplitText as y, buildAriaLabel as w, cn as o } from "../../../libs/utils-shared/dist/index.js";
+import { memo as u } from "react";
 import { DIGITS as D } from "./types.js";
-import { useCommonTranslation as N } from "../../../i18n/useCommonTranslation.js";
-const g = {
-  0: 25,
-  1: 15.5,
-  2: 23.5,
-  3: 24.5,
-  4: 25.5,
-  5: 23.5,
-  6: 25,
-  7: 22,
-  8: 24.5,
-  9: 24.5
-}, I = {
-  0: 17.5,
-  1: 11,
-  2: 16.5,
-  3: 17,
-  4: 18,
-  5: 16,
-  6: 17.5,
-  7: 15,
-  8: 17,
-  9: 17
-}, u = d(({ value: a, animate: l, type: i }) => {
-  const r = (i === "integer" ? g : I)[a];
+import { useCommonTranslation as S } from "../../../i18n/useCommonTranslation.js";
+const m = {
+  "heading-1-semi-bold": {
+    0: 25,
+    1: 15.5,
+    2: 23.5,
+    3: 24.5,
+    4: 25.5,
+    5: 23.5,
+    6: 25,
+    7: 22,
+    8: 24.5,
+    9: 24.5
+  },
+  "heading-2-semi-bold": {
+    0: 17.5,
+    1: 11,
+    2: 16.5,
+    3: 17,
+    4: 18,
+    5: 16,
+    6: 17.5,
+    7: 15,
+    8: 17,
+    9: 17
+  },
+  "heading-4-semi-bold": {
+    0: 13,
+    1: 8.5,
+    2: 12.5,
+    3: 12.5,
+    4: 13,
+    5: 12,
+    6: 12.5,
+    7: 11.5,
+    8: 12.5,
+    9: 12.5
+  }
+}, v = {
+  md: {
+    integer: {
+      className: "heading-1-semi-bold",
+      widths: m["heading-1-semi-bold"]
+    },
+    decimal: {
+      className: "heading-2-semi-bold",
+      widths: m["heading-2-semi-bold"]
+    }
+  },
+  sm: {
+    integer: {
+      className: "heading-2-semi-bold",
+      widths: m["heading-2-semi-bold"]
+    },
+    decimal: {
+      className: "heading-4-semi-bold",
+      widths: m["heading-4-semi-bold"]
+    }
+  }
+}, b = u(({ value: a, animate: l, widths: s }) => {
+  const t = s[a];
   return /* @__PURE__ */ c(
     "div",
     {
       className: "relative overflow-hidden mask-fade-y transition-[width] duration-600",
-      style: { width: r + "px" },
+      style: { width: t + "px" },
       children: [
         /* @__PURE__ */ e("span", { className: "invisible", children: "0" }),
         /* @__PURE__ */ e(
           "span",
           {
-            className: p(
+            className: o(
               "absolute inset-x-0 top-0 flex flex-col items-center justify-center",
               l && "transition-transform duration-600 ease-in-out"
             ),
             style: {
               transform: `translateY(-${a * 10}%)`
             },
-            children: D.map((s, n) => /* @__PURE__ */ e("span", { inert: s !== a, children: s }, n))
+            children: D.map((n, r) => /* @__PURE__ */ e("span", { inert: n !== a, children: n }, r))
           }
         )
       ]
     }
   );
 });
-u.displayName = "DigitStrip";
-const o = d(({ items: a, type: l, animate: i }) => a.map((r, s) => {
-  const n = a.length - s;
-  return r.type === "separator" ? /* @__PURE__ */ e("span", { children: r.value }, n) : /* @__PURE__ */ e(
-    u,
-    {
-      value: Number(r.value),
-      animate: i,
-      type: l
-    },
-    n
-  );
-}));
-o.displayName = "DigitStripList";
-const w = ({
+b.displayName = "DigitStrip";
+const h = u(
+  ({ items: a, widths: l, animate: s }) => a.map((t, n) => {
+    const r = a.length - n;
+    return t.type === "separator" ? /* @__PURE__ */ e("span", { children: t.value }, r) : /* @__PURE__ */ e(
+      b,
+      {
+        value: Number(t.value),
+        animate: s,
+        widths: l
+      },
+      r
+    );
+  })
+);
+h.displayName = "DigitStripList";
+function j({
   value: a,
   formatter: l,
-  hidden: i = !1,
-  loading: r = !1,
-  animate: s = !0,
-  className: n,
-  ...f
-}) => {
-  const t = l(a), m = x(t), { t: h } = N(), y = b(
-    t,
+  hidden: s = !1,
+  loading: t = !1,
+  animate: n = !0,
+  size: r = "md",
+  className: f,
+  ...g
+}) {
+  const i = l(a), p = y(i), { t: N } = S(), x = w(
     i,
-    h("components.amountDisplay.amountHiddenAriaLabel")
-  );
+    s,
+    N("components.amountDisplay.amountHiddenAriaLabel")
+  ), d = v[r];
   return /* @__PURE__ */ e(
     "div",
     {
-      className: p(
-        r && "animate-pulse",
+      className: o(
+        t && "animate-pulse",
         "relative inline-flex",
-        n
+        f
       ),
-      "aria-label": y,
-      "aria-busy": r,
-      ...f,
+      "aria-label": x,
+      "aria-busy": t,
+      ...g,
       children: /* @__PURE__ */ c("div", { className: "flex items-baseline", children: [
         /* @__PURE__ */ c(
           "span",
           {
-            className: "inline-flex heading-1-semi-bold text-base",
+            className: o("inline-flex text-base", d.integer.className),
             "aria-hidden": "true",
             children: [
-              t.currencyPosition === "start" && /* @__PURE__ */ e("span", { className: "me-4", children: t.currencyText }),
-              i ? /* @__PURE__ */ e("span", { children: "••••" }) : /* @__PURE__ */ e(
-                o,
+              i.currencyPosition === "start" && /* @__PURE__ */ e("span", { className: "me-4", children: i.currencyText }),
+              s ? /* @__PURE__ */ e("span", { children: "••••" }) : /* @__PURE__ */ e(
+                h,
                 {
-                  items: m.integerPart,
-                  animate: s,
-                  type: "integer"
+                  items: p.integerPart,
+                  animate: n,
+                  widths: d.integer.widths
                 }
               )
             ]
@@ -112,26 +151,26 @@ const w = ({
         /* @__PURE__ */ c(
           "span",
           {
-            className: "inline-flex heading-2-semi-bold text-muted",
+            className: o("inline-flex text-muted", d.decimal.className),
             "aria-hidden": "true",
             children: [
-              !i && t.decimalPart && /* @__PURE__ */ e("span", { children: t.decimalSeparator }),
-              t.decimalPart && !i && /* @__PURE__ */ e(
-                o,
+              !s && i.decimalPart && /* @__PURE__ */ e("span", { children: i.decimalSeparator }),
+              i.decimalPart && !s && /* @__PURE__ */ e(
+                h,
                 {
-                  items: m.decimalPart,
-                  animate: s,
-                  type: "decimal"
+                  items: p.decimalPart,
+                  animate: n,
+                  widths: d.decimal.widths
                 }
               ),
-              t.currencyPosition === "end" && /* @__PURE__ */ e("span", { className: "ms-4", children: t.currencyText })
+              i.currencyPosition === "end" && /* @__PURE__ */ e("span", { className: "ms-4", children: i.currencyText })
             ]
           }
         )
       ] })
     }
   );
-};
+}
 export {
-  w as AmountDisplay
+  j as AmountDisplay
 };

package/dist/lib/Components/AmountDisplay/index.d.ts

@@ -1,3 +1,3 @@
 export { AmountDisplay } from './AmountDisplay';
-export type { AmountDisplayProps, FormattedValue } from './types';
+export type { AmountDisplayProps, AmountDisplaySize, FormattedValue, } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/lib/Components/AmountDisplay/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EACV,kBAAkB,EAClB,iBAAiB,EACjB,cAAc,GACf,MAAM,SAAS,CAAC"}

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

@@ -2,11 +2,19 @@ import { FormattedValue, SplitChar } from '@ledgerhq/lumen-utils-shared';
 import { ComponentPropsWithRef } from 'react';
 export type { FormattedValue };
 export declare const DIGITS: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
-type IntegerDigit = (typeof DIGITS)[number];
+type Digit = (typeof DIGITS)[number];
+export type AmountDisplaySize = 'sm' | 'md';
+type DigitType = 'integer' | 'decimal';
+export type DigitWidths = Record<Digit, number>;
+export type PartConfig = {
+    className: string;
+    widths: DigitWidths;
+};
+export type SizeConfig = Record<DigitType, PartConfig>;
 export type DigitStripProps = {
-    value: IntegerDigit;
+    value: Digit;
     animate: boolean;
-    type: 'integer' | 'decimal';
+    widths: DigitWidths;
 };
 export type DigitStripListProps = {
     items: SplitChar[];
@@ -40,5 +48,10 @@ export type AmountDisplayProps = {
      * @default true
      */
     animate?: boolean;
+    /**
+     * The size variant of the amount display.
+     * @default 'md'
+     */
+    size?: AmountDisplaySize;
 } & ComponentPropsWithRef<'div'>;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B,eAAO,MAAM,MAAM,yCAA0C,CAAC;AAE9D,KAAK,YAAY,GAAG,CAAC,OAAO,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAE5C,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,YAAY,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,SAAS,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,EAAE,CAAC;CACpB,GAAG,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;AAEnC;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,cAAc,CAAC;IAC7C;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountDisplay/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B,eAAO,MAAM,MAAM,yCAA0C,CAAC;AAE9D,KAAK,KAAK,GAAG,CAAC,OAAO,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAErC,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AAEvC,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;AAEhD,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,WAAW,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,WAAW,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,EAAE,CAAC;CACpB,GAAG,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;AAEnC;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,cAAc,CAAC;IAC7C;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}

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

@@ -4,5 +4,5 @@ import { AmountInputProps } from './types';
  * This is a controlled component - both `value` and `onChange` props are required.
  * The currency text can be positioned either on the left or right side of the input.
  */
-export declare const AmountInput: ({ ref, className, currencyText, currencyPosition, disabled: disabledProp, maxIntegerLength, maxDecimalLength, allowDecimals, thousandsSeparator, value, onChange, ...props }: AmountInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AmountInput: ({ ref, className, size, align, currencyText, currencyPosition, disabled: disabledProp, maxIntegerLength, maxDecimalLength, allowDecimals, thousandsSeparator, value, onChange, ...props }: AmountInputProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AmountInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AmountInput.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountInput/AmountInput.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAgChD;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,8KAazB,gBAAgB,4CAkHlB,CAAC"}
+{"version":3,"file":"AmountInput.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/AmountInput/AmountInput.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,gBAAgB,EAAmB,MAAM,SAAS,CAAC;AAyGjE;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,2LAezB,gBAAgB,4CAmHlB,CAAC"}