@ledgerhq/lumen-ui-react 0.0.80 → 0.0.82

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

@@ -1,10 +1,9 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
 import { cn as u } from "../../../libs/utils-shared/dist/index.js";
 import { cva as c } from "class-variance-authority";
-import m from "react";
-import { ChevronRight as f } from "../../Symbols/Icons/ChevronRight.js";
-const p = c(
-  "inline-flex h-fit w-full items-center gap-12 rounded-sm p-12 transition-colors focus-visible:outline-2 focus-visible:outline-focus disabled:text-disabled",
+import { ChevronRight as m } from "../../Symbols/Icons/ChevronRight.js";
+const f = c(
+  "inline-flex h-fit w-full cursor-pointer items-center gap-12 rounded-sm p-12 transition-colors focus-visible:outline-2 focus-visible:outline-focus disabled:cursor-default disabled:text-disabled",
   {
     variants: {
       appearance: {
@@ -16,34 +15,41 @@ const p = c(
       appearance: "base"
     }
   }
-), v = m.forwardRef(
-  ({ className: n, appearance: l, icon: o, title: r, description: t, hideChevron: d, ...s }, b) => {
-    const a = o;
-    return /* @__PURE__ */ i(
-      "button",
-      {
-        ref: b,
-        className: u(
-          n,
-          p({
-            appearance: l
-          })
-        ),
-        disabled: s.disabled,
-        ...s,
-        children: [
-          a && /* @__PURE__ */ e(a, { size: 24, className: "shrink-0" }),
-          /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col gap-4 text-left", children: [
-            /* @__PURE__ */ e("div", { className: "min-w-0 truncate body-1-semi-bold", children: r }),
-            t && /* @__PURE__ */ e("div", { className: "line-clamp-2 min-w-0 body-2", children: t })
-          ] }),
-          !d && /* @__PURE__ */ e(f, { size: 24, className: "shrink-0" })
-        ]
-      }
-    );
-  }
-);
-v.displayName = "CardButton";
+), p = ({
+  ref: n,
+  className: l,
+  appearance: o,
+  icon: d,
+  title: r,
+  description: t,
+  hideChevron: b,
+  ...s
+}) => {
+  const a = d;
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      ref: n,
+      className: u(
+        l,
+        f({
+          appearance: o
+        })
+      ),
+      disabled: s.disabled,
+      ...s,
+      children: [
+        a && /* @__PURE__ */ e(a, { size: 24, className: "shrink-0" }),
+        /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col gap-4 text-left", children: [
+          /* @__PURE__ */ e("div", { className: "min-w-0 truncate body-2-semi-bold", children: r }),
+          t && /* @__PURE__ */ e("div", { className: "line-clamp-2 min-w-0 body-3 text-muted", children: t })
+        ] }),
+        !b && /* @__PURE__ */ e(m, { size: 24, className: "shrink-0" })
+      ]
+    }
+  );
+};
+p.displayName = "CardButton";
 export {
-  v as CardButton
+  p as CardButton
 };

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

@@ -1,3 +1,4 @@
+import { ComponentPropsWithRef, ComponentType } from 'react';
 import { IconSize } from '../Icon/types';
 export type CardButtonProps = {
     /**
@@ -8,7 +9,7 @@ export type CardButtonProps = {
     /**
      * An optional icon component to render on the left side.
      */
-    icon?: React.ComponentType<{
+    icon?: ComponentType<{
         size?: IconSize;
         className?: string;
     }>;
@@ -26,5 +27,5 @@ export type CardButtonProps = {
      * @default false
      */
     hideChevron?: boolean;
-} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;
+} & Omit<ComponentPropsWithRef<'button'>, 'children'>;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/CardButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACpE;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/CardButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC;;OAEG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC9D;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,GAAG,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC"}

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

@@ -1,5 +1,4 @@
-import { default as React } from 'react';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { CheckboxProps } from './types';
 /**
  * A customizable checkbox component built on top of Radix UI Checkbox primitive.
  *
@@ -39,10 +38,8 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
  * // With custom styling (layout only)
  * <Checkbox className="mr-8" />
  */
-export declare const Checkbox: React.ForwardRefExoticComponent<{
-    checked?: boolean;
-    defaultChecked?: boolean;
-    onCheckedChange?: (checked: boolean) => void;
-    className?: string;
-} & Omit<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref">, "defaultChecked" | "checked" | "asChild" | "onCheckedChange"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Checkbox: {
+    ({ ref, className, ...props }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
 //# sourceMappingURL=Checkbox.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,QAAQ;;;;;uMAanB,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAiBxC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,QAAQ;mCAAkC,aAAa;;CAUnE,CAAC"}

package/dist/lib/Components/Checkbox/Checkbox.js

@@ -1,9 +1,8 @@
 import { jsx as e } from "react/jsx-runtime";
 import { cn as a } from "../../../libs/utils-shared/dist/index.js";
 import * as t from "@radix-ui/react-checkbox";
-import i from "react";
-import { Check as o } from "../../Symbols/Icons/Check.js";
-const r = a(
+import { Check as i } from "../../Symbols/Icons/Check.js";
+const o = a(
   "size-20 shrink-0 cursor-pointer rounded-xs transition-colors",
   "focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2 focus-visible:outline-hidden",
   "data-[state=unchecked]:border data-[state=unchecked]:border-muted data-[state=unchecked]:bg-base",
@@ -14,16 +13,16 @@ const r = a(
   "data-[state=checked]:hover:bg-active-hover",
   "data-[state=checked]:active:bg-active-pressed",
   "data-[state=checked]:disabled:bg-disabled data-[state=checked]:disabled:text-disabled"
-), b = i.forwardRef(({ className: s, ...d }, c) => /* @__PURE__ */ e(
+), r = ({ ref: s, className: c, ...d }) => /* @__PURE__ */ e(
   t.Root,
   {
-    ref: c,
-    className: a(r, s),
+    ref: s,
+    className: a(o, c),
     ...d,
-    children: /* @__PURE__ */ e(t.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ e(o, { size: 16 }) })
+    children: /* @__PURE__ */ e(t.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ e(i, { size: 16 }) })
   }
-));
-b.displayName = t.Root.displayName;
+);
+r.displayName = t.Root.displayName;
 export {
-  b as Checkbox
+  r as Checkbox
 };

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

@@ -1,3 +1,4 @@
+import { ComponentPropsWithRef } from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 export type CheckboxProps = {
     /**
@@ -16,5 +17,5 @@ export type CheckboxProps = {
      * Additional custom CSS classes to apply. Do not use this prop to modify the component's core appearance.
      */
     className?: string;
-} & Omit<React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, 'checked' | 'defaultChecked' | 'onCheckedChange' | 'asChild'>;
+} & Omit<ComponentPropsWithRef<typeof CheckboxPrimitive.Root>, 'checked' | 'defaultChecked' | 'onCheckedChange' | 'asChild'>;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAE9D,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CACN,KAAK,CAAC,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAC7D,SAAS,GAAG,gBAAgB,GAAG,iBAAiB,GAAG,SAAS,CAC7D,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CACN,qBAAqB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EACpD,SAAS,GAAG,gBAAgB,GAAG,iBAAiB,GAAG,SAAS,CAC7D,CAAC"}

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

@@ -1,6 +1,5 @@
 import { DialogHeader } from './DialogHeader/DialogHeader';
-import { DialogContentProps, DialogProps, DialogTriggerProps } from './types';
-import * as React from 'react';
+import { DialogBodyProps, DialogContentProps, DialogFooterProps, DialogProps, DialogTriggerProps } from './types';
 /**
  * The root component that manages the dialog's open/closed state and contains the trigger and content.
  *
@@ -99,11 +98,10 @@ export declare function DialogContent({ className, children, ...props }: DialogC
  *   </DialogFooter>
  * </DialogContent>
  */
-export declare const DialogBody: React.ForwardRefExoticComponent<{
-    children?: React.ReactNode;
-    className?: string;
-    scrollbarWidth?: "none" | "auto";
-} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const DialogBody: {
+    ({ ref, className, children, scrollbarWidth, style, ...props }: DialogBodyProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 /**
  * The fixed footer area of the dialog.
  *
@@ -124,9 +122,9 @@ export declare const DialogBody: React.ForwardRefExoticComponent<{
  *   </DialogFooter>
  * </DialogContent>
  */
-export declare const DialogFooter: React.ForwardRefExoticComponent<{
-    children?: React.ReactNode;
-    className?: string;
-} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const DialogFooter: {
+    ({ ref, className, children, ...props }: DialogFooterProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { DialogHeader };
 //# sourceMappingURL=Dialog.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAEL,kBAAkB,EAIlB,WAAW,EACX,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAwBjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,MAAM,CAAC,EAAE,MAAc,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAM/D;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAE7D;AAuDD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAkBpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,UAAU;;;;+EAsBtB,CAAC;AAGF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,YAAY;;;+EAaxB,CAAC;AAGF,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EAGjB,WAAW,EACX,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAwBjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,MAAM,CAAC,EAAE,MAAc,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAM/D;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAE7D;AAqDD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAkBpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,UAAU;oEAOpB,eAAe;;CAoBjB,CAAC;AAGF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,YAAY;6CAKtB,iBAAiB;;CAWnB,CAAC;AAGF,OAAO,EAAE,YAAY,EAAE,CAAC"}

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

@@ -1,9 +1,8 @@
 import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { createSafeContext as u, cn as l } from "../../../libs/utils-shared/dist/index.js";
-import * as r from "@radix-ui/react-dialog";
-import { cva as h } from "class-variance-authority";
-import * as n from "react";
-const [p, s] = u("Dialog"), x = h(
+import { createSafeContext as u, cn as n } from "../../../libs/utils-shared/dist/index.js";
+import * as l from "@radix-ui/react-dialog";
+import { cva as f } from "class-variance-authority";
+const [h, r] = u("Dialog"), x = f(
   [
     "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%]",
@@ -22,94 +21,100 @@ const [p, s] = u("Dialog"), x = h(
   }
 );
 function C({ height: a = "hug", ...t }) {
-  return /* @__PURE__ */ o(p, { value: { height: a }, children: /* @__PURE__ */ o(r.Root, { "data-slot": "dialog", ...t }) });
+  return /* @__PURE__ */ o(h, { value: { height: a }, children: /* @__PURE__ */ o(l.Root, { "data-slot": "dialog", ...t }) });
 }
-function R({ ...a }) {
-  return /* @__PURE__ */ o(r.Trigger, { "data-slot": "dialog-trigger", ...a });
+function w({ ...a }) {
+  return /* @__PURE__ */ o(l.Trigger, { "data-slot": "dialog-trigger", ...a });
 }
-function v({
+function p({
   ...a
 }) {
-  return /* @__PURE__ */ o(r.Portal, { "data-slot": "dialog-portal", ...a });
+  return /* @__PURE__ */ o(l.Portal, { "data-slot": "dialog-portal", ...a });
 }
-const d = n.forwardRef(
-  ({ className: a, ...t }, e) => /* @__PURE__ */ o(
-    r.Overlay,
-    {
-      ref: e,
-      "data-slot": "dialog-overlay",
-      className: l(
-        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"
-      ),
-      ...t
-    }
-  )
+const s = ({ ref: a, className: t, ...e }) => /* @__PURE__ */ o(
+  l.Overlay,
+  {
+    ref: a,
+    "data-slot": "dialog-overlay",
+    className: n(
+      t,
+      "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
+  }
 );
-d.displayName = "DialogOverlay";
-function j({
+s.displayName = "DialogOverlay";
+function P({
   className: a,
   children: t,
   ...e
 }) {
-  const { height: i } = s({
+  const { height: i } = r({
     consumerName: "DialogContent",
     contextRequired: !0
   });
-  return /* @__PURE__ */ m(v, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ o(d, {}),
+  return /* @__PURE__ */ m(p, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ o(s, {}),
     /* @__PURE__ */ o(
-      r.Content,
+      l.Content,
       {
         "data-slot": "dialog-content",
-        className: l(x({ height: i }), a),
+        className: n(x({ height: i }), a),
         ...e,
         children: t
       }
     )
   ] });
 }
-const y = n.forwardRef(
-  ({ className: a, children: t, scrollbarWidth: e = "none", style: i, ...g }, c) => {
-    const { height: f } = s({
-      consumerName: "DialogBody",
-      contextRequired: !0
-    });
-    return /* @__PURE__ */ o(
-      "div",
-      {
-        ref: c,
-        "data-slot": "dialog-body",
-        style: { scrollbarWidth: e, ...i },
-        className: l(
-          "-mb-24 flex min-h-0 grow flex-col overflow-y-auto px-24 pb-24",
-          f === "hug" ? "basis-auto" : "basis-0",
-          a
-        ),
-        ...g,
-        children: t
-      }
-    );
-  }
-);
-y.displayName = "DialogBody";
-const D = n.forwardRef(
-  ({ className: a, children: t, ...e }, i) => /* @__PURE__ */ o(
+const v = ({
+  ref: a,
+  className: t,
+  children: e,
+  scrollbarWidth: i = "none",
+  style: d,
+  ...g
+}) => {
+  const { height: c } = r({
+    consumerName: "DialogBody",
+    contextRequired: !0
+  });
+  return /* @__PURE__ */ o(
     "div",
     {
-      ref: i,
-      "data-slot": "dialog-footer",
-      className: l("flex shrink-0 justify-end gap-8 px-24 pt-24", a),
-      ...e,
-      children: t
+      ref: a,
+      "data-slot": "dialog-body",
+      style: { scrollbarWidth: i, ...d },
+      className: n(
+        "-mb-24 flex min-h-0 grow flex-col overflow-y-auto px-24 pb-24",
+        c === "hug" ? "basis-auto" : "basis-0",
+        t
+      ),
+      ...g,
+      children: e
     }
-  )
+  );
+};
+v.displayName = "DialogBody";
+const y = ({
+  ref: a,
+  className: t,
+  children: e,
+  ...i
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    ref: a,
+    "data-slot": "dialog-footer",
+    className: n("flex shrink-0 justify-end gap-8 px-24 pt-24", t),
+    ...i,
+    children: e
+  }
 );
-D.displayName = "DialogFooter";
+y.displayName = "DialogFooter";
 export {
   C as Dialog,
-  y as DialogBody,
-  j as DialogContent,
-  D as DialogFooter,
-  R as DialogTrigger
+  v as DialogBody,
+  P as DialogContent,
+  y as DialogFooter,
+  w as DialogTrigger
 };

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

@@ -1,10 +1,6 @@
-import { default as React } from 'react';
-export declare const DialogHeader: React.ForwardRefExoticComponent<{
-    appearance?: "compact" | "extended";
-    title?: string;
-    description?: string;
-    onClose: () => void;
-    onBack?: () => void;
-    className?: string;
-} & Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & React.RefAttributes<HTMLDivElement>>;
+import { DialogHeaderProps } from '../types';
+export declare const DialogHeader: {
+    ({ ref, title, description, appearance, ...props }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 //# 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":"AAGA,OAAO,KAAa,MAAM,OAAO,CAAC;AA2JlC,eAAO,MAAM,YAAY;;;;;;;kGAuBxB,CAAC"}
+{"version":3,"file":"DialogHeader.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Dialog/DialogHeader/DialogHeader.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAgJ7C,eAAO,MAAM,YAAY;wDAMtB,iBAAiB;;CAqBnB,CAAC"}

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

@@ -1,122 +1,124 @@
-import { jsxs as t, Fragment as s, jsx as e } from "react/jsx-runtime";
+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 p from "@radix-ui/react-dialog";
-import { cva as b } from "class-variance-authority";
-import f from "react";
-import { useCommonTranslation as h } from "../../../../i18n/useCommonTranslation.js";
-import { IconButton as x } from "../../IconButton/IconButton.js";
-import { ArrowLeft as v } from "../../../Symbols/Icons/ArrowLeft.js";
-import { Close as D } from "../../../Symbols/Icons/Close.js";
-const y = b("flex px-24 text-base", {
+import * as h from "@radix-ui/react-dialog";
+import { cva as N } from "class-variance-authority";
+import { useCommonTranslation as x } from "../../../../i18n/useCommonTranslation.js";
+import { IconButton as g } from "../../IconButton/IconButton.js";
+import { ArrowLeft as b } from "../../../Symbols/Icons/ArrowLeft.js";
+import { Close as v } from "../../../Symbols/Icons/Close.js";
+const D = N("flex px-24 text-base", {
   variants: {
     appearance: {
       compact: "mb-12 h-64 min-h-64 flex-row items-center gap-12",
       extended: "flex-col gap-16 pb-12 pt-10"
     }
   }
-}), m = ({ onBack: r }) => {
-  const { t: a } = h();
+}), d = ({ onBack: r }) => {
+  const { t: a } = x();
   return /* @__PURE__ */ e(
-    x,
+    g,
     {
       appearance: "no-background",
       size: "sm",
-      icon: v,
+      icon: b,
       onClick: r,
       className: "-ml-12 shrink-0",
       "aria-label": a("components.dialogHeader.goBackAriaLabel")
     }
   );
-}, d = ({ onClose: r }) => {
-  const { t: a } = h();
+}, p = ({ onClose: r }) => {
+  const { t: a } = x();
   return /* @__PURE__ */ e(
-    x,
+    g,
     {
       appearance: "gray",
       size: "xs",
-      icon: D,
+      icon: v,
       onClick: r,
       className: "-mr-8 shrink-0",
       "aria-label": a("components.dialogHeader.closeAriaLabel")
     }
   );
-}, H = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
-  p.Title,
+}, y = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
+  h.Title,
   {
     "data-slot": "dialog-title",
     className: c(r && "sr-only", a),
     ...o
   }
-), w = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
-  p.Description,
+), H = ({ hidden: r, className: a, ...o }) => /* @__PURE__ */ e(
+  h.Description,
   {
     "data-slot": "dialog-description",
     className: c(r && "sr-only", a),
     ...o
   }
-), g = f.forwardRef(
-  ({
-    className: r,
-    appearance: a = "compact",
-    title: o,
-    description: l,
-    onClose: n,
-    onBack: i,
-    ...u
-  }, N) => /* @__PURE__ */ t(
-    "div",
-    {
-      ref: N,
-      className: y({ appearance: a, className: r }),
-      ...u,
-      children: [
-        a === "compact" && /* @__PURE__ */ t(s, { children: [
-          i && /* @__PURE__ */ e(m, { onBack: i }),
-          /* @__PURE__ */ t(
-            "div",
-            {
-              className: c("flex min-w-0 flex-1 flex-col", {
-                "pl-40": !i
-              }),
-              children: [
-                o && /* @__PURE__ */ e("div", { className: "truncate text-center heading-5-semi-bold", children: o }),
-                l && /* @__PURE__ */ e("div", { className: "truncate text-center body-2 text-muted", children: l })
-              ]
-            }
-          ),
-          /* @__PURE__ */ e(d, { onClose: n })
+), f = ({
+  ref: r,
+  className: a,
+  appearance: o = "compact",
+  title: l,
+  description: t,
+  onClose: m,
+  onBack: n,
+  ...u
+}) => /* @__PURE__ */ i(
+  "div",
+  {
+    ref: r,
+    className: D({ appearance: o, className: a }),
+    ...u,
+    children: [
+      o === "compact" && /* @__PURE__ */ i(s, { children: [
+        n && /* @__PURE__ */ e(d, { onBack: n }),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: c("flex min-w-0 flex-1 flex-col", {
+              "pl-40": !n
+            }),
+            children: [
+              l && /* @__PURE__ */ e("div", { className: "truncate text-center heading-5-semi-bold", children: l }),
+              t && /* @__PURE__ */ e("div", { className: "truncate text-center body-2 text-muted", children: t })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(p, { onClose: m })
+      ] }),
+      o === "extended" && /* @__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 }) })
         ] }),
-        a === "extended" && /* @__PURE__ */ t(s, { children: [
-          /* @__PURE__ */ t("div", { className: "flex h-40 flex-row items-center", children: [
-            i && /* @__PURE__ */ e(m, { onBack: i }),
-            /* @__PURE__ */ e("div", { className: "ml-auto", children: /* @__PURE__ */ e(d, { onClose: n }) })
-          ] }),
-          (o || l) && /* @__PURE__ */ t("div", { className: "flex flex-col gap-4", children: [
-            o && /* @__PURE__ */ e("div", { className: "heading-3-semi-bold", children: o }),
-            l && /* @__PURE__ */ e("div", { className: "body-2 text-muted", children: l })
-          ] })
+        (l || t) && /* @__PURE__ */ i("div", { className: "flex flex-col gap-4", children: [
+          l && /* @__PURE__ */ e("div", { className: "heading-3-semi-bold", children: l }),
+          t && /* @__PURE__ */ e("div", { className: "body-2 text-muted", children: t })
         ] })
-      ]
-    }
-  )
-);
-g.displayName = "DialogHeaderComponent";
-const C = f.forwardRef(
-  ({ title: r = "", description: a, appearance: o = "compact", ...l }, n) => /* @__PURE__ */ t(s, { children: [
-    /* @__PURE__ */ e(
-      g,
-      {
-        ref: n,
-        title: r,
-        description: a,
-        appearance: o,
-        ...l
-      }
-    ),
-    /* @__PURE__ */ e(H, { hidden: !0, children: r }),
-    a && /* @__PURE__ */ e(w, { hidden: !0, children: a })
-  ] })
+      ] })
+    ]
+  }
 );
+f.displayName = "DialogHeaderComponent";
+const C = ({
+  ref: r,
+  title: a = "",
+  description: o,
+  appearance: l = "compact",
+  ...t
+}) => /* @__PURE__ */ i(s, { children: [
+  /* @__PURE__ */ e(
+    f,
+    {
+      ref: r,
+      title: a,
+      description: o,
+      appearance: l,
+      ...t
+    }
+  ),
+  /* @__PURE__ */ e(y, { hidden: !0, children: a }),
+  o && /* @__PURE__ */ e(H, { hidden: !0, children: o })
+] });
 C.displayName = "DialogHeader";
 export {
   C as DialogHeader