@ledgerhq/lumen-ui-react 0.1.17 → 0.1.19

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

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

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

@@ -1,6 +1,3 @@
 import { DialogHeaderProps } from '../types';
-export declare const DialogHeader: {
-    ({ ref, title, description, appearance, ...props }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const DialogHeader: ({ ref, title, description, appearance, ...props }: DialogHeaderProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DialogHeader.d.ts.map

package/dist/lib/Components/Dialog/DialogHeader/DialogHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Dialog/DialogHeader/DialogHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAkJ7C,eAAO,MAAM,YAAY;wDAMtB,iBAAiB;;CAqBnB,CAAC"}
+{"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Dialog/DialogHeader/DialogHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAiJ7C,eAAO,MAAM,YAAY,GAAI,mDAM1B,iBAAiB,4CAqBnB,CAAC"}

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

@@ -1,13 +1,13 @@
 import { jsxs as i, Fragment as s, jsx as e } from "react/jsx-runtime";
 import { cn as c } from "../../../../libs/utils-shared/dist/index.js";
-import * as h from "@radix-ui/react-dialog";
-import { cva as N } from "class-variance-authority";
-import { useCommonTranslation as g } from "../../../../i18n/useCommonTranslation.js";
-import { IconButton as x } from "../../IconButton/IconButton.js";
-import { ArrowLeft as b } from "../../../Symbols/Icons/ArrowLeft.js";
-import { DialogClose as v } from "../DialogClose/DialogClose.js";
-import { Close as D } from "../../../Symbols/Icons/Close.js";
-const C = N("flex px-24 text-base", {
+import * as p from "@radix-ui/react-dialog";
+import { cva as u } from "class-variance-authority";
+import { useCommonTranslation as x } from "../../../../i18n/useCommonTranslation.js";
+import { IconButton as f } from "../../IconButton/IconButton.js";
+import { ArrowLeft as N } from "../../../Symbols/Icons/ArrowLeft.js";
+import { DialogClose as b } from "../DialogClose/DialogClose.js";
+import { Close as v } from "../../../Symbols/Icons/Close.js";
+const D = u("flex px-24 text-base", {
   variants: {
     appearance: {
       compact: "mb-12 h-64 min-h-64 flex-row items-center gap-12",
@@ -15,46 +15,46 @@ const C = N("flex px-24 text-base", {
     }
   }
 }), d = ({ onBack: r }) => {
-  const { t: a } = g();
+  const { t: a } = x();
   return /* @__PURE__ */ e(
-    x,
+    f,
     {
       appearance: "no-background",
       size: "sm",
-      icon: b,
+      icon: N,
       onClick: r,
       className: "-ml-12 shrink-0",
       "aria-label": a("components.dialogHeader.goBackAriaLabel")
     }
   );
-}, p = ({ onClose: r }) => {
-  const { t: a } = g();
-  return /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ e(
-    x,
+}, h = ({ onClose: r }) => {
+  const { t: a } = x();
+  return /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ e(
+    f,
     {
       appearance: "gray",
       size: "xs",
-      icon: D,
+      icon: v,
       onClick: r,
       className: "-mr-8 shrink-0",
       "aria-label": a("components.dialogHeader.closeAriaLabel")
     }
   ) });
-}, y = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
-  h.Title,
+}, C = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
+  p.Title,
   {
     "data-slot": "dialog-title",
     className: c(r && "sr-only", a),
     ...o
   }
-), H = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
-  h.Description,
+), y = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
+  p.Description,
   {
     "data-slot": "dialog-description",
     className: c(r && "sr-only", a),
     ...o
   }
-), f = ({
+), H = ({
   ref: r,
   className: a,
   appearance: o = "compact",
@@ -62,13 +62,13 @@ const C = N("flex px-24 text-base", {
   description: t,
   onClose: m,
   onBack: n,
-  ...u
+  ...g
 }) => /* @__PURE__ */ i(
   "div",
   {
     ref: r,
-    className: C({ appearance: o, className: a }),
-    ...u,
+    className: D({ appearance: o, className: a }),
+    ...g,
     children: [
       o === "compact" && /* @__PURE__ */ i(s, { children: [
         n && /* @__PURE__ */ e(d, { onBack: n }),
@@ -84,12 +84,12 @@ const C = N("flex px-24 text-base", {
             ]
           }
         ),
-        /* @__PURE__ */ e(p, { onClose: m })
+        /* @__PURE__ */ e(h, { onClose: m })
       ] }),
       o === "expanded" && /* @__PURE__ */ i(s, { children: [
         /* @__PURE__ */ i("div", { className: "flex h-40 flex-row items-center", children: [
           n && /* @__PURE__ */ e(d, { onBack: n }),
-          /* @__PURE__ */ e("div", { className: "ml-auto", children: /* @__PURE__ */ e(p, { onClose: m }) })
+          /* @__PURE__ */ e("div", { className: "ml-auto", children: /* @__PURE__ */ e(h, { onClose: m }) })
         ] }),
         (l || t) && /* @__PURE__ */ i("div", { className: "flex flex-col gap-4", children: [
           l && /* @__PURE__ */ e("div", { className: "heading-3-semi-bold", children: l }),
@@ -98,9 +98,7 @@ const C = N("flex px-24 text-base", {
       ] })
     ]
   }
-);
-f.displayName = "DialogHeaderComponent";
-const w = ({
+), F = ({
   ref: r,
   title: a = "",
   description: o,
@@ -108,7 +106,7 @@ const w = ({
   ...t
 }) => /* @__PURE__ */ i(s, { children: [
   /* @__PURE__ */ e(
-    f,
+    H,
     {
       ref: r,
       title: a,
@@ -117,10 +115,9 @@ const w = ({
       ...t
     }
   ),
-  /* @__PURE__ */ e(y, { hidden: !0, children: a }),
-  o && /* @__PURE__ */ e(H, { hidden: !0, children: o })
+  /* @__PURE__ */ e(C, { hidden: !0, children: a }),
+  o && /* @__PURE__ */ e(y, { hidden: !0, children: o })
 ] });
-w.displayName = "DialogHeader";
 export {
-  w as DialogHeader
+  F as DialogHeader
 };

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

@@ -19,8 +19,5 @@ import { DividerProps } from './types';
  * // With custom styling
  * <Divider className="my-16" />
  */
-export declare const Divider: {
-    ({ ref, className, orientation, ...props }: DividerProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const Divider: ({ ref, className, orientation, ...props }: DividerProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Divider.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Divider/Divider.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,OAAO;gDAKjB,YAAY;;CAcd,CAAC"}
+{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Divider/Divider.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,OAAO,GAAI,2CAKrB,YAAY,4CAcd,CAAC"}

package/dist/lib/Components/Divider/Divider.js

@@ -1,25 +1,24 @@
-import { jsx as a } from "react/jsx-runtime";
-import { cn as i } from "../../../libs/utils-shared/dist/index.js";
-const l = ({
+import { jsx as l } from "react/jsx-runtime";
+import { cn as a } from "../../../libs/utils-shared/dist/index.js";
+const d = ({
   ref: o,
-  className: e,
+  className: t,
   orientation: r = "horizontal",
-  ...t
-}) => /* @__PURE__ */ a(
+  ...e
+}) => /* @__PURE__ */ l(
   "div",
   {
     ref: o,
     role: "separator",
     "aria-orientation": r,
-    className: i(
+    className: a(
       "border-muted-subtle",
       r === "horizontal" ? "w-full border-t" : "h-full border-l",
-      e
+      t
     ),
-    ...t
+    ...e
   }
 );
-l.displayName = "Divider";
 export {
-  l as Divider
+  d as Divider
 };

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

@@ -1,6 +1,3 @@
 import { IconProps } from './types';
-export declare const Icon: {
-    ({ ref, size, className, children, viewBox, xmlns, ...props }: IconProps): import('react').ReactSVGElement;
-    displayName: string;
-};
+export declare const Icon: ({ ref, size, className, children, viewBox, xmlns, ...props }: IconProps) => import('react').ReactSVGElement;
 //# sourceMappingURL=Icon.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Icon/Icon.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAoBpC,eAAO,MAAM,IAAI;mEAQd,SAAS;;CAcX,CAAC"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Icon/Icon.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAoBpC,eAAO,MAAM,IAAI,GAAI,8DAQlB,SAAS,oCAcX,CAAC"}

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

@@ -17,13 +17,13 @@ const h = a("inline-block shrink-0", {
   defaultVariants: {
     size: 24
   }
-}), l = ({
+}), f = ({
   ref: o,
   size: n = 24,
   className: i = "",
   children: c,
-  viewBox: e,
-  xmlns: r,
+  viewBox: r,
+  xmlns: e,
   ...t
 }) => k(
   "svg",
@@ -31,14 +31,13 @@ const h = a("inline-block shrink-0", {
     ref: o,
     fill: "none",
     "aria-hidden": "true",
-    xmlns: r,
-    viewBox: e,
+    xmlns: e,
+    viewBox: r,
     className: s(i, h({ size: n }), "inline-block"),
     ...t
   },
   c
 );
-l.displayName = "Icon";
 export {
-  l as Icon
+  f as Icon
 };

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

@@ -1,6 +1,3 @@
 import { IconButtonProps } from './types';
-export declare const IconButton: {
-    ({ ref, className, icon, tooltip, tooltipPlacement, tooltipText, onTooltipOpenChange, "aria-label": ariaLabel, ...props }: IconButtonProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const IconButton: ({ ref, className, icon, tooltip, tooltipPlacement, tooltipText, onTooltipOpenChange, "aria-label": ariaLabel, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=IconButton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,eAAO,MAAM,UAAU;+HAUpB,eAAe;;CAuBjB,CAAC"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,eAAO,MAAM,UAAU,GAAI,0HAUxB,eAAe,4CAuBjB,CAAC"}

package/dist/lib/Components/IconButton/IconButton.js

@@ -2,7 +2,7 @@ import { jsxs as m, jsx as o } from "react/jsx-runtime";
 import { Tooltip as u, TooltipTrigger as d, TooltipContent as f } from "../Tooltip/Tooltip.js";
 import { BaseButton as h } from "../Button/BaseButton.js";
 const B = ({
-  ref: r,
+  ref: n,
   className: e,
   icon: i,
   tooltip: l = !1,
@@ -12,10 +12,10 @@ const B = ({
   "aria-label": t,
   ...c
 }) => {
-  const n = /* @__PURE__ */ o(
+  const r = /* @__PURE__ */ o(
     h,
     {
-      ref: r,
+      ref: n,
       icon: i,
       className: e,
       "aria-label": t,
@@ -23,11 +23,10 @@ const B = ({
     }
   );
   return l ? /* @__PURE__ */ m(u, { onOpenChange: a, children: [
-    /* @__PURE__ */ o(d, { asChild: !0, children: n }),
+    /* @__PURE__ */ o(d, { asChild: !0, children: r }),
     /* @__PURE__ */ o(f, { side: p, children: s || t })
-  ] }) : n;
+  ] }) : r;
 };
-B.displayName = "IconButton";
 export {
   B as IconButton
 };

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

@@ -11,7 +11,6 @@ import { InteractiveIconProps } from './types';
  * @component
  *
  * @warning Always provide an `aria-label` prop to ensure screen reader accessibility, as the component contains only an icon without visible text.
- * @warning The icon size should be controlled by the icon component itself, not through CSS. Use the appropriate size prop on the icon component (e.g., `size={20}`).
  * @warning The `className` prop should only be used for layout adjustments like margins or positioning. Do not use it to modify the component's core appearance (colors, padding, etc).
  *
  * @example
@@ -19,17 +18,10 @@ import { InteractiveIconProps } from './types';
  * import { DeleteCircleFill, Settings } from '@ledgerhq/lumen-ui-react/symbols';
  *
  * // Filled interactive icon for destructive actions
- * <InteractiveIcon iconType="filled" aria-label="Delete item" onClick={handleDelete}>
- *   <DeleteCircleFill size={20} />
- * </InteractiveIcon>
+ * <InteractiveIcon iconType="filled" icon={DeleteCircleFill} size={20} aria-label="Delete item" onClick={handleDelete} />
  *
  * // Stroked interactive icon for secondary actions
- * <InteractiveIcon iconType="stroked" aria-label="Open settings" onClick={handleSettings}>
- *   <Settings size={20} />
- * </InteractiveIcon>
+ * <InteractiveIcon iconType="stroked" icon={Settings} size={20} aria-label="Open settings" onClick={handleSettings} />
  */
-export declare const InteractiveIcon: {
-    ({ ref, className, iconType, appearance, disabled: disabledProp, ...props }: InteractiveIconProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const InteractiveIcon: ({ ref, className, iconType, icon: Icon, size, appearance, disabled: disabledProp, ...props }: InteractiveIconProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=InteractiveIcon.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"InteractiveIcon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/InteractiveIcon/InteractiveIcon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AA6B/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,eAAe;iFAOzB,oBAAoB;;CAiBtB,CAAC"}
+{"version":3,"file":"InteractiveIcon.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/InteractiveIcon/InteractiveIcon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AA6B/C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,eAAe,GAAI,8FAS7B,oBAAoB,4CAmBtB,CAAC"}

package/dist/lib/Components/InteractiveIcon/InteractiveIcon.js

@@ -1,7 +1,7 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useDisabledContext as d, cn as c } from "../../../libs/utils-shared/dist/index.js";
-import { cva as l } from "class-variance-authority";
-const b = l(
+import { jsx as t } from "react/jsx-runtime";
+import { useDisabledContext as l, cn as b } from "../../../libs/utils-shared/dist/index.js";
+import { cva as u } from "class-variance-authority";
+const v = u(
   [
     "inline-flex size-fit items-center justify-center rounded-full",
     "transition-colors",
@@ -25,32 +25,34 @@ const b = l(
       }
     }
   }
-), u = ({
-  ref: t,
-  className: s,
-  iconType: a,
-  appearance: i = "muted",
-  disabled: r = !1,
-  ...o
+), h = ({
+  ref: s,
+  className: i,
+  iconType: r,
+  icon: a,
+  size: o = 24,
+  appearance: n = "muted",
+  disabled: d = !1,
+  ...c
 }) => {
-  const e = d({
+  const e = l({
     consumerName: "InteractiveIcon",
-    mergeWith: { disabled: r }
+    mergeWith: { disabled: d }
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ t(
     "button",
     {
-      ...o,
-      ref: t,
+      ...c,
+      ref: s,
       disabled: e,
-      className: c(
-        s,
-        b({ disabled: e, iconType: a, appearance: i })
-      )
+      className: b(
+        i,
+        v({ disabled: e, iconType: r, appearance: n })
+      ),
+      children: /* @__PURE__ */ t(a, { size: o })
     }
   );
 };
-u.displayName = "InteractiveIcon";
 export {
-  u as InteractiveIcon
+  h as InteractiveIcon
 };

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

@@ -1,4 +1,5 @@
-import { ComponentPropsWithRef, ReactNode } from 'react';
+import { ComponentPropsWithRef, ComponentType } from 'react';
+import { IconProps, IconSize } from '../Icon';
 export type InteractiveIconProps = {
     /**
      * Whether the icon is disabled.
@@ -11,17 +12,21 @@ export type InteractiveIconProps = {
      */
     iconType: 'filled' | 'stroked';
     /**
-     * The visual style of the icon button.
-     * - 'muted': with muted background
-     * - 'white': with white background
-     * - 'base': with base background
+     * The color appearance of the icon.
+     * - 'muted': Subdued color for secondary actions.
+     * - 'white': White color for use on dark backgrounds.
+     * - 'base': Default high-contrast color.
      * @default 'muted'
      */
     appearance?: 'muted' | 'white' | 'base';
     /**
-     * The icon component to display inside the button.
-     * Should be a single icon element from the design system.
+     * The icon component to render.
+     */
+    icon: ComponentType<Omit<IconProps, 'children'>>;
+    /**
+     * The size of the icon in pixels.
+     * @default 24
      */
-    children: ReactNode;
-} & Omit<ComponentPropsWithRef<'button'>, 'disabled'>;
+    size?: IconSize;
+} & Omit<ComponentPropsWithRef<'button'>, 'disabled' | 'children'>;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/InteractiveIcon/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,oBAAoB,GAAG;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC/B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IACxC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/InteractiveIcon/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAE9C,MAAM,MAAM,oBAAoB,GAAG;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC/B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IACxC;;OAEG;IACH,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACjD;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB,GAAG,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,CAAC"}

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

@@ -38,8 +38,5 @@ import { LinkProps } from './types';
  * // Note: When using asChild, the child element is responsible for its own content.
  * // Icons and other Link props like 'icon' are ignored when asChild is true - handle these in the child if needed.
  */
-export declare const Link: {
-    ({ ref, className, children, appearance, size, underline, icon, isExternal, asChild, disabled: disabledProp, ...props }: LinkProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const Link: ({ ref, className, children, appearance, size, underline, icon, isExternal, asChild, disabled: disabledProp, ...props }: LinkProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Link.d.ts.map

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

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