@cloudflare/kumo 1.19.0 → 2.0.0

package/dist/chunks/autocomplete-cs3fwy6lwzlyirpq.js

@@ -0,0 +1,174 @@
+"use client";
+import { jsx as t, jsxs as A } from "react/jsx-runtime";
+import { CheckIcon as g } from "@phosphor-icons/react";
+import { K as c, i as y } from "./input-lpa5fc75tgrraafv.js";
+import { c as s } from "./cn-ct4n7r74mh8y0f48.js";
+import { F as C } from "./field-lnj619xpe8zjd26r.js";
+import { a6 as I, ab as T, bu as k, a8 as v, S as G, a9 as L, aa as O, bt as P, am as _, an as w, ao as z, ac as E } from "./vendor-base-ui-ie71jahf0czyf58j.js";
+const D = {
+  size: c.size
+}, u = {
+  size: "base"
+};
+function $({
+  size: o = u.size
+} = {}) {
+  return s(c.size[o].classes);
+}
+function p({
+  label: o,
+  required: e,
+  labelTooltip: r,
+  description: m,
+  error: a,
+  children: n,
+  ...i
+}) {
+  const l = /* @__PURE__ */ t(k, { ...i, children: n });
+  return o ? /* @__PURE__ */ t(
+    C,
+    {
+      label: o,
+      required: e,
+      labelTooltip: r,
+      description: m,
+      error: a ? typeof a == "string" ? { message: a, match: !0 } : a : void 0,
+      children: l
+    }
+  ) : l;
+}
+function d({
+  className: o,
+  size: e = u.size,
+  placeholder: r
+}) {
+  return /* @__PURE__ */ t(
+    E,
+    {
+      className: s(
+        y({ size: e, focusIndicator: !0 }),
+        "w-full",
+        o
+      ),
+      placeholder: r
+    }
+  );
+}
+function b({
+  children: o,
+  className: e,
+  align: r = "start",
+  sideOffset: m = 4,
+  alignOffset: a,
+  side: n
+}) {
+  return /* @__PURE__ */ t(_, { children: /* @__PURE__ */ t(
+    w,
+    {
+      className: "outline-none",
+      align: r,
+      sideOffset: m,
+      alignOffset: a,
+      side: n,
+      children: /* @__PURE__ */ t(
+        z,
+        {
+          className: (i) => s(
+            "flex flex-col",
+            "max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5",
+            "bg-kumo-control text-kumo-default",
+            "rounded-lg shadow-lg ring ring-kumo-line",
+            i.empty && "hidden",
+            e
+          ),
+          children: o
+        }
+      )
+    }
+  ) });
+}
+function S({
+  className: o,
+  ...e
+}) {
+  return /* @__PURE__ */ t(
+    v,
+    {
+      ...e,
+      className: s(
+        "min-h-0 flex-1 overflow-y-auto overscroll-contain scroll-pt-2 scroll-pb-2",
+        o
+      )
+    }
+  );
+}
+function f({ children: o, ...e }) {
+  return /* @__PURE__ */ A(
+    P,
+    {
+      ...e,
+      className: "group mx-1.5 grid cursor-pointer grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base data-highlighted:bg-kumo-overlay data-selected:font-medium",
+      children: [
+        /* @__PURE__ */ t("div", { className: "col-start-1", children: o }),
+        /* @__PURE__ */ t("span", { className: "col-start-2 hidden items-center group-data-selected:flex", children: /* @__PURE__ */ t(g, { size: 14 }) })
+      ]
+    }
+  );
+}
+function x(o) {
+  return /* @__PURE__ */ t(
+    O,
+    {
+      ...o,
+      className: s(
+        "mx-1.5 px-2 py-1.5 text-sm text-kumo-strong",
+        o.className
+      )
+    }
+  );
+}
+function N(o) {
+  return /* @__PURE__ */ t(
+    L,
+    {
+      ...o,
+      className: "border-t border-kumo-line mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0"
+    }
+  );
+}
+function h(o) {
+  return /* @__PURE__ */ t(
+    G,
+    {
+      ...o,
+      className: s("mx-0 my-1 h-px bg-kumo-line", o.className)
+    }
+  );
+}
+p.displayName = "Autocomplete.Root";
+d.displayName = "Autocomplete.InputGroup";
+b.displayName = "Autocomplete.Content";
+f.displayName = "Autocomplete.Item";
+x.displayName = "Autocomplete.GroupLabel";
+N.displayName = "Autocomplete.Group";
+h.displayName = "Autocomplete.Separator";
+const q = Object.assign(p, {
+  // Styled compound sub-components
+  InputGroup: d,
+  Content: b,
+  Item: f,
+  GroupLabel: x,
+  Group: N,
+  Separator: h,
+  List: S,
+  // Pass-through Base UI sub-components
+  Empty: T,
+  Collection: I
+});
+export {
+  q as A,
+  D as K,
+  $ as a,
+  u as b
+};
+//# sourceMappingURL=autocomplete-cs3fwy6lwzlyirpq.js.map

package/dist/chunks/autocomplete-cs3fwy6lwzlyirpq.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-cs3fwy6lwzlyirpq.js","sources":["../../src/components/autocomplete/autocomplete.tsx"],"sourcesContent":["import { Autocomplete as AutocompleteBase } from \"@base-ui/react/autocomplete\";\nimport { CheckIcon } from \"@phosphor-icons/react\";\nimport { type ReactNode } from \"react\";\nimport { inputVariants, KUMO_INPUT_VARIANTS } from \"../input/input\";\nimport { cn } from \"../../utils/cn\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\n\n/** Autocomplete variant definitions. */\nexport const KUMO_AUTOCOMPLETE_VARIANTS = {\n  size: KUMO_INPUT_VARIANTS.size,\n} as const;\n\nexport const KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\n// Derived types from KUMO_AUTOCOMPLETE_VARIANTS\nexport type KumoAutocompleteSize = keyof typeof KUMO_AUTOCOMPLETE_VARIANTS.size;\n\nexport interface KumoAutocompleteVariantsProps {\n  /**\n   * Size of the autocomplete input. Matches Input component sizes.\n   * - `\"xs\"` — Extra small for compact UIs (h-5 / 20px)\n   * - `\"sm\"` — Small for secondary fields (h-6.5 / 26px)\n   * - `\"base\"` — Default size (h-9 / 36px)\n   * - `\"lg\"` — Large for prominent fields (h-10 / 40px)\n   * @default \"base\"\n   */\n  size?: KumoAutocompleteSize;\n}\n\nexport function autocompleteVariants({\n  size = KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS.size,\n}: KumoAutocompleteVariantsProps = {}) {\n  return cn(KUMO_INPUT_VARIANTS.size[size].classes);\n}\n\n/**\n * Autocomplete component props.\n *\n * Autocomplete provides a free-form text input with optional suggestions in a\n * filterable dropdown. Unlike Combobox, the input value is not constrained to\n * the suggestion list items.\n *\n * @example\n * ```tsx\n * <Autocomplete label=\"Country\" items={countries}>\n *   <Autocomplete.InputGroup />\n *   <Autocomplete.Content>\n *     <Autocomplete.List>\n *       {(item) => <Autocomplete.Item value={item}>{item}</Autocomplete.Item>}\n *     </Autocomplete.List>\n *   </Autocomplete.Content>\n * </Autocomplete>\n * ```\n */\nexport interface AutocompleteProps {\n  /** Array of items to display in the dropdown */\n  items: unknown[];\n  /** The controlled input value */\n  value?: string | number | string[];\n  /** The uncontrolled default input value */\n  defaultValue?: string | number | string[];\n  /** Callback when the input value changes */\n  onValueChange?: AutocompleteBase.Root.Props<unknown>[\"onValueChange\"];\n  /** Whether the popup is open (controlled) */\n  open?: boolean;\n  /** Callback when the popup opens or closes */\n  onOpenChange?: AutocompleteBase.Root.Props<unknown>[\"onOpenChange\"];\n  /** Autocomplete content (input group, popup content) */\n  children: ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label content (enables Field wrapper) */\n  label?: ReactNode;\n  /** Whether the field is required */\n  required?: boolean;\n  /** Tooltip content to display next to the label */\n  labelTooltip?: ReactNode;\n  /** Helper text displayed below the field */\n  description?: ReactNode;\n  /** Error message or validation error object */\n  error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\nfunction Root<ItemValue>({\n  label,\n  required,\n  labelTooltip,\n  description,\n  error,\n  children,\n  ...props\n}: AutocompleteBase.Root.Props<ItemValue> & {\n  label?: ReactNode;\n  required?: boolean;\n  labelTooltip?: ReactNode;\n  description?: ReactNode;\n  error?: string | { message: ReactNode; match: FieldErrorMatch };\n}) {\n  const rootProps = props as Omit<\n    AutocompleteBase.Root.Props<ItemValue>,\n    \"items\"\n  > & {\n    items?: readonly ItemValue[];\n  };\n  const control = (\n    <AutocompleteBase.Root {...rootProps}>{children}</AutocompleteBase.Root>\n  );\n\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        {control}\n      </Field>\n    );\n  }\n\n  return control;\n}\n\nfunction InputGroup({\n  className,\n  size = KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS.size,\n  placeholder,\n}: {\n  className?: string;\n  size?: KumoAutocompleteSize;\n  placeholder?: string;\n}) {\n  return (\n    <AutocompleteBase.Input\n      className={cn(\n        inputVariants({ size, focusIndicator: true }),\n        \"w-full\",\n        className,\n      )}\n      placeholder={placeholder}\n    />\n  );\n}\n\nfunction Content({\n  children,\n  className,\n  align = \"start\",\n  sideOffset = 4,\n  alignOffset,\n  side,\n}: {\n  children?: ReactNode;\n  className?: string;\n  align?: AutocompleteBase.Positioner.Props[\"align\"];\n  alignOffset?: AutocompleteBase.Positioner.Props[\"alignOffset\"];\n  side?: AutocompleteBase.Positioner.Props[\"side\"];\n  sideOffset?: AutocompleteBase.Positioner.Props[\"sideOffset\"];\n}) {\n  return (\n    <AutocompleteBase.Portal>\n      <AutocompleteBase.Positioner\n        className=\"outline-none\"\n        align={align}\n        sideOffset={sideOffset}\n        alignOffset={alignOffset}\n        side={side}\n      >\n        <AutocompleteBase.Popup\n          className={(state: AutocompleteBase.Popup.State) =>\n            cn(\n              \"flex flex-col\",\n              \"max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5\",\n              \"bg-kumo-control text-kumo-default\",\n              \"rounded-lg shadow-lg ring ring-kumo-line\",\n              state.empty && \"hidden\",\n              className,\n            )\n          }\n        >\n          {children}\n        </AutocompleteBase.Popup>\n      </AutocompleteBase.Positioner>\n    </AutocompleteBase.Portal>\n  );\n}\n\nfunction List({\n  className,\n  ...props\n}: AutocompleteBase.List.Props & { className?: string }) {\n  return (\n    <AutocompleteBase.List\n      {...props}\n      className={cn(\n        \"min-h-0 flex-1 overflow-y-auto overscroll-contain scroll-pt-2 scroll-pb-2\",\n        className,\n      )}\n    />\n  );\n}\n\nfunction Item({ children, ...props }: AutocompleteBase.Item.Props) {\n  return (\n    <AutocompleteBase.Item\n      {...props}\n      className=\"group mx-1.5 grid cursor-pointer grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base data-highlighted:bg-kumo-overlay data-selected:font-medium\"\n    >\n      <div className=\"col-start-1\">{children}</div>\n      <span className=\"col-start-2 hidden items-center group-data-selected:flex\">\n        <CheckIcon size={14} />\n      </span>\n    </AutocompleteBase.Item>\n  );\n}\n\nfunction GroupLabel(props: AutocompleteBase.GroupLabel.Props) {\n  return (\n    <AutocompleteBase.GroupLabel\n      {...props}\n      className={cn(\n        \"mx-1.5 px-2 py-1.5 text-sm text-kumo-strong\",\n        props.className,\n      )}\n    />\n  );\n}\n\nfunction Group(props: AutocompleteBase.Group.Props) {\n  return (\n    <AutocompleteBase.Group\n      {...props}\n      className=\"border-t border-kumo-line mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n    />\n  );\n}\n\nfunction Separator(props: AutocompleteBase.Separator.Props) {\n  return (\n    <AutocompleteBase.Separator\n      {...props}\n      className={cn(\"mx-0 my-1 h-px bg-kumo-line\", props.className)}\n    />\n  );\n}\n\nRoot.displayName = \"Autocomplete.Root\";\nInputGroup.displayName = \"Autocomplete.InputGroup\";\nContent.displayName = \"Autocomplete.Content\";\nItem.displayName = \"Autocomplete.Item\";\nGroupLabel.displayName = \"Autocomplete.GroupLabel\";\nGroup.displayName = \"Autocomplete.Group\";\nSeparator.displayName = \"Autocomplete.Separator\";\n\n/**\n * Autocomplete — free-form text input with an optional filtered suggestion list.\n *\n * Unlike Combobox, the input value is not restricted to items in the list.\n * Use Combobox when the selected value must come from the list.\n *\n * Compound component: `Autocomplete` (Root), `.InputGroup`, `.Content`, `.Item`,\n * `.GroupLabel`, `.Group`, `.Separator`, `.List`, `.Collection`.\n *\n * `InputGroup` renders the text input with Input component styling.\n * Pass a `size` prop to `InputGroup` to match the Input component sizes.\n *\n * @example\n * ```tsx\n * <Autocomplete items={fruits} label=\"Fruit\">\n *   <Autocomplete.InputGroup size=\"base\" />\n *   <Autocomplete.Content>\n *     <Autocomplete.List>\n *       {(item) => <Autocomplete.Item value={item}>{item}</Autocomplete.Item>}\n *     </Autocomplete.List>\n *   </Autocomplete.Content>\n * </Autocomplete>\n * ```\n *\n * @see https://base-ui.com/react/components/autocomplete\n */\nexport const Autocomplete = Object.assign(Root, {\n  // Styled compound sub-components\n  InputGroup,\n  Content,\n  Item,\n  GroupLabel,\n  Group,\n  Separator,\n  List,\n\n  // Pass-through Base UI sub-components\n  Empty: AutocompleteBase.Empty,\n  Collection: AutocompleteBase.Collection,\n});\n"],"names":["KUMO_AUTOCOMPLETE_VARIANTS","KUMO_INPUT_VARIANTS","KUMO_AUTOCOMPLETE_DEFAULT_VARIANTS","autocompleteVariants","size","cn","Root","label","required","labelTooltip","description","error","children","props","control","jsx","AutocompleteBase.Root","Field","InputGroup","className","placeholder","AutocompleteBase.Input","inputVariants","Content","align","sideOffset","alignOffset","side","AutocompleteBase.Portal","AutocompleteBase.Positioner","AutocompleteBase.Popup","state","List","AutocompleteBase.List","Item","jsxs","AutocompleteBase.Item","CheckIcon","GroupLabel","AutocompleteBase.GroupLabel","Group","AutocompleteBase.Group","Separator","AutocompleteBase.Separator","Autocomplete","AutocompleteBase.Empty","AutocompleteBase.Collection"],"mappings":"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"}

package/dist/chunks/{breadcrumbs-ge20hcb3o5spswrk.js → breadcrumbs-cxcwf2l1ki3ffg5d.js}

@@ -2,7 +2,7 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import { Children as h, cloneElement as d, isValidElement as k, useState as x, useEffect as C } from "react";
 import { CheckIcon as g, CopyIcon as w } from "@phosphor-icons/react";
-import { B as N } from "./button-oaqi7ykdisyskoos.js";
+import { B as N } from "./button-6by9ntsa3nj553mq.js";
 import { S as y } from "./skeleton-line-epxenksfesr2fkcv.js";
 import { u as v } from "./link-provider-mn2voeohon7cj9o4.js";
 import { c as b } from "./cn-ct4n7r74mh8y0f48.js";
@@ -163,4 +163,4 @@ export {
   B as a,
   L as b
 };
-//# sourceMappingURL=breadcrumbs-ge20hcb3o5spswrk.js.map
+//# sourceMappingURL=breadcrumbs-cxcwf2l1ki3ffg5d.js.map

package/dist/chunks/{breadcrumbs-ge20hcb3o5spswrk.js.map → breadcrumbs-cxcwf2l1ki3ffg5d.js.map}

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs-ge20hcb3o5spswrk.js","sources":["../../src/components/breadcrumbs/breadcrumbs.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  isValidElement,\n  useEffect,\n  useState,\n  type PropsWithChildren,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { Button } from \"../../components/button\";\nimport { SkeletonLine } from \"../../components/loader/skeleton-line\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { cn } from \"../../utils/cn\";\n\n/** Breadcrumbs size variant definitions. */\nexport const KUMO_BREADCRUMBS_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"text-sm h-10 gap-0.5\",\n      description: \"Compact breadcrumbs for dense UIs\",\n    },\n    base: {\n      classes: \"text-base h-12 gap-1\",\n      description: \"Default breadcrumbs size\",\n    },\n  },\n} as const;\n\nexport const KUMO_BREADCRUMBS_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport type KumoBreadcrumbsSize = keyof typeof KUMO_BREADCRUMBS_VARIANTS.size;\n\nexport interface KumoBreadcrumbsVariantsProps {\n  /**\n   * Size of the breadcrumbs.\n   * - `\"sm\"` — Compact breadcrumbs for dense UIs\n   * - `\"base\"` — Default breadcrumbs size\n   * @default \"base\"\n   */\n  size?: KumoBreadcrumbsSize;\n}\n\nexport function breadcrumbsVariants({\n  size = KUMO_BREADCRUMBS_DEFAULT_VARIANTS.size,\n}: KumoBreadcrumbsVariantsProps = {}) {\n  return cn(\n    \"group mr-4 flex min-w-0 grow items-center overflow-hidden whitespace-nowrap\",\n    KUMO_BREADCRUMBS_VARIANTS.size[size].classes,\n  );\n}\n\nexport interface BreadcrumbsItemProps {\n  href: string;\n  icon?: React.ReactNode;\n}\n\nconst Link = ({\n  href,\n  icon,\n  children,\n}: PropsWithChildren<BreadcrumbsItemProps>) => {\n  const LinkComponent = useLinkComponent();\n\n  return (\n    <LinkComponent\n      to={href}\n      className=\"flex min-w-0 max-w-full items-center gap-1 text-kumo-subtle no-underline\"\n    >\n      {!!icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n      <span className=\"truncate\">{children}</span>\n    </LinkComponent>\n  );\n};\n\ninterface BreadcrumbsCurrentProps {\n  loading?: boolean;\n  icon?: React.ReactNode;\n}\n\nfunction Current({\n  children,\n  icon,\n  loading,\n}: PropsWithChildren<BreadcrumbsCurrentProps>) {\n  if (loading) {\n    return (\n      <div className=\"flex w-[125px] min-w-0 items-center gap-1\">\n        {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n        <SkeletonLine />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"flex min-w-0 max-w-full items-center gap-1 font-medium\"\n      aria-current=\"page\"\n    >\n      {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n      <span className=\"truncate\">{children}</span>\n    </div>\n  );\n}\n\nfunction Separator() {\n  return (\n    <span\n      className=\"flex shrink-0 items-center text-kumo-inactive\"\n      aria-hidden=\"true\"\n    >\n      <svg width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\">\n        <path\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"1.5\"\n          d=\"M10.75 8.75L14.25 12L10.75 15.25\"\n        />\n      </svg>\n    </span>\n  );\n}\n\nfunction MobileEllipsis() {\n  return (\n    <span className=\"flex shrink-0 items-center text-kumo-subtle\" aria-hidden>\n      ...\n    </span>\n  );\n}\n\nfunction Clipboard({ text }: { text: string }) {\n  const [isCopied, setIsCopied] = useState(false);\n\n  useEffect(() => {\n    if (!isCopied) return;\n\n    const timeoutId = setTimeout(() => setIsCopied(false), 2000);\n    return () => clearTimeout(timeoutId);\n  }, [isCopied]);\n\n  const handleCopyDeeplink = async () => {\n    if (!text) return;\n\n    try {\n      await navigator.clipboard.writeText(text);\n      setIsCopied(true);\n    } catch (err) {\n      console.error(\"Failed to copy deeplink:\", err);\n    }\n  };\n\n  return (\n    <Button\n      variant=\"ghost\"\n      shape=\"square\"\n      size=\"sm\"\n      className=\"opacity-0 transition-[opacity] group-hover:opacity-100\"\n      onClick={handleCopyDeeplink}\n      title=\"Click to copy\"\n      aria-label=\"Copy\"\n    >\n      {isCopied ? (\n        <CheckIcon weight=\"bold\" className=\"text-kumo-success\" />\n      ) : (\n        <CopyIcon weight=\"regular\" />\n      )}\n    </Button>\n  );\n}\n\n/**\n * Breadcrumbs component props.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n *   <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Link href=\"/docs\">Docs</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Current>Current Page</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport interface BreadcrumbsProps\n  extends PropsWithChildren,\n    KumoBreadcrumbsVariantsProps {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n}\n\n/**\n * Navigation breadcrumb trail showing the current page's location in a hierarchy.\n * Compound component with `Breadcrumbs.Link`, `Breadcrumbs.Current`, `Breadcrumbs.Separator`, and `Breadcrumbs.Clipboard`.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n *   <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Current>Dashboard</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport function Breadcrumb({\n  children,\n  size = \"base\",\n  className,\n}: BreadcrumbsProps) {\n  const childArray = Children.toArray(children);\n  const mobileChildren = getMobileBreadcrumbChildren(childArray);\n\n  return (\n    <nav\n      className={cn(breadcrumbsVariants({ size }), className)}\n      aria-label=\"breadcrumb\"\n    >\n      <div className=\"contents sm:hidden\">{mobileChildren}</div>\n      <div className=\"hidden sm:contents\">{childArray}</div>\n    </nav>\n  );\n}\n\nfunction isComponentElement(\n  child: ReactNode,\n  component: unknown,\n): child is ReactElement {\n  return isValidElement(child) && child.type === component;\n}\n\nfunction getMobileBreadcrumbChildren(children: ReactNode[]): ReactNode[] {\n  const breadcrumbItems = children.filter(\n    (child) =>\n      isComponentElement(child, Link) || isComponentElement(child, Current),\n  ) as ReactElement[];\n\n  if (breadcrumbItems.length <= 2) {\n    return children;\n  }\n\n  const [parentItem, currentItem] = breadcrumbItems.slice(-2);\n  const trailingItems: ReactNode[] = [\n    <MobileEllipsis key=\"kumo-breadcrumb-mobile-ellipsis\" />,\n    <Separator key=\"kumo-breadcrumb-mobile-separator-leading\" />,\n    cloneElement(parentItem, { key: \"kumo-breadcrumb-mobile-parent\" }),\n    <Separator key=\"kumo-breadcrumb-mobile-separator-trailing\" />,\n    cloneElement(currentItem, { key: \"kumo-breadcrumb-mobile-current\" }),\n  ];\n\n  const extras = children.filter(\n    (child) =>\n      !isComponentElement(child, Link) &&\n      !isComponentElement(child, Current) &&\n      !isComponentElement(child, Separator),\n  );\n\n  return [...trailingItems, ...extras];\n}\n\nBreadcrumb.Link = Link;\nBreadcrumb.Current = Current;\nBreadcrumb.Separator = Separator;\nBreadcrumb.Clipboard = Clipboard;\n"],"names":["KUMO_BREADCRUMBS_VARIANTS","KUMO_BREADCRUMBS_DEFAULT_VARIANTS","breadcrumbsVariants","size","cn","Link","href","icon","children","LinkComponent","useLinkComponent","jsxs","jsx","Current","loading","SkeletonLine","Separator","MobileEllipsis","Clipboard","text","isCopied","setIsCopied","useState","useEffect","timeoutId","Button","err","CheckIcon","CopyIcon","Breadcrumb","className","childArray","Children","mobileChildren","getMobileBreadcrumbChildren","isComponentElement","child","component","isValidElement","breadcrumbItems","parentItem","currentItem","trailingItems","cloneElement","extras"],"mappings":"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"}
+{"version":3,"file":"breadcrumbs-cxcwf2l1ki3ffg5d.js","sources":["../../src/components/breadcrumbs/breadcrumbs.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  isValidElement,\n  useEffect,\n  useState,\n  type PropsWithChildren,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { Button } from \"../../components/button\";\nimport { SkeletonLine } from \"../../components/loader/skeleton-line\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { cn } from \"../../utils/cn\";\n\n/** Breadcrumbs size variant definitions. */\nexport const KUMO_BREADCRUMBS_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"text-sm h-10 gap-0.5\",\n      description: \"Compact breadcrumbs for dense UIs\",\n    },\n    base: {\n      classes: \"text-base h-12 gap-1\",\n      description: \"Default breadcrumbs size\",\n    },\n  },\n} as const;\n\nexport const KUMO_BREADCRUMBS_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport type KumoBreadcrumbsSize = keyof typeof KUMO_BREADCRUMBS_VARIANTS.size;\n\nexport interface KumoBreadcrumbsVariantsProps {\n  /**\n   * Size of the breadcrumbs.\n   * - `\"sm\"` — Compact breadcrumbs for dense UIs\n   * - `\"base\"` — Default breadcrumbs size\n   * @default \"base\"\n   */\n  size?: KumoBreadcrumbsSize;\n}\n\nexport function breadcrumbsVariants({\n  size = KUMO_BREADCRUMBS_DEFAULT_VARIANTS.size,\n}: KumoBreadcrumbsVariantsProps = {}) {\n  return cn(\n    \"group mr-4 flex min-w-0 grow items-center overflow-hidden whitespace-nowrap\",\n    KUMO_BREADCRUMBS_VARIANTS.size[size].classes,\n  );\n}\n\nexport interface BreadcrumbsItemProps {\n  href: string;\n  icon?: React.ReactNode;\n}\n\nconst Link = ({\n  href,\n  icon,\n  children,\n}: PropsWithChildren<BreadcrumbsItemProps>) => {\n  const LinkComponent = useLinkComponent();\n\n  return (\n    <LinkComponent\n      to={href}\n      className=\"flex min-w-0 max-w-full items-center gap-1 text-kumo-subtle no-underline\"\n    >\n      {!!icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n      <span className=\"truncate\">{children}</span>\n    </LinkComponent>\n  );\n};\n\ninterface BreadcrumbsCurrentProps {\n  loading?: boolean;\n  icon?: React.ReactNode;\n}\n\nfunction Current({\n  children,\n  icon,\n  loading,\n}: PropsWithChildren<BreadcrumbsCurrentProps>) {\n  if (loading) {\n    return (\n      <div className=\"flex w-[125px] min-w-0 items-center gap-1\">\n        {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n        <SkeletonLine />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"flex min-w-0 max-w-full items-center gap-1 font-medium\"\n      aria-current=\"page\"\n    >\n      {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n      <span className=\"truncate\">{children}</span>\n    </div>\n  );\n}\n\nfunction Separator() {\n  return (\n    <span\n      className=\"flex shrink-0 items-center text-kumo-inactive\"\n      aria-hidden=\"true\"\n    >\n      <svg width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\">\n        <path\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"1.5\"\n          d=\"M10.75 8.75L14.25 12L10.75 15.25\"\n        />\n      </svg>\n    </span>\n  );\n}\n\nfunction MobileEllipsis() {\n  return (\n    <span className=\"flex shrink-0 items-center text-kumo-subtle\" aria-hidden>\n      ...\n    </span>\n  );\n}\n\nfunction Clipboard({ text }: { text: string }) {\n  const [isCopied, setIsCopied] = useState(false);\n\n  useEffect(() => {\n    if (!isCopied) return;\n\n    const timeoutId = setTimeout(() => setIsCopied(false), 2000);\n    return () => clearTimeout(timeoutId);\n  }, [isCopied]);\n\n  const handleCopyDeeplink = async () => {\n    if (!text) return;\n\n    try {\n      await navigator.clipboard.writeText(text);\n      setIsCopied(true);\n    } catch (err) {\n      console.error(\"Failed to copy deeplink:\", err);\n    }\n  };\n\n  return (\n    <Button\n      variant=\"ghost\"\n      shape=\"square\"\n      size=\"sm\"\n      className=\"opacity-0 transition-[opacity] group-hover:opacity-100\"\n      onClick={handleCopyDeeplink}\n      title=\"Click to copy\"\n      aria-label=\"Copy\"\n    >\n      {isCopied ? (\n        <CheckIcon weight=\"bold\" className=\"text-kumo-success\" />\n      ) : (\n        <CopyIcon weight=\"regular\" />\n      )}\n    </Button>\n  );\n}\n\n/**\n * Breadcrumbs component props.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n *   <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Link href=\"/docs\">Docs</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Current>Current Page</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport interface BreadcrumbsProps\n  extends PropsWithChildren,\n    KumoBreadcrumbsVariantsProps {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n}\n\n/**\n * Navigation breadcrumb trail showing the current page's location in a hierarchy.\n * Compound component with `Breadcrumbs.Link`, `Breadcrumbs.Current`, `Breadcrumbs.Separator`, and `Breadcrumbs.Clipboard`.\n *\n * @example\n * ```tsx\n * <Breadcrumbs>\n *   <Breadcrumbs.Link href=\"/\">Home</Breadcrumbs.Link>\n *   <Breadcrumbs.Separator />\n *   <Breadcrumbs.Current>Dashboard</Breadcrumbs.Current>\n * </Breadcrumbs>\n * ```\n */\nexport function Breadcrumb({\n  children,\n  size = \"base\",\n  className,\n}: BreadcrumbsProps) {\n  const childArray = Children.toArray(children);\n  const mobileChildren = getMobileBreadcrumbChildren(childArray);\n\n  return (\n    <nav\n      className={cn(breadcrumbsVariants({ size }), className)}\n      aria-label=\"breadcrumb\"\n    >\n      <div className=\"contents sm:hidden\">{mobileChildren}</div>\n      <div className=\"hidden sm:contents\">{childArray}</div>\n    </nav>\n  );\n}\n\nfunction isComponentElement(\n  child: ReactNode,\n  component: unknown,\n): child is ReactElement {\n  return isValidElement(child) && child.type === component;\n}\n\nfunction getMobileBreadcrumbChildren(children: ReactNode[]): ReactNode[] {\n  const breadcrumbItems = children.filter(\n    (child) =>\n      isComponentElement(child, Link) || isComponentElement(child, Current),\n  ) as ReactElement[];\n\n  if (breadcrumbItems.length <= 2) {\n    return children;\n  }\n\n  const [parentItem, currentItem] = breadcrumbItems.slice(-2);\n  const trailingItems: ReactNode[] = [\n    <MobileEllipsis key=\"kumo-breadcrumb-mobile-ellipsis\" />,\n    <Separator key=\"kumo-breadcrumb-mobile-separator-leading\" />,\n    cloneElement(parentItem, { key: \"kumo-breadcrumb-mobile-parent\" }),\n    <Separator key=\"kumo-breadcrumb-mobile-separator-trailing\" />,\n    cloneElement(currentItem, { key: \"kumo-breadcrumb-mobile-current\" }),\n  ];\n\n  const extras = children.filter(\n    (child) =>\n      !isComponentElement(child, Link) &&\n      !isComponentElement(child, Current) &&\n      !isComponentElement(child, Separator),\n  );\n\n  return [...trailingItems, ...extras];\n}\n\nBreadcrumb.Link = Link;\nBreadcrumb.Current = Current;\nBreadcrumb.Separator = Separator;\nBreadcrumb.Clipboard = Clipboard;\n"],"names":["KUMO_BREADCRUMBS_VARIANTS","KUMO_BREADCRUMBS_DEFAULT_VARIANTS","breadcrumbsVariants","size","cn","Link","href","icon","children","LinkComponent","useLinkComponent","jsxs","jsx","Current","loading","SkeletonLine","Separator","MobileEllipsis","Clipboard","text","isCopied","setIsCopied","useState","useEffect","timeoutId","Button","err","CheckIcon","CopyIcon","Breadcrumb","className","childArray","Children","mobileChildren","getMobileBreadcrumbChildren","isComponentElement","child","component","isValidElement","breadcrumbItems","parentItem","currentItem","trailingItems","cloneElement","extras"],"mappings":"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"}

package/dist/chunks/{button-oaqi7ykdisyskoos.js → button-6by9ntsa3nj553mq.js}

@@ -1,9 +1,9 @@
 "use client";
-import { jsx as r, jsxs as k } from "react/jsx-runtime";
+import { jsx as a, jsxs as h } from "react/jsx-runtime";
 import f from "react";
 import { ArrowsClockwise as w } from "@phosphor-icons/react";
 import { L as N } from "./loader-hr2w7cpqeev3p3vl.js";
-import { T } from "./tooltip-hikjvdbg3xghnq1x.js";
+import { T } from "./tooltip-odudhkxe282wxinq.js";
 import { c } from "./cn-ct4n7r74mh8y0f48.js";
 import { u as B } from "./link-provider-mn2voeohon7cj9o4.js";
 const i = {
@@ -47,11 +47,11 @@ const i = {
   },
   variant: {
     primary: {
-      classes: "bg-kumo-brand !text-white hover:bg-kumo-brand-hover focus:bg-kumo-brand-hover disabled:bg-kumo-brand/50",
+      classes: "bg-kumo-brand !text-white hover:bg-kumo-brand-hover disabled:bg-kumo-brand/50",
       description: "High-emphasis button for primary actions"
     },
     secondary: {
-      classes: "bg-kumo-base !text-kumo-default ring not-disabled:hover:border-secondary! not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
+      classes: "bg-kumo-base !text-kumo-default ring not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
       description: "Default button style for most actions"
     },
     ghost: {
@@ -63,7 +63,7 @@ const i = {
       description: "Danger button for destructive actions like delete"
     },
     "secondary-destructive": {
-      classes: "bg-kumo-base !text-kumo-danger ring not-disabled:hover:border-secondary! not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
+      classes: "bg-kumo-base !text-kumo-danger ring not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
       description: "Secondary button with destructive text for less prominent dangerous actions"
     },
     outline: {
@@ -86,6 +86,7 @@ function x({
     // Base styles
     "group flex w-max shrink-0 items-center font-medium select-none",
     "border-0 shadow-xs",
+    "focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand",
     "cursor-pointer",
     // Disabled state
     "disabled:cursor-not-allowed disabled:text-kumo-subtle",
@@ -96,27 +97,25 @@ function x({
     o && i.compactSize[t].classes
   );
 }
-const y = (s) => s ? f.isValidElement(s) ? s : /* @__PURE__ */ r(s, {}) : null, v = f.forwardRef(
+const y = (s) => s ? f.isValidElement(s) ? s : /* @__PURE__ */ a(s, {}) : null, v = f.forwardRef(
   ({
     children: s,
     className: t,
     disabled: e,
     loading: o,
     shape: u = "base",
-    size: a = "base",
-    variant: d = "secondary",
-    icon: l,
+    size: r = "base",
+    variant: l = "secondary",
+    icon: d,
     title: n,
     ...b
   }, m) => {
-    const { type: p, ...z } = b, h = /* @__PURE__ */ k(
+    const { type: p, ...z } = b, k = /* @__PURE__ */ h(
       "button",
       {
         ref: m,
         className: c(
-          x({ variant: d, size: a, shape: u }),
-          "focus:opacity-100 focus-visible:ring-1 focus-visible:ring-kumo-hairline *:in-focus:opacity-100",
-          // Focus styles
+          x({ variant: l, size: r, shape: u }),
           e && "cursor-not-allowed opacity-50",
           t
         ),
@@ -124,13 +123,13 @@ const y = (s) => s ? f.isValidElement(s) ? s : /* @__PURE__ */ r(s, {}) : null,
         type: p ?? "button",
         ...z,
         children: [
-          o && /* @__PURE__ */ r(N, { size: a === "lg" ? 16 : 14 }),
-          !o && y(l),
+          o && /* @__PURE__ */ a(N, { size: r === "lg" ? 16 : 14 }),
+          !o && y(d),
           s
         ]
       }
     );
-    return n ? /* @__PURE__ */ r(T, { content: n, render: h }) : h;
+    return n ? /* @__PURE__ */ a(T, { content: n, render: k }) : k;
   }
 );
 v.displayName = "Button";
@@ -138,7 +137,7 @@ const j = ({
   "aria-label": s = "Refresh",
   loading: t,
   ...e
-}) => /* @__PURE__ */ r(v, { shape: "square", "aria-label": s, ...e, children: /* @__PURE__ */ r(
+}) => /* @__PURE__ */ a(v, { shape: "square", "aria-label": s, ...e, children: /* @__PURE__ */ a(
   w,
   {
     className: c({
@@ -155,19 +154,19 @@ const j = ({
     external: e,
     href: o,
     shape: u = "base",
-    size: a = "base",
-    variant: d = "ghost",
-    icon: l,
+    size: r = "base",
+    variant: l = "ghost",
+    icon: d,
     // linksExternal = false,
     ...n
   }, b) => {
     const m = B(), p = e ? { target: "_blank", rel: "noopener noreferrer" } : {};
-    return /* @__PURE__ */ k(
+    return /* @__PURE__ */ h(
       m,
       {
         ref: b,
         className: c(
-          x({ variant: d, size: a, shape: u }),
+          x({ variant: l, size: r, shape: u }),
           "flex items-center no-underline!",
           t
         ),
@@ -176,7 +175,7 @@ const j = ({
         ...p,
         ...n,
         children: [
-          y(l),
+          y(d),
           s
         ]
       }
@@ -190,4 +189,4 @@ export {
   j as R,
   x as b
 };
-//# sourceMappingURL=button-oaqi7ykdisyskoos.js.map
+//# sourceMappingURL=button-6by9ntsa3nj553mq.js.map

package/dist/chunks/button-6by9ntsa3nj553mq.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-6by9ntsa3nj553mq.js","sources":["../../src/components/button/button.tsx"],"sourcesContent":["import React from \"react\";\nimport { ArrowsClockwise, type Icon } from \"@phosphor-icons/react\";\nimport { Loader } from \"../loader/loader\";\nimport { Tooltip } from \"../tooltip/tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/** Button variant definitions mapping shape, size, and variant names to their Tailwind classes. */\nexport const KUMO_BUTTON_VARIANTS = {\n  shape: {\n    base: {\n      classes: \"\",\n      description: \"Default rectangular button shape\",\n    },\n    square: {\n      classes: \"items-center justify-center p-0\",\n      description: \"Square button for icon-only actions\",\n    },\n    circle: {\n      classes: \"items-center justify-center p-0 rounded-full\",\n      description: \"Circular button for icon-only actions\",\n    },\n  },\n  size: {\n    xs: {\n      classes: \"h-5 gap-1 rounded-sm px-1.5 text-xs\",\n      description: \"Extra small button for compact UIs\",\n    },\n    sm: {\n      classes: \"h-6.5 gap-1 rounded-md px-2 text-xs\",\n      description: \"Small button for secondary actions\",\n    },\n    base: {\n      classes: \"h-9 gap-1.5 rounded-lg px-3 text-base\",\n      description: \"Default button size\",\n    },\n    lg: {\n      classes: \"h-10 gap-2 rounded-lg px-4 text-base\",\n      description: \"Large button for primary CTAs\",\n    },\n  },\n  compactSize: {\n    xs: { classes: \"size-3.5\" },\n    sm: { classes: \"size-6.5\" },\n    base: { classes: \"size-9\" },\n    lg: { classes: \"size-10\" },\n  },\n  variant: {\n    primary: {\n      classes:\n        \"bg-kumo-brand !text-white hover:bg-kumo-brand-hover disabled:bg-kumo-brand/50\",\n      description: \"High-emphasis button for primary actions\",\n    },\n    secondary: {\n      classes:\n        \"bg-kumo-base !text-kumo-default ring not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-hairline data-[state=open]:bg-kumo-base\",\n      description: \"Default button style for most actions\",\n    },\n    ghost: {\n      classes: \"text-kumo-default hover:bg-kumo-tint shadow-none bg-inherit\",\n      description: \"Minimal button with no background\",\n    },\n    destructive: {\n      classes: \"bg-kumo-danger !text-white hover:bg-kumo-danger/70\",\n      description: \"Danger button for destructive actions like delete\",\n    },\n    \"secondary-destructive\": {\n      classes:\n        \"bg-kumo-base !text-kumo-danger ring not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-hairline data-[state=open]:bg-kumo-base\",\n      description:\n        \"Secondary button with destructive text for less prominent dangerous actions\",\n    },\n    outline: {\n      classes: \"bg-transparent text-kumo-default ring ring-kumo-hairline\",\n      description: \"Bordered button with transparent background\",\n    },\n  },\n} as const;\n\nexport const KUMO_BUTTON_DEFAULT_VARIANTS = {\n  shape: \"base\",\n  size: \"base\",\n  variant: \"secondary\",\n} as const;\n\n// Derived types from KUMO_BUTTON_VARIANTS\nexport type KumoButtonShape = keyof typeof KUMO_BUTTON_VARIANTS.shape;\nexport type KumoButtonSize = keyof typeof KUMO_BUTTON_VARIANTS.size;\nexport type KumoButtonVariant = keyof typeof KUMO_BUTTON_VARIANTS.variant;\n\nexport interface KumoButtonVariantsProps {\n  /**\n   * Button shape.\n   * - `\"base\"` — Default rectangular button\n   * - `\"square\"` — Square button for icon-only actions\n   * - `\"circle\"` — Circular button for icon-only actions\n   * @default \"base\"\n   */\n  shape?: KumoButtonShape;\n  /**\n   * Button size.\n   * - `\"xs\"` — Extra small for compact UIs\n   * - `\"sm\"` — Small for secondary actions\n   * - `\"base\"` — Default size\n   * - `\"lg\"` — Large for primary CTAs\n   * @default \"base\"\n   */\n  size?: KumoButtonSize;\n  /**\n   * Visual style of the button.\n   * - `\"primary\"` — High-emphasis, brand-colored for primary actions\n   * - `\"secondary\"` — Default style with border for most actions\n   * - `\"ghost\"` — Minimal, no background for tertiary actions\n   * - `\"destructive\"` — Danger button for destructive actions\n   * - `\"secondary-destructive\"` — Secondary style with destructive text\n   * - `\"outline\"` — Bordered with transparent background\n   * @default \"secondary\"\n   */\n  variant?: KumoButtonVariant;\n}\n\nexport function buttonVariants({\n  variant = KUMO_BUTTON_DEFAULT_VARIANTS.variant,\n  size = KUMO_BUTTON_DEFAULT_VARIANTS.size,\n  shape = KUMO_BUTTON_DEFAULT_VARIANTS.shape,\n}: KumoButtonVariantsProps = {}) {\n  const isCompactShape = shape === \"square\" || shape === \"circle\";\n\n  return cn(\n    // Base styles\n    \"group flex w-max shrink-0 items-center font-medium select-none\",\n    \"border-0 shadow-xs\",\n    \"focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n    \"cursor-pointer\",\n    // Disabled state\n    \"disabled:cursor-not-allowed disabled:text-kumo-subtle\",\n    // Apply variant, size, shape styles from KUMO_BUTTON_VARIANTS\n    KUMO_BUTTON_VARIANTS.variant[variant].classes,\n    KUMO_BUTTON_VARIANTS.size[size].classes,\n    KUMO_BUTTON_VARIANTS.shape[shape].classes,\n    isCompactShape && KUMO_BUTTON_VARIANTS.compactSize[size].classes,\n  );\n}\n\n// Normalize icon prop to support both React elements and component types\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n  if (!IconComponent) return null;\n  if (React.isValidElement(IconComponent)) return IconComponent;\n  const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n  return <Comp />;\n};\n\n/**\n * Button component props.\n *\n * Uses a discriminated union on `shape` so that icon-only buttons\n * (`shape=\"square\"` or `shape=\"circle\"`) require an `aria-label`.\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\">Save</Button>\n * <Button variant=\"secondary\" shape=\"square\" icon={PlusIcon} aria-label=\"Add\" />\n * <Button variant=\"destructive\" loading>Deleting...</Button>\n * ```\n */\ntype ButtonBaseProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n  /** Content rendered inside the button. */\n  children?: React.ReactNode;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */\n  icon?: Icon | React.ReactNode;\n  /** Shows a loading spinner and disables interaction. */\n  loading?: boolean;\n  /** When set, wraps the button in a Tooltip with this content. */\n  title?: React.ReactNode;\n};\n\ntype ButtonWithTextProps = ButtonBaseProps & {\n  shape?: \"base\";\n  size?: KumoButtonSize;\n  variant?: KumoButtonVariant;\n};\n\ntype IconOnlyButtonProps = ButtonBaseProps & {\n  shape: \"square\" | \"circle\";\n  size?: KumoButtonSize;\n  variant?: KumoButtonVariant;\n  /** Required for icon-only buttons to provide accessible label for screen readers */\n  \"aria-label\": string;\n};\n\nexport type ButtonProps = ButtonWithTextProps | IconOnlyButtonProps;\n\n/**\n * LinkButton component props — renders an anchor styled as a button.\n *\n * @example\n * ```tsx\n * <LinkButton href=\"/docs\" variant=\"ghost\" icon={BookIcon}>Docs</LinkButton>\n * <LinkButton href=\"https://example.com\" external>Visit Site</LinkButton>\n * ```\n */\nexport type LinkButtonProps = React.AnchorHTMLAttributes<HTMLAnchorElement> &\n  KumoButtonVariantsProps & {\n    /** Content rendered inside the link button. */\n    children?: React.ReactNode;\n    /** Additional CSS classes merged via `cn()`. */\n    className?: string;\n    /** Icon from `@phosphor-icons/react` or a React element. Rendered before children. */\n    icon?: Icon | React.ReactNode;\n    /** When `true`, opens in a new tab with `rel=\"noopener noreferrer\"`. */\n    external?: boolean;\n    linksExternal?: boolean;\n  };\n\n/**\n * Primary action trigger. Supports multiple variants, sizes, shapes, icons, and loading state.\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\">Save</Button>\n * <Button variant=\"secondary\" icon={PlusIcon}>Create Worker</Button>\n * ```\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      children,\n      className,\n      disabled,\n      loading,\n      shape = \"base\",\n      size = \"base\",\n      variant = \"secondary\",\n      icon: IconComponent,\n      title,\n      ...props\n    },\n    ref,\n  ) => {\n    const { type, ...restProps } = props;\n    const button = (\n      <button\n        ref={ref}\n        className={cn(\n          buttonVariants({ variant, size, shape }),\n          disabled && \"cursor-not-allowed opacity-50\",\n          className,\n        )}\n        disabled={loading || disabled}\n        type={type ?? \"button\"}\n        {...restProps}\n      >\n        {loading && <Loader size={size === \"lg\" ? 16 : 14} />}\n        {!loading && renderIconNode(IconComponent)}\n\n        {children}\n      </button>\n    );\n\n    if (title) {\n      return <Tooltip content={title} render={button} />;\n    }\n\n    return button;\n  },\n);\n\nButton.displayName = \"Button\";\n\n/**\n * Square button with a rotating arrows icon, used to trigger data refresh actions.\n *\n * @example\n * ```tsx\n * <RefreshButton loading={isRefreshing} onClick={refresh} />\n * ```\n */\nexport const RefreshButton = ({\n  \"aria-label\": ariaLabel = \"Refresh\",\n  loading,\n  ...props\n}: ButtonProps) => (\n  <Button shape=\"square\" aria-label={ariaLabel} {...props}>\n    <ArrowsClockwise\n      className={cn({\n        \"animate-refresh\": loading,\n        \"size-4.5\": props.size === \"base\" || !props.size,\n        \"size-4\": props.size === \"sm\",\n        \"size-5\": props.size === \"lg\",\n      })}\n    />\n  </Button>\n);\n\n/**\n * Anchor element styled as a button. Integrates with `LinkProvider` for framework routing.\n *\n * @example\n * ```tsx\n * <LinkButton href=\"/settings\" variant=\"ghost\">Settings</LinkButton>\n * ```\n */\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkButtonProps>(\n  (\n    {\n      children,\n      className,\n      external,\n      href,\n      shape = \"base\",\n      size = \"base\",\n      variant = \"ghost\",\n      icon: IconComponent,\n      // linksExternal = false,\n      ...props\n    },\n    ref,\n  ) => {\n    const LinkComponent = useLinkComponent();\n    const externalProps = external\n      ? { target: \"_blank\", rel: \"noopener noreferrer\" }\n      : {};\n\n    return (\n      <LinkComponent\n        ref={ref}\n        className={cn(\n          buttonVariants({ variant, size, shape }),\n          \"flex items-center no-underline!\",\n          className,\n        )}\n        href={href}\n        to={typeof href === \"string\" ? href : undefined}\n        {...externalProps}\n        {...props}\n      >\n        {renderIconNode(IconComponent)}\n        {children}\n      </LinkComponent>\n    );\n  },\n);\n\nLinkButton.displayName = \"LinkButton\";\n"],"names":["KUMO_BUTTON_VARIANTS","KUMO_BUTTON_DEFAULT_VARIANTS","buttonVariants","variant","size","shape","isCompactShape","cn","renderIconNode","IconComponent","React","Button","children","className","disabled","loading","title","props","ref","type","restProps","button","jsxs","Loader","jsx","Tooltip","RefreshButton","ariaLabel","ArrowsClockwise","LinkButton","external","href","LinkComponent","useLinkComponent","externalProps"],"mappings":"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"}