@fabio.caffarello/react-design-system 4.0.0 → 4.2.0

package/dist/granular/ui/primitives/Button/Button.js

@@ -1,43 +1,43 @@
 "use client";
-var G = Object.defineProperty, H = Object.defineProperties;
-var J = Object.getOwnPropertyDescriptors;
-var y = Object.getOwnPropertySymbols;
-var A = Object.prototype.hasOwnProperty, F = Object.prototype.propertyIsEnumerable;
-var $ = (r, n, o) => n in r ? G(r, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[n] = o, u = (r, n) => {
+var T = Object.defineProperty, W = Object.defineProperties;
+var _ = Object.getOwnPropertyDescriptors;
+var u = Object.getOwnPropertySymbols;
+var k = Object.prototype.hasOwnProperty, j = Object.prototype.propertyIsEnumerable;
+var B = (r, n, o) => n in r ? T(r, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[n] = o, m = (r, n) => {
   for (var o in n || (n = {}))
-    A.call(n, o) && $(r, o, n[o]);
-  if (y)
-    for (var o of y(n))
-      F.call(n, o) && $(r, o, n[o]);
+    k.call(n, o) && B(r, o, n[o]);
+  if (u)
+    for (var o of u(n))
+      j.call(n, o) && B(r, o, n[o]);
   return r;
-}, v = (r, n) => H(r, J(n));
-var M = (r, n) => {
+}, g = (r, n) => W(r, _(n));
+var C = (r, n) => {
   var o = {};
-  for (var s in r)
-    A.call(r, s) && n.indexOf(s) < 0 && (o[s] = r[s]);
-  if (r != null && y)
-    for (var s of y(r))
-      n.indexOf(s) < 0 && F.call(r, s) && (o[s] = r[s]);
+  for (var t in r)
+    k.call(r, t) && n.indexOf(t) < 0 && (o[t] = r[t]);
+  if (r != null && u)
+    for (var t of u(r))
+      n.indexOf(t) < 0 && j.call(r, t) && (o[t] = r[t]);
   return o;
 };
-import { jsx as i, jsxs as h, Fragment as P } from "react/jsx-runtime";
-import { memo as K, forwardRef as Q, useMemo as m } from "react";
-import { Slot as U, Slottable as W } from "@radix-ui/react-slot";
-import { getRadiusClass as X } from "../../tokens/radius.js";
+import { jsxs as b, jsx as i, Fragment as D } from "react/jsx-runtime";
+import { memo as q, forwardRef as G } from "react";
+import { Slot as H, Slottable as J } from "@radix-ui/react-slot";
+import { getRadiusClass as K } from "../../tokens/radius.js";
 import { getSpacingClass as e } from "../../tokens/spacing.js";
-import { getTypographySize as x, getTypographyClasses as Y } from "../../tokens/typography.js";
-import Z from "../Spinner/Spinner.js";
-import { cn as t } from "../../utils/cn.js";
-import { cva as L } from "../../utils/cva.js";
-const I = L(
+import { getTypographySize as v, getTypographyClasses as M } from "../../tokens/typography.js";
+import Q from "../Spinner/Spinner.js";
+import { cn as s } from "../../utils/cn.js";
+import { cva as U } from "../../utils/cva.js";
+const X = U(
   // Base classes
-  t(
+  s(
     "inline-flex",
     "items-center",
     "justify-center",
-    Y("button").split(" ")[2] || "font-medium",
+    M("button").split(" ")[2] || "font-medium",
     // Extract font-medium
-    X("md"),
+    K("md"),
     "transition-colors",
     "focus:outline-none",
     "focus:ring-2",
@@ -48,25 +48,25 @@ const I = L(
   {
     variants: {
       variant: {
-        primary: t(
+        primary: s(
           "bg-surface-brand-strong",
           "text-fg-inverse",
           "hover:opacity-90",
           "focus:ring-line-brand"
         ),
-        secondary: t(
+        secondary: s(
           "bg-surface-secondary",
           "text-fg-inverse",
           "hover:opacity-90",
           "focus:ring-line-secondary"
         ),
-        error: t(
+        error: s(
           "bg-error",
           "text-fg-inverse",
           "hover:opacity-90",
           "focus:ring-error"
         ),
-        outline: t(
+        outline: s(
           "border-2",
           "border-line-default",
           "bg-transparent",
@@ -74,13 +74,13 @@ const I = L(
           "hover:bg-surface-hover",
           "focus:ring-line-focus"
         ),
-        ghost: t(
+        ghost: s(
           "bg-transparent",
           "text-fg-primary",
           "hover:bg-surface-hover",
           "focus:ring-line-focus"
         ),
-        iconOnly: t(
+        iconOnly: s(
           "bg-transparent",
           "text-fg-primary",
           "hover:bg-surface-hover",
@@ -114,7 +114,7 @@ const I = L(
         // a disabled link should still receive the same visual
         // treatment as a disabled chrome variant — the opacity and
         // cursor signal the disabled state.
-        link: t(
+        link: s(
           "bg-transparent",
           "text-fg-brand",
           "underline-offset-4",
@@ -123,22 +123,22 @@ const I = L(
         )
       },
       size: {
-        sm: t(
+        sm: s(
           e("md", "px"),
           e("1.5", "py"),
-          x("bodySmall"),
+          v("bodySmall"),
           e("1.5", "gap")
         ),
-        md: t(
+        md: s(
           e("base", "px"),
           e("sm", "py"),
-          x("body"),
+          v("body"),
           e("sm", "gap")
         ),
-        lg: t(
+        lg: s(
           e("lg", "px"),
           e("md", "py"),
-          x("bodyLarge"),
+          v("bodyLarge"),
           e("2.5", "gap")
         )
       }
@@ -148,17 +148,17 @@ const I = L(
       {
         variant: "iconOnly",
         size: "sm",
-        class: t("h-8", "w-8", e("none", "p"))
+        class: s("h-8", "w-8", e("none", "p"))
       },
       {
         variant: "iconOnly",
         size: "md",
-        class: t("h-10", "w-10", e("none", "p"))
+        class: s("h-10", "w-10", e("none", "p"))
       },
       {
         variant: "iconOnly",
         size: "lg",
-        class: t("h-12", "w-12", e("none", "p"))
+        class: s("h-12", "w-12", e("none", "p"))
       },
       // Link variant zeroes the size's padding via compoundVariants so
       // the override runs AFTER the size block's `px-N`/`py-N` and
@@ -169,17 +169,17 @@ const I = L(
       {
         variant: "link",
         size: "sm",
-        class: t(e("none", "px"), e("none", "py"))
+        class: s(e("none", "px"), e("none", "py"))
       },
       {
         variant: "link",
         size: "md",
-        class: t(e("none", "px"), e("none", "py"))
+        class: s(e("none", "px"), e("none", "py"))
       },
       {
         variant: "link",
         size: "lg",
-        class: t(e("none", "px"), e("none", "py"))
+        class: s(e("none", "px"), e("none", "py"))
       }
     ],
     defaultVariants: {
@@ -200,24 +200,24 @@ function d({
     }
   ) : null;
 }
-const nn = K(
-  Q(function(en, B) {
-    var V = en, {
+const Y = q(
+  G(function(Z, z) {
+    var O = Z, {
       variant: n = "primary",
       size: o = "md",
-      isLoading: s = !1,
-      loadingText: g,
-      loadingIcon: w,
-      leftIcon: l,
+      isLoading: t = !1,
+      loadingText: y,
+      loadingIcon: E,
+      leftIcon: p,
       rightIcon: c,
-      fullWidth: z = !1,
+      fullWidth: R = !1,
       asChild: f = !1,
-      as: p,
-      className: O = "",
-      disabled: S = !1,
-      children: a,
-      "aria-label": b
-    } = V, N = M(V, [
+      as: a,
+      className: $ = "",
+      disabled: h = !1,
+      children: l,
+      "aria-label": x
+    } = O, w = C(O, [
       "variant",
       "size",
       "isLoading",
@@ -233,56 +233,38 @@ const nn = K(
       "children",
       "aria-label"
     ]);
-    typeof process != "undefined" && process.env.NODE_ENV !== "production" && f && p !== void 0 && p !== "button" && console.warn(
+    typeof process != "undefined" && process.env.NODE_ENV !== "production" && f && a !== void 0 && a !== "button" && console.warn(
       "[Button] `as` is ignored when `asChild` is true; the child element is used as the root. Drop one of the two props to silence this warning."
     );
-    const k = f ? U : p != null ? p : "button", T = m(
-      () => t(
-        I({
-          variant: n,
-          size: o
-        }),
-        z && "w-full",
-        O
-      ),
-      [n, o, z, O]
-    ), j = m(
-      () => n === "iconOnly" || !a && (l || c),
-      [n, a, l, c]
-    ), _ = m(
-      () => j && !b && !a ? "Button" : b,
-      [j, b, a]
-    ), C = m(() => n === "error" ? "primary" : n === "primary" || n === "secondary" ? "neutral" : "primary", [n]), D = m(
-      () => o === "sm" ? "sm" : o === "lg" ? "lg" : "md",
-      [o]
-    ), q = m(
-      () => w || /* @__PURE__ */ i(Z, { size: D, variant: C }),
-      [w, D, C]
-    ), E = !f && (p === void 0 || p === "button") && !N.type ? "button" : void 0, R = u(u({
-      className: T,
-      disabled: S || s,
-      "aria-busy": s,
-      "aria-label": _,
-      "aria-disabled": S || s
-    }, E ? { type: E } : {}), N);
-    return f ? /* @__PURE__ */ h(k, v(u({ ref: B }, R), { children: [
-      l && /* @__PURE__ */ i(d, { position: "left", children: l }),
-      /* @__PURE__ */ i(W, { children: a }),
+    const S = f ? H : a != null ? a : "button", A = s(
+      X({ variant: n, size: o }),
+      R && "w-full",
+      $
+    ), F = (n === "iconOnly" || !l && (p || c)) && !x && !l ? "Button" : x, P = E || /* @__PURE__ */ i(Q, { size: o === "sm" ? "sm" : o === "lg" ? "lg" : "md", variant: n === "error" ? "primary" : n === "primary" || n === "secondary" ? "neutral" : "primary" }), N = !f && (a === void 0 || a === "button") && !w.type ? "button" : void 0, V = m(m({
+      className: A,
+      disabled: h || t,
+      "aria-busy": t,
+      "aria-label": F,
+      "aria-disabled": h || t
+    }, N ? { type: N } : {}), w);
+    return f ? /* @__PURE__ */ b(S, g(m({ ref: z }, V), { children: [
+      p && /* @__PURE__ */ i(d, { position: "left", children: p }),
+      /* @__PURE__ */ i(J, { children: l }),
       c && /* @__PURE__ */ i(d, { position: "right", children: c })
-    ] })) : /* @__PURE__ */ i(k, v(u({ ref: B }, R), { children: s ? /* @__PURE__ */ h(P, { children: [
-      q,
-      g && /* @__PURE__ */ i("span", { className: e("sm", "ml"), children: g }),
-      !g && a && /* @__PURE__ */ i("span", { className: `${e("sm", "ml")} opacity-0`, children: a })
-    ] }) : /* @__PURE__ */ h(P, { children: [
-      l && /* @__PURE__ */ i(d, { position: "left", children: l }),
-      a,
+    ] })) : /* @__PURE__ */ i(S, g(m({ ref: z }, V), { children: t ? /* @__PURE__ */ b(D, { children: [
+      P,
+      y && /* @__PURE__ */ i("span", { className: e("sm", "ml"), children: y }),
+      !y && l && /* @__PURE__ */ i("span", { className: `${e("sm", "ml")} opacity-0`, children: l })
+    ] }) : /* @__PURE__ */ b(D, { children: [
+      p && /* @__PURE__ */ i(d, { position: "left", children: p }),
+      l,
       c && /* @__PURE__ */ i(d, { position: "right", children: c })
     ] }) }));
   })
 );
-nn.displayName = "Button";
+Y.displayName = "Button";
 export {
-  nn as Button,
-  nn as default
+  Y as Button,
+  Y as default
 };
 //# sourceMappingURL=Button.js.map

package/dist/granular/ui/primitives/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../src/ui/primitives/Button/Button.tsx"],"sourcesContent":["import { forwardRef, memo, useMemo } from \"react\";\nimport type { ButtonHTMLAttributes, ReactNode, ElementType } from \"react\";\nimport { Slot, Slottable } from \"@radix-ui/react-slot\";\nimport { getRadiusClass } from \"../../tokens/radius\";\n\n// Ambient declaration so the dev-only warn below typechecks without\n// pulling @types/node into the app tsconfig. At runtime the consumer's\n// bundler (webpack/turbopack/etc.) replaces `process.env.NODE_ENV` with\n// a literal; the `typeof process` guard keeps the branch safe in\n// browser/edge runtimes where `process` doesn't exist.\ndeclare const process: { env: { NODE_ENV?: string } };\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport {\n  getTypographyClasses,\n  getTypographySize,\n} from \"../../tokens/typography\";\nimport { cn, cva } from \"../../utils\";\nimport Spinner from \"../Spinner/Spinner\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"error\"\n  | \"outline\"\n  | \"ghost\"\n  | \"iconOnly\"\n  | \"link\";\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"as\"\n> {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  isLoading?: boolean;\n  loadingText?: string;\n  loadingIcon?: ReactNode;\n  leftIcon?: ReactNode;\n  rightIcon?: ReactNode;\n  fullWidth?: boolean;\n  as?: ElementType;\n  href?: string;\n  target?: string;\n  /**\n   * When true, render via Radix `Slot`: classes, ARIA, ref and remaining\n   * props are projected onto the single child element instead of an\n   * intrinsic `<button>`. The child keeps its own element type and props\n   * intact — including framework-native props like `<Link href prefetch>`.\n   *\n   * `asChild` takes precedence over `as`: if both are supplied, `as` is\n   * ignored and a dev-only warning is logged.\n   *\n   * @example\n   * ```tsx\n   * <Button asChild variant=\"primary\">\n   *   <Link href=\"/profile\" prefetch>Open profile</Link>\n   * </Button>\n   * // → <a class=\"…button classes\" href=\"/profile\" data-prefetch>Open profile</a>\n   * ```\n   */\n  asChild?: boolean;\n}\n\n/**\n * Button Variants using CVA\n * Type-safe variant system for Button component\n */\nconst buttonVariants = cva(\n  // Base classes\n  cn(\n    \"inline-flex\",\n    \"items-center\",\n    \"justify-center\",\n    getTypographyClasses(\"button\").split(\" \")[2] || \"font-medium\", // Extract font-medium\n    getRadiusClass(\"md\"),\n    \"transition-colors\",\n    \"focus:outline-none\",\n    \"focus:ring-2\",\n    \"focus:ring-offset-2\",\n    \"disabled:opacity-50\",\n    \"disabled:cursor-not-allowed\",\n  ),\n  {\n    variants: {\n      variant: {\n        primary: cn(\n          \"bg-surface-brand-strong\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-line-brand\",\n        ),\n        secondary: cn(\n          \"bg-surface-secondary\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-line-secondary\",\n        ),\n        error: cn(\n          \"bg-error\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-error\",\n        ),\n        outline: cn(\n          \"border-2\",\n          \"border-line-default\",\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n        ),\n        ghost: cn(\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n        ),\n        iconOnly: cn(\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n          getSpacingClass(\"none\", \"p\"),\n        ),\n        // Textual call-to-action — brand-coloured text, underline on\n        // hover, no chrome (no surface, no border). Padding is zeroed\n        // out per size in compoundVariants so the bounding box hugs\n        // the text (height intrinsic). Issue #156.\n        //\n        // Focus ring: `focus:ring-line-focus` keeps the same focus\n        // family the other no-chrome variants use (ghost, outline,\n        // iconOnly). The base's `focus:ring-2` + `focus:ring-offset-2`\n        // produce a 2px ring 2px away from the text bounding box; the\n        // 2px offset is rendered in surface-base so the ring contrasts\n        // against surface (≥3:1 for WCAG 2.4.11, verified) rather than\n        // colliding with the brand-coloured text. The element keeps\n        // `getRadiusClass(\"md\")` from the base, which is invisible\n        // without chrome but rounds the focus ring corners.\n        //\n        // hover:underline pairs with `underline-offset-4` so the\n        // underline that appears on hover sits clear of the descenders\n        // (WCAG-aligned with link best practice). At rest the link\n        // carries no underline — the brand colour alone signals\n        // affordance, matching the shadcn convention this variant is\n        // modelled on (see issue body).\n        //\n        // disabled: inherits opacity-50 + cursor-not-allowed from the\n        // base. We do NOT special-case `disabled:no-underline` because\n        // a disabled link should still receive the same visual\n        // treatment as a disabled chrome variant — the opacity and\n        // cursor signal the disabled state.\n        link: cn(\n          \"bg-transparent\",\n          \"text-fg-brand\",\n          \"underline-offset-4\",\n          \"hover:underline\",\n          \"focus:ring-line-focus\",\n        ),\n      },\n      size: {\n        sm: cn(\n          getSpacingClass(\"md\", \"px\"),\n          getSpacingClass(\"1.5\", \"py\"),\n          getTypographySize(\"bodySmall\"),\n          getSpacingClass(\"1.5\", \"gap\"),\n        ),\n        md: cn(\n          getSpacingClass(\"base\", \"px\"),\n          getSpacingClass(\"sm\", \"py\"),\n          getTypographySize(\"body\"),\n          getSpacingClass(\"sm\", \"gap\"),\n        ),\n        lg: cn(\n          getSpacingClass(\"lg\", \"px\"),\n          getSpacingClass(\"md\", \"py\"),\n          getTypographySize(\"bodyLarge\"),\n          getSpacingClass(\"2.5\", \"gap\"),\n        ),\n      },\n    },\n    compoundVariants: [\n      // IconOnly variant has different sizing\n      {\n        variant: \"iconOnly\",\n        size: \"sm\",\n        class: cn(\"h-8\", \"w-8\", getSpacingClass(\"none\", \"p\")),\n      },\n      {\n        variant: \"iconOnly\",\n        size: \"md\",\n        class: cn(\"h-10\", \"w-10\", getSpacingClass(\"none\", \"p\")),\n      },\n      {\n        variant: \"iconOnly\",\n        size: \"lg\",\n        class: cn(\"h-12\", \"w-12\", getSpacingClass(\"none\", \"p\")),\n      },\n      // Link variant zeroes the size's padding via compoundVariants so\n      // the override runs AFTER the size block's `px-N`/`py-N` and\n      // twMerge picks the zero value (`cn` joins variant before\n      // compound). The size's typography and gap survive — the link's\n      // text scales with size and icons still get gap-N when present.\n      // Issue #156.\n      {\n        variant: \"link\",\n        size: \"sm\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n      {\n        variant: \"link\",\n        size: \"md\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n      {\n        variant: \"link\",\n        size: \"lg\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n    ],\n    defaultVariants: {\n      variant: \"primary\",\n      size: \"md\",\n    },\n  },\n);\n\n/**\n * Icon Wrapper Component\n * Handles icon spacing and alignment consistently\n */\nfunction IconWrapper({\n  children,\n  position,\n}: {\n  children: ReactNode;\n  position: \"left\" | \"right\";\n}) {\n  if (!children) return null;\n\n  return (\n    <span\n      className={`inline-flex items-center ${position === \"left\" ? getSpacingClass(\"none\", \"mr\") : getSpacingClass(\"none\", \"ml\")}`}\n    >\n      {children}\n    </span>\n  );\n}\n\n/**\n * Button Component\n *\n * A styled button with variants, sizes, and loading states.\n *\n * Polymorphism — two APIs:\n *   - `as` (legacy): swap the root element type. `<Button as={Link} href=\"…\">`.\n *   - `asChild` (recommended): project Button's styling onto the single\n *     child element. Idiomatic Radix Slot pattern, preserves the child's\n *     own props and TS type (e.g. `<Link href prefetch>`). When `asChild`\n *     is true, `as` is ignored.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Button variant=\"primary\" size=\"md\" onClick={handleClick}>Click me</Button>\n *\n * // With icons\n * <Button leftIcon={<Icon />} rightIcon={<Icon />}>Action</Button>\n *\n * // Loading state\n * <Button isLoading loadingText=\"Saving...\">Save</Button>\n *\n * // Polymorphic via asChild (preserves Next Link's TS type and native props)\n * <Button asChild variant=\"primary\">\n *   <Link href=\"/page\" prefetch>Open</Link>\n * </Button>\n *\n * // Polymorphic via legacy `as`\n * <Button as=\"a\" href=\"/page\">Navigate</Button>\n * ```\n */\nconst Button = memo(\n  forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n      variant = \"primary\",\n      size = \"md\",\n      isLoading = false,\n      loadingText,\n      loadingIcon,\n      leftIcon,\n      rightIcon,\n      fullWidth = false,\n      asChild = false,\n      as,\n      className = \"\",\n      disabled = false,\n      children,\n      \"aria-label\": ariaLabel,\n      ...props\n    },\n    ref,\n  ) {\n    // asChild wins over `as`. Warn in dev so the precedence is observable\n    // instead of being a silent override. Production builds strip this branch.\n    if (\n      typeof process !== \"undefined\" &&\n      process.env.NODE_ENV !== \"production\" &&\n      asChild &&\n      as !== undefined &&\n      as !== \"button\"\n    ) {\n      console.warn(\n        \"[Button] `as` is ignored when `asChild` is true; the child element is used as the root. Drop one of the two props to silence this warning.\",\n      );\n    }\n\n    const Component: ElementType = asChild ? Slot : (as ?? \"button\");\n\n    // Memoize classes computation\n    const classes = useMemo(\n      () =>\n        cn(\n          buttonVariants({\n            variant,\n            size,\n          }),\n          fullWidth && \"w-full\",\n          className,\n        ),\n      [variant, size, fullWidth, className],\n    );\n\n    // Memoize icon-only check\n    const isIconOnly = useMemo(\n      () => variant === \"iconOnly\" || (!children && (leftIcon || rightIcon)),\n      [variant, children, leftIcon, rightIcon],\n    );\n\n    // Memoize aria label\n    const finalAriaLabel = useMemo(\n      () =>\n        isIconOnly && !ariaLabel && !children\n          ? \"Button\" // Fallback, but should be provided\n          : ariaLabel,\n      [isIconOnly, ariaLabel, children],\n    );\n\n    // Memoize spinner variant computation\n    const spinnerVariant = useMemo((): \"primary\" | \"secondary\" | \"neutral\" => {\n      if (variant === \"error\") return \"primary\"; // Red buttons use primary spinner (white)\n      if (variant === \"primary\" || variant === \"secondary\") return \"neutral\"; // Colored buttons use neutral spinner\n      return \"primary\"; // Default\n    }, [variant]);\n\n    // Memoize spinner size\n    const spinnerSize = useMemo(\n      () => (size === \"sm\" ? \"sm\" : size === \"lg\" ? \"lg\" : \"md\"),\n      [size],\n    );\n\n    // Memoize loading icon\n    const displayLoadingIcon = useMemo(\n      () =>\n        loadingIcon || <Spinner size={spinnerSize} variant={spinnerVariant} />,\n      [loadingIcon, spinnerSize, spinnerVariant],\n    );\n\n    // Build button props (spread props at the end to allow overrides).\n    // `type=\"button\"` default applies only when rendering an intrinsic\n    // <button>. asChild and `as` (custom) projections leave it off so we\n    // don't paint a meaningless `type` attribute onto <a> / <Link>.\n    const defaultType =\n      !asChild && (as === undefined || as === \"button\") && !props.type\n        ? \"button\"\n        : undefined;\n    const buttonProps = {\n      className: classes,\n      disabled: disabled || isLoading,\n      \"aria-busy\": isLoading,\n      \"aria-label\": finalAriaLabel,\n      \"aria-disabled\": disabled || isLoading,\n      ...(defaultType ? { type: defaultType } : {}),\n      ...props,\n    };\n\n    // asChild path: render Slot with the icons and Slottable as direct\n    // sibling children (NOT wrapped in a React.Fragment). Slot's\n    // children-processing inspects each direct child for Slottable; if\n    // the children are wrapped in a Fragment, Slot's SlotClone merges\n    // the projected props into the Fragment itself (a silent no-op for\n    // className / aria / ref), and nothing reaches the consumer's\n    // element. Hence the two distinct branches below: same content\n    // shape, different host element, different child layout.\n    if (asChild) {\n      return (\n        <Component ref={ref} {...buttonProps}>\n          {leftIcon && <IconWrapper position=\"left\">{leftIcon}</IconWrapper>}\n          <Slottable>{children}</Slottable>\n          {rightIcon && <IconWrapper position=\"right\">{rightIcon}</IconWrapper>}\n        </Component>\n      );\n    }\n\n    return (\n      <Component ref={ref} {...buttonProps}>\n        {isLoading ? (\n          <>\n            {displayLoadingIcon}\n            {loadingText && (\n              <span className={getSpacingClass(\"sm\", \"ml\")}>{loadingText}</span>\n            )}\n            {!loadingText && children && (\n              <span className={`${getSpacingClass(\"sm\", \"ml\")} opacity-0`}>\n                {children}\n              </span>\n            )}\n          </>\n        ) : (\n          <>\n            {leftIcon && <IconWrapper position=\"left\">{leftIcon}</IconWrapper>}\n            {children}\n            {rightIcon && (\n              <IconWrapper position=\"right\">{rightIcon}</IconWrapper>\n            )}\n          </>\n        )}\n      </Component>\n    );\n  }),\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\nexport { Button };\n"],"names":["buttonVariants","cva","cn","getTypographyClasses","getRadiusClass","getSpacingClass","getTypographySize","IconWrapper","children","position","jsx","Button","memo","forwardRef","_a","ref","_b","variant","size","isLoading","loadingText","loadingIcon","leftIcon","rightIcon","fullWidth","asChild","as","className","disabled","ariaLabel","props","__objRest","Component","Slot","classes","useMemo","isIconOnly","finalAriaLabel","spinnerVariant","spinnerSize","displayLoadingIcon","Spinner","defaultType","buttonProps","__spreadValues","jsxs","__spreadProps","Slottable","Fragment"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../../src/ui/primitives/Button/Button.tsx"],"sourcesContent":["import { forwardRef, memo } from \"react\";\nimport type { ButtonHTMLAttributes, ReactNode, ElementType } from \"react\";\nimport { Slot, Slottable } from \"@radix-ui/react-slot\";\nimport { getRadiusClass } from \"../../tokens/radius\";\n\n// Ambient declaration so the dev-only warn below typechecks without\n// pulling @types/node into the app tsconfig. At runtime the consumer's\n// bundler (webpack/turbopack/etc.) replaces `process.env.NODE_ENV` with\n// a literal; the `typeof process` guard keeps the branch safe in\n// browser/edge runtimes where `process` doesn't exist.\ndeclare const process: { env: { NODE_ENV?: string } };\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport {\n  getTypographyClasses,\n  getTypographySize,\n} from \"../../tokens/typography\";\nimport { cn, cva } from \"../../utils\";\nimport Spinner from \"../Spinner/Spinner\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"error\"\n  | \"outline\"\n  | \"ghost\"\n  | \"iconOnly\"\n  | \"link\";\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"as\"\n> {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  isLoading?: boolean;\n  loadingText?: string;\n  loadingIcon?: ReactNode;\n  leftIcon?: ReactNode;\n  rightIcon?: ReactNode;\n  fullWidth?: boolean;\n  as?: ElementType;\n  href?: string;\n  target?: string;\n  /**\n   * When true, render via Radix `Slot`: classes, ARIA, ref and remaining\n   * props are projected onto the single child element instead of an\n   * intrinsic `<button>`. The child keeps its own element type and props\n   * intact — including framework-native props like `<Link href prefetch>`.\n   *\n   * `asChild` takes precedence over `as`: if both are supplied, `as` is\n   * ignored and a dev-only warning is logged.\n   *\n   * @example\n   * ```tsx\n   * <Button asChild variant=\"primary\">\n   *   <Link href=\"/profile\" prefetch>Open profile</Link>\n   * </Button>\n   * // → <a class=\"…button classes\" href=\"/profile\" data-prefetch>Open profile</a>\n   * ```\n   */\n  asChild?: boolean;\n}\n\n/**\n * Button Variants using CVA\n * Type-safe variant system for Button component\n */\nconst buttonVariants = cva(\n  // Base classes\n  cn(\n    \"inline-flex\",\n    \"items-center\",\n    \"justify-center\",\n    getTypographyClasses(\"button\").split(\" \")[2] || \"font-medium\", // Extract font-medium\n    getRadiusClass(\"md\"),\n    \"transition-colors\",\n    \"focus:outline-none\",\n    \"focus:ring-2\",\n    \"focus:ring-offset-2\",\n    \"disabled:opacity-50\",\n    \"disabled:cursor-not-allowed\",\n  ),\n  {\n    variants: {\n      variant: {\n        primary: cn(\n          \"bg-surface-brand-strong\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-line-brand\",\n        ),\n        secondary: cn(\n          \"bg-surface-secondary\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-line-secondary\",\n        ),\n        error: cn(\n          \"bg-error\",\n          \"text-fg-inverse\",\n          \"hover:opacity-90\",\n          \"focus:ring-error\",\n        ),\n        outline: cn(\n          \"border-2\",\n          \"border-line-default\",\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n        ),\n        ghost: cn(\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n        ),\n        iconOnly: cn(\n          \"bg-transparent\",\n          \"text-fg-primary\",\n          \"hover:bg-surface-hover\",\n          \"focus:ring-line-focus\",\n          getSpacingClass(\"none\", \"p\"),\n        ),\n        // Textual call-to-action — brand-coloured text, underline on\n        // hover, no chrome (no surface, no border). Padding is zeroed\n        // out per size in compoundVariants so the bounding box hugs\n        // the text (height intrinsic). Issue #156.\n        //\n        // Focus ring: `focus:ring-line-focus` keeps the same focus\n        // family the other no-chrome variants use (ghost, outline,\n        // iconOnly). The base's `focus:ring-2` + `focus:ring-offset-2`\n        // produce a 2px ring 2px away from the text bounding box; the\n        // 2px offset is rendered in surface-base so the ring contrasts\n        // against surface (≥3:1 for WCAG 2.4.11, verified) rather than\n        // colliding with the brand-coloured text. The element keeps\n        // `getRadiusClass(\"md\")` from the base, which is invisible\n        // without chrome but rounds the focus ring corners.\n        //\n        // hover:underline pairs with `underline-offset-4` so the\n        // underline that appears on hover sits clear of the descenders\n        // (WCAG-aligned with link best practice). At rest the link\n        // carries no underline — the brand colour alone signals\n        // affordance, matching the shadcn convention this variant is\n        // modelled on (see issue body).\n        //\n        // disabled: inherits opacity-50 + cursor-not-allowed from the\n        // base. We do NOT special-case `disabled:no-underline` because\n        // a disabled link should still receive the same visual\n        // treatment as a disabled chrome variant — the opacity and\n        // cursor signal the disabled state.\n        link: cn(\n          \"bg-transparent\",\n          \"text-fg-brand\",\n          \"underline-offset-4\",\n          \"hover:underline\",\n          \"focus:ring-line-focus\",\n        ),\n      },\n      size: {\n        sm: cn(\n          getSpacingClass(\"md\", \"px\"),\n          getSpacingClass(\"1.5\", \"py\"),\n          getTypographySize(\"bodySmall\"),\n          getSpacingClass(\"1.5\", \"gap\"),\n        ),\n        md: cn(\n          getSpacingClass(\"base\", \"px\"),\n          getSpacingClass(\"sm\", \"py\"),\n          getTypographySize(\"body\"),\n          getSpacingClass(\"sm\", \"gap\"),\n        ),\n        lg: cn(\n          getSpacingClass(\"lg\", \"px\"),\n          getSpacingClass(\"md\", \"py\"),\n          getTypographySize(\"bodyLarge\"),\n          getSpacingClass(\"2.5\", \"gap\"),\n        ),\n      },\n    },\n    compoundVariants: [\n      // IconOnly variant has different sizing\n      {\n        variant: \"iconOnly\",\n        size: \"sm\",\n        class: cn(\"h-8\", \"w-8\", getSpacingClass(\"none\", \"p\")),\n      },\n      {\n        variant: \"iconOnly\",\n        size: \"md\",\n        class: cn(\"h-10\", \"w-10\", getSpacingClass(\"none\", \"p\")),\n      },\n      {\n        variant: \"iconOnly\",\n        size: \"lg\",\n        class: cn(\"h-12\", \"w-12\", getSpacingClass(\"none\", \"p\")),\n      },\n      // Link variant zeroes the size's padding via compoundVariants so\n      // the override runs AFTER the size block's `px-N`/`py-N` and\n      // twMerge picks the zero value (`cn` joins variant before\n      // compound). The size's typography and gap survive — the link's\n      // text scales with size and icons still get gap-N when present.\n      // Issue #156.\n      {\n        variant: \"link\",\n        size: \"sm\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n      {\n        variant: \"link\",\n        size: \"md\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n      {\n        variant: \"link\",\n        size: \"lg\",\n        class: cn(getSpacingClass(\"none\", \"px\"), getSpacingClass(\"none\", \"py\")),\n      },\n    ],\n    defaultVariants: {\n      variant: \"primary\",\n      size: \"md\",\n    },\n  },\n);\n\n/**\n * Icon Wrapper Component\n * Handles icon spacing and alignment consistently\n */\nfunction IconWrapper({\n  children,\n  position,\n}: {\n  children: ReactNode;\n  position: \"left\" | \"right\";\n}) {\n  if (!children) return null;\n\n  return (\n    <span\n      className={`inline-flex items-center ${position === \"left\" ? getSpacingClass(\"none\", \"mr\") : getSpacingClass(\"none\", \"ml\")}`}\n    >\n      {children}\n    </span>\n  );\n}\n\n/**\n * Button Component\n *\n * A styled button with variants, sizes, and loading states.\n *\n * Polymorphism — two APIs:\n *   - `as` (legacy): swap the root element type. `<Button as={Link} href=\"…\">`.\n *   - `asChild` (recommended): project Button's styling onto the single\n *     child element. Idiomatic Radix Slot pattern, preserves the child's\n *     own props and TS type (e.g. `<Link href prefetch>`). When `asChild`\n *     is true, `as` is ignored.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Button variant=\"primary\" size=\"md\" onClick={handleClick}>Click me</Button>\n *\n * // With icons\n * <Button leftIcon={<Icon />} rightIcon={<Icon />}>Action</Button>\n *\n * // Loading state\n * <Button isLoading loadingText=\"Saving...\">Save</Button>\n *\n * // Polymorphic via asChild (preserves Next Link's TS type and native props)\n * <Button asChild variant=\"primary\">\n *   <Link href=\"/page\" prefetch>Open</Link>\n * </Button>\n *\n * // Polymorphic via legacy `as`\n * <Button as=\"a\" href=\"/page\">Navigate</Button>\n * ```\n */\nconst Button = memo(\n  forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n      variant = \"primary\",\n      size = \"md\",\n      isLoading = false,\n      loadingText,\n      loadingIcon,\n      leftIcon,\n      rightIcon,\n      fullWidth = false,\n      asChild = false,\n      as,\n      className = \"\",\n      disabled = false,\n      children,\n      \"aria-label\": ariaLabel,\n      ...props\n    },\n    ref,\n  ) {\n    // asChild wins over `as`. Warn in dev so the precedence is observable\n    // instead of being a silent override. Production builds strip this branch.\n    if (\n      typeof process !== \"undefined\" &&\n      process.env.NODE_ENV !== \"production\" &&\n      asChild &&\n      as !== undefined &&\n      as !== \"button\"\n    ) {\n      console.warn(\n        \"[Button] `as` is ignored when `asChild` is true; the child element is used as the root. Drop one of the two props to silence this warning.\",\n      );\n    }\n\n    const Component: ElementType = asChild ? Slot : (as ?? \"button\");\n\n    // These were `useMemo` originally — all decorative (class-string\n    // concat, small boolean/string/JSX picks), none gating render-driving\n    // state. Inlined so Button carries NO React client API and qualifies\n    // for the `./server` entry (issue #224), the same de-memoization\n    // precedent as Badge/Label/Card in #155. `React.memo` on the\n    // component is preserved and still gates re-renders at the\n    // consumer-prop boundary; the inlined work is nanoseconds.\n    const classes = cn(\n      buttonVariants({ variant, size }),\n      fullWidth && \"w-full\",\n      className,\n    );\n\n    const isIconOnly =\n      variant === \"iconOnly\" || (!children && (leftIcon || rightIcon));\n\n    const finalAriaLabel =\n      isIconOnly && !ariaLabel && !children\n        ? \"Button\" // Fallback, but should be provided\n        : ariaLabel;\n\n    const spinnerVariant: \"primary\" | \"secondary\" | \"neutral\" =\n      variant === \"error\"\n        ? \"primary\" // Red buttons use primary spinner (white)\n        : variant === \"primary\" || variant === \"secondary\"\n          ? \"neutral\" // Colored buttons use neutral spinner\n          : \"primary\";\n\n    const spinnerSize = size === \"sm\" ? \"sm\" : size === \"lg\" ? \"lg\" : \"md\";\n\n    const displayLoadingIcon = loadingIcon || (\n      <Spinner size={spinnerSize} variant={spinnerVariant} />\n    );\n\n    // Build button props (spread props at the end to allow overrides).\n    // `type=\"button\"` default applies only when rendering an intrinsic\n    // <button>. asChild and `as` (custom) projections leave it off so we\n    // don't paint a meaningless `type` attribute onto <a> / <Link>.\n    const defaultType =\n      !asChild && (as === undefined || as === \"button\") && !props.type\n        ? \"button\"\n        : undefined;\n    const buttonProps = {\n      className: classes,\n      disabled: disabled || isLoading,\n      \"aria-busy\": isLoading,\n      \"aria-label\": finalAriaLabel,\n      \"aria-disabled\": disabled || isLoading,\n      ...(defaultType ? { type: defaultType } : {}),\n      ...props,\n    };\n\n    // asChild path: render Slot with the icons and Slottable as direct\n    // sibling children (NOT wrapped in a React.Fragment). Slot's\n    // children-processing inspects each direct child for Slottable; if\n    // the children are wrapped in a Fragment, Slot's SlotClone merges\n    // the projected props into the Fragment itself (a silent no-op for\n    // className / aria / ref), and nothing reaches the consumer's\n    // element. Hence the two distinct branches below: same content\n    // shape, different host element, different child layout.\n    if (asChild) {\n      return (\n        <Component ref={ref} {...buttonProps}>\n          {leftIcon && <IconWrapper position=\"left\">{leftIcon}</IconWrapper>}\n          <Slottable>{children}</Slottable>\n          {rightIcon && <IconWrapper position=\"right\">{rightIcon}</IconWrapper>}\n        </Component>\n      );\n    }\n\n    return (\n      <Component ref={ref} {...buttonProps}>\n        {isLoading ? (\n          <>\n            {displayLoadingIcon}\n            {loadingText && (\n              <span className={getSpacingClass(\"sm\", \"ml\")}>{loadingText}</span>\n            )}\n            {!loadingText && children && (\n              <span className={`${getSpacingClass(\"sm\", \"ml\")} opacity-0`}>\n                {children}\n              </span>\n            )}\n          </>\n        ) : (\n          <>\n            {leftIcon && <IconWrapper position=\"left\">{leftIcon}</IconWrapper>}\n            {children}\n            {rightIcon && (\n              <IconWrapper position=\"right\">{rightIcon}</IconWrapper>\n            )}\n          </>\n        )}\n      </Component>\n    );\n  }),\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\nexport { Button };\n"],"names":["buttonVariants","cva","cn","getTypographyClasses","getRadiusClass","getSpacingClass","getTypographySize","IconWrapper","children","position","jsx","Button","memo","forwardRef","_a","ref","_b","variant","size","isLoading","loadingText","loadingIcon","leftIcon","rightIcon","fullWidth","asChild","as","className","disabled","ariaLabel","props","__objRest","Component","Slot","classes","finalAriaLabel","displayLoadingIcon","Spinner","defaultType","buttonProps","__spreadValues","jsxs","__spreadProps","Slottable","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEA,MAAMA,IAAiBC;AAAA;AAAA,EAErBC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACAC,EAAqB,QAAQ,EAAE,MAAM,GAAG,EAAE,CAAC,KAAK;AAAA;AAAA,IAChDC,EAAe,IAAI;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAASF;AAAA,UACP;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,OAAOA;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,SAASA;AAAA,UACP;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,OAAOA;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,UAAUA;AAAA,UACR;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACAG,EAAgB,QAAQ,GAAG;AAAA,QAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QA6B7B,MAAMH;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF,MAAM;AAAA,QACJ,IAAIA;AAAA,UACFG,EAAgB,MAAM,IAAI;AAAA,UAC1BA,EAAgB,OAAO,IAAI;AAAA,UAC3BC,EAAkB,WAAW;AAAA,UAC7BD,EAAgB,OAAO,KAAK;AAAA,QAAA;AAAA,QAE9B,IAAIH;AAAA,UACFG,EAAgB,QAAQ,IAAI;AAAA,UAC5BA,EAAgB,MAAM,IAAI;AAAA,UAC1BC,EAAkB,MAAM;AAAA,UACxBD,EAAgB,MAAM,KAAK;AAAA,QAAA;AAAA,QAE7B,IAAIH;AAAA,UACFG,EAAgB,MAAM,IAAI;AAAA,UAC1BA,EAAgB,MAAM,IAAI;AAAA,UAC1BC,EAAkB,WAAW;AAAA,UAC7BD,EAAgB,OAAO,KAAK;AAAA,QAAA;AAAA,MAC9B;AAAA,IACF;AAAA,IAEF,kBAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAG,OAAO,OAAOG,EAAgB,QAAQ,GAAG,CAAC;AAAA,MAAA;AAAA,MAEtD;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAG,QAAQ,QAAQG,EAAgB,QAAQ,GAAG,CAAC;AAAA,MAAA;AAAA,MAExD;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAG,QAAQ,QAAQG,EAAgB,QAAQ,GAAG,CAAC;AAAA,MAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQxD;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAGG,EAAgB,QAAQ,IAAI,GAAGA,EAAgB,QAAQ,IAAI,CAAC;AAAA,MAAA;AAAA,MAExE;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAGG,EAAgB,QAAQ,IAAI,GAAGA,EAAgB,QAAQ,IAAI,CAAC;AAAA,MAAA;AAAA,MAExE;AAAA,QACE,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAOH,EAAGG,EAAgB,QAAQ,IAAI,GAAGA,EAAgB,QAAQ,IAAI,CAAC;AAAA,MAAA;AAAA,IACxE;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ;AAMA,SAASE,EAAY;AAAA,EACnB,UAAAC;AAAA,EACA,UAAAC;AACF,GAGG;AACD,SAAKD,IAGH,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,4BAA4BD,MAAa,SAASJ,EAAgB,QAAQ,IAAI,IAAIA,EAAgB,QAAQ,IAAI,CAAC;AAAA,MAEzH,UAAAG;AAAA,IAAA;AAAA,EAAA,IANiB;AASxB;AAkCA,MAAMG,IAASC;AAAA,EACbC,EAA2C,SACzCC,GAiBAC,GACA;AAlBA,QAAAC,IAAAF,GACE;AAAA,eAAAG,IAAU;AAAA,MACV,MAAAC,IAAO;AAAA,MACP,WAAAC,IAAY;AAAA,MACZ,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC,IAAY;AAAA,MACZ,SAAAC,IAAU;AAAA,MACV,IAAAC;AAAA,MACA,WAAAC,IAAY;AAAA,MACZ,UAAAC,IAAW;AAAA,MACX,UAAApB;AAAA,MACA,cAAcqB;AAAA,QAdhBb,GAeKc,IAAAC,EAfLf,GAeK;AAAA,MAdH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAOF,IACE,OAAO,WAAY,eACnB,QAAQ,IAAI,aAAa,gBACzBS,KACAC,MAAO,UACPA,MAAO,YAEP,QAAQ;AAAA,MACN;AAAA,IAAA;AAIJ,UAAMM,IAAyBP,IAAUQ,IAAQP,KAAA,OAAAA,IAAM,UASjDQ,IAAUhC;AAAA,MACdF,EAAe,EAAE,SAAAiB,GAAS,MAAAC,GAAM;AAAA,MAChCM,KAAa;AAAA,MACbG;AAAA,IAAA,GAMIQ,KAFJlB,MAAY,cAAe,CAACT,MAAac,KAAYC,OAGvC,CAACM,KAAa,CAACrB,IACzB,WACAqB,GAWAO,IAAqBf,KACzB,gBAAAX,EAAC2B,KAAQ,MAHSnB,MAAS,OAAO,OAAOA,MAAS,OAAO,OAAO,MAGpC,SAT5BD,MAAY,UACR,YACAA,MAAY,aAAaA,MAAY,cACnC,YACA,WAK+C,GAOjDqB,IACJ,CAACb,MAAYC,MAAO,UAAaA,MAAO,aAAa,CAACI,EAAM,OACxD,WACA,QACAS,IAAcC,IAAA;AAAA,MAClB,WAAWN;AAAA,MACX,UAAUN,KAAYT;AAAA,MACtB,aAAaA;AAAA,MACb,cAAcgB;AAAA,MACd,iBAAiBP,KAAYT;AAAA,OACzBmB,IAAc,EAAE,MAAMA,EAAA,IAAgB,CAAA,IACvCR;AAWL,WAAIL,IAEA,gBAAAgB,EAACT,GAAAU,EAAAF,EAAA,EAAU,KAAAzB,KAAcwB,IAAxB,EACE,UAAA;AAAA,MAAAjB,KAAY,gBAAAZ,EAACH,GAAA,EAAY,UAAS,QAAQ,UAAAe,GAAS;AAAA,MACpD,gBAAAZ,EAACiC,KAAW,UAAAnC,GAAS;AAAA,MACpBe,KAAa,gBAAAb,EAACH,GAAA,EAAY,UAAS,SAAS,UAAAgB,EAAA,CAAU;AAAA,IAAA,IACzD,sBAKDS,GAAAU,EAAAF,EAAA,EAAU,KAAAzB,KAAcwB,IAAxB,EACE,cACC,gBAAAE,EAAAG,GAAA,EACG,UAAA;AAAA,MAAAR;AAAA,MACAhB,uBACE,QAAA,EAAK,WAAWf,EAAgB,MAAM,IAAI,GAAI,UAAAe,GAAY;AAAA,MAE5D,CAACA,KAAeZ,KACf,gBAAAE,EAAC,QAAA,EAAK,WAAW,GAAGL,EAAgB,MAAM,IAAI,CAAC,cAC5C,UAAAG,EAAA,CACH;AAAA,IAAA,EAAA,CAEJ,IAEA,gBAAAiC,EAAAG,GAAA,EACG,UAAA;AAAA,MAAAtB,KAAY,gBAAAZ,EAACH,GAAA,EAAY,UAAS,QAAQ,UAAAe,GAAS;AAAA,MACnDd;AAAA,MACAe,KACC,gBAAAb,EAACH,GAAA,EAAY,UAAS,SAAS,UAAAgB,EAAA,CAAU;AAAA,IAAA,EAAA,CAE7C,EAAA,EAEJ;AAAA,EAEJ,CAAC;AACH;AAEAZ,EAAO,cAAc;"}