@ledgerhq/lumen-ui-react 0.1.46 → 0.1.47

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

@@ -10,6 +10,10 @@ export type BaseInputProps = {
      * Pair with `status` for error/success styling and icons; omit `status` for a neutral hint.
      */
     helperText?: string;
+    /**
+     * Soft character limit. When set, renders a `count/maxCount` counter below the input.
+     */
+    maxCount?: number;
     /**
      * Visual state for border, label, helper text, and helper icon.
      * Omit when `helperText` is a neutral hint.
@@ -57,4 +61,24 @@ export type BaseInputProps = {
      */
     labelClassName?: string;
 } & Omit<ComponentPropsWithRef<'input'>, 'size' | 'prefix'>;
+export type BaseInputHelperTextProps = {
+    /**
+     * The id linking the helper text to the input via `aria-describedby`.
+     */
+    id: string;
+    /**
+     * The helper copy shown below the input.
+     */
+    helperText: string;
+} & Pick<BaseInputProps, 'status'>;
+export type BaseInputCounterProps = {
+    /**
+     * Current character count.
+     */
+    count: number;
+    /**
+     * Soft character limit rendered as the counter denominator.
+     */
+    maxCount: number;
+};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/BaseInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,SAAS,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/BaseInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,SAAS,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAC;AAE5D,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;AAEnC,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC"}

package/dist/lib/Components/Card/Card.js

@@ -51,7 +51,7 @@ const k = ({
   {
     variants: {
       interactive: {
-        true: "cursor-pointer hover:bg-surface-hover active:bg-surface-pressed focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",
+        true: "cursor-pointer hover:bg-surface-hover focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus active:bg-surface-pressed",
         false: ""
       },
       outlined: {

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

@@ -8,7 +8,7 @@ const h = f(
     variants: {
       appearance: {
         base: "bg-surface text-base hover:bg-surface-hover active:bg-surface-pressed disabled:bg-disabled",
-        outline: "bg-base-transparent text-base outline-dashed outline-1 outline-muted-subtle hover:bg-base-transparent-hover hover:outline-muted-subtle-hover focus-visible:outline-hidden focus-visible:outline-offset-0 active:bg-base-transparent-pressed active:outline-muted-subtle-pressed disabled:bg-base-transparent disabled:outline-disabled"
+        outline: "bg-base-transparent text-base outline-1 outline-muted-subtle outline-dashed hover:bg-base-transparent-hover hover:outline-muted-subtle-hover focus-visible:outline-hidden focus-visible:outline-offset-0 active:bg-base-transparent-pressed active:outline-muted-subtle-pressed disabled:bg-base-transparent disabled:outline-disabled"
       }
     },
     defaultVariants: {

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

@@ -17,7 +17,7 @@ import { DescriptionItemLabelProps, DescriptionItemLeadingProps, DescriptionItem
  *   </DescriptionItemTrailing>
  * </DescriptionItem>
  */
-export declare const DescriptionItem: ({ ref, children, className, size, ...props }: DescriptionItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DescriptionItem: ({ ref, children, className, size, priority, ...props }: DescriptionItemProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * Layout container for the leading (left) side of the description item.
  * Contains DescriptionItemLabel and an optional info icon sibling.

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

@@ -1 +1 @@
-{"version":3,"file":"DescriptionItem.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DescriptionItem/DescriptionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,yBAAyB,EACzB,2BAA2B,EAC3B,oBAAoB,EAEpB,4BAA4B,EAC5B,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AAWjB;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,eAAe,GAAI,8CAM7B,oBAAoB,4CAYtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,GAAI,wCAKpC,2BAA2B,4CAU7B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wCAKlC,yBAAyB,4CAmB3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,GAAI,wCAKrC,4BAA4B,4CAU9B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wCAKlC,yBAAyB,4CAmB3B,CAAC"}
+{"version":3,"file":"DescriptionItem.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DescriptionItem/DescriptionItem.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,yBAAyB,EACzB,2BAA2B,EAC3B,oBAAoB,EAEpB,4BAA4B,EAC5B,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AAgBjB;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,eAAe,GAAI,wDAO7B,oBAAoB,4CAiBtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,GAAI,wCAKpC,2BAA2B,4CAmB7B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wCAKlC,yBAAyB,4CAmB3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,GAAI,wCAKrC,4BAA4B,4CAmB9B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wCAKlC,yBAAyB,4CAmB3B,CAAC"}

package/dist/lib/Components/DescriptionItem/DescriptionItem.js

@@ -1,98 +1,124 @@
-import { jsx as r } from "react/jsx-runtime";
-import { createSafeContext as a, cn as m } from "../../../libs/utils-shared/dist/index.js";
-const [c, o] = a("DescriptionItemSize", {
+import { jsx as n } from "react/jsx-runtime";
+import { createSafeContext as m, cn as o } from "../../../libs/utils-shared/dist/index.js";
+const [l, c] = m("DescriptionItemSize", {
   size: "md"
-}), p = ({
+}), [p, a] = m("DescriptionItemPriority", {
+  priority: void 0
+}), D = ({
   ref: e,
   children: t,
   className: i,
-  size: s = "md",
-  ...n
-}) => /* @__PURE__ */ r(c, { value: { size: s }, children: /* @__PURE__ */ r(
+  size: r = "md",
+  priority: s = "end",
+  ...d
+}) => /* @__PURE__ */ n(l, { value: { size: r }, children: /* @__PURE__ */ n(p, { value: { priority: s }, children: /* @__PURE__ */ n(
   "div",
   {
     ref: e,
-    className: m("flex w-full items-start gap-12", i),
-    ...n,
+    className: o(
+      "flex w-full items-start gap-12 overflow-hidden",
+      i
+    ),
+    ...d,
     children: t
   }
-) }), u = ({
+) }) }), I = ({
   ref: e,
   children: t,
   className: i,
-  ...s
-}) => /* @__PURE__ */ r(
-  "div",
-  {
-    ref: e,
-    className: m("flex min-w-0 flex-1 items-center gap-4", i),
-    ...s,
-    children: t
-  }
-), x = ({
+  ...r
+}) => {
+  const { priority: s } = a({
+    consumerName: "DescriptionItemLeading",
+    contextRequired: !1
+  });
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ref: e,
+      className: o(
+        "flex min-w-0 grow items-center gap-4",
+        s === "end" ? "shrink" : "shrink-0",
+        i
+      ),
+      ...r,
+      children: t
+    }
+  );
+}, f = ({
   ref: e,
   children: t,
   className: i,
-  ...s
+  ...r
 }) => {
-  const { size: n } = o({
+  const { size: s } = c({
     consumerName: "DescriptionItemLabel",
     contextRequired: !1
   });
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(
     "div",
     {
       ref: e,
-      className: m(
+      className: o(
         "line-clamp-2 min-w-0 wrap-break-word text-ellipsis text-muted",
-        n === "md" ? "body-2" : "body-3",
+        s === "md" ? "body-2" : "body-3",
         i
       ),
-      ...s,
+      ...r,
       children: t
     }
   );
-}, b = ({
+}, v = ({
   ref: e,
   children: t,
   className: i,
-  ...s
-}) => /* @__PURE__ */ r(
-  "div",
-  {
-    ref: e,
-    className: m("flex max-w-4/5 shrink-0 items-center gap-4", i),
-    ...s,
-    children: t
-  }
-), f = ({
+  ...r
+}) => {
+  const { priority: s } = a({
+    consumerName: "DescriptionItemTrailing",
+    contextRequired: !1
+  });
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ref: e,
+      className: o(
+        "flex max-w-4/5 items-center gap-4",
+        s === "start" ? "min-w-0 shrink" : "shrink-0",
+        i
+      ),
+      ...r,
+      children: t
+    }
+  );
+}, b = ({
   ref: e,
   children: t,
   className: i,
-  ...s
+  ...r
 }) => {
-  const { size: n } = o({
+  const { size: s } = c({
     consumerName: "DescriptionItemValue",
     contextRequired: !1
   });
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(
     "div",
     {
       ref: e,
-      className: m(
+      className: o(
         "min-w-0 truncate text-base",
-        n === "md" ? "body-2-semi-bold" : "body-3-semi-bold",
+        s === "md" ? "body-2-semi-bold" : "body-3-semi-bold",
         i
       ),
-      ...s,
+      ...r,
       children: t
     }
   );
 };
 export {
-  p as DescriptionItem,
-  x as DescriptionItemLabel,
-  u as DescriptionItemLeading,
-  b as DescriptionItemTrailing,
-  f as DescriptionItemValue
+  D as DescriptionItem,
+  f as DescriptionItemLabel,
+  I as DescriptionItemLeading,
+  v as DescriptionItemTrailing,
+  b as DescriptionItemValue
 };

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

@@ -1,3 +1,4 @@
+import { Priority } from '@ledgerhq/lumen-utils-shared';
 import { ComponentPropsWithRef, ReactNode } from 'react';
 export type DescriptionItemSize = 'sm' | 'md';
 export type DescriptionItemProps = {
@@ -10,6 +11,11 @@ export type DescriptionItemProps = {
      * @default 'md'
      */
     size?: DescriptionItemSize;
+    /**
+     * The parts which are protected from shrinking and truncation when horizontal space is limited.
+     * @default 'end'
+     */
+    priority?: Priority;
     /**
      * Additional CSS classes for layout adjustments.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DescriptionItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,mBAAmB,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,2BAA2B,GAAG;IACxC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,yBAAyB,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,4BAA4B,GAAG;IACzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,yBAAyB,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DescriptionItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,mBAAmB,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,2BAA2B,GAAG;IACxC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,yBAAyB,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,4BAA4B,GAAG;IACzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC,MAAM,MAAM,yBAAyB,GAAG;IACtC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}

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

@@ -11,7 +11,7 @@ const D = u("flex px-24 text-base", {
   variants: {
     density: {
       compact: "mb-12 h-64 min-h-64 flex-row items-center gap-12",
-      expanded: "flex-col gap-16 pb-12 pt-10"
+      expanded: "flex-col gap-16 pt-10 pb-12"
     }
   }
 }), d = ({ onBack: r }) => {

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

@@ -4,14 +4,14 @@ import { createElement as k } from "react";
 const h = a("inline-block shrink-0", {
   variants: {
     size: {
-      12: "icon-w-12 icon-h-12 icon-stroke-12",
-      16: "icon-w-16 icon-h-16 icon-stroke-16",
-      20: "icon-w-20 icon-h-20 icon-stroke-20",
-      32: "icon-w-32 icon-h-32 icon-stroke-32",
-      24: "icon-w-24 icon-h-24 icon-stroke-24",
-      40: "icon-w-40 icon-h-40 icon-stroke-40",
-      48: "icon-w-48 icon-h-48 icon-stroke-48",
-      56: "icon-w-56 icon-h-56 icon-stroke-56"
+      12: "icon-h-12 icon-w-12 icon-stroke-12",
+      16: "icon-h-16 icon-w-16 icon-stroke-16",
+      20: "icon-h-20 icon-w-20 icon-stroke-20",
+      32: "icon-h-32 icon-w-32 icon-stroke-32",
+      24: "icon-h-24 icon-w-24 icon-stroke-24",
+      40: "icon-h-40 icon-w-40 icon-stroke-40",
+      48: "icon-h-48 icon-w-48 icon-stroke-48",
+      56: "icon-h-56 icon-w-56 icon-stroke-56"
     }
   },
   defaultVariants: {

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

@@ -1 +1 @@
-{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/ListItem/ListItem.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACV,oBAAoB,EACpB,wBAAwB,EACxB,oBAAoB,EACpB,aAAa,EACb,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAC;AAsCjB;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,QAAQ,GAAI,4BAA4B,aAAa,4CAgCjE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,wCAK7B,oBAAoB,4CAUtB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,wCAK7B,oBAAoB,4CAUtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAAI,wCAKhC,uBAAuB,4CAmBzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,wCAK3B,kBAAkB,4CAwBpB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,wCAKjC,wBAAwB,4CAwB1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAAI,wCAK9B,qBAAqB,4CAqBvB,CAAC"}
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/ListItem/ListItem.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EACV,oBAAoB,EACpB,wBAAwB,EACxB,oBAAoB,EACpB,aAAa,EACb,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAC;AA+DjB;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,QAAQ,GAAI,4BAA4B,aAAa,4CAsCjE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,wCAK7B,oBAAoB,4CAmBtB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,wCAK7B,oBAAoB,4CAmBtB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAAI,wCAKhC,uBAAuB,4CAmBzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,wCAK3B,kBAAkB,4CAwBpB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,wCAKjC,wBAAwB,4CAwB1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAAI,wCAK9B,qBAAqB,4CA0BvB,CAAC"}

package/dist/lib/Components/ListItem/ListItem.js

@@ -1,11 +1,13 @@
 import { jsx as a } from "react/jsx-runtime";
-import { useDisabledContext as c, DisabledProvider as x, cn as r, getButtonA11yProps as b, createSafeContext as f } from "../../../libs/utils-shared/dist/index.js";
-import { cva as p } from "class-variance-authority";
-const [I, l] = f("ListItemTrailing", {
+import { useDisabledContext as d, DisabledProvider as p, createSafeContext as b, cn as o, getButtonA11yProps as g } from "../../../libs/utils-shared/dist/index.js";
+import { cva as I } from "class-variance-authority";
+const [L, l] = b("ListItemTrailing", {
   isInTrailing: !1
-}), g = p(
+}), [N, m] = b("ListItemPriority", {
+  priority: void 0
+}), y = I(
   [
-    "flex w-full items-center gap-16 px-8",
+    "flex w-full items-center gap-16 overflow-hidden px-8",
     "rounded-md bg-base-transparent text-base transition-colors"
   ],
   {
@@ -18,6 +20,10 @@ const [I, l] = f("ListItemTrailing", {
         true: "",
         false: ""
       },
+      active: {
+        true: "",
+        false: ""
+      },
       disabled: {
         true: "cursor-default bg-base-transparent text-disabled",
         false: ""
@@ -28,70 +34,110 @@ const [I, l] = f("ListItemTrailing", {
         interactive: !0,
         disabled: !1,
         className: "cursor-pointer hover:bg-base-transparent-hover focus-visible:outline-2 focus-visible:outline-focus active:bg-base-transparent-pressed"
+      },
+      {
+        active: !0,
+        disabled: !1,
+        className: "bg-muted"
+      },
+      {
+        active: !0,
+        disabled: !0,
+        className: "bg-disabled"
+      },
+      {
+        active: !0,
+        interactive: !0,
+        disabled: !1,
+        className: "hover:bg-muted-hover active:bg-muted-pressed"
       }
     ]
   }
-), T = ({ onClick: e, ref: t, ...s }) => {
+), R = ({ onClick: e, ref: t, ...s }) => {
   const {
     children: i,
-    className: n,
-    disabled: o = !1,
-    density: m = "expanded",
-    ...u
-  } = s, d = c({
+    className: r,
+    disabled: n = !1,
+    density: f = "expanded",
+    priority: v = "end",
+    active: u = !1,
+    ...x
+  } = s, c = d({
     consumerName: "ListItem",
-    mergeWith: { disabled: o }
+    mergeWith: { disabled: n }
   });
-  return /* @__PURE__ */ a(x, { value: { disabled: d }, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(p, { value: { disabled: c }, children: /* @__PURE__ */ a(N, { value: { priority: v }, children: /* @__PURE__ */ a(
     "div",
     {
       ref: t,
-      ...b({ onClick: e, disabled: d }),
-      className: r(
-        g({
-          density: m,
+      ...g({ onClick: e, disabled: c }),
+      "aria-selected": u || void 0,
+      className: o(
+        y({
+          density: f,
           interactive: !!e,
-          disabled: d
+          active: u,
+          disabled: c
         }),
-        n
+        r
       ),
-      ...u,
+      ...x,
       children: i
     }
-  ) });
-}, y = ({
+  ) }) });
+}, q = ({
   ref: e,
   children: t,
   className: s,
   ...i
-}) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: e,
-    className: r("flex min-w-0 flex-1 items-center gap-12", s),
-    ...i,
-    children: t
-  }
-), h = ({
+}) => {
+  const { priority: r } = m({
+    consumerName: "ListItemLeading",
+    contextRequired: !1
+  });
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: e,
+      className: o(
+        "flex min-w-0 grow items-center gap-12",
+        r === "end" ? "shrink" : "shrink-0",
+        s
+      ),
+      ...i,
+      children: t
+    }
+  );
+}, P = ({
   ref: e,
   children: t,
   className: s,
   ...i
-}) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: e,
-    className: r("flex min-w-0 flex-1 flex-col gap-4", s),
-    ...i,
-    children: t
-  }
-), w = ({
+}) => {
+  const { priority: r } = m({
+    consumerName: "ListItemContent",
+    contextRequired: !1
+  });
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: e,
+      className: o(
+        "flex min-w-0 flex-col gap-4",
+        r === "start" ? "shrink grow-0 basis-auto" : "flex-1",
+        s
+      ),
+      ...i,
+      children: t
+    }
+  );
+}, C = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const { isInTrailing: n } = l({
+  const { isInTrailing: r } = l({
     consumerName: "ListItemContentRow",
     contextRequired: !1
   });
@@ -99,25 +145,25 @@ const [I, l] = f("ListItemTrailing", {
     "div",
     {
       ref: e,
-      className: r(
+      className: o(
         "flex min-w-0 items-center gap-8",
-        n && "justify-end",
+        r && "justify-end",
         s
       ),
       ...i,
       children: t
     }
   );
-}, R = ({
+}, j = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const n = c({
+  const r = d({
     consumerName: "ListItemTitle",
     contextRequired: !0
-  }), { isInTrailing: o } = l({
+  }), { isInTrailing: n } = l({
     consumerName: "ListItemTitle",
     contextRequired: !1
   });
@@ -125,26 +171,26 @@ const [I, l] = f("ListItemTrailing", {
     "div",
     {
       ref: e,
-      className: r(
+      className: o(
         "min-w-0 truncate body-2-semi-bold",
-        o ? "justify-end text-end" : "justify-start text-start",
-        n && "text-disabled",
+        n ? "justify-end text-end" : "justify-start text-start",
+        r && "text-disabled",
         s
       ),
       ...i,
       children: t
     }
   );
-}, j = ({
+}, D = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const n = c({
+  const r = d({
     consumerName: "ListItemDescription",
     contextRequired: !0
-  }), { isInTrailing: o } = l({
+  }), { isInTrailing: n } = l({
     consumerName: "ListItemDescription",
     contextRequired: !1
   });
@@ -152,33 +198,37 @@ const [I, l] = f("ListItemTrailing", {
     "div",
     {
       ref: e,
-      className: r(
+      className: o(
         "min-w-0 items-center truncate body-3 text-muted",
-        o ? "justify-end text-end" : "justify-start text-start",
-        n && "text-disabled",
+        n ? "justify-end text-end" : "justify-start text-start",
+        r && "text-disabled",
         s
       ),
       ...i,
       children: t
     }
   );
-}, q = ({
+}, k = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const n = c({
+  const r = d({
     consumerName: "ListItemTrailing",
     contextRequired: !0
+  }), { priority: n } = m({
+    consumerName: "ListItemTrailing",
+    contextRequired: !1
   });
-  return /* @__PURE__ */ a(I, { value: { isInTrailing: !0 }, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ a(L, { value: { isInTrailing: !0 }, children: /* @__PURE__ */ a(
     "div",
     {
       ref: e,
-      className: r(
-        "flex shrink-0 items-center",
-        n && "text-disabled",
+      className: o(
+        "flex items-center",
+        n === "start" ? "min-w-0 shrink" : "shrink-0",
+        r && "text-disabled",
         s
       ),
       ...i,
@@ -187,11 +237,11 @@ const [I, l] = f("ListItemTrailing", {
   ) });
 };
 export {
-  T as ListItem,
-  h as ListItemContent,
-  w as ListItemContentRow,
-  j as ListItemDescription,
-  y as ListItemLeading,
-  R as ListItemTitle,
-  q as ListItemTrailing
+  R as ListItem,
+  P as ListItemContent,
+  C as ListItemContentRow,
+  D as ListItemDescription,
+  q as ListItemLeading,
+  j as ListItemTitle,
+  k as ListItemTrailing
 };

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

@@ -1,4 +1,4 @@
-import { Density } from '@ledgerhq/lumen-utils-shared';
+import { Density, Priority } from '@ledgerhq/lumen-utils-shared';
 import { ComponentPropsWithRef, MouseEventHandler, ReactNode } from 'react';
 /**
  * Props for the ListItem root component
@@ -13,6 +13,11 @@ export type ListItemProps = {
      * @default 'expanded'
      */
     density?: Density;
+    /**
+     * The parts which are protected from shrinking and truncation when horizontal space is limited.
+     * @default 'end'
+     */
+    priority?: Priority;
     /**
      * custom classname
      */
@@ -21,6 +26,11 @@ export type ListItemProps = {
      * Whether the list item is disabled.
      */
     disabled?: boolean;
+    /**
+     * Whether the list item is in an active/selected state.
+     * @default false
+     */
+    active?: boolean;
     /**
      * Callback function when the list item is pressed.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/ListItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,KAAK,EACV,qBAAqB,EACrB,iBAAiB,EACjB,SAAS,EACV,MAAM,OAAO,CAAC;AAEf;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;CAC7C,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/ListItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EACV,qBAAqB,EACrB,iBAAiB,EACjB,SAAS,EACV,MAAM,OAAO,CAAC;AAEf;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;CAC7C,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}