@cloudflare/kumo 2.1.0 → 2.2.1

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

@@ -1 +1 @@
-{"version":3,"file":"label-d14ibjmcbk1qmyrt.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/{layer-card-eomdoafn3sfpih1d.js → layer-card-hyz8lfxceudt05pv.js}

@@ -2,7 +2,7 @@
 import { jsx as s } from "react/jsx-runtime";
 import { forwardRef as y, Children as p, isValidElement as C, Fragment as g } from "react";
 import { c as n } from "./cn-ct4n7r74mh8y0f48.js";
-import { aU as L, aV as S } from "./vendor-base-ui-epfrwb4nfbd4btaz.js";
+import { aU as L, aV as S } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const A = "overflow-hidden rounded-lg bg-kumo-base shadow-xs ring ring-kumo-line", R = "flex w-full flex-col overflow-hidden rounded-lg bg-kumo-elevated text-base ring ring-kumo-hairline", _ = "-my-2 flex items-center gap-2 bg-kumo-elevated p-4 text-base font-medium text-kumo-subtle", E = "relative flex flex-col gap-2 overflow-hidden rounded-lg bg-kumo-base p-4 pr-3 text-inherit no-underline ring ring-kumo-fill";
 function x(r = {}) {
   return n(A);
@@ -44,4 +44,4 @@ const h = Object.assign(d, {
 export {
   h as L
 };
-//# sourceMappingURL=layer-card-eomdoafn3sfpih1d.js.map
+//# sourceMappingURL=layer-card-hyz8lfxceudt05pv.js.map

package/dist/chunks/{layer-card-eomdoafn3sfpih1d.js.map → layer-card-hyz8lfxceudt05pv.js.map}

@@ -1 +1 @@
-{"version":3,"file":"layer-card-eomdoafn3sfpih1d.js","sources":["../../src/components/layer-card/layer-card.tsx"],"sourcesContent":["import {\n  Children,\n  Fragment,\n  forwardRef,\n  isValidElement,\n  type ComponentPropsWithoutRef,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cn } from \"../../utils/cn\";\n\nconst LAYER_CARD_SURFACE_CLASSES =\n  \"overflow-hidden rounded-lg bg-kumo-base shadow-xs ring ring-kumo-line\";\nconst LAYER_CARD_LAYERED_ROOT_CLASSES =\n  \"flex w-full flex-col overflow-hidden rounded-lg bg-kumo-elevated text-base ring ring-kumo-hairline\";\nconst LAYER_CARD_SECONDARY_CLASSES =\n  \"-my-2 flex items-center gap-2 bg-kumo-elevated p-4 text-base font-medium text-kumo-subtle\";\nconst LAYER_CARD_PRIMARY_CLASSES =\n  \"relative flex flex-col gap-2 overflow-hidden rounded-lg bg-kumo-base p-4 pr-3 text-inherit no-underline ring ring-kumo-fill\";\n\n/** LayerCard variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_LAYER_CARD_VARIANTS = {\n  // LayerCard currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LAYER_CARD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LAYER_CARD_VARIANTS\nexport interface KumoLayerCardVariantsProps {}\n\nexport function layerCardVariants(_props: KumoLayerCardVariantsProps = {}) {\n  return cn(LAYER_CARD_SURFACE_CLASSES);\n}\n\nfunction hasLayerCardSections(children: ReactNode): boolean {\n  return Children.toArray(children).some((child): boolean => {\n    if (!isValidElement(child)) {\n      return false;\n    }\n\n    if (child.type === LayerCardPrimary || child.type === LayerCardSecondary) {\n      return true;\n    }\n\n    if (child.type === Fragment) {\n      const fragmentChild = child as ReactElement<{ children?: ReactNode }>;\n      return hasLayerCardSections(fragmentChild.props.children);\n    }\n\n    return false;\n  });\n}\n\n/**\n * LayerCard component props.\n *\n * @example\n * ```tsx\n * <LayerCard className=\"p-4\">\n *   Get started with Kumo\n * </LayerCard>\n *\n * <LayerCard>\n *   <LayerCard.Secondary>Next Steps</LayerCard.Secondary>\n *   <LayerCard.Primary>Get started with Kumo</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nexport type LayerCardProps = useRender.ComponentProps<\"div\"> &\n  KumoLayerCardVariantsProps;\n\nexport type LayerCardSectionProps = ComponentPropsWithoutRef<\"div\">;\n\n/**\n * Card container for both simple surfaces and layered layouts.\n *\n * Render children directly for a single-surface card, or use\n * `LayerCard.Secondary` and `LayerCard.Primary` for the layered card treatment.\n *\n * @example\n * ```tsx\n * <LayerCard className=\"rounded-lg p-4\">Card content</LayerCard>\n * ```\n *\n * @example\n * ```tsx\n * <LayerCard>\n *   <LayerCard.Secondary>Getting Started</LayerCard.Secondary>\n *   <LayerCard.Primary>Quick start guide</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nconst LayerCardRoot = forwardRef<HTMLDivElement, LayerCardProps>(function LayerCard(\n  { children, className, render, ...props },\n  ref,\n) {\n  const hasStructuredLayers = hasLayerCardSections(children);\n\n  const defaultProps: useRender.ElementProps<\"div\"> = {\n    className: cn(\n      hasStructuredLayers ? LAYER_CARD_LAYERED_ROOT_CLASSES : layerCardVariants(),\n      className,\n    ),\n  };\n\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    ref,\n    props: mergeProps<\"div\">(defaultProps, props, { children }),\n  });\n});\n\nfunction LayerCardSecondary({\n  children,\n  className,\n  ...props\n}: LayerCardSectionProps) {\n  return <div className={cn(LAYER_CARD_SECONDARY_CLASSES, className)} {...props}>{children}</div>;\n}\n\nfunction LayerCardPrimary({ children, className, ...props }: LayerCardSectionProps) {\n  return <div className={cn(LAYER_CARD_PRIMARY_CLASSES, className)} {...props}>{children}</div>;\n}\n\nLayerCardRoot.displayName = \"LayerCard\";\nLayerCardSecondary.displayName = \"LayerCard.Secondary\";\nLayerCardPrimary.displayName = \"LayerCard.Primary\";\n\ntype LayerCardComponent = typeof LayerCardRoot & {\n  Primary: typeof LayerCardPrimary;\n  Secondary: typeof LayerCardSecondary;\n};\n\nconst LayerCard = Object.assign(LayerCardRoot, {\n  Primary: LayerCardPrimary,\n  Secondary: LayerCardSecondary,\n}) as LayerCardComponent;\n\nexport { LayerCard };\n"],"names":["LAYER_CARD_SURFACE_CLASSES","LAYER_CARD_LAYERED_ROOT_CLASSES","LAYER_CARD_SECONDARY_CLASSES","LAYER_CARD_PRIMARY_CLASSES","layerCardVariants","_props","cn","hasLayerCardSections","children","Children","child","isValidElement","LayerCardPrimary","LayerCardSecondary","Fragment","LayerCardRoot","forwardRef","className","render","props","ref","hasStructuredLayers","defaultProps","useRender","mergeProps","jsx","LayerCard"],"mappings":";;;;;AAaA,MAAMA,IACJ,yEACIC,IACJ,sGACIC,IACJ,6FACIC,IACJ;AAYK,SAASC,EAAkBC,IAAqC,IAAI;AACzE,SAAOC,EAAGN,CAA0B;AACtC;AAEA,SAASO,EAAqBC,GAA8B;AAC1D,SAAOC,EAAS,QAAQD,CAAQ,EAAE,KAAK,CAACE,MACjCC,EAAeD,CAAK,IAIrBA,EAAM,SAASE,KAAoBF,EAAM,SAASG,IAC7C,KAGLH,EAAM,SAASI,IAEVP,EADeG,EACoB,MAAM,QAAQ,IAGnD,KAZE,EAaV;AACH;AAyCA,MAAMK,IAAgBC,EAA2C,SAC/D,EAAE,UAAAR,GAAU,WAAAS,GAAW,QAAAC,GAAQ,GAAGC,EAAA,GAClCC,GACA;AACA,QAAMC,IAAsBd,EAAqBC,CAAQ,GAEnDc,IAA8C;AAAA,IAClD,WAAWhB;AAAA,MACTe,IAAsBpB,IAAkCG,EAAA;AAAA,MACxDa;AAAA,IAAA;AAAA,EACF;AAGF,SAAOM,EAAU;AAAA,IACf,gBAAgB;AAAA,IAChB,QAAAL;AAAA,IACA,KAAAE;AAAA,IACA,OAAOI,EAAkBF,GAAcH,GAAO,EAAE,UAAAX,GAAU;AAAA,EAAA,CAC3D;AACH,CAAC;AAED,SAASK,EAAmB;AAAA,EAC1B,UAAAL;AAAA,EACA,WAAAS;AAAA,EACA,GAAGE;AACL,GAA0B;AACxB,SAAO,gBAAAM,EAAC,SAAI,WAAWnB,EAAGJ,GAA8Be,CAAS,GAAI,GAAGE,GAAQ,UAAAX,GAAS;AAC3F;AAEA,SAASI,EAAiB,EAAE,UAAAJ,GAAU,WAAAS,GAAW,GAAGE,KAAgC;AAClF,SAAO,gBAAAM,EAAC,SAAI,WAAWnB,EAAGH,GAA4Bc,CAAS,GAAI,GAAGE,GAAQ,UAAAX,GAAS;AACzF;AAEAO,EAAc,cAAc;AAC5BF,EAAmB,cAAc;AACjCD,EAAiB,cAAc;AAO/B,MAAMc,IAAY,OAAO,OAAOX,GAAe;AAAA,EAC7C,SAASH;AAAA,EACT,WAAWC;AACb,CAAC;"}
+{"version":3,"file":"layer-card-hyz8lfxceudt05pv.js","sources":["../../src/components/layer-card/layer-card.tsx"],"sourcesContent":["import {\n  Children,\n  Fragment,\n  forwardRef,\n  isValidElement,\n  type ComponentPropsWithoutRef,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cn } from \"../../utils/cn\";\n\nconst LAYER_CARD_SURFACE_CLASSES =\n  \"overflow-hidden rounded-lg bg-kumo-base shadow-xs ring ring-kumo-line\";\nconst LAYER_CARD_LAYERED_ROOT_CLASSES =\n  \"flex w-full flex-col overflow-hidden rounded-lg bg-kumo-elevated text-base ring ring-kumo-hairline\";\nconst LAYER_CARD_SECONDARY_CLASSES =\n  \"-my-2 flex items-center gap-2 bg-kumo-elevated p-4 text-base font-medium text-kumo-subtle\";\nconst LAYER_CARD_PRIMARY_CLASSES =\n  \"relative flex flex-col gap-2 overflow-hidden rounded-lg bg-kumo-base p-4 pr-3 text-inherit no-underline ring ring-kumo-fill\";\n\n/** LayerCard variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_LAYER_CARD_VARIANTS = {\n  // LayerCard currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_LAYER_CARD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_LAYER_CARD_VARIANTS\nexport interface KumoLayerCardVariantsProps {}\n\nexport function layerCardVariants(_props: KumoLayerCardVariantsProps = {}) {\n  return cn(LAYER_CARD_SURFACE_CLASSES);\n}\n\nfunction hasLayerCardSections(children: ReactNode): boolean {\n  return Children.toArray(children).some((child): boolean => {\n    if (!isValidElement(child)) {\n      return false;\n    }\n\n    if (child.type === LayerCardPrimary || child.type === LayerCardSecondary) {\n      return true;\n    }\n\n    if (child.type === Fragment) {\n      const fragmentChild = child as ReactElement<{ children?: ReactNode }>;\n      return hasLayerCardSections(fragmentChild.props.children);\n    }\n\n    return false;\n  });\n}\n\n/**\n * LayerCard component props.\n *\n * @example\n * ```tsx\n * <LayerCard className=\"p-4\">\n *   Get started with Kumo\n * </LayerCard>\n *\n * <LayerCard>\n *   <LayerCard.Secondary>Next Steps</LayerCard.Secondary>\n *   <LayerCard.Primary>Get started with Kumo</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nexport type LayerCardProps = useRender.ComponentProps<\"div\"> &\n  KumoLayerCardVariantsProps;\n\nexport type LayerCardSectionProps = ComponentPropsWithoutRef<\"div\">;\n\n/**\n * Card container for both simple surfaces and layered layouts.\n *\n * Render children directly for a single-surface card, or use\n * `LayerCard.Secondary` and `LayerCard.Primary` for the layered card treatment.\n *\n * @example\n * ```tsx\n * <LayerCard className=\"rounded-lg p-4\">Card content</LayerCard>\n * ```\n *\n * @example\n * ```tsx\n * <LayerCard>\n *   <LayerCard.Secondary>Getting Started</LayerCard.Secondary>\n *   <LayerCard.Primary>Quick start guide</LayerCard.Primary>\n * </LayerCard>\n * ```\n */\nconst LayerCardRoot = forwardRef<HTMLDivElement, LayerCardProps>(function LayerCard(\n  { children, className, render, ...props },\n  ref,\n) {\n  const hasStructuredLayers = hasLayerCardSections(children);\n\n  const defaultProps: useRender.ElementProps<\"div\"> = {\n    className: cn(\n      hasStructuredLayers ? LAYER_CARD_LAYERED_ROOT_CLASSES : layerCardVariants(),\n      className,\n    ),\n  };\n\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    ref,\n    props: mergeProps<\"div\">(defaultProps, props, { children }),\n  });\n});\n\nfunction LayerCardSecondary({\n  children,\n  className,\n  ...props\n}: LayerCardSectionProps) {\n  return <div className={cn(LAYER_CARD_SECONDARY_CLASSES, className)} {...props}>{children}</div>;\n}\n\nfunction LayerCardPrimary({ children, className, ...props }: LayerCardSectionProps) {\n  return <div className={cn(LAYER_CARD_PRIMARY_CLASSES, className)} {...props}>{children}</div>;\n}\n\nLayerCardRoot.displayName = \"LayerCard\";\nLayerCardSecondary.displayName = \"LayerCard.Secondary\";\nLayerCardPrimary.displayName = \"LayerCard.Primary\";\n\ntype LayerCardComponent = typeof LayerCardRoot & {\n  Primary: typeof LayerCardPrimary;\n  Secondary: typeof LayerCardSecondary;\n};\n\nconst LayerCard = Object.assign(LayerCardRoot, {\n  Primary: LayerCardPrimary,\n  Secondary: LayerCardSecondary,\n}) as LayerCardComponent;\n\nexport { LayerCard };\n"],"names":["LAYER_CARD_SURFACE_CLASSES","LAYER_CARD_LAYERED_ROOT_CLASSES","LAYER_CARD_SECONDARY_CLASSES","LAYER_CARD_PRIMARY_CLASSES","layerCardVariants","_props","cn","hasLayerCardSections","children","Children","child","isValidElement","LayerCardPrimary","LayerCardSecondary","Fragment","LayerCardRoot","forwardRef","className","render","props","ref","hasStructuredLayers","defaultProps","useRender","mergeProps","jsx","LayerCard"],"mappings":";;;;;AAaA,MAAMA,IACJ,yEACIC,IACJ,sGACIC,IACJ,6FACIC,IACJ;AAYK,SAASC,EAAkBC,IAAqC,IAAI;AACzE,SAAOC,EAAGN,CAA0B;AACtC;AAEA,SAASO,EAAqBC,GAA8B;AAC1D,SAAOC,EAAS,QAAQD,CAAQ,EAAE,KAAK,CAACE,MACjCC,EAAeD,CAAK,IAIrBA,EAAM,SAASE,KAAoBF,EAAM,SAASG,IAC7C,KAGLH,EAAM,SAASI,IAEVP,EADeG,EACoB,MAAM,QAAQ,IAGnD,KAZE,EAaV;AACH;AAyCA,MAAMK,IAAgBC,EAA2C,SAC/D,EAAE,UAAAR,GAAU,WAAAS,GAAW,QAAAC,GAAQ,GAAGC,EAAA,GAClCC,GACA;AACA,QAAMC,IAAsBd,EAAqBC,CAAQ,GAEnDc,IAA8C;AAAA,IAClD,WAAWhB;AAAA,MACTe,IAAsBpB,IAAkCG,EAAA;AAAA,MACxDa;AAAA,IAAA;AAAA,EACF;AAGF,SAAOM,EAAU;AAAA,IACf,gBAAgB;AAAA,IAChB,QAAAL;AAAA,IACA,KAAAE;AAAA,IACA,OAAOI,EAAkBF,GAAcH,GAAO,EAAE,UAAAX,GAAU;AAAA,EAAA,CAC3D;AACH,CAAC;AAED,SAASK,EAAmB;AAAA,EAC1B,UAAAL;AAAA,EACA,WAAAS;AAAA,EACA,GAAGE;AACL,GAA0B;AACxB,SAAO,gBAAAM,EAAC,SAAI,WAAWnB,EAAGJ,GAA8Be,CAAS,GAAI,GAAGE,GAAQ,UAAAX,GAAS;AAC3F;AAEA,SAASI,EAAiB,EAAE,UAAAJ,GAAU,WAAAS,GAAW,GAAGE,KAAgC;AAClF,SAAO,gBAAAM,EAAC,SAAI,WAAWnB,EAAGH,GAA4Bc,CAAS,GAAI,GAAGE,GAAQ,UAAAX,GAAS;AACzF;AAEAO,EAAc,cAAc;AAC5BF,EAAmB,cAAc;AACjCD,EAAiB,cAAc;AAO/B,MAAMc,IAAY,OAAO,OAAOX,GAAe;AAAA,EAC7C,SAASH;AAAA,EACT,WAAWC;AACb,CAAC;"}

package/dist/chunks/{link-ihastr6a2dmo1so5.js → link-lkzjiitte3l29q87.js}

@@ -4,7 +4,7 @@ import { forwardRef as k, useEffect as f } from "react";
 import { c as r } from "./cn-ct4n7r74mh8y0f48.js";
 import { r as L } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
 import { u as h } from "./link-provider-mn2voeohon7cj9o4.js";
-import { aU as x, aV as v } from "./vendor-base-ui-epfrwb4nfbd4btaz.js";
+import { aU as x, aV as v } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const o = (n) => /* @__PURE__ */ d(
   "svg",
   {
@@ -91,4 +91,4 @@ export {
   t as a,
   g as l
 };
-//# sourceMappingURL=link-ihastr6a2dmo1so5.js.map
+//# sourceMappingURL=link-lkzjiitte3l29q87.js.map

package/dist/chunks/{link-ihastr6a2dmo1so5.js.map → link-lkzjiitte3l29q87.js.map}

@@ -1 +1 @@
-{"version":3,"file":"link-ihastr6a2dmo1so5.js","sources":["../../src/components/link/link.tsx"],"sourcesContent":["import { forwardRef, useEffect, type SVGProps } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n  useLinkComponent,\n  type LinkComponentProps,\n} from \"../../utils/link-provider\";\n\n/**\n * ExternalIcon - Visual indicator for links that open in a new tab/window.\n *\n * Use this as a child of Link to indicate external navigation:\n * ```tsx\n * <Link href=\"https://example.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Example <Link.ExternalIcon />\n * </Link>\n * ```\n */\nconst ExternalIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    className=\"link-external-icon\"\n    {...props}\n  >\n    <path d=\"M9 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V15\" />\n    <path d=\"M14 4H20M20 4V10M20 4L11 13\" />\n  </svg>\n);\n\nExternalIcon.displayName = \"Link.ExternalIcon\";\n\n/** Link variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_LINK_VARIANTS = {\n  variant: {\n    inline: {\n      classes:\n        // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n        \"text-kumo-link underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Inline text link that flows with content\",\n    },\n    current: {\n      classes:\n        \"text-current underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Link that inherits color from parent text\",\n    },\n    plain: {\n      classes:\n        // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n        \"text-kumo-link hover:text-kumo-link/70 transition-colors\",\n      description: \"Link without underline decoration\",\n    },\n  },\n} as const;\n\nexport const KUMO_LINK_DEFAULT_VARIANTS = {\n  variant: \"inline\",\n} as const;\n\nexport type KumoLinkVariant = keyof typeof KUMO_LINK_VARIANTS.variant;\n\nexport interface KumoLinkVariantsProps {\n  /**\n   * Visual style of the link.\n   * - `\"inline\"` — Inline text link that flows with content\n   * - `\"current\"` — Link that inherits color from parent text\n   * - `\"plain\"` — Link without underline decoration\n   * @default \"inline\"\n   */\n  variant?: KumoLinkVariant;\n}\n\nexport function linkVariants({\n  variant = KUMO_LINK_DEFAULT_VARIANTS.variant,\n}: KumoLinkVariantsProps = {}) {\n  return cn(resolveVariant(KUMO_LINK_VARIANTS.variant, variant, KUMO_LINK_DEFAULT_VARIANTS.variant).classes);\n}\n\n/**\n * Link component props.\n *\n * Use `href` for the link destination. For framework-specific routing, use the\n * `render` prop or configure a `LinkProvider` at the app root.\n *\n * @example Internal link\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with render prop\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />}>Dashboard</Link>\n * ```\n */\nexport type LinkProps = useRender.ComponentProps<\"a\"> &\n  LinkComponentProps &\n  KumoLinkVariantsProps;\n\n/**\n * Link component for consistent inline text links.\n *\n * Link is a **presentational component** — it handles visual styling and\n * accessibility. Routing behavior belongs in the application layer, via\n * either the `render` prop or a `LinkProvider`.\n *\n * - Without `render`: renders via LinkProvider (default `<a>` or configured component)\n * - With `render`: merges props onto the provided element with proper ref/event handling\n *\n * @example Basic usage\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link with icon\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with React Router via render prop\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />} variant=\"inline\">\n *   Dashboard\n * </Link>\n * ```\n *\n * @example Composition via LinkProvider (recommended for app-wide routing)\n * ```tsx\n * // App root:\n * <LinkProvider component={AppLink}>\n *   <App />\n * </LinkProvider>\n *\n * // Then use href everywhere:\n * <Link href=\"/dashboard\">Dashboard</Link>\n * <Link href=\"https://example.com\" target=\"_blank\">External</Link>\n * ```\n */\nconst LinkBase = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { className, variant = \"inline\", render, ...props },\n  ref,\n) {\n  const LinkComponent = useLinkComponent();\n\n  if (process.env.NODE_ENV !== \"production\") {\n    // eslint-disable-next-line react-hooks/rules-of-hooks -- dev-only, conditional is stable\n    useEffect(() => {\n      if (\"to\" in props && props.to !== undefined) {\n        console.warn(\n          '[kumo] Link: The `to` prop is deprecated. Use `href` instead.\\n\\n' +\n            'If your app uses a client-side router, configure a LinkProvider that\\n' +\n            'maps `href` to your router\\'s navigation prop. See:\\n' +\n            'https://kumo.cfops.it/utilities/link-provider\\n\\n' +\n            'Migration example:\\n' +\n            '  Before: <Link to=\"/page\">…</Link>\\n' +\n            '  After:  <Link href=\"/page\">…</Link>',\n        );\n      }\n    }, []); // eslint-disable-line react-hooks/exhaustive-deps -- one-time warning\n  }\n\n  const defaultProps: useRender.ElementProps<\"a\"> = {\n    className: cn(\n      linkVariants({ variant }),\n      \"group/link inline-flex items-center gap-[0.1875em]\",\n    ),\n  };\n\n  const element = useRender({\n    render: render ?? <LinkComponent />,\n    ref,\n    props: mergeProps<\"a\">(defaultProps, props, { className }),\n  });\n\n  return element;\n});\n\nLinkBase.displayName = \"Link\";\n\n// Compound component with ExternalIcon subcomponent\nexport const Link = Object.assign(LinkBase, {\n  ExternalIcon,\n});\n"],"names":["ExternalIcon","props","jsxs","jsx","KUMO_LINK_VARIANTS","KUMO_LINK_DEFAULT_VARIANTS","linkVariants","variant","cn","resolveVariant","LinkBase","forwardRef","className","render","ref","LinkComponent","useLinkComponent","useEffect","defaultProps","useRender","mergeProps","Link"],"mappings":";;;;;;;AAoBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,eAAc;AAAA,IACd,gBAAe;AAAA,IACf,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAA,EAAK,GAAE,kWAAA,CAAkW;AAAA,MAC1W,gBAAAA,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA8B;AAAA,IAAA;AAAA,EAAA;AACxC;AAGFH,EAAa,cAAc;AAGpB,MAAMI,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,QAAQ;AAAA,MACN;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,SAAS;AACX;AAeO,SAASC,EAAa;AAAA,EAC3B,SAAAC,IAAUF,EAA2B;AACvC,IAA2B,IAAI;AAC7B,SAAOG,EAAGC,EAAeL,EAAmB,SAASG,GAASF,EAA2B,OAAO,EAAE,OAAO;AAC3G;AAsEA,MAAMK,IAAWC,EAAyC,SACxD,EAAE,WAAAC,GAAW,SAAAL,IAAU,UAAU,QAAAM,GAAQ,GAAGZ,EAAA,GAC5Ca,GACA;AACA,QAAMC,IAAgBC,EAAA;AAEtB,EAAI,QAAQ,IAAI,aAAa,gBAE3BC,EAAU,MAAM;AACd,IAAI,QAAQhB,KAASA,EAAM,OAAO,UAChC,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EASN,GAAG,CAAA,CAAE;AAGP,QAAMiB,IAA4C;AAAA,IAChD,WAAWV;AAAA,MACTF,EAAa,EAAE,SAAAC,GAAS;AAAA,MACxB;AAAA,IAAA;AAAA,EACF;AASF,SANgBY,EAAU;AAAA,IACxB,QAAQN,KAAU,gBAAAV,EAACY,GAAA,CAAA,CAAc;AAAA,IACjC,KAAAD;AAAA,IACA,OAAOM,EAAgBF,GAAcjB,GAAO,EAAE,WAAAW,GAAW;AAAA,EAAA,CAC1D;AAGH,CAAC;AAEDF,EAAS,cAAc;AAGhB,MAAMW,IAAO,OAAO,OAAOX,GAAU;AAAA,EAC1C,cAAAV;AACF,CAAC;"}
+{"version":3,"file":"link-lkzjiitte3l29q87.js","sources":["../../src/components/link/link.tsx"],"sourcesContent":["import { forwardRef, useEffect, type SVGProps } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n  useLinkComponent,\n  type LinkComponentProps,\n} from \"../../utils/link-provider\";\n\n/**\n * ExternalIcon - Visual indicator for links that open in a new tab/window.\n *\n * Use this as a child of Link to indicate external navigation:\n * ```tsx\n * <Link href=\"https://example.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Example <Link.ExternalIcon />\n * </Link>\n * ```\n */\nconst ExternalIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    className=\"link-external-icon\"\n    {...props}\n  >\n    <path d=\"M9 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V15\" />\n    <path d=\"M14 4H20M20 4V10M20 4L11 13\" />\n  </svg>\n);\n\nExternalIcon.displayName = \"Link.ExternalIcon\";\n\n/** Link variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_LINK_VARIANTS = {\n  variant: {\n    inline: {\n      classes:\n        // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n        \"text-kumo-link underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Inline text link that flows with content\",\n    },\n    current: {\n      classes:\n        \"text-current underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n      description: \"Link that inherits color from parent text\",\n    },\n    plain: {\n      classes:\n        // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n        \"text-kumo-link hover:text-kumo-link/70 transition-colors\",\n      description: \"Link without underline decoration\",\n    },\n  },\n} as const;\n\nexport const KUMO_LINK_DEFAULT_VARIANTS = {\n  variant: \"inline\",\n} as const;\n\nexport type KumoLinkVariant = keyof typeof KUMO_LINK_VARIANTS.variant;\n\nexport interface KumoLinkVariantsProps {\n  /**\n   * Visual style of the link.\n   * - `\"inline\"` — Inline text link that flows with content\n   * - `\"current\"` — Link that inherits color from parent text\n   * - `\"plain\"` — Link without underline decoration\n   * @default \"inline\"\n   */\n  variant?: KumoLinkVariant;\n}\n\nexport function linkVariants({\n  variant = KUMO_LINK_DEFAULT_VARIANTS.variant,\n}: KumoLinkVariantsProps = {}) {\n  return cn(resolveVariant(KUMO_LINK_VARIANTS.variant, variant, KUMO_LINK_DEFAULT_VARIANTS.variant).classes);\n}\n\n/**\n * Link component props.\n *\n * Use `href` for the link destination. For framework-specific routing, use the\n * `render` prop or configure a `LinkProvider` at the app root.\n *\n * @example Internal link\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with render prop\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />}>Dashboard</Link>\n * ```\n */\nexport type LinkProps = useRender.ComponentProps<\"a\"> &\n  LinkComponentProps &\n  KumoLinkVariantsProps;\n\n/**\n * Link component for consistent inline text links.\n *\n * Link is a **presentational component** — it handles visual styling and\n * accessibility. Routing behavior belongs in the application layer, via\n * either the `render` prop or a `LinkProvider`.\n *\n * - Without `render`: renders via LinkProvider (default `<a>` or configured component)\n * - With `render`: merges props onto the provided element with proper ref/event handling\n *\n * @example Basic usage\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link with icon\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n *   Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with React Router via render prop\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />} variant=\"inline\">\n *   Dashboard\n * </Link>\n * ```\n *\n * @example Composition via LinkProvider (recommended for app-wide routing)\n * ```tsx\n * // App root:\n * <LinkProvider component={AppLink}>\n *   <App />\n * </LinkProvider>\n *\n * // Then use href everywhere:\n * <Link href=\"/dashboard\">Dashboard</Link>\n * <Link href=\"https://example.com\" target=\"_blank\">External</Link>\n * ```\n */\nconst LinkBase = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { className, variant = \"inline\", render, ...props },\n  ref,\n) {\n  const LinkComponent = useLinkComponent();\n\n  if (process.env.NODE_ENV !== \"production\") {\n    // eslint-disable-next-line react-hooks/rules-of-hooks -- dev-only, conditional is stable\n    useEffect(() => {\n      if (\"to\" in props && props.to !== undefined) {\n        console.warn(\n          '[kumo] Link: The `to` prop is deprecated. Use `href` instead.\\n\\n' +\n            'If your app uses a client-side router, configure a LinkProvider that\\n' +\n            'maps `href` to your router\\'s navigation prop. See:\\n' +\n            'https://kumo.cfops.it/utilities/link-provider\\n\\n' +\n            'Migration example:\\n' +\n            '  Before: <Link to=\"/page\">…</Link>\\n' +\n            '  After:  <Link href=\"/page\">…</Link>',\n        );\n      }\n    }, []); // eslint-disable-line react-hooks/exhaustive-deps -- one-time warning\n  }\n\n  const defaultProps: useRender.ElementProps<\"a\"> = {\n    className: cn(\n      linkVariants({ variant }),\n      \"group/link inline-flex items-center gap-[0.1875em]\",\n    ),\n  };\n\n  const element = useRender({\n    render: render ?? <LinkComponent />,\n    ref,\n    props: mergeProps<\"a\">(defaultProps, props, { className }),\n  });\n\n  return element;\n});\n\nLinkBase.displayName = \"Link\";\n\n// Compound component with ExternalIcon subcomponent\nexport const Link = Object.assign(LinkBase, {\n  ExternalIcon,\n});\n"],"names":["ExternalIcon","props","jsxs","jsx","KUMO_LINK_VARIANTS","KUMO_LINK_DEFAULT_VARIANTS","linkVariants","variant","cn","resolveVariant","LinkBase","forwardRef","className","render","ref","LinkComponent","useLinkComponent","useEffect","defaultProps","useRender","mergeProps","Link"],"mappings":";;;;;;;AAoBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,eAAc;AAAA,IACd,gBAAe;AAAA,IACf,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAA,EAAK,GAAE,kWAAA,CAAkW;AAAA,MAC1W,gBAAAA,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA8B;AAAA,IAAA;AAAA,EAAA;AACxC;AAGFH,EAAa,cAAc;AAGpB,MAAMI,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,QAAQ;AAAA,MACN;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,SAAS;AACX;AAeO,SAASC,EAAa;AAAA,EAC3B,SAAAC,IAAUF,EAA2B;AACvC,IAA2B,IAAI;AAC7B,SAAOG,EAAGC,EAAeL,EAAmB,SAASG,GAASF,EAA2B,OAAO,EAAE,OAAO;AAC3G;AAsEA,MAAMK,IAAWC,EAAyC,SACxD,EAAE,WAAAC,GAAW,SAAAL,IAAU,UAAU,QAAAM,GAAQ,GAAGZ,EAAA,GAC5Ca,GACA;AACA,QAAMC,IAAgBC,EAAA;AAEtB,EAAI,QAAQ,IAAI,aAAa,gBAE3BC,EAAU,MAAM;AACd,IAAI,QAAQhB,KAASA,EAAM,OAAO,UAChC,QAAQ;AAAA,MACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,EASN,GAAG,CAAA,CAAE;AAGP,QAAMiB,IAA4C;AAAA,IAChD,WAAWV;AAAA,MACTF,EAAa,EAAE,SAAAC,GAAS;AAAA,MACxB;AAAA,IAAA;AAAA,EACF;AASF,SANgBY,EAAU;AAAA,IACxB,QAAQN,KAAU,gBAAAV,EAACY,GAAA,CAAA,CAAc;AAAA,IACjC,KAAAD;AAAA,IACA,OAAOM,EAAgBF,GAAcjB,GAAO,EAAE,WAAAW,GAAW;AAAA,EAAA,CAC1D;AAGH,CAAC;AAEDF,EAAS,cAAc;AAGhB,MAAMW,IAAO,OAAO,OAAOX,GAAU;AAAA,EAC1C,cAAAV;AACF,CAAC;"}

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

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as i } from "react/jsx-runtime";
-import { T as p } from "./tooltip-fjxy4s4l75hjxp1x.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-f6xelkurau8cl60f.js.map
+//# sourceMappingURL=menubar-jalggrag4utvdpey.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"menubar-f6xelkurau8cl60f.js","sources":["../../src/components/menubar/use-menu-navigation.ts","../../src/components/menubar/menubar.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\n\ntype UseMenuNavigationProps = {\n  menuRef: React.RefObject<HTMLElement | null>;\n  direction?: \"horizontal\" | \"vertical\"; // Default: horizontal\n};\n\nexport const useMenuNavigation = ({\n  menuRef,\n  direction = \"horizontal\",\n}: UseMenuNavigationProps) => {\n  const activeElementRef = useRef<HTMLElement | null>(null);\n\n  useEffect(() => {\n    if (!menuRef.current) return;\n\n    const focusableElements = Array.from(\n      menuRef.current.querySelectorAll(\n        'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])',\n      ),\n    ) as HTMLElement[];\n\n    if (focusableElements.length === 0) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (!activeElementRef.current) return;\n\n      const currentIndex = focusableElements.indexOf(activeElementRef.current);\n      let nextIndex = currentIndex;\n\n      const isHorizontal = direction === \"horizontal\";\n      const forwardKey = isHorizontal ? \"ArrowRight\" : \"ArrowDown\";\n      const backwardKey = isHorizontal ? \"ArrowLeft\" : \"ArrowUp\";\n\n      if (e.key === forwardKey) {\n        e.preventDefault();\n        nextIndex = (currentIndex + 1) % focusableElements.length;\n      } else if (e.key === backwardKey) {\n        e.preventDefault();\n        nextIndex =\n          (currentIndex - 1 + focusableElements.length) %\n          focusableElements.length;\n      } else {\n        return;\n      }\n\n      const nextElement = focusableElements[nextIndex];\n      activeElementRef.current = nextElement;\n      nextElement.focus();\n    };\n\n    const addKeyListener = () =>\n      document.addEventListener(\"keydown\", handleKeyDown);\n    const removeKeyListener = () =>\n      document.removeEventListener(\"keydown\", handleKeyDown);\n\n    const handleFocusIn = () => {\n      activeElementRef.current = document.activeElement as HTMLElement;\n      addKeyListener();\n    };\n\n    const handleFocusOut = () => {\n      activeElementRef.current = null;\n      removeKeyListener();\n    };\n\n    menuRef.current.addEventListener(\"focusin\", handleFocusIn);\n    menuRef.current.addEventListener(\"focusout\", handleFocusOut);\n\n    return () => {\n      menuRef.current?.removeEventListener(\"focusin\", handleFocusIn);\n      menuRef.current?.removeEventListener(\"focusout\", handleFocusOut);\n      removeKeyListener();\n    };\n  }, [menuRef, direction]);\n};\n","import { Tooltip } from \"../tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { IconContext } from \"@phosphor-icons/react\";\nimport React, { useRef } from \"react\";\nimport { useMenuNavigation } from \"./use-menu-navigation\";\n\n/** MenuBar variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_MENUBAR_VARIANTS = {\n  // MenuBar currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_MENUBAR_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_MENUBAR_VARIANTS\nexport interface KumoMenuBarVariantsProps {}\n\nexport function menuBarVariants(_props: KumoMenuBarVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex rounded-lg border border-kumo-recessed bg-kumo-recessed pl-px shadow-xs transition-colors\",\n  );\n}\n\n/** Props for an individual menu option within a MenuBar. */\ntype MenuOptionProps = {\n  /** Icon element (typically from `@phosphor-icons/react`) rendered at 18px */\n  icon: React.ReactNode;\n  /** Unique identifier for the option (used when `optionIds` is true) */\n  id?: number | string;\n  /** Currently active value from the parent MenuBar */\n  isActive?: number | boolean | string | undefined;\n  /** Callback when this option is clicked */\n  onClick: () => void;\n  /** Tooltip text shown on hover */\n  tooltip: string;\n};\n\nconst MenuOption = ({\n  icon,\n  id,\n  isActive,\n  onClick,\n  tooltip,\n}: MenuOptionProps) => {\n  const button = (\n    <button\n      aria-label={tooltip}\n      className={cn(\n        \"relative -ml-px flex h-full w-11 cursor-pointer items-center justify-center rounded-md border-none bg-kumo-recessed first:rounded-l-lg last:rounded-r-lg transition-colors focus:z-3 focus:outline-none focus:ring-kumo-focus/50 focus-visible:z-3 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n        {\n          \"z-2 bg-kumo-base shadow-xs transition-colors\": isActive === id,\n        },\n      )}\n      onClick={onClick}\n    >\n      <IconContext.Provider value={{ size: 18 }} {...({} as any)}>\n        {icon}\n      </IconContext.Provider>\n    </button>\n  );\n\n  return <Tooltip content={tooltip} render={button} />;\n};\n\n/**\n * MenuBar component props.\n *\n * Horizontal icon-button toolbar with keyboard navigation and tooltip labels.\n *\n * @example\n * ```tsx\n * <MenuBar\n *   isActive={activeIndex}\n *   options={[\n *     { icon: <ListIcon />, tooltip: \"List view\", onClick: () => setView(\"list\") },\n *     { icon: <GridFourIcon />, tooltip: \"Grid view\", onClick: () => setView(\"grid\") },\n *   ]}\n * />\n * ```\n */\ntype MenuBarProps = {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** The currently active option value — matched against option index or `id`. */\n  isActive: number | boolean | string | undefined;\n  /** Array of menu option configurations. */\n  options: MenuOptionProps[];\n  /** When true, each option's `id` field is used for matching instead of its array index. */\n  optionIds?: boolean;\n};\n\n/**\n * MenuBar — horizontal icon-button toolbar with keyboard arrow-key navigation.\n *\n * Each option renders as a `<button>` with a Tooltip. The active option is\n * visually highlighted with an elevated background.\n *\n * @example\n * ```tsx\n * <MenuBar\n *   isActive={0}\n *   options={[\n *     { icon: <ListIcon />, tooltip: \"List\", onClick: () => {} },\n *     { icon: <GridFourIcon />, tooltip: \"Grid\", onClick: () => {} },\n *   ]}\n * />\n * ```\n */\nexport const MenuBar = ({\n  className,\n  isActive,\n  options,\n  optionIds = false, // if option needs an extra unique ID\n}: MenuBarProps) => {\n  const menuRef = useRef<HTMLElement | null>(null);\n\n  useMenuNavigation({ menuRef, direction: \"horizontal\" });\n\n  return (\n    <nav\n      className={cn(\n        \"isolate flex rounded-lg ring ring-kumo-line bg-kumo-recessed pl-px shadow-xs transition-colors\",\n        className,\n      )}\n      ref={menuRef}\n    >\n      {options.map((option, index) => (\n        <MenuOption\n          key={index}\n          {...option}\n          isActive={isActive}\n          id={optionIds ? option.id : index}\n        />\n      ))}\n    </nav>\n  );\n};\n"],"names":["useMenuNavigation","menuRef","direction","activeElementRef","useRef","useEffect","focusableElements","handleKeyDown","e","currentIndex","nextIndex","isHorizontal","forwardKey","backwardKey","nextElement","addKeyListener","removeKeyListener","handleFocusIn","handleFocusOut","MenuOption","icon","id","isActive","onClick","tooltip","button","jsx","cn","IconContext","Tooltip","MenuBar","className","options","optionIds","option","index"],"mappings":"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"}
+{"version":3,"file":"menubar-jalggrag4utvdpey.js","sources":["../../src/components/menubar/use-menu-navigation.ts","../../src/components/menubar/menubar.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\n\ntype UseMenuNavigationProps = {\n  menuRef: React.RefObject<HTMLElement | null>;\n  direction?: \"horizontal\" | \"vertical\"; // Default: horizontal\n};\n\nexport const useMenuNavigation = ({\n  menuRef,\n  direction = \"horizontal\",\n}: UseMenuNavigationProps) => {\n  const activeElementRef = useRef<HTMLElement | null>(null);\n\n  useEffect(() => {\n    if (!menuRef.current) return;\n\n    const focusableElements = Array.from(\n      menuRef.current.querySelectorAll(\n        'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])',\n      ),\n    ) as HTMLElement[];\n\n    if (focusableElements.length === 0) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (!activeElementRef.current) return;\n\n      const currentIndex = focusableElements.indexOf(activeElementRef.current);\n      let nextIndex = currentIndex;\n\n      const isHorizontal = direction === \"horizontal\";\n      const forwardKey = isHorizontal ? \"ArrowRight\" : \"ArrowDown\";\n      const backwardKey = isHorizontal ? \"ArrowLeft\" : \"ArrowUp\";\n\n      if (e.key === forwardKey) {\n        e.preventDefault();\n        nextIndex = (currentIndex + 1) % focusableElements.length;\n      } else if (e.key === backwardKey) {\n        e.preventDefault();\n        nextIndex =\n          (currentIndex - 1 + focusableElements.length) %\n          focusableElements.length;\n      } else {\n        return;\n      }\n\n      const nextElement = focusableElements[nextIndex];\n      activeElementRef.current = nextElement;\n      nextElement.focus();\n    };\n\n    const addKeyListener = () =>\n      document.addEventListener(\"keydown\", handleKeyDown);\n    const removeKeyListener = () =>\n      document.removeEventListener(\"keydown\", handleKeyDown);\n\n    const handleFocusIn = () => {\n      activeElementRef.current = document.activeElement as HTMLElement;\n      addKeyListener();\n    };\n\n    const handleFocusOut = () => {\n      activeElementRef.current = null;\n      removeKeyListener();\n    };\n\n    menuRef.current.addEventListener(\"focusin\", handleFocusIn);\n    menuRef.current.addEventListener(\"focusout\", handleFocusOut);\n\n    return () => {\n      menuRef.current?.removeEventListener(\"focusin\", handleFocusIn);\n      menuRef.current?.removeEventListener(\"focusout\", handleFocusOut);\n      removeKeyListener();\n    };\n  }, [menuRef, direction]);\n};\n","import { Tooltip } from \"../tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { IconContext } from \"@phosphor-icons/react\";\nimport React, { useRef } from \"react\";\nimport { useMenuNavigation } from \"./use-menu-navigation\";\n\n/** MenuBar variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_MENUBAR_VARIANTS = {\n  // MenuBar currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_MENUBAR_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_MENUBAR_VARIANTS\nexport interface KumoMenuBarVariantsProps {}\n\nexport function menuBarVariants(_props: KumoMenuBarVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex rounded-lg border border-kumo-recessed bg-kumo-recessed pl-px shadow-xs transition-colors\",\n  );\n}\n\n/** Props for an individual menu option within a MenuBar. */\ntype MenuOptionProps = {\n  /** Icon element (typically from `@phosphor-icons/react`) rendered at 18px */\n  icon: React.ReactNode;\n  /** Unique identifier for the option (used when `optionIds` is true) */\n  id?: number | string;\n  /** Currently active value from the parent MenuBar */\n  isActive?: number | boolean | string | undefined;\n  /** Callback when this option is clicked */\n  onClick: () => void;\n  /** Tooltip text shown on hover */\n  tooltip: string;\n};\n\nconst MenuOption = ({\n  icon,\n  id,\n  isActive,\n  onClick,\n  tooltip,\n}: MenuOptionProps) => {\n  const button = (\n    <button\n      aria-label={tooltip}\n      className={cn(\n        \"relative -ml-px flex h-full w-11 cursor-pointer items-center justify-center rounded-md border-none bg-kumo-recessed first:rounded-l-lg last:rounded-r-lg transition-colors focus:z-3 focus:outline-none focus:ring-kumo-focus/50 focus-visible:z-3 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n        {\n          \"z-2 bg-kumo-base shadow-xs transition-colors\": isActive === id,\n        },\n      )}\n      onClick={onClick}\n    >\n      <IconContext.Provider value={{ size: 18 }} {...({} as any)}>\n        {icon}\n      </IconContext.Provider>\n    </button>\n  );\n\n  return <Tooltip content={tooltip} render={button} />;\n};\n\n/**\n * MenuBar component props.\n *\n * Horizontal icon-button toolbar with keyboard navigation and tooltip labels.\n *\n * @example\n * ```tsx\n * <MenuBar\n *   isActive={activeIndex}\n *   options={[\n *     { icon: <ListIcon />, tooltip: \"List view\", onClick: () => setView(\"list\") },\n *     { icon: <GridFourIcon />, tooltip: \"Grid view\", onClick: () => setView(\"grid\") },\n *   ]}\n * />\n * ```\n */\ntype MenuBarProps = {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** The currently active option value — matched against option index or `id`. */\n  isActive: number | boolean | string | undefined;\n  /** Array of menu option configurations. */\n  options: MenuOptionProps[];\n  /** When true, each option's `id` field is used for matching instead of its array index. */\n  optionIds?: boolean;\n};\n\n/**\n * MenuBar — horizontal icon-button toolbar with keyboard arrow-key navigation.\n *\n * Each option renders as a `<button>` with a Tooltip. The active option is\n * visually highlighted with an elevated background.\n *\n * @example\n * ```tsx\n * <MenuBar\n *   isActive={0}\n *   options={[\n *     { icon: <ListIcon />, tooltip: \"List\", onClick: () => {} },\n *     { icon: <GridFourIcon />, tooltip: \"Grid\", onClick: () => {} },\n *   ]}\n * />\n * ```\n */\nexport const MenuBar = ({\n  className,\n  isActive,\n  options,\n  optionIds = false, // if option needs an extra unique ID\n}: MenuBarProps) => {\n  const menuRef = useRef<HTMLElement | null>(null);\n\n  useMenuNavigation({ menuRef, direction: \"horizontal\" });\n\n  return (\n    <nav\n      className={cn(\n        \"isolate flex rounded-lg ring ring-kumo-line bg-kumo-recessed pl-px shadow-xs transition-colors\",\n        className,\n      )}\n      ref={menuRef}\n    >\n      {options.map((option, index) => (\n        <MenuOption\n          key={index}\n          {...option}\n          isActive={isActive}\n          id={optionIds ? option.id : index}\n        />\n      ))}\n    </nav>\n  );\n};\n"],"names":["useMenuNavigation","menuRef","direction","activeElementRef","useRef","useEffect","focusableElements","handleKeyDown","e","currentIndex","nextIndex","isHorizontal","forwardKey","backwardKey","nextElement","addKeyListener","removeKeyListener","handleFocusIn","handleFocusOut","MenuOption","icon","id","isActive","onClick","tooltip","button","jsx","cn","IconContext","Tooltip","MenuBar","className","options","optionIds","option","index"],"mappings":"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"}

package/dist/chunks/{meter-g1ja8cwtum0frcdj.js → meter-jbxkh6gfggx1kjna.js}

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs as r, jsx as e, Fragment as d } from "react/jsx-runtime";
 import { c as t } from "./cn-ct4n7r74mh8y0f48.js";
-import { aW as c, aX as f, aY as x, aZ as b, a_ as h } from "./vendor-base-ui-epfrwb4nfbd4btaz.js";
+import { aW as c, aX as f, aY as x, aZ as b, a_ as h } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 function N({
   value: l,
   customValue: a,
@@ -48,4 +48,4 @@ function N({
 export {
   N as M
 };
-//# sourceMappingURL=meter-g1ja8cwtum0frcdj.js.map
+//# sourceMappingURL=meter-jbxkh6gfggx1kjna.js.map

package/dist/chunks/{meter-g1ja8cwtum0frcdj.js.map → meter-jbxkh6gfggx1kjna.js.map}

@@ -1 +1 @@
-{"version":3,"file":"meter-g1ja8cwtum0frcdj.js","sources":["../../src/components/meter/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { type ComponentPropsWithoutRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Meter variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_METER_VARIANTS = {\n  // Meter currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_METER_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_METER_VARIANTS\nexport interface KumoMeterVariantsProps {}\n\nexport function meterVariants(_props: KumoMeterVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex w-full flex-col gap-2\",\n  );\n}\n\ntype RootProps = ComponentPropsWithoutRef<typeof BaseMeter.Root>;\n\n/**\n * Meter component props.\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage used\" value={65} />\n * <Meter label=\"API requests\" value={75} customValue=\"750 / 1,000\" />\n * ```\n */\nexport interface MeterProps extends RootProps, KumoMeterVariantsProps {\n  /** Custom formatted value text (e.g. \"750 / 1,000\") displayed instead of percentage. */\n  customValue?: string;\n  /** Label text displayed above the meter track. */\n  label: string;\n  /**\n   * Whether to display the percentage value next to the label.\n   * @default true\n   */\n  showValue?: boolean;\n  /** Additional CSS classes for the track (background bar). */\n  trackClassName?: string;\n  /** Additional CSS classes for the indicator (filled bar). */\n  indicatorClassName?: string;\n}\n\n/**\n * Progress bar showing a measured value within a known range (e.g. quota usage).\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage\" value={65} />\n * ```\n */\nexport function Meter({\n  value,\n  customValue,\n  label,\n  showValue = true,\n  className,\n  trackClassName,\n  indicatorClassName,\n  ...props\n}: MeterProps) {\n  return (\n    <BaseMeter.Root\n      value={value}\n      {...props}\n      className={cn(\"flex w-full flex-col gap-2\", className)}\n    >\n      <div className=\"flex items-center justify-between gap-4\">\n        <BaseMeter.Label className=\"text-xs text-kumo-subtle\">\n          {label}\n        </BaseMeter.Label>\n        {customValue ? (\n          <span className=\"text-sm font-medium text-kumo-default tabular-nums\">\n            {customValue}\n          </span>\n        ) : (\n          <>\n            {showValue && (\n              <BaseMeter.Value className=\"text-sm font-medium text-kumo-default tabular-nums\" />\n            )}\n          </>\n        )}\n      </div>\n      <BaseMeter.Track\n        className={cn(\n          \"relative h-2 w-full overflow-hidden rounded-full bg-kumo-fill\",\n          trackClassName,\n        )}\n      >\n        <BaseMeter.Indicator\n          className={cn(\n            \"absolute inset-y-0 left-0 rounded-full bg-linear-to-r from-kumo-brand via-kumo-brand to-kumo-brand transition-[width] duration-300 ease-out\",\n            indicatorClassName,\n          )}\n        />\n      </BaseMeter.Track>\n    </BaseMeter.Root>\n  );\n}\n"],"names":["Meter","value","customValue","label","showValue","className","trackClassName","indicatorClassName","props","jsxs","BaseMeter.Root","cn","jsx","BaseMeter.Label","Fragment","BaseMeter.Value","BaseMeter.Track","BaseMeter.Indicator"],"mappings":";;;;AAwDO,SAASA,EAAM;AAAA,EACpB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,GAAGC;AACL,GAAe;AACb,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAT;AAAA,MACC,GAAGO;AAAA,MACJ,WAAWG,EAAG,8BAA8BN,CAAS;AAAA,MAErD,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,2CACb,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAA,EAAgB,WAAU,4BACxB,UAAAV,GACH;AAAA,UACCD,IACC,gBAAAU,EAAC,QAAA,EAAK,WAAU,sDACb,UAAAV,EAAA,CACH,IAEA,gBAAAU,EAAAE,GAAA,EACG,UAAAV,uBACEW,GAAA,EAAgB,WAAU,sDAAqD,EAAA,CAEpF;AAAA,QAAA,GAEJ;AAAA,QACA,gBAAAH;AAAA,UAACI;AAAAA,UAAA;AAAA,YACC,WAAWL;AAAA,cACT;AAAA,cACAL;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAM;AAAA,cAACK;AAAAA,cAAA;AAAA,gBACC,WAAWN;AAAA,kBACT;AAAA,kBACAJ;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"meter-jbxkh6gfggx1kjna.js","sources":["../../src/components/meter/meter.tsx"],"sourcesContent":["import { Meter as BaseMeter } from \"@base-ui/react/meter\";\nimport { type ComponentPropsWithoutRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Meter variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_METER_VARIANTS = {\n  // Meter currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_METER_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_METER_VARIANTS\nexport interface KumoMeterVariantsProps {}\n\nexport function meterVariants(_props: KumoMeterVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex w-full flex-col gap-2\",\n  );\n}\n\ntype RootProps = ComponentPropsWithoutRef<typeof BaseMeter.Root>;\n\n/**\n * Meter component props.\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage used\" value={65} />\n * <Meter label=\"API requests\" value={75} customValue=\"750 / 1,000\" />\n * ```\n */\nexport interface MeterProps extends RootProps, KumoMeterVariantsProps {\n  /** Custom formatted value text (e.g. \"750 / 1,000\") displayed instead of percentage. */\n  customValue?: string;\n  /** Label text displayed above the meter track. */\n  label: string;\n  /**\n   * Whether to display the percentage value next to the label.\n   * @default true\n   */\n  showValue?: boolean;\n  /** Additional CSS classes for the track (background bar). */\n  trackClassName?: string;\n  /** Additional CSS classes for the indicator (filled bar). */\n  indicatorClassName?: string;\n}\n\n/**\n * Progress bar showing a measured value within a known range (e.g. quota usage).\n *\n * @example\n * ```tsx\n * <Meter label=\"Storage\" value={65} />\n * ```\n */\nexport function Meter({\n  value,\n  customValue,\n  label,\n  showValue = true,\n  className,\n  trackClassName,\n  indicatorClassName,\n  ...props\n}: MeterProps) {\n  return (\n    <BaseMeter.Root\n      value={value}\n      {...props}\n      className={cn(\"flex w-full flex-col gap-2\", className)}\n    >\n      <div className=\"flex items-center justify-between gap-4\">\n        <BaseMeter.Label className=\"text-xs text-kumo-subtle\">\n          {label}\n        </BaseMeter.Label>\n        {customValue ? (\n          <span className=\"text-sm font-medium text-kumo-default tabular-nums\">\n            {customValue}\n          </span>\n        ) : (\n          <>\n            {showValue && (\n              <BaseMeter.Value className=\"text-sm font-medium text-kumo-default tabular-nums\" />\n            )}\n          </>\n        )}\n      </div>\n      <BaseMeter.Track\n        className={cn(\n          \"relative h-2 w-full overflow-hidden rounded-full bg-kumo-fill\",\n          trackClassName,\n        )}\n      >\n        <BaseMeter.Indicator\n          className={cn(\n            \"absolute inset-y-0 left-0 rounded-full bg-linear-to-r from-kumo-brand via-kumo-brand to-kumo-brand transition-[width] duration-300 ease-out\",\n            indicatorClassName,\n          )}\n        />\n      </BaseMeter.Track>\n    </BaseMeter.Root>\n  );\n}\n"],"names":["Meter","value","customValue","label","showValue","className","trackClassName","indicatorClassName","props","jsxs","BaseMeter.Root","cn","jsx","BaseMeter.Label","Fragment","BaseMeter.Value","BaseMeter.Track","BaseMeter.Indicator"],"mappings":";;;;AAwDO,SAASA,EAAM;AAAA,EACpB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,GAAGC;AACL,GAAe;AACb,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAT;AAAA,MACC,GAAGO;AAAA,MACJ,WAAWG,EAAG,8BAA8BN,CAAS;AAAA,MAErD,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,2CACb,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAA,EAAgB,WAAU,4BACxB,UAAAV,GACH;AAAA,UACCD,IACC,gBAAAU,EAAC,QAAA,EAAK,WAAU,sDACb,UAAAV,EAAA,CACH,IAEA,gBAAAU,EAAAE,GAAA,EACG,UAAAV,uBACEW,GAAA,EAAgB,WAAU,sDAAqD,EAAA,CAEpF;AAAA,QAAA,GAEJ;AAAA,QACA,gBAAAH;AAAA,UAACI;AAAAA,UAAA;AAAA,YACC,WAAWL;AAAA,cACT;AAAA,cACAL;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAM;AAAA,cAACK;AAAAA,cAAA;AAAA,gBACC,WAAWN;AAAA,kBACT;AAAA,kBACAJ;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/chunks/{pagination-kmtbb3twehv79tm8.js → pagination-ceetno8sc1rd0wr2.js}

@@ -1,10 +1,10 @@
 "use client";
 import { jsx as a, jsxs as p, Fragment as E } from "react/jsx-runtime";
 import { useState as T, useMemo as N, useEffect as B, createContext as D, useContext as R } from "react";
-import { I as m } from "./input-group-5luo0442jgsie018.js";
+import { I as m } from "./input-group-gy08vju7eoogil8k.js";
 import { CaretDoubleLeftIcon as F, CaretLeftIcon as V, CaretRightIcon as U, CaretDoubleRightIcon as j } from "@phosphor-icons/react";
 import { c as d } from "./cn-ct4n7r74mh8y0f48.js";
-import { S as P } from "./select-brzswxbhhf1ktx9t.js";
+import { S as P } from "./select-g1xvti1k1hj7xe5t.js";
 const G = [25, 50, 100, 250], y = (n, l, o) => Math.min(Math.max(n, l), o), K = {
   navigation: "Pagination",
   firstPage: "First page",
@@ -263,4 +263,4 @@ const W = Object.assign(L, {
 export {
   W as P
 };
-//# sourceMappingURL=pagination-kmtbb3twehv79tm8.js.map
+//# sourceMappingURL=pagination-ceetno8sc1rd0wr2.js.map

package/dist/chunks/{pagination-kmtbb3twehv79tm8.js.map → pagination-ceetno8sc1rd0wr2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"pagination-kmtbb3twehv79tm8.js","sources":["../../src/components/pagination/pagination.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { InputGroup } from \"../input-group\";\nimport {\n  CaretDoubleLeftIcon,\n  CaretDoubleRightIcon,\n  CaretLeftIcon,\n  CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Select } from \"../select\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [25, 50, 100, 250] as const;\n\nconst clamp = (value: number, min: number, max: number) =>\n  Math.min(Math.max(value, min), max);\n\n// ============================================================================\n// i18n Labels\n// ============================================================================\n\n/**\n * Labels for internationalization of Pagination component.\n * All labels have English defaults and can be overridden for other locales.\n *\n * Note: To customize the \"Showing X-Y of Z\" text, use the `children` render prop\n * on `Pagination.Info` instead. To customize the \"Per page:\" label, use the\n * `label` prop on `Pagination.PageSize`.\n */\nexport interface PaginationLabels {\n  /** Aria label for the navigation landmark. @default \"Pagination\" */\n  navigation?: string;\n  /** Aria label for the first page button. @default \"First page\" */\n  firstPage?: string;\n  /** Aria label for the previous page button. @default \"Previous page\" */\n  previousPage?: string;\n  /** Aria label for the next page button. @default \"Next page\" */\n  nextPage?: string;\n  /** Aria label for the last page button. @default \"Last page\" */\n  lastPage?: string;\n  /** Aria label for the page number input/select. @default \"Page number\" */\n  pageNumber?: string;\n  /** Aria label for the page size select. @default \"Page size\" */\n  pageSize?: string;\n}\n\nconst DEFAULT_LABELS: Required<PaginationLabels> = {\n  navigation: \"Pagination\",\n  firstPage: \"First page\",\n  previousPage: \"Previous page\",\n  nextPage: \"Next page\",\n  lastPage: \"Last page\",\n  pageNumber: \"Page number\",\n  pageSize: \"Page size\",\n};\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n  controls: {\n    full: {\n      classes: \"\",\n      description:\n        \"Full pagination controls with first, previous, page input, next, and last buttons\",\n    },\n    simple: {\n      classes: \"\",\n      description:\n        \"Simple pagination controls with only previous and next buttons\",\n    },\n  },\n} as const;\n\nexport type KumoPaginationControls =\n  keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n  controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n  controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n  controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n  return cn(\n    \"flex items-center justify-between gap-2\",\n    resolveVariant(KUMO_PAGINATION_VARIANTS.controls, controls, KUMO_PAGINATION_DEFAULT_VARIANTS.controls).classes,\n  );\n}\n\n// ============================================================================\n// Pagination Context\n// ============================================================================\n\ninterface PaginationContextValue {\n  page: number;\n  perPage?: number;\n  totalCount?: number;\n  maxPage: number;\n  pageShowingRange: string;\n  setPage: (page: number) => void;\n  editingPage: number;\n  setEditingPage: (page: number) => void;\n  labels: Required<PaginationLabels>;\n}\n\nconst PaginationContext = createContext<PaginationContextValue | null>(null);\n\nfunction usePaginationContext() {\n  const context = useContext(PaginationContext);\n  if (!context) {\n    throw new Error(\n      \"Pagination compound components must be used within a Pagination component\",\n    );\n  }\n  return context;\n}\n\n// ============================================================================\n// Pagination.Info\n// ============================================================================\n\nexport interface PaginationInfoProps {\n  /** Custom render function for the info text */\n  children?: (props: {\n    page: number;\n    perPage?: number;\n    totalCount?: number;\n    pageShowingRange: string;\n  }) => ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationInfo({ children, className }: PaginationInfoProps) {\n  const { page, perPage, totalCount, pageShowingRange } =\n    usePaginationContext();\n\n  const content = children ? (\n    children({ page, perPage, totalCount, pageShowingRange })\n  ) : totalCount && totalCount > 0 ? (\n    <>\n      Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n      <span className=\"tabular-nums\">{totalCount}</span>\n    </>\n  ) : null;\n\n  return (\n    <div\n      data-slot=\"pagination-info\"\n      className={cn(\"text-sm text-kumo-subtle\", className)}\n    >\n      {content}\n    </div>\n  );\n}\n\nPaginationInfo.displayName = \"Pagination.Info\";\n\n// ============================================================================\n// Pagination.PageSize\n// ============================================================================\n\nexport interface PaginationPageSizeProps {\n  /** Current page size value */\n  value: number;\n  /** Callback when page size changes */\n  onChange: (size: number) => void;\n  /** Available page size options */\n  options?: number[];\n  /**\n   * Label text shown before the selector.\n   * @default \"Per page:\"\n   */\n  label?: ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationPageSize({\n  value,\n  onChange,\n  options = DEFAULT_PAGE_SIZE_OPTIONS as unknown as number[],\n  label = \"Per page:\",\n  className,\n}: PaginationPageSizeProps) {\n  const { labels } = usePaginationContext();\n\n  return (\n    <div\n      data-slot=\"pagination-page-size\"\n      className={cn(\"flex items-center gap-2\", className)}\n    >\n      {label && <span className=\"text-sm text-kumo-subtle\">{label}</span>}\n      <Select\n        aria-label={labels.pageSize}\n        value={value}\n        onValueChange={(v) => onChange(v as number)}\n      >\n        {options.map((size) => (\n          <Select.Option key={size} value={size}>\n            {size}\n          </Select.Option>\n        ))}\n      </Select>\n    </div>\n  );\n}\n\nPaginationPageSize.displayName = \"Pagination.PageSize\";\n\n// ============================================================================\n// Pagination.Controls\n// ============================================================================\n\nexport interface PaginationControlsProps extends KumoPaginationVariantsProps {\n  /**\n   * How the page number selector is rendered in \"full\" controls mode.\n   * - `\"input\"` (default): A text input where users type a page number.\n   * - `\"dropdown\"`: A dropdown select with all page numbers as options.\n   *\n   * **Note:** `\"dropdown\"` renders an option for every page, so it is best\n   * suited for small page counts. For large datasets (hundreds of pages or\n   * more) prefer `\"input\"` to avoid rendering performance overhead.\n   */\n  pageSelector?: \"input\" | \"dropdown\";\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationControls({\n  controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n  pageSelector = \"input\",\n  className,\n}: PaginationControlsProps) {\n  const { page, maxPage, setPage, editingPage, setEditingPage, labels } =\n    usePaginationContext();\n\n  return (\n    <div\n      data-slot=\"pagination-controls\"\n      className={cn(\"grow flex flex-col items-end\", className)}\n    >\n      <nav aria-label={labels.navigation}>\n        <InputGroup>\n          {controls === \"full\" && (\n            <InputGroup.Button\n              variant=\"secondary\"\n              aria-label={labels.firstPage}\n              disabled={page <= 1}\n              onClick={() => {\n                setPage(1);\n                setEditingPage(1);\n              }}\n            >\n              <CaretDoubleLeftIcon size={16} />\n            </InputGroup.Button>\n          )}\n          <InputGroup.Button\n            variant=\"secondary\"\n            aria-label={labels.previousPage}\n            disabled={page <= 1}\n            onClick={() => {\n              const previousPage = Math.max(page - 1, 1);\n              setPage(previousPage);\n              setEditingPage(previousPage);\n            }}\n          >\n            <CaretLeftIcon size={16} />\n          </InputGroup.Button>\n          {controls === \"full\" &&\n            (pageSelector === \"dropdown\" ? (\n              <Select\n                aria-label={labels.pageNumber}\n                className=\"rounded-none ring-kumo-hairline\"\n                value={page}\n                onValueChange={(value) => {\n                  const num = value as number;\n                  setPage(num);\n                  setEditingPage(num);\n                }}\n              >\n                {Array.from({ length: maxPage }, (_, i) => i + 1).map((p) => (\n                  <Select.Option key={p} value={p}>\n                    {p}\n                  </Select.Option>\n                ))}\n              </Select>\n            ) : (\n              <InputGroup.Input\n                style={{ width: 50 }}\n                className=\"text-center\"\n                aria-label={labels.pageNumber}\n                value={editingPage}\n                onValueChange={(value: string) => {\n                  setEditingPage(Number(value));\n                }}\n                onBlur={() => {\n                  const clamped = clamp(editingPage, 1, maxPage);\n                  setPage(clamped);\n                  setEditingPage(clamped);\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                  if (e.key === \"Enter\") {\n                    const clamped = clamp(editingPage, 1, maxPage);\n                    setPage(clamped);\n                    setEditingPage(clamped);\n                  }\n                }}\n                // Prevent password managers from auto-filling\n                autoComplete=\"off\"\n                data-1p-ignore\n                data-lpignore=\"true\"\n                data-form-type=\"other\"\n              />\n            ))}\n          <InputGroup.Button\n            variant=\"secondary\"\n            aria-label={labels.nextPage}\n            disabled={page === maxPage}\n            onClick={() => {\n              const nextPage = Math.min(page + 1, maxPage);\n              setPage(nextPage);\n              setEditingPage(nextPage);\n            }}\n          >\n            <CaretRightIcon size={16} />\n          </InputGroup.Button>\n          {controls === \"full\" && (\n            <InputGroup.Button\n              variant=\"secondary\"\n              aria-label={labels.lastPage}\n              disabled={page === maxPage}\n              onClick={() => {\n                setPage(maxPage);\n                setEditingPage(maxPage);\n              }}\n            >\n              <CaretDoubleRightIcon size={16} />\n            </InputGroup.Button>\n          )}\n        </InputGroup>\n      </nav>\n    </div>\n  );\n}\n\nPaginationControls.displayName = \"Pagination.Controls\";\n\n// ============================================================================\n// Pagination.Separator\n// ============================================================================\n\nexport interface PaginationSeparatorProps {\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationSeparator({ className }: PaginationSeparatorProps) {\n  return (\n    <div\n      data-slot=\"pagination-separator\"\n      className={cn(\"mx-2 h-6 border-l border-kumo-hairline\", className)}\n    />\n  );\n}\n\nPaginationSeparator.displayName = \"Pagination.Separator\";\n\n// ============================================================================\n// Pagination Root\n// ============================================================================\n\n/** Base props shared by both compound and legacy Pagination APIs */\ninterface PaginationBaseProps {\n  /** Callback fired when the current page changes. */\n  setPage: (page: number) => void;\n  /**\n   * Current page number (1-indexed).\n   * @default 1\n   */\n  page?: number;\n  /** Number of items displayed per page. */\n  perPage?: number;\n  /** Total number of items across all pages. */\n  totalCount?: number;\n  /** Additional CSS classes for the container */\n  className?: string;\n  /**\n   * Labels for internationalization of aria-labels. All labels have English defaults.\n   *\n   * For visible text like \"Showing X of Y\", use render props on sub-components:\n   * - `Pagination.Info` children for the info text\n   * - `Pagination.PageSize` label prop for the \"Per page:\" text\n   *\n   * @example\n   * ```tsx\n   * <Pagination\n   *   labels={{\n   *     firstPage: \"Première page\",\n   *     previousPage: \"Page précédente\",\n   *     nextPage: \"Page suivante\",\n   *     lastPage: \"Dernière page\",\n   *     pageNumber: \"Numéro de page\",\n   *     pageSize: \"Taille de page\",\n   *   }}\n   *   // ...\n   * />\n   * ```\n   */\n  labels?: PaginationLabels;\n}\n\n/**\n * Props for the compound component API (recommended).\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport interface PaginationCompoundProps extends PaginationBaseProps {\n  /**\n   * Compound component children for custom layouts.\n   * Use Pagination.Info, Pagination.PageSize, Pagination.Controls, and Pagination.Separator.\n   */\n  children: ReactNode;\n  controls?: never;\n  text?: never;\n}\n\n/**\n * Props for the legacy API (deprecated, use compound components instead).\n *\n * @deprecated Use the compound component API with children instead:\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * ```tsx\n * // Legacy usage (deprecated)\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport interface PaginationLegacyProps\n  extends PaginationBaseProps, KumoPaginationVariantsProps {\n  children?: never;\n  /** @deprecated Use Pagination.Info with children prop instead */\n  text?: (props: {\n    page?: number;\n    perPage?: number;\n    totalCount?: number;\n    pageShowingRange: string;\n  }) => ReactNode;\n}\n\n/**\n * Pagination component props.\n *\n * Prefer the compound component API for new code:\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport type PaginationProps = PaginationCompoundProps | PaginationLegacyProps;\n\n/**\n * Page navigation controls with page count display.\n *\n * Supports both compound component and legacy patterns. Prefer compound components for new code:\n *\n * @example\n * // Compound component (recommended)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.Separator />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * // Legacy (deprecated)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nfunction PaginationRoot(props: PaginationProps) {\n  const {\n    page = 1,\n    perPage,\n    totalCount,\n    setPage,\n    children,\n    className,\n    labels: labelsProp,\n  } = props;\n\n  // Extract legacy props (only present when children is not provided)\n  const text = \"text\" in props ? props.text : undefined;\n  const controls =\n    \"controls\" in props\n      ? (props.controls ?? KUMO_PAGINATION_DEFAULT_VARIANTS.controls)\n      : KUMO_PAGINATION_DEFAULT_VARIANTS.controls;\n  const [editingPage, setEditingPage] = useState<number>(1);\n\n  // Merge provided labels with defaults\n  const labels = useMemo<Required<PaginationLabels>>(\n    () => ({ ...DEFAULT_LABELS, ...labelsProp }),\n    [labelsProp],\n  );\n\n  useEffect(() => {\n    setEditingPage(page);\n  }, [page]);\n\n  const pageShowingRange = useMemo(() => {\n    let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n    let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n    if (Number.isNaN(lower)) lower = 0;\n    if (Number.isNaN(upper)) upper = 0;\n\n    return `${lower}-${upper}`;\n  }, [page, perPage, totalCount]);\n\n  const maxPage = useMemo(() => {\n    return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n  }, [totalCount, perPage]);\n\n  const contextValue: PaginationContextValue = {\n    page,\n    perPage,\n    totalCount,\n    maxPage,\n    pageShowingRange,\n    setPage,\n    editingPage,\n    setEditingPage,\n    labels,\n  };\n\n  // Compound component mode: render children within context\n  if (children) {\n    return (\n      <PaginationContext.Provider value={contextValue}>\n        <div\n          data-slot=\"pagination\"\n          className={cn(\"flex items-center gap-2 w-full\", className)}\n        >\n          {children}\n        </div>\n      </PaginationContext.Provider>\n    );\n  }\n\n  // Legacy mode: render default layout for backwards compatibility\n  const getPaginationText = () => {\n    if (text) {\n      return text({ page, perPage, totalCount, pageShowingRange });\n    } else if (totalCount && totalCount > 0) {\n      return (\n        <>\n          Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n          <span className=\"tabular-nums\">{totalCount}</span>\n        </>\n      );\n    }\n    return null;\n  };\n\n  return (\n    <PaginationContext.Provider value={contextValue}>\n      <div\n        data-slot=\"pagination\"\n        className={cn(\"flex items-center gap-2 w-full\", className)}\n      >\n        <div\n          aria-live=\"polite\"\n          aria-atomic=\"true\"\n          data-slot=\"pagination-info\"\n          className=\"grow text-sm text-kumo-subtle\"\n        >\n          {getPaginationText()}\n        </div>\n        <PaginationControls controls={controls} />\n      </div>\n    </PaginationContext.Provider>\n  );\n}\n\nPaginationRoot.displayName = \"Pagination\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nexport const Pagination = Object.assign(PaginationRoot, {\n  Info: PaginationInfo,\n  PageSize: PaginationPageSize,\n  Controls: PaginationControls,\n  Separator: PaginationSeparator,\n});\n\nexport {\n  PaginationInfo,\n  PaginationPageSize,\n  PaginationControls,\n  PaginationSeparator,\n};\n"],"names":["DEFAULT_PAGE_SIZE_OPTIONS","clamp","value","min","max","DEFAULT_LABELS","KUMO_PAGINATION_DEFAULT_VARIANTS","PaginationContext","createContext","usePaginationContext","context","useContext","PaginationInfo","children","className","page","perPage","totalCount","pageShowingRange","content","jsxs","Fragment","jsx","cn","PaginationPageSize","onChange","options","label","labels","Select","v","size","PaginationControls","controls","pageSelector","maxPage","setPage","editingPage","setEditingPage","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","num","_","i","p","clamped","e","nextPage","CaretRightIcon","CaretDoubleRightIcon","PaginationSeparator","PaginationRoot","props","labelsProp","text","useState","useMemo","useEffect","lower","upper","contextValue","getPaginationText","Pagination"],"mappings":"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"}
+{"version":3,"file":"pagination-ceetno8sc1rd0wr2.js","sources":["../../src/components/pagination/pagination.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { InputGroup } from \"../input-group\";\nimport {\n  CaretDoubleLeftIcon,\n  CaretDoubleRightIcon,\n  CaretLeftIcon,\n  CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Select } from \"../select\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [25, 50, 100, 250] as const;\n\nconst clamp = (value: number, min: number, max: number) =>\n  Math.min(Math.max(value, min), max);\n\n// ============================================================================\n// i18n Labels\n// ============================================================================\n\n/**\n * Labels for internationalization of Pagination component.\n * All labels have English defaults and can be overridden for other locales.\n *\n * Note: To customize the \"Showing X-Y of Z\" text, use the `children` render prop\n * on `Pagination.Info` instead. To customize the \"Per page:\" label, use the\n * `label` prop on `Pagination.PageSize`.\n */\nexport interface PaginationLabels {\n  /** Aria label for the navigation landmark. @default \"Pagination\" */\n  navigation?: string;\n  /** Aria label for the first page button. @default \"First page\" */\n  firstPage?: string;\n  /** Aria label for the previous page button. @default \"Previous page\" */\n  previousPage?: string;\n  /** Aria label for the next page button. @default \"Next page\" */\n  nextPage?: string;\n  /** Aria label for the last page button. @default \"Last page\" */\n  lastPage?: string;\n  /** Aria label for the page number input/select. @default \"Page number\" */\n  pageNumber?: string;\n  /** Aria label for the page size select. @default \"Page size\" */\n  pageSize?: string;\n}\n\nconst DEFAULT_LABELS: Required<PaginationLabels> = {\n  navigation: \"Pagination\",\n  firstPage: \"First page\",\n  previousPage: \"Previous page\",\n  nextPage: \"Next page\",\n  lastPage: \"Last page\",\n  pageNumber: \"Page number\",\n  pageSize: \"Page size\",\n};\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n  controls: {\n    full: {\n      classes: \"\",\n      description:\n        \"Full pagination controls with first, previous, page input, next, and last buttons\",\n    },\n    simple: {\n      classes: \"\",\n      description:\n        \"Simple pagination controls with only previous and next buttons\",\n    },\n  },\n} as const;\n\nexport type KumoPaginationControls =\n  keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n  controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n  controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n  controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n  return cn(\n    \"flex items-center justify-between gap-2\",\n    resolveVariant(KUMO_PAGINATION_VARIANTS.controls, controls, KUMO_PAGINATION_DEFAULT_VARIANTS.controls).classes,\n  );\n}\n\n// ============================================================================\n// Pagination Context\n// ============================================================================\n\ninterface PaginationContextValue {\n  page: number;\n  perPage?: number;\n  totalCount?: number;\n  maxPage: number;\n  pageShowingRange: string;\n  setPage: (page: number) => void;\n  editingPage: number;\n  setEditingPage: (page: number) => void;\n  labels: Required<PaginationLabels>;\n}\n\nconst PaginationContext = createContext<PaginationContextValue | null>(null);\n\nfunction usePaginationContext() {\n  const context = useContext(PaginationContext);\n  if (!context) {\n    throw new Error(\n      \"Pagination compound components must be used within a Pagination component\",\n    );\n  }\n  return context;\n}\n\n// ============================================================================\n// Pagination.Info\n// ============================================================================\n\nexport interface PaginationInfoProps {\n  /** Custom render function for the info text */\n  children?: (props: {\n    page: number;\n    perPage?: number;\n    totalCount?: number;\n    pageShowingRange: string;\n  }) => ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationInfo({ children, className }: PaginationInfoProps) {\n  const { page, perPage, totalCount, pageShowingRange } =\n    usePaginationContext();\n\n  const content = children ? (\n    children({ page, perPage, totalCount, pageShowingRange })\n  ) : totalCount && totalCount > 0 ? (\n    <>\n      Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n      <span className=\"tabular-nums\">{totalCount}</span>\n    </>\n  ) : null;\n\n  return (\n    <div\n      data-slot=\"pagination-info\"\n      className={cn(\"text-sm text-kumo-subtle\", className)}\n    >\n      {content}\n    </div>\n  );\n}\n\nPaginationInfo.displayName = \"Pagination.Info\";\n\n// ============================================================================\n// Pagination.PageSize\n// ============================================================================\n\nexport interface PaginationPageSizeProps {\n  /** Current page size value */\n  value: number;\n  /** Callback when page size changes */\n  onChange: (size: number) => void;\n  /** Available page size options */\n  options?: number[];\n  /**\n   * Label text shown before the selector.\n   * @default \"Per page:\"\n   */\n  label?: ReactNode;\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationPageSize({\n  value,\n  onChange,\n  options = DEFAULT_PAGE_SIZE_OPTIONS as unknown as number[],\n  label = \"Per page:\",\n  className,\n}: PaginationPageSizeProps) {\n  const { labels } = usePaginationContext();\n\n  return (\n    <div\n      data-slot=\"pagination-page-size\"\n      className={cn(\"flex items-center gap-2\", className)}\n    >\n      {label && <span className=\"text-sm text-kumo-subtle\">{label}</span>}\n      <Select\n        aria-label={labels.pageSize}\n        value={value}\n        onValueChange={(v) => onChange(v as number)}\n      >\n        {options.map((size) => (\n          <Select.Option key={size} value={size}>\n            {size}\n          </Select.Option>\n        ))}\n      </Select>\n    </div>\n  );\n}\n\nPaginationPageSize.displayName = \"Pagination.PageSize\";\n\n// ============================================================================\n// Pagination.Controls\n// ============================================================================\n\nexport interface PaginationControlsProps extends KumoPaginationVariantsProps {\n  /**\n   * How the page number selector is rendered in \"full\" controls mode.\n   * - `\"input\"` (default): A text input where users type a page number.\n   * - `\"dropdown\"`: A dropdown select with all page numbers as options.\n   *\n   * **Note:** `\"dropdown\"` renders an option for every page, so it is best\n   * suited for small page counts. For large datasets (hundreds of pages or\n   * more) prefer `\"input\"` to avoid rendering performance overhead.\n   */\n  pageSelector?: \"input\" | \"dropdown\";\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationControls({\n  controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n  pageSelector = \"input\",\n  className,\n}: PaginationControlsProps) {\n  const { page, maxPage, setPage, editingPage, setEditingPage, labels } =\n    usePaginationContext();\n\n  return (\n    <div\n      data-slot=\"pagination-controls\"\n      className={cn(\"grow flex flex-col items-end\", className)}\n    >\n      <nav aria-label={labels.navigation}>\n        <InputGroup>\n          {controls === \"full\" && (\n            <InputGroup.Button\n              variant=\"secondary\"\n              aria-label={labels.firstPage}\n              disabled={page <= 1}\n              onClick={() => {\n                setPage(1);\n                setEditingPage(1);\n              }}\n            >\n              <CaretDoubleLeftIcon size={16} />\n            </InputGroup.Button>\n          )}\n          <InputGroup.Button\n            variant=\"secondary\"\n            aria-label={labels.previousPage}\n            disabled={page <= 1}\n            onClick={() => {\n              const previousPage = Math.max(page - 1, 1);\n              setPage(previousPage);\n              setEditingPage(previousPage);\n            }}\n          >\n            <CaretLeftIcon size={16} />\n          </InputGroup.Button>\n          {controls === \"full\" &&\n            (pageSelector === \"dropdown\" ? (\n              <Select\n                aria-label={labels.pageNumber}\n                className=\"rounded-none ring-kumo-hairline\"\n                value={page}\n                onValueChange={(value) => {\n                  const num = value as number;\n                  setPage(num);\n                  setEditingPage(num);\n                }}\n              >\n                {Array.from({ length: maxPage }, (_, i) => i + 1).map((p) => (\n                  <Select.Option key={p} value={p}>\n                    {p}\n                  </Select.Option>\n                ))}\n              </Select>\n            ) : (\n              <InputGroup.Input\n                style={{ width: 50 }}\n                className=\"text-center\"\n                aria-label={labels.pageNumber}\n                value={editingPage}\n                onValueChange={(value: string) => {\n                  setEditingPage(Number(value));\n                }}\n                onBlur={() => {\n                  const clamped = clamp(editingPage, 1, maxPage);\n                  setPage(clamped);\n                  setEditingPage(clamped);\n                }}\n                onKeyDown={(e: KeyboardEvent) => {\n                  if (e.key === \"Enter\") {\n                    const clamped = clamp(editingPage, 1, maxPage);\n                    setPage(clamped);\n                    setEditingPage(clamped);\n                  }\n                }}\n                // Prevent password managers from auto-filling\n                autoComplete=\"off\"\n                data-1p-ignore\n                data-lpignore=\"true\"\n                data-form-type=\"other\"\n              />\n            ))}\n          <InputGroup.Button\n            variant=\"secondary\"\n            aria-label={labels.nextPage}\n            disabled={page === maxPage}\n            onClick={() => {\n              const nextPage = Math.min(page + 1, maxPage);\n              setPage(nextPage);\n              setEditingPage(nextPage);\n            }}\n          >\n            <CaretRightIcon size={16} />\n          </InputGroup.Button>\n          {controls === \"full\" && (\n            <InputGroup.Button\n              variant=\"secondary\"\n              aria-label={labels.lastPage}\n              disabled={page === maxPage}\n              onClick={() => {\n                setPage(maxPage);\n                setEditingPage(maxPage);\n              }}\n            >\n              <CaretDoubleRightIcon size={16} />\n            </InputGroup.Button>\n          )}\n        </InputGroup>\n      </nav>\n    </div>\n  );\n}\n\nPaginationControls.displayName = \"Pagination.Controls\";\n\n// ============================================================================\n// Pagination.Separator\n// ============================================================================\n\nexport interface PaginationSeparatorProps {\n  /** Additional CSS classes */\n  className?: string;\n}\n\nfunction PaginationSeparator({ className }: PaginationSeparatorProps) {\n  return (\n    <div\n      data-slot=\"pagination-separator\"\n      className={cn(\"mx-2 h-6 border-l border-kumo-hairline\", className)}\n    />\n  );\n}\n\nPaginationSeparator.displayName = \"Pagination.Separator\";\n\n// ============================================================================\n// Pagination Root\n// ============================================================================\n\n/** Base props shared by both compound and legacy Pagination APIs */\ninterface PaginationBaseProps {\n  /** Callback fired when the current page changes. */\n  setPage: (page: number) => void;\n  /**\n   * Current page number (1-indexed).\n   * @default 1\n   */\n  page?: number;\n  /** Number of items displayed per page. */\n  perPage?: number;\n  /** Total number of items across all pages. */\n  totalCount?: number;\n  /** Additional CSS classes for the container */\n  className?: string;\n  /**\n   * Labels for internationalization of aria-labels. All labels have English defaults.\n   *\n   * For visible text like \"Showing X of Y\", use render props on sub-components:\n   * - `Pagination.Info` children for the info text\n   * - `Pagination.PageSize` label prop for the \"Per page:\" text\n   *\n   * @example\n   * ```tsx\n   * <Pagination\n   *   labels={{\n   *     firstPage: \"Première page\",\n   *     previousPage: \"Page précédente\",\n   *     nextPage: \"Page suivante\",\n   *     lastPage: \"Dernière page\",\n   *     pageNumber: \"Numéro de page\",\n   *     pageSize: \"Taille de page\",\n   *   }}\n   *   // ...\n   * />\n   * ```\n   */\n  labels?: PaginationLabels;\n}\n\n/**\n * Props for the compound component API (recommended).\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport interface PaginationCompoundProps extends PaginationBaseProps {\n  /**\n   * Compound component children for custom layouts.\n   * Use Pagination.Info, Pagination.PageSize, Pagination.Controls, and Pagination.Separator.\n   */\n  children: ReactNode;\n  controls?: never;\n  text?: never;\n}\n\n/**\n * Props for the legacy API (deprecated, use compound components instead).\n *\n * @deprecated Use the compound component API with children instead:\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * ```tsx\n * // Legacy usage (deprecated)\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport interface PaginationLegacyProps\n  extends PaginationBaseProps, KumoPaginationVariantsProps {\n  children?: never;\n  /** @deprecated Use Pagination.Info with children prop instead */\n  text?: (props: {\n    page?: number;\n    perPage?: number;\n    totalCount?: number;\n    pageShowingRange: string;\n  }) => ReactNode;\n}\n\n/**\n * Pagination component props.\n *\n * Prefer the compound component API for new code:\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport type PaginationProps = PaginationCompoundProps | PaginationLegacyProps;\n\n/**\n * Page navigation controls with page count display.\n *\n * Supports both compound component and legacy patterns. Prefer compound components for new code:\n *\n * @example\n * // Compound component (recommended)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n *   <Pagination.Info />\n *   <Pagination.Separator />\n *   <Pagination.PageSize value={perPage} onChange={setPerPage} />\n *   <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * // Legacy (deprecated)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nfunction PaginationRoot(props: PaginationProps) {\n  const {\n    page = 1,\n    perPage,\n    totalCount,\n    setPage,\n    children,\n    className,\n    labels: labelsProp,\n  } = props;\n\n  // Extract legacy props (only present when children is not provided)\n  const text = \"text\" in props ? props.text : undefined;\n  const controls =\n    \"controls\" in props\n      ? (props.controls ?? KUMO_PAGINATION_DEFAULT_VARIANTS.controls)\n      : KUMO_PAGINATION_DEFAULT_VARIANTS.controls;\n  const [editingPage, setEditingPage] = useState<number>(1);\n\n  // Merge provided labels with defaults\n  const labels = useMemo<Required<PaginationLabels>>(\n    () => ({ ...DEFAULT_LABELS, ...labelsProp }),\n    [labelsProp],\n  );\n\n  useEffect(() => {\n    setEditingPage(page);\n  }, [page]);\n\n  const pageShowingRange = useMemo(() => {\n    let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n    let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n    if (Number.isNaN(lower)) lower = 0;\n    if (Number.isNaN(upper)) upper = 0;\n\n    return `${lower}-${upper}`;\n  }, [page, perPage, totalCount]);\n\n  const maxPage = useMemo(() => {\n    return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n  }, [totalCount, perPage]);\n\n  const contextValue: PaginationContextValue = {\n    page,\n    perPage,\n    totalCount,\n    maxPage,\n    pageShowingRange,\n    setPage,\n    editingPage,\n    setEditingPage,\n    labels,\n  };\n\n  // Compound component mode: render children within context\n  if (children) {\n    return (\n      <PaginationContext.Provider value={contextValue}>\n        <div\n          data-slot=\"pagination\"\n          className={cn(\"flex items-center gap-2 w-full\", className)}\n        >\n          {children}\n        </div>\n      </PaginationContext.Provider>\n    );\n  }\n\n  // Legacy mode: render default layout for backwards compatibility\n  const getPaginationText = () => {\n    if (text) {\n      return text({ page, perPage, totalCount, pageShowingRange });\n    } else if (totalCount && totalCount > 0) {\n      return (\n        <>\n          Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n          <span className=\"tabular-nums\">{totalCount}</span>\n        </>\n      );\n    }\n    return null;\n  };\n\n  return (\n    <PaginationContext.Provider value={contextValue}>\n      <div\n        data-slot=\"pagination\"\n        className={cn(\"flex items-center gap-2 w-full\", className)}\n      >\n        <div\n          aria-live=\"polite\"\n          aria-atomic=\"true\"\n          data-slot=\"pagination-info\"\n          className=\"grow text-sm text-kumo-subtle\"\n        >\n          {getPaginationText()}\n        </div>\n        <PaginationControls controls={controls} />\n      </div>\n    </PaginationContext.Provider>\n  );\n}\n\nPaginationRoot.displayName = \"Pagination\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nexport const Pagination = Object.assign(PaginationRoot, {\n  Info: PaginationInfo,\n  PageSize: PaginationPageSize,\n  Controls: PaginationControls,\n  Separator: PaginationSeparator,\n});\n\nexport {\n  PaginationInfo,\n  PaginationPageSize,\n  PaginationControls,\n  PaginationSeparator,\n};\n"],"names":["DEFAULT_PAGE_SIZE_OPTIONS","clamp","value","min","max","DEFAULT_LABELS","KUMO_PAGINATION_DEFAULT_VARIANTS","PaginationContext","createContext","usePaginationContext","context","useContext","PaginationInfo","children","className","page","perPage","totalCount","pageShowingRange","content","jsxs","Fragment","jsx","cn","PaginationPageSize","onChange","options","label","labels","Select","v","size","PaginationControls","controls","pageSelector","maxPage","setPage","editingPage","setEditingPage","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","num","_","i","p","clamped","e","nextPage","CaretRightIcon","CaretDoubleRightIcon","PaginationSeparator","PaginationRoot","props","labelsProp","text","useState","useMemo","useEffect","lower","upper","contextValue","getPaginationText","Pagination"],"mappings":"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"}

package/dist/chunks/{popover-f3t99000mahsnjzc.js → popover-i4opvl9g0as52fyx.js}

@@ -2,7 +2,7 @@
 import { jsx as o, jsxs as p } from "react/jsx-runtime";
 import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
 import { u as h } from "./portal-provider-hwmkdmkpvct0cb76.js";
-import { bi as C, bj as x, bk as N, bl as y, bm as L, bn as k, bo as T, bp as R, bq as w } from "./vendor-base-ui-epfrwb4nfbd4btaz.js";
+import { bj as C, bk as x, bl as N, bm as y, bn as L, bo as k, bp as T, bq as R, br as w } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const $ = {
   side: {
     top: {
@@ -176,4 +176,4 @@ export {
   g as f,
   V as g
 };
-//# sourceMappingURL=popover-f3t99000mahsnjzc.js.map
+//# sourceMappingURL=popover-i4opvl9g0as52fyx.js.map

package/dist/chunks/{popover-f3t99000mahsnjzc.js.map → popover-i4opvl9g0as52fyx.js.map}

@@ -1 +1 @@
-{"version":3,"file":"popover-f3t99000mahsnjzc.js","sources":["../../src/components/popover/popover.tsx"],"sourcesContent":["import { Popover as PopoverBase } from \"@base-ui/react/popover\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  usePortalContainer,\n  type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Popover side variant definitions mapping positions to their Tailwind classes. */\nexport const KUMO_POPOVER_VARIANTS = {\n  side: {\n    top: {\n      classes: \"\",\n      description: \"Popover appears above the trigger\",\n    },\n    bottom: {\n      classes: \"\",\n      description: \"Popover appears below the trigger\",\n    },\n    left: {\n      classes: \"\",\n      description: \"Popover appears to the left of the trigger\",\n    },\n    right: {\n      classes: \"\",\n      description: \"Popover appears to the right of the trigger\",\n    },\n  },\n} as const;\n\nexport const KUMO_POPOVER_DEFAULT_VARIANTS = {\n  side: \"bottom\",\n} as const;\n\n// Derived types from KUMO_POPOVER_VARIANTS\nexport type KumoPopoverSide = keyof typeof KUMO_POPOVER_VARIANTS.side;\n\nexport interface KumoPopoverVariantsProps {\n  /**\n   * Which side of the trigger the popover appears on.\n   * - `\"top\"` — Above the trigger\n   * - `\"bottom\"` — Below the trigger\n   * - `\"left\"` — Left of the trigger\n   * - `\"right\"` — Right of the trigger\n   * @default \"bottom\"\n   */\n  side?: KumoPopoverSide;\n}\n\n// ============================================================================\n// Popover Root\n// ============================================================================\n\ntype BasePopoverRootProps = ComponentPropsWithoutRef<typeof PopoverBase.Root>;\n\nexport type PopoverRootProps = BasePopoverRootProps;\n\nfunction PopoverRoot({ children, ...props }: PopoverRootProps) {\n  return <PopoverBase.Root {...props}>{children}</PopoverBase.Root>;\n}\n\nPopoverRoot.displayName = \"Popover\";\n\n// ============================================================================\n// Popover Trigger\n// ============================================================================\n\ntype BasePopoverTriggerProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Trigger\n>;\n\nexport type PopoverTriggerProps = BasePopoverTriggerProps & {\n  /**\n   * @deprecated Use the `render` prop instead.\n   * @example `<Popover.Trigger render={<Button />}>Open</Popover.Trigger>` instead of `<Popover.Trigger asChild><Button>Open</Button></Popover.Trigger>`\n   */\n  asChild?: boolean;\n};\n\nfunction PopoverTrigger({\n  children,\n  className,\n  asChild,\n  render,\n  ...props\n}: PopoverTriggerProps) {\n  // Support both render prop (preferred) and deprecated asChild pattern\n  // When using asChild, children IS the render element, so don't pass it as children\n  const resolvedRender =\n    render ??\n    (asChild ? (children as BasePopoverTriggerProps[\"render\"]) : undefined);\n\n  return (\n    <PopoverBase.Trigger\n      className={className}\n      render={resolvedRender}\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </PopoverBase.Trigger>\n  );\n}\n\nPopoverTrigger.displayName = \"Popover.Trigger\";\n\n// ============================================================================\n// Popover Content\n// ============================================================================\n\n/** Alignment options for popover positioning */\ntype PopoverAlign = \"start\" | \"center\" | \"end\";\n\ntype BasePopoverPositionerProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Positioner\n>;\n\n/**\n * Popover content panel props.\n *\n * @example\n * ```tsx\n * <Popover.Content side=\"top\" align=\"start\" sideOffset={12}>\n *   <p>Popover body</p>\n * </Popover.Content>\n * ```\n */\nexport type PopoverContentProps = KumoPopoverVariantsProps & {\n  /**\n   * An element to position the popup against.\n   * By default, the popup will be positioned against the trigger.\n   *\n   * Accepts a DOM element, a ref to a DOM element, a virtual element\n   * (object with a `getBoundingClientRect` method), or a function\n   * returning any of these.\n   *\n   * This is useful when the popover trigger and the desired anchor point\n   * are in different component trees, or when positioning against a\n   * coordinate (e.g., a `DOMRect` from `getBoundingClientRect()`).\n   *\n   * @example Virtual element (e.g., anchoring to a DOMRect)\n   * ```tsx\n   * <Popover open={open} onOpenChange={setOpen}>\n   *   <Popover.Content anchor={{ getBoundingClientRect: () => anchorRect }}>\n   *     <p>Anchored content</p>\n   *   </Popover.Content>\n   * </Popover>\n   * ```\n   */\n  anchor?: BasePopoverPositionerProps[\"anchor\"];\n  /**\n   * How to align the popover relative to the trigger.\n   * @default \"center\"\n   */\n  align?: PopoverAlign;\n  /**\n   * Distance between the trigger and the popover in pixels.\n   * @default 8\n   */\n  sideOffset?: number;\n  /**\n   * Additional offset along the alignment axis in pixels.\n   * @default 0\n   */\n  alignOffset?: number;\n  /**\n   * Determines which CSS `position` property to use.\n   * Use \"fixed\" when the popover needs to escape stacking contexts (e.g., inside sticky headers).\n   * @default \"absolute\"\n   */\n  positionMethod?: \"absolute\" | \"fixed\";\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** Content to render inside the popover. */\n  children?: ReactNode;\n  /**\n   * Container element for the portal. Use this to render the popover inside\n   * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n   * @default document.body (or KumoPortalProvider container if set)\n   */\n  container?: PortalContainer;\n};\n\nfunction PopoverContent({\n  children,\n  side = KUMO_POPOVER_DEFAULT_VARIANTS.side,\n  align = \"center\",\n  sideOffset = 8,\n  alignOffset = 0,\n  positionMethod = \"absolute\",\n  anchor,\n  className,\n  container: containerProp,\n}: PopoverContentProps) {\n  const contextContainer = usePortalContainer();\n  const container = containerProp ?? contextContainer ?? undefined;\n\n  return (\n    <PopoverBase.Portal container={container}>\n      <PopoverBase.Positioner\n        anchor={anchor}\n        align={align}\n        alignOffset={alignOffset}\n        side={side}\n        sideOffset={sideOffset}\n        positionMethod={positionMethod}\n      >\n        <PopoverBase.Popup\n          className={cn(\n            \"flex origin-(--transform-origin) flex-col rounded-lg bg-kumo-base px-4 py-3 text-sm text-kumo-default\",\n            \"shadow-lg shadow-kumo-tip-shadow outline outline-kumo-fill\",\n            \"transition-[transform,scale,opacity] duration-150\",\n            \"data-starting-style:scale-90 data-starting-style:opacity-0\",\n            \"data-ending-style:scale-90 data-ending-style:opacity-0\",\n            \"data-instant:duration-0\",\n            \"kumo-popover-popup\",\n            className,\n          )}\n        >\n          <PopoverBase.Arrow\n            className={cn(\n              \"flex\",\n              \"data-[side=bottom]:-top-2\",\n              \"data-[side=left]:right-[-13px] data-[side=left]:rotate-90\",\n              \"data-[side=right]:left-[-13px] data-[side=right]:-rotate-90\",\n              \"data-[side=top]:-bottom-2 data-[side=top]:rotate-180\",\n            )}\n          >\n            <ArrowSvg />\n          </PopoverBase.Arrow>\n          {children}\n        </PopoverBase.Popup>\n      </PopoverBase.Positioner>\n    </PopoverBase.Portal>\n  );\n}\n\nPopoverContent.displayName = \"Popover.Content\";\n\n// ============================================================================\n// Popover Title\n// ============================================================================\n\ntype BasePopoverTitleProps = ComponentPropsWithoutRef<typeof PopoverBase.Title>;\n\nexport type PopoverTitleProps = BasePopoverTitleProps;\n\nfunction PopoverTitle({ className, ...props }: PopoverTitleProps) {\n  return (\n    <PopoverBase.Title\n      className={cn(\"m-0 text-base leading-6 font-medium\", className)}\n      {...props}\n    />\n  );\n}\n\nPopoverTitle.displayName = \"Popover.Title\";\n\n// ============================================================================\n// Popover Description\n// ============================================================================\n\ntype BasePopoverDescriptionProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Description\n>;\n\nexport type PopoverDescriptionProps = BasePopoverDescriptionProps;\n\nfunction PopoverDescription({ className, ...props }: PopoverDescriptionProps) {\n  return (\n    <PopoverBase.Description\n      className={cn(\"m-0 text-base leading-6 text-kumo-subtle\", className)}\n      {...props}\n    />\n  );\n}\n\nPopoverDescription.displayName = \"Popover.Description\";\n\n// ============================================================================\n// Popover Close\n// ============================================================================\n\ntype BasePopoverCloseProps = ComponentPropsWithoutRef<typeof PopoverBase.Close>;\n\nexport type PopoverCloseProps = BasePopoverCloseProps & {\n  /**\n   * @deprecated Use the `render` prop instead.\n   * @example `<Popover.Close render={<Button />}>Close</Popover.Close>` instead of `<Popover.Close asChild><Button>Close</Button></Popover.Close>`\n   */\n  asChild?: boolean;\n};\n\nfunction PopoverClose({\n  children,\n  className,\n  asChild,\n  render,\n  ...props\n}: PopoverCloseProps) {\n  // Support both render prop (preferred) and deprecated asChild pattern\n  // When using asChild, children IS the render element, so don't pass it as children\n  const resolvedRender =\n    render ??\n    (asChild ? (children as BasePopoverCloseProps[\"render\"]) : undefined);\n\n  return (\n    <PopoverBase.Close className={className} render={resolvedRender} {...props}>\n      {asChild ? undefined : children}\n    </PopoverBase.Close>\n  );\n}\n\nPopoverClose.displayName = \"Popover.Close\";\n\n// ============================================================================\n// Arrow SVG\n// ============================================================================\n\n/**\n * Arrow SVG with three paths for proper border rendering in both light and dark modes.\n * This approach matches Base UI's popover/tooltip implementation.\n *\n * The three paths are:\n * 1. ArrowFill - The main arrow body, matches popover background\n * 2. ArrowOuterStroke - Border visible in light mode only (transparent in dark)\n * 3. ArrowInnerStroke - Border visible in dark mode only (transparent in light)\n *\n * This is necessary because the outer and inner stroke paths have different geometries,\n * and using both ensures the arrow border aligns perfectly with the popover's outline\n * in both color modes.\n *\n * @see https://base-ui.com/react/components/popover\n */\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" {...props}>\n      <path\n        d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n        className=\"fill-kumo-base\"\n      />\n      <path\n        d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n        className=\"fill-kumo-tip-shadow\"\n      />\n      <path\n        d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\"\n        className=\"fill-kumo-tip-stroke\"\n      />\n    </svg>\n  );\n}\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\n/**\n * Popover component for displaying accessible popup content anchored to a trigger.\n *\n * @example\n * ```tsx\n * <Popover>\n *   <Popover.Trigger render={<Button>Open</Button>} />\n *   <Popover.Content>\n *     <Popover.Title>Notifications</Popover.Title>\n *     <Popover.Description>You are all caught up!</Popover.Description>\n *   </Popover.Content>\n * </Popover>\n * ```\n *\n * @see https://base-ui.com/react/components/popover\n */\nexport const Popover = Object.assign(PopoverRoot, {\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n  Title: PopoverTitle,\n  Description: PopoverDescription,\n  Close: PopoverClose,\n});\n\n// Export sub-components for direct access and type inference\nexport {\n  PopoverRoot,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverTitle,\n  PopoverDescription,\n  PopoverClose,\n};\n"],"names":["KUMO_POPOVER_VARIANTS","KUMO_POPOVER_DEFAULT_VARIANTS","PopoverRoot","children","props","PopoverBase.Root","PopoverTrigger","className","asChild","render","jsx","PopoverBase.Trigger","PopoverContent","side","align","sideOffset","alignOffset","positionMethod","anchor","containerProp","contextContainer","usePortalContainer","PopoverBase.Portal","PopoverBase.Positioner","jsxs","PopoverBase.Popup","cn","PopoverBase.Arrow","ArrowSvg","PopoverTitle","PopoverBase.Title","PopoverDescription","PopoverBase.Description","PopoverClose","PopoverBase.Close","Popover"],"mappings":"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"}
+{"version":3,"file":"popover-i4opvl9g0as52fyx.js","sources":["../../src/components/popover/popover.tsx"],"sourcesContent":["import { Popover as PopoverBase } from \"@base-ui/react/popover\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport {\n  usePortalContainer,\n  type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Popover side variant definitions mapping positions to their Tailwind classes. */\nexport const KUMO_POPOVER_VARIANTS = {\n  side: {\n    top: {\n      classes: \"\",\n      description: \"Popover appears above the trigger\",\n    },\n    bottom: {\n      classes: \"\",\n      description: \"Popover appears below the trigger\",\n    },\n    left: {\n      classes: \"\",\n      description: \"Popover appears to the left of the trigger\",\n    },\n    right: {\n      classes: \"\",\n      description: \"Popover appears to the right of the trigger\",\n    },\n  },\n} as const;\n\nexport const KUMO_POPOVER_DEFAULT_VARIANTS = {\n  side: \"bottom\",\n} as const;\n\n// Derived types from KUMO_POPOVER_VARIANTS\nexport type KumoPopoverSide = keyof typeof KUMO_POPOVER_VARIANTS.side;\n\nexport interface KumoPopoverVariantsProps {\n  /**\n   * Which side of the trigger the popover appears on.\n   * - `\"top\"` — Above the trigger\n   * - `\"bottom\"` — Below the trigger\n   * - `\"left\"` — Left of the trigger\n   * - `\"right\"` — Right of the trigger\n   * @default \"bottom\"\n   */\n  side?: KumoPopoverSide;\n}\n\n// ============================================================================\n// Popover Root\n// ============================================================================\n\ntype BasePopoverRootProps = ComponentPropsWithoutRef<typeof PopoverBase.Root>;\n\nexport type PopoverRootProps = BasePopoverRootProps;\n\nfunction PopoverRoot({ children, ...props }: PopoverRootProps) {\n  return <PopoverBase.Root {...props}>{children}</PopoverBase.Root>;\n}\n\nPopoverRoot.displayName = \"Popover\";\n\n// ============================================================================\n// Popover Trigger\n// ============================================================================\n\ntype BasePopoverTriggerProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Trigger\n>;\n\nexport type PopoverTriggerProps = BasePopoverTriggerProps & {\n  /**\n   * @deprecated Use the `render` prop instead.\n   * @example `<Popover.Trigger render={<Button />}>Open</Popover.Trigger>` instead of `<Popover.Trigger asChild><Button>Open</Button></Popover.Trigger>`\n   */\n  asChild?: boolean;\n};\n\nfunction PopoverTrigger({\n  children,\n  className,\n  asChild,\n  render,\n  ...props\n}: PopoverTriggerProps) {\n  // Support both render prop (preferred) and deprecated asChild pattern\n  // When using asChild, children IS the render element, so don't pass it as children\n  const resolvedRender =\n    render ??\n    (asChild ? (children as BasePopoverTriggerProps[\"render\"]) : undefined);\n\n  return (\n    <PopoverBase.Trigger\n      className={className}\n      render={resolvedRender}\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </PopoverBase.Trigger>\n  );\n}\n\nPopoverTrigger.displayName = \"Popover.Trigger\";\n\n// ============================================================================\n// Popover Content\n// ============================================================================\n\n/** Alignment options for popover positioning */\ntype PopoverAlign = \"start\" | \"center\" | \"end\";\n\ntype BasePopoverPositionerProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Positioner\n>;\n\n/**\n * Popover content panel props.\n *\n * @example\n * ```tsx\n * <Popover.Content side=\"top\" align=\"start\" sideOffset={12}>\n *   <p>Popover body</p>\n * </Popover.Content>\n * ```\n */\nexport type PopoverContentProps = KumoPopoverVariantsProps & {\n  /**\n   * An element to position the popup against.\n   * By default, the popup will be positioned against the trigger.\n   *\n   * Accepts a DOM element, a ref to a DOM element, a virtual element\n   * (object with a `getBoundingClientRect` method), or a function\n   * returning any of these.\n   *\n   * This is useful when the popover trigger and the desired anchor point\n   * are in different component trees, or when positioning against a\n   * coordinate (e.g., a `DOMRect` from `getBoundingClientRect()`).\n   *\n   * @example Virtual element (e.g., anchoring to a DOMRect)\n   * ```tsx\n   * <Popover open={open} onOpenChange={setOpen}>\n   *   <Popover.Content anchor={{ getBoundingClientRect: () => anchorRect }}>\n   *     <p>Anchored content</p>\n   *   </Popover.Content>\n   * </Popover>\n   * ```\n   */\n  anchor?: BasePopoverPositionerProps[\"anchor\"];\n  /**\n   * How to align the popover relative to the trigger.\n   * @default \"center\"\n   */\n  align?: PopoverAlign;\n  /**\n   * Distance between the trigger and the popover in pixels.\n   * @default 8\n   */\n  sideOffset?: number;\n  /**\n   * Additional offset along the alignment axis in pixels.\n   * @default 0\n   */\n  alignOffset?: number;\n  /**\n   * Determines which CSS `position` property to use.\n   * Use \"fixed\" when the popover needs to escape stacking contexts (e.g., inside sticky headers).\n   * @default \"absolute\"\n   */\n  positionMethod?: \"absolute\" | \"fixed\";\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** Content to render inside the popover. */\n  children?: ReactNode;\n  /**\n   * Container element for the portal. Use this to render the popover inside\n   * a Shadow DOM or custom container. Overrides `KumoPortalProvider` context.\n   * @default document.body (or KumoPortalProvider container if set)\n   */\n  container?: PortalContainer;\n};\n\nfunction PopoverContent({\n  children,\n  side = KUMO_POPOVER_DEFAULT_VARIANTS.side,\n  align = \"center\",\n  sideOffset = 8,\n  alignOffset = 0,\n  positionMethod = \"absolute\",\n  anchor,\n  className,\n  container: containerProp,\n}: PopoverContentProps) {\n  const contextContainer = usePortalContainer();\n  const container = containerProp ?? contextContainer ?? undefined;\n\n  return (\n    <PopoverBase.Portal container={container}>\n      <PopoverBase.Positioner\n        anchor={anchor}\n        align={align}\n        alignOffset={alignOffset}\n        side={side}\n        sideOffset={sideOffset}\n        positionMethod={positionMethod}\n      >\n        <PopoverBase.Popup\n          className={cn(\n            \"flex origin-(--transform-origin) flex-col rounded-lg bg-kumo-base px-4 py-3 text-sm text-kumo-default\",\n            \"shadow-lg shadow-kumo-tip-shadow outline outline-kumo-fill\",\n            \"transition-[transform,scale,opacity] duration-150\",\n            \"data-starting-style:scale-90 data-starting-style:opacity-0\",\n            \"data-ending-style:scale-90 data-ending-style:opacity-0\",\n            \"data-instant:duration-0\",\n            \"kumo-popover-popup\",\n            className,\n          )}\n        >\n          <PopoverBase.Arrow\n            className={cn(\n              \"flex\",\n              \"data-[side=bottom]:-top-2\",\n              \"data-[side=left]:right-[-13px] data-[side=left]:rotate-90\",\n              \"data-[side=right]:left-[-13px] data-[side=right]:-rotate-90\",\n              \"data-[side=top]:-bottom-2 data-[side=top]:rotate-180\",\n            )}\n          >\n            <ArrowSvg />\n          </PopoverBase.Arrow>\n          {children}\n        </PopoverBase.Popup>\n      </PopoverBase.Positioner>\n    </PopoverBase.Portal>\n  );\n}\n\nPopoverContent.displayName = \"Popover.Content\";\n\n// ============================================================================\n// Popover Title\n// ============================================================================\n\ntype BasePopoverTitleProps = ComponentPropsWithoutRef<typeof PopoverBase.Title>;\n\nexport type PopoverTitleProps = BasePopoverTitleProps;\n\nfunction PopoverTitle({ className, ...props }: PopoverTitleProps) {\n  return (\n    <PopoverBase.Title\n      className={cn(\"m-0 text-base leading-6 font-medium\", className)}\n      {...props}\n    />\n  );\n}\n\nPopoverTitle.displayName = \"Popover.Title\";\n\n// ============================================================================\n// Popover Description\n// ============================================================================\n\ntype BasePopoverDescriptionProps = ComponentPropsWithoutRef<\n  typeof PopoverBase.Description\n>;\n\nexport type PopoverDescriptionProps = BasePopoverDescriptionProps;\n\nfunction PopoverDescription({ className, ...props }: PopoverDescriptionProps) {\n  return (\n    <PopoverBase.Description\n      className={cn(\"m-0 text-base leading-6 text-kumo-subtle\", className)}\n      {...props}\n    />\n  );\n}\n\nPopoverDescription.displayName = \"Popover.Description\";\n\n// ============================================================================\n// Popover Close\n// ============================================================================\n\ntype BasePopoverCloseProps = ComponentPropsWithoutRef<typeof PopoverBase.Close>;\n\nexport type PopoverCloseProps = BasePopoverCloseProps & {\n  /**\n   * @deprecated Use the `render` prop instead.\n   * @example `<Popover.Close render={<Button />}>Close</Popover.Close>` instead of `<Popover.Close asChild><Button>Close</Button></Popover.Close>`\n   */\n  asChild?: boolean;\n};\n\nfunction PopoverClose({\n  children,\n  className,\n  asChild,\n  render,\n  ...props\n}: PopoverCloseProps) {\n  // Support both render prop (preferred) and deprecated asChild pattern\n  // When using asChild, children IS the render element, so don't pass it as children\n  const resolvedRender =\n    render ??\n    (asChild ? (children as BasePopoverCloseProps[\"render\"]) : undefined);\n\n  return (\n    <PopoverBase.Close className={className} render={resolvedRender} {...props}>\n      {asChild ? undefined : children}\n    </PopoverBase.Close>\n  );\n}\n\nPopoverClose.displayName = \"Popover.Close\";\n\n// ============================================================================\n// Arrow SVG\n// ============================================================================\n\n/**\n * Arrow SVG with three paths for proper border rendering in both light and dark modes.\n * This approach matches Base UI's popover/tooltip implementation.\n *\n * The three paths are:\n * 1. ArrowFill - The main arrow body, matches popover background\n * 2. ArrowOuterStroke - Border visible in light mode only (transparent in dark)\n * 3. ArrowInnerStroke - Border visible in dark mode only (transparent in light)\n *\n * This is necessary because the outer and inner stroke paths have different geometries,\n * and using both ensures the arrow border aligns perfectly with the popover's outline\n * in both color modes.\n *\n * @see https://base-ui.com/react/components/popover\n */\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" {...props}>\n      <path\n        d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n        className=\"fill-kumo-base\"\n      />\n      <path\n        d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n        className=\"fill-kumo-tip-shadow\"\n      />\n      <path\n        d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\"\n        className=\"fill-kumo-tip-stroke\"\n      />\n    </svg>\n  );\n}\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\n/**\n * Popover component for displaying accessible popup content anchored to a trigger.\n *\n * @example\n * ```tsx\n * <Popover>\n *   <Popover.Trigger render={<Button>Open</Button>} />\n *   <Popover.Content>\n *     <Popover.Title>Notifications</Popover.Title>\n *     <Popover.Description>You are all caught up!</Popover.Description>\n *   </Popover.Content>\n * </Popover>\n * ```\n *\n * @see https://base-ui.com/react/components/popover\n */\nexport const Popover = Object.assign(PopoverRoot, {\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n  Title: PopoverTitle,\n  Description: PopoverDescription,\n  Close: PopoverClose,\n});\n\n// Export sub-components for direct access and type inference\nexport {\n  PopoverRoot,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverTitle,\n  PopoverDescription,\n  PopoverClose,\n};\n"],"names":["KUMO_POPOVER_VARIANTS","KUMO_POPOVER_DEFAULT_VARIANTS","PopoverRoot","children","props","PopoverBase.Root","PopoverTrigger","className","asChild","render","jsx","PopoverBase.Trigger","PopoverContent","side","align","sideOffset","alignOffset","positionMethod","anchor","containerProp","contextContainer","usePortalContainer","PopoverBase.Portal","PopoverBase.Positioner","jsxs","PopoverBase.Popup","cn","PopoverBase.Arrow","ArrowSvg","PopoverTitle","PopoverBase.Title","PopoverDescription","PopoverBase.Description","PopoverClose","PopoverBase.Close","Popover"],"mappings":";;;;;AASO,MAAMA,IAAwB;AAAA,EACnC,MAAM;AAAA,IACJ,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAAgC;AAAA,EAC3C,MAAM;AACR;AAyBA,SAASC,EAAY,EAAE,UAAAC,GAAU,GAAGC,KAA2B;AAC7D,2BAAQC,GAAA,EAAkB,GAAGD,GAAQ,UAAAD,EAAA,CAAS;AAChD;AAEAD,EAAY,cAAc;AAkB1B,SAASI,EAAe;AAAA,EACtB,UAAAH;AAAA,EACA,WAAAI;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGL;AACL,GAAwB;AAOtB,SACE,gBAAAM;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAAJ;AAAA,MACA,QANFE,MACCD,IAAWL,IAAiD;AAAA,MAM1D,GAAGC;AAAA,MAEH,cAAU,SAAYD;AAAA,IAAA;AAAA,EAAA;AAG7B;AAEAG,EAAe,cAAc;AA+E7B,SAASM,EAAe;AAAA,EACtB,UAAAT;AAAA,EACA,MAAAU,IAAOZ,EAA8B;AAAA,EACrC,OAAAa,IAAQ;AAAA,EACR,YAAAC,IAAa;AAAA,EACb,aAAAC,IAAc;AAAA,EACd,gBAAAC,IAAiB;AAAA,EACjB,QAAAC;AAAA,EACA,WAAAX;AAAA,EACA,WAAWY;AACb,GAAwB;AACtB,QAAMC,IAAmBC,EAAA;AAGzB,SACE,gBAAAX,EAACY,GAAA,EAAmB,WAHJH,KAAiBC,KAAoB,QAInD,UAAA,gBAAAV;AAAA,IAACa;AAAAA,IAAA;AAAA,MACC,QAAAL;AAAA,MACA,OAAAJ;AAAA,MACA,aAAAE;AAAA,MACA,MAAAH;AAAA,MACA,YAAAE;AAAA,MACA,gBAAAE;AAAA,MAEA,UAAA,gBAAAO;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,WAAWC;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACAnB;AAAA,UAAA;AAAA,UAGF,UAAA;AAAA,YAAA,gBAAAG;AAAA,cAACiB;AAAAA,cAAA;AAAA,gBACC,WAAWD;AAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,gBAAA;AAAA,gBAGF,4BAACE,GAAA,CAAA,CAAS;AAAA,cAAA;AAAA,YAAA;AAAA,YAEXzB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA,GAEJ;AAEJ;AAEAS,EAAe,cAAc;AAU7B,SAASiB,EAAa,EAAE,WAAAtB,GAAW,GAAGH,KAA4B;AAChE,SACE,gBAAAM;AAAA,IAACoB;AAAAA,IAAA;AAAA,MACC,WAAWJ,EAAG,uCAAuCnB,CAAS;AAAA,MAC7D,GAAGH;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAyB,EAAa,cAAc;AAY3B,SAASE,EAAmB,EAAE,WAAAxB,GAAW,GAAGH,KAAkC;AAC5E,SACE,gBAAAM;AAAA,IAACsB;AAAAA,IAAA;AAAA,MACC,WAAWN,EAAG,4CAA4CnB,CAAS;AAAA,MAClE,GAAGH;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA2B,EAAmB,cAAc;AAgBjC,SAASE,EAAa;AAAA,EACpB,UAAA9B;AAAA,EACA,WAAAI;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGL;AACL,GAAsB;AAOpB,SACE,gBAAAM,EAACwB,GAAA,EAAkB,WAAA3B,GAAsB,QAJzCE,MACCD,IAAWL,IAA+C,SAGO,GAAGC,GAClE,UAAAI,IAAU,SAAYL,EAAA,CACzB;AAEJ;AAEA8B,EAAa,cAAc;AAqB3B,SAASL,EAASxB,GAAoC;AACpD,SACE,gBAAAoB,EAAC,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAQ,GAAGpB,GAC9D,UAAA;AAAA,IAAA,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAE;AAAA,QACF,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAEZ,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAE;AAAA,QACF,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAEZ,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAE;AAAA,QACF,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GACF;AAEJ;AAsBO,MAAMyB,IAAU,OAAO,OAAOjC,GAAa;AAAA,EAChD,SAASI;AAAA,EACT,SAASM;AAAA,EACT,OAAOiB;AAAA,EACP,aAAaE;AAAA,EACb,OAAOE;AACT,CAAC;"}

package/dist/chunks/{radio-me5m5ei86beum5bo.js → radio-g56o5rftpu1qpxuv.js}

@@ -3,7 +3,7 @@ import { jsx as e, jsxs as p } from "react/jsx-runtime";
 import { forwardRef as I, createContext as C, useContext as G } from "react";
 import { c as o } from "./cn-ct4n7r74mh8y0f48.js";
 import { r as x } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
-import { R as L, U as O, Q as w, br as v, bs as N } from "./vendor-base-ui-epfrwb4nfbd4btaz.js";
+import { R as L, U as O, Q as w, bs as v, bt as N } from "./vendor-base-ui-nbyiqqi138hcoz52.js";
 const R = {
   variant: {
     default: {
@@ -114,7 +114,7 @@ const y = C({
               value: c,
               disabled: r,
               className: o(
-                "relative flex h-4 w-4 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2",
+                "relative flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2",
                 a === "error" ? "ring-kumo-danger" : "ring-kumo-line",
                 !r && a !== "error" && "group-hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
                 !r && a === "error" && "focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3",
@@ -158,16 +158,16 @@ function h({
   value: l,
   onValueChange: g,
   disabled: u,
-  controlPosition: b,
+  controlPosition: k,
   name: d,
   className: m
 }) {
-  return /* @__PURE__ */ e(y.Provider, { value: { controlPosition: b, appearance: s }, children: /* @__PURE__ */ e(
+  return /* @__PURE__ */ e(y.Provider, { value: { controlPosition: k, appearance: s }, children: /* @__PURE__ */ e(
     L,
     {
       defaultValue: c,
       value: l,
-      onValueChange: (k) => g?.(k),
+      onValueChange: (b) => g?.(b),
       disabled: u,
       name: d,
       children: /* @__PURE__ */ p(
@@ -207,4 +207,4 @@ export {
   f as b,
   P as r
 };
-//# sourceMappingURL=radio-me5m5ei86beum5bo.js.map
+//# sourceMappingURL=radio-g56o5rftpu1qpxuv.js.map