@vkzstudio/muza-ui 1.0.42 → 1.0.44

package/dist/components/Accordion/Accordion.d.ts

@@ -62,20 +62,56 @@ export interface AccordionMultipleProps extends RadixAccordionMultipleProps {
  * <Accordion type="single" variant="default" collapsible>
  */
 export type AccordionProps = AccordionSingleProps | AccordionMultipleProps;
-/** Props for AccordionItem. Requires a unique `value` string to identify the section. */
+/**
+ * Props for the AccordionItem component.
+ * Represents a single expandable section within an Accordion.
+ */
 export interface AccordionItemProps extends React.ComponentProps<typeof AccordionPrimitive.Item> {
-    /** Unique string identifying this item within the accordion. */
+    /** Unique string identifying this item within the accordion. Must be unique across sibling items. */
     value: string;
     /** Prevents interaction with this specific item. @default false */
     disabled?: boolean;
-    /** When true, clicking the content area also toggles the item. Set to false for items with interactive content (forms, inputs). @default true */
+    /**
+     * When true, clicking anywhere on the item (not just the header) toggles the open state.
+     * Set to false for items whose content contains interactive elements (forms, inputs, switches)
+     * so inner clicks don't collapse the section.
+     *
+     * @default true
+     * @example
+     * <AccordionItem value="settings" clickableContent={false}>
+     *   <AccordionHeader>Settings</AccordionHeader>
+     *   <AccordionContent>
+     *     <Input />
+     *     <Switch />
+     *   </AccordionContent>
+     * </AccordionItem>
+     */
     clickableContent?: boolean;
-    /** When true, the item is always expanded, non-interactive, and the chevron is hidden. The header renders as a plain element instead of a button for proper accessibility. @default false */
+    /**
+     * When true, the item is always expanded, non-interactive, and the chevron is hidden.
+     * The header renders as a plain element instead of a button so it stays accessible
+     * when no toggle action is available.
+     *
+     * @default false
+     * @example
+     * <AccordionItem value="always-visible" static>
+     *   <AccordionHeader>Always visible</AccordionHeader>
+     *   <AccordionContent>This content is always shown.</AccordionContent>
+     * </AccordionItem>
+     */
     static?: boolean;
 }
-/** Props for AccordionHeader. Clickable area that toggles content visibility. */
+/**
+ * Props for the AccordionHeader component.
+ * Renders the clickable header area that toggles content visibility.
+ * Wraps and behaves as Radix's `Accordion.Header` + `Accordion.Trigger`.
+ */
 export type AccordionHeaderProps = React.ComponentProps<typeof AccordionPrimitive.Header>;
-/** Props for AccordionContent. Collapsible content area with slide animation. */
+/**
+ * Props for the AccordionContent component.
+ * Collapsible content area with built-in slide-up/slide-down animation.
+ * Wraps Radix's `Accordion.Content`.
+ */
 export type AccordionContentProps = React.ComponentProps<typeof AccordionPrimitive.Content>;
 declare const accordionItemVariants: (props?: ({
     variant?: "default" | "branded" | "settings" | null | undefined;

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

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAA;AAC/D,OAAO,EACL,KAAK,sBAAsB,IAAI,2BAA2B,EAC1D,KAAK,oBAAoB,IAAI,yBAAyB,EACvD,MAAM,2BAA2B,CAAA;AAKlC;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAA;AAEjE,mEAAmE;AACnE,MAAM,WAAW,oBAAqB,SAAQ,yBAAyB;IACrE,yDAAyD;IACzD,IAAI,EAAE,QAAQ,CAAA;IACd;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,iFAAiF;IACjF,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,gFAAgF;AAChF,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE,sEAAsE;IACtE,IAAI,EAAE,UAAU,CAAA;IAChB;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,qDAAqD;IACrD,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,0EAA0E;IAC1E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACzC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,sBAAsB,CAAA;AAE1E,yFAAyF;AACzF,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC;IAC5D,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAA;IACb,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iJAAiJ;IACjJ,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,6LAA6L;IAC7L,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,iFAAiF;AACjF,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CACrD,OAAO,kBAAkB,CAAC,MAAM,CACjC,CAAA;AAED,iFAAiF;AACjF,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CACtD,OAAO,kBAAkB,CAAC,OAAO,CAClC,CAAA;AAMD,QAAA,MAAM,qBAAqB;;8EAYzB,CAAA;AAEF,QAAA,MAAM,wBAAwB;;8EAe7B,CAAA;AAED,QAAA,MAAM,6BAA6B;;8EASjC,CAAA;AA8BF,QAAA,MAAM,SAAS,GAAI,+CAIhB,cAAc,4CAahB,CAAA;AAED,QAAA,MAAM,aAAa,GAAI,wFAQpB,kBAAkB,4CAiDpB,CAAA;AAED,QAAA,MAAM,eAAe,GAAI,mCAItB,oBAAoB,4CA+BtB,CAAA;AAED,QAAA,MAAM,gBAAgB,GAAI,mCAIvB,qBAAqB,4CA6BvB,CAAA;AAED,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,qBAAqB,EACrB,wBAAwB,EACxB,6BAA6B,GAC9B,CAAA"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAA;AAC/D,OAAO,EACL,KAAK,sBAAsB,IAAI,2BAA2B,EAC1D,KAAK,oBAAoB,IAAI,yBAAyB,EACvD,MAAM,2BAA2B,CAAA;AAKlC;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAA;AAEjE,mEAAmE;AACnE,MAAM,WAAW,oBAAqB,SAAQ,yBAAyB;IACrE,yDAAyD;IACzD,IAAI,EAAE,QAAQ,CAAA;IACd;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,iFAAiF;IACjF,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,gFAAgF;AAChF,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE,sEAAsE;IACtE,IAAI,EAAE,UAAU,CAAA;IAChB;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,qDAAqD;IACrD,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,0EAA0E;IAC1E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACzC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,sBAAsB,CAAA;AAE1E;;;GAGG;AACH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC;IAC5D,qGAAqG;IACrG,KAAK,EAAE,MAAM,CAAA;IACb,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;;;;;;;OAcG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CACrD,OAAO,kBAAkB,CAAC,MAAM,CACjC,CAAA;AAED;;;;GAIG;AACH,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CACtD,OAAO,kBAAkB,CAAC,OAAO,CAClC,CAAA;AAMD,QAAA,MAAM,qBAAqB;;8EAYzB,CAAA;AAEF,QAAA,MAAM,wBAAwB;;8EAe7B,CAAA;AAED,QAAA,MAAM,6BAA6B;;8EASjC,CAAA;AA8BF,QAAA,MAAM,SAAS,GAAI,+CAIhB,cAAc,4CAahB,CAAA;AAED,QAAA,MAAM,aAAa,GAAI,wFAQpB,kBAAkB,4CAiDpB,CAAA;AAED,QAAA,MAAM,eAAe,GAAI,mCAItB,oBAAoB,4CA+BtB,CAAA;AAED,QAAA,MAAM,gBAAgB,GAAI,mCAIvB,qBAAqB,4CA6BvB,CAAA;AAED,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,qBAAqB,EACrB,wBAAwB,EACxB,6BAA6B,GAC9B,CAAA"}

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

@@ -3,40 +3,102 @@ import { buttonVariants } from './buttonVariants';
 import * as React from 'react';
 /**
  * Props for the Button component.
- * Extends standard button HTML attributes. The `iconOnly` and `size` CVA variants
- * are excluded from VariantProps and re-declared with custom types.
+ *
+ * Extends standard button HTML attributes. CVA's inferred `iconOnly` and `size`
+ * variants are omitted from `VariantProps` and re-declared below with explicit
+ * union types so consumers see the allowed values in `.d.ts` output.
  */
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, Omit<VariantProps<typeof buttonVariants>, 'iconOnly' | 'size'> {
     /**
-     * Visual style variant: primary (brand), secondary (outlined), tertiary (subtle),
-     * invert (dark backgrounds), dashed (bordered), link/linkInvert (text only).
+     * Visual style variant.
+     *
+     * - `primary` — brand-colored solid button for the main call-to-action.
+     * - `secondary` — outlined button for secondary actions.
+     * - `tertiary` — subtle button for low-emphasis actions.
+     * - `invert` — inverted colors for dark backgrounds.
+     * - `dashed` — dashed-border button, typically for add/create actions.
+     * - `link` / `linkInvert` — text-only link-styled button.
+     *
      * @default 'primary'
      */
     variant?: 'primary' | 'secondary' | 'tertiary' | 'invert' | 'dashed' | 'link' | 'linkInvert';
     /**
      * Controls height and padding. The `icon` size renders a compact icon-only
      * button with ghost styling (no background, border, or border radius).
+     *
      * @default 'md'
      */
     size?: 'xs' | 'sm' | 'md' | 'lg' | 'icon';
-    /** Stretches button to fill its container width. @default false */
+    /** Stretches the button to fill its container width. @default false */
     fullWidth?: boolean;
-    /** Renders children as the child element instead of a `<button>`. */
+    /**
+     * Renders the single child as the root element via Radix `Slot`, merging
+     * Button's props, styles, ref, and event handlers onto it. Use for
+     * polymorphic rendering — e.g. a router `Link`, a plain `<a>`, a `<label>`,
+     * or a `<button type="submit">` — while keeping full Button styling.
+     *
+     * Icons and the `loading` spinner are injected as siblings of the child's
+     * original content.
+     *
+     * Note: the `disabled` attribute is inert on non-`<button>` children
+     * (e.g. `<a>`). Use `aria-disabled` on the child instead.
+     *
+     * @default false
+     * @example
+     * <Button asChild variant="primary">
+     *   <Link href="/dashboard">Go to dashboard</Link>
+     * </Button>
+     *
+     * @example
+     * <Button asChild variant="primary">
+     *   <button type="submit">Submit form</button>
+     * </Button>
+     */
     asChild?: boolean;
-    /** React node displayed as an icon. Position controlled by `iconPosition`. */
+    /**
+     * Icon node rendered alongside the label. Position is controlled by
+     * `iconPosition`. Omit `children` to render an icon-only button (provide
+     * `aria-label` for accessibility).
+     *
+     * @example
+     * <Button icon={<DownloadIcon />}>Download</Button>
+     *
+     * @example
+     * <Button icon={<PlusIcon />} aria-label="Add" />
+     */
     icon?: React.ReactNode;
-    /** Places icon before (`start`) or after (`end`) the button text. Ignored when `secondIcon` is provided. @default 'start' */
+    /**
+     * Places `icon` before (`'start'`) or after (`'end'`) the button text.
+     * Ignored when `secondIcon` is provided.
+     *
+     * @default 'start'
+     */
     iconPosition?: 'start' | 'end';
-    /** Optional trailing icon. When set, `icon` is always rendered at the start and `secondIcon` at the end, ignoring `iconPosition`. */
+    /**
+     * Optional trailing icon. When set, `icon` is always rendered at the start
+     * and `secondIcon` at the end, overriding `iconPosition`.
+     *
+     * @example
+     * <Button icon={<PlusIcon />} secondIcon={<ArrowRightIcon />}>Add and continue</Button>
+     */
     secondIcon?: React.ReactNode;
-    /** Removes background, showing only text and icon with hover effects. @default false */
+    /**
+     * Removes background and border, showing only text and icon with hover
+     * effects. The `icon` size always renders as ghost regardless of this prop.
+     *
+     * @default false
+     */
     ghost?: boolean;
     /** Applies destructive/error styling for delete or dangerous actions. @default false */
     danger?: boolean;
     /**
-     * Shows a spinner overlay and disables interaction.
-     * Text becomes invisible but maintains button width.
+     * Shows a spinner overlay and disables interaction. The label fades out but
+     * the button keeps its width, preventing layout shift during async actions.
+     *
      * @default false
+     * @example
+     * const [saving, setSaving] = useState(false)
+     * <Button loading={saving} onClick={handleSave}>Save</Button>
      */
     loading?: boolean;
 }

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;;;;;;GAMG;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;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EACJ,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,YAAY,CAAA;IAChB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;IACzC,uEAAuE;IACvE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;;;;;;;OAUG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC9B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,wFAAwF;IACxF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;;;;;OAQG;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/DataTable/DataTable.d.ts

@@ -1,11 +1,19 @@
 import { ReactNode } from 'react';
 import { VariantProps } from 'class-variance-authority';
+/**
+ * CVA variants for the DataTable body cells. Controls background color
+ * (`variant`) and rounded-corner/border treatment based on the cell's
+ * position in the row (`position`).
+ */
 declare const dataTableCellVariants: (props?: ({
     variant?: "default" | "white" | null | undefined;
     position?: "first" | "last" | "middle" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**
- * Column definition for the DataTable component.
+ * Column definition for the DataTable component. Describes how a single column
+ * pulls its value from each row object, how its header renders, and optionally
+ * how each cell renders.
+ *
  * @typeParam T - The type of data objects in each row
  *
  * @example
@@ -16,20 +24,24 @@ declare const dataTableCellVariants: (props?: ({
  * ]
  */
 export interface DataTableColumn<T> {
-    /** Property key from the data object to display in this column. */
+    /** Property key on each row object whose value is displayed in this column. */
     dataKey: keyof T;
-    /** Header label for the column. */
+    /** Header label for the column. Pass an empty string to render a blank header (e.g. an actions column). */
     title: ReactNode;
-    /** Additional CSS class applied to both the header and body cells. */
+    /** Extra CSS class applied to both the header cell (`<th>`) and body cells (`<td>`) of this column. */
     className?: string;
     /**
-     * Truncates cell text to the specified number of lines.
-     * `true` or `1` clamps to one line, `2` clamps to two lines.
+     * Truncates default cell text to the specified number of lines. Has no
+     * effect when a custom `render` is provided.
+     * - `true` or `1` clamps to one line
+     * - `2` clamps to two lines
      */
     lineClamp?: boolean | 1 | 2;
     /**
      * Custom render function for cell content. When omitted, the raw value
-     * is displayed inside a Typography component.
+     * at `dataKey` is displayed inside a Typography component. The function
+     * receives the raw value, the full row object, the row index, and the
+     * table's `disabled` state so custom cells can mirror the disabled styling.
      *
      * @example
      * render: (value, rowData, rowIndex, disabled) => (
@@ -40,26 +52,51 @@ export interface DataTableColumn<T> {
 }
 /**
  * Props for the DataTable component.
- * Extends standard table attributes except `children` (content is driven by `data` and `columns`).
+ * Extends standard table attributes except `children` (content is driven by
+ * `data` and `columns` rather than JSX children).
+ *
  * @typeParam T - The type of data objects in each row
  */
 export interface DataTableProps<T> extends Omit<React.HTMLAttributes<HTMLTableElement>, 'children'>, Omit<VariantProps<typeof dataTableCellVariants>, 'variant' | 'position'> {
-    /** Array of data objects to display as table rows. */
+    /** Array of data objects to display. Each item renders as one table row. */
     data: T[];
-    /** Column definitions describing headers and cell rendering. @see DataTableColumn */
+    /**
+     * Column definitions describing headers, cell rendering, and per-column styling.
+     * @see DataTableColumn
+     */
     columns: DataTableColumn<T>[];
     /** Controls visibility of the table header row. @default true */
     showHeader?: boolean;
-    /** Additional CSS class applied to the table element. */
+    /** Extra CSS class applied to the `<table>` element. */
     className?: string;
-    /** Visual style variant for row background. @default 'default' */
+    /**
+     * Visual style variant for row background.
+     * - `'default'` uses the primary surface color
+     * - `'white'` uses the secondary surface color (for nested/alt backgrounds)
+     *
+     * @default 'default'
+     */
     variant?: 'default' | 'white';
-    /** Prevents interaction and applies muted text colors. @default false */
+    /**
+     * Prevents row-click interaction and applies muted text colors. The value
+     * is also forwarded to every column's `render` callback so custom cells
+     * can reflect the disabled state.
+     *
+     * @default false
+     */
     disabled?: boolean;
     /**
      * Fires when a row is clicked (pointer only — rows are not keyboard-activatable).
-     * When provided and not `disabled`, rows get a pointer cursor and a
-     * hover/focus-within border on cells.
+     * When provided and the table is not `disabled`, rows get a pointer cursor
+     * and a hover/focus-within border on cells. Inner interactive elements
+     * should call `event.stopPropagation()` to prevent the row handler from firing.
+     *
+     * @example
+     * <DataTable
+     *   data={users}
+     *   columns={columns}
+     *   onRowClick={(rowData, rowIndex) => openDetail(rowData.id)}
+     * />
      */
     onRowClick?: (rowData: T, rowIndex: number) => void;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,qBAAqB;;;8EAmB1B,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,mCAAmC;IACnC,KAAK,EAAE,SAAS,CAAA;IAChB,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EACjB,OAAO,EAAE,CAAC,EACV,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,OAAO,KACf,SAAS,CAAA;CACf;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,CAC/B,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EAC9D,IAAI,CAAC,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC1E,sDAAsD;IACtD,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,qFAAqF;IACrF,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAA;IAC7B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;CACpD;AAED,QAAA,MAAM,SAAS,GAAI,CAAC,EAAG,mFASpB,cAAc,CAAC,CAAC,CAAC,4CAwGnB,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE;;;;GAIG;AACH,QAAA,MAAM,qBAAqB;;;8EAmB1B,CAAA;AAED;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,+EAA+E;IAC/E,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,2GAA2G;IAC3G,KAAK,EAAE,SAAS,CAAA;IAChB,uGAAuG;IACvG,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EACjB,OAAO,EAAE,CAAC,EACV,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,OAAO,KACf,SAAS,CAAA;CACf;AAED;;;;;;GAMG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,CAC/B,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EAC9D,IAAI,CAAC,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC1E,4EAA4E;IAC5E,IAAI,EAAE,CAAC,EAAE,CAAA;IACT;;;OAGG;IACH,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAA;IAC7B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;;;;;OAYG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;CACpD;AAED,QAAA,MAAM,SAAS,GAAI,CAAC,EAAG,mFASpB,cAAc,CAAC,CAAC,CAAC,4CAwGnB,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAA"}