@vkzstudio/muza-ui 1.0.42 → 1.0.43

package/dist/components/Button/Button.d.ts

@@ -21,7 +21,15 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
     size?: 'xs' | 'sm' | 'md' | 'lg' | 'icon';
     /** Stretches button to fill its container width. @default false */
     fullWidth?: boolean;
-    /** Renders children as the child element instead of a `<button>`. */
+    /**
+     * When true, merges Button props/styles onto the single child element via
+     * Radix `Slot` (e.g. `<Button asChild><Link href="/">Home</Link></Button>`
+     * renders an `<a>` with all button styling and click target). Icons and the
+     * `loading` spinner are injected as siblings of the child's original content.
+     * Note: `disabled` has no effect on non-`<button>` children — use
+     * `aria-disabled` on the child instead.
+     * @default false
+     */
     asChild?: boolean;
     /** React node displayed as an icon. Position controlled by `iconPosition`. */
     icon?: React.ReactNode;

package/dist/components/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAI5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD;;;;GAIG;AACH,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,IAAI,CAAC,YAAY,CAAC,OAAO,cAAc,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EACJ,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,YAAY,CAAA;IAChB;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;IACzC,mEAAmE;IACnE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,6HAA6H;IAC7H,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC9B,qIAAqI;IACrI,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,wFAAwF;IACxF,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,wFAAwF;IACxF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,MAAM,uFAiEX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAI5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD;;;;GAIG;AACH,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,IAAI,CAAC,YAAY,CAAC,OAAO,cAAc,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EACJ,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,YAAY,CAAA;IAChB;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;IACzC,mEAAmE;IACnE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,6HAA6H;IAC7H,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC9B,qIAAqI;IACrI,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,wFAAwF;IACxF,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,wFAAwF;IACxF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,MAAM,uFAqFX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/Button/Button.js

@@ -1,71 +1,76 @@
-import { jsxs as N, jsx as m } from "react/jsx-runtime";
-import * as d from "react";
+import { jsxs as j, jsx as o } from "react/jsx-runtime";
+import * as m from "react";
+import { Slot as v, Slottable as u } from "@radix-ui/react-slot";
 import "class-variance-authority";
-import { ButtonLoader as B } from "./ButtonLoader.js";
-import { buttonVariants as g } from "./buttonVariants.js";
-import { cn as f } from "../../utils/cn.js";
-import { Typography as j } from "../Typography/Typography.js";
-const w = d.forwardRef(
+import { ButtonLoader as w } from "./ButtonLoader.js";
+import { buttonVariants as E } from "./buttonVariants.js";
+import { cn as c } from "../../utils/cn.js";
+import { Typography as R } from "../Typography/Typography.js";
+const S = m.forwardRef(
   ({
-    className: i,
-    variant: u,
-    size: t,
-    fullWidth: c,
-    asChild: l = !1,
-    icon: a,
-    iconPosition: p = "start",
+    className: y,
+    variant: b,
+    size: a,
+    fullWidth: x,
+    asChild: p = !1,
+    icon: r,
+    iconPosition: n = "start",
     secondIcon: s,
-    ghost: y = !1,
-    danger: e = !1,
-    loading: o = !1,
-    children: r,
+    ghost: d = !1,
+    danger: f = !1,
+    loading: e = !1,
+    children: t,
     ...h
-  }, x) => {
-    const b = l ? "span" : "button", n = t === "icon" || y;
-    return /* @__PURE__ */ N(
-      b,
+  }, N) => {
+    const g = p ? v : "button", i = a === "icon" || d, l = (L) => /* @__PURE__ */ o(
+      R,
       {
-        className: f(
-          g({
-            variant: u,
-            size: t,
-            fullWidth: c,
-            iconOnly: t === "icon" || !r,
-            ghost: n,
-            danger: e,
-            loading: o,
-            className: i
+        variant: "cta",
+        size: a === "sm" || a === "xs" ? "sm" : "base",
+        weight: "medium",
+        component: "span",
+        fixY: !0,
+        className: c("transition-opacity", {
+          "opacity-0": e
+        }),
+        children: L
+      }
+    ), B = () => p ? m.isValidElement(t) ? /* @__PURE__ */ o(u, { children: m.cloneElement(
+      t,
+      void 0,
+      l(t.props.children)
+    ) }) : /* @__PURE__ */ o(u, { children: t }) : t && l(t);
+    return /* @__PURE__ */ j(
+      g,
+      {
+        className: c(
+          E({
+            variant: b,
+            size: a,
+            fullWidth: x,
+            iconOnly: a === "icon" || !t,
+            ghost: i,
+            danger: f,
+            loading: e,
+            className: y
           })
         ),
-        ref: x,
-        "data-ghost": n,
-        "data-danger": e,
+        ref: N,
+        "data-ghost": i,
+        "data-danger": f,
         ...h,
         children: [
-          o && /* @__PURE__ */ m("span", { className: "absolute", children: /* @__PURE__ */ m(B, {}) }),
-          (s || p === "start") && a,
-          r && /* @__PURE__ */ m(
-            j,
-            {
-              variant: "cta",
-              size: t == "sm" || t == "xs" ? "sm" : "base",
-              weight: "medium",
-              component: "span",
-              fixY: !0,
-              className: f("transition-opacity", {
-                "opacity-0": o
-              }),
-              children: r
-            }
-          ),
-          s || p === "end" && a
+          e && /* @__PURE__ */ o("span", { className: "absolute", children: /* @__PURE__ */ o(w, {}) }),
+          (s || n === "start") && r,
+          B(),
+          s || n === "end" && r
         ]
       }
     );
   }
 );
-w.displayName = "Button";
+S.displayName = "Button";
 export {
-  w as Button,
-  g as buttonVariants
+  S as Button,
+  E as buttonVariants
 };

package/dist/components/Button/Button.stories.d.ts

@@ -13,5 +13,7 @@ export declare const AllSizes: Story;
 export declare const InteractiveStates: Story;
 export declare const IconExamples: Story;
 export declare const WithSecondIcon: Story;
+export declare const AsChildAnchor: Story;
+export declare const AsChildEdgeCases: Story;
 export declare const ResponsiveExample: Story;
 //# sourceMappingURL=Button.stories.d.ts.map

package/dist/components/Button/Button.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAU3D,OAAO,EAAE,MAAM,EAAoB,MAAM,UAAU,CAAA;AAoBnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAoF7B,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AAEpC,eAAO,MAAM,OAAO,EAAE,KAarB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAe7B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAoCtB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAgBvB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAyCzB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAkDtB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAmF/B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KA8D1B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAgB5B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAgC/B,CAAA"}
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAW3D,OAAO,EAAE,MAAM,EAAoB,MAAM,UAAU,CAAA;AAoBnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAqF7B,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AAEpC,eAAO,MAAM,OAAO,EAAE,KAarB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAe7B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAoCtB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAgBvB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAyCzB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAkDtB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAmF/B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KA8D1B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAgB5B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAgB3B,CAAA;AAaD,eAAO,MAAM,gBAAgB,EAAE,KAmL9B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAgC/B,CAAA"}

package/dist/components/EdgeButton/EdgeButton.d.ts

@@ -17,7 +17,12 @@ export interface EdgeButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
      */
     disabled?: boolean;
     /**
-     * Renders as a span element instead of button (useful for composing with other libraries).
+     * When true, merges EdgeButton props/styles onto the single child element via
+     * Radix `Slot` (e.g. `<EdgeButton asChild><a href="/help">Help</a></EdgeButton>`
+     * renders an `<a>` with all button styling and click target). The leading icon
+     * and text are injected as siblings of the child's original content.
+     * Note: `disabled` has no effect on non-`<button>` children — use
+     * `aria-disabled` on the child instead.
      * @default false
      */
     asChild?: boolean;

package/dist/components/EdgeButton/EdgeButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EdgeButton.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,QAAA,MAAM,kBAAkB;;8EAwBvB,CAAA;AAED;;;;;GAKG;AACH,MAAM,WAAW,eACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,QAAA,MAAM,UAAU,2FAuCf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"EdgeButton.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,QAAA,MAAM,kBAAkB;;8EAwBvB,CAAA;AAED;;;;;GAKG;AACH,MAAM,WAAW,eACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,QAAA,MAAM,UAAU,2FAmFf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/components/EdgeButton/EdgeButton.js

@@ -1,10 +1,11 @@
-import { jsxs as m, jsx as c } from "react/jsx-runtime";
-import d from "react";
-import { cva as u } from "class-variance-authority";
-import { sharedButtonVariants as o } from "../Button/buttonVariants.js";
-import { cn as l } from "../../utils/cn.js";
-import { Typography as f } from "../Typography/Typography.js";
-const z = u(
+import { jsx as e, jsxs as i, Fragment as a } from "react/jsx-runtime";
+import s from "react";
+import { Slot as h, Slottable as l } from "@radix-ui/react-slot";
+import { cva as x } from "class-variance-authority";
+import { sharedButtonVariants as d } from "../Button/buttonVariants.js";
+import { cn as y } from "../../utils/cn.js";
+import { Typography as j } from "../Typography/Typography.js";
+const _ = x(
   [
     "inline-flex items-center justify-center",
     "h-comp-help-button-h gap-comp-button-gap px-comp-help-button-p",
@@ -12,7 +13,7 @@ const z = u(
     "&>svg]:duration-250 transition-colors duration-250 [&>svg]:transition-opacity",
     "[&>svg]:size-icon-medium",
     "disabled:pointer-events-none",
-    ...o.primary
+    ...d.primary
   ],
   {
     variants: {
@@ -28,45 +29,68 @@ const z = u(
       disabled: !1
     }
   }
-), g = d.forwardRef(
-  ({ onClick: e, disabled: t, text: i, className: r, asChild: a, icon: s, ...n }, p) => /* @__PURE__ */ m(
-    a ? "span" : "button",
-    {
-      ref: p,
-      type: "button",
-      onClick: t ? void 0 : e,
-      disabled: t,
-      className: l(
-        "inline-flex items-center justify-center",
-        "h-comp-help-button-h gap-comp-button-gap px-comp-help-button-p",
-        "rounded-tl-2xl",
-        "cursor-pointer disabled:pointer-events-none",
-        "&>svg]:duration-250 transition-colors duration-250 [&>svg]:transition-opacity",
-        "[&>svg]:size-icon-medium",
-        ...o.primary,
-        r
-      ),
-      ...n,
-      children: [
-        s,
-        /* @__PURE__ */ c(
-          f,
-          {
-            component: "span",
-            size: "base",
-            variant: "cta",
-            weight: "medium",
-            fixY: !0,
-            children: i
-          }
+), B = s.forwardRef(
+  ({
+    onClick: u,
+    disabled: p,
+    text: m,
+    className: c,
+    asChild: n,
+    icon: o,
+    children: t,
+    ...f
+  }, b) => {
+    const g = n ? h : "button", r = m ? /* @__PURE__ */ e(
+      j,
+      {
+        component: "span",
+        size: "base",
+        variant: "cta",
+        weight: "medium",
+        fixY: !0,
+        children: m
+      }
+    ) : null, v = () => n ? s.isValidElement(t) ? /* @__PURE__ */ e(l, { children: s.cloneElement(
+      t,
+      void 0,
+      /* @__PURE__ */ i(a, { children: [
+        o,
+        r,
+        t.props.children
+      ] })
+    ) }) : /* @__PURE__ */ i(a, { children: [
+      o,
+      r,
+      /* @__PURE__ */ e(l, { children: t })
+    ] }) : /* @__PURE__ */ i(a, { children: [
+      o,
+      r,
+      t
+    ] });
+    return /* @__PURE__ */ e(
+      g,
+      {
+        ref: b,
+        onClick: p ? void 0 : u,
+        ...n ? {} : { type: "button", disabled: p },
+        className: y(
+          "inline-flex items-center justify-center",
+          "h-comp-help-button-h gap-comp-button-gap px-comp-help-button-p",
+          "rounded-tl-2xl",
+          "cursor-pointer disabled:pointer-events-none",
+          "&>svg]:duration-250 transition-colors duration-250 [&>svg]:transition-opacity",
+          "[&>svg]:size-icon-medium",
+          ...d.primary,
+          c
         ),
-        n.children
-      ]
-    }
-  )
+        ...f,
+        children: v()
+      }
+    );
+  }
 );
-g.displayName = "EdgeButton";
+B.displayName = "EdgeButton";
 export {
-  g as EdgeButton,
-  z as edgeButtonVariants
+  B as EdgeButton,
+  _ as edgeButtonVariants
 };

package/dist/components/EdgeButton/EdgeButton.stories.d.ts

@@ -8,4 +8,6 @@ export declare const WithIcon: Story;
 export declare const InteractiveStates: Story;
 export declare const Accessibility: Story;
 export declare const Playground: Story;
+export declare const AsChildAnchor: Story;
+export declare const AsChildEdgeCases: Story;
 //# sourceMappingURL=EdgeButton.stories.d.ts.map

package/dist/components/EdgeButton/EdgeButton.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EdgeButton.stories.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAIzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAkGjC,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAExC,eAAO,MAAM,OAAO,EAAE,KAYrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KActB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAqD/B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAmD3B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA"}
+{"version":3,"file":"EdgeButton.stories.d.ts","sourceRoot":"","sources":["../../../src/components/EdgeButton/EdgeButton.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAI3D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAIzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAkGjC,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAExC,eAAO,MAAM,OAAO,EAAE,KAYrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KActB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAqD/B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAmD3B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAe3B,CAAA;AAaD,eAAO,MAAM,gBAAgB,EAAE,KA+H9B,CAAA"}