@cloudflare/kumo 2.2.0 → 2.2.2

package/dist/chunks/{empty-jwan4d5hqjocakhm.js.map → empty-n3r7xutkb9sxjaso.js.map}

@@ -1 +1 @@
-{"version":3,"file":"empty-jwan4d5hqjocakhm.js","sources":["../../src/components/empty/empty.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { useState } from \"react\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\n\n/** Empty state size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_EMPTY_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"px-6 py-8 gap-4\",\n      description: \"Compact empty state for smaller containers\",\n    },\n    base: {\n      classes: \"px-10 py-16 gap-6\",\n      description: \"Default empty state size\",\n    },\n    lg: {\n      classes: \"px-12 py-20 gap-8\",\n      description: \"Large empty state for prominent placement\",\n    },\n  },\n} as const;\n\nexport const KUMO_EMPTY_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport type KumoEmptySize = keyof typeof KUMO_EMPTY_VARIANTS.size;\n\nexport interface KumoEmptyVariantsProps {\n  /**\n   * Size of the empty state container.\n   * - `\"sm\"` — Compact empty state for smaller containers\n   * - `\"base\"` — Default empty state size\n   * - `\"lg\"` — Large empty state for prominent placement\n   * @default \"base\"\n   */\n  size?: KumoEmptySize;\n}\n\nexport function emptyVariants({\n  size = KUMO_EMPTY_DEFAULT_VARIANTS.size,\n}: KumoEmptyVariantsProps = {}) {\n  return cn(\n    \"flex w-full flex-col items-center rounded-xl border border-kumo-fill bg-kumo-control text-kumo-default\",\n    resolveVariant(KUMO_EMPTY_VARIANTS.size, size, KUMO_EMPTY_DEFAULT_VARIANTS.size).classes,\n  );\n}\n\n/**\n * Empty state component props.\n *\n * @example\n * ```tsx\n * <Empty\n *   icon={<PackageIcon size={48} />}\n *   title=\"No packages found\"\n *   description=\"Get started by installing your first package.\"\n *   commandLine=\"npm install @cloudflare/kumo\"\n * />\n * ```\n */\nexport interface EmptyProps extends KumoEmptyVariantsProps {\n  /** Decorative icon displayed above the title (e.g. from `@phosphor-icons/react`). */\n  icon?: React.ReactNode;\n  /** Primary heading text for the empty state. */\n  title: string;\n  /** Secondary description text displayed below the title. */\n  description?: string;\n  /** Shell command displayed in a copyable code block. */\n  commandLine?: string;\n  /** Additional content (buttons, links) rendered below the description. */\n  contents?: React.ReactNode;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n}\n\n/**\n * Placeholder shown when a list, table, or page has no content to display.\n *\n * @example\n * ```tsx\n * <Empty title=\"No results found\" description=\"Try adjusting your search.\" />\n * ```\n */\nexport function Empty({\n  icon,\n  title,\n  description,\n  commandLine,\n  contents,\n  size = \"base\",\n  className,\n}: EmptyProps) {\n  const [emptyStateCopied, setEmptyStateCopied] = useState<boolean>(false);\n\n  return (\n    <div className={cn(emptyVariants({ size }), className)}>\n      {icon}\n      <h2 className=\"text-2xl font-semibold\">{title}</h2>\n\n      {description && (\n        <p className=\"max-w-140 text-center text-kumo-subtle\">{description}</p>\n      )}\n\n      {commandLine && (\n        <div\n          className={cn(\n            \"group/cmd relative inline-flex h-10 max-w-8/10 transform-gpu items-center gap-2 rounded-lg font-mono shadow-sm\",\n            \"bg-kumo-overlay pr-2 pl-3\",\n            \"transition-all duration-300 hover:border-kumo-interact/80 hover:shadow-md\",\n            \"border border-kumo-fill/60\",\n          )}\n        >\n          <span className=\"text-xs text-kumo-inactive select-none\">$</span>\n          <span className=\"no-scrollbar overflow-scroll text-base whitespace-nowrap text-kumo-brand\">\n            {commandLine}\n          </span>\n          <Button\n            className=\"group\"\n            size=\"sm\"\n            variant=\"ghost\"\n            shape=\"square\"\n            aria-label=\"Copy command\"\n            onClick={async () => {\n              setEmptyStateCopied(true);\n              setTimeout(() => {\n                setEmptyStateCopied(false);\n              }, 1000);\n              await navigator.clipboard.writeText(commandLine);\n            }}\n          >\n            {emptyStateCopied ? (\n              <CheckIcon size={16} className=\"animate-bounce-in text-kumo-success\" />\n            ) : (\n              <CopyIcon\n                size={16}\n                className=\"text-kumo-inactive group-hover:text-kumo-brand\"\n              />\n            )}\n          </Button>\n        </div>\n      )}\n\n      {contents}\n    </div>\n  );\n}\n"],"names":["KUMO_EMPTY_VARIANTS","KUMO_EMPTY_DEFAULT_VARIANTS","emptyVariants","size","cn","resolveVariant","Empty","icon","title","description","commandLine","contents","className","emptyStateCopied","setEmptyStateCopied","useState","jsxs","jsx","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;;AAOO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,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;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AACR;AAeO,SAASC,EAAc;AAAA,EAC5B,MAAAC,IAAOF,EAA4B;AACrC,IAA4B,IAAI;AAC9B,SAAOG;AAAA,IACL;AAAA,IACAC,EAAeL,EAAoB,MAAMG,GAAMF,EAA4B,IAAI,EAAE;AAAA,EAAA;AAErF;AAsCO,SAASK,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAR,IAAO;AAAA,EACP,WAAAS;AACF,GAAe;AACb,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAkB,EAAK;AAEvE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWZ,EAAGF,EAAc,EAAE,MAAAC,EAAA,CAAM,GAAGS,CAAS,GAClD,UAAA;AAAA,IAAAL;AAAA,IACD,gBAAAU,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAT,GAAM;AAAA,IAE7CC,KACC,gBAAAQ,EAAC,KAAA,EAAE,WAAU,0CAA0C,UAAAR,GAAY;AAAA,IAGpEC,KACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWZ;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAa,EAAC,QAAA,EAAK,WAAU,0CAAyC,UAAA,KAAC;AAAA,UAC1D,gBAAAA,EAAC,QAAA,EAAK,WAAU,4EACb,UAAAP,GACH;AAAA,UACA,gBAAAO;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,cAAW;AAAA,cACX,SAAS,YAAY;AACnB,gBAAAJ,EAAoB,EAAI,GACxB,WAAW,MAAM;AACf,kBAAAA,EAAoB,EAAK;AAAA,gBAC3B,GAAG,GAAI,GACP,MAAM,UAAU,UAAU,UAAUJ,CAAW;AAAA,cACjD;AAAA,cAEC,cACC,gBAAAO,EAACE,GAAA,EAAU,MAAM,IAAI,WAAU,uCAAsC,IAErE,gBAAAF;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHT;AAAA,EAAA,GACH;AAEJ;"}
+{"version":3,"file":"empty-n3r7xutkb9sxjaso.js","sources":["../../src/components/empty/empty.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"@phosphor-icons/react\";\nimport { useState } from \"react\";\nimport { Button } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\n\n/** Empty state size variant definitions mapping sizes to their Tailwind classes. */\nexport const KUMO_EMPTY_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"px-6 py-8 gap-4\",\n      description: \"Compact empty state for smaller containers\",\n    },\n    base: {\n      classes: \"px-10 py-16 gap-6\",\n      description: \"Default empty state size\",\n    },\n    lg: {\n      classes: \"px-12 py-20 gap-8\",\n      description: \"Large empty state for prominent placement\",\n    },\n  },\n} as const;\n\nexport const KUMO_EMPTY_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport type KumoEmptySize = keyof typeof KUMO_EMPTY_VARIANTS.size;\n\nexport interface KumoEmptyVariantsProps {\n  /**\n   * Size of the empty state container.\n   * - `\"sm\"` — Compact empty state for smaller containers\n   * - `\"base\"` — Default empty state size\n   * - `\"lg\"` — Large empty state for prominent placement\n   * @default \"base\"\n   */\n  size?: KumoEmptySize;\n}\n\nexport function emptyVariants({\n  size = KUMO_EMPTY_DEFAULT_VARIANTS.size,\n}: KumoEmptyVariantsProps = {}) {\n  return cn(\n    \"flex w-full flex-col items-center rounded-xl border border-kumo-fill bg-kumo-control text-kumo-default\",\n    resolveVariant(KUMO_EMPTY_VARIANTS.size, size, KUMO_EMPTY_DEFAULT_VARIANTS.size).classes,\n  );\n}\n\n/**\n * Empty state component props.\n *\n * @example\n * ```tsx\n * <Empty\n *   icon={<PackageIcon size={48} />}\n *   title=\"No packages found\"\n *   description=\"Get started by installing your first package.\"\n *   commandLine=\"npm install @cloudflare/kumo\"\n * />\n * ```\n */\nexport interface EmptyProps extends KumoEmptyVariantsProps {\n  /** Decorative icon displayed above the title (e.g. from `@phosphor-icons/react`). */\n  icon?: React.ReactNode;\n  /** Primary heading text for the empty state. */\n  title: string;\n  /** Secondary description text displayed below the title. */\n  description?: string;\n  /** Shell command displayed in a copyable code block. */\n  commandLine?: string;\n  /** Additional content (buttons, links) rendered below the description. */\n  contents?: React.ReactNode;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n}\n\n/**\n * Placeholder shown when a list, table, or page has no content to display.\n *\n * @example\n * ```tsx\n * <Empty title=\"No results found\" description=\"Try adjusting your search.\" />\n * ```\n */\nexport function Empty({\n  icon,\n  title,\n  description,\n  commandLine,\n  contents,\n  size = \"base\",\n  className,\n}: EmptyProps) {\n  const [emptyStateCopied, setEmptyStateCopied] = useState<boolean>(false);\n\n  return (\n    <div className={cn(emptyVariants({ size }), className)}>\n      {icon}\n      <h2 className=\"text-2xl font-semibold\">{title}</h2>\n\n      {description && (\n        <p className=\"max-w-140 text-center text-kumo-subtle\">{description}</p>\n      )}\n\n      {commandLine && (\n        <div\n          className={cn(\n            \"group/cmd relative inline-flex h-10 max-w-8/10 transform-gpu items-center gap-2 rounded-lg font-mono shadow-sm\",\n            \"bg-kumo-overlay pr-2 pl-3\",\n            \"transition-all duration-300 hover:border-kumo-interact/80 hover:shadow-md\",\n            \"border border-kumo-fill/60\",\n          )}\n        >\n          <span className=\"text-xs text-kumo-inactive select-none\">$</span>\n          <span className=\"no-scrollbar overflow-scroll text-base whitespace-nowrap text-kumo-brand\">\n            {commandLine}\n          </span>\n          <Button\n            className=\"group\"\n            size=\"sm\"\n            variant=\"ghost\"\n            shape=\"square\"\n            aria-label=\"Copy command\"\n            onClick={async () => {\n              setEmptyStateCopied(true);\n              setTimeout(() => {\n                setEmptyStateCopied(false);\n              }, 1000);\n              await navigator.clipboard.writeText(commandLine);\n            }}\n          >\n            {emptyStateCopied ? (\n              <CheckIcon size={16} className=\"animate-bounce-in text-kumo-success\" />\n            ) : (\n              <CopyIcon\n                size={16}\n                className=\"text-kumo-inactive group-hover:text-kumo-brand\"\n              />\n            )}\n          </Button>\n        </div>\n      )}\n\n      {contents}\n    </div>\n  );\n}\n"],"names":["KUMO_EMPTY_VARIANTS","KUMO_EMPTY_DEFAULT_VARIANTS","emptyVariants","size","cn","resolveVariant","Empty","icon","title","description","commandLine","contents","className","emptyStateCopied","setEmptyStateCopied","useState","jsxs","jsx","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;;AAOO,MAAMA,IAAsB;AAAA,EACjC,MAAM;AAAA,IACJ,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;AAEJ,GAEaC,IAA8B;AAAA,EACzC,MAAM;AACR;AAeO,SAASC,EAAc;AAAA,EAC5B,MAAAC,IAAOF,EAA4B;AACrC,IAA4B,IAAI;AAC9B,SAAOG;AAAA,IACL;AAAA,IACAC,EAAeL,EAAoB,MAAMG,GAAMF,EAA4B,IAAI,EAAE;AAAA,EAAA;AAErF;AAsCO,SAASK,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAR,IAAO;AAAA,EACP,WAAAS;AACF,GAAe;AACb,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAkB,EAAK;AAEvE,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWZ,EAAGF,EAAc,EAAE,MAAAC,EAAA,CAAM,GAAGS,CAAS,GAClD,UAAA;AAAA,IAAAL;AAAA,IACD,gBAAAU,EAAC,MAAA,EAAG,WAAU,0BAA0B,UAAAT,GAAM;AAAA,IAE7CC,KACC,gBAAAQ,EAAC,KAAA,EAAE,WAAU,0CAA0C,UAAAR,GAAY;AAAA,IAGpEC,KACC,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWZ;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAa,EAAC,QAAA,EAAK,WAAU,0CAAyC,UAAA,KAAC;AAAA,UAC1D,gBAAAA,EAAC,QAAA,EAAK,WAAU,4EACb,UAAAP,GACH;AAAA,UACA,gBAAAO;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,cAAW;AAAA,cACX,SAAS,YAAY;AACnB,gBAAAJ,EAAoB,EAAI,GACxB,WAAW,MAAM;AACf,kBAAAA,EAAoB,EAAK;AAAA,gBAC3B,GAAG,GAAI,GACP,MAAM,UAAU,UAAU,UAAUJ,CAAW;AAAA,cACjD;AAAA,cAEC,cACC,gBAAAO,EAACE,GAAA,EAAU,MAAM,IAAI,WAAU,uCAAsC,IAErE,gBAAAF;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHT;AAAA,EAAA,GACH;AAEJ;"}

package/dist/chunks/{field-yhlyu6fy0qi1ewtl.js → field-l1oapopp6kjnephi.js}

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
 import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
-import { L as f } from "./label-kaz4uxdt1yf3i5x5.js";
+import { L as f } from "./label-i0bj94d43irz0k1x.js";
 import { O as u, P as p, aR as x, aS as d } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 function y(e) {
   if (e)
@@ -74,4 +74,4 @@ export {
   g as f,
   y as n
 };
-//# sourceMappingURL=field-yhlyu6fy0qi1ewtl.js.map
+//# sourceMappingURL=field-l1oapopp6kjnephi.js.map

package/dist/chunks/{field-yhlyu6fy0qi1ewtl.js.map → field-l1oapopp6kjnephi.js.map}

@@ -1 +1 @@
-{"version":3,"file":"field-yhlyu6fy0qi1ewtl.js","sources":["../../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/**\n * Normalizes an error prop that may be a string or structured object\n * into the `{ message, match }` shape expected by `<Field>`.\n *\n * Returns `undefined` when the input is falsy.\n */\nexport function normalizeFieldError(\n  error: string | { message: ReactNode; match: FieldErrorMatch } | undefined,\n): { message: ReactNode; match: FieldErrorMatch } | undefined {\n  if (!error) return undefined;\n  if (typeof error === \"string\") return { message: error, match: true };\n  return error;\n}\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n  // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n  /**\n   * When true, places the control (checkbox/switch) before the label visually.\n   * When false (default), places the label before the control.\n   * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n   */\n  controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n  controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n  return cn(\n    // Base styles - vertical layout (default)\n    \"grid gap-2\",\n\n    // Horizontal layout for checkbox and switch\n    // Default: Grid auto-reverses in RTL (desired)\n    \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n    \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n    // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n    // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n    controlFirst && [\n      \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n      \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n      \"[&>label]:flex-1\",\n    ],\n  );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n  | boolean\n  | \"badInput\"\n  | \"customError\"\n  | \"patternMismatch\"\n  | \"rangeOverflow\"\n  | \"rangeUnderflow\"\n  | \"stepMismatch\"\n  | \"tooLong\"\n  | \"tooShort\"\n  | \"typeMismatch\"\n  | \"valid\"\n  | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n *   <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n *   <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n  /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n  children: ReactNode;\n  /** The label content — can be a string or any React node. */\n  label: ReactNode;\n  /**\n   * When explicitly `false`, shows gray \"(optional)\" text after the label.\n   * When `true` or `undefined`, no indicator is shown.\n   */\n  required?: boolean;\n  /** Tooltip content displayed next to the label via an info icon. */\n  labelTooltip?: ReactNode;\n  /** Validation error with a message and a browser `ValidityState` match key. */\n  error?: {\n    message: ReactNode;\n    match: FieldErrorMatch;\n  };\n  /** Helper text displayed below the control (hidden when `error` is present). */\n  description?: ReactNode;\n  /** When `true`, places the control before the label (for checkbox/switch layouts). */\n  controlFirst?: boolean;\n  /**\n   * When `true`, Field renders layout, description, and error but skips\n   * the `<label>` element. Use when the child component provides its own\n   * accessible label (e.g. Select uses Base UI's `Select.Label` to avoid\n   * hover/focus coupling from native `<label>`).\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n *   <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n  children,\n  label,\n  required,\n  labelTooltip,\n  error,\n  description,\n  controlFirst = false,\n  hideLabel = false,\n}: FieldProps) {\n  // Show \"(optional)\" when required is explicitly false\n  const showOptional = required === false;\n\n  return (\n    <FieldBase.Root className={fieldVariants({ controlFirst })}>\n      {!hideLabel && (\n        <FieldBase.Label className=\"m-0 select-none text-base font-medium text-kumo-default\">\n          <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n            {label}\n          </Label>\n        </FieldBase.Label>\n      )}\n      {children}\n      {error ? (\n        <FieldBase.Error\n          className={cn(\n            \"text-sm leading-snug text-kumo-danger\",\n            // Span full width in horizontal layout\n            \"col-span-full\",\n          )}\n          match={error.match}\n        >\n          {error.message}\n        </FieldBase.Error>\n      ) : (\n        description && (\n          <FieldBase.Description\n            className={cn(\n              \"text-sm leading-snug text-kumo-subtle\",\n              // Span full width in horizontal layout\n              \"col-span-full\",\n            )}\n          >\n            {description}\n          </FieldBase.Description>\n        )\n      )}\n    </FieldBase.Root>\n  );\n}\n"],"names":["normalizeFieldError","error","KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","description","hideLabel","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAWO,SAASA,EACdC,GAC4D;AAC5D,MAAKA;AACL,WAAI,OAAOA,KAAU,WAAiB,EAAE,SAASA,GAAO,OAAO,GAAA,IACxDA;AACT;AAGO,MAAMC,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AA6EO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAV;AAAA,EACA,aAAAW;AAAA,EACA,cAAAP,IAAe;AAAA,EACf,WAAAQ,IAAY;AACd,GAAe;AAEb,QAAMC,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACtD,UAAA;AAAA,IAAA,CAACQ,KACA,gBAAAI,EAACC,GAAA,EAAgB,WAAU,2DACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IAEDH;AAAA,IACAP,IACC,gBAAAgB;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOL,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTW,KACE,gBAAAK;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}
+{"version":3,"file":"field-l1oapopp6kjnephi.js","sources":["../../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/**\n * Normalizes an error prop that may be a string or structured object\n * into the `{ message, match }` shape expected by `<Field>`.\n *\n * Returns `undefined` when the input is falsy.\n */\nexport function normalizeFieldError(\n  error: string | { message: ReactNode; match: FieldErrorMatch } | undefined,\n): { message: ReactNode; match: FieldErrorMatch } | undefined {\n  if (!error) return undefined;\n  if (typeof error === \"string\") return { message: error, match: true };\n  return error;\n}\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n  // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n  /**\n   * When true, places the control (checkbox/switch) before the label visually.\n   * When false (default), places the label before the control.\n   * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n   */\n  controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n  controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n  return cn(\n    // Base styles - vertical layout (default)\n    \"grid gap-2\",\n\n    // Horizontal layout for checkbox and switch\n    // Default: Grid auto-reverses in RTL (desired)\n    \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n    \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n    // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n    // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n    controlFirst && [\n      \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n      \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n      \"[&>label]:flex-1\",\n    ],\n  );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n  | boolean\n  | \"badInput\"\n  | \"customError\"\n  | \"patternMismatch\"\n  | \"rangeOverflow\"\n  | \"rangeUnderflow\"\n  | \"stepMismatch\"\n  | \"tooLong\"\n  | \"tooShort\"\n  | \"typeMismatch\"\n  | \"valid\"\n  | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n *   <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n *   <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n  /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n  children: ReactNode;\n  /** The label content — can be a string or any React node. */\n  label: ReactNode;\n  /**\n   * When explicitly `false`, shows gray \"(optional)\" text after the label.\n   * When `true` or `undefined`, no indicator is shown.\n   */\n  required?: boolean;\n  /** Tooltip content displayed next to the label via an info icon. */\n  labelTooltip?: ReactNode;\n  /** Validation error with a message and a browser `ValidityState` match key. */\n  error?: {\n    message: ReactNode;\n    match: FieldErrorMatch;\n  };\n  /** Helper text displayed below the control (hidden when `error` is present). */\n  description?: ReactNode;\n  /** When `true`, places the control before the label (for checkbox/switch layouts). */\n  controlFirst?: boolean;\n  /**\n   * When `true`, Field renders layout, description, and error but skips\n   * the `<label>` element. Use when the child component provides its own\n   * accessible label (e.g. Select uses Base UI's `Select.Label` to avoid\n   * hover/focus coupling from native `<label>`).\n   * @default false\n   */\n  hideLabel?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n *   <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n  children,\n  label,\n  required,\n  labelTooltip,\n  error,\n  description,\n  controlFirst = false,\n  hideLabel = false,\n}: FieldProps) {\n  // Show \"(optional)\" when required is explicitly false\n  const showOptional = required === false;\n\n  return (\n    <FieldBase.Root className={fieldVariants({ controlFirst })}>\n      {!hideLabel && (\n        <FieldBase.Label className=\"m-0 select-none text-base font-medium text-kumo-default\">\n          <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n            {label}\n          </Label>\n        </FieldBase.Label>\n      )}\n      {children}\n      {error ? (\n        <FieldBase.Error\n          className={cn(\n            \"text-sm leading-snug text-kumo-danger\",\n            // Span full width in horizontal layout\n            \"col-span-full\",\n          )}\n          match={error.match}\n        >\n          {error.message}\n        </FieldBase.Error>\n      ) : (\n        description && (\n          <FieldBase.Description\n            className={cn(\n              \"text-sm leading-snug text-kumo-subtle\",\n              // Span full width in horizontal layout\n              \"col-span-full\",\n            )}\n          >\n            {description}\n          </FieldBase.Description>\n        )\n      )}\n    </FieldBase.Root>\n  );\n}\n"],"names":["normalizeFieldError","error","KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","description","hideLabel","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAWO,SAASA,EACdC,GAC4D;AAC5D,MAAKA;AACL,WAAI,OAAOA,KAAU,WAAiB,EAAE,SAASA,GAAO,OAAO,GAAA,IACxDA;AACT;AAGO,MAAMC,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AA6EO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAV;AAAA,EACA,aAAAW;AAAA,EACA,cAAAP,IAAe;AAAA,EACf,WAAAQ,IAAY;AACd,GAAe;AAEb,QAAMC,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACtD,UAAA;AAAA,IAAA,CAACQ,KACA,gBAAAI,EAACC,GAAA,EAAgB,WAAU,2DACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IAEDH;AAAA,IACAP,IACC,gBAAAgB;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOL,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTW,KACE,gBAAAK;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}

package/dist/chunks/{input-area-d85jzxlnvx7mc3x9.js → input-area-gudamx1ruz8rxiw2.js}

@@ -1,10 +1,10 @@
 "use client";
 import { jsx as a } from "react/jsx-runtime";
-import { i as N } from "./input-cyils8jxj8e0udr7.js";
+import { i as N } from "./input-i3os21puacqw4r75.js";
 import { c as x } from "./cn-ct4n7r74mh8y0f48.js";
 import * as y from "react";
 import { useCallback as I } from "react";
-import { F as b, n as w } from "./field-yhlyu6fy0qi1ewtl.js";
+import { F as b, n as w } from "./field-l1oapopp6kjnephi.js";
 import { aT as E } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const u = y.forwardRef(
   (d, t) => {
@@ -75,4 +75,4 @@ export {
   u as I,
   j as T
 };
-//# sourceMappingURL=input-area-d85jzxlnvx7mc3x9.js.map
+//# sourceMappingURL=input-area-gudamx1ruz8rxiw2.js.map

package/dist/chunks/{input-area-d85jzxlnvx7mc3x9.js.map → input-area-gudamx1ruz8rxiw2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-area-d85jzxlnvx7mc3x9.js","sources":["../../src/components/input/input-area.tsx"],"sourcesContent":["import { inputVariants } from \"./input\";\nimport { cn } from \"../../utils/cn\";\nimport { useCallback, type ReactNode } from \"react\";\nimport * as React from \"react\";\nimport { Field as FieldBase } from \"@base-ui/react/field\";\nimport { Field as KumoField, normalizeFieldError, type FieldErrorMatch } from \"../field/field\";\n\nexport const InputArea = React.forwardRef<HTMLTextAreaElement, InputAreaProps>(\n  (props, ref) => {\n    const {\n      className,\n      onValueChange,\n      size = \"base\",\n      variant: variantProp,\n      onChange,\n      label,\n      labelTooltip,\n      description,\n      error,\n      ...inputProps\n    } = props;\n\n    // Deprecation warning for variant=\"error\"\n    if (process.env.NODE_ENV !== \"production\" && variantProp === \"error\") {\n      console.warn(\n        '[Kumo InputArea]: variant=\"error\" is deprecated. ' +\n          \"Error styling is now automatically applied when the `error` prop is truthy. \" +\n          \"Simply remove the variant prop and pass an error message instead.\",\n      );\n    }\n\n    // Auto-apply error styling when error prop is truthy\n    // Explicit variant prop takes precedence for backwards compatibility\n    const variant = variantProp ?? (error ? \"error\" : \"default\");\n\n    // Extract required from inputProps to pass to Field for label decoration\n    const { required } = inputProps;\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        onChange?.(event);\n        onValueChange?.(event.target.value);\n      },\n      [onChange, onValueChange],\n    );\n\n    const textareaClassName = cn(\n      inputVariants({ size, variant, focusIndicator: true }),\n      \"h-auto py-2\", // Input variant always comes with size, but it does not apply for textarea\n      className,\n    );\n\n    // Render with Field wrapper if label, error, or description is provided\n    // Use FieldBase.Control with render callback to ensure proper label-textarea association.\n    // The render callback receives props with the correct id/aria-labelledby from Field context.\n    if (label || error || description) {\n      return (\n        <KumoField\n          label={label}\n          required={required}\n          labelTooltip={labelTooltip}\n          description={description}\n          error={normalizeFieldError(error)}\n        >\n          <FieldBase.Control\n            render={(controlProps) => (\n              <textarea\n                {...controlProps}\n                ref={ref}\n                className={textareaClassName}\n                onChange={handleChange}\n                {...inputProps}\n              />\n            )}\n          />\n        </KumoField>\n      );\n    }\n\n    // Render bare textarea without Field wrapper\n    return (\n      <textarea\n        ref={ref}\n        className={textareaClassName}\n        onChange={handleChange}\n        {...inputProps}\n      />\n    );\n  },\n);\n\nInputArea.displayName = \"InputArea\";\n\n/** Alias for InputArea — provided for discoverability when migrating from other libraries */\nexport const Textarea = InputArea;\n\n/**\n * InputArea component props\n * @property {ReactNode} [label] - Label content for the textarea (enables Field wrapper)\n * @property {ReactNode} [description] - Helper text displayed below the textarea\n * @property {string | { message: ReactNode, match: FieldErrorMatch }} [error] - Error message or validation error object\n */\nexport type InputAreaProps = {\n  onValueChange?: (value: string) => void;\n  variant?: \"default\" | \"error\";\n  size?: \"xs\" | \"sm\" | \"base\" | \"lg\";\n  // Then other custom props\n  children?: React.ReactNode;\n  className?: string;\n  /** Label content for the textarea (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 textarea */\n  description?: ReactNode;\n  /** Error message or validation error object */\n  error?: string | { message: ReactNode; match: FieldErrorMatch };\n\n  // Finally, spread the native input props (least important)\n} & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, \"size\">;\n"],"names":["InputArea","React","props","ref","className","onValueChange","size","variantProp","onChange","label","labelTooltip","description","error","inputProps","variant","required","handleChange","useCallback","event","textareaClassName","cn","inputVariants","jsx","KumoField","normalizeFieldError","FieldBase.Control","controlProps","Textarea"],"mappings":";;;;;;;;AAOO,MAAMA,IAAYC,EAAM;AAAA,EAC7B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,WAAAC;AAAA,MACA,eAAAC;AAAA,MACA,MAAAC,IAAO;AAAA,MACP,SAASC;AAAA,MACT,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,cAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDX;AAGJ,IAAI,QAAQ,IAAI,aAAa,gBAAgBK,MAAgB,WAC3D,QAAQ;AAAA,MACN;AAAA,IAAA;AAQJ,UAAMO,IAAUP,MAAgBK,IAAQ,UAAU,YAG5C,EAAE,UAAAG,MAAaF,GACfG,IAAeC;AAAA,MACnB,CAACC,MAAkD;AACjD,QAAAV,IAAWU,CAAK,GAChBb,IAAgBa,EAAM,OAAO,KAAK;AAAA,MACpC;AAAA,MACA,CAACV,GAAUH,CAAa;AAAA,IAAA,GAGpBc,IAAoBC;AAAA,MACxBC,EAAc,EAAE,MAAAf,GAAM,SAAAQ,GAAS,gBAAgB,IAAM;AAAA,MACrD;AAAA;AAAA,MACAV;AAAA,IAAA;AAMF,WAAIK,KAASG,KAASD,IAElB,gBAAAW;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,OAAAd;AAAA,QACA,UAAAM;AAAA,QACA,cAAAL;AAAA,QACA,aAAAC;AAAA,QACA,OAAOa,EAAoBZ,CAAK;AAAA,QAEhC,UAAA,gBAAAU;AAAA,UAACG;AAAAA,UAAA;AAAA,YACC,QAAQ,CAACC,MACP,gBAAAJ;AAAA,cAAC;AAAA,cAAA;AAAA,gBACE,GAAGI;AAAA,gBACJ,KAAAvB;AAAA,gBACA,WAAWgB;AAAA,gBACX,UAAUH;AAAA,gBACT,GAAGH;AAAA,cAAA;AAAA,YAAA;AAAA,UACN;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA,IAOJ,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAnB;AAAA,QACA,WAAWgB;AAAA,QACX,UAAUH;AAAA,QACT,GAAGH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEAb,EAAU,cAAc;AAGjB,MAAM2B,IAAW3B;"}
+{"version":3,"file":"input-area-gudamx1ruz8rxiw2.js","sources":["../../src/components/input/input-area.tsx"],"sourcesContent":["import { inputVariants } from \"./input\";\nimport { cn } from \"../../utils/cn\";\nimport { useCallback, type ReactNode } from \"react\";\nimport * as React from \"react\";\nimport { Field as FieldBase } from \"@base-ui/react/field\";\nimport { Field as KumoField, normalizeFieldError, type FieldErrorMatch } from \"../field/field\";\n\nexport const InputArea = React.forwardRef<HTMLTextAreaElement, InputAreaProps>(\n  (props, ref) => {\n    const {\n      className,\n      onValueChange,\n      size = \"base\",\n      variant: variantProp,\n      onChange,\n      label,\n      labelTooltip,\n      description,\n      error,\n      ...inputProps\n    } = props;\n\n    // Deprecation warning for variant=\"error\"\n    if (process.env.NODE_ENV !== \"production\" && variantProp === \"error\") {\n      console.warn(\n        '[Kumo InputArea]: variant=\"error\" is deprecated. ' +\n          \"Error styling is now automatically applied when the `error` prop is truthy. \" +\n          \"Simply remove the variant prop and pass an error message instead.\",\n      );\n    }\n\n    // Auto-apply error styling when error prop is truthy\n    // Explicit variant prop takes precedence for backwards compatibility\n    const variant = variantProp ?? (error ? \"error\" : \"default\");\n\n    // Extract required from inputProps to pass to Field for label decoration\n    const { required } = inputProps;\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        onChange?.(event);\n        onValueChange?.(event.target.value);\n      },\n      [onChange, onValueChange],\n    );\n\n    const textareaClassName = cn(\n      inputVariants({ size, variant, focusIndicator: true }),\n      \"h-auto py-2\", // Input variant always comes with size, but it does not apply for textarea\n      className,\n    );\n\n    // Render with Field wrapper if label, error, or description is provided\n    // Use FieldBase.Control with render callback to ensure proper label-textarea association.\n    // The render callback receives props with the correct id/aria-labelledby from Field context.\n    if (label || error || description) {\n      return (\n        <KumoField\n          label={label}\n          required={required}\n          labelTooltip={labelTooltip}\n          description={description}\n          error={normalizeFieldError(error)}\n        >\n          <FieldBase.Control\n            render={(controlProps) => (\n              <textarea\n                {...controlProps}\n                ref={ref}\n                className={textareaClassName}\n                onChange={handleChange}\n                {...inputProps}\n              />\n            )}\n          />\n        </KumoField>\n      );\n    }\n\n    // Render bare textarea without Field wrapper\n    return (\n      <textarea\n        ref={ref}\n        className={textareaClassName}\n        onChange={handleChange}\n        {...inputProps}\n      />\n    );\n  },\n);\n\nInputArea.displayName = \"InputArea\";\n\n/** Alias for InputArea — provided for discoverability when migrating from other libraries */\nexport const Textarea = InputArea;\n\n/**\n * InputArea component props\n * @property {ReactNode} [label] - Label content for the textarea (enables Field wrapper)\n * @property {ReactNode} [description] - Helper text displayed below the textarea\n * @property {string | { message: ReactNode, match: FieldErrorMatch }} [error] - Error message or validation error object\n */\nexport type InputAreaProps = {\n  onValueChange?: (value: string) => void;\n  variant?: \"default\" | \"error\";\n  size?: \"xs\" | \"sm\" | \"base\" | \"lg\";\n  // Then other custom props\n  children?: React.ReactNode;\n  className?: string;\n  /** Label content for the textarea (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 textarea */\n  description?: ReactNode;\n  /** Error message or validation error object */\n  error?: string | { message: ReactNode; match: FieldErrorMatch };\n\n  // Finally, spread the native input props (least important)\n} & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, \"size\">;\n"],"names":["InputArea","React","props","ref","className","onValueChange","size","variantProp","onChange","label","labelTooltip","description","error","inputProps","variant","required","handleChange","useCallback","event","textareaClassName","cn","inputVariants","jsx","KumoField","normalizeFieldError","FieldBase.Control","controlProps","Textarea"],"mappings":";;;;;;;;AAOO,MAAMA,IAAYC,EAAM;AAAA,EAC7B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,WAAAC;AAAA,MACA,eAAAC;AAAA,MACA,MAAAC,IAAO;AAAA,MACP,SAASC;AAAA,MACT,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,cAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDX;AAGJ,IAAI,QAAQ,IAAI,aAAa,gBAAgBK,MAAgB,WAC3D,QAAQ;AAAA,MACN;AAAA,IAAA;AAQJ,UAAMO,IAAUP,MAAgBK,IAAQ,UAAU,YAG5C,EAAE,UAAAG,MAAaF,GACfG,IAAeC;AAAA,MACnB,CAACC,MAAkD;AACjD,QAAAV,IAAWU,CAAK,GAChBb,IAAgBa,EAAM,OAAO,KAAK;AAAA,MACpC;AAAA,MACA,CAACV,GAAUH,CAAa;AAAA,IAAA,GAGpBc,IAAoBC;AAAA,MACxBC,EAAc,EAAE,MAAAf,GAAM,SAAAQ,GAAS,gBAAgB,IAAM;AAAA,MACrD;AAAA;AAAA,MACAV;AAAA,IAAA;AAMF,WAAIK,KAASG,KAASD,IAElB,gBAAAW;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,OAAAd;AAAA,QACA,UAAAM;AAAA,QACA,cAAAL;AAAA,QACA,aAAAC;AAAA,QACA,OAAOa,EAAoBZ,CAAK;AAAA,QAEhC,UAAA,gBAAAU;AAAA,UAACG;AAAAA,UAAA;AAAA,YACC,QAAQ,CAACC,MACP,gBAAAJ;AAAA,cAAC;AAAA,cAAA;AAAA,gBACE,GAAGI;AAAA,gBACJ,KAAAvB;AAAA,gBACA,WAAWgB;AAAA,gBACX,UAAUH;AAAA,gBACT,GAAGH;AAAA,cAAA;AAAA,YAAA;AAAA,UACN;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA,IAOJ,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAnB;AAAA,QACA,WAAWgB;AAAA,QACX,UAAUH;AAAA,QACT,GAAGH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEAb,EAAU,cAAc;AAGjB,MAAM2B,IAAW3B;"}

package/dist/chunks/{input-group-mu8yklweljytpt04.js → input-group-gy08vju7eoogil8k.js}

@@ -2,10 +2,10 @@
 import { jsx as s, jsxs as O, Fragment as $ } from "react/jsx-runtime";
 import P, { createContext as T, Children as _, isValidElement as E, useContext as V, forwardRef as m, cloneElement as H, useId as J, useMemo as Q } from "react";
 import { c as l } from "./cn-ct4n7r74mh8y0f48.js";
-import { I as W, i as A } from "./input-cyils8jxj8e0udr7.js";
-import { F as C } from "./field-yhlyu6fy0qi1ewtl.js";
-import { B as X } from "./button-gflkhovvkmt0ftzz.js";
-import { T as Y } from "./tooltip-caka3fmn1ogdc7q8.js";
+import { I as W, i as A } from "./input-i3os21puacqw4r75.js";
+import { F as C } from "./field-l1oapopp6kjnephi.js";
+import { B as X } from "./button-oevxukl0zmwoq4tb.js";
+import { T as Y } from "./tooltip-icvb67awe1zolz61.js";
 const G = {
   xs: {
     inputOuter: "px-1.5",
@@ -502,4 +502,4 @@ export {
   dt as K,
   pt as a
 };
-//# sourceMappingURL=input-group-mu8yklweljytpt04.js.map
+//# sourceMappingURL=input-group-gy08vju7eoogil8k.js.map

package/dist/chunks/{input-group-mu8yklweljytpt04.js.map → input-group-gy08vju7eoogil8k.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-group-mu8yklweljytpt04.js","sources":["../../src/components/input-group/context.ts","../../src/components/input-group/input-group-input.tsx","../../src/components/input-group/input-group-button.tsx","../../src/components/input-group/input-group-addon.tsx","../../src/components/input-group/input-group-suffix.tsx","../../src/components/input-group/input-group.tsx"],"sourcesContent":["import {\n  Children,\n  createContext,\n  isValidElement,\n  useContext,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport type { KumoInputSize } from \"../input/input\";\nimport type { FieldProps } from \"../field/field\";\n\n// Spacing model\n//\n// Each element type has a fixed outer padding. The container uses has-[] CSS\n// to reduce the input's padding on sides that touch an addon.\n//\n//   Input outer:       px-3 (12px base) — full padding when at the edge\n//   Input seam:        pl-2 / pr-2 (8px base) — applied by container has-[]\n//   Addon outer:       pl-2 / pr-2 (8px base) — on the container-edge side\n//   Addon seam:        nothing — input owns the gap entirely\n//\n// has-[] rules on the container override [&_input]:pl-{seam} when a start\n// addon is present, and [&_input]:pr-{seam} when an end addon is present.\n\nexport interface InputGroupSizeTokens {\n  /** Full outer padding — matches standalone Input (e.g. px-3). */\n  inputOuter: string;\n  /**\n   * Directional outer padding for Addon at the container edge.\n   *\n   * These MUST be static pl-/pr- strings (not derived at runtime via\n   * `\"px-N\".replace(…)`) so Tailwind JIT can detect them during its\n   * source-file scan. Dynamic string construction produces class names\n   * that never appear as literals, so Tailwind never generates the CSS.\n   */\n  addonOuterStart: string;\n  addonOuterEnd: string;\n  /**\n   * Reduced outer padding when the Addon contains a Button.\n   * Buttons have their own internal padding, so the Addon can use\n   * less outer padding to keep the visual gap balanced.\n   */\n  addonButtonOuterStart: string;\n  addonButtonOuterEnd: string;\n  /** pr- for suffix when no end addon. */\n  suffixPad: string;\n  fontSize: string;\n  /** Icon size in px. */\n  iconSize: number;\n}\n\nexport const INPUT_GROUP_SIZE: Record<KumoInputSize, InputGroupSizeTokens> = {\n  xs: {\n    inputOuter: \"px-1.5\",\n    addonOuterStart: \"pl-1.5\",\n    addonOuterEnd: \"pr-1.5\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-1.5\",\n    fontSize: \"text-xs\",\n    iconSize: 10,\n  },\n  sm: {\n    inputOuter: \"px-2\",\n    addonOuterStart: \"pl-1.5\",\n    addonOuterEnd: \"pr-1.5\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-2\",\n    fontSize: \"text-xs\",\n    iconSize: 13,\n  },\n  base: {\n    inputOuter: \"px-3\",\n    addonOuterStart: \"pl-2\",\n    addonOuterEnd: \"pr-2\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-3\",\n    fontSize: \"text-base\",\n    iconSize: 18,\n  },\n  lg: {\n    inputOuter: \"px-4\",\n    addonOuterStart: \"pl-2.5\",\n    addonOuterEnd: \"pr-2.5\",\n    addonButtonOuterStart: \"pl-1.5\",\n    addonButtonOuterEnd: \"pr-1.5\",\n    suffixPad: \"pr-4\",\n    fontSize: \"text-base\",\n    iconSize: 20,\n  },\n};\n\n// Build the has-[] container classes that reduce input padding when addons\n// are present. These are static strings so Tailwind JIT can detect them.\nexport const INPUT_GROUP_HAS_CLASSES: Record<KumoInputSize, string> = {\n  xs: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1\",\n  ].join(\" \"),\n  sm: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1.5\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1.5\",\n  ].join(\" \"),\n  base: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2\",\n  ].join(\" \"),\n  lg: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2.5\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2.5\",\n  ].join(\" \"),\n};\n\n// Context\n\n/**\n * Props for `InputGroup.Root`. Focus mode is auto-detected from children\n * (see `detectFocusMode`), so it is not part of the public or internal API.\n */\nexport interface InputGroupRootPropsInternal\n  extends HTMLAttributes<HTMLElement>,\n    Partial<\n      Pick<\n        FieldProps,\n        \"label\" | \"description\" | \"error\" | \"required\" | \"labelTooltip\"\n      >\n    > {\n  size?: KumoInputSize | undefined;\n  disabled?: boolean;\n}\n\n/** Public InputGroup.Root props — identical to the internal type. */\nexport type InputGroupRootProps = InputGroupRootPropsInternal;\n\nexport interface InputGroupContextValue {\n  size?: KumoInputSize;\n  focusMode: \"container\" | \"individual\" | \"hybrid\";\n  disabled: boolean;\n  error?: FieldProps[\"error\"];\n  /** Auto-generated id for the input element; used by the invisible label overlay. */\n  inputId: string;\n}\n\nexport const InputGroupContext = createContext<InputGroupContextValue | null>(\n  null,\n);\n\n/**\n * Set to `true` by `InputGroup.Addon` so that `InputGroup.Button` can detect\n * whether it's wrapped in an Addon. Ghost buttons should always live inside\n * an Addon for correct spacing.\n */\nexport const InputGroupAddonContext = createContext(false);\n\n/**\n * Reads InputGroupContext and warns in development when the context is null\n * (i.e. when a sub-component is rendered outside of `<InputGroup>`).\n */\nexport function useInputGroupContext(componentName: string) {\n  const context = useContext(InputGroupContext);\n  if (process.env.NODE_ENV !== \"production\" && !context) {\n    console.warn(\n      `<InputGroup.${componentName}> must be used within <InputGroup>. Falling back to default values.`,\n    );\n  }\n  return context;\n}\n\n/**\n * Partitions InputGroup children for hybrid focus mode.\n *\n * Container zone: Addon, Input, Suffix, text nodes — everything that should\n * share a single container-style border.\n *\n * Individual zone: Direct `InputGroup.Button` elements that manage their own\n * border and focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function partitionChildren(children: ReactNode): {\n  containerZone: ReactNode[];\n  individualZone: ReactNode[];\n} {\n  const containerZone: ReactNode[] = [];\n  const individualZone: ReactNode[] = [];\n\n  Children.forEach(children, (child) => {\n    if (\n      isValidElement(child) &&\n      (child.type as { displayName?: string })?.displayName ===\n        \"InputGroup.Button\"\n    ) {\n      individualZone.push(child);\n    } else {\n      containerZone.push(child);\n    }\n  });\n\n  return { containerZone, individualZone };\n}\n\n/**\n * Analyzes the direct children of `InputGroup` to determine the focus mode.\n *\n * Returns `\"hybrid\"` when BOTH an `InputGroup.Addon` AND a non-ghost direct\n * `InputGroup.Button` are present. In hybrid mode, Addon+Input share a\n * container-style border while Buttons get individual borders.\n *\n * Returns `\"individual\"` when a non-ghost direct `InputGroup.Button` is\n * present WITHOUT any `InputGroup.Addon`. This signals a toolbar/pagination\n * layout where each element manages its own focus ring.\n *\n * Returns `\"container\"` (default) in all other cases — the container owns a\n * single shared focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function detectFocusMode(\n  children: ReactNode,\n): \"container\" | \"individual\" | \"hybrid\" {\n  let hasNonGhostDirectButton = false;\n  let hasAddon = false;\n\n  Children.forEach(children, (child) => {\n    if (!isValidElement(child)) return;\n\n    // Identify components by displayName to avoid circular imports.\n    const type = child.type;\n    const displayName =\n      typeof type === \"function\" || typeof type === \"object\"\n        ? (type as { displayName?: string }).displayName\n        : undefined;\n\n    if (displayName === \"InputGroup.Addon\") {\n      hasAddon = true;\n      return;\n    }\n\n    if (displayName !== \"InputGroup.Button\") return;\n\n    // A direct-child Button is by definition NOT inside an Addon (Addon's\n    // children are children of the Addon element, not of InputGroup).\n    // Check whether the variant is explicitly non-ghost.\n    const variant = (child.props as { variant?: string }).variant;\n    if (variant !== undefined && variant !== \"ghost\") {\n      hasNonGhostDirectButton = true;\n    }\n  });\n\n  if (hasNonGhostDirectButton && hasAddon) return \"hybrid\";\n  if (hasNonGhostDirectButton) return \"individual\";\n  return \"container\";\n}\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Input as InputExternal, type InputProps } from \"../input/input\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\n/** Props for InputGroup.Input — omits Field props since InputGroup handles them. */\nexport type InputGroupInputProps = Omit<\n  InputProps,\n  \"label\" | \"labelTooltip\" | \"description\" | \"error\" | \"size\" | \"disabled\"\n>;\n\n/**\n * Text input that inherits size, disabled, and error state from InputGroup context.\n * Automatically sets `aria-invalid` when parent has an error.\n */\nexport const Input = forwardRef<HTMLInputElement, InputGroupInputProps>(\n  (props, ref) => {\n    const context = useInputGroupContext(\"Input\");\n\n    // Warn when props that belong on <InputGroup> are passed directly\n    if (process.env.NODE_ENV !== \"production\" && context) {\n      if ((props as any).size !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Set `size` on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).disabled !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Set `disabled` on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).label !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Use the `label` prop on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).description !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Use <InputGroup.Suffix> instead of passing `description` to <InputGroup.Input>.\",\n        );\n      }\n    }\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n    const isIndividual = context?.focusMode === \"individual\";\n\n    // Auto-set aria-invalid when error is present in context\n    const hasError = Boolean(context?.error);\n\n    // Use explicit id if provided, otherwise fall back to context id\n    // (links the input to the invisible label overlay for click-to-focus).\n    const inputId = props.id ?? context?.inputId;\n\n    return (\n      <InputExternal\n        ref={ref}\n        size={context?.size}\n        disabled={context?.disabled || (props as any).disabled}\n        aria-invalid={hasError || props[\"aria-invalid\"]}\n        {...props}\n        id={inputId}\n        className={cn(\n          // Base input layout: fill height, allow shrinking, strip native border/radius\n          \"flex h-full min-w-0 grow items-center rounded-none border-0 bg-transparent font-sans\",\n          // Always use full outer padding — the container's has-[] rules reduce\n          // pl/pr to inputSeam on sides that touch an addon.\n          tokens.inputOuter,\n          // Truncate overflowing text with \"…\" instead of expanding the input\n          \"text-ellipsis\",\n          // Individual mode: each element owns its own border instead of sharing a container ring\n          isIndividual\n            ? [\n                // Own border replaces the container's shared ring\n                \"relative ring-0 border border-kumo-line\",\n                // Inherit border-radius only on outer edges; inner edges are flat\n                \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n                // Collapse double borders between adjacent elements\n                \"not-first:border-l-0\",\n                // Hovered element renders above idle siblings to show full border\n                \"hover:z-[1] hover:border-kumo-line\",\n                // Focused element renders above hovered siblings for focus indicator\n                \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n              ].join(\" \")\n            : // Container mode: kill all focus indicators — the container handles them\n              // z-[1] lifts the input above the invisible label overlay so cursor/selection work\n              \"relative z-[1] ring-0! shadow-none outline-none focus:ring-0! focus:outline-none\",\n          props.className,\n        )}\n      />\n    );\n  },\n);\nInput.displayName = \"InputGroup.Input\";\n","import React, {\n  forwardRef,\n  useContext,\n  type PropsWithChildren,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { type ButtonProps, Button as ButtonExternal } from \"../button/button\";\nimport { Tooltip, type KumoTooltipSide } from \"../tooltip/tooltip\";\nimport type { KumoInputSize } from \"../input/input\";\nimport {\n  INPUT_GROUP_SIZE,\n  InputGroupAddonContext,\n  useInputGroupContext,\n} from \"./context\";\n\n/**\n * In container mode, buttons render \"one size down\" so they stay visually\n * subordinate to the input.  In individual mode the size passes through\n * unchanged (pagination / toolbar buttons should match the input height).\n */\nconst COMPACT_BUTTON_SIZE: Record<KumoInputSize, KumoInputSize> = {\n  xs: \"xs\",\n  sm: \"xs\",\n  base: \"sm\",\n  lg: \"base\",\n};\n\nexport type InputGroupButtonProps = ButtonProps & {\n  /**\n   * When provided, wraps the button in a `Tooltip` showing this content on hover.\n   * Automatically sets `aria-label` from a string value when no `aria-label` is set.\n   *\n   * @example\n   * ```tsx\n   * <InputGroup.Addon align=\"end\">\n   *   <InputGroup.Button tooltip=\"Query language help\" aria-label=\"Query language help\">\n   *     <QuestionIcon size={16} />\n   *   </InputGroup.Button>\n   * </InputGroup.Addon>\n   * ```\n   */\n  tooltip?: ReactNode;\n  /**\n   * Preferred side for the tooltip popup.\n   * @default \"bottom\"\n   */\n  tooltipSide?: KumoTooltipSide;\n};\n\n/**\n * Button for secondary actions rendered inside `InputGroup.Addon`\n * (toggle, copy, help).\n *\n * In `focusMode=\"container\"` (default), renders as a compact ghost button\n * subordinate to the input. In `focusMode=\"individual\"`, renders as a full\n * standalone button with its own focus ring, matching toolbar/pagination usage.\n *\n * Pass a `tooltip` prop to show a tooltip on hover.\n */\nexport const Button = forwardRef<\n  HTMLButtonElement,\n  PropsWithChildren<InputGroupButtonProps>\n>(\n  (\n    {\n      children,\n      className,\n      variant,\n      size,\n      disabled,\n      tooltip,\n      tooltipSide = \"bottom\",\n      icon,\n      ...props\n    }: PropsWithChildren<InputGroupButtonProps>,\n    ref: React.ForwardedRef<HTMLButtonElement>,\n  ) => {\n    const context = useInputGroupContext(\"Button\");\n    const isInsideAddon = useContext(InputGroupAddonContext);\n    const isDisabled = disabled ?? context?.disabled;\n    const isIndividual =\n      context?.focusMode === \"individual\" || context?.focusMode === \"hybrid\";\n    const effectiveVariant = variant ?? \"ghost\";\n\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      context &&\n      effectiveVariant === \"ghost\" &&\n      !isInsideAddon\n    ) {\n      console.warn(\n        \"InputGroup.Button: Ghost buttons should be wrapped in <InputGroup.Addon> for correct spacing.\",\n      );\n    }\n\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      context &&\n      size !== undefined\n    ) {\n      console.warn(\n        \"InputGroup.Button: Set `size` on <InputGroup> instead of <InputGroup.Button>.\",\n      );\n    }\n\n    // Derive aria-label from tooltip string when the button has no explicit label.\n    // Icon-only buttons require an aria-label for a11y.\n    const tooltipAriaLabel =\n      typeof tooltip === \"string\" && !props[\"aria-label\"] ? tooltip : undefined;\n\n    // Pre-render the icon with the context-derived size so it matches the\n    // Addon icon sizing (e.g. 18px at \"base\"). Without this, Button's\n    // internal renderIconNode renders `<Icon />` with no size prop,\n    // falling back to CSS font-size (~14px).\n    const contextIconSize = context\n      ? INPUT_GROUP_SIZE[context.size ?? \"base\"].iconSize\n      : undefined;\n\n    const sizedIcon =\n      icon &&\n      contextIconSize &&\n      (typeof icon === \"function\" ||\n        (typeof icon === \"object\" &&\n          icon !== null &&\n          !React.isValidElement(icon)))\n        ? React.createElement(icon as React.ComponentType<{ size?: number }>, {\n            size: contextIconSize,\n          })\n        : icon;\n\n    const btn = (\n      <ButtonExternal\n        ref={ref}\n        type=\"button\"\n        disabled={isDisabled}\n        aria-label={tooltipAriaLabel}\n        {...props}\n        icon={sizedIcon}\n        variant={variant ?? \"ghost\"}\n        // Individual: use the group's size directly so buttons match the input height.\n        // Container: render one size down so the button stays subordinate to the input.\n        size={\n          size ??\n          (isIndividual\n            ? (context?.size ?? \"sm\")\n            : (COMPACT_BUTTON_SIZE[context?.size ?? \"base\"] ?? \"sm\"))\n        }\n        className={cn(\n          // Ensure clicks register even when parent has pointer-events-none (e.g. disabled overlay)\n          \"pointer-events-auto\",\n          // Individual mode: each button owns its own border and focus indicator\n          isIndividual && [\n            // Own border replaces the container's shared ring; force full height\n            \"relative h-full! rounded-none ring-0 border border-kumo-line\",\n            // Inherit border-radius only on outer edges; inner edges are flat\n            \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n            // Collapse double borders between adjacent elements\n            \"not-first:border-l-0\",\n            // Hovered element renders above idle siblings to show full border\n            \"hover:z-[1]\",\n            // Focused element renders above hovered siblings for focus indicator\n            \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n            // Suppress the base Button's focus ring so only our outline shows\n            \"focus-visible:ring-2 focus-visible:ring-kumo-focus\",\n            // Match the group's disabled visual treatment\n            \"disabled:bg-kumo-overlay disabled:text-kumo-inactive!\",\n          ],\n          className,\n        )}\n      >\n        {children}\n      </ButtonExternal>\n    );\n\n    if (tooltip) {\n      return (\n        <Tooltip content={tooltip} side={tooltipSide} asChild>\n          {btn}\n        </Tooltip>\n      );\n    }\n\n    return btn;\n  },\n);\nButton.displayName = \"InputGroup.Button\";\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  useInputGroupContext,\n  INPUT_GROUP_SIZE,\n  InputGroupAddonContext,\n} from \"./context\";\nimport { Button } from \"./input-group-button\";\n\nexport interface InputGroupAddonProps {\n  /** Position relative to the input. @default \"start\" */\n  align?: \"start\" | \"end\";\n  /** Additional CSS classes. */\n  className?: string;\n  /** Addon content: icons, buttons, spinners, text. */\n  children?: ReactNode;\n}\n\n/**\n * Container for icons, text, or compact buttons positioned at the start or end\n * of the input. Automatically sizes icon children to match the input size.\n */\nexport const Addon = forwardRef<HTMLDivElement, InputGroupAddonProps>(\n  ({ align = \"start\", className, children }, ref) => {\n    const context = useInputGroupContext(\"Addon\");\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n\n    // Inject size into direct icon children that don't already have one set.\n    // Skips buttons (which have their own size handling) and non-element nodes.\n    // Also tracks whether a Button is present so we can reduce outer padding.\n    let containsButton = false;\n    const sizedChildren = Children.map(children, (child) => {\n      if (!isValidElement(child)) return child;\n      if (child.type === Button) {\n        containsButton = true;\n        return child;\n      }\n      const props = child.props as { size?: unknown };\n      if (props.size !== undefined) return child;\n      return cloneElement(child as ReactElement<{ size?: number }>, {\n        size: tokens.iconSize,\n      });\n    });\n\n    // Always use flex-based positioning. CSS order controls visual placement.\n    return (\n      <div\n        ref={ref}\n        data-slot={\n          align === \"start\"\n            ? \"input-group-addon-start\"\n            : \"input-group-addon-end\"\n        }\n        className={cn(\n          \"relative z-[1] pointer-events-none flex shrink-0 items-center gap-1.5\",\n          \"text-kumo-subtle\",\n          tokens.fontSize,\n          \"*:pointer-events-auto\",\n          align === \"start\"\n            ? cn(\n                \"-order-1\",\n                containsButton\n                  ? tokens.addonButtonOuterStart\n                  : tokens.addonOuterStart,\n                \"pr-0\",\n              )\n            : cn(\n                \"order-1\",\n                \"pl-0\",\n                containsButton\n                  ? tokens.addonButtonOuterEnd\n                  : tokens.addonOuterEnd,\n              ),\n          className,\n        )}\n      >\n        <InputGroupAddonContext.Provider value={true}>\n          {sizedChildren}\n        </InputGroupAddonContext.Provider>\n      </div>\n    );\n  },\n);\nAddon.displayName = \"InputGroup.Addon\";\n","import { forwardRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\nexport interface InputGroupSuffixProps {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Suffix content (e.g., \".workers.dev\"). */\n  children?: ReactNode;\n}\n\n/**\n * Inline suffix that flows seamlessly next to the typed input value.\n * Input width adjusts automatically via CSS `field-sizing: content`.\n */\nexport const Suffix = forwardRef<HTMLDivElement, InputGroupSuffixProps>(\n  ({ className, children }, ref) => {\n    const context = useInputGroupContext(\"Suffix\");\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"input-group-suffix\"\n        className={cn(\n          \"pointer-events-none flex min-w-0 grow select-none items-center text-kumo-subtle\",\n          tokens.fontSize,\n          tokens.suffixPad,\n          className,\n        )}\n      >\n        <span className=\"truncate\">{children}</span>\n      </div>\n    );\n  },\n);\nSuffix.displayName = \"InputGroup.Suffix\";\n","import {\n  forwardRef,\n  useId,\n  useMemo,\n  type ComponentPropsWithoutRef,\n  type PropsWithChildren,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { inputVariants } from \"../input/input\";\nimport { Field } from \"../field/field\";\nimport {\n  InputGroupContext,\n  INPUT_GROUP_HAS_CLASSES,\n  detectFocusMode,\n  partitionChildren,\n  type InputGroupRootPropsInternal,\n} from \"./context\";\nimport { Input } from \"./input-group-input\";\nimport { Button } from \"./input-group-button\";\nimport { Addon } from \"./input-group-addon\";\nimport { Suffix } from \"./input-group-suffix\";\n\nexport { type InputGroupRootProps } from \"./context\";\nexport { type InputGroupInputProps } from \"./input-group-input\";\nexport { type InputGroupButtonProps } from \"./input-group-button\";\nexport { type InputGroupAddonProps } from \"./input-group-addon\";\nexport { type InputGroupSuffixProps } from \"./input-group-suffix\";\n\nexport const KUMO_INPUT_GROUP_VARIANTS = {\n  size: {\n    xs: {\n      classes: \"h-6 text-xs\",\n      description: \"Extra small size.\",\n    },\n    sm: {\n      classes: \"h-7 text-xs\",\n      description: \"Small size.\",\n    },\n    base: {\n      classes: \"h-9 text-base\",\n      description: \"Default size.\",\n    },\n    lg: {\n      classes: \"h-11 text-base\",\n      description: \"Large size.\",\n    },\n  },\n} as const;\n\nexport const KUMO_INPUT_GROUP_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\n/**\n * Compound input component for building inputs with icons, addons, inline\n * suffixes, and action buttons. Accepts Field props and wraps content in\n * Field when label is provided.\n *\n * Renders as `<label>` only in standalone container mode (single input, no\n * sibling buttons) so clicking empty space focuses the input. Otherwise\n * renders as `<div>` to avoid nested `<label>` (when Field provides one) or\n * the browser's `:hover` propagation from `<label>` to its first labelable\n * descendant (when multiple labelable controls are siblings).\n *\n * @note Do not wrap InputGroup inside an external Field without using the `label` prop —\n * this creates invalid nested `<label>` elements. Use InputGroup's own `label` prop instead.\n *\n * @example\n * ```tsx\n * <InputGroup label=\"Email\" error={{ message: \"Invalid\", match: true }}>\n *   <InputGroup.Addon><EnvelopeIcon /></InputGroup.Addon>\n *   <InputGroup.Input placeholder=\"you@example.com\" />\n * </InputGroup>\n * ```\n *\n * @example\n * ```tsx\n * <InputGroup>\n *   <InputGroup.Input placeholder=\"my-worker\" />\n *   <InputGroup.Suffix>.workers.dev</InputGroup.Suffix>\n * </InputGroup>\n * ```\n */\nconst Root = forwardRef<\n  HTMLElement,\n  PropsWithChildren<InputGroupRootPropsInternal>\n>(\n  (\n    {\n      size = \"base\",\n      children,\n      className,\n      disabled = false,\n      label,\n      description,\n      error,\n      required,\n      labelTooltip,\n      ...rest\n    },\n    forwardedRef,\n  ) => {\n    const inputId = useId();\n    const focusMode = detectFocusMode(children);\n\n    const contextValue = useMemo(\n      () => ({\n        size,\n        focusMode,\n        disabled,\n        error,\n        inputId,\n      }),\n      [size, focusMode, disabled, error, inputId],\n    );\n\n    // When label is provided, Field already renders a <label> with htmlFor\n    // that handles click-to-focus. Using <div> avoids nested <label> elements\n    // (invalid HTML with undefined assistive technology behavior).\n    // When standalone (no label), a native <label> preserves click-to-focus.\n    const containerClassName = cn(\n      // Establish positioning context and make the whole area a click target\n      \"relative w-full cursor-text\",\n      // inputVariants provides base ring-kumo-line; must come before state overrides\n      inputVariants({ size }),\n      // Subtle drop shadow to separate the group from the page surface\n      \"shadow-xs\",\n      // Disabled state: prevent interaction and dim the entire group\n      \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      // Container mode: clip children to rounded corners and show a shared focus ring\n      // Individual mode: disable container ring/shadow so each child owns its own border\n      focusMode === \"container\"\n        ? [\n            \"overflow-hidden\",\n            // Focus state must come AFTER inputVariants to override ring-kumo-line\n            \"focus-within:ring-kumo-focus\",\n          ]\n        : // isolate creates a new stacking context so z-index in children doesn't leak out\n          \"isolate overflow-visible ring-0 shadow-none\",\n      // Error state must also come after inputVariants\n      \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n      // Reset horizontal padding — children handle their own spacing\n      \"px-0\",\n      // Horizontal layout with no gap — children control their own internal spacing\n      \"flex items-center gap-0\",\n      // When a suffix is present, let the input shrink to its content width\n      // so the suffix stays visually adjacent\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n      // Size-specific padding adjustments when addons or suffixes are present\n      INPUT_GROUP_HAS_CLASSES[size],\n      // Reset bottom margin to avoid inherited spacing from parent <label> styles\n      \"!mb-0\",\n      className,\n    );\n\n    // Data attributes drive CSS selectors in kumo-binding.css (focus outline)\n    // and enable child components to query their parent's state.\n    const dataProps = {\n      \"data-slot\": \"input-group\" as const,\n      \"data-focus-mode\": focusMode,\n      \"data-disabled\": disabled ? (\"\" as const) : undefined,\n    };\n\n    // Hybrid mode: splits children into two rendering zones:\n    // 1. Container zone (Addon + Input + Suffix) — shares a single border/ring\n    // 2. Individual zone (standalone Buttons) — each button owns its own border\n    // This lets inputs and addons look unified while buttons remain independent.\n    if (focusMode === \"hybrid\") {\n      // Partition children by type: addons/inputs/suffixes → container, buttons → individual\n      const { containerZone, individualZone } = partitionChildren(children);\n\n      // Override focusMode to \"container\" for children inside the zone\n      // so InputGroup.Input uses container-mode styling (ring-0!, no own border).\n      const containerZoneContext = {\n        ...contextValue,\n        focusMode: \"container\" as const,\n      };\n\n      const hybridContent = (\n        <>\n          {/* Container zone wrapper — shares a single border/ring */}\n          <InputGroupContext.Provider value={containerZoneContext}>\n            <div\n              data-slot=\"input-group-container-zone\"\n              className={cn(\n                // Base input sizing/shape from shared variant function\n                inputVariants({ size }),\n                // Clip children to rounded corners within the zone\n                \"overflow-hidden\",\n                // Show red ring on validation error\n                \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n                // Reset horizontal padding — children handle their own spacing\n                \"px-0\",\n                // Fill available width but allow shrinking when sibling buttons are present\n                \"flex min-w-0 flex-1 items-center gap-0\",\n                // Use a clean 1px CSS border instead of ring+shadow from inputVariants\n                // so the zone matches adjacent individual-mode buttons exactly.\n                \"ring-0 shadow-none\",\n                \"border border-kumo-line\",\n                \"focus-within:ring-1 focus-within:ring-kumo-focus\",\n                // Collapse double borders between zone and adjacent individual-mode button\n                \"not-first:border-l-0\",\n                // Inherit border-radius from the outer container on outer edges only;\n                // inner edges are flat so they butt cleanly against sibling buttons\n                \"first:rounded-l-[inherit] last:rounded-r-[inherit] rounded-none\",\n                // Size-specific padding adjustments when addons or suffixes are present\n                INPUT_GROUP_HAS_CLASSES[size],\n                // When a suffix is present, let the input shrink to its content width\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n              )}\n            >\n              {/* When label exists, an invisible <label> overlay enables click-to-focus\n                  inside the container zone without nesting visible <label> elements */}\n              {label && (\n                // eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y\n                <label\n                  htmlFor={inputId}\n                  // Positioned behind children (z-0) so it catches clicks on empty space\n                  className=\"absolute inset-0 z-0 cursor-text !mb-0\"\n                  aria-hidden=\"true\"\n                />\n              )}\n              {containerZone}\n            </div>\n          </InputGroupContext.Provider>\n          {/* Individual zone — buttons with their own borders */}\n          {individualZone}\n        </>\n      );\n\n      // Hybrid always uses a <div> container (never <label>) because\n      // individual-zone buttons are siblings — wrapping them in a <label>\n      // would be semantically incorrect.\n      const hybridContainer = (\n        <InputGroupContext.Provider value={contextValue}>\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {hybridContent}\n          </div>\n        </InputGroupContext.Provider>\n      );\n\n      if (label) {\n        return (\n          <Field\n            label={label}\n            description={description}\n            error={error}\n            required={required}\n            labelTooltip={labelTooltip}\n          >\n            {hybridContainer}\n          </Field>\n        );\n      }\n\n      return hybridContainer;\n    }\n\n    // Container / Individual mode (non-hybrid)\n    // Use <label> only when there's exactly one labelable descendant; otherwise <label> would propagate :hover to its first labelable descendant.\n    const useLabelContainer = !label && focusMode === \"container\";\n    const container = (\n      <InputGroupContext.Provider value={contextValue}>\n        {/* When label is set, use <div> to avoid nested <label> (Field provides one).\n            An invisible <label> overlay handles click-to-focus on empty space. */}\n        {label ? (\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {/* eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y */}\n            <label\n              htmlFor={inputId}\n              // Positioned behind children (z-0) so it catches clicks on empty space\n              className=\"absolute inset-0 z-0 !mb-0\"\n              aria-hidden=\"true\"\n            />\n            {children}\n          </div>\n        ) : useLabelContainer ? (\n          // Standalone container mode: <label> enables click-to-focus on empty space.\n          <label\n            ref={forwardedRef as React.Ref<HTMLLabelElement>}\n            {...dataProps}\n            className={cn(containerClassName, \"!mb-0\")}\n            {...rest}\n          >\n            {children}\n          </label>\n        ) : (\n          // Individual mode: <div> avoids :hover propagating to the first labelable sibling.\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {children}\n          </div>\n        )}\n      </InputGroupContext.Provider>\n    );\n\n    if (label) {\n      return (\n        <Field\n          label={label}\n          description={description}\n          error={error}\n          required={required}\n          labelTooltip={labelTooltip}\n        >\n          {container}\n        </Field>\n      );\n    }\n\n    return container;\n  },\n);\nRoot.displayName = \"InputGroup\";\n\n/** @deprecated Use `InputGroup.Addon` instead. */\nconst Label = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof Addon>\n>((props, ref) => <Addon ref={ref} align=\"start\" {...props} />);\nLabel.displayName = \"InputGroup.Label\";\n\n/** @deprecated Use `InputGroup.Suffix` instead. */\nconst Description = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof Suffix>\n>((props, ref) => <Suffix ref={ref} {...props} />);\nDescription.displayName = \"InputGroup.Description\";\n\nexport const InputGroup = Object.assign(Root, {\n  Input,\n  Button,\n  Addon,\n  Suffix,\n  /** @deprecated Use `InputGroup.Addon` instead. */\n  Label,\n  /** @deprecated Use `InputGroup.Suffix` instead. */\n  Description,\n});\n"],"names":["INPUT_GROUP_SIZE","INPUT_GROUP_HAS_CLASSES","InputGroupContext","createContext","InputGroupAddonContext","useInputGroupContext","componentName","context","useContext","partitionChildren","children","containerZone","individualZone","Children","child","isValidElement","detectFocusMode","hasNonGhostDirectButton","hasAddon","type","displayName","variant","Input","forwardRef","props","ref","size","tokens","isIndividual","hasError","inputId","jsx","InputExternal","cn","COMPACT_BUTTON_SIZE","Button","className","disabled","tooltip","tooltipSide","icon","isInsideAddon","isDisabled","effectiveVariant","tooltipAriaLabel","contextIconSize","sizedIcon","React","btn","ButtonExternal","Tooltip","Addon","align","containsButton","sizedChildren","cloneElement","Suffix","KUMO_INPUT_GROUP_VARIANTS","KUMO_INPUT_GROUP_DEFAULT_VARIANTS","Root","label","description","error","required","labelTooltip","rest","forwardedRef","useId","focusMode","contextValue","useMemo","containerClassName","inputVariants","dataProps","containerZoneContext","hybridContent","jsxs","Fragment","hybridContainer","Field","useLabelContainer","container","Label","Description","InputGroup"],"mappings":"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"}
+{"version":3,"file":"input-group-gy08vju7eoogil8k.js","sources":["../../src/components/input-group/context.ts","../../src/components/input-group/input-group-input.tsx","../../src/components/input-group/input-group-button.tsx","../../src/components/input-group/input-group-addon.tsx","../../src/components/input-group/input-group-suffix.tsx","../../src/components/input-group/input-group.tsx"],"sourcesContent":["import {\n  Children,\n  createContext,\n  isValidElement,\n  useContext,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport type { KumoInputSize } from \"../input/input\";\nimport type { FieldProps } from \"../field/field\";\n\n// Spacing model\n//\n// Each element type has a fixed outer padding. The container uses has-[] CSS\n// to reduce the input's padding on sides that touch an addon.\n//\n//   Input outer:       px-3 (12px base) — full padding when at the edge\n//   Input seam:        pl-2 / pr-2 (8px base) — applied by container has-[]\n//   Addon outer:       pl-2 / pr-2 (8px base) — on the container-edge side\n//   Addon seam:        nothing — input owns the gap entirely\n//\n// has-[] rules on the container override [&_input]:pl-{seam} when a start\n// addon is present, and [&_input]:pr-{seam} when an end addon is present.\n\nexport interface InputGroupSizeTokens {\n  /** Full outer padding — matches standalone Input (e.g. px-3). */\n  inputOuter: string;\n  /**\n   * Directional outer padding for Addon at the container edge.\n   *\n   * These MUST be static pl-/pr- strings (not derived at runtime via\n   * `\"px-N\".replace(…)`) so Tailwind JIT can detect them during its\n   * source-file scan. Dynamic string construction produces class names\n   * that never appear as literals, so Tailwind never generates the CSS.\n   */\n  addonOuterStart: string;\n  addonOuterEnd: string;\n  /**\n   * Reduced outer padding when the Addon contains a Button.\n   * Buttons have their own internal padding, so the Addon can use\n   * less outer padding to keep the visual gap balanced.\n   */\n  addonButtonOuterStart: string;\n  addonButtonOuterEnd: string;\n  /** pr- for suffix when no end addon. */\n  suffixPad: string;\n  fontSize: string;\n  /** Icon size in px. */\n  iconSize: number;\n}\n\nexport const INPUT_GROUP_SIZE: Record<KumoInputSize, InputGroupSizeTokens> = {\n  xs: {\n    inputOuter: \"px-1.5\",\n    addonOuterStart: \"pl-1.5\",\n    addonOuterEnd: \"pr-1.5\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-1.5\",\n    fontSize: \"text-xs\",\n    iconSize: 10,\n  },\n  sm: {\n    inputOuter: \"px-2\",\n    addonOuterStart: \"pl-1.5\",\n    addonOuterEnd: \"pr-1.5\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-2\",\n    fontSize: \"text-xs\",\n    iconSize: 13,\n  },\n  base: {\n    inputOuter: \"px-3\",\n    addonOuterStart: \"pl-2\",\n    addonOuterEnd: \"pr-2\",\n    addonButtonOuterStart: \"pl-1\",\n    addonButtonOuterEnd: \"pr-1\",\n    suffixPad: \"pr-3\",\n    fontSize: \"text-base\",\n    iconSize: 18,\n  },\n  lg: {\n    inputOuter: \"px-4\",\n    addonOuterStart: \"pl-2.5\",\n    addonOuterEnd: \"pr-2.5\",\n    addonButtonOuterStart: \"pl-1.5\",\n    addonButtonOuterEnd: \"pr-1.5\",\n    suffixPad: \"pr-4\",\n    fontSize: \"text-base\",\n    iconSize: 20,\n  },\n};\n\n// Build the has-[] container classes that reduce input padding when addons\n// are present. These are static strings so Tailwind JIT can detect them.\nexport const INPUT_GROUP_HAS_CLASSES: Record<KumoInputSize, string> = {\n  xs: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1\",\n  ].join(\" \"),\n  sm: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-1.5\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-1.5\",\n  ].join(\" \"),\n  base: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2\",\n  ].join(\" \"),\n  lg: [\n    \"has-[[data-slot=input-group-addon-start]]:[&_input]:pl-2.5\",\n    \"has-[[data-slot=input-group-addon-end]]:[&_input]:pr-2.5\",\n  ].join(\" \"),\n};\n\n// Context\n\n/**\n * Props for `InputGroup.Root`. Focus mode is auto-detected from children\n * (see `detectFocusMode`), so it is not part of the public or internal API.\n */\nexport interface InputGroupRootPropsInternal\n  extends HTMLAttributes<HTMLElement>,\n    Partial<\n      Pick<\n        FieldProps,\n        \"label\" | \"description\" | \"error\" | \"required\" | \"labelTooltip\"\n      >\n    > {\n  size?: KumoInputSize | undefined;\n  disabled?: boolean;\n}\n\n/** Public InputGroup.Root props — identical to the internal type. */\nexport type InputGroupRootProps = InputGroupRootPropsInternal;\n\nexport interface InputGroupContextValue {\n  size?: KumoInputSize;\n  focusMode: \"container\" | \"individual\" | \"hybrid\";\n  disabled: boolean;\n  error?: FieldProps[\"error\"];\n  /** Auto-generated id for the input element; used by the invisible label overlay. */\n  inputId: string;\n}\n\nexport const InputGroupContext = createContext<InputGroupContextValue | null>(\n  null,\n);\n\n/**\n * Set to `true` by `InputGroup.Addon` so that `InputGroup.Button` can detect\n * whether it's wrapped in an Addon. Ghost buttons should always live inside\n * an Addon for correct spacing.\n */\nexport const InputGroupAddonContext = createContext(false);\n\n/**\n * Reads InputGroupContext and warns in development when the context is null\n * (i.e. when a sub-component is rendered outside of `<InputGroup>`).\n */\nexport function useInputGroupContext(componentName: string) {\n  const context = useContext(InputGroupContext);\n  if (process.env.NODE_ENV !== \"production\" && !context) {\n    console.warn(\n      `<InputGroup.${componentName}> must be used within <InputGroup>. Falling back to default values.`,\n    );\n  }\n  return context;\n}\n\n/**\n * Partitions InputGroup children for hybrid focus mode.\n *\n * Container zone: Addon, Input, Suffix, text nodes — everything that should\n * share a single container-style border.\n *\n * Individual zone: Direct `InputGroup.Button` elements that manage their own\n * border and focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function partitionChildren(children: ReactNode): {\n  containerZone: ReactNode[];\n  individualZone: ReactNode[];\n} {\n  const containerZone: ReactNode[] = [];\n  const individualZone: ReactNode[] = [];\n\n  Children.forEach(children, (child) => {\n    if (\n      isValidElement(child) &&\n      (child.type as { displayName?: string })?.displayName ===\n        \"InputGroup.Button\"\n    ) {\n      individualZone.push(child);\n    } else {\n      containerZone.push(child);\n    }\n  });\n\n  return { containerZone, individualZone };\n}\n\n/**\n * Analyzes the direct children of `InputGroup` to determine the focus mode.\n *\n * Returns `\"hybrid\"` when BOTH an `InputGroup.Addon` AND a non-ghost direct\n * `InputGroup.Button` are present. In hybrid mode, Addon+Input share a\n * container-style border while Buttons get individual borders.\n *\n * Returns `\"individual\"` when a non-ghost direct `InputGroup.Button` is\n * present WITHOUT any `InputGroup.Addon`. This signals a toolbar/pagination\n * layout where each element manages its own focus ring.\n *\n * Returns `\"container\"` (default) in all other cases — the container owns a\n * single shared focus ring.\n *\n * Uses `displayName` comparison to identify elements, avoiding circular\n * imports between `context.ts` and the sub-component files.\n */\nexport function detectFocusMode(\n  children: ReactNode,\n): \"container\" | \"individual\" | \"hybrid\" {\n  let hasNonGhostDirectButton = false;\n  let hasAddon = false;\n\n  Children.forEach(children, (child) => {\n    if (!isValidElement(child)) return;\n\n    // Identify components by displayName to avoid circular imports.\n    const type = child.type;\n    const displayName =\n      typeof type === \"function\" || typeof type === \"object\"\n        ? (type as { displayName?: string }).displayName\n        : undefined;\n\n    if (displayName === \"InputGroup.Addon\") {\n      hasAddon = true;\n      return;\n    }\n\n    if (displayName !== \"InputGroup.Button\") return;\n\n    // A direct-child Button is by definition NOT inside an Addon (Addon's\n    // children are children of the Addon element, not of InputGroup).\n    // Check whether the variant is explicitly non-ghost.\n    const variant = (child.props as { variant?: string }).variant;\n    if (variant !== undefined && variant !== \"ghost\") {\n      hasNonGhostDirectButton = true;\n    }\n  });\n\n  if (hasNonGhostDirectButton && hasAddon) return \"hybrid\";\n  if (hasNonGhostDirectButton) return \"individual\";\n  return \"container\";\n}\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Input as InputExternal, type InputProps } from \"../input/input\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\n/** Props for InputGroup.Input — omits Field props since InputGroup handles them. */\nexport type InputGroupInputProps = Omit<\n  InputProps,\n  \"label\" | \"labelTooltip\" | \"description\" | \"error\" | \"size\" | \"disabled\"\n>;\n\n/**\n * Text input that inherits size, disabled, and error state from InputGroup context.\n * Automatically sets `aria-invalid` when parent has an error.\n */\nexport const Input = forwardRef<HTMLInputElement, InputGroupInputProps>(\n  (props, ref) => {\n    const context = useInputGroupContext(\"Input\");\n\n    // Warn when props that belong on <InputGroup> are passed directly\n    if (process.env.NODE_ENV !== \"production\" && context) {\n      if ((props as any).size !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Set `size` on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).disabled !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Set `disabled` on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).label !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Use the `label` prop on <InputGroup> instead of <InputGroup.Input>.\",\n        );\n      }\n      if ((props as any).description !== undefined) {\n        console.warn(\n          \"InputGroup.Input: Use <InputGroup.Suffix> instead of passing `description` to <InputGroup.Input>.\",\n        );\n      }\n    }\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n    const isIndividual = context?.focusMode === \"individual\";\n\n    // Auto-set aria-invalid when error is present in context\n    const hasError = Boolean(context?.error);\n\n    // Use explicit id if provided, otherwise fall back to context id\n    // (links the input to the invisible label overlay for click-to-focus).\n    const inputId = props.id ?? context?.inputId;\n\n    return (\n      <InputExternal\n        ref={ref}\n        size={context?.size}\n        disabled={context?.disabled || (props as any).disabled}\n        aria-invalid={hasError || props[\"aria-invalid\"]}\n        {...props}\n        id={inputId}\n        className={cn(\n          // Base input layout: fill height, allow shrinking, strip native border/radius\n          \"flex h-full min-w-0 grow items-center rounded-none border-0 bg-transparent font-sans\",\n          // Always use full outer padding — the container's has-[] rules reduce\n          // pl/pr to inputSeam on sides that touch an addon.\n          tokens.inputOuter,\n          // Truncate overflowing text with \"…\" instead of expanding the input\n          \"text-ellipsis\",\n          // Individual mode: each element owns its own border instead of sharing a container ring\n          isIndividual\n            ? [\n                // Own border replaces the container's shared ring\n                \"relative ring-0 border border-kumo-line\",\n                // Inherit border-radius only on outer edges; inner edges are flat\n                \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n                // Collapse double borders between adjacent elements\n                \"not-first:border-l-0\",\n                // Hovered element renders above idle siblings to show full border\n                \"hover:z-[1] hover:border-kumo-line\",\n                // Focused element renders above hovered siblings for focus indicator\n                \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n              ].join(\" \")\n            : // Container mode: kill all focus indicators — the container handles them\n              // z-[1] lifts the input above the invisible label overlay so cursor/selection work\n              \"relative z-[1] ring-0! shadow-none outline-none focus:ring-0! focus:outline-none\",\n          props.className,\n        )}\n      />\n    );\n  },\n);\nInput.displayName = \"InputGroup.Input\";\n","import React, {\n  forwardRef,\n  useContext,\n  type PropsWithChildren,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { type ButtonProps, Button as ButtonExternal } from \"../button/button\";\nimport { Tooltip, type KumoTooltipSide } from \"../tooltip/tooltip\";\nimport type { KumoInputSize } from \"../input/input\";\nimport {\n  INPUT_GROUP_SIZE,\n  InputGroupAddonContext,\n  useInputGroupContext,\n} from \"./context\";\n\n/**\n * In container mode, buttons render \"one size down\" so they stay visually\n * subordinate to the input.  In individual mode the size passes through\n * unchanged (pagination / toolbar buttons should match the input height).\n */\nconst COMPACT_BUTTON_SIZE: Record<KumoInputSize, KumoInputSize> = {\n  xs: \"xs\",\n  sm: \"xs\",\n  base: \"sm\",\n  lg: \"base\",\n};\n\nexport type InputGroupButtonProps = ButtonProps & {\n  /**\n   * When provided, wraps the button in a `Tooltip` showing this content on hover.\n   * Automatically sets `aria-label` from a string value when no `aria-label` is set.\n   *\n   * @example\n   * ```tsx\n   * <InputGroup.Addon align=\"end\">\n   *   <InputGroup.Button tooltip=\"Query language help\" aria-label=\"Query language help\">\n   *     <QuestionIcon size={16} />\n   *   </InputGroup.Button>\n   * </InputGroup.Addon>\n   * ```\n   */\n  tooltip?: ReactNode;\n  /**\n   * Preferred side for the tooltip popup.\n   * @default \"bottom\"\n   */\n  tooltipSide?: KumoTooltipSide;\n};\n\n/**\n * Button for secondary actions rendered inside `InputGroup.Addon`\n * (toggle, copy, help).\n *\n * In `focusMode=\"container\"` (default), renders as a compact ghost button\n * subordinate to the input. In `focusMode=\"individual\"`, renders as a full\n * standalone button with its own focus ring, matching toolbar/pagination usage.\n *\n * Pass a `tooltip` prop to show a tooltip on hover.\n */\nexport const Button = forwardRef<\n  HTMLButtonElement,\n  PropsWithChildren<InputGroupButtonProps>\n>(\n  (\n    {\n      children,\n      className,\n      variant,\n      size,\n      disabled,\n      tooltip,\n      tooltipSide = \"bottom\",\n      icon,\n      ...props\n    }: PropsWithChildren<InputGroupButtonProps>,\n    ref: React.ForwardedRef<HTMLButtonElement>,\n  ) => {\n    const context = useInputGroupContext(\"Button\");\n    const isInsideAddon = useContext(InputGroupAddonContext);\n    const isDisabled = disabled ?? context?.disabled;\n    const isIndividual =\n      context?.focusMode === \"individual\" || context?.focusMode === \"hybrid\";\n    const effectiveVariant = variant ?? \"ghost\";\n\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      context &&\n      effectiveVariant === \"ghost\" &&\n      !isInsideAddon\n    ) {\n      console.warn(\n        \"InputGroup.Button: Ghost buttons should be wrapped in <InputGroup.Addon> for correct spacing.\",\n      );\n    }\n\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      context &&\n      size !== undefined\n    ) {\n      console.warn(\n        \"InputGroup.Button: Set `size` on <InputGroup> instead of <InputGroup.Button>.\",\n      );\n    }\n\n    // Derive aria-label from tooltip string when the button has no explicit label.\n    // Icon-only buttons require an aria-label for a11y.\n    const tooltipAriaLabel =\n      typeof tooltip === \"string\" && !props[\"aria-label\"] ? tooltip : undefined;\n\n    // Pre-render the icon with the context-derived size so it matches the\n    // Addon icon sizing (e.g. 18px at \"base\"). Without this, Button's\n    // internal renderIconNode renders `<Icon />` with no size prop,\n    // falling back to CSS font-size (~14px).\n    const contextIconSize = context\n      ? INPUT_GROUP_SIZE[context.size ?? \"base\"].iconSize\n      : undefined;\n\n    const sizedIcon =\n      icon &&\n      contextIconSize &&\n      (typeof icon === \"function\" ||\n        (typeof icon === \"object\" &&\n          icon !== null &&\n          !React.isValidElement(icon)))\n        ? React.createElement(icon as React.ComponentType<{ size?: number }>, {\n            size: contextIconSize,\n          })\n        : icon;\n\n    const btn = (\n      <ButtonExternal\n        ref={ref}\n        type=\"button\"\n        disabled={isDisabled}\n        aria-label={tooltipAriaLabel}\n        {...props}\n        icon={sizedIcon}\n        variant={variant ?? \"ghost\"}\n        // Individual: use the group's size directly so buttons match the input height.\n        // Container: render one size down so the button stays subordinate to the input.\n        size={\n          size ??\n          (isIndividual\n            ? (context?.size ?? \"sm\")\n            : (COMPACT_BUTTON_SIZE[context?.size ?? \"base\"] ?? \"sm\"))\n        }\n        className={cn(\n          // Ensure clicks register even when parent has pointer-events-none (e.g. disabled overlay)\n          \"pointer-events-auto\",\n          // Individual mode: each button owns its own border and focus indicator\n          isIndividual && [\n            // Own border replaces the container's shared ring; force full height\n            \"relative h-full! rounded-none ring-0 border border-kumo-line\",\n            // Inherit border-radius only on outer edges; inner edges are flat\n            \"first:rounded-l-[inherit] last:rounded-r-[inherit]\",\n            // Collapse double borders between adjacent elements\n            \"not-first:border-l-0\",\n            // Hovered element renders above idle siblings to show full border\n            \"hover:z-[1]\",\n            // Focused element renders above hovered siblings for focus indicator\n            \"focus:z-[2] focus:border-kumo-line focus:outline focus:-outline-offset-1\",\n            // Suppress the base Button's focus ring so only our outline shows\n            \"focus-visible:ring-2 focus-visible:ring-kumo-focus\",\n            // Match the group's disabled visual treatment\n            \"disabled:bg-kumo-overlay disabled:text-kumo-inactive!\",\n          ],\n          className,\n        )}\n      >\n        {children}\n      </ButtonExternal>\n    );\n\n    if (tooltip) {\n      return (\n        <Tooltip content={tooltip} side={tooltipSide} asChild>\n          {btn}\n        </Tooltip>\n      );\n    }\n\n    return btn;\n  },\n);\nButton.displayName = \"InputGroup.Button\";\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  useInputGroupContext,\n  INPUT_GROUP_SIZE,\n  InputGroupAddonContext,\n} from \"./context\";\nimport { Button } from \"./input-group-button\";\n\nexport interface InputGroupAddonProps {\n  /** Position relative to the input. @default \"start\" */\n  align?: \"start\" | \"end\";\n  /** Additional CSS classes. */\n  className?: string;\n  /** Addon content: icons, buttons, spinners, text. */\n  children?: ReactNode;\n}\n\n/**\n * Container for icons, text, or compact buttons positioned at the start or end\n * of the input. Automatically sizes icon children to match the input size.\n */\nexport const Addon = forwardRef<HTMLDivElement, InputGroupAddonProps>(\n  ({ align = \"start\", className, children }, ref) => {\n    const context = useInputGroupContext(\"Addon\");\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n\n    // Inject size into direct icon children that don't already have one set.\n    // Skips buttons (which have their own size handling) and non-element nodes.\n    // Also tracks whether a Button is present so we can reduce outer padding.\n    let containsButton = false;\n    const sizedChildren = Children.map(children, (child) => {\n      if (!isValidElement(child)) return child;\n      if (child.type === Button) {\n        containsButton = true;\n        return child;\n      }\n      const props = child.props as { size?: unknown };\n      if (props.size !== undefined) return child;\n      return cloneElement(child as ReactElement<{ size?: number }>, {\n        size: tokens.iconSize,\n      });\n    });\n\n    // Always use flex-based positioning. CSS order controls visual placement.\n    return (\n      <div\n        ref={ref}\n        data-slot={\n          align === \"start\"\n            ? \"input-group-addon-start\"\n            : \"input-group-addon-end\"\n        }\n        className={cn(\n          \"relative z-[1] pointer-events-none flex shrink-0 items-center gap-1.5\",\n          \"text-kumo-subtle\",\n          tokens.fontSize,\n          \"*:pointer-events-auto\",\n          align === \"start\"\n            ? cn(\n                \"-order-1\",\n                containsButton\n                  ? tokens.addonButtonOuterStart\n                  : tokens.addonOuterStart,\n                \"pr-0\",\n              )\n            : cn(\n                \"order-1\",\n                \"pl-0\",\n                containsButton\n                  ? tokens.addonButtonOuterEnd\n                  : tokens.addonOuterEnd,\n              ),\n          className,\n        )}\n      >\n        <InputGroupAddonContext.Provider value={true}>\n          {sizedChildren}\n        </InputGroupAddonContext.Provider>\n      </div>\n    );\n  },\n);\nAddon.displayName = \"InputGroup.Addon\";\n","import { forwardRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useInputGroupContext, INPUT_GROUP_SIZE } from \"./context\";\n\nexport interface InputGroupSuffixProps {\n  /** Additional CSS classes. */\n  className?: string;\n  /** Suffix content (e.g., \".workers.dev\"). */\n  children?: ReactNode;\n}\n\n/**\n * Inline suffix that flows seamlessly next to the typed input value.\n * Input width adjusts automatically via CSS `field-sizing: content`.\n */\nexport const Suffix = forwardRef<HTMLDivElement, InputGroupSuffixProps>(\n  ({ className, children }, ref) => {\n    const context = useInputGroupContext(\"Suffix\");\n\n    const size = context?.size ?? \"base\";\n    const tokens = INPUT_GROUP_SIZE[size];\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"input-group-suffix\"\n        className={cn(\n          \"pointer-events-none flex min-w-0 grow select-none items-center text-kumo-subtle\",\n          tokens.fontSize,\n          tokens.suffixPad,\n          className,\n        )}\n      >\n        <span className=\"truncate\">{children}</span>\n      </div>\n    );\n  },\n);\nSuffix.displayName = \"InputGroup.Suffix\";\n","import {\n  forwardRef,\n  useId,\n  useMemo,\n  type ComponentPropsWithoutRef,\n  type PropsWithChildren,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { inputVariants } from \"../input/input\";\nimport { Field } from \"../field/field\";\nimport {\n  InputGroupContext,\n  INPUT_GROUP_HAS_CLASSES,\n  detectFocusMode,\n  partitionChildren,\n  type InputGroupRootPropsInternal,\n} from \"./context\";\nimport { Input } from \"./input-group-input\";\nimport { Button } from \"./input-group-button\";\nimport { Addon } from \"./input-group-addon\";\nimport { Suffix } from \"./input-group-suffix\";\n\nexport { type InputGroupRootProps } from \"./context\";\nexport { type InputGroupInputProps } from \"./input-group-input\";\nexport { type InputGroupButtonProps } from \"./input-group-button\";\nexport { type InputGroupAddonProps } from \"./input-group-addon\";\nexport { type InputGroupSuffixProps } from \"./input-group-suffix\";\n\nexport const KUMO_INPUT_GROUP_VARIANTS = {\n  size: {\n    xs: {\n      classes: \"h-6 text-xs\",\n      description: \"Extra small size.\",\n    },\n    sm: {\n      classes: \"h-7 text-xs\",\n      description: \"Small size.\",\n    },\n    base: {\n      classes: \"h-9 text-base\",\n      description: \"Default size.\",\n    },\n    lg: {\n      classes: \"h-11 text-base\",\n      description: \"Large size.\",\n    },\n  },\n} as const;\n\nexport const KUMO_INPUT_GROUP_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\n/**\n * Compound input component for building inputs with icons, addons, inline\n * suffixes, and action buttons. Accepts Field props and wraps content in\n * Field when label is provided.\n *\n * Renders as `<label>` only in standalone container mode (single input, no\n * sibling buttons) so clicking empty space focuses the input. Otherwise\n * renders as `<div>` to avoid nested `<label>` (when Field provides one) or\n * the browser's `:hover` propagation from `<label>` to its first labelable\n * descendant (when multiple labelable controls are siblings).\n *\n * @note Do not wrap InputGroup inside an external Field without using the `label` prop —\n * this creates invalid nested `<label>` elements. Use InputGroup's own `label` prop instead.\n *\n * @example\n * ```tsx\n * <InputGroup label=\"Email\" error={{ message: \"Invalid\", match: true }}>\n *   <InputGroup.Addon><EnvelopeIcon /></InputGroup.Addon>\n *   <InputGroup.Input placeholder=\"you@example.com\" />\n * </InputGroup>\n * ```\n *\n * @example\n * ```tsx\n * <InputGroup>\n *   <InputGroup.Input placeholder=\"my-worker\" />\n *   <InputGroup.Suffix>.workers.dev</InputGroup.Suffix>\n * </InputGroup>\n * ```\n */\nconst Root = forwardRef<\n  HTMLElement,\n  PropsWithChildren<InputGroupRootPropsInternal>\n>(\n  (\n    {\n      size = \"base\",\n      children,\n      className,\n      disabled = false,\n      label,\n      description,\n      error,\n      required,\n      labelTooltip,\n      ...rest\n    },\n    forwardedRef,\n  ) => {\n    const inputId = useId();\n    const focusMode = detectFocusMode(children);\n\n    const contextValue = useMemo(\n      () => ({\n        size,\n        focusMode,\n        disabled,\n        error,\n        inputId,\n      }),\n      [size, focusMode, disabled, error, inputId],\n    );\n\n    // When label is provided, Field already renders a <label> with htmlFor\n    // that handles click-to-focus. Using <div> avoids nested <label> elements\n    // (invalid HTML with undefined assistive technology behavior).\n    // When standalone (no label), a native <label> preserves click-to-focus.\n    const containerClassName = cn(\n      // Establish positioning context and make the whole area a click target\n      \"relative w-full cursor-text\",\n      // inputVariants provides base ring-kumo-line; must come before state overrides\n      inputVariants({ size }),\n      // Subtle drop shadow to separate the group from the page surface\n      \"shadow-xs\",\n      // Disabled state: prevent interaction and dim the entire group\n      \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      // Container mode: clip children to rounded corners and show a shared focus ring\n      // Individual mode: disable container ring/shadow so each child owns its own border\n      focusMode === \"container\"\n        ? [\n            \"overflow-hidden\",\n            // Focus state must come AFTER inputVariants to override ring-kumo-line\n            \"focus-within:ring-kumo-focus\",\n          ]\n        : // isolate creates a new stacking context so z-index in children doesn't leak out\n          \"isolate overflow-visible ring-0 shadow-none\",\n      // Error state must also come after inputVariants\n      \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n      // Reset horizontal padding — children handle their own spacing\n      \"px-0\",\n      // Horizontal layout with no gap — children control their own internal spacing\n      \"flex items-center gap-0\",\n      // When a suffix is present, let the input shrink to its content width\n      // so the suffix stays visually adjacent\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n      \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n      // Size-specific padding adjustments when addons or suffixes are present\n      INPUT_GROUP_HAS_CLASSES[size],\n      // Reset bottom margin to avoid inherited spacing from parent <label> styles\n      \"!mb-0\",\n      className,\n    );\n\n    // Data attributes drive CSS selectors in kumo-binding.css (focus outline)\n    // and enable child components to query their parent's state.\n    const dataProps = {\n      \"data-slot\": \"input-group\" as const,\n      \"data-focus-mode\": focusMode,\n      \"data-disabled\": disabled ? (\"\" as const) : undefined,\n    };\n\n    // Hybrid mode: splits children into two rendering zones:\n    // 1. Container zone (Addon + Input + Suffix) — shares a single border/ring\n    // 2. Individual zone (standalone Buttons) — each button owns its own border\n    // This lets inputs and addons look unified while buttons remain independent.\n    if (focusMode === \"hybrid\") {\n      // Partition children by type: addons/inputs/suffixes → container, buttons → individual\n      const { containerZone, individualZone } = partitionChildren(children);\n\n      // Override focusMode to \"container\" for children inside the zone\n      // so InputGroup.Input uses container-mode styling (ring-0!, no own border).\n      const containerZoneContext = {\n        ...contextValue,\n        focusMode: \"container\" as const,\n      };\n\n      const hybridContent = (\n        <>\n          {/* Container zone wrapper — shares a single border/ring */}\n          <InputGroupContext.Provider value={containerZoneContext}>\n            <div\n              data-slot=\"input-group-container-zone\"\n              className={cn(\n                // Base input sizing/shape from shared variant function\n                inputVariants({ size }),\n                // Clip children to rounded corners within the zone\n                \"overflow-hidden\",\n                // Show red ring on validation error\n                \"has-[input[aria-invalid=true]]:ring-kumo-danger\",\n                // Reset horizontal padding — children handle their own spacing\n                \"px-0\",\n                // Fill available width but allow shrinking when sibling buttons are present\n                \"flex min-w-0 flex-1 items-center gap-0\",\n                // Use a clean 1px CSS border instead of ring+shadow from inputVariants\n                // so the zone matches adjacent individual-mode buttons exactly.\n                \"ring-0 shadow-none\",\n                \"border border-kumo-line\",\n                \"focus-within:ring-1 focus-within:ring-kumo-focus\",\n                // Collapse double borders between zone and adjacent individual-mode button\n                \"not-first:border-l-0\",\n                // Inherit border-radius from the outer container on outer edges only;\n                // inner edges are flat so they butt cleanly against sibling buttons\n                \"first:rounded-l-[inherit] last:rounded-r-[inherit] rounded-none\",\n                // Size-specific padding adjustments when addons or suffixes are present\n                INPUT_GROUP_HAS_CLASSES[size],\n                // When a suffix is present, let the input shrink to its content width\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:[field-sizing:content]\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:max-w-full\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:grow-0\",\n                \"has-[[data-slot=input-group-suffix]]:[&_input]:pr-0\",\n              )}\n            >\n              {/* When label exists, an invisible <label> overlay enables click-to-focus\n                  inside the container zone without nesting visible <label> elements */}\n              {label && (\n                // eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y\n                <label\n                  htmlFor={inputId}\n                  // Positioned behind children (z-0) so it catches clicks on empty space\n                  className=\"absolute inset-0 z-0 cursor-text !mb-0\"\n                  aria-hidden=\"true\"\n                />\n              )}\n              {containerZone}\n            </div>\n          </InputGroupContext.Provider>\n          {/* Individual zone — buttons with their own borders */}\n          {individualZone}\n        </>\n      );\n\n      // Hybrid always uses a <div> container (never <label>) because\n      // individual-zone buttons are siblings — wrapping them in a <label>\n      // would be semantically incorrect.\n      const hybridContainer = (\n        <InputGroupContext.Provider value={contextValue}>\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {hybridContent}\n          </div>\n        </InputGroupContext.Provider>\n      );\n\n      if (label) {\n        return (\n          <Field\n            label={label}\n            description={description}\n            error={error}\n            required={required}\n            labelTooltip={labelTooltip}\n          >\n            {hybridContainer}\n          </Field>\n        );\n      }\n\n      return hybridContainer;\n    }\n\n    // Container / Individual mode (non-hybrid)\n    // Use <label> only when there's exactly one labelable descendant; otherwise <label> would propagate :hover to its first labelable descendant.\n    const useLabelContainer = !label && focusMode === \"container\";\n    const container = (\n      <InputGroupContext.Provider value={contextValue}>\n        {/* When label is set, use <div> to avoid nested <label> (Field provides one).\n            An invisible <label> overlay handles click-to-focus on empty space. */}\n        {label ? (\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {/* eslint-disable-next-line jsx-a11y/label-has-associated-control -- invisible overlay for click-to-focus; the visible Field label handles a11y */}\n            <label\n              htmlFor={inputId}\n              // Positioned behind children (z-0) so it catches clicks on empty space\n              className=\"absolute inset-0 z-0 !mb-0\"\n              aria-hidden=\"true\"\n            />\n            {children}\n          </div>\n        ) : useLabelContainer ? (\n          // Standalone container mode: <label> enables click-to-focus on empty space.\n          <label\n            ref={forwardedRef as React.Ref<HTMLLabelElement>}\n            {...dataProps}\n            className={cn(containerClassName, \"!mb-0\")}\n            {...rest}\n          >\n            {children}\n          </label>\n        ) : (\n          // Individual mode: <div> avoids :hover propagating to the first labelable sibling.\n          <div\n            ref={forwardedRef as React.Ref<HTMLDivElement>}\n            {...dataProps}\n            className={containerClassName}\n            {...rest}\n          >\n            {children}\n          </div>\n        )}\n      </InputGroupContext.Provider>\n    );\n\n    if (label) {\n      return (\n        <Field\n          label={label}\n          description={description}\n          error={error}\n          required={required}\n          labelTooltip={labelTooltip}\n        >\n          {container}\n        </Field>\n      );\n    }\n\n    return container;\n  },\n);\nRoot.displayName = \"InputGroup\";\n\n/** @deprecated Use `InputGroup.Addon` instead. */\nconst Label = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof Addon>\n>((props, ref) => <Addon ref={ref} align=\"start\" {...props} />);\nLabel.displayName = \"InputGroup.Label\";\n\n/** @deprecated Use `InputGroup.Suffix` instead. */\nconst Description = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof Suffix>\n>((props, ref) => <Suffix ref={ref} {...props} />);\nDescription.displayName = \"InputGroup.Description\";\n\nexport const InputGroup = Object.assign(Root, {\n  Input,\n  Button,\n  Addon,\n  Suffix,\n  /** @deprecated Use `InputGroup.Addon` instead. */\n  Label,\n  /** @deprecated Use `InputGroup.Suffix` instead. */\n  Description,\n});\n"],"names":["INPUT_GROUP_SIZE","INPUT_GROUP_HAS_CLASSES","InputGroupContext","createContext","InputGroupAddonContext","useInputGroupContext","componentName","context","useContext","partitionChildren","children","containerZone","individualZone","Children","child","isValidElement","detectFocusMode","hasNonGhostDirectButton","hasAddon","type","displayName","variant","Input","forwardRef","props","ref","size","tokens","isIndividual","hasError","inputId","jsx","InputExternal","cn","COMPACT_BUTTON_SIZE","Button","className","disabled","tooltip","tooltipSide","icon","isInsideAddon","isDisabled","effectiveVariant","tooltipAriaLabel","contextIconSize","sizedIcon","React","btn","ButtonExternal","Tooltip","Addon","align","containsButton","sizedChildren","cloneElement","Suffix","KUMO_INPUT_GROUP_VARIANTS","KUMO_INPUT_GROUP_DEFAULT_VARIANTS","Root","label","description","error","required","labelTooltip","rest","forwardedRef","useId","focusMode","contextValue","useMemo","containerClassName","inputVariants","dataProps","containerZoneContext","hybridContent","jsxs","Fragment","hybridContainer","Field","useLabelContainer","container","Label","Description","InputGroup"],"mappings":"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"}

package/dist/chunks/{input-cyils8jxj8e0udr7.js → input-i3os21puacqw4r75.js}

@@ -3,7 +3,7 @@ import { jsx as d } from "react/jsx-runtime";
 import { c as g } from "./cn-ct4n7r74mh8y0f48.js";
 import { r as f } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
 import { forwardRef as w } from "react";
-import { F as E, n as N } from "./field-yhlyu6fy0qi1ewtl.js";
+import { F as E, n as N } from "./field-l1oapopp6kjnephi.js";
 import { I as y } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const m = {
   size: {
@@ -127,4 +127,4 @@ export {
   m as K,
   z as i
 };
-//# sourceMappingURL=input-cyils8jxj8e0udr7.js.map
+//# sourceMappingURL=input-i3os21puacqw4r75.js.map

package/dist/chunks/{input-cyils8jxj8e0udr7.js.map → input-i3os21puacqw4r75.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-cyils8jxj8e0udr7.js","sources":["../../src/components/input/input.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { Field, normalizeFieldError, 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-focus/50 focus:ring-[1.5px]\",\n      description: \"Default input appearance\",\n    },\n    error: {\n      classes: \"!ring-kumo-danger focus:ring-kumo-danger/50 focus:ring-[1.5px]\",\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 outline-none focus:outline-none\",\n    // Disabled state and placeholder styles (using vanilla CSS class for Chrome compatibility)\n    \"kumo-input-placeholder disabled:text-kumo-disabled\",\n    // Apply size styles from KUMO_INPUT_VARIANTS\n    resolveVariant(\n      KUMO_INPUT_VARIANTS.size,\n      size,\n      KUMO_INPUT_DEFAULT_VARIANTS.size,\n    ).classes,\n    // Apply variant styles from KUMO_INPUT_VARIANTS\n    resolveVariant(\n      KUMO_INPUT_VARIANTS.variant,\n      variant,\n      KUMO_INPUT_DEFAULT_VARIANTS.variant,\n    ).classes,\n    // Focus state handling\n    parentFocusIndicator &&\n      (variant === \"error\"\n        ? \"focus-within:ring-kumo-danger/50 focus-within:ring-[1.5px]\"\n        : \"focus-within:ring-kumo-focus/50 focus-within:ring-[1.5px]\"),\n    focusIndicator &&\n      (variant === \"error\"\n        ? \"focus:ring-kumo-danger/50 focus:ring-[1.5px]\"\n        : \"focus:ring-kumo-focus/50 focus:ring-[1.5px]\"),\n  );\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {\n  const {\n    className,\n    size = \"base\",\n    variant: variantProp,\n    label,\n    labelTooltip,\n    description,\n    error,\n    passwordManagerIgnore = false,\n    ...inputProps\n  } = props;\n\n  // Deprecation warning for variant=\"error\"\n  if (process.env.NODE_ENV !== \"production\" && variantProp === \"error\") {\n    console.warn(\n      '[Kumo Input]: variant=\"error\" is deprecated. ' +\n        \"Error styling is now automatically applied when the `error` prop is truthy. \" +\n        \"Simply remove the variant prop and pass an error message instead.\",\n    );\n  }\n\n  // Auto-apply error styling when error prop is truthy\n  // Explicit variant prop takes precedence for backwards compatibility\n  const variant = variantProp ?? (error ? \"error\" : \"default\");\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 hasAriaLabel = Boolean(inputProps[\"aria-label\"]);\n    const hasAriaLabelledBy = Boolean(inputProps[\"aria-labelledby\"]);\n\n    if (!hasLabel && !hasAriaLabel && !hasAriaLabelledBy) {\n      console.warn(\n        \"[Kumo Input]: Input must have an accessible name. Provide either:\\n\" +\n          \"  - label prop: <Input label='Email' />\\n\" +\n          \"  - aria-label: <Input 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        passwordManagerIgnore && \"keeper-ignore\",\n        className,\n      )}\n      {...(passwordManagerIgnore\n        ? {\n            \"data-1p-ignore\": \"true\",\n            \"data-bwignore\": \"true\",\n            \"data-form-type\": \"other\",\n            \"data-lpignore\": \"true\",\n          }\n        : {})}\n      {...inputProps}\n    />\n  );\n\n  // Render with Field wrapper if label, error, or description is provided\n  if (label || error || description) {\n    return (\n      <Field\n        label={label}\n        required={required}\n        labelTooltip={labelTooltip}\n        description={description}\n        error={normalizeFieldError(error)}\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 * />\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    /** Suppress browser extension password manager overlays on non-credential inputs. */\n    passwordManagerIgnore?: boolean;\n  };\n"],"names":["KUMO_INPUT_VARIANTS","KUMO_INPUT_DEFAULT_VARIANTS","inputVariants","variant","size","parentFocusIndicator","focusIndicator","cn","resolveVariant","Input","forwardRef","props","ref","className","variantProp","label","labelTooltip","description","error","passwordManagerIgnore","inputProps","required","hasLabel","hasAriaLabel","hasAriaLabelledBy","input","jsx","BaseInput","Field","normalizeFieldError"],"mappings":";;;;;;;AAWO,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,IAEAC;AAAA,MACER,EAAoB;AAAA,MACpBI;AAAA,MACAH,EAA4B;AAAA,IAAA,EAC5B;AAAA;AAAA,IAEFO;AAAA,MACER,EAAoB;AAAA,MACpBG;AAAA,MACAF,EAA4B;AAAA,IAAA,EAC5B;AAAA;AAAA,IAEFI,MACGF,MAAY,UACT,+DACA;AAAA,IACNG,MACGH,MAAY,UACT,iDACA;AAAA,EAAA;AAEV;AAEO,MAAMM,IAAQC,EAAyC,CAACC,GAAOC,MAAQ;AAC5E,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,MAAAT,IAAO;AAAA,IACP,SAASU;AAAA,IACT,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,uBAAAC,IAAwB;AAAA,IACxB,GAAGC;AAAA,EAAA,IACDT;AAGJ,EAAI,QAAQ,IAAI,aAAa,gBAAgBG,MAAgB,WAC3D,QAAQ;AAAA,IACN;AAAA,EAAA;AAQJ,QAAMX,IAAUW,MAAgBI,IAAQ,UAAU,YAG5C,EAAE,UAAAG,MAAaD;AAGrB,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,UAAME,IAAW,EAAQP,GACnBQ,IAAe,EAAQH,EAAW,YAAY,GAC9CI,IAAoB,EAAQJ,EAAW,iBAAiB;AAE9D,IAAI,CAACE,KAAY,CAACC,KAAgB,CAACC,KACjC,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAMN;AAEA,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAAf;AAAA,MACA,WAAWL;AAAA,QACTL,EAAc,EAAE,MAAAE,GAAM,SAAAD,GAAS,gBAAgB,IAAM;AAAA,QACrDgB,KAAyB;AAAA,QACzBN;AAAA,MAAA;AAAA,MAED,GAAIM,IACD;AAAA,QACE,kBAAkB;AAAA,QAClB,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,QAClB,iBAAiB;AAAA,MAAA,IAEnB,CAAA;AAAA,MACH,GAAGC;AAAA,IAAA;AAAA,EAAA;AAKR,SAAIL,KAASG,KAASD,IAElB,gBAAAS;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,OAAAb;AAAA,MACA,UAAAM;AAAA,MACA,cAAAL;AAAA,MACA,aAAAC;AAAA,MACA,OAAOY,EAAoBX,CAAK;AAAA,MAE/B,UAAAO;AAAA,IAAA;AAAA,EAAA,IAMAA;AACT,CAAC;AAEDhB,EAAM,cAAc;"}
+{"version":3,"file":"input-i3os21puacqw4r75.js","sources":["../../src/components/input/input.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { Field, normalizeFieldError, 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-focus/50 focus:ring-[1.5px]\",\n      description: \"Default input appearance\",\n    },\n    error: {\n      classes: \"!ring-kumo-danger focus:ring-kumo-danger/50 focus:ring-[1.5px]\",\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 outline-none focus:outline-none\",\n    // Disabled state and placeholder styles (using vanilla CSS class for Chrome compatibility)\n    \"kumo-input-placeholder disabled:text-kumo-disabled\",\n    // Apply size styles from KUMO_INPUT_VARIANTS\n    resolveVariant(\n      KUMO_INPUT_VARIANTS.size,\n      size,\n      KUMO_INPUT_DEFAULT_VARIANTS.size,\n    ).classes,\n    // Apply variant styles from KUMO_INPUT_VARIANTS\n    resolveVariant(\n      KUMO_INPUT_VARIANTS.variant,\n      variant,\n      KUMO_INPUT_DEFAULT_VARIANTS.variant,\n    ).classes,\n    // Focus state handling\n    parentFocusIndicator &&\n      (variant === \"error\"\n        ? \"focus-within:ring-kumo-danger/50 focus-within:ring-[1.5px]\"\n        : \"focus-within:ring-kumo-focus/50 focus-within:ring-[1.5px]\"),\n    focusIndicator &&\n      (variant === \"error\"\n        ? \"focus:ring-kumo-danger/50 focus:ring-[1.5px]\"\n        : \"focus:ring-kumo-focus/50 focus:ring-[1.5px]\"),\n  );\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {\n  const {\n    className,\n    size = \"base\",\n    variant: variantProp,\n    label,\n    labelTooltip,\n    description,\n    error,\n    passwordManagerIgnore = false,\n    ...inputProps\n  } = props;\n\n  // Deprecation warning for variant=\"error\"\n  if (process.env.NODE_ENV !== \"production\" && variantProp === \"error\") {\n    console.warn(\n      '[Kumo Input]: variant=\"error\" is deprecated. ' +\n        \"Error styling is now automatically applied when the `error` prop is truthy. \" +\n        \"Simply remove the variant prop and pass an error message instead.\",\n    );\n  }\n\n  // Auto-apply error styling when error prop is truthy\n  // Explicit variant prop takes precedence for backwards compatibility\n  const variant = variantProp ?? (error ? \"error\" : \"default\");\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 hasAriaLabel = Boolean(inputProps[\"aria-label\"]);\n    const hasAriaLabelledBy = Boolean(inputProps[\"aria-labelledby\"]);\n\n    if (!hasLabel && !hasAriaLabel && !hasAriaLabelledBy) {\n      console.warn(\n        \"[Kumo Input]: Input must have an accessible name. Provide either:\\n\" +\n          \"  - label prop: <Input label='Email' />\\n\" +\n          \"  - aria-label: <Input 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        passwordManagerIgnore && \"keeper-ignore\",\n        className,\n      )}\n      {...(passwordManagerIgnore\n        ? {\n            \"data-1p-ignore\": \"true\",\n            \"data-bwignore\": \"true\",\n            \"data-form-type\": \"other\",\n            \"data-lpignore\": \"true\",\n          }\n        : {})}\n      {...inputProps}\n    />\n  );\n\n  // Render with Field wrapper if label, error, or description is provided\n  if (label || error || description) {\n    return (\n      <Field\n        label={label}\n        required={required}\n        labelTooltip={labelTooltip}\n        description={description}\n        error={normalizeFieldError(error)}\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 * />\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    /** Suppress browser extension password manager overlays on non-credential inputs. */\n    passwordManagerIgnore?: boolean;\n  };\n"],"names":["KUMO_INPUT_VARIANTS","KUMO_INPUT_DEFAULT_VARIANTS","inputVariants","variant","size","parentFocusIndicator","focusIndicator","cn","resolveVariant","Input","forwardRef","props","ref","className","variantProp","label","labelTooltip","description","error","passwordManagerIgnore","inputProps","required","hasLabel","hasAriaLabel","hasAriaLabelledBy","input","jsx","BaseInput","Field","normalizeFieldError"],"mappings":";;;;;;;AAWO,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,IAEAC;AAAA,MACER,EAAoB;AAAA,MACpBI;AAAA,MACAH,EAA4B;AAAA,IAAA,EAC5B;AAAA;AAAA,IAEFO;AAAA,MACER,EAAoB;AAAA,MACpBG;AAAA,MACAF,EAA4B;AAAA,IAAA,EAC5B;AAAA;AAAA,IAEFI,MACGF,MAAY,UACT,+DACA;AAAA,IACNG,MACGH,MAAY,UACT,iDACA;AAAA,EAAA;AAEV;AAEO,MAAMM,IAAQC,EAAyC,CAACC,GAAOC,MAAQ;AAC5E,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,MAAAT,IAAO;AAAA,IACP,SAASU;AAAA,IACT,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,uBAAAC,IAAwB;AAAA,IACxB,GAAGC;AAAA,EAAA,IACDT;AAGJ,EAAI,QAAQ,IAAI,aAAa,gBAAgBG,MAAgB,WAC3D,QAAQ;AAAA,IACN;AAAA,EAAA;AAQJ,QAAMX,IAAUW,MAAgBI,IAAQ,UAAU,YAG5C,EAAE,UAAAG,MAAaD;AAGrB,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,UAAME,IAAW,EAAQP,GACnBQ,IAAe,EAAQH,EAAW,YAAY,GAC9CI,IAAoB,EAAQJ,EAAW,iBAAiB;AAE9D,IAAI,CAACE,KAAY,CAACC,KAAgB,CAACC,KACjC,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EAMN;AAEA,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAAf;AAAA,MACA,WAAWL;AAAA,QACTL,EAAc,EAAE,MAAAE,GAAM,SAAAD,GAAS,gBAAgB,IAAM;AAAA,QACrDgB,KAAyB;AAAA,QACzBN;AAAA,MAAA;AAAA,MAED,GAAIM,IACD;AAAA,QACE,kBAAkB;AAAA,QAClB,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,QAClB,iBAAiB;AAAA,MAAA,IAEnB,CAAA;AAAA,MACH,GAAGC;AAAA,IAAA;AAAA,EAAA;AAKR,SAAIL,KAASG,KAASD,IAElB,gBAAAS;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,OAAAb;AAAA,MACA,UAAAM;AAAA,MACA,cAAAL;AAAA,MACA,aAAAC;AAAA,MACA,OAAOY,EAAoBX,CAAK;AAAA,MAE/B,UAAAO;AAAA,IAAA;AAAA,EAAA,IAMAA;AACT,CAAC;AAEDhB,EAAM,cAAc;"}

package/dist/chunks/{label-kaz4uxdt1yf3i5x5.js → label-i0bj94d43irz0k1x.js}

@@ -2,8 +2,8 @@
 import { jsx as e, jsxs as c, Fragment as f } from "react/jsx-runtime";
 import { Info as u } from "@phosphor-icons/react";
 import { c as a } from "./cn-ct4n7r74mh8y0f48.js";
-import { B as p } from "./button-gflkhovvkmt0ftzz.js";
-import { T as b } from "./tooltip-caka3fmn1ogdc7q8.js";
+import { B as p } from "./button-oevxukl0zmwoq4tb.js";
+import { T as b } from "./tooltip-icvb67awe1zolz61.js";
 const T = {
   // Label currently has no variant options but structure is ready for future additions
 }, B = {};
@@ -65,4 +65,4 @@ export {
   B as b,
   d as l
 };
-//# sourceMappingURL=label-kaz4uxdt1yf3i5x5.js.map
+//# sourceMappingURL=label-i0bj94d43irz0k1x.js.map

package/dist/chunks/{label-kaz4uxdt1yf3i5x5.js.map → label-i0bj94d43irz0k1x.js.map}

@@ -1 +1 @@
-{"version":3,"file":"label-kaz4uxdt1yf3i5x5.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 { Button } from \"../button\";\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    \"m-0 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  /** The id of the form element this label is associated with */\n  htmlFor?: string;\n  /**\n   * When true, only renders the inline content (indicators, tooltip) without\n   * the outer label element 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  htmlFor,\n  asContent = false,\n}: LabelProps) {\n  const content = (\n    <>\n      {children}\n      {showOptional && (\n        <span className=\"font-normal text-kumo-subtle\">(optional)</span>\n      )}\n      {tooltip && (\n        <Tooltip\n          content={tooltip}\n          render={\n            <Button\n              variant=\"ghost\"\n              size=\"xs\"\n              shape=\"square\"\n              aria-label=\"More information\"\n            >\n              <Info className=\"size-4\" />\n            </Button>\n          }\n        />\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, render as <label> for accessibility\n  return (\n    <label\n      htmlFor={htmlFor}\n      className={cn(labelVariants(), labelContentVariants(), className)}\n    >\n      {content}\n    </label>\n  );\n}\n\nLabel.displayName = \"Label\";\n"],"names":["KUMO_LABEL_VARIANTS","KUMO_LABEL_DEFAULT_VARIANTS","labelVariants","_props","cn","labelContentVariants","Label","children","showOptional","tooltip","className","htmlFor","asContent","content","jsxs","Fragment","jsx","Tooltip","Button","Info"],"mappings":";;;;;;AAOO,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;AAyDO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AACb,QAAMC,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAR;AAAA,IACAC,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,gCAA+B,UAAA,cAAU;AAAA,IAE1DP,KACC,gBAAAO;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASR;AAAA,QACT,QACE,gBAAAO;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,OAAM;AAAA,YACN,cAAW;AAAA,YAEX,UAAA,gBAAAF,EAACG,GAAA,EAAK,WAAU,SAAA,CAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MAC3B;AAAA,IAAA;AAAA,EAEJ,GAEJ;AAIF,SAAIP,IAEA,gBAAAI,EAAC,UAAK,WAAWZ,EAAGC,KAAwBK,CAAS,GAAI,UAAAG,GAAQ,IAMnE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAAL;AAAA,MACA,WAAWP,EAAGF,EAAA,GAAiBG,EAAA,GAAwBK,CAAS;AAAA,MAE/D,UAAAG;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAP,EAAM,cAAc;"}
+{"version":3,"file":"label-i0bj94d43irz0k1x.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 { Button } from \"../button\";\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    \"m-0 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  /** The id of the form element this label is associated with */\n  htmlFor?: string;\n  /**\n   * When true, only renders the inline content (indicators, tooltip) without\n   * the outer label element 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  htmlFor,\n  asContent = false,\n}: LabelProps) {\n  const content = (\n    <>\n      {children}\n      {showOptional && (\n        <span className=\"font-normal text-kumo-subtle\">(optional)</span>\n      )}\n      {tooltip && (\n        <Tooltip\n          content={tooltip}\n          render={\n            <Button\n              variant=\"ghost\"\n              size=\"xs\"\n              shape=\"square\"\n              aria-label=\"More information\"\n            >\n              <Info className=\"size-4\" />\n            </Button>\n          }\n        />\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, render as <label> for accessibility\n  return (\n    <label\n      htmlFor={htmlFor}\n      className={cn(labelVariants(), labelContentVariants(), className)}\n    >\n      {content}\n    </label>\n  );\n}\n\nLabel.displayName = \"Label\";\n"],"names":["KUMO_LABEL_VARIANTS","KUMO_LABEL_DEFAULT_VARIANTS","labelVariants","_props","cn","labelContentVariants","Label","children","showOptional","tooltip","className","htmlFor","asContent","content","jsxs","Fragment","jsx","Tooltip","Button","Info"],"mappings":";;;;;;AAOO,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;AAyDO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAe;AACb,QAAMC,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAR;AAAA,IACAC,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,gCAA+B,UAAA,cAAU;AAAA,IAE1DP,KACC,gBAAAO;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASR;AAAA,QACT,QACE,gBAAAO;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,OAAM;AAAA,YACN,cAAW;AAAA,YAEX,UAAA,gBAAAF,EAACG,GAAA,EAAK,WAAU,SAAA,CAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MAC3B;AAAA,IAAA;AAAA,EAEJ,GAEJ;AAIF,SAAIP,IAEA,gBAAAI,EAAC,UAAK,WAAWZ,EAAGC,KAAwBK,CAAS,GAAI,UAAAG,GAAQ,IAMnE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAAL;AAAA,MACA,WAAWP,EAAGF,EAAA,GAAiBG,EAAA,GAAwBK,CAAS;AAAA,MAE/D,UAAAG;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAP,EAAM,cAAc;"}

package/dist/chunks/{menubar-gk322oew1y1lr851.js → menubar-jalggrag4utvdpey.js}

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as i } from "react/jsx-runtime";
-import { T as p } from "./tooltip-caka3fmn1ogdc7q8.js";
+import { T as p } from "./tooltip-icvb67awe1zolz61.js";
 import { c as b } from "./cn-ct4n7r74mh8y0f48.js";
 import { IconContext as w } from "@phosphor-icons/react";
 import { useRef as g, useEffect as y } from "react";
@@ -93,4 +93,4 @@ export {
   I as M,
   k as u
 };
-//# sourceMappingURL=menubar-gk322oew1y1lr851.js.map
+//# sourceMappingURL=menubar-jalggrag4utvdpey.js.map