@ztwoint/z-ui 0.1.133 → 0.1.135

package/dist/components/radio-card/radio-card.js

@@ -1,12 +1,12 @@
-import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
 import * as h from "react";
-import { cn as s } from "../../lib/utils.js";
-import { Z2RadioGroupItem as b, Z2RadioGroupIndicator as p } from "../radio/z2-radio.js";
-import { CheckIcon as k } from "lucide-react";
-import { Z2TextPreset as x } from "../text-preset/text-preset.js";
-function v({ primaryText: t, supportText: o }) {
-  return /* @__PURE__ */ e(
-    x,
+import { cn as i } from "../../lib/utils.js";
+import { Z2RadioGroupItem as p, Z2RadioGroupIndicator as x } from "../radio/z2-radio.js";
+import { CheckIcon as v } from "lucide-react";
+import { Z2TextPreset as k } from "../text-preset/text-preset.js";
+function g({ primaryText: t, supportText: o }) {
+  return /* @__PURE__ */ r(
+    k,
     {
       type: "L",
       multiline: !0,
@@ -22,43 +22,43 @@ function j({
   supportText: o,
   value: n,
   id: c,
-  disabled: i,
+  disabled: s,
   className: l,
-  itemClassName: d,
+  itemClassName: u,
   endIcon: a
 }) {
-  const r = h.useRef(null);
-  return /* @__PURE__ */ m(
+  const e = h.useRef(null);
+  return /* @__PURE__ */ f(
     "div",
     {
-      onClick: (f) => {
-        if (i) return;
-        const u = f.target;
-        r.current && !r.current.contains(u) && r.current.click();
+      onClick: (d) => {
+        if (s) return;
+        const m = d.target;
+        e.current && !e.current.contains(m) && e.current.click();
       },
-      className: s(
-        "group relative flex items-start justify-start cursor-pointer p-3.5 gap-3 border border-stroke-solid-light rounded-xl transition-colors overflow-hidden",
-        "hover:border-stroke-solid-hover",
-        // Left accent when checked (pseudo element)
-        'before:content-[""] before:absolute before:inset-y-0 before:left-0 before:w-1 before:rounded-l-xl before:bg-stroke-solid-active before:hidden has-[&[data-state=checked]]:before:block',
-        // When the nested radio is checked, style the card
-        "has-[&[data-state=checked]]:border-stroke-solid-active has-[&[data-state=checked]]:bg-surface-accent-default/10",
+      className: i(
+        // Base card styles (unchecked state)
+        "group relative flex items-start justify-start cursor-pointer p-3.5 gap-3 rounded-xl border border-stroke-solid-light bg-surface-neutral-default shadow-xs transition-colors",
+        // Hover state
+        "hover:border-stroke-solid-hover hover:bg-surface-neutral-hover hover:shadow-sm",
+        // Checked state styles (no left accent border)
+        "has-[&[data-state=checked]]:border-stroke-solid-active  has-[&[data-state=checked]]:shadow-md",
         l
       ),
       children: [
-        /* @__PURE__ */ e(
-          b,
+        /* @__PURE__ */ r(
+          p,
           {
-            ref: r,
+            ref: e,
             value: n,
             id: c,
-            disabled: i,
-            className: s(d),
-            children: /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(k, { className: "size-2.5 text-surface-neutral-default" }) })
+            disabled: s,
+            className: i(u),
+            children: /* @__PURE__ */ r(x, { children: /* @__PURE__ */ r(v, { className: "size-2.5 text-surface-neutral-default" }) })
           }
         ),
-        /* @__PURE__ */ e(v, { primaryText: t, supportText: o }),
-        a ? /* @__PURE__ */ e("div", { className: "ml-auto flex-shrink-0 pointer-events-none", children: a }) : null
+        /* @__PURE__ */ r(g, { primaryText: t, supportText: o }),
+        a ? /* @__PURE__ */ r("div", { className: "ml-auto flex-shrink-0 pointer-events-none", children: a }) : null
       ]
     }
   );