@ledgerhq/lumen-ui-react 0.1.35 → 0.1.36

package/dist/lib/Components/DotIcon/DotIcon.js

@@ -1,8 +1,15 @@
-import { jsxs as u, jsx as r } from "react/jsx-runtime";
-import { cn as n } from "../../../libs/utils-shared/dist/index.js";
-import { cva as b } from "class-variance-authority";
-import { useMemo as f } from "react";
-const x = b(
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { useDisabledContext as v, DisabledProvider as x, cn as n } from "../../../libs/utils-shared/dist/index.js";
+import { cva as c } from "class-variance-authority";
+import { useMemo as g } from "react";
+const z = c("relative inline-flex w-fit", {
+  variants: {
+    disabled: {
+      true: "opacity-30",
+      false: ""
+    }
+  }
+}), N = c(
   "absolute z-10 box-content flex items-center justify-center overflow-hidden border-base-inverted",
   {
     variants: {
@@ -34,64 +41,68 @@ const x = b(
       { shape: "circle", className: "rounded-full" }
     ]
   }
-), q = {
+), V = {
   40: 16,
   48: 20,
   56: 24,
   64: 24
-}, S = {
+}, w = {
   40: 16,
   48: 20,
   56: 24,
   72: 24
-}, h = {
+}, D = {
   16: 12,
   20: 16,
   24: 16
-}, z = {
+}, I = {
   "top-start": ["top", "left"],
   "top-end": ["top", "right"],
   "bottom-start": ["bottom", "left"],
   "bottom-end": ["bottom", "right"]
-}, c = -3, g = (e) => {
-  const [t, o] = z[e];
-  return { [t]: c, [o]: c };
-}, v = ({
-  children: e,
-  icon: t,
+}, i = -3, M = (t) => {
+  const [s, o] = I[t];
+  return { [s]: i, [o]: i };
+}, q = ({
+  children: t,
+  icon: s,
   appearance: o,
-  pin: s = "bottom-end",
-  size: a = 20,
-  shape: i = "circle",
-  className: d,
-  ref: m,
-  ...p
+  pin: a = "bottom-end",
+  size: r = 20,
+  shape: d = "circle",
+  className: l,
+  disabled: m = !1,
+  ref: p,
+  ...b
 }) => {
-  const l = f(() => g(s), [s]);
-  return /* @__PURE__ */ u(
+  const u = g(() => M(a), [a]), f = v({
+    consumerName: "DotIcon",
+    mergeWith: { disabled: m }
+  });
+  return /* @__PURE__ */ e(x, { value: { disabled: !1 }, children: /* @__PURE__ */ h(
     "div",
     {
-      ref: m,
-      className: n("relative inline-flex w-fit", d),
-      ...p,
+      ref: p,
+      className: n(z({ disabled: f, className: l })),
+      ...b,
       children: [
-        /* @__PURE__ */ r("div", { className: "inline-flex", children: e }),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ e("div", { className: "inline-flex", children: t }),
+        /* @__PURE__ */ e(
           "div",
           {
-            className: n(x({ size: a, shape: i, pin: s, appearance: o })),
-            style: l,
-            children: /* @__PURE__ */ r(t, { size: h[a], className: "text-on-interactive" })
+            className: n(N({ size: r, shape: d, pin: a, appearance: o })),
+            style: u,
+            children: /* @__PURE__ */ e(s, { size: D[r], className: "text-on-interactive" })
           }
         )
       ]
     }
-  );
+  ) });
 };
-v.displayName = "DotIcon";
+q.displayName = "DotIcon";
 export {
-  v as DotIcon,
-  h as dotIconSizeMap,
-  q as mediaImageDotIconSizeMap,
-  S as spotDotIconSizeMap
+  q as DotIcon,
+  D as dotIconSizeMap,
+  V as mediaImageDotIconSizeMap,
+  w as spotDotIconSizeMap
 };

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

@@ -34,6 +34,12 @@ export type DotIconProps = {
      * Additional custom CSS classes to apply to the wrapper.
      */
     className?: string;
+    /**
+     * Shows a disabled appearance.
+     * @optional
+     * @default false
+     */
+    disabled?: boolean;
     /**
      * The wrapped component (e.g. MediaImage or Spot).
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotIcon/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,MAAM,WAAW,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvC,MAAM,MAAM,UAAU,GAClB,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,CAAC;AAEjB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAE9D,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,IAAI,EAAE,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7D;;OAEG;IACH,UAAU,EAAE,iBAAiB,CAAC;IAC9B;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotIcon/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,MAAM,WAAW,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvC,MAAM,MAAM,UAAU,GAClB,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,CAAC;AAEjB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAE9D,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,IAAI,EAAE,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7D;;OAEG;IACH,UAAU,EAAE,iBAAiB,CAAC;IAC9B;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC"}

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

@@ -15,7 +15,7 @@ export declare const spotDotSizeMap: Record<SpotSize, DotSymbolSize>;
  * </DotSymbol>
  */
 export declare const DotSymbol: {
-    ({ children, src, alt, pin, size, shape, imgLoading, className, ref, ...rest }: DotSymbolProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, src, alt, pin, size, shape, imgLoading, className, disabled: disabledProp, ref, ...rest }: DotSymbolProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 //# sourceMappingURL=DotSymbol.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"DotSymbol.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotSymbol/DotSymbol.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,KAAK,EAAgB,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAiD3E,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,cAAc,EAAE,aAAa,CAU7D,CAAC;AAEX,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,QAAQ,EAAE,aAAa,CAMjD,CAAC;AAmBX;;;;;;;;;;GAUG;AACH,eAAO,MAAM,SAAS;oFAWnB,cAAc;;CA4BhB,CAAC"}
+{"version":3,"file":"DotSymbol.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotSymbol/DotSymbol.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,KAAK,EAAgB,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AA0D3E,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,cAAc,EAAE,aAAa,CAU7D,CAAC;AAEX,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,QAAQ,EAAE,aAAa,CAMjD,CAAC;AAmBX;;;;;;;;;;GAUG;AACH,eAAO,MAAM,SAAS;4GAYnB,cAAc;;CAkChB,CAAC"}

package/dist/lib/Components/DotSymbol/DotSymbol.js

@@ -1,8 +1,15 @@
-import { jsxs as f, jsx as a } from "react/jsx-runtime";
-import { cn as b } from "../../../libs/utils-shared/dist/index.js";
-import { cva as h } from "class-variance-authority";
-import { useMemo as z, useState as x, useEffect as N } from "react";
-const v = h(
+import { jsx as o, jsxs as z } from "react/jsx-runtime";
+import { useDisabledContext as x, DisabledProvider as v, cn as N } from "../../../libs/utils-shared/dist/index.js";
+import { cva as d } from "class-variance-authority";
+import { useMemo as g, useState as q, useEffect as y } from "react";
+const D = d("relative inline-flex w-fit", {
+  variants: {
+    disabled: {
+      true: "opacity-30",
+      false: ""
+    }
+  }
+}), S = d(
   "absolute z-10 box-content overflow-hidden border-base-inverted bg-muted",
   {
     variants: {
@@ -38,14 +45,14 @@ const v = h(
       { shape: "circle", className: "rounded-full" }
     ]
   }
-), g = {
+), M = {
   8: -2,
   10: -2,
   12: -2,
   16: -3,
   20: -3,
   24: -3
-}, w = {
+}, C = {
   12: 8,
   16: 8,
   20: 8,
@@ -55,60 +62,64 @@ const v = h(
   48: 20,
   56: 24,
   64: 24
-}, V = {
+}, I = {
   32: 12,
   40: 16,
   48: 20,
   56: 24,
   72: 24
-}, q = {
+}, E = {
   "top-start": ["top", "left"],
   "top-end": ["top", "right"],
   "bottom-start": ["bottom", "left"],
   "bottom-end": ["bottom", "right"]
-}, S = (o, t) => {
-  const [r, s] = q[o], e = g[t];
+}, V = (a, t) => {
+  const [r, s] = E[a], e = M[t];
   return { [r]: e, [s]: e };
-}, y = ({
-  children: o,
+}, j = ({
+  children: a,
   src: t,
   alt: r,
   pin: s = "bottom-end",
   size: e = 20,
   shape: n = "circle",
-  imgLoading: d = "eager",
-  className: m,
-  ref: c,
-  ...l
+  imgLoading: l = "eager",
+  className: c,
+  disabled: m = !1,
+  ref: p,
+  ...u
 }) => {
-  const p = z(() => S(s, e), [s, e]), [u, i] = x(!1);
-  return N(() => {
+  const b = g(() => V(s, e), [s, e]), [f, i] = q(!1), h = x({
+    consumerName: "DotSymbol",
+    mergeWith: { disabled: m }
+  });
+  return y(() => {
     i(!1);
-  }, [t]), /* @__PURE__ */ f(
+  }, [t]), /* @__PURE__ */ o(v, { value: { disabled: !1 }, children: /* @__PURE__ */ z(
     "div",
     {
-      ref: c,
-      className: b("relative inline-flex w-fit", m),
-      ...l,
+      ref: p,
+      className: N(D({ disabled: h, className: c })),
+      ...u,
       children: [
-        /* @__PURE__ */ a("div", { className: "inline-flex", children: o }),
-        /* @__PURE__ */ a("div", { className: v({ size: e, shape: n, pin: s }), style: p, children: !u && /* @__PURE__ */ a(
+        /* @__PURE__ */ o("div", { className: "inline-flex", children: a }),
+        /* @__PURE__ */ o("div", { className: S({ size: e, shape: n, pin: s }), style: b, children: !f && /* @__PURE__ */ o(
           "img",
           {
             alt: r,
             src: t,
-            loading: d,
+            loading: l,
             "aria-hidden": "true",
             onError: () => i(!0)
           }
         ) })
       ]
     }
-  );
+  ) });
 };
-y.displayName = "DotSymbol";
+j.displayName = "DotSymbol";
 export {
-  y as DotSymbol,
-  w as mediaImageDotSizeMap,
-  V as spotDotSizeMap
+  j as DotSymbol,
+  C as mediaImageDotSizeMap,
+  I as spotDotSizeMap
 };

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

@@ -37,6 +37,12 @@ export type DotSymbolProps = {
      * Additional custom CSS classes to apply to the wrapper.
      */
     className?: string;
+    /**
+     * Shows a disabled appearance.
+     * @optional
+     * @default false
+     */
+    disabled?: boolean;
     /**
      * The wrapped component (e.g. MediaImage or Spot).
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotSymbol/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvD,MAAM,MAAM,YAAY,GACpB,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,CAAC;AAEjB,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC5B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC9B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/DotSymbol/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvD,MAAM,MAAM,YAAY,GACpB,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,CAAC;AAEjB,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC5B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC9B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC"}

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

@@ -14,17 +14,17 @@ import { MediaButtonProps } from './types';
  * import { Settings } from '@ledgerhq/lumen-ui-react/symbols';
  *
  * // With flat interface icon
- * <MediaButton icon={<Settings size={20} />} iconType="flat">
+ * <MediaButton leadingContent={<Settings size={20} />} leadingContentShape="flat">
  *   Network
  * </MediaButton>
  *
  * // With rounded crypto icon
- * <MediaButton icon={<CryptoIcon ledgerId="bitcoin" size={32} />} iconType="rounded">
+ * <MediaButton leadingContent={<CryptoIcon ledgerId="bitcoin" size={32} />} leadingContentShape="rounded">
  *   Bitcoin
  * </MediaButton>
  *
  * // Without icon
  * <MediaButton>All accounts</MediaButton>
  */
-export declare const MediaButton: ({ ref, className, appearance, size, disabled: disabledProp, asChild, icon, iconType, hideChevron, children, ...props }: MediaButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MediaButton: ({ ref, className, appearance, size, disabled: disabledProp, asChild, leadingContent, leadingContentShape, hideChevron, children, ...props }: MediaButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=MediaButton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"MediaButton.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaButton/MediaButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AA4BhD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,WAAW,GAAI,wHAYzB,gBAAgB,4CAqClB,CAAC"}
+{"version":3,"file":"MediaButton.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaButton/MediaButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AA4BhD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,WAAW,GAAI,6IAYzB,gBAAgB,4CA4ClB,CAAC"}

package/dist/lib/Components/MediaButton/MediaButton.js

@@ -1,76 +1,78 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { useDisabledContext as u, cn as x } from "../../../libs/utils-shared/dist/index.js";
-import { Slot as b, Slottable as T } from "@radix-ui/react-slot";
-import { cva as z } from "class-variance-authority";
-import { baseButtonVariants as g } from "../Button/BaseButton.js";
-import { ChevronDown as v } from "../../Symbols/Icons/ChevronDown.js";
-const N = z("gap-8 body-2-semi-bold", {
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { useDisabledContext as h, cn as u } from "../../../libs/utils-shared/dist/index.js";
+import { Slot as S, Slottable as x } from "@radix-ui/react-slot";
+import { cva as C } from "class-variance-authority";
+import { baseButtonVariants as b } from "../Button/BaseButton.js";
+import { ChevronDown as z } from "../../Symbols/Icons/ChevronDown.js";
+const y = C("gap-8 body-2-semi-bold", {
   variants: {
     size: {
       sm: "",
       md: ""
     },
-    iconType: {
+    leadingContentShape: {
       flat: "",
       rounded: "",
       none: ""
     }
   },
   compoundVariants: [
-    { size: "md", iconType: "flat", class: "px-16 py-12" },
-    { size: "md", iconType: "rounded", class: "py-8 pr-16 pl-8" },
-    { size: "md", iconType: "none", class: "px-16 py-14" },
-    { size: "sm", iconType: "flat", class: "px-12 py-10" },
-    { size: "sm", iconType: "rounded", class: "py-8 pr-10 pl-8" },
-    { size: "sm", iconType: "none", class: "px-12 py-10" }
+    { size: "md", leadingContentShape: "flat", class: "px-16 py-12" },
+    { size: "md", leadingContentShape: "rounded", class: "py-8 pr-16 pl-8" },
+    { size: "md", leadingContentShape: "none", class: "px-16 py-14" },
+    { size: "sm", leadingContentShape: "flat", class: "px-12 py-10" },
+    { size: "sm", leadingContentShape: "rounded", class: "py-8 pr-10 pl-8" },
+    { size: "sm", leadingContentShape: "none", class: "px-12 py-10" }
   ],
   defaultVariants: {
     size: "md",
-    iconType: "none"
+    leadingContentShape: "none"
   }
-}), S = ({
+}), k = ({
   ref: i,
-  className: p,
-  appearance: l = "gray",
+  className: l,
+  appearance: p = "gray",
   size: r = "md",
   disabled: m = !1,
-  asChild: n = !1,
-  icon: s,
-  iconType: c = "flat",
-  hideChevron: d = !1,
-  children: o,
+  asChild: a = !1,
+  leadingContent: n,
+  leadingContentShape: d = "flat",
+  hideChevron: c = !1,
+  children: s,
   ...f
 }) => {
-  const a = u({
+  const t = h({
     consumerName: "MediaButton",
     mergeWith: { disabled: m }
-  }), y = s ? c : "none";
-  return /* @__PURE__ */ t(
-    n ? b : "button",
+  }), g = n ? d : "none";
+  return /* @__PURE__ */ o(
+    a ? S : "button",
     {
       ref: i,
-      className: x(
-        g({
-          appearance: l,
-          disabled: a,
+      className: u(
+        b({
+          appearance: p,
+          disabled: t,
           loading: !1
         }),
-        N({ size: r, iconType: y }),
-        p
+        y({
+          size: r,
+          leadingContentShape: g
+        }),
+        l
       ),
-      "data-disabled": a || void 0,
-      disabled: a,
+      disabled: t,
       ...f,
       children: [
-        s && /* @__PURE__ */ e("span", { className: "inline-flex shrink-0 items-center", children: s }),
-        /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: [
-          n ? /* @__PURE__ */ e(T, { children: o }) : /* @__PURE__ */ e("span", { className: "line-clamp-1 text-left", children: o }),
-          !d && /* @__PURE__ */ e(v, { size: 20 })
+        n && /* @__PURE__ */ e("span", { className: "inline-flex shrink-0 items-center", children: n }),
+        /* @__PURE__ */ o("span", { className: "flex items-center gap-2", children: [
+          a ? /* @__PURE__ */ e(x, { children: s }) : /* @__PURE__ */ e("span", { className: "line-clamp-1 text-left", children: s }),
+          !c && /* @__PURE__ */ e(z, { size: 20 })
         ] })
       ]
     }
   );
 };
 export {
-  S as MediaButton
+  k as MediaButton
 };

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

@@ -12,19 +12,19 @@ export type MediaButtonProps = {
      */
     size?: 'sm' | 'md';
     /**
-     * An optional pre-rendered icon to display as leading content.
+     * An optional leading content, usually a pre-rendered icon.
      * Consumer is responsible for sizing the icon (typically 20px).
      */
-    icon?: ReactNode;
+    leadingContent?: ReactNode;
     /**
-     * Determines the padding scheme when an icon is present.
+     * Determines the padding scheme when `leadingContent` is present.
      * - `'flat'`: Standard padding for line/interface icons.
      * - `'rounded'`: Tighter left padding for circular icons with their own background (e.g., crypto icons).
      *
-     * Only relevant when `icon` is provided.
+     * Only relevant when `leadingContent` is provided.
      * @default 'flat'
      */
-    iconType?: 'flat' | 'rounded';
+    leadingContentShape?: 'flat' | 'rounded';
     /**
      * When true, hides the trailing chevron indicator.
      * @default false

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,GAAG,eAAe,CAAC;IACtD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,WAAW,GAAG,SAAS,CAAC,GAC7D,qBAAqB,CAAC,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,GAAG,eAAe,CAAC;IACtD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B;;;;;;;OAOG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,WAAW,GAAG,SAAS,CAAC,GAC7D,qBAAqB,CAAC,QAAQ,CAAC,CAAC"}

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

@@ -16,5 +16,5 @@ export declare const fontSizeMap: Record<MediaImageSize, number>;
  * <MediaImage fallback="Bitcoin" size={32} />
  * <MediaImage loading size={32} />
  */
-export declare const MediaImage: ({ ref, className, src, alt, size, shape, imgLoading, fallback, loading, ...props }: MediaImageProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MediaImage: ({ ref, className, src, alt, size, shape, imgLoading, fallback, loading, disabled: disabledProp, ...props }: MediaImageProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=MediaImage.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"MediaImage.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaImage/MediaImage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE/D,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAUtD,CAAC;AA2BF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU,GAAI,oFAWxB,eAAe,4CAyCjB,CAAC"}
+{"version":3,"file":"MediaImage.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaImage/MediaImage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE/D,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAUtD,CAAC;AA+BF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU,GAAI,4GAYxB,eAAe,4CAgDjB,CAAC"}

package/dist/lib/Components/MediaImage/MediaImage.js

@@ -1,9 +1,9 @@
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import { cn as z } from "../../../libs/utils-shared/dist/index.js";
-import { cva as h } from "class-variance-authority";
-import { useState as x, useEffect as g } from "react";
-import { Skeleton as v } from "../Skeleton/Skeleton.js";
-const N = {
+import { jsxs as h, jsx as s } from "react/jsx-runtime";
+import { useDisabledContext as x, cn as b } from "../../../libs/utils-shared/dist/index.js";
+import { cva as g } from "class-variance-authority";
+import { useState as v, useEffect as N } from "react";
+import { Skeleton as j } from "../Skeleton/Skeleton.js";
+const S = {
   12: 10,
   16: 10,
   20: 12,
@@ -13,8 +13,8 @@ const N = {
   48: 24,
   56: 24,
   64: 24
-}, b = {
-  root: h(
+}, y = {
+  root: g(
     "relative inline-flex shrink-0 items-center justify-center overflow-hidden bg-muted outline-1 -outline-offset-1 outline-icon",
     {
       variants: {
@@ -32,52 +32,63 @@ const N = {
         shape: {
           square: "",
           circle: "rounded-full"
+        },
+        disabled: {
+          true: "opacity-30",
+          false: ""
         }
       }
     }
   )
-}, I = ({
-  ref: a,
+}, k = ({
+  ref: n,
   className: d,
-  src: s,
+  src: r,
   alt: l,
-  size: i = 48,
+  size: a = 48,
   shape: u = "square",
   imgLoading: m = "eager",
   fallback: t,
   loading: e = !1,
-  ...c
+  disabled: c = !1,
+  ...f
 }) => {
-  const [f, n] = x(!1), o = !s || f;
-  return g(() => {
-    n(!1);
-  }, [s]), /* @__PURE__ */ p(
+  const [p, i] = v(!1), o = !r || p, z = x({
+    consumerName: "MediaImage",
+    mergeWith: { disabled: c }
+  });
+  return N(() => {
+    i(!1);
+  }, [r]), /* @__PURE__ */ h(
     "div",
     {
-      ref: a,
-      className: z(b.root({ size: i, shape: u }), d),
+      ref: n,
+      className: b(
+        y.root({ size: a, shape: u, disabled: z }),
+        d
+      ),
       role: "img",
       "aria-label": l,
-      ...c,
+      ...f,
       children: [
-        e && /* @__PURE__ */ r(v, { className: "absolute inset-0" }),
-        !e && o && t && /* @__PURE__ */ r(
+        e && /* @__PURE__ */ s(j, { className: "absolute inset-0" }),
+        !e && o && t && /* @__PURE__ */ s(
           "span",
           {
             className: "text-base select-none",
-            style: { fontSize: N[i] },
+            style: { fontSize: S[a] },
             "aria-hidden": "true",
             children: t[0]?.toUpperCase()
           }
         ),
-        !e && o && !t && /* @__PURE__ */ r("span", { className: "text-muted select-none", "aria-hidden": "true" }),
-        !e && !o && /* @__PURE__ */ r(
+        !e && o && !t && /* @__PURE__ */ s("span", { className: "text-muted select-none", "aria-hidden": "true" }),
+        !e && !o && /* @__PURE__ */ s(
           "img",
           {
-            src: s,
+            src: r,
             alt: "",
             loading: m,
-            onError: () => n(!0),
+            onError: () => i(!0),
             className: "size-full object-cover",
             "aria-hidden": "true"
           }
@@ -87,6 +98,6 @@ const N = {
   );
 };
 export {
-  I as MediaImage,
-  N as fontSizeMap
+  k as MediaImage,
+  S as fontSizeMap
 };

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

@@ -41,6 +41,12 @@ export type MediaImageProps = {
      * @default false
      */
     loading?: boolean;
+    /**
+     * Shows a disabled appearance.
+     * @optional
+     * @default false
+     */
+    disabled?: boolean;
     /**
      * Additional custom CSS classes to apply. Do not use this prop to modify the component's core appearance.
      * @optional

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaImage/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,cAAc,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAExE,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAElD,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC9B;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaImage/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,cAAc,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAExE,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAElD,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC9B;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC"}