@cloudflare/kumo 1.2.0 → 1.4.0

package/dist/index.js

@@ -1,126 +1,278 @@
 "use client";
-import { B as r } from "./badge-Dc99vsfo.js";
-import { B as e, a as t } from "./banner-4fkH6Sbt.js";
-import { B as i, L as m, R as A, b as n } from "./button-Bh96oxRL.js";
-import { D as f } from "./date-range-picker-CbKEQ9pi.js";
-import { C as _ } from "./checkbox-C1LPq8eL.js";
-import { C as L } from "./clipboard-text-CJSI9X2m.js";
-import { C as R, a as S } from "./code-T2wPDiM0.js";
-import { C as D } from "./combobox-CWxn5aHA.js";
-import { D as M, e as U, d as N, a as u, c as E, b as O } from "./dialog-BxXPA2vI.js";
-import { D as C } from "./dropdown-BAyk1knz.js";
-import { C as g } from "./collapsible-OBNkTO48.js";
-import { F as B, a as c, K as F, f as k } from "./field-B7ORz5ej.js";
-import { b as v, K as h, L as y, a as w, l as j } from "./label-B4FY8MX_.js";
-import { I as z, i as H } from "./input-D6YgDfDG.js";
-import { I as Q } from "./input-area-DN_Ncliw.js";
-import { I as X } from "./input-group-BXzBwH4p.js";
-import { L as Z } from "./layer-card-C8j5Hkkj.js";
-import { L as aa } from "./loader-DHGMYlC6.js";
-import { S as ra } from "./skeleton-line-CtpS1u1J.js";
-import { M as ea, u as ta } from "./menubar-CzimiryS.js";
-import { M as ia } from "./meter-BrJnHJ3Q.js";
-import { P as Aa } from "./pagination-D0x9KQSk.js";
-import { S as Ta } from "./select-D4rKQAax.js";
-import { S as xa } from "./surface-BIC6CXiz.js";
-import { S as Ia } from "./switch-z7FE1nQE.js";
-import { T as la } from "./tabs-DAEeuQLd.js";
-import { T as Sa } from "./table-Sd2Etb1N.js";
-import { T as Da } from "./text-BEhqwMfe.js";
-import { T as Ma, u as Ua } from "./toast-B8ebpHaU.js";
-import { T as ua, a as Ea } from "./tooltip-C4DRhJi1.js";
-import { a as da, K as Ca, P as ba } from "./popover-BfGLC2s6.js";
-import { a as Pa, K as Ba, S as ca } from "./sensitive-input-DYvAmxkN.js";
-import { b as ka, K as Ga, R as va, a as ha } from "./radio-CYejLANA.js";
-import { C as wa, a as ja, K as qa } from "./command-palette-BxmGYxBv.js";
-import { a as Ha, K as Ja, L as Qa, l as Wa } from "./link-CcuZKqob.js";
-import { B as Ya } from "./breadcrumbs-DyKi7BcP.js";
-import { E as $a } from "./empty-D03cbzRS.js";
-import { G as oo, a as ro, c as so, K as eo, b as to, g as po } from "./grid-DKajRHh8.js";
-import { c as mo, s as Ao } from "./cn-Bhsu1vx2.js";
-import { L as To, u as fo } from "./link-provider-DPBGo-0n.js";
-import { i as _o } from "./vendor-base-ui-kX0wjdav.js";
+import { B as J } from "./badge-Dc99vsfo.js";
+import { B as S } from "./banner-4fkH6Sbt.js";
+import { a as Y } from "./banner-4fkH6Sbt.js";
+import { B as n } from "./button-Bh96oxRL.js";
+import { L as aa, R as ea, b as oa } from "./button-Bh96oxRL.js";
+import { D as ta } from "./date-range-picker-CbKEQ9pi.js";
+import { C as ia } from "./checkbox-C1LPq8eL.js";
+import { C as na } from "./clipboard-text-CJSI9X2m.js";
+import { C as pa, a as fa } from "./code-T2wPDiM0.js";
+import { C as ca } from "./combobox-CWxn5aHA.js";
+import { a as N, D as O, c as U, e as T } from "./dialog-x9n9wI13.js";
+import { d as ua, b as Aa } from "./dialog-x9n9wI13.js";
+import { D as _a } from "./dropdown-BAyk1knz.js";
+import { C as Ca } from "./collapsible-OBNkTO48.js";
+import { F as La, a as Ra, K as Ea, f as ha } from "./field-B7ORz5ej.js";
+import { b as Na, K as Oa, L as Ua, a as ga, l as Da } from "./label-B4FY8MX_.js";
+import { I as g } from "./input-D6YgDfDG.js";
+import { i as Ka } from "./input-D6YgDfDG.js";
+import { I as ka } from "./input-area-DN_Ncliw.js";
+import { I as ya } from "./input-group-BXzBwH4p.js";
+import { L as Fa } from "./layer-card-C8j5Hkkj.js";
+import { L as wa } from "./loader-DHGMYlC6.js";
+import { S as Ga } from "./skeleton-line-CtpS1u1J.js";
+import { M as $a, u as qa } from "./menubar-CzimiryS.js";
+import { M as Xa } from "./meter-BrJnHJ3Q.js";
+import { P as Ja } from "./pagination-D0x9KQSk.js";
+import { S as Ya } from "./select-D4rKQAax.js";
+import { S as ae } from "./surface-BIC6CXiz.js";
+import { S as oe } from "./switch-z7FE1nQE.js";
+import { T as te } from "./tabs-DAEeuQLd.js";
+import { T as ie } from "./table-Sd2Etb1N.js";
+import { T as ne } from "./text-BEhqwMfe.js";
+import { T as pe, u as fe } from "./toast-B8ebpHaU.js";
+import { T as ce, a as xe } from "./tooltip-C4DRhJi1.js";
+import { g as Ae, K as Te, P as _e } from "./popover-CtKDH8Yc.js";
+import { a as Ce, K as be, S as Le } from "./sensitive-input-DYvAmxkN.js";
+import { b as Ee, K as he, R as Se, a as Ne } from "./radio-CYejLANA.js";
+import { C as Ue, a as ge, K as De } from "./command-palette-J50WKjS7.js";
+import { a as Ke, K as Me, L as ke, l as ve } from "./link-CcuZKqob.js";
+import { B as Pe } from "./breadcrumbs-DyKi7BcP.js";
+import { E as Be } from "./empty-D03cbzRS.js";
+import { G as ze, a as Ge, c as je, K as $e, b as qe, g as We } from "./grid-DKajRHh8.js";
+import { C as He, a as Je, K as Qe, P as Ye, g as Ze } from "./cloudflare-logo-Dqd1VD9z.js";
+import { c as D } from "./cn-Bhsu1vx2.js";
+import { s as eo } from "./cn-Bhsu1vx2.js";
+import { L as ro, u as to } from "./link-provider-DPBGo-0n.js";
+import { jsx as a, jsxs as e } from "react/jsx-runtime";
+import { useState as _, useEffect as V, useCallback as m } from "react";
+import { XIcon as K, WarningCircleIcon as M, CheckIcon as k, CopyIcon as v } from "@phosphor-icons/react";
+import { i as io } from "./vendor-base-ui-kX0wjdav.js";
+const W = {
+  size: {
+    sm: {
+      classes: "",
+      description: "Small dialog for simple delete confirmations"
+    },
+    base: {
+      classes: "",
+      description: "Default delete confirmation dialog size"
+    }
+  }
+}, y = {
+  size: "base"
+};
+function P({
+  open: s,
+  onOpenChange: I,
+  resourceType: p,
+  resourceName: o,
+  onDelete: f,
+  isDeleting: r = !1,
+  caseSensitive: d = !0,
+  deleteButtonText: C,
+  size: b = y.size,
+  errorMessage: c,
+  className: L
+}) {
+  const [x, u] = _(""), [R, i] = _(!1);
+  V(() => {
+    s || (u(""), i(!1));
+  }, [s]);
+  const A = m(
+    (t) => d ? t : t.toLowerCase(),
+    [d]
+  ), l = A(x) === A(o), E = m(async () => {
+    !l || r || await f();
+  }, [l, r, f]), h = m(async () => {
+    await navigator.clipboard.writeText(o), i(!0), setTimeout(() => i(!1), 1500);
+  }, [o]);
+  return /* @__PURE__ */ a(N, { open: s, onOpenChange: I, children: /* @__PURE__ */ e(O, { size: b, className: D("p-0", L), children: [
+    /* @__PURE__ */ e("div", { className: "flex items-center justify-between border-b border-kumo-line px-6 py-4", children: [
+      /* @__PURE__ */ e(U, { className: "text-lg font-semibold", children: [
+        "Delete ",
+        o
+      ] }),
+      /* @__PURE__ */ a(T, { children: /* @__PURE__ */ a(
+        n,
+        {
+          variant: "ghost",
+          shape: "square",
+          size: "sm",
+          "aria-label": "Close",
+          disabled: r,
+          children: /* @__PURE__ */ a(K, { size: 18 })
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "flex flex-col p-6 gap-4", children: [
+      /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: [
+        c && /* @__PURE__ */ a(S, { icon: /* @__PURE__ */ a(M, {}), variant: "error", children: c }),
+        /* @__PURE__ */ e("p", { className: "text-base text-kumo-subtle max-w-prose text-pretty", children: [
+          "This action cannot be undone. This will permanently delete the",
+          " ",
+          /* @__PURE__ */ a("span", { className: "font-medium text-kumo-default", children: o }),
+          " ",
+          p.toLowerCase(),
+          "."
+        ] })
+      ] }),
+      /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5 text-base", children: /* @__PURE__ */ e("span", { children: [
+          "Type",
+          " ",
+          /* @__PURE__ */ e(
+            "button",
+            {
+              className: "font-mono text-sm inline font-semibold bg-kumo-tint hover:bg-kumo-fill rounded-md px-2 py-1 group hover:cursor-pointer",
+              onClick: h,
+              "aria-label": `Copy ${o} to clipboard`,
+              children: [
+                o,
+                R ? /* @__PURE__ */ a(
+                  k,
+                  {
+                    size: 12,
+                    weight: "bold",
+                    className: "inline ml-1.5"
+                  }
+                ) : /* @__PURE__ */ a(
+                  v,
+                  {
+                    size: 12,
+                    weight: "bold",
+                    className: "inline text-kumo-subtle group-hover:text-kumo-default ml-1.5"
+                  }
+                )
+              ]
+            }
+          ),
+          " ",
+          "to confirm:"
+        ] }) }),
+        /* @__PURE__ */ a(
+          g,
+          {
+            placeholder: o,
+            value: x,
+            onChange: (t) => u(t.target.value),
+            disabled: r,
+            autoComplete: "off",
+            autoCorrect: "off",
+            autoCapitalize: "off",
+            spellCheck: !1,
+            "aria-label": `Type ${o} to confirm deletion`,
+            className: "w-full"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "flex justify-end gap-3 border-t border-kumo-line px-6 py-4", children: [
+      /* @__PURE__ */ a(T, { children: /* @__PURE__ */ a(n, { variant: "secondary", disabled: r, children: "Cancel" }) }),
+      /* @__PURE__ */ a(
+        n,
+        {
+          variant: "destructive",
+          onClick: E,
+          disabled: !l || r,
+          loading: r,
+          children: C || `Delete ${p}`
+        }
+      )
+    ] })
+  ] }) });
+}
+P.displayName = "DeleteResource";
 export {
-  r as Badge,
-  e as Banner,
-  t as BannerVariant,
-  Ya as Breadcrumbs,
-  i as Button,
-  _ as Checkbox,
-  L as ClipboardText,
-  R as Code,
-  S as CodeBlock,
-  g as Collapsible,
-  D as Combobox,
-  wa as CommandPalette,
-  f as DateRangePicker,
-  M as Dialog,
-  U as DialogClose,
-  N as DialogDescription,
-  u as DialogRoot,
-  E as DialogTitle,
-  O as DialogTrigger,
-  C as DropdownMenu,
-  $a as Empty,
-  B as Field,
-  oo as Grid,
-  ro as GridItem,
-  z as Input,
-  Q as InputArea,
-  X as InputGroup,
-  ja as KUMO_COMMAND_PALETTE_DEFAULT_VARIANTS,
-  qa as KUMO_COMMAND_PALETTE_VARIANTS,
-  c as KUMO_FIELD_DEFAULT_VARIANTS,
-  F as KUMO_FIELD_VARIANTS,
-  so as KUMO_GRID_DEFAULT_VARIANTS,
-  eo as KUMO_GRID_VARIANTS,
-  v as KUMO_LABEL_DEFAULT_VARIANTS,
-  h as KUMO_LABEL_VARIANTS,
-  Ha as KUMO_LINK_DEFAULT_VARIANTS,
-  Ja as KUMO_LINK_VARIANTS,
-  da as KUMO_POPOVER_DEFAULT_VARIANTS,
-  Ca as KUMO_POPOVER_VARIANTS,
-  ka as KUMO_RADIO_DEFAULT_VARIANTS,
-  Ga as KUMO_RADIO_VARIANTS,
-  Pa as KUMO_SENSITIVE_INPUT_DEFAULT_VARIANTS,
-  Ba as KUMO_SENSITIVE_INPUT_VARIANTS,
-  y as Label,
-  Z as LayerCard,
-  Qa as Link,
-  m as LinkButton,
-  To as LinkProvider,
-  aa as Loader,
-  ea as MenuBar,
-  ia as Meter,
-  Aa as Pagination,
-  ba as Popover,
-  va as Radio,
-  ha as RadioGroup,
-  A as RefreshButton,
-  Ta as Select,
-  ca as SensitiveInput,
-  ra as SkeletonLine,
-  xa as Surface,
-  Ia as Switch,
-  Sa as Table,
-  la as Tabs,
-  Da as Text,
-  _o as Toast,
-  Ma as Toasty,
-  ua as Tooltip,
-  Ea as TooltipProvider,
-  n as buttonVariants,
-  mo as cn,
-  k as fieldVariants,
-  to as gridItemVariants,
-  po as gridVariants,
-  H as inputVariants,
-  w as labelContentVariants,
-  j as labelVariants,
-  Wa as linkVariants,
-  Ao as safeRandomId,
-  Ua as useKumoToastManager,
-  fo as useLinkComponent,
-  ta as useMenuNavigation
+  J as Badge,
+  S as Banner,
+  Y as BannerVariant,
+  Pe as Breadcrumbs,
+  n as Button,
+  ia as Checkbox,
+  na as ClipboardText,
+  He as CloudflareLogo,
+  pa as Code,
+  fa as CodeBlock,
+  Ca as Collapsible,
+  ca as Combobox,
+  Ue as CommandPalette,
+  ta as DateRangePicker,
+  P as DeleteResource,
+  O as Dialog,
+  T as DialogClose,
+  ua as DialogDescription,
+  N as DialogRoot,
+  U as DialogTitle,
+  Aa as DialogTrigger,
+  _a as DropdownMenu,
+  Be as Empty,
+  La as Field,
+  ze as Grid,
+  Ge as GridItem,
+  g as Input,
+  ka as InputArea,
+  ya as InputGroup,
+  Je as KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS,
+  Qe as KUMO_CLOUDFLARE_LOGO_VARIANTS,
+  ge as KUMO_COMMAND_PALETTE_DEFAULT_VARIANTS,
+  De as KUMO_COMMAND_PALETTE_VARIANTS,
+  y as KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS,
+  W as KUMO_DELETE_RESOURCE_VARIANTS,
+  Ra as KUMO_FIELD_DEFAULT_VARIANTS,
+  Ea as KUMO_FIELD_VARIANTS,
+  je as KUMO_GRID_DEFAULT_VARIANTS,
+  $e as KUMO_GRID_VARIANTS,
+  Na as KUMO_LABEL_DEFAULT_VARIANTS,
+  Oa as KUMO_LABEL_VARIANTS,
+  Ke as KUMO_LINK_DEFAULT_VARIANTS,
+  Me as KUMO_LINK_VARIANTS,
+  Ae as KUMO_POPOVER_DEFAULT_VARIANTS,
+  Te as KUMO_POPOVER_VARIANTS,
+  Ee as KUMO_RADIO_DEFAULT_VARIANTS,
+  he as KUMO_RADIO_VARIANTS,
+  Ce as KUMO_SENSITIVE_INPUT_DEFAULT_VARIANTS,
+  be as KUMO_SENSITIVE_INPUT_VARIANTS,
+  Ua as Label,
+  Fa as LayerCard,
+  ke as Link,
+  aa as LinkButton,
+  ro as LinkProvider,
+  wa as Loader,
+  $a as MenuBar,
+  Xa as Meter,
+  Ja as Pagination,
+  _e as Popover,
+  Ye as PoweredByCloudflare,
+  Se as Radio,
+  Ne as RadioGroup,
+  ea as RefreshButton,
+  Ya as Select,
+  Le as SensitiveInput,
+  Ga as SkeletonLine,
+  ae as Surface,
+  oe as Switch,
+  ie as Table,
+  te as Tabs,
+  ne as Text,
+  io as Toast,
+  pe as Toasty,
+  ce as Tooltip,
+  xe as TooltipProvider,
+  oa as buttonVariants,
+  D as cn,
+  ha as fieldVariants,
+  Ze as generateCloudflareLogoSvg,
+  qe as gridItemVariants,
+  We as gridVariants,
+  Ka as inputVariants,
+  ga as labelContentVariants,
+  Da as labelVariants,
+  ve as linkVariants,
+  eo as safeRandomId,
+  fe as useKumoToastManager,
+  to as useLinkComponent,
+  qa as useMenuNavigation
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../src/blocks/delete-resource/delete-resource.tsx"],"sourcesContent":["import { useState, useCallback, useEffect } from \"react\";\nimport {\n  Dialog,\n  DialogRoot,\n  DialogTitle,\n  DialogClose,\n} from \"../../components/dialog\";\nimport { Input } from \"../../components/input\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  CheckIcon,\n  CopyIcon,\n  WarningCircleIcon,\n  XIcon,\n} from \"@phosphor-icons/react\";\nimport { Banner } from \"../../components/banner\";\n\nexport const KUMO_DELETE_RESOURCE_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"\",\n      description: \"Small dialog for simple delete confirmations\",\n    },\n    base: {\n      classes: \"\",\n      description: \"Default delete confirmation dialog size\",\n    },\n  },\n} as const;\n\nexport const KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport type KumoDeleteResourceSize =\n  keyof typeof KUMO_DELETE_RESOURCE_VARIANTS.size;\n\nexport interface KumoDeleteResourceVariantsProps {\n  size?: KumoDeleteResourceSize;\n}\n\nexport interface DeleteResourceProps extends KumoDeleteResourceVariantsProps {\n  /** Whether the dialog is open */\n  open: boolean;\n  /** Callback when open state changes */\n  onOpenChange: (open: boolean) => void;\n  /** The type of resource being deleted (e.g., \"Zone\", \"Worker\", \"KV Namespace\") */\n  resourceType: string;\n  /** The name of the specific resource being deleted */\n  resourceName: string;\n  /** Callback when delete is confirmed */\n  onDelete: () => void | Promise<void>;\n  /** Whether the delete action is in progress */\n  isDeleting?: boolean;\n  /** Whether the confirmation input should be case-sensitive (default: true) */\n  caseSensitive?: boolean;\n  /** Custom delete button text (defaults to \"Delete {resourceType}\") */\n  deleteButtonText?: string;\n  /** Additional className for the dialog */\n  className?: string;\n  /** Error message to display if the delete action fails */\n  errorMessage?: string;\n}\n\nexport function DeleteResource({\n  open,\n  onOpenChange,\n  resourceType,\n  resourceName,\n  onDelete,\n  isDeleting = false,\n  caseSensitive = true,\n  deleteButtonText,\n  size = KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS.size,\n  errorMessage,\n  className,\n}: DeleteResourceProps) {\n  const [confirmationInput, setConfirmationInput] = useState(\"\");\n  const [copied, setCopied] = useState(false);\n\n  useEffect(() => {\n    if (!open) {\n      setConfirmationInput(\"\");\n      setCopied(false);\n    }\n  }, [open]);\n\n  const normalizeForComparison = useCallback(\n    (str: string) => (caseSensitive ? str : str.toLowerCase()),\n    [caseSensitive],\n  );\n\n  const isConfirmed =\n    normalizeForComparison(confirmationInput) ===\n    normalizeForComparison(resourceName);\n\n  const handleDelete = useCallback(async () => {\n    if (!isConfirmed || isDeleting) return;\n    await onDelete();\n  }, [isConfirmed, isDeleting, onDelete]);\n\n  const handleCopy = useCallback(async () => {\n    await navigator.clipboard.writeText(resourceName);\n    setCopied(true);\n    setTimeout(() => setCopied(false), 1500);\n  }, [resourceName]);\n\n  return (\n    <DialogRoot open={open} onOpenChange={onOpenChange}>\n      <Dialog size={size} className={cn(\"p-0\", className)}>\n        <div className=\"flex items-center justify-between border-b border-kumo-line px-6 py-4\">\n          <DialogTitle className=\"text-lg font-semibold\">\n            Delete {resourceName}\n          </DialogTitle>\n          <DialogClose>\n            <Button\n              variant=\"ghost\"\n              shape=\"square\"\n              size=\"sm\"\n              aria-label=\"Close\"\n              disabled={isDeleting}\n            >\n              <XIcon size={18} />\n            </Button>\n          </DialogClose>\n        </div>\n\n        <div className=\"flex flex-col p-6 gap-4\">\n          <div className=\"flex flex-col gap-2\">\n            {errorMessage && (\n              <Banner icon={<WarningCircleIcon />} variant=\"error\">\n                {errorMessage}\n              </Banner>\n            )}\n            <p className=\"text-base text-kumo-subtle max-w-prose text-pretty\">\n              This action cannot be undone. This will permanently delete the{\" \"}\n              <span className=\"font-medium text-kumo-default\">\n                {resourceName}\n              </span>{\" \"}\n              {resourceType.toLowerCase()}.\n            </p>\n          </div>\n\n          <div className=\"flex flex-col gap-2\">\n            <div className=\"flex items-center gap-1.5 text-base\">\n              <span>\n                Type{\" \"}\n                <button\n                  className=\"font-mono text-sm inline font-semibold bg-kumo-tint hover:bg-kumo-fill rounded-md px-2 py-1 group hover:cursor-pointer\"\n                  onClick={handleCopy}\n                  aria-label={`Copy ${resourceName} to clipboard`}\n                >\n                  {resourceName}\n\n                  {copied ? (\n                    <CheckIcon\n                      size={12}\n                      weight=\"bold\"\n                      className=\"inline ml-1.5\"\n                    />\n                  ) : (\n                    <CopyIcon\n                      size={12}\n                      weight=\"bold\"\n                      className=\"inline text-kumo-subtle group-hover:text-kumo-default ml-1.5\"\n                    />\n                  )}\n                </button>{\" \"}\n                to confirm:\n              </span>\n            </div>\n            <Input\n              placeholder={resourceName}\n              value={confirmationInput}\n              onChange={(e) => setConfirmationInput(e.target.value)}\n              disabled={isDeleting}\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              autoCapitalize=\"off\"\n              spellCheck={false}\n              aria-label={`Type ${resourceName} to confirm deletion`}\n              className=\"w-full\"\n            />\n          </div>\n        </div>\n\n        <div className=\"flex justify-end gap-3 border-t border-kumo-line px-6 py-4\">\n          <DialogClose>\n            <Button variant=\"secondary\" disabled={isDeleting}>\n              Cancel\n            </Button>\n          </DialogClose>\n          <Button\n            variant=\"destructive\"\n            onClick={handleDelete}\n            disabled={!isConfirmed || isDeleting}\n            loading={isDeleting}\n          >\n            {deleteButtonText || `Delete ${resourceType}`}\n          </Button>\n        </div>\n      </Dialog>\n    </DialogRoot>\n  );\n}\n\nDeleteResource.displayName = \"DeleteResource\";\n"],"names":["KUMO_DELETE_RESOURCE_VARIANTS","KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS","DeleteResource","open","onOpenChange","resourceType","resourceName","onDelete","isDeleting","caseSensitive","deleteButtonText","size","errorMessage","className","confirmationInput","setConfirmationInput","useState","copied","setCopied","useEffect","normalizeForComparison","useCallback","str","isConfirmed","handleDelete","handleCopy","jsx","DialogRoot","jsxs","Dialog","cn","DialogTitle","DialogClose","Button","XIcon","Banner","WarningCircleIcon","CheckIcon","CopyIcon","Input","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAMA,IAAgC;AAAA,EAC3C,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAAwC;AAAA,EACnD,MAAM;AACR;AAgCO,SAASC,EAAe;AAAA,EAC7B,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,eAAAC,IAAgB;AAAA,EAChB,kBAAAC;AAAA,EACA,MAAAC,IAAOV,EAAsC;AAAA,EAC7C,cAAAW;AAAA,EACA,WAAAC;AACF,GAAwB;AACtB,QAAM,CAACC,GAAmBC,CAAoB,IAAIC,EAAS,EAAE,GACvD,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK;AAE1C,EAAAG,EAAU,MAAM;AACd,IAAKhB,MACHY,EAAqB,EAAE,GACvBG,EAAU,EAAK;AAAA,EAEnB,GAAG,CAACf,CAAI,CAAC;AAET,QAAMiB,IAAyBC;AAAA,IAC7B,CAACC,MAAiBb,IAAgBa,IAAMA,EAAI,YAAA;AAAA,IAC5C,CAACb,CAAa;AAAA,EAAA,GAGVc,IACJH,EAAuBN,CAAiB,MACxCM,EAAuBd,CAAY,GAE/BkB,IAAeH,EAAY,YAAY;AAC3C,IAAI,CAACE,KAAef,KACpB,MAAMD,EAAA;AAAA,EACR,GAAG,CAACgB,GAAaf,GAAYD,CAAQ,CAAC,GAEhCkB,IAAaJ,EAAY,YAAY;AACzC,UAAM,UAAU,UAAU,UAAUf,CAAY,GAChDY,EAAU,EAAI,GACd,WAAW,MAAMA,EAAU,EAAK,GAAG,IAAI;AAAA,EACzC,GAAG,CAACZ,CAAY,CAAC;AAEjB,SACE,gBAAAoB,EAACC,GAAA,EAAW,MAAAxB,GAAY,cAAAC,GACtB,UAAA,gBAAAwB,EAACC,GAAA,EAAO,MAAAlB,GAAY,WAAWmB,EAAG,OAAOjB,CAAS,GAChD,UAAA;AAAA,IAAA,gBAAAe,EAAC,OAAA,EAAI,WAAU,yEACb,UAAA;AAAA,MAAA,gBAAAA,EAACG,GAAA,EAAY,WAAU,yBAAwB,UAAA;AAAA,QAAA;AAAA,QACrCzB;AAAA,MAAA,GACV;AAAA,wBACC0B,GAAA,EACC,UAAA,gBAAAN;AAAA,QAACO;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,MAAK;AAAA,UACL,cAAW;AAAA,UACX,UAAUzB;AAAA,UAEV,UAAA,gBAAAkB,EAACQ,GAAA,EAAM,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA,EACnB,CACF;AAAA,IAAA,GACF;AAAA,IAEA,gBAAAN,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,uBACZ,UAAA;AAAA,QAAAhB,KACC,gBAAAc,EAACS,KAAO,MAAM,gBAAAT,EAACU,KAAkB,GAAI,SAAQ,SAC1C,UAAAxB,EAAA,CACH;AAAA,QAEF,gBAAAgB,EAAC,KAAA,EAAE,WAAU,sDAAqD,UAAA;AAAA,UAAA;AAAA,UACD;AAAA,UAC/D,gBAAAF,EAAC,QAAA,EAAK,WAAU,iCACb,UAAApB,GACH;AAAA,UAAQ;AAAA,UACPD,EAAa,YAAA;AAAA,UAAc;AAAA,QAAA,EAAA,CAC9B;AAAA,MAAA,GACF;AAAA,MAEA,gBAAAuB,EAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,QAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,uCACb,UAAA,gBAAAE,EAAC,QAAA,EAAK,UAAA;AAAA,UAAA;AAAA,UACC;AAAA,UACL,gBAAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,SAASH;AAAA,cACT,cAAY,QAAQnB,CAAY;AAAA,cAE/B,UAAA;AAAA,gBAAAA;AAAA,gBAEAW,IACC,gBAAAS;AAAA,kBAACW;AAAA,kBAAA;AAAA,oBACC,MAAM;AAAA,oBACN,QAAO;AAAA,oBACP,WAAU;AAAA,kBAAA;AAAA,gBAAA,IAGZ,gBAAAX;AAAA,kBAACY;AAAA,kBAAA;AAAA,oBACC,MAAM;AAAA,oBACN,QAAO;AAAA,oBACP,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACZ;AAAA,YAAA;AAAA,UAAA;AAAA,UAEM;AAAA,UAAI;AAAA,QAAA,EAAA,CAEhB,EAAA,CACF;AAAA,QACA,gBAAAZ;AAAA,UAACa;AAAA,UAAA;AAAA,YACC,aAAajC;AAAA,YACb,OAAOQ;AAAA,YACP,UAAU,CAAC0B,MAAMzB,EAAqByB,EAAE,OAAO,KAAK;AAAA,YACpD,UAAUhC;AAAA,YACV,cAAa;AAAA,YACb,aAAY;AAAA,YACZ,gBAAe;AAAA,YACf,YAAY;AAAA,YACZ,cAAY,QAAQF,CAAY;AAAA,YAChC,WAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACZ,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAEA,gBAAAsB,EAAC,OAAA,EAAI,WAAU,8DACb,UAAA;AAAA,MAAA,gBAAAF,EAACM,GAAA,EACC,4BAACC,GAAA,EAAO,SAAQ,aAAY,UAAUzB,GAAY,oBAElD,EAAA,CACF;AAAA,MACA,gBAAAkB;AAAA,QAACO;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAST;AAAA,UACT,UAAU,CAACD,KAAef;AAAA,UAC1B,SAASA;AAAA,UAER,UAAAE,KAAoB,UAAUL,CAAY;AAAA,QAAA;AAAA,MAAA;AAAA,IAC7C,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;AAEAH,EAAe,cAAc;"}

package/dist/input-D6YgDfDG.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-D6YgDfDG.js","sources":["../src/components/input/input.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn\";\nimport {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\n\nexport const KUMO_INPUT_VARIANTS = {\n  size: {\n    xs: {\n      classes: \"h-5 gap-1 rounded-sm px-1.5 text-xs\",\n      description: \"Extra small input for compact UIs\",\n    },\n    sm: {\n      classes: \"h-6.5 gap-1 rounded-md px-2 text-xs\",\n      description: \"Small input for secondary fields\",\n    },\n    base: {\n      classes: \"h-9 gap-1.5 rounded-lg px-3 text-base\",\n      description: \"Default input size\",\n    },\n    lg: {\n      classes: \"h-10 gap-2 rounded-lg px-4 text-base\",\n      description: \"Large input for prominent fields\",\n    },\n  },\n  variant: {\n    default: {\n      classes: \"focus:ring-kumo-ring\",\n      description: \"Default input appearance\",\n    },\n    error: {\n      classes: \"!ring-kumo-danger focus:ring-kumo-danger\",\n      description: \"Error state for validation failures\",\n    },\n  },\n} as const;\n\nexport const KUMO_INPUT_DEFAULT_VARIANTS = {\n  size: \"base\",\n  variant: \"default\",\n} as const;\n\nexport const KUMO_INPUT_STYLING = {\n  dimensions: {\n    xs: { height: 20, paddingX: 6, fontSize: 12, borderRadius: 2, width: 160 },\n    sm: { height: 26, paddingX: 8, fontSize: 12, borderRadius: 6, width: 200 },\n    base: {\n      height: 36,\n      paddingX: 12,\n      fontSize: 16,\n      borderRadius: 8,\n      width: 280,\n    },\n    lg: { height: 40, paddingX: 16, fontSize: 16, borderRadius: 8, width: 320 },\n  },\n  baseTokens: {\n    background: \"color-secondary\",\n    text: \"text-color-surface\",\n    placeholder: \"text-color-muted\",\n    ring: \"color-border\",\n  },\n  stateTokens: {\n    focus: { ring: \"color-active\" },\n    error: { ring: \"color-error\" },\n    disabled: { opacity: 0.5, text: \"text-color-muted\" },\n  },\n} as const;\n\n// Derived types from KUMO_INPUT_VARIANTS\nexport type KumoInputSize = keyof typeof KUMO_INPUT_VARIANTS.size;\nexport type KumoInputVariant = keyof typeof KUMO_INPUT_VARIANTS.variant;\n\nexport interface KumoInputVariantsProps {\n  size?: KumoInputSize;\n  variant?: KumoInputVariant;\n  parentFocusIndicator?: boolean;\n  focusIndicator?: boolean;\n}\n\n// Omit native `size` attribute (number) to avoid conflict with our custom `size` variant\ntype BaseInputProps = Omit<ComponentPropsWithoutRef<typeof BaseInput>, \"size\">;\n\nexport function inputVariants({\n  variant = KUMO_INPUT_DEFAULT_VARIANTS.variant,\n  size = KUMO_INPUT_DEFAULT_VARIANTS.size,\n  parentFocusIndicator = false,\n  focusIndicator = false,\n}: KumoInputVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"border-0 bg-kumo-control text-kumo-default ring ring-kumo-line\",\n    // Disabled state and placeholder styles\n    \"outline-none placeholder:text-kumo-subtle disabled:text-kumo-subtle\",\n    // Apply size styles from KUMO_INPUT_VARIANTS\n    KUMO_INPUT_VARIANTS.size[size].classes,\n    // Apply variant styles from KUMO_INPUT_VARIANTS\n    KUMO_INPUT_VARIANTS.variant[variant].classes,\n    // Focus state handling\n    parentFocusIndicator && \"[&:has(:focus-within)]:ring-kumo-ring\",\n    focusIndicator && \"focus:ring-kumo-ring\",\n  );\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {\n  const {\n    className,\n    size = \"base\",\n    variant = \"default\",\n    label,\n    labelTooltip,\n    description,\n    error,\n    ...inputProps\n  } = props;\n\n  // Extract required from inputProps to pass to Field for label decoration\n  const { required } = inputProps;\n\n  // A11y enforcement: warn in dev if no accessible name provided\n  if (process.env.NODE_ENV !== \"production\") {\n    const hasLabel = Boolean(label);\n    const hasPlaceholderAndAriaLabel = Boolean(\n      inputProps.placeholder && inputProps[\"aria-label\"],\n    );\n    const hasAriaLabelledBy = Boolean(inputProps[\"aria-labelledby\"]);\n\n    if (!hasLabel && !hasPlaceholderAndAriaLabel && !hasAriaLabelledBy) {\n      console.warn(\n        \"[Kumo Input]: Input must have an accessible name. Provide either:\\n\" +\n          \"  - label prop: <Input label='Email' />\\n\" +\n          \"  - placeholder + aria-label: <Input placeholder='Email' aria-label='Email address' />\\n\" +\n          \"  - aria-labelledby for custom label association\",\n      );\n    }\n  }\n\n  const input = (\n    <BaseInput\n      ref={ref}\n      className={cn(\n        inputVariants({ size, variant, focusIndicator: true }),\n        className,\n      )}\n      {...inputProps}\n    />\n  );\n\n  // Render with Field wrapper if label is provided\n  if (label) {\n    return (\n      <Field\n        label={label}\n        required={required}\n        labelTooltip={labelTooltip}\n        description={description}\n        error={\n          error\n            ? typeof error === \"string\"\n              ? { message: error, match: true }\n              : error\n            : undefined\n        }\n      >\n        {input}\n      </Field>\n    );\n  }\n\n  // Render bare input without Field wrapper\n  return input;\n});\n\nInput.displayName = \"Input\";\n\n/**\n * Input component props with accessibility guidance.\n *\n * **Accessible Name Required:** Input should have one of:\n * 1. `label` prop (recommended) - enables Field wrapper with label/description/error\n * 2. `placeholder` + `aria-label` - for bare inputs with visual placeholder\n * 3. `aria-labelledby` - for custom label association\n *\n * Missing accessible names will trigger console warnings in development.\n *\n * @example\n * // Recommended: Built-in Field wrapper\n * <Input label=\"Email\" placeholder=\"you@example.com\" />\n *\n * @example\n * // Bare input with placeholder and aria-label\n * <Input placeholder=\"Search...\" aria-label=\"Search products\" />\n *\n * @example\n * // Custom label association\n * <label id=\"email-label\">Email</label>\n * <Input aria-labelledby=\"email-label\" />\n *\n * @example\n * // With description and error\n * <Input\n *   label=\"Password\"\n *   description=\"Must be at least 8 characters\"\n *   error=\"Password is too short\"\n *   variant=\"error\"\n * />\n */\nexport type InputProps = Pick<KumoInputVariantsProps, \"size\" | \"variant\"> &\n  BaseInputProps & {\n    /** Label content for the input (enables Field wrapper) - can be a string or any React node */\n    label?: ReactNode;\n    /** Tooltip content to display next to the label via an info icon */\n    labelTooltip?: ReactNode;\n    /** Helper text displayed below the input */\n    description?: ReactNode;\n    /** Error message or validation error object */\n    error?: string | { message: ReactNode; match: FieldErrorMatch };\n  };\n"],"names":["KUMO_INPUT_VARIANTS","KUMO_INPUT_DEFAULT_VARIANTS","inputVariants","variant","size","parentFocusIndicator","focusIndicator","cn","Input","forwardRef","props","ref","className","label","labelTooltip","description","error","inputProps","required","hasLabel","hasPlaceholderAndAriaLabel","hasAriaLabelledBy","input","jsx","BaseInput","Field"],"mappings":";;;;;;AASO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,SAAS;AAAA,IACP,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AAAA,EACN,SAAS;AACX;AA0CO,SAASC,EAAc;AAAA,EAC5B,SAAAC,IAAUF,EAA4B;AAAA,EACtC,MAAAG,IAAOH,EAA4B;AAAA,EACnC,sBAAAI,IAAuB;AAAA,EACvB,gBAAAC,IAAiB;AACnB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA,IAEA;AAAA;AAAA,IAEAP,EAAoB,KAAKI,CAAI,EAAE;AAAA;AAAA,IAE/BJ,EAAoB,QAAQG,CAAO,EAAE;AAAA;AAAA,IAErCE,KAAwB;AAAA,IACxBC,KAAkB;AAAA,EAAA;AAEtB;AAEO,MAAME,IAAQC,EAAyC,CAACC,GAAOC,MAAQ;AAC5E,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,MAAAR,IAAO;AAAA,IACP,SAAAD,IAAU;AAAA,IACV,OAAAU;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GAGE,EAAE,UAAAQ,MAAaD;AAGrB,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,UAAME,IAAW,EAAQN,GACnBO,IAA6B,GACjCH,EAAW,eAAeA,EAAW,YAAY,IAE7CI,IAAoB,EAAQJ,EAAW,iBAAiB;AAE9D,IAAI,CAACE,KAAY,CAACC,KAA8B,CAACC,KAC/C,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAMN;AAEA,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWJ;AAAA,QACTL,EAAc,EAAE,MAAAE,GAAM,SAAAD,GAAS,gBAAgB,IAAM;AAAA,QACrDS;AAAA,MAAA;AAAA,MAED,GAAGK;AAAA,IAAA;AAAA,EAAA;AAKR,SAAIJ,IAEA,gBAAAU;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,OAAAZ;AAAA,MACA,UAAAK;AAAA,MACA,cAAAJ;AAAA,MACA,aAAAC;AAAA,MACA,OACEC,IACI,OAAOA,KAAU,WACf,EAAE,SAASA,GAAO,OAAO,GAAA,IACzBA,IACF;AAAA,MAGL,UAAAM;AAAA,IAAA;AAAA,EAAA,IAMAA;AACT,CAAC;AAEDd,EAAM,cAAc;"}
+{"version":3,"file":"input-D6YgDfDG.js","sources":["../src/components/input/input.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn\";\nimport {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\n\n/** Input size and variant definitions mapping names to their Tailwind classes. */\nexport const KUMO_INPUT_VARIANTS = {\n  size: {\n    xs: {\n      classes: \"h-5 gap-1 rounded-sm px-1.5 text-xs\",\n      description: \"Extra small input for compact UIs\",\n    },\n    sm: {\n      classes: \"h-6.5 gap-1 rounded-md px-2 text-xs\",\n      description: \"Small input for secondary fields\",\n    },\n    base: {\n      classes: \"h-9 gap-1.5 rounded-lg px-3 text-base\",\n      description: \"Default input size\",\n    },\n    lg: {\n      classes: \"h-10 gap-2 rounded-lg px-4 text-base\",\n      description: \"Large input for prominent fields\",\n    },\n  },\n  variant: {\n    default: {\n      classes: \"focus:ring-kumo-ring\",\n      description: \"Default input appearance\",\n    },\n    error: {\n      classes: \"!ring-kumo-danger focus:ring-kumo-danger\",\n      description: \"Error state for validation failures\",\n    },\n  },\n} as const;\n\nexport const KUMO_INPUT_DEFAULT_VARIANTS = {\n  size: \"base\",\n  variant: \"default\",\n} as const;\n\nexport const KUMO_INPUT_STYLING = {\n  dimensions: {\n    xs: { height: 20, paddingX: 6, fontSize: 12, borderRadius: 2, width: 160 },\n    sm: { height: 26, paddingX: 8, fontSize: 12, borderRadius: 6, width: 200 },\n    base: {\n      height: 36,\n      paddingX: 12,\n      fontSize: 16,\n      borderRadius: 8,\n      width: 280,\n    },\n    lg: { height: 40, paddingX: 16, fontSize: 16, borderRadius: 8, width: 320 },\n  },\n  baseTokens: {\n    background: \"color-secondary\",\n    text: \"text-color-surface\",\n    placeholder: \"text-color-muted\",\n    ring: \"color-border\",\n  },\n  stateTokens: {\n    focus: { ring: \"color-active\" },\n    error: { ring: \"color-error\" },\n    disabled: { opacity: 0.5, text: \"text-color-muted\" },\n  },\n} as const;\n\n// Derived types from KUMO_INPUT_VARIANTS\nexport type KumoInputSize = keyof typeof KUMO_INPUT_VARIANTS.size;\nexport type KumoInputVariant = keyof typeof KUMO_INPUT_VARIANTS.variant;\n\nexport interface KumoInputVariantsProps {\n  /**\n   * Input size.\n   * - `\"xs\"` — Extra small for compact UIs\n   * - `\"sm\"` — Small for secondary fields\n   * - `\"base\"` — Default size\n   * - `\"lg\"` — Large for prominent fields\n   * @default \"base\"\n   */\n  size?: KumoInputSize;\n  /**\n   * Visual variant.\n   * - `\"default\"` — Standard input\n   * - `\"error\"` — Error state for validation failures\n   * @default \"default\"\n   */\n  variant?: KumoInputVariant;\n  parentFocusIndicator?: boolean;\n  focusIndicator?: boolean;\n}\n\n// Omit native `size` attribute (number) to avoid conflict with our custom `size` variant\ntype BaseInputProps = Omit<ComponentPropsWithoutRef<typeof BaseInput>, \"size\">;\n\nexport function inputVariants({\n  variant = KUMO_INPUT_DEFAULT_VARIANTS.variant,\n  size = KUMO_INPUT_DEFAULT_VARIANTS.size,\n  parentFocusIndicator = false,\n  focusIndicator = false,\n}: KumoInputVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"border-0 bg-kumo-control text-kumo-default ring ring-kumo-line\",\n    // Disabled state and placeholder styles\n    \"outline-none placeholder:text-kumo-subtle disabled:text-kumo-subtle\",\n    // Apply size styles from KUMO_INPUT_VARIANTS\n    KUMO_INPUT_VARIANTS.size[size].classes,\n    // Apply variant styles from KUMO_INPUT_VARIANTS\n    KUMO_INPUT_VARIANTS.variant[variant].classes,\n    // Focus state handling\n    parentFocusIndicator && \"[&:has(:focus-within)]:ring-kumo-ring\",\n    focusIndicator && \"focus:ring-kumo-ring\",\n  );\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {\n  const {\n    className,\n    size = \"base\",\n    variant = \"default\",\n    label,\n    labelTooltip,\n    description,\n    error,\n    ...inputProps\n  } = props;\n\n  // Extract required from inputProps to pass to Field for label decoration\n  const { required } = inputProps;\n\n  // A11y enforcement: warn in dev if no accessible name provided\n  if (process.env.NODE_ENV !== \"production\") {\n    const hasLabel = Boolean(label);\n    const hasPlaceholderAndAriaLabel = Boolean(\n      inputProps.placeholder && inputProps[\"aria-label\"],\n    );\n    const hasAriaLabelledBy = Boolean(inputProps[\"aria-labelledby\"]);\n\n    if (!hasLabel && !hasPlaceholderAndAriaLabel && !hasAriaLabelledBy) {\n      console.warn(\n        \"[Kumo Input]: Input must have an accessible name. Provide either:\\n\" +\n          \"  - label prop: <Input label='Email' />\\n\" +\n          \"  - placeholder + aria-label: <Input placeholder='Email' aria-label='Email address' />\\n\" +\n          \"  - aria-labelledby for custom label association\",\n      );\n    }\n  }\n\n  const input = (\n    <BaseInput\n      ref={ref}\n      className={cn(\n        inputVariants({ size, variant, focusIndicator: true }),\n        className,\n      )}\n      {...inputProps}\n    />\n  );\n\n  // Render with Field wrapper if label is provided\n  if (label) {\n    return (\n      <Field\n        label={label}\n        required={required}\n        labelTooltip={labelTooltip}\n        description={description}\n        error={\n          error\n            ? typeof error === \"string\"\n              ? { message: error, match: true }\n              : error\n            : undefined\n        }\n      >\n        {input}\n      </Field>\n    );\n  }\n\n  // Render bare input without Field wrapper\n  return input;\n});\n\nInput.displayName = \"Input\";\n\n/**\n * Input component props with accessibility guidance.\n *\n * **Accessible Name Required:** Input should have one of:\n * 1. `label` prop (recommended) - enables Field wrapper with label/description/error\n * 2. `placeholder` + `aria-label` - for bare inputs with visual placeholder\n * 3. `aria-labelledby` - for custom label association\n *\n * Missing accessible names will trigger console warnings in development.\n *\n * @example\n * // Recommended: Built-in Field wrapper\n * <Input label=\"Email\" placeholder=\"you@example.com\" />\n *\n * @example\n * // Bare input with placeholder and aria-label\n * <Input placeholder=\"Search...\" aria-label=\"Search products\" />\n *\n * @example\n * // Custom label association\n * <label id=\"email-label\">Email</label>\n * <Input aria-labelledby=\"email-label\" />\n *\n * @example\n * // With description and error\n * <Input\n *   label=\"Password\"\n *   description=\"Must be at least 8 characters\"\n *   error=\"Password is too short\"\n *   variant=\"error\"\n * />\n */\nexport type InputProps = Pick<KumoInputVariantsProps, \"size\" | \"variant\"> &\n  BaseInputProps & {\n    /** Label content for the input (enables Field wrapper) - can be a string or any React node */\n    label?: ReactNode;\n    /** Tooltip content to display next to the label via an info icon */\n    labelTooltip?: ReactNode;\n    /** Helper text displayed below the input */\n    description?: ReactNode;\n    /** Error message or validation error object */\n    error?: string | { message: ReactNode; match: FieldErrorMatch };\n  };\n"],"names":["KUMO_INPUT_VARIANTS","KUMO_INPUT_DEFAULT_VARIANTS","inputVariants","variant","size","parentFocusIndicator","focusIndicator","cn","Input","forwardRef","props","ref","className","label","labelTooltip","description","error","inputProps","required","hasLabel","hasPlaceholderAndAriaLabel","hasAriaLabelledBy","input","jsx","BaseInput","Field"],"mappings":";;;;;;AAUO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,SAAS;AAAA,IACP,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AAAA,EACN,SAAS;AACX;AAwDO,SAASC,EAAc;AAAA,EAC5B,SAAAC,IAAUF,EAA4B;AAAA,EACtC,MAAAG,IAAOH,EAA4B;AAAA,EACnC,sBAAAI,IAAuB;AAAA,EACvB,gBAAAC,IAAiB;AACnB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA,IAEA;AAAA;AAAA,IAEAP,EAAoB,KAAKI,CAAI,EAAE;AAAA;AAAA,IAE/BJ,EAAoB,QAAQG,CAAO,EAAE;AAAA;AAAA,IAErCE,KAAwB;AAAA,IACxBC,KAAkB;AAAA,EAAA;AAEtB;AAEO,MAAME,IAAQC,EAAyC,CAACC,GAAOC,MAAQ;AAC5E,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,MAAAR,IAAO;AAAA,IACP,SAAAD,IAAU;AAAA,IACV,OAAAU;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GAGE,EAAE,UAAAQ,MAAaD;AAGrB,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,UAAME,IAAW,EAAQN,GACnBO,IAA6B,GACjCH,EAAW,eAAeA,EAAW,YAAY,IAE7CI,IAAoB,EAAQJ,EAAW,iBAAiB;AAE9D,IAAI,CAACE,KAAY,CAACC,KAA8B,CAACC,KAC/C,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAMN;AAEA,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWJ;AAAA,QACTL,EAAc,EAAE,MAAAE,GAAM,SAAAD,GAAS,gBAAgB,IAAM;AAAA,QACrDS;AAAA,MAAA;AAAA,MAED,GAAGK;AAAA,IAAA;AAAA,EAAA;AAKR,SAAIJ,IAEA,gBAAAU;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,OAAAZ;AAAA,MACA,UAAAK;AAAA,MACA,cAAAJ;AAAA,MACA,aAAAC;AAAA,MACA,OACEC,IACI,OAAOA,KAAU,WACf,EAAE,SAASA,GAAO,OAAO,GAAA,IACzBA,IACF;AAAA,MAGL,UAAAM;AAAA,IAAA;AAAA,EAAA,IAMAA;AACT,CAAC;AAEDd,EAAM,cAAc;"}

package/dist/label-B4FY8MX_.js.map

@@ -1 +1 @@
-{"version":3,"file":"label-B4FY8MX_.js","sources":["../src/components/label/label.tsx"],"sourcesContent":["import { Info } from \"@phosphor-icons/react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Tooltip } from \"../tooltip\";\n\nexport const KUMO_LABEL_VARIANTS = {\n  // Label currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LABEL_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LABEL_VARIANTS\nexport interface KumoLabelVariantsProps {}\n\nexport function labelVariants(_props: KumoLabelVariantsProps = {}) {\n  return cn(\n    // Base styles - when used standalone, apply text styling\n    // When used inside Field, the parent FieldBase.Label provides these styles\n    \"text-base font-medium text-kumo-default\",\n  );\n}\n\nexport function labelContentVariants() {\n  return cn(\n    // Content wrapper styles - always applied\n    \"inline-flex items-center gap-1\",\n  );\n}\n\nexport interface LabelProps extends KumoLabelVariantsProps {\n  /** The label content - can be a string or any React node */\n  children: ReactNode;\n  /** When true (and required is false), shows gray \"(optional)\" text after the label */\n  showOptional?: boolean;\n  /** Tooltip content to display next to the label via an info icon */\n  tooltip?: ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n  /**\n   * When true, only renders the inline content (indicators, tooltip) without\n   * the outer span with font styling. Useful when composed inside another\n   * label element that already provides the text styling.\n   * @default false\n   */\n  asContent?: boolean;\n}\n\n/**\n * Label component for form fields.\n *\n * Provides a standardized way to display labels with optional indicators:\n * - Optional indicator: gray \"(optional)\" text when `showOptional={true}`\n * - Tooltip: info icon with hover tooltip for additional context\n *\n * @example\n * // Basic label\n * <Label>Email</Label>\n *\n * @example\n * // Optional field with indicator\n * <Label showOptional>Middle Name</Label>\n *\n * @example\n * // With tooltip\n * <Label tooltip=\"We'll use this to send you updates\">Email</Label>\n *\n * @example\n * // With ReactNode children\n * <Label>\n *   <span>Custom label with <strong>bold</strong> text</span>\n * </Label>\n */\nexport function Label({\n  children,\n  showOptional = false,\n  tooltip,\n  className,\n  asContent = false,\n}: LabelProps) {\n  const content = (\n    <>\n      {children}\n      {showOptional && (\n        <span className=\"font-normal text-kumo-strong\">(optional)</span>\n      )}\n      {tooltip && (\n        <Tooltip content={tooltip}>\n          <Info\n            className=\"size-4 cursor-help text-kumo-strong\"\n            aria-label=\"More information\"\n          />\n        </Tooltip>\n      )}\n    </>\n  );\n\n  // When used as content inside another styled element, just render inline\n  if (asContent) {\n    return (\n      <span className={cn(labelContentVariants(), className)}>{content}</span>\n    );\n  }\n\n  // When used standalone, apply full label styling\n  return (\n    <span className={cn(labelVariants(), labelContentVariants(), className)}>\n      {content}\n    </span>\n  );\n}\n\nLabel.displayName = \"Label\";\n"],"names":["KUMO_LABEL_VARIANTS","KUMO_LABEL_DEFAULT_VARIANTS","labelVariants","_props","cn","labelContentVariants","Label","children","showOptional","tooltip","className","asContent","content","jsxs","Fragment","jsx","Tooltip","Info"],"mappings":";;;;;AAKO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAKpC,SAASC,EAAcC,IAAiC,IAAI;AACjE,SAAOC;AAAA;AAAA;AAAA,IAGL;AAAA,EAAA;AAEJ;AAEO,SAASC,IAAuB;AACrC,SAAOD;AAAA;AAAA,IAEL;AAAA,EAAA;AAEJ;AA6CO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AACb,QAAMC,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAP;AAAA,IACAC,KACC,gBAAAO,EAAC,QAAA,EAAK,WAAU,gCAA+B,UAAA,cAAU;AAAA,IAE1DN,KACC,gBAAAM,EAACC,GAAA,EAAQ,SAASP,GAChB,UAAA,gBAAAM;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,cAAW;AAAA,MAAA;AAAA,IAAA,EACb,CACF;AAAA,EAAA,GAEJ;AAIF,SAAIN,IAEA,gBAAAI,EAAC,UAAK,WAAWX,EAAGC,KAAwBK,CAAS,GAAI,UAAAE,GAAQ,IAMnE,gBAAAG,EAAC,QAAA,EAAK,WAAWX,EAAGF,KAAiBG,EAAA,GAAwBK,CAAS,GACnE,UAAAE,EAAA,CACH;AAEJ;AAEAN,EAAM,cAAc;"}
+{"version":3,"file":"label-B4FY8MX_.js","sources":["../src/components/label/label.tsx"],"sourcesContent":["import { Info } from \"@phosphor-icons/react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Tooltip } from \"../tooltip\";\n\n/** Label variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_LABEL_VARIANTS = {\n  // Label currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LABEL_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LABEL_VARIANTS\nexport interface KumoLabelVariantsProps {}\n\nexport function labelVariants(_props: KumoLabelVariantsProps = {}) {\n  return cn(\n    // Base styles - when used standalone, apply text styling\n    // When used inside Field, the parent FieldBase.Label provides these styles\n    \"text-base font-medium text-kumo-default\",\n  );\n}\n\nexport function labelContentVariants() {\n  return cn(\n    // Content wrapper styles - always applied\n    \"inline-flex items-center gap-1\",\n  );\n}\n\n/**\n * Label component props.\n *\n * @example\n * ```tsx\n * <Label>Email</Label>\n * <Label showOptional>Middle Name</Label>\n * <Label tooltip=\"We'll use this to send you updates\">Email</Label>\n * ```\n */\nexport interface LabelProps extends KumoLabelVariantsProps {\n  /** The label content — can be a string or any React node. */\n  children: ReactNode;\n  /** When `true`, shows gray \"(optional)\" text after the label. */\n  showOptional?: boolean;\n  /** Tooltip content displayed next to the label via an info icon. */\n  tooltip?: ReactNode;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /**\n   * When `true`, only renders the inline content (indicators, tooltip) without\n   * the outer span with font styling. Useful when composed inside another\n   * label element that already provides the text styling.\n   * @default false\n   */\n  asContent?: boolean;\n}\n\n/**\n * Label component for form fields.\n *\n * Provides a standardized way to display labels with optional indicators:\n * - Optional indicator: gray \"(optional)\" text when `showOptional={true}`\n * - Tooltip: info icon with hover tooltip for additional context\n *\n * @example\n * // Basic label\n * <Label>Email</Label>\n *\n * @example\n * // Optional field with indicator\n * <Label showOptional>Middle Name</Label>\n *\n * @example\n * // With tooltip\n * <Label tooltip=\"We'll use this to send you updates\">Email</Label>\n *\n * @example\n * // With ReactNode children\n * <Label>\n *   <span>Custom label with <strong>bold</strong> text</span>\n * </Label>\n */\nexport function Label({\n  children,\n  showOptional = false,\n  tooltip,\n  className,\n  asContent = false,\n}: LabelProps) {\n  const content = (\n    <>\n      {children}\n      {showOptional && (\n        <span className=\"font-normal text-kumo-strong\">(optional)</span>\n      )}\n      {tooltip && (\n        <Tooltip content={tooltip}>\n          <Info\n            className=\"size-4 cursor-help text-kumo-strong\"\n            aria-label=\"More information\"\n          />\n        </Tooltip>\n      )}\n    </>\n  );\n\n  // When used as content inside another styled element, just render inline\n  if (asContent) {\n    return (\n      <span className={cn(labelContentVariants(), className)}>{content}</span>\n    );\n  }\n\n  // When used standalone, apply full label styling\n  return (\n    <span className={cn(labelVariants(), labelContentVariants(), className)}>\n      {content}\n    </span>\n  );\n}\n\nLabel.displayName = \"Label\";\n"],"names":["KUMO_LABEL_VARIANTS","KUMO_LABEL_DEFAULT_VARIANTS","labelVariants","_props","cn","labelContentVariants","Label","children","showOptional","tooltip","className","asContent","content","jsxs","Fragment","jsx","Tooltip","Info"],"mappings":";;;;;AAMO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAKpC,SAASC,EAAcC,IAAiC,IAAI;AACjE,SAAOC;AAAA;AAAA;AAAA,IAGL;AAAA,EAAA;AAEJ;AAEO,SAASC,IAAuB;AACrC,SAAOD;AAAA;AAAA,IAEL;AAAA,EAAA;AAEJ;AAuDO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AACb,QAAMC,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAP;AAAA,IACAC,KACC,gBAAAO,EAAC,QAAA,EAAK,WAAU,gCAA+B,UAAA,cAAU;AAAA,IAE1DN,KACC,gBAAAM,EAACC,GAAA,EAAQ,SAASP,GAChB,UAAA,gBAAAM;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,cAAW;AAAA,MAAA;AAAA,IAAA,EACb,CACF;AAAA,EAAA,GAEJ;AAIF,SAAIN,IAEA,gBAAAI,EAAC,UAAK,WAAWX,EAAGC,KAAwBK,CAAS,GAAI,UAAAE,GAAQ,IAMnE,gBAAAG,EAAC,QAAA,EAAK,WAAWX,EAAGF,KAAiBG,EAAA,GAAwBK,CAAS,GACnE,UAAAE,EAAA,CACH;AAEJ;AAEAN,EAAM,cAAc;"}

package/dist/layer-card-C8j5Hkkj.js.map

@@ -1 +1 @@
-{"version":3,"file":"layer-card-C8j5Hkkj.js","sources":["../src/components/layer-card/layer-card.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nexport const KUMO_LAYER_CARD_VARIANTS = {\n  // LayerCard currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LAYER_CARD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LAYER_CARD_VARIANTS\nexport interface KumoLayerCardVariantsProps {}\n\nexport function layerCardVariants(_props: KumoLayerCardVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex w-full flex-col overflow-hidden rounded-lg bg-kumo-elevated text-base ring ring-kumo-line\",\n  );\n}\n\nexport type LayerCardProps = PropsWithChildren<\n  KumoLayerCardVariantsProps & { className?: string }\n>;\n\nfunction LayerCardRoot({ children, className }: LayerCardProps) {\n  return <div className={cn(layerCardVariants(), className)}>{children}</div>;\n}\n\nfunction LayerCardSecondary({ children, className }: LayerCardProps) {\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-2 p-2 text-base font-medium text-kumo-strong\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction LayerCardPrimary({ children, className }: LayerCardProps) {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col gap-2 overflow-hidden rounded-lg bg-kumo-base p-4 pr-3 text-inherit no-underline ring ring-kumo-fill\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\ntype LayerCardComponent = FC<LayerCardProps> & {\n  Primary: FC<LayerCardProps>;\n  Secondary: FC<LayerCardProps>;\n};\n\nconst LayerCard = Object.assign(LayerCardRoot, {\n  Primary: LayerCardPrimary,\n  Secondary: LayerCardSecondary,\n}) as LayerCardComponent;\n\nexport { LayerCard };\n"],"names":["layerCardVariants","_props","cn","LayerCardRoot","children","className","jsx","LayerCardSecondary","LayerCardPrimary","LayerCard"],"mappings":";;;AAYO,SAASA,EAAkBC,IAAqC,IAAI;AACzE,SAAOC;AAAA;AAAA,IAEL;AAAA,EAAA;AAEJ;AAMA,SAASC,EAAc,EAAE,UAAAC,GAAU,WAAAC,KAA6B;AAC9D,SAAO,gBAAAC,EAAC,SAAI,WAAWJ,EAAGF,KAAqBK,CAAS,GAAI,UAAAD,GAAS;AACvE;AAEA,SAASG,EAAmB,EAAE,UAAAH,GAAU,WAAAC,KAA6B;AACnE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWJ;AAAA,QACT;AAAA,QACAG;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,SAASI,EAAiB,EAAE,UAAAJ,GAAU,WAAAC,KAA6B;AACjE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWJ;AAAA,QACT;AAAA,QACAG;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AAOA,MAAMK,IAAY,OAAO,OAAON,GAAe;AAAA,EAC7C,SAASK;AAAA,EACT,WAAWD;AACb,CAAC;"}
+{"version":3,"file":"layer-card-C8j5Hkkj.js","sources":["../src/components/layer-card/layer-card.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** LayerCard variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_LAYER_CARD_VARIANTS = {\n  // LayerCard currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LAYER_CARD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LAYER_CARD_VARIANTS\nexport interface KumoLayerCardVariantsProps {}\n\nexport function layerCardVariants(_props: KumoLayerCardVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex w-full flex-col overflow-hidden rounded-lg bg-kumo-elevated text-base ring ring-kumo-line\",\n  );\n}\n\n/**\n * LayerCard component props.\n *\n * @example\n * ```tsx\n * <LayerCard>\n *   <LayerCard.Secondary>Next Steps</LayerCard.Secondary>\n *   <LayerCard.Primary>Get started with Kumo</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nexport type LayerCardProps = PropsWithChildren<\n  KumoLayerCardVariantsProps & {\n    /** Additional CSS classes merged via `cn()`. */\n    className?: string;\n  }\n>;\n\n/**\n * Elevated card with primary/secondary content layers for dashboard widgets.\n *\n * @example\n * ```tsx\n * <LayerCard>\n *   <LayerCard.Secondary>Getting Started</LayerCard.Secondary>\n *   <LayerCard.Primary>Quick start guide</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nfunction LayerCardRoot({ children, className }: LayerCardProps) {\n  return <div className={cn(layerCardVariants(), className)}>{children}</div>;\n}\n\nfunction LayerCardSecondary({ children, className }: LayerCardProps) {\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-2 p-2 text-base font-medium text-kumo-strong\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction LayerCardPrimary({ children, className }: LayerCardProps) {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col gap-2 overflow-hidden rounded-lg bg-kumo-base p-4 pr-3 text-inherit no-underline ring ring-kumo-fill\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\ntype LayerCardComponent = FC<LayerCardProps> & {\n  Primary: FC<LayerCardProps>;\n  Secondary: FC<LayerCardProps>;\n};\n\nconst LayerCard = Object.assign(LayerCardRoot, {\n  Primary: LayerCardPrimary,\n  Secondary: LayerCardSecondary,\n}) as LayerCardComponent;\n\nexport { LayerCard };\n"],"names":["layerCardVariants","_props","cn","LayerCardRoot","children","className","jsx","LayerCardSecondary","LayerCardPrimary","LayerCard"],"mappings":";;;AAaO,SAASA,EAAkBC,IAAqC,IAAI;AACzE,SAAOC;AAAA;AAAA,IAEL;AAAA,EAAA;AAEJ;AA+BA,SAASC,EAAc,EAAE,UAAAC,GAAU,WAAAC,KAA6B;AAC9D,SAAO,gBAAAC,EAAC,SAAI,WAAWJ,EAAGF,KAAqBK,CAAS,GAAI,UAAAD,GAAS;AACvE;AAEA,SAASG,EAAmB,EAAE,UAAAH,GAAU,WAAAC,KAA6B;AACnE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWJ;AAAA,QACT;AAAA,QACAG;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,SAASI,EAAiB,EAAE,UAAAJ,GAAU,WAAAC,KAA6B;AACjE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWJ;AAAA,QACT;AAAA,QACAG;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;AAOA,MAAMK,IAAY,OAAO,OAAON,GAAe;AAAA,EAC7C,SAASK;AAAA,EACT,WAAWD;AACb,CAAC;"}

package/dist/link-CcuZKqob.js.map

@@ -1 +1 @@
-{"version":3,"file":"link-CcuZKqob.js","sources":["../src/components/link/link.tsx"],"sourcesContent":["import { forwardRef, type SVGProps } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  useLinkComponent,\n  type LinkComponentProps,\n} from \"../../utils/link-provider\";\n\n/**\n * ExternalIcon - Visual indicator for links that open in a new tab/window.\n *\n * Use this as a child of Link to indicate external navigation:\n * ```tsx\n * <Link href=\"https://example.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Example <Link.ExternalIcon />\n * </Link>\n * ```\n */\nconst ExternalIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    className=\"link-external-icon\"\n    {...props}\n  >\n    <path d=\"M9 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V15\" />\n    <path d=\"M14 4H20M20 4V10M20 4L11 13\" />\n  </svg>\n);\n\nExternalIcon.displayName = \"Link.ExternalIcon\";\n\nexport const KUMO_LINK_VARIANTS = {\n  variant: {\n    inline: {\n      classes:\n        \"text-primary underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Inline text link that flows with content\",\n    },\n    current: {\n      classes:\n        \"text-current underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Link that inherits color from parent text\",\n    },\n    plain: {\n      classes: \"text-primary hover:text-primary/70 transition-colors\",\n      description: \"Link without underline decoration\",\n    },\n  },\n} as const;\n\nexport const KUMO_LINK_DEFAULT_VARIANTS = {\n  variant: \"inline\",\n} as const;\n\nexport type KumoLinkVariant = keyof typeof KUMO_LINK_VARIANTS.variant;\n\nexport interface KumoLinkVariantsProps {\n  variant?: KumoLinkVariant;\n}\n\nexport function linkVariants({\n  variant = KUMO_LINK_DEFAULT_VARIANTS.variant,\n}: KumoLinkVariantsProps = {}) {\n  return cn(KUMO_LINK_VARIANTS.variant[variant].classes);\n}\n\nexport type LinkProps = useRender.ComponentProps<\"a\"> &\n  LinkComponentProps &\n  KumoLinkVariantsProps;\n\n/**\n * Link component for consistent inline text links.\n *\n * Supports composition via `render` prop for framework-specific routing:\n * - Without render: renders via LinkProvider (default anchor or configured component)\n * - With render: merges props onto the provided element with proper ref/event handling\n *\n * @example Basic usage\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link with icon\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with React Router\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />} variant=\"inline\">\n *   Dashboard\n * </Link>\n * ```\n */\nconst LinkBase = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { className, variant = \"inline\", render, ...props },\n  ref,\n) {\n  const LinkComponent = useLinkComponent();\n\n  const defaultProps: useRender.ElementProps<\"a\"> = {\n    className: cn(\n      linkVariants({ variant }),\n      \"group/link inline-flex items-center gap-[0.1875em]\",\n    ),\n  };\n\n  const element = useRender({\n    render: render ?? <LinkComponent />,\n    ref,\n    props: mergeProps<\"a\">(defaultProps, props, { className }),\n  });\n\n  return element;\n});\n\nLinkBase.displayName = \"Link\";\n\n// Compound component with ExternalIcon subcomponent\nexport const Link = Object.assign(LinkBase, {\n  ExternalIcon,\n});\n"],"names":["ExternalIcon","props","jsxs","jsx","KUMO_LINK_VARIANTS","KUMO_LINK_DEFAULT_VARIANTS","linkVariants","variant","cn","LinkBase","forwardRef","className","render","ref","LinkComponent","useLinkComponent","defaultProps","useRender","mergeProps","Link"],"mappings":";;;;;;AAmBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,eAAc;AAAA,IACd,gBAAe;AAAA,IACf,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAA,EAAK,GAAE,kWAAA,CAAkW;AAAA,MAC1W,gBAAAA,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA8B;AAAA,IAAA;AAAA,EAAA;AACxC;AAGFH,EAAa,cAAc;AAEpB,MAAMI,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,QAAQ;AAAA,MACN,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,SAAS;AACX;AAQO,SAASC,EAAa;AAAA,EAC3B,SAAAC,IAAUF,EAA2B;AACvC,IAA2B,IAAI;AAC7B,SAAOG,EAAGJ,EAAmB,QAAQG,CAAO,EAAE,OAAO;AACvD;AAgCA,MAAME,IAAWC,EAAyC,SACxD,EAAE,WAAAC,GAAW,SAAAJ,IAAU,UAAU,QAAAK,GAAQ,GAAGX,EAAA,GAC5CY,GACA;AACA,QAAMC,IAAgBC,EAAA,GAEhBC,IAA4C;AAAA,IAChD,WAAWR;AAAA,MACTF,EAAa,EAAE,SAAAC,GAAS;AAAA,MACxB;AAAA,IAAA;AAAA,EACF;AASF,SANgBU,EAAU;AAAA,IACxB,QAAQL,KAAU,gBAAAT,EAACW,GAAA,CAAA,CAAc;AAAA,IACjC,KAAAD;AAAA,IACA,OAAOK,EAAgBF,GAAcf,GAAO,EAAE,WAAAU,GAAW;AAAA,EAAA,CAC1D;AAGH,CAAC;AAEDF,EAAS,cAAc;AAGhB,MAAMU,IAAO,OAAO,OAAOV,GAAU;AAAA,EAC1C,cAAAT;AACF,CAAC;"}
+{"version":3,"file":"link-CcuZKqob.js","sources":["../src/components/link/link.tsx"],"sourcesContent":["import { forwardRef, type SVGProps } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  useLinkComponent,\n  type LinkComponentProps,\n} from \"../../utils/link-provider\";\n\n/**\n * ExternalIcon - Visual indicator for links that open in a new tab/window.\n *\n * Use this as a child of Link to indicate external navigation:\n * ```tsx\n * <Link href=\"https://example.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Example <Link.ExternalIcon />\n * </Link>\n * ```\n */\nconst ExternalIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    className=\"link-external-icon\"\n    {...props}\n  >\n    <path d=\"M9 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V15\" />\n    <path d=\"M14 4H20M20 4V10M20 4L11 13\" />\n  </svg>\n);\n\nExternalIcon.displayName = \"Link.ExternalIcon\";\n\n/** Link variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_LINK_VARIANTS = {\n  variant: {\n    inline: {\n      classes:\n        \"text-primary underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Inline text link that flows with content\",\n    },\n    current: {\n      classes:\n        \"text-current underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Link that inherits color from parent text\",\n    },\n    plain: {\n      classes: \"text-primary hover:text-primary/70 transition-colors\",\n      description: \"Link without underline decoration\",\n    },\n  },\n} as const;\n\nexport const KUMO_LINK_DEFAULT_VARIANTS = {\n  variant: \"inline\",\n} as const;\n\nexport type KumoLinkVariant = keyof typeof KUMO_LINK_VARIANTS.variant;\n\nexport interface KumoLinkVariantsProps {\n  /**\n   * Visual style of the link.\n   * - `\"inline\"` — Inline text link that flows with content\n   * - `\"current\"` — Link that inherits color from parent text\n   * - `\"plain\"` — Link without underline decoration\n   * @default \"inline\"\n   */\n  variant?: KumoLinkVariant;\n}\n\nexport function linkVariants({\n  variant = KUMO_LINK_DEFAULT_VARIANTS.variant,\n}: KumoLinkVariantsProps = {}) {\n  return cn(KUMO_LINK_VARIANTS.variant[variant].classes);\n}\n\n/**\n * Link component props.\n *\n * @example\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * <Link render={<RouterLink to=\"/dashboard\" />}>Dashboard</Link>\n * ```\n */\nexport type LinkProps = useRender.ComponentProps<\"a\"> &\n  LinkComponentProps &\n  KumoLinkVariantsProps;\n\n/**\n * Link component for consistent inline text links.\n *\n * Supports composition via `render` prop for framework-specific routing:\n * - Without render: renders via LinkProvider (default anchor or configured component)\n * - With render: merges props onto the provided element with proper ref/event handling\n *\n * @example Basic usage\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link with icon\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with React Router\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />} variant=\"inline\">\n *   Dashboard\n * </Link>\n * ```\n */\nconst LinkBase = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { className, variant = \"inline\", render, ...props },\n  ref,\n) {\n  const LinkComponent = useLinkComponent();\n\n  const defaultProps: useRender.ElementProps<\"a\"> = {\n    className: cn(\n      linkVariants({ variant }),\n      \"group/link inline-flex items-center gap-[0.1875em]\",\n    ),\n  };\n\n  const element = useRender({\n    render: render ?? <LinkComponent />,\n    ref,\n    props: mergeProps<\"a\">(defaultProps, props, { className }),\n  });\n\n  return element;\n});\n\nLinkBase.displayName = \"Link\";\n\n// Compound component with ExternalIcon subcomponent\nexport const Link = Object.assign(LinkBase, {\n  ExternalIcon,\n});\n"],"names":["ExternalIcon","props","jsxs","jsx","KUMO_LINK_VARIANTS","KUMO_LINK_DEFAULT_VARIANTS","linkVariants","variant","cn","LinkBase","forwardRef","className","render","ref","LinkComponent","useLinkComponent","defaultProps","useRender","mergeProps","Link"],"mappings":";;;;;;AAmBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,eAAc;AAAA,IACd,gBAAe;AAAA,IACf,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAA,EAAK,GAAE,kWAAA,CAAkW;AAAA,MAC1W,gBAAAA,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA8B;AAAA,IAAA;AAAA,EAAA;AACxC;AAGFH,EAAa,cAAc;AAGpB,MAAMI,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,QAAQ;AAAA,MACN,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,SAAS;AACX;AAeO,SAASC,EAAa;AAAA,EAC3B,SAAAC,IAAUF,EAA2B;AACvC,IAA2B,IAAI;AAC7B,SAAOG,EAAGJ,EAAmB,QAAQG,CAAO,EAAE,OAAO;AACvD;AA4CA,MAAME,IAAWC,EAAyC,SACxD,EAAE,WAAAC,GAAW,SAAAJ,IAAU,UAAU,QAAAK,GAAQ,GAAGX,EAAA,GAC5CY,GACA;AACA,QAAMC,IAAgBC,EAAA,GAEhBC,IAA4C;AAAA,IAChD,WAAWR;AAAA,MACTF,EAAa,EAAE,SAAAC,GAAS;AAAA,MACxB;AAAA,IAAA;AAAA,EACF;AASF,SANgBU,EAAU;AAAA,IACxB,QAAQL,KAAU,gBAAAT,EAACW,GAAA,CAAA,CAAc;AAAA,IACjC,KAAAD;AAAA,IACA,OAAOK,EAAgBF,GAAcf,GAAO,EAAE,WAAAU,GAAW;AAAA,EAAA,CAC1D;AAGH,CAAC;AAEDF,EAAS,cAAc;AAGhB,MAAMU,IAAO,OAAO,OAAOV,GAAU;AAAA,EAC1C,cAAAT;AACF,CAAC;"}

package/dist/loader-DHGMYlC6.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader-DHGMYlC6.js","sources":["../src/components/loader/loader.tsx"],"sourcesContent":["export const KUMO_LOADER_VARIANTS = {\n  size: {\n    sm: {\n      value: 16,\n      description: \"Small loader for inline use\",\n    },\n    base: {\n      value: 24,\n      description: \"Default loader size\",\n    },\n    lg: {\n      value: 32,\n      description: \"Large loader for prominent loading states\",\n    },\n  },\n} as const;\n\nexport const KUMO_LOADER_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\n// Derived types from KUMO_LOADER_VARIANTS\nexport type KumoLoaderSize = keyof typeof KUMO_LOADER_VARIANTS.size;\n\nexport interface KumoLoaderVariantsProps {\n  size?: KumoLoaderSize | number;\n}\n\nexport function loaderVariants({\n  size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n}: KumoLoaderVariantsProps = {}): number {\n  if (typeof size === \"number\") return size;\n  return KUMO_LOADER_VARIANTS.size[size].value;\n}\n\nexport interface LoaderProps {\n  className?: string;\n  size?: KumoLoaderSize | number;\n}\n\nexport const Loader = ({\n  className,\n  size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n}: LoaderProps) => {\n  const sizeValue = loaderVariants({ size });\n  return (\n    <svg\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      className={className}\n      style={{ height: sizeValue, width: sizeValue }}\n    >\n      <circle\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9.5\"\n        fill=\"none\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      >\n        <animateTransform\n          attributeName=\"transform\"\n          type=\"rotate\"\n          from=\"0 12 12\"\n          to=\"360 12 12\"\n          dur=\"2s\"\n          repeatCount=\"indefinite\"\n        />\n        <animate\n          attributeName=\"stroke-dasharray\"\n          values=\"0 150;42 150;42 150\"\n          keyTimes=\"0;0.5;1\"\n          dur=\"1.5s\"\n          repeatCount=\"indefinite\"\n        />\n        <animate\n          attributeName=\"stroke-dashoffset\"\n          values=\"0;-16;-59\"\n          keyTimes=\"0;0.5;1\"\n          dur=\"1.5s\"\n          repeatCount=\"indefinite\"\n        />\n      </circle>\n      <circle\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9.5\"\n        fill=\"none\"\n        opacity={0.1}\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  );\n};\n"],"names":["KUMO_LOADER_VARIANTS","KUMO_LOADER_DEFAULT_VARIANTS","loaderVariants","size","Loader","className","sizeValue","jsxs","jsx"],"mappings":";;AAAO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AACR;AASO,SAASC,EAAe;AAAA,EAC7B,MAAAC,IAAOF,EAA6B;AACtC,IAA6B,IAAY;AACvC,SAAI,OAAOE,KAAS,WAAiBA,IAC9BH,EAAqB,KAAKG,CAAI,EAAE;AACzC;AAOO,MAAMC,IAAS,CAAC;AAAA,EACrB,WAAAC;AAAA,EACA,MAAAF,IAAOF,EAA6B;AACtC,MAAmB;AACjB,QAAMK,IAAYJ,EAAe,EAAE,MAAAC,GAAM;AACzC,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,QAAO;AAAA,MACP,WAAAF;AAAA,MACA,OAAO,EAAE,QAAQC,GAAW,OAAOA,EAAA;AAAA,MAEnC,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,aAAY;AAAA,YACZ,eAAc;AAAA,YAEd,UAAA;AAAA,cAAA,gBAAAC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,IAAG;AAAA,kBACH,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YACd;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,SAAS;AAAA,YACT,aAAY;AAAA,YACZ,eAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"loader-DHGMYlC6.js","sources":["../src/components/loader/loader.tsx"],"sourcesContent":["/** Loader size variant definitions mapping sizes to their pixel values. */\nexport const KUMO_LOADER_VARIANTS = {\n  size: {\n    sm: {\n      value: 16,\n      description: \"Small loader for inline use\",\n    },\n    base: {\n      value: 24,\n      description: \"Default loader size\",\n    },\n    lg: {\n      value: 32,\n      description: \"Large loader for prominent loading states\",\n    },\n  },\n} as const;\n\nexport const KUMO_LOADER_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\n// Derived types from KUMO_LOADER_VARIANTS\nexport type KumoLoaderSize = keyof typeof KUMO_LOADER_VARIANTS.size;\n\nexport interface KumoLoaderVariantsProps {\n  /**\n   * Size of the loader. Use a preset name or a custom pixel number.\n   * - `\"sm\"` — 16px, small loader for inline use\n   * - `\"base\"` — 24px, default loader size\n   * - `\"lg\"` — 32px, large loader for prominent loading states\n   * @default \"base\"\n   */\n  size?: KumoLoaderSize | number;\n}\n\nexport function loaderVariants({\n  size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n}: KumoLoaderVariantsProps = {}): number {\n  if (typeof size === \"number\") return size;\n  return KUMO_LOADER_VARIANTS.size[size].value;\n}\n\n/**\n * Loader component props.\n *\n * @example\n * ```tsx\n * <Loader />\n * <Loader size=\"sm\" />\n * <Loader size={24} />\n * ```\n */\nexport interface LoaderProps {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /**\n   * Size of the spinner. Use a preset name or a custom pixel number.\n   * - `\"sm\"` — 16px, for inline use\n   * - `\"base\"` — 24px, default size\n   * - `\"lg\"` — 32px, for prominent loading states\n   * @default \"base\"\n   */\n  size?: KumoLoaderSize | number;\n}\n\n/**\n * Animated circular spinner for indicating loading states.\n *\n * @example\n * ```tsx\n * <Loader />\n * ```\n */\nexport const Loader = ({\n  className,\n  size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n}: LoaderProps) => {\n  const sizeValue = loaderVariants({ size });\n  return (\n    <svg\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      className={className}\n      style={{ height: sizeValue, width: sizeValue }}\n    >\n      <circle\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9.5\"\n        fill=\"none\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      >\n        <animateTransform\n          attributeName=\"transform\"\n          type=\"rotate\"\n          from=\"0 12 12\"\n          to=\"360 12 12\"\n          dur=\"2s\"\n          repeatCount=\"indefinite\"\n        />\n        <animate\n          attributeName=\"stroke-dasharray\"\n          values=\"0 150;42 150;42 150\"\n          keyTimes=\"0;0.5;1\"\n          dur=\"1.5s\"\n          repeatCount=\"indefinite\"\n        />\n        <animate\n          attributeName=\"stroke-dashoffset\"\n          values=\"0;-16;-59\"\n          keyTimes=\"0;0.5;1\"\n          dur=\"1.5s\"\n          repeatCount=\"indefinite\"\n        />\n      </circle>\n      <circle\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9.5\"\n        fill=\"none\"\n        opacity={0.1}\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  );\n};\n"],"names":["KUMO_LOADER_VARIANTS","KUMO_LOADER_DEFAULT_VARIANTS","loaderVariants","size","Loader","className","sizeValue","jsxs","jsx"],"mappings":";;AACO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AACR;AAgBO,SAASC,EAAe;AAAA,EAC7B,MAAAC,IAAOF,EAA6B;AACtC,IAA6B,IAAY;AACvC,SAAI,OAAOE,KAAS,WAAiBA,IAC9BH,EAAqB,KAAKG,CAAI,EAAE;AACzC;AAiCO,MAAMC,IAAS,CAAC;AAAA,EACrB,WAAAC;AAAA,EACA,MAAAF,IAAOF,EAA6B;AACtC,MAAmB;AACjB,QAAMK,IAAYJ,EAAe,EAAE,MAAAC,GAAM;AACzC,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,QAAO;AAAA,MACP,WAAAF;AAAA,MACA,OAAO,EAAE,QAAQC,GAAW,OAAOA,EAAA;AAAA,MAEnC,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,aAAY;AAAA,YACZ,eAAc;AAAA,YAEd,UAAA;AAAA,cAAA,gBAAAC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,IAAG;AAAA,kBACH,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YACd;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,SAAS;AAAA,YACT,aAAY;AAAA,YACZ,eAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAAA;AAGN;"}