@ledgerhq/lumen-ui-react 0.0.63 → 0.0.65

package/dist/lib/Components/Select/Select.js

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { cn as r } from "../../../libs/utils-shared/dist/index.js";
+import { cn as l } from "../../../libs/utils-shared/dist/index.js";
 import * as a from "@radix-ui/react-select";
 import { cva as c } from "class-variance-authority";
 import * as s from "react";
@@ -13,34 +13,34 @@ function k({ ...t }) {
 function G({ ...t }) {
   return /* @__PURE__ */ e(a.Group, { "data-slot": "select-group", ...t });
 }
-const b = r(
-  "group relative flex h-48 w-full items-center justify-between gap-8",
+const b = l(
+  "group relative flex h-48 w-full cursor-pointer items-center justify-between gap-8",
   "rounded-sm bg-muted px-16",
-  "text-base body-2",
+  "body-2 text-base",
   "hover:bg-muted-hover",
-  "transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-focus",
+  "transition-colors duration-200 focus:ring-2 focus:ring-focus focus:outline-hidden",
   "disabled:cursor-not-allowed disabled:text-disabled"
-), g = r(
+), g = l(
   "pointer-events-none absolute left-16 origin-left text-muted transition-all duration-300",
   "top-10 -translate-y-4 body-4",
-  "group-data-[placeholder]:top-14 group-data-[placeholder]:translate-y-0 group-data-[placeholder]:body-2",
-  "group-data-[:disabled]:text-disabled disabled:text-disabled group-data-[disabled]:text-disabled group-data-[placeholder][disabled]:text-disabled",
+  "group-data-placeholder:top-14 group-data-placeholder:translate-y-0 group-data-placeholder:body-2",
+  "group-data-disabled:text-disabled disabled:text-disabled",
   "max-w-[calc(100%-var(--size-56))] truncate"
-), x = s.forwardRef(({ className: t, labelClassName: l, label: o, ...d }, i) => /* @__PURE__ */ n(
+), h = s.forwardRef(({ className: t, labelClassName: o, label: r, ...i }, d) => /* @__PURE__ */ n(
   a.Trigger,
   {
-    ref: i,
+    ref: d,
     "data-slot": "select-trigger",
-    className: r(b, t),
-    ...d,
+    className: l(b, t),
+    ...i,
     children: [
-      o && /* @__PURE__ */ e("label", { className: r(g, l), children: o }),
+      r && /* @__PURE__ */ e("label", { className: l(g, o), children: r }),
       /* @__PURE__ */ e(
         "span",
         {
-          className: r(
-            "flex-1 truncate text-left ",
-            o && "mt-16 opacity-100 transition-opacity delay-100 duration-300 group-data-[placeholder]:mt-0 group-data-[placeholder]:opacity-0",
+          className: l(
+            "flex-1 truncate text-left",
+            r && "mt-16 opacity-100 transition-opacity delay-100 duration-300 group-data-placeholder:mt-0 group-data-placeholder:opacity-0",
             t
           ),
           children: /* @__PURE__ */ e(a.Value, { "data-slot": "select-value" })
@@ -50,22 +50,22 @@ const b = r(
         m,
         {
           size: 20,
-          className: "shrink-0 text-muted group-data-[disabled]:text-disabled"
+          className: "shrink-0 text-muted group-data-disabled:text-disabled"
         }
       ) })
     ]
   }
 ));
-x.displayName = a.Trigger.displayName;
-const h = c(
+h.displayName = a.Trigger.displayName;
+const x = c(
   [
-    "relative z-select max-h-[var(--radix-select-content-available-height)] overflow-y-auto overflow-x-hidden",
+    "relative z-select max-h-(--radix-select-content-available-height) overflow-x-hidden overflow-y-auto",
     "rounded-sm bg-muted",
     "shadow-md",
-    "data-[side=bottom]:animate-slide-in-from-top-8",
-    "data-[side=top]:animate-slide-in-from-bottom-8",
-    "data-[side=left]:animate-slide-in-from-right-8",
-    "data-[side=right]:animate-slide-in-from-left-8"
+    "data-[side=bottom]:animate-slide-in-from-top",
+    "data-[side=top]:animate-slide-in-from-bottom",
+    "data-[side=left]:animate-slide-in-from-right",
+    "data-[side=right]:animate-slide-in-from-left"
   ],
   {
     variants: {
@@ -81,112 +81,112 @@ const h = c(
 ), y = c("p-8", {
   variants: {
     position: {
-      popper: "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
+      popper: "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)",
       "item-aligned": ""
     }
   },
   defaultVariants: {
     position: "popper"
   }
-}), N = s.forwardRef(({ className: t, children: l, position: o = "popper", ...d }, i) => /* @__PURE__ */ e(a.Portal, { "data-slot": "select-portal", children: /* @__PURE__ */ n(
+}), N = s.forwardRef(({ className: t, children: o, position: r = "popper", ...i }, d) => /* @__PURE__ */ e(a.Portal, { "data-slot": "select-portal", children: /* @__PURE__ */ n(
   a.Content,
   {
-    ref: i,
+    ref: d,
     "data-slot": "select-content",
-    className: r(h({ position: o }), t),
-    position: o,
-    ...d,
+    className: l(x({ position: r }), t),
+    position: r,
+    ...i,
     children: [
       /* @__PURE__ */ e(R, {}),
-      /* @__PURE__ */ e(a.Viewport, { className: y({ position: o }), children: l }),
+      /* @__PURE__ */ e(a.Viewport, { className: y({ position: r }), children: o }),
       /* @__PURE__ */ e(C, {})
     ]
   }
 ) }));
 N.displayName = a.Content.displayName;
-const v = s.forwardRef(({ className: t, ...l }, o) => /* @__PURE__ */ e(
+const w = s.forwardRef(({ className: t, ...o }, r) => /* @__PURE__ */ e(
   a.Label,
   {
-    ref: o,
+    ref: r,
     "data-slot": "select-label",
-    className: r("mb-4 px-8 pb-0 pt-8 text-muted body-3-semi-bold", t),
-    ...l
+    className: l("mb-4 px-8 pt-8 pb-0 body-3-semi-bold text-muted", t),
+    ...o
   }
 ));
-v.displayName = a.Label.displayName;
-const w = r(
-  "relative flex w-full cursor-default select-none items-center bg-base-transparent",
+w.displayName = a.Label.displayName;
+const S = l(
+  "relative flex w-full cursor-pointer items-center bg-base-transparent select-none",
   "rounded-sm p-8",
-  "text-base body-2",
-  "outline-none",
+  "body-2 text-base",
+  "outline-hidden",
   "focus:bg-base-transparent-hover",
   "active:bg-base-transparent-pressed",
-  "data-[disabled]:cursor-not-allowed data-[disabled]:text-disabled"
-), S = s.forwardRef(({ className: t, children: l, ...o }, d) => /* @__PURE__ */ n(
+  "data-disabled:cursor-not-allowed data-disabled:text-disabled"
+), v = s.forwardRef(({ className: t, children: o, ...r }, i) => /* @__PURE__ */ n(
   a.Item,
   {
-    ref: d,
+    ref: i,
     "data-slot": "select-item",
-    className: r(w, t),
-    ...o,
+    className: l(S, t),
+    ...r,
     children: [
-      l,
+      o,
       /* @__PURE__ */ e("span", { className: "absolute right-8 flex size-24 items-center justify-center", children: /* @__PURE__ */ e(a.ItemIndicator, { children: /* @__PURE__ */ e(p, { size: 24, className: "text-active" }) }) })
     ]
   }
 ));
-S.displayName = a.Item.displayName;
+v.displayName = a.Item.displayName;
 const I = s.forwardRef(
-  ({ className: t, ...l }, o) => /* @__PURE__ */ e(
+  ({ className: t, ...o }, r) => /* @__PURE__ */ e(
     u,
     {
-      ref: o,
-      className: r("mx-8 my-4 w-auto", t),
-      ...l
+      ref: r,
+      className: l("mx-8 my-4 w-auto", t),
+      ...o
     }
   )
 );
 I.displayName = "SelectSeparator";
-const z = s.forwardRef(({ className: t, ...l }, o) => /* @__PURE__ */ e(
+const z = s.forwardRef(({ className: t, ...o }, r) => /* @__PURE__ */ e(
   a.ItemText,
   {
-    ref: o,
+    ref: r,
     "data-slot": "select-item-text",
-    className: r("text-muted body-2", t),
-    ...l
+    className: l("body-2 text-muted", t),
+    ...o
   }
 ));
 z.displayName = a.ItemText.displayName;
 function R({
   className: t,
-  ...l
+  ...o
 }) {
   return /* @__PURE__ */ e(
     a.ScrollUpButton,
     {
       "data-slot": "select-scroll-up-button",
-      className: r(
+      className: l(
         "flex cursor-default items-center justify-center py-1 text-muted",
         t
       ),
-      ...l,
+      ...o,
       children: /* @__PURE__ */ e(f, { className: "size-4" })
     }
   );
 }
 function C({
   className: t,
-  ...l
+  ...o
 }) {
   return /* @__PURE__ */ e(
     a.ScrollDownButton,
     {
       "data-slot": "select-scroll-down-button",
-      className: r(
+      className: l(
         "flex cursor-default items-center justify-center py-1 text-muted",
         t
       ),
-      ...l,
+      ...o,
       children: /* @__PURE__ */ e(m, { className: "size-4" })
     }
   );
@@ -195,9 +195,9 @@ export {
   k as Select,
   N as SelectContent,
   G as SelectGroup,
-  S as SelectItem,
+  v as SelectItem,
   z as SelectItemText,
-  v as SelectLabel,
+  w as SelectLabel,
   I as SelectSeparator,
-  x as SelectTrigger
+  h as SelectTrigger
 };

package/dist/lib/Components/Subheader/Subheader.js

@@ -24,7 +24,7 @@ const a = ({ children: e }) => /* @__PURE__ */ i("div", { className: "flex shrin
       ...d,
       children: [
         /* @__PURE__ */ s("div", { className: "flex min-w-0 items-center gap-2", children: [
-          /* @__PURE__ */ i("h2", { className: "heading-5-semi-bold min-w-0 truncate", children: m }),
+          /* @__PURE__ */ i("h2", { className: "min-w-0 truncate heading-5-semi-bold", children: m }),
           u
         ] }),
         S

package/dist/lib/Components/Switch/Switch.js

@@ -5,10 +5,10 @@ import { cva as d } from "class-variance-authority";
 import m from "react";
 const u = d(
   s(
-    "group flex items-center rounded-full p-2 transition-colors duration-200 ease-in-out focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",
+    "group flex cursor-pointer items-center rounded-full p-2 transition-colors duration-200 ease-in-out focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",
     "[&[data-state=unchecked]:not([data-disabled])]:bg-muted-strong [&[data-state=unchecked]:not([data-disabled])]:hover:bg-muted-strong-hover [&[data-state=unchecked]:not([data-disabled])]:active:bg-muted-strong-pressed",
     "[&[data-state=checked]:not([data-disabled])]:bg-active [&[data-state=checked]:not([data-disabled])]:hover:bg-active-hover [&[data-state=checked]:not([data-disabled])]:active:bg-active-pressed",
-    "data-[disabled]:bg-disabled-strong"
+    "data-disabled:bg-disabled-strong"
   ),
   {
     variants: {
@@ -22,7 +22,7 @@ const u = d(
     }
   }
 ), h = d(
-  "translate-x-0 rounded-full bg-white transition-transform duration-200 ease-in-out group-data-[disabled]:bg-base",
+  "translate-x-0 rounded-full bg-white transition-transform duration-200 ease-in-out group-data-disabled:bg-base",
   {
     variants: {
       size: {

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

@@ -1,4 +1,5 @@
-import { TileContentProps, TileDescriptionProps, TileProps, TileSecondaryActionProps, TileSpotProps, TileTitleProps } from './types';
+import { MouseEventHandler } from 'react';
+import { TileContentProps, TileDescriptionProps, TileSpotProps, TileTitleProps } from './types';
 /**
  * A flexible tile component that uses a composite pattern for maximum customization.
  * Displays content in a vertical layout with support for spots, text, and custom content.
@@ -26,10 +27,14 @@ import { TileContentProps, TileDescriptionProps, TileProps, TileSecondaryActionP
  *   <div>Custom content</div>
  * </Tile>
  */
-export declare const Tile: {
-    ({ className, onClick, appearance, disabled, "aria-label": ariaLabel, children, onMouseDown, onMouseUp, onMouseLeave, ...props }: TileProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const Tile: import('react').ForwardRefExoticComponent<{
+    appearance?: "no-background" | "card";
+    disabled?: boolean;
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    children: import('react').ReactNode;
+    className?: string;
+    'aria-label'?: string;
+} & Omit<import('react').HTMLAttributes<HTMLDivElement>, "onClick"> & import('react').RefAttributes<HTMLDivElement>>;
 /**
  * A spot adapter for use within Tile. Automatically inherits the disabled state from the parent Tile.
  * Always renders at a fixed size of 48.
@@ -79,8 +84,9 @@ export declare const TileDescription: {
  *   </TileContent>
  * </Tile>
  */
-export declare const TileSecondaryAction: {
-    ({ onClick, icon, className, "aria-label": ariaLabel, ...props }: TileSecondaryActionProps): import("react/jsx-runtime").JSX.Element | null;
-    displayName: string;
-};
+export declare const TileSecondaryAction: import('react').ForwardRefExoticComponent<{
+    onClick?: MouseEventHandler;
+    icon: React.ComponentType<Omit<import('../Icon').IconProps, "children">>;
+    className?: string;
+} & Omit<import('react').HTMLAttributes<HTMLButtonElement>, "onClick"> & import('react').RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=Tile.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/Tile.tsx"],"names":[],"mappings":"AASA,OAAO,EACL,gBAAgB,EAEhB,oBAAoB,EACpB,SAAS,EACT,wBAAwB,EACxB,aAAa,EACb,cAAc,EACf,MAAM,SAAS,CAAC;AAgEjB;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,IAAI;sIAWd,SAAS;;CAqFX,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,QAAQ;YAAW,aAAa;;CAM5C,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,WAAW;wCAIrB,gBAAgB;;CASlB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,SAAS;wCAInB,cAAc;;CAiBhB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,eAAe;wCAIzB,oBAAoB;;CAiBtB,CAAC;AAGF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB;sEAM7B,wBAAwB;;CAmC1B,CAAC"}
+{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Tile/Tile.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAc,iBAAiB,EAAyB,MAAM,OAAO,CAAC;AAG7E,OAAO,EACL,gBAAgB,EAEhB,oBAAoB,EAGpB,aAAa,EACb,cAAc,EACf,MAAM,SAAS,CAAC;AAgEjB;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,IAAI;;;;;;;oHAsGhB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,QAAQ;YAAW,aAAa;;CAM5C,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,WAAW;wCAIrB,gBAAgB;;CASlB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,SAAS;wCAInB,cAAc;;CAiBhB,CAAC;AAGF;;;GAGG;AACH,eAAO,MAAM,eAAe;wCAIzB,oBAAoB;;CAiBtB,CAAC;AAGF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB;;;;0HAuC9B,CAAC"}

package/dist/lib/Components/Tile/Tile.js

@@ -1,14 +1,14 @@
-import { jsx as l, jsxs as k } from "react/jsx-runtime";
-import { extractSlottable as q, createSafeContext as C, cn as d } from "../../../libs/utils-shared/dist/index.js";
-import { cva as b } from "class-variance-authority";
-import { useState as I, useCallback as n } from "react";
-import { Spot as R } from "../Spot/Spot.js";
-import { InteractiveIcon as z } from "../InteractiveIcon/InteractiveIcon.js";
-const [V, u] = C("Tile"), v = {
-  root: b(
+import { jsx as s, jsxs as q } from "react/jsx-runtime";
+import { extractSlottable as C, createSafeContext as I, cn as u } from "../../../libs/utils-shared/dist/index.js";
+import { cva as v } from "class-variance-authority";
+import { forwardRef as x, useState as w, useCallback as d } from "react";
+import { Spot as z } from "../Spot/Spot.js";
+import { InteractiveIcon as V } from "../InteractiveIcon/InteractiveIcon.js";
+const [j, p] = I("Tile"), T = {
+  root: v(
     [
       "group relative flex flex-col items-center gap-8 text-base transition-colors",
-      "focus-visible:outline-focus rounded-md focus-visible:outline-2"
+      "rounded-md focus-visible:outline-2 focus-visible:outline-focus"
     ],
     {
       variants: {
@@ -58,187 +58,185 @@ const [V, u] = C("Tile"), v = {
       }
     }
   ),
-  button: b(
-    "focus-visible:outline-focus flex w-full flex-col  items-center gap-8 rounded-md px-8 py-12 focus-visible:outline-2"
+  button: v(
+    "flex w-full cursor-pointer flex-col items-center gap-8 rounded-md px-8 py-12 focus-visible:outline-2 focus-visible:outline-focus"
   )
-}, j = ({
-  className: e,
-  onClick: i,
-  appearance: s = "no-background",
-  disabled: t = !1,
-  "aria-label": p,
-  children: m,
-  onMouseDown: c,
-  onMouseUp: o,
-  onMouseLeave: r,
-  ...x
-}) => {
-  const [y, f] = I(!1), { slotElement: N, remainingChildren: g } = q(
-    m,
-    T
-  ), h = n(
-    (a) => {
-      a.target.closest(
-        "[data-secondary-button-container]"
-      ) || (c == null || c(a), f(!0));
-    },
-    [c]
-  ), A = n(
-    (a) => {
-      f(!1), o == null || o(a);
-    },
-    [o]
-  ), S = n(
-    (a) => {
-      f(!1), r == null || r(a);
-    },
-    [r]
-  );
-  return /* @__PURE__ */ l(V, { value: { disabled: t }, children: /* @__PURE__ */ k(
-    "div",
-    {
-      ...x,
-      className: v.root({
-        appearance: s,
-        isActive: y,
-        disabled: t,
-        className: e
-      }),
-      onMouseDown: t ? void 0 : (a) => {
-        h(a);
+}, P = x(
+  ({
+    className: e,
+    onClick: i,
+    appearance: r = "no-background",
+    disabled: t = !1,
+    "aria-label": f,
+    children: m,
+    onMouseDown: l,
+    onMouseUp: o,
+    onMouseLeave: c,
+    ...n
+  }, N) => {
+    const [g, b] = w(!1), { slotElement: h, remainingChildren: A } = C(
+      m,
+      y
+    ), S = d(
+      (a) => {
+        a.target.closest(
+          "[data-secondary-button-container]"
+        ) || (l == null || l(a), b(!0));
       },
-      onMouseUp: t ? void 0 : (a) => {
-        A(a);
+      [l]
+    ), k = d(
+      (a) => {
+        b(!1), o == null || o(a);
       },
-      onMouseLeave: t ? void 0 : (a) => {
-        S(a);
+      [o]
+    ), R = d(
+      (a) => {
+        b(!1), c == null || c(a);
       },
-      children: [
-        /* @__PURE__ */ l(
-          "button",
-          {
-            "aria-label": p,
-            onClick: t ? void 0 : i,
-            disabled: t,
-            "data-disabled": t || void 0,
-            className: v.button(),
-            children: g
-          }
-        ),
-        N
-      ]
-    }
-  ) });
-};
-j.displayName = "Tile";
-const w = (e) => {
-  const { disabled: i } = u({
+      [c]
+    );
+    return /* @__PURE__ */ s(j, { value: { disabled: t }, children: /* @__PURE__ */ q(
+      "div",
+      {
+        ...n,
+        ref: N,
+        className: T.root({
+          appearance: r,
+          isActive: g,
+          disabled: t,
+          className: e
+        }),
+        onMouseDown: t ? void 0 : (a) => {
+          S(a);
+        },
+        onMouseUp: t ? void 0 : (a) => {
+          k(a);
+        },
+        onMouseLeave: t ? void 0 : (a) => {
+          R(a);
+        },
+        children: [
+          /* @__PURE__ */ s(
+            "button",
+            {
+              "aria-label": f,
+              onClick: t ? void 0 : i,
+              disabled: t,
+              "data-disabled": t || void 0,
+              className: T.button(),
+              children: A
+            }
+          ),
+          h
+        ]
+      }
+    ) });
+  }
+);
+P.displayName = "Tile";
+const D = (e) => {
+  const { disabled: i } = p({
     consumerName: "TileSpot",
     contextRequired: !0
   });
-  return /* @__PURE__ */ l(R, { ...e, size: 48, disabled: i });
+  return /* @__PURE__ */ s(z, { ...e, size: 48, disabled: i });
 };
-w.displayName = "TileSpot";
-const P = ({
+D.displayName = "TileSpot";
+const E = ({
   children: e,
   className: i,
-  ...s
-}) => /* @__PURE__ */ l(
+  ...r
+}) => /* @__PURE__ */ s(
   "div",
   {
-    className: d("flex w-full flex-col items-center text-center", i),
-    ...s,
+    className: u("flex w-full flex-col items-center text-center", i),
+    ...r,
     children: e
   }
 );
-P.displayName = "TileContent";
-const D = ({
+E.displayName = "TileContent";
+const O = ({
   children: e,
   className: i,
-  ...s
+  ...r
 }) => {
-  const { disabled: t } = u({
+  const { disabled: t } = p({
     consumerName: "TileTitle",
     contextRequired: !0
   });
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: d(
-        "body-2-semi-bold w-full truncate",
+      className: u(
+        "w-full truncate body-2-semi-bold",
         t && "text-disabled",
         i
       ),
-      ...s,
+      ...r,
       children: e
     }
   );
 };
-D.displayName = "TileTitle";
-const E = ({
+O.displayName = "TileTitle";
+const B = ({
   children: e,
   className: i,
-  ...s
+  ...r
 }) => {
-  const { disabled: t } = u({
+  const { disabled: t } = p({
     consumerName: "TileDescription",
     contextRequired: !0
   });
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: d(
-        "body-3 w-full truncate",
+      className: u(
+        "w-full truncate body-3",
         t ? "text-disabled" : "text-muted",
         i
       ),
-      ...s,
+      ...r,
       children: e
     }
   );
 };
-E.displayName = "TileDescription";
-const T = ({
-  onClick: e,
-  icon: i,
-  className: s,
-  "aria-label": t,
-  ...p
-}) => {
-  const { disabled: m } = u({
+B.displayName = "TileDescription";
+const y = x(({ onClick: e, icon: i, className: r, "aria-label": t, ...f }, m) => {
+  const { disabled: l } = p({
     consumerName: "TileSecondaryAction",
     contextRequired: !0
-  }), c = n(
-    (r) => {
-      r.stopPropagation(), r.preventDefault(), e == null || e(r);
+  }), o = d(
+    (n) => {
+      n.stopPropagation(), n.preventDefault(), e == null || e(n);
     },
     [e]
   );
-  if (m) return null;
-  const o = i;
-  return /* @__PURE__ */ l(
-    z,
+  if (l) return null;
+  const c = i;
+  return /* @__PURE__ */ s(
+    V,
     {
       "data-slot": "tile-secondary-action",
-      className: d(
-        "absolute right-4 top-8 opacity-0 transition-opacity duration-200 focus-within:opacity-100 group-hover:opacity-100",
-        s
+      className: u(
+        "absolute top-8 right-4 opacity-0 transition-opacity duration-200 group-hover:opacity-100 focus-within:opacity-100",
+        r
       ),
       "data-secondary-button-container": !0,
       iconType: "stroked",
-      onClick: c,
+      onClick: o,
       "aria-label": t,
-      ...p,
-      children: /* @__PURE__ */ l(o, { size: 24 })
+      ref: m,
+      ...f,
+      children: /* @__PURE__ */ s(c, { size: 24 })
     }
   );
-};
-T.displayName = "TileSecondaryAction";
+});
+y.displayName = "TileSecondaryAction";
 export {
-  j as Tile,
-  P as TileContent,
-  E as TileDescription,
-  T as TileSecondaryAction,
-  w as TileSpot,
-  D as TileTitle
+  P as Tile,
+  E as TileContent,
+  B as TileDescription,
+  y as TileSecondaryAction,
+  D as TileSpot,
+  O as TileTitle
 };