npm - @cloudflare/kumo - Versions diffs - 2.0.1 → 2.0.3 - Mend

@cloudflare/kumo 2.0.1 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (158) hide show

package/dist/chunks/code-f9v1ikwhekqw274q.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"code-f9v1ikwhekqw274q.js","sources":["../../src/components/code/code.tsx"],"sourcesContent":["import { type CSSProperties } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Code language variant definitions. */\nexport const KUMO_CODE_VARIANTS = {\n lang: {\n ts: {\n classes: \"\",\n description: \"TypeScript code\",\n },\n tsx: {\n classes: \"\",\n description: \"TypeScript JSX code\",\n },\n jsonc: {\n classes: \"\",\n description: \"JSON with comments\",\n },\n bash: {\n classes: \"\",\n description: \"Shell/Bash commands\",\n },\n css: {\n classes: \"\",\n description: \"CSS styles\",\n },\n },\n} as const;\n\nexport const KUMO_CODE_DEFAULT_VARIANTS = {\n lang: \"ts\",\n} as const;\n\n/**\n * Styling metadata for Code component (for AI/Figma plugin consumption)\n */\nexport const KUMO_CODE_STYLING = {\n /** Base semantic tokens used */\n baseTokens: [\"text-kumo-subtle\"],\n /** Typography and layout */\n typography: {\n fontFamily: \"font-mono\",\n fontSize: \"text-sm\",\n lineHeight: \"leading-[20px]\",\n },\n /** Container dimensions */\n dimensions: {\n margin: \"m-0\",\n padding: \"p-0\",\n width: \"w-auto\",\n },\n /** Border and background */\n appearance: {\n borderRadius: \"rounded-none\",\n border: \"border-none\",\n background: \"bg-transparent\",\n },\n} as const;\n\n/**\n * Styling metadata for CodeBlock component (for AI/Figma plugin consumption)\n */\nexport const KUMO_CODEBLOCK_STYLING = {\n /** Base semantic tokens used */\n baseTokens: [\"bg-kumo-base\", \"border-kumo-fill\"],\n /** Container styling */\n container: {\n minWidth: \"min-w-0\",\n borderRadius: \"rounded-md\",\n border: \"border border-kumo-fill\",\n background: \"bg-kumo-base\",\n },\n /** Inner code element padding */\n innerPadding: \"[&>pre]:p-2.5\",\n /** Parsed dimensions */\n dimensions: {\n borderRadius: 6, // md = 6px\n padding: 10, // p-2.5 = 10px\n },\n} as const;\n\n// Derived types from KUMO_CODE_VARIANTS\nexport type KumoCodeLang = keyof typeof KUMO_CODE_VARIANTS.lang;\n\nexport interface KumoCodeVariantsProps {\n /**\n * Language hint for the code content.\n * - `\"ts\"` — TypeScript code\n * - `\"tsx\"` — TypeScript JSX code\n * - `\"jsonc\"` — JSON with comments\n * - `\"bash\"` — Shell/Bash commands\n * - `\"css\"` — CSS styles\n * @default \"ts\"\n */\n lang?: KumoCodeLang;\n}\n\nexport function codeVariants({\n lang = KUMO_CODE_DEFAULT_VARIANTS.lang,\n}: KumoCodeVariantsProps = {}) {\n return cn(\n // Base styles\n \"m-0 w-auto rounded-none border-none bg-transparent p-0 font-mono text-sm leading-[20px] text-kumo-subtle\",\n // Apply lang-specific styles (fallback to default if lang not in map)\n KUMO_CODE_VARIANTS.lang[lang]?.classes ??\n KUMO_CODE_VARIANTS.lang[KUMO_CODE_DEFAULT_VARIANTS.lang].classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type CodeLang = KumoCodeLang;\n\n/** @deprecated Use CodeLang instead */\nexport type BundledLanguage = CodeLang;\n\n/**\n * Code component props.\n *\n * @example\n * ```tsx\n * <Code code=\"const x = 1;\" lang=\"ts\" />\n * <Code code=\"export API_KEY={{apiKey}}\" lang=\"bash\"\n * values={{ apiKey: { value: \"sk_live_123\", highlight: true } }}\n * />\n * ```\n */\nexport interface CodeProps extends KumoCodeVariantsProps {\n /** The code string to display. */\n code: string;\n /** Template values for `{{key}}` interpolation. Values with `highlight: true` are visually emphasized. */\n values?: Record<\n string,\n {\n value: string;\n highlight?: boolean;\n }\n >;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Inline styles. */\n style?: CSSProperties;\n}\n\n/**\n * Simple code component without syntax highlighting.\n *\n * Renders code in a monospace font with customizable language metadata.\n * For a bordered container version, use `Code.Block` or `CodeBlock`.\n *\n * **Styling:**\n * - Typography: `font-mono text-sm leading-[20px]`\n * - Colors: `text-kumo-subtle` with `bg-transparent`\n * - No borders or padding (use CodeBlock for styled container)\n * - Supports all semantic tokens via className prop\n *\n * @deprecated Use `CodeHighlighted` from `@cloudflare/kumo/code` for syntax highlighting.\n * This component will be removed in v2.0.\n *\n * @example Migration:\n * ```tsx\n * // Before\n * import { Code } from \"@cloudflare/kumo\";\n * <Code code=\"const x = 1;\" lang=\"ts\" />\n *\n * // After\n * import { ShikiProvider, CodeHighlighted } from \"@cloudflare/kumo/code\";\n * <ShikiProvider engine=\"javascript\" languages={['tsx']} themes={{ light: 'github-light', dark: 'github-dark' }}>\n * <CodeHighlighted code=\"const x = 1;\" lang=\"tsx\" />\n * </ShikiProvider>\n * ```\n */\nfunction CodeComponent({\n code,\n lang = KUMO_CODE_DEFAULT_VARIANTS.lang,\n className,\n style,\n}: CodeProps) {\n return (\n <pre className={cn(codeVariants({ lang }), className)} style={style}>\n {code}\n </pre>\n );\n}\n\nCodeComponent.displayName = \"Code\";\n\n/**\n * CodeBlock component props — code inside a bordered container.\n *\n * @example\n * ```tsx\n * <CodeBlock lang=\"tsx\" code={`const greeting = \"Hello!\";`} />\n * ```\n */\nexport interface CodeBlockProps {\n /** The code string to display. */\n code: string;\n /**\n * Language hint for the code content.\n * @default \"ts\"\n */\n lang?: CodeLang;\n}\n\n/**\n * Code block with border and background container.\n *\n * A styled wrapper around Code that adds a bordered container with surface background.\n * Useful for displaying code snippets with visual separation from surrounding content.\n *\n * **Styling:**\n * - Container: `min-w-0 rounded-md border border-kumo-fill bg-kumo-base`\n * - Inner padding: `p-2.5` (10px)\n * - Uses semantic tokens: `bg-kumo-base`, `border-kumo-fill`\n *\n * @deprecated Use `CodeHighlighted` from `@cloudflare/kumo/code` for syntax highlighting.\n * This component will be removed in v2.0.\n */\nfunction CodeBlockComponent({ code, lang }: CodeBlockProps) {\n return (\n <div className=\"min-w-0 rounded-md border border-kumo-fill bg-kumo-base [&>pre]:p-2.5!\">\n <CodeComponent lang={lang} code={code} />\n </div>\n );\n}\n\nCodeBlockComponent.displayName = \"CodeBlock\";\n\n// Export Code with Block sub-component (for registry detection)\nexport const Code = Object.assign(CodeComponent, {\n Block: CodeBlockComponent,\n});\n\n// Backward-compatible standalone export\nexport const CodeBlock = CodeBlockComponent;\n"],"names":["KUMO_CODE_VARIANTS","KUMO_CODE_DEFAULT_VARIANTS","codeVariants","lang","cn","CodeComponent","code","className","style","jsx","CodeBlockComponent","Code","CodeBlock"],"mappings":";;;AAIO,MAAMA,IAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,KAAK;AAAA,MACH,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,MAAM;AACR;AAkEO,SAASC,EAAa;AAAA,EAC3B,MAAAC,IAAOF,EAA2B;AACpC,IAA2B,IAAI;AAC7B,SAAOG;AAAA;AAAA,IAEL;AAAA;AAAA,IAEAJ,EAAmB,KAAKG,CAAI,GAAG,WAC7BH,EAAmB,KAAKC,EAA2B,IAAI,EAAE;AAAA,EAAA;AAE/D;AAgEA,SAASI,EAAc;AAAA,EACrB,MAAAC;AAAA,EACA,MAAAH,IAAOF,EAA2B;AAAA,EAClC,WAAAM;AAAA,EACA,OAAAC;AACF,GAAc;AACZ,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWL,EAAGF,EAAa,EAAE,MAAAC,EAAA,CAAM,GAAGI,CAAS,GAAG,OAAAC,GACpD,UAAAF,EAAA,CACH;AAEJ;AAEAD,EAAc,cAAc;AAkC5B,SAASK,EAAmB,EAAE,MAAAJ,GAAM,MAAAH,KAAwB;AAC1D,SACE,gBAAAM,EAAC,SAAI,WAAU,0EACb,4BAACJ,GAAA,EAAc,MAAAF,GAAY,MAAAG,GAAY,EAAA,CACzC;AAEJ;AAEAI,EAAmB,cAAc;AAG1B,MAAMC,IAAO,OAAO,OAAON,GAAe;AAAA,EAC/C,OAAOK;AACT,CAAC,GAGYE,IAAYF;"}

package/dist/chunks/combobox-fq36ye0hstote16x.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"combobox-fq36ye0hstote16x.js","sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as ComboboxBase } from \"@base-ui/react/combobox\";\nimport { CaretDownIcon, CheckIcon, XIcon } from \"@phosphor-icons/react\";\nimport {\n Fragment,\n createContext,\n useContext,\n type PropsWithChildren,\n type ReactNode,\n} from \"react\";\nimport {\n inputVariants,\n KUMO_INPUT_VARIANTS,\n type KumoInputSize,\n} from \"../input/input\";\nimport { cn } from \"../../utils/cn\";\nimport { Field, type FieldErrorMatch } from \"../field/field\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Combobox variant definitions. */\nexport const KUMO_COMBOBOX_VARIANTS = {\n size: KUMO_INPUT_VARIANTS.size,\n inputSide: {\n right: {\n classes: \"\",\n description: \"Input positioned inline to the right of chips\",\n },\n top: {\n classes: \"\",\n description: \"Input positioned above chips\",\n },\n },\n} as const;\n\nexport const KUMO_COMBOBOX_DEFAULT_VARIANTS = {\n size: \"base\",\n inputSide: \"right\",\n} as const;\n\n// Context to pass size down to sub-components\nconst ComboboxSizeContext = createContext<KumoInputSize>(\"base\");\n\n// Derived types from KUMO_COMBOBOX_VARIANTS\nexport type KumoComboboxSize = keyof typeof KUMO_COMBOBOX_VARIANTS.size;\nexport type KumoComboboxInputSide =\n keyof typeof KUMO_COMBOBOX_VARIANTS.inputSide;\n\nexport interface KumoComboboxVariantsProps {\n /**\n * Size of the combobox trigger. Matches Input component sizes.\n * - `\"xs\"` — Extra small for compact UIs (h-5 / 20px)\n * - `\"sm\"` — Small for secondary fields (h-6.5 / 26px)\n * - `\"base\"` — Default size (h-9 / 36px)\n * - `\"lg\"` — Large for prominent fields (h-10 / 40px)\n * @default \"base\"\n */\n size?: KumoComboboxSize;\n /**\n * Position of the text input relative to chips in multi-select mode.\n * - `\"right\"` — Input inline to the right of chips\n * - `\"top\"` — Input above chips\n * @default \"right\"\n */\n inputSide?: KumoComboboxInputSide;\n}\n\nexport function comboboxVariants({\n inputSide = KUMO_COMBOBOX_DEFAULT_VARIANTS.inputSide,\n}: KumoComboboxVariantsProps = {}) {\n return cn(KUMO_COMBOBOX_VARIANTS.inputSide[inputSide].classes);\n}\n\n// Legacy type alias for backwards compatibility\nexport type ComboboxInputSide = KumoComboboxInputSide;\nexport type ComboboxSize = KumoComboboxSize;\n\nexport type ComboboxRootProps<\n Value = unknown,\n Multiple extends boolean | undefined = false,\n> = ComboboxBase.Root.Props<Value, Multiple>;\n\n/**\n * Combobox component props (simplified for documentation; the actual Root is generic).\n *\n * Combobox provides an autocomplete/typeahead input with a filterable dropdown.\n * Supports single-select, multi-select with chips, grouped items, and Field wrapper integration.\n *\n * @example\n * ```tsx\n * // Single-select with search input\n * <Combobox value={value} onValueChange={setValue} items={options}>\n * <Combobox.TriggerInput placeholder=\"Search…\" />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * <Combobox.Empty>No results</Combobox.Empty>\n * </Combobox.Content>\n * </Combobox>\n *\n * // Multi-select with chips\n * <Combobox multiple items={options} label=\"Tags\">\n * <Combobox.TriggerMultipleWithInput\n * placeholder=\"Add tag…\"\n * renderItem={(item) => <Combobox.Chip value={item}>{item.label}</Combobox.Chip>}\n * />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item.label}</Combobox.Item>}\n * </Combobox.List>\n * </Combobox.Content>\n * </Combobox>\n * ```\n */\nexport interface ComboboxProps extends KumoComboboxVariantsProps {\n /** Array of items to display in the dropdown */\n items: unknown[];\n /** Currently selected value(s) */\n value?: unknown;\n /** Callback when selection changes */\n onValueChange?: (value: unknown) => void;\n /** Enable multi-select mode */\n multiple?: boolean;\n /** Combobox content (trigger, content, items) */\n children: ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Label content for the combobox (enables Field wrapper) - can be a string or any React node */\n label?: ReactNode;\n /** Whether the combobox is required */\n required?: boolean;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /** Helper text displayed below the combobox */\n description?: ReactNode;\n /** Error message or validation error object */\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n}\n\nfunction Root<Value, Multiple extends boolean | undefined = false>({\n label,\n required,\n labelTooltip,\n description,\n error,\n children,\n size = \"base\",\n ...props\n}: ComboboxBase.Root.Props<Value, Multiple> & {\n label?: ReactNode;\n required?: boolean;\n labelTooltip?: ReactNode;\n description?: ReactNode;\n error?: string | { message: ReactNode; match: FieldErrorMatch };\n size?: KumoComboboxSize;\n}) {\n const comboboxControl = (\n <ComboboxSizeContext.Provider value={size}>\n <ComboboxBase.Root {...props}>{children}</ComboboxBase.Root>\n </ComboboxSizeContext.Provider>\n );\n\n // Render with Field wrapper if label, description, or error are provided\n if (label) {\n return (\n <Field\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n description={description}\n error={\n error\n ? typeof error === \"string\"\n ? { message: error, match: true }\n : error\n : undefined\n }\n >\n {comboboxControl}\n </Field>\n );\n }\n\n // Render bare combobox without Field wrapper\n return comboboxControl;\n}\n\nfunction Content({\n children,\n className,\n align = \"start\",\n sideOffset = 4,\n alignOffset,\n side,\n container: containerProp,\n}: PropsWithChildren<{\n className?: string;\n align?: ComboboxBase.Positioner.Props[\"align\"];\n alignOffset?: ComboboxBase.Positioner.Props[\"alignOffset\"];\n side?: ComboboxBase.Positioner.Props[\"side\"];\n sideOffset?: ComboboxBase.Positioner.Props[\"sideOffset\"];\n /**\n * Container element for the portal. Use this to render the combobox 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 const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <ComboboxBase.Portal container={container}>\n <ComboboxBase.Positioner\n className=\"\"\n align={align}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n side={side}\n >\n <ComboboxBase.Popup\n className={cn(\n \"flex flex-col\", // flexbox layout for sticky input + scrollable list\n \"max-h-[min(var(--available-height),24rem)] max-w-(--available-width) min-w-(--anchor-width) py-1.5\",\n \"bg-kumo-base text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n className,\n )}\n >\n {children}\n </ComboboxBase.Popup>\n </ComboboxBase.Positioner>\n </ComboboxBase.Portal>\n );\n}\n\n// Size-dependent styles for TriggerValue icon\nconst triggerValueIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; iconRight: string }\n> = {\n xs: { padding: \"pr-5\", iconSize: 12, iconRight: \"right-1\" },\n sm: { padding: \"pr-6\", iconSize: 14, iconRight: \"right-1.5\" },\n base: { padding: \"pr-8\", iconSize: 16, iconRight: \"right-2\" },\n lg: { padding: \"pr-10\", iconSize: 18, iconRight: \"right-3\" },\n};\n\nfunction TriggerValue({\n className,\n ...props\n}: ComboboxBase.Value.Props & { className?: string }) {\n const size = useContext(ComboboxSizeContext);\n const iconStyles = triggerValueIconStyles[size];\n\n return (\n <ComboboxBase.Trigger\n className={cn(\n inputVariants({ size }),\n \"relative flex items-center\",\n \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n iconStyles.padding,\n className,\n )}\n >\n <ComboboxBase.Value>{props.children}</ComboboxBase.Value>\n <ComboboxBase.Icon\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center text-kumo-subtle\",\n iconStyles.iconRight,\n )}\n >\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n );\n}\n\n// Size-dependent styles for TriggerInput icons\nconst triggerInputIconStyles: Record<\n KumoComboboxSize,\n { padding: string; iconSize: number; clearRight: string; caretRight: string }\n> = {\n xs: {\n padding: \"pr-7\",\n iconSize: 12,\n clearRight: \"right-5\",\n caretRight: \"right-1\",\n },\n sm: {\n padding: \"pr-9\",\n iconSize: 14,\n clearRight: \"right-6\",\n caretRight: \"right-1.5\",\n },\n base: {\n padding: \"pr-12\",\n iconSize: 16,\n clearRight: \"right-8\",\n caretRight: \"right-2\",\n },\n lg: {\n padding: \"pr-14\",\n iconSize: 18,\n clearRight: \"right-9\",\n caretRight: \"right-3\",\n },\n};\n\nfunction TriggerInput({\n clearLabel = \"Clear selection\",\n showOptionsLabel = \"Show options\",\n ...props\n}: ComboboxBase.Input.Props & {\n /** Accessible label for the clear button. Pass a translated string for i18n.\n * @default \"Clear selection\"\n */\n clearLabel?: string;\n /** Accessible label for the dropdown trigger. Pass a translated string for i18n.\n * @default \"Show options\"\n */\n showOptionsLabel?: string;\n}) {\n const size = useContext(ComboboxSizeContext);\n const iconStyles = triggerInputIconStyles[size];\n\n return (\n <div\n className={cn(\n \"relative inline-block w-full max-w-xs\",\n \"has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed\",\n props.className,\n )}\n >\n <ComboboxBase.Input\n {...props}\n className={cn(\n inputVariants({ size }),\n \"w-full\",\n iconStyles.padding,\n \"disabled:cursor-not-allowed\",\n )}\n />\n\n <ComboboxBase.Clear\n aria-label={clearLabel}\n className={cn(\n \"absolute top-1/2 flex -translate-y-1/2 cursor-pointer bg-transparent p-0\",\n \"data-[disabled]:pointer-events-none data-[disabled]:opacity-0\",\n iconStyles.clearRight,\n )}\n >\n <XIcon size={iconStyles.iconSize} />\n </ComboboxBase.Clear>\n\n <ComboboxBase.Trigger\n aria-label={showOptionsLabel}\n className={cn(\n \"absolute top-1/2 -translate-y-1/2 flex items-center justify-center cursor-pointer text-kumo-subtle\",\n \"m-0 bg-transparent p-0\", // Reset Stratus global button styles\n iconStyles.caretRight,\n )}\n >\n <ComboboxBase.Icon>\n <CaretDownIcon size={iconStyles.iconSize} className=\"fill-current\" />\n </ComboboxBase.Icon>\n </ComboboxBase.Trigger>\n </div>\n );\n}\n\nfunction Item({\n children,\n className,\n ...props\n}: ComboboxBase.Item.Props & { className?: string }) {\n return (\n <ComboboxBase.Item\n {...props}\n className={cn(\n \"group mx-1.5 grid grid-cols-[1fr_16px] gap-2 rounded px-2 py-1.5 text-base\",\n \"cursor-pointer data-highlighted:bg-kumo-tint\",\n // Disabled rows: muted text, no pointer, suppress highlight bg even\n // when keyboard nav lands on them. Base UI sets `data-disabled` on\n // the element when the `disabled` prop is true.\n \"data-[disabled]:cursor-not-allowed data-[disabled]:text-kumo-subtle data-[disabled]:opacity-60 data-[disabled]:data-highlighted:bg-transparent\",\n className,\n )}\n >\n <div className=\"col-start-1\">{children}</div>\n <ComboboxBase.ItemIndicator className=\"col-start-2 flex items-center\">\n <CheckIcon />\n </ComboboxBase.ItemIndicator>\n </ComboboxBase.Item>\n );\n}\n\nfunction Empty(props: ComboboxBase.Empty.Props) {\n return (\n <ComboboxBase.Empty\n {...props}\n className={cn(\n \"mx-1.5 shrink-0 px-4 py-2 text-[0.925rem] leading-4 text-kumo-subtle empty:m-0 empty:p-0\",\n )}\n children={props.children ?? \"No labels found.\"}\n />\n );\n}\n\nfunction Input(props: ComboboxBase.Input.Props) {\n return (\n <ComboboxBase.Input\n {...props}\n className={cn(\n inputVariants(),\n \"mx-1.5 w-[calc(100%-0.75rem)] shrink-0 first:mb-2\",\n props.className,\n )}\n />\n );\n}\n\nfunction List({\n className,\n ...props\n}: ComboboxBase.List.Props & { className?: string }) {\n return (\n <ComboboxBase.List\n {...props}\n className={cn(\n \"min-h-0 flex-1 overflow-y-auto overscroll-contain scroll-pt-2 scroll-pb-2\",\n className,\n )}\n />\n );\n}\n\nfunction GroupLabel(props: ComboboxBase.GroupLabel.Props) {\n return (\n <ComboboxBase.GroupLabel\n {...props}\n className={cn(\n \"mx-1.5 px-2 py-1.5 text-sm text-kumo-subtle\",\n props.className,\n )}\n />\n );\n}\n\nfunction Group(props: ComboboxBase.Group.Props) {\n return (\n <ComboboxBase.Group\n {...props}\n className=\"border-t border-kumo-hairline mt-2 pt-2 first:border-t-0 first:mt-0 first:pt-0\"\n />\n );\n}\n\nfunction Chip({\n removeLabel = \"Remove\",\n ...props\n}: ComboboxBase.Chip.Props & {\n /** Accessible label for the chip remove button. Pass a translated string for i18n.\n * @default \"Remove\"\n */\n removeLabel?: string;\n}) {\n return (\n <ComboboxBase.Chip\n {...props}\n className={cn(\n \"flex items-center gap-2.5\", // Layout\n \"h-6 pl-2 pr-[3px]\", // Dimensions\n \"rounded-sm ring-1 ring-kumo-hairline\", // Border\n \"bg-kumo-overlay\", // Background\n \"text-sm\", // Typography\n )}\n >\n {props.children}\n <ComboboxBase.ChipRemove\n aria-label={removeLabel}\n className={cn(\n \"cursor-pointer rounded-md p-1 hover:bg-kumo-fill-hover\",\n \"bg-transparent flex\",\n )}\n >\n <XIcon size={10} />\n </ComboboxBase.ChipRemove>\n </ComboboxBase.Chip>\n );\n}\n\n// Map size to min-height class for TriggerMultipleWithInput\nconst sizeToMinHeight: Record<KumoComboboxSize, string> = {\n xs: \"min-h-5\",\n sm: \"min-h-6.5\",\n base: \"min-h-9\",\n lg: \"min-h-10\",\n};\n\nfunction TriggerMultipleWithInput<ValueType>({\n placeholder,\n renderItem,\n className,\n inputSide = \"right\",\n value: controlledValue,\n}: {\n placeholder?: string;\n renderItem: (value: ValueType) => React.ReactNode;\n className?: string;\n inputSide?: \"right\" | \"top\";\n /** Optional controlled value for rendering chips (use when pre-selecting values) */\n value?: ValueType[];\n}) {\n const size = useContext(ComboboxSizeContext);\n // Determine which value to use for rendering chips\n const chipsToRender = controlledValue;\n\n return (\n <ComboboxBase.Chips\n className={cn(\n inputVariants({ size }),\n \"flex flex-col\",\n \"gap-1 py-1 px-1.5\",\n sizeToMinHeight[size],\n \"h-auto\",\n \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n className,\n )}\n >\n {inputSide === \"top\" && (\n <ComboboxBase.Input\n placeholder={placeholder}\n className=\"w-full px-2 py-1 border-0 bg-inherit\"\n />\n )}\n {/* Chips container */}\n <div className=\"flex items-center flex-wrap gap-1.5 flex-1\">\n {/* Render chips from controlled value if provided */}\n {chipsToRender !== undefined &&\n chipsToRender.length > 0 &&\n chipsToRender.map((item) => renderItem(item))}\n {/* Also render from BaseUI's internal value for user selections */}\n <ComboboxBase.Value>\n {(internalValue: ValueType[]) => {\n // Skip rendering if using controlled value (to avoid duplicates)\n if (chipsToRender !== undefined) return null;\n return (\n <Fragment>\n {internalValue.map((item) => renderItem(item))}\n </Fragment>\n );\n }}\n </ComboboxBase.Value>\n {inputSide === \"right\" && (\n <ComboboxBase.Input\n placeholder={placeholder}\n className=\"min-w-[100px] flex-1 px-2 py-1 border-0 bg-inherit\"\n />\n )}\n </div>\n </ComboboxBase.Chips>\n );\n}\n\nRoot.displayName = \"Combobox.Root\";\nContent.displayName = \"Combobox.Content\";\nTriggerValue.displayName = \"Combobox.TriggerValue\";\nTriggerInput.displayName = \"Combobox.TriggerInput\";\nItem.displayName = \"Combobox.Item\";\nChip.displayName = \"Combobox.Chip\";\nTriggerMultipleWithInput.displayName = \"Combobox.TriggerMultipleWithInput\";\n\n/**\n * Combobox — autocomplete input with filterable dropdown list.\n *\n * Compound component: `Combobox` (Root), `.TriggerInput`, `.TriggerValue`,\n * `.TriggerMultipleWithInput`, `.Content`, `.Item`, `.Chip`, `.Input`,\n * `.Empty`, `.GroupLabel`, `.Group`, `.List`, `.Collection`.\n *\n * @example\n * ```tsx\n * <Combobox items={fruits} label=\"Fruit\">\n * <Combobox.TriggerInput placeholder=\"Pick a fruit…\" />\n * <Combobox.Content>\n * <Combobox.List>\n * {(item) => <Combobox.Item value={item}>{item}</Combobox.Item>}\n * </Combobox.List>\n * </Combobox.Content>\n * </Combobox>\n * ```\n *\n * @see https://base-ui.com/react/components/combobox\n */\nexport const Combobox = Object.assign(Root, {\n // Helper components\n Content,\n TriggerValue,\n TriggerInput,\n TriggerMultipleWithInput,\n\n // Slightly modified BaseUI\n Chip,\n Item,\n\n // Styled BaseUI\n Input,\n Empty,\n GroupLabel,\n Group,\n\n // Styled BaseUI\n List,\n\n // BaseUI\n Collection: ComboboxBase.Collection,\n});\n"],"names":["KUMO_INPUT_VARIANTS","ComboboxSizeContext","createContext","Root","label","required","labelTooltip","description","error","children","size","props","comboboxControl","jsx","ComboboxBase.Root","Field","Content","className","align","sideOffset","alignOffset","side","containerProp","contextContainer","usePortalContainer","ComboboxBase.Portal","ComboboxBase.Positioner","ComboboxBase.Popup","cn","triggerValueIconStyles","TriggerValue","useContext","iconStyles","jsxs","ComboboxBase.Trigger","inputVariants","ComboboxBase.Value","ComboboxBase.Icon","CaretDownIcon","triggerInputIconStyles","TriggerInput","clearLabel","showOptionsLabel","ComboboxBase.Input","ComboboxBase.Clear","XIcon","Item","ComboboxBase.Item","ComboboxBase.ItemIndicator","CheckIcon","Empty","ComboboxBase.Empty","Input","List","ComboboxBase.List","GroupLabel","ComboboxBase.GroupLabel","Group","ComboboxBase.Group","Chip","removeLabel","ComboboxBase.Chip","ComboboxBase.ChipRemove","sizeToMinHeight","TriggerMultipleWithInput","placeholder","renderItem","inputSide","controlledValue","chipsToRender","ComboboxBase.Chips","item","internalValue","Fragment","Combobox","ComboboxBase.Collection"],"mappings":"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"}

package/dist/chunks/dialog-k3f1fbam6nt96k8x.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"dialog-k3f1fbam6nt96k8x.js","sources":["../../src/components/dialog/dialog.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { AlertDialog as AlertDialogBase } from \"@base-ui/react/alert-dialog\";\nimport { LayerCard } from \"../layer-card\";\nimport { cn } from \"../../utils/cn\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\n\n/** Dialog size variant definitions mapping sizes to their minimum widths. */\nexport const KUMO_DIALOG_VARIANTS = {\n size: {\n base: {\n classes: \"sm:min-w-96\",\n description: \"Default dialog width\",\n },\n sm: {\n classes: \"min-w-72\",\n description: \"Small dialog for simple confirmations\",\n },\n lg: {\n classes: \"min-w-[32rem]\",\n description: \"Large dialog for complex content\",\n },\n xl: {\n classes: \"min-w-[48rem]\",\n description: \"Extra large dialog for detailed views\",\n },\n },\n role: {\n dialog: {\n classes: \"\",\n description: \"Standard dialog for general-purpose modals\",\n },\n alertdialog: {\n classes: \"\",\n description:\n \"Alert dialog for confirmation flows requiring explicit user acknowledgment\",\n },\n },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n size: \"base\",\n role: \"dialog\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n dimensions: {\n sm: {\n width: 350,\n titleSize: 20,\n descSize: 16,\n padding: 16,\n gap: 8,\n buttonSize: \"sm\",\n },\n base: {\n width: 384,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n lg: {\n width: 512,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n xl: {\n width: 768,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n },\n baseTokens: {\n background: \"color-surface\",\n text: \"text-color-surface\",\n borderRadius: 12,\n shadow: \"shadow-m\",\n },\n backdrop: {\n background: \"color-surface-secondary\",\n opacity: 0.8,\n },\n header: {\n title: { fontWeight: 600, color: \"text-color-surface\" },\n closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n },\n description: {\n fontWeight: 400,\n color: \"text-color-muted\",\n },\n buttons: {\n primary: { background: \"color-primary\", text: \"white\" },\n secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\nexport type KumoDialogRole = keyof typeof KUMO_DIALOG_VARIANTS.role;\n\nexport interface KumoDialogVariantsProps {\n /**\n * Dialog width.\n * - `\"sm\"` — Small (min 288px) for simple confirmations\n * - `\"base\"` — Default (min 384px)\n * - `\"lg\"` — Large (min 512px) for complex content\n * - `\"xl\"` — Extra large (min 768px) for detailed views\n * @default \"base\"\n */\n size?: KumoDialogSize;\n}\n\n// ============================================================================\n// Dialog Role Context\n// ============================================================================\n\nconst DialogRoleContext = createContext<KumoDialogRole>(\"dialog\");\n\nfunction useDialogRole() {\n return useContext(DialogRoleContext);\n}\n\nexport function dialogVariants({\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-m ring ring-kumo-line fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n // Apply size from KUMO_DIALOG_VARIANTS\n KUMO_DIALOG_VARIANTS.size[size].classes,\n );\n}\n\n/**\n * Dialog component props — the modal content panel.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Open</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Confirm Action</Dialog.Title>\n * <Dialog.Description>Are you sure?</Dialog.Description>\n * <Dialog.Close render={(p) => <Button {...p}>Cancel</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nexport type DialogProps = KumoDialogVariantsProps & {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Dialog content (typically Title, Description, Close, and action buttons). */\n children: ReactNode;\n /** Inline styles. */\n style?: CSSProperties;\n /**\n * Container element for the portal. Use this to render the dialog 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\n/**\n * Modal dialog overlay with backdrop. Compound component with `Dialog.Root`,\n * `Dialog.Trigger`, `Dialog.Title`, `Dialog.Description`, and `Dialog.Close`.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Delete</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Item</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n *\n * @example Alert Dialog for destructive actions\n * ```tsx\n * <Dialog.Root role=\"alertdialog\">\n * <Dialog.Trigger render={(p) => <Button variant=\"destructive\" {...p}>Delete Project</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Project?</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"secondary\" {...p}>Cancel</Button>} />\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nfunction DialogContent({\n className,\n children,\n style,\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n container: containerProp,\n}: DialogProps) {\n const role = useDialogRole();\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n const BasePortal =\n role === \"alertdialog\" ? AlertDialogBase.Portal : DialogBase.Portal;\n const BaseBackdrop =\n role === \"alertdialog\" ? AlertDialogBase.Backdrop : DialogBase.Backdrop;\n const BasePopup =\n role === \"alertdialog\" ? AlertDialogBase.Popup : DialogBase.Popup;\n\n return (\n <BasePortal container={container}>\n <BaseBackdrop className=\"fixed inset-0 bg-kumo-recessed opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n <LayerCard\n render={<BasePopup />}\n className={cn(dialogVariants({ size }), className)}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n \"--tw-shadow\":\n \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n ...style,\n } as CSSProperties\n }\n >\n {children}\n </LayerCard>\n </BasePortal>\n );\n}\n\n// ============================================================================\n// Dialog Root\n// ============================================================================\n\ntype BaseDialogRootProps = ComponentPropsWithoutRef<typeof DialogBase.Root>;\n\nexport type DialogRootProps = BaseDialogRootProps & {\n /**\n * The ARIA role for the dialog.\n * - `\"dialog\"` — Standard dialog for general-purpose modals. Dismissible via outside click by default.\n * - `\"alertdialog\"` — Alert dialog for destructive or confirmation flows. Not dismissible via outside click.\n *\n * Use `role=\"alertdialog\"` for:\n * - Destructive actions (delete, discard, remove)\n * - Confirmation dialogs requiring explicit user acknowledgment\n * - Actions that cannot be undone\n *\n * @default \"dialog\"\n */\n role?: KumoDialogRole;\n};\n\nfunction DialogRoot({\n children,\n role = KUMO_DIALOG_DEFAULT_VARIANTS.role,\n ...props\n}: DialogRootProps) {\n const BaseRoot =\n role === \"alertdialog\" ? AlertDialogBase.Root : DialogBase.Root;\n return (\n <DialogRoleContext.Provider value={role}>\n <BaseRoot {...props}>{children}</BaseRoot>\n </DialogRoleContext.Provider>\n );\n}\n\nDialogRoot.displayName = \"Dialog.Root\";\n\n// ============================================================================\n// Dialog Trigger\n// ============================================================================\n\ntype BaseDialogTriggerProps = ComponentPropsWithoutRef<\n typeof DialogBase.Trigger\n>;\n\nexport type DialogTriggerProps = BaseDialogTriggerProps;\n\nfunction DialogTrigger({ children, ...props }: DialogTriggerProps) {\n const role = useDialogRole();\n const BaseTrigger =\n role === \"alertdialog\" ? AlertDialogBase.Trigger : DialogBase.Trigger;\n return <BaseTrigger {...props}>{children}</BaseTrigger>;\n}\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\n// ============================================================================\n// Dialog Title\n// ============================================================================\n\ntype BaseDialogTitleProps = ComponentPropsWithoutRef<typeof DialogBase.Title>;\n\nexport type DialogTitleProps = BaseDialogTitleProps;\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n const role = useDialogRole();\n const BaseTitle =\n role === \"alertdialog\" ? AlertDialogBase.Title : DialogBase.Title;\n return <BaseTitle className={className} {...props} />;\n}\n\nDialogTitle.displayName = \"Dialog.Title\";\n\n// ============================================================================\n// Dialog Description\n// ============================================================================\n\ntype BaseDialogDescriptionProps = ComponentPropsWithoutRef<\n typeof DialogBase.Description\n>;\n\nexport type DialogDescriptionProps = BaseDialogDescriptionProps;\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n const role = useDialogRole();\n const BaseDescription =\n role === \"alertdialog\"\n ? AlertDialogBase.Description\n : DialogBase.Description;\n return <BaseDescription className={className} {...props} />;\n}\n\nDialogDescription.displayName = \"Dialog.Description\";\n\n// ============================================================================\n// Dialog Close\n// ============================================================================\n\ntype BaseDialogCloseProps = ComponentPropsWithoutRef<typeof DialogBase.Close>;\n\nexport type DialogCloseProps = BaseDialogCloseProps;\n\nfunction DialogClose({ children, ...props }: DialogCloseProps) {\n const role = useDialogRole();\n const BaseClose =\n role === \"alertdialog\" ? AlertDialogBase.Close : DialogBase.Close;\n return <BaseClose {...props}>{children}</BaseClose>;\n}\n\nDialogClose.displayName = \"Dialog.Close\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nconst Dialog = Object.assign(DialogContent, {\n Root: DialogRoot,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n});\n\nexport {\n Dialog,\n DialogRoot,\n DialogTrigger,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","DialogRoleContext","createContext","useDialogRole","useContext","dialogVariants","size","cn","DialogContent","className","children","style","containerProp","role","contextContainer","usePortalContainer","jsxs","AlertDialogBase.Portal","DialogBase.Portal","jsx","AlertDialogBase.Backdrop","DialogBase.Backdrop","LayerCard","AlertDialogBase.Popup","DialogBase.Popup","DialogRoot","props","BaseRoot","AlertDialogBase.Root","DialogBase.Root","DialogTrigger","BaseTrigger","AlertDialogBase.Trigger","DialogBase.Trigger","DialogTitle","BaseTitle","AlertDialogBase.Title","DialogBase.Title","DialogDescription","BaseDescription","AlertDialogBase.Description","DialogBase.Description","DialogClose","BaseClose","AlertDialogBase.Close","DialogBase.Close","Dialog"],"mappings":"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"}

package/dist/chunks/dropdown-zbax0zowy6m9zhmt.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"dropdown-zbax0zowy6m9zhmt.js","sources":["../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { Menu as DropdownMenuPrimitive } from \"@base-ui/react/menu\";\nimport * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport {\n usePortalContainer,\n type PortalContainer,\n} from \"../../utils/portal-provider\";\nimport {\n CaretRightIcon as CaretRight,\n CheckIcon,\n CheckIcon as Check,\n type Icon,\n} from \"@phosphor-icons/react\";\n\n/** Dropdown item variant definitions (default and danger styles). */\nexport const KUMO_DROPDOWN_VARIANTS = {\n variant: {\n default: {\n classes: \"\",\n description: \"Default dropdown item appearance\",\n },\n danger: {\n classes:\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n description: \"Destructive action item\",\n },\n },\n} as const;\n\nexport const KUMO_DROPDOWN_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_DROPDOWN_VARIANTS\nexport type KumoDropdownVariant = keyof typeof KUMO_DROPDOWN_VARIANTS.variant;\n\nexport interface KumoDropdownVariantsProps {\n /**\n * Visual style of the dropdown item.\n * - `\"default\"` — Standard item appearance\n * - `\"danger\"` — Destructive action with red text\n * @default \"default\"\n */\n variant?: KumoDropdownVariant;\n}\n\nexport function dropdownVariants({\n variant = KUMO_DROPDOWN_DEFAULT_VARIANTS.variant,\n}: KumoDropdownVariantsProps = {}) {\n return cn(KUMO_DROPDOWN_VARIANTS.variant[variant].classes);\n}\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubmenuTrigger\n > & {\n inset?: boolean;\n icon?: Icon;\n }\n>(({ className, inset, children, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n \"flex cursor-default items-center rounded-sm text-base outline-hidden select-none\", // base styles\n \"px-2 py-1.5\", // spacing\n \"focus:bg-kumo-tint focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\", // focus state\n \"data-[state=open]:bg-kumo-tint\", // open state\n inset && \"pl-8\", // conditional inset\n className,\n )}\n {...props}\n >\n {IconComponent && <IconComponent className=\"mr-2 h-4 w-4\" />}\n {children}\n <CaretRight className=\"ml-auto h-4 w-4\" />\n </DropdownMenuPrimitive.SubmenuTrigger>\n));\n\nDropdownMenuSubTrigger.displayName =\n DropdownMenuPrimitive.SubmenuTrigger.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Positioner> & {\n /**\n * Container element for the portal. Use this to render the dropdown 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>(\n (\n { className, sideOffset = 8, children, container: containerProp, ...props },\n ref,\n ) => {\n const contextContainer = usePortalContainer();\n const container = containerProp ?? contextContainer ?? undefined;\n\n return (\n <DropdownMenuPrimitive.Portal container={container}>\n <DropdownMenuPrimitive.Positioner\n ref={ref}\n sideOffset={sideOffset}\n {...props}\n >\n <DropdownMenuPrimitive.Popup\n className={cn(\n \"overflow-hidden bg-kumo-control text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n \"min-w-36 p-1.5\", // spacing\n \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\", // open animation\n \"data-[side=bottom]:slide-in-from-top-2\", // bottom side animation\n \"data-[side=left]:slide-in-from-right-2\", // left side animation\n \"data-[side=right]:slide-in-from-left-2\", // right side animation\n \"data-[side=top]:slide-in-from-bottom-2\", // top side animation\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\", // close animation\n className,\n )}\n >\n {children}\n </DropdownMenuPrimitive.Popup>\n </DropdownMenuPrimitive.Positioner>\n </DropdownMenuPrimitive.Portal>\n );\n },\n);\n\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n if (!IconComponent) return null;\n if (React.isValidElement(IconComponent)) return IconComponent;\n const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n return <Comp className=\"mr-2 h-4 w-4\" />;\n};\n\n/**\n * DropdownMenuItem — a single actionable item within a dropdown menu.\n *\n * For navigation links, use `DropdownMenu.LinkItem` instead.\n *\n * @example\n * ```tsx\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * ```\n */\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n selected?: boolean;\n /**\n * @deprecated Use `DropdownMenu.LinkItem` instead for navigation links.\n * This prop will be removed in a future major version.\n */\n href?: string;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n selected,\n render,\n href,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n const LinkComponent = useLinkComponent();\n\n // Build the inner content with icon, children, and selected indicator\n const innerContent = React.useMemo(\n () => (\n <>\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n {selected && (\n <span className=\"inline-flex\">\n <Check />\n </span>\n )}\n </>\n ),\n [IconComponent, children, selected],\n );\n\n // Legacy href support (deprecated)\n const linkContent = React.useMemo(() => {\n if (!href) return undefined;\n\n // Matches http://, https://, or protocol-relative //\n const isExternal = /^(https?:)?\\/\\//.test(href);\n const styles = cn(\n \"flex items-center\",\n variant === \"danger\" &&\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n );\n if (isExternal) {\n return (\n <a\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n target=\"_blank\"\n rel=\"noreferrer\"\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </a>\n );\n }\n return (\n <LinkComponent\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n to={href}\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </LinkComponent>\n );\n }, [href, innerContent, variant, LinkComponent]);\n\n // When href is provided, use linkContent as render prop\n // When render prop is provided, caller controls children rendering\n const useRenderProp = href || render;\n\n return (\n <DropdownMenuPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n render={href ? linkContent : render}\n {...props}\n >\n {useRenderProp ? undefined : innerContent}\n </DropdownMenuPrimitive.Item>\n );\n },\n);\n\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\n/**\n * DropdownMenuLinkItem — a menu item that navigates to a URL.\n *\n * Use this instead of `DropdownMenu.Item` with `href` for navigation links.\n * Provides full control over link attributes like `target` and `rel`.\n *\n * @example\n * ```tsx\n * // External link\n * <DropdownMenu.LinkItem href=\"https://example.com\" target=\"_blank\">\n * Documentation\n * </DropdownMenu.LinkItem>\n *\n * // Internal link\n * <DropdownMenu.LinkItem href=\"/settings\">\n * Settings\n * </DropdownMenu.LinkItem>\n *\n * // With icon\n * <DropdownMenu.LinkItem href=\"/profile\" icon={UserIcon}>\n * Profile\n * </DropdownMenu.LinkItem>\n * ```\n */\nconst DropdownMenuLinkItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.LinkItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.LinkItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n return (\n <DropdownMenuPrimitive.LinkItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n \"text-inherit no-underline\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.LinkItem>\n );\n },\n);\n\nDropdownMenuLinkItem.displayName = \"DropdownMenuLinkItem\";\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-base outline-hidden transition-colors select-none focus:bg-kumo-tint focus:text-kumo-default focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand data-disabled:pointer-events-none data-disabled:opacity-50\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <DropdownMenuPrimitive.CheckboxItemIndicator className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit\">\n <CheckIcon weight=\"bold\" size={12} />\n </DropdownMenuPrimitive.CheckboxItemIndicator>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.GroupLabel> & {\n inset?: boolean;\n }\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.GroupLabel\n ref={ref}\n className={cn(\n \"px-2 py-1.5 text-base font-semibold\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n />\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.GroupLabel.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"-mx-1 my-1 h-px bg-kumo-hairline\", className)}\n {...props}\n />\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n {...props}\n />\n );\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nconst DropdownMenuRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n }\n>(({ className, children, inset, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuRadioItemIndicator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItemIndicator\n >\n>(({ className, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItemIndicator\n ref={ref}\n className={cn(\"ml-auto\", className)}\n {...props}\n >\n {children ?? <Check className=\"h-4 w-4\" />}\n </DropdownMenuPrimitive.RadioItemIndicator>\n));\nDropdownMenuRadioItemIndicator.displayName = \"DropdownMenuRadioItemIndicator\";\n\n/**\n * Custom Trigger that converts a single child element to the `render` prop\n * to avoid nested button issues with base-ui's Menu.Trigger.\n *\n * When an explicit `render` prop is provided, children are passed through\n * to the rendered element.\n */\nconst DropdownMenuTrigger = React.forwardRef<\n HTMLButtonElement,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>(({ children, render, ...props }, ref) => {\n // If render prop is explicitly provided, use it and pass children through\n if (render) {\n return (\n <DropdownMenuPrimitive.Trigger ref={ref} {...props} render={render}>\n {children}\n </DropdownMenuPrimitive.Trigger>\n );\n }\n\n // Otherwise, auto-promote single child element to render prop\n const childElement = React.isValidElement(children) ? children : null;\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n {...props}\n {...(childElement && {\n render: childElement as React.ReactElement<Record<string, unknown>>,\n })}\n >\n {childElement ? undefined : children}\n </DropdownMenuPrimitive.Trigger>\n );\n});\nDropdownMenuTrigger.displayName = \"DropdownMenuTrigger\";\n\n/**\n * DropdownMenu — accessible dropdown menu anchored to a trigger.\n *\n * Compound component: `DropdownMenu` (Root), `.Trigger`, `.Content`, `.Item`,\n * `.LinkItem`, `.CheckboxItem`, `.RadioGroup`, `.RadioItem`, `.RadioItemIndicator`,\n * `.Sub`, `.SubTrigger`, `.SubContent`, `.Label`, `.Separator`, `.Shortcut`, `.Group`.\n *\n * Built on `@base-ui/react/menu`.\n *\n * @example\n * ```tsx\n * <DropdownMenu>\n * <DropdownMenu.Trigger>\n * <Button>Actions</Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.LinkItem href=\"/settings\" icon={GearIcon}>Settings</DropdownMenu.LinkItem>\n * <DropdownMenu.Separator />\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu>\n * ```\n *\n * @see https://base-ui.com/react/components/menu\n */\nexport const DropdownMenu = Object.assign(DropdownMenuPrimitive.Root, {\n Trigger: DropdownMenuTrigger,\n Portal: DropdownMenuPrimitive.Portal,\n Sub: DropdownMenuPrimitive.SubmenuRoot,\n SubTrigger: DropdownMenuSubTrigger,\n SubContent: DropdownMenuContent,\n Content: DropdownMenuContent,\n Item: DropdownMenuItem,\n LinkItem: DropdownMenuLinkItem,\n CheckboxItem: DropdownMenuCheckboxItem,\n RadioGroup: DropdownMenuPrimitive.RadioGroup,\n RadioItem: DropdownMenuRadioItem,\n RadioItemIndicator: DropdownMenuRadioItemIndicator,\n Label: DropdownMenuLabel,\n Separator: DropdownMenuSeparator,\n Shortcut: DropdownMenuShortcut,\n Group: DropdownMenuPrimitive.Group,\n});\n"],"names":["KUMO_DROPDOWN_VARIANTS","KUMO_DROPDOWN_DEFAULT_VARIANTS","dropdownVariants","variant","cn","DropdownMenuSubTrigger","React","className","inset","children","IconComponent","props","ref","jsxs","DropdownMenuPrimitive.SubmenuTrigger","jsx","CaretRight","DropdownMenuContent","sideOffset","containerProp","contextContainer","usePortalContainer","DropdownMenuPrimitive.Portal","DropdownMenuPrimitive.Positioner","DropdownMenuPrimitive.Popup","renderIconNode","DropdownMenuItem","selected","render","href","LinkComponent","useLinkComponent","innerContent","Fragment","Check","linkContent","isExternal","styles","e","useRenderProp","DropdownMenuPrimitive.Item","DropdownMenuLinkItem","DropdownMenuPrimitive.LinkItem","DropdownMenuCheckboxItem","checked","DropdownMenuPrimitive.CheckboxItem","DropdownMenuPrimitive.CheckboxItemIndicator","CheckIcon","DropdownMenuLabel","DropdownMenuPrimitive.GroupLabel","DropdownMenuSeparator","DropdownMenuPrimitive.Separator","DropdownMenuShortcut","DropdownMenuRadioItem","DropdownMenuPrimitive.RadioItem","DropdownMenuRadioItemIndicator","DropdownMenuPrimitive.RadioItemIndicator","DropdownMenuTrigger","DropdownMenuPrimitive.Trigger","childElement","DropdownMenu","DropdownMenuPrimitive.Root","DropdownMenuPrimitive.SubmenuRoot","DropdownMenuPrimitive.RadioGroup","DropdownMenuPrimitive.Group"],"mappings":"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"}

package/dist/chunks/empty-b82oer7npkhtkx7k.js.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/chunks/grid-hj1ylz16p7g5uelh.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"grid-hj1ylz16p7g5uelh.js","sources":["../../src/components/grid/grid.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Grid variant and gap definitions mapping layout names to their responsive Tailwind classes. */\nexport const KUMO_GRID_VARIANTS = {\n variant: {\n \"2up\": {\n classes: \"grid-cols-1 md:grid-cols-2\",\n description:\n \"Grid items stack on small screens, display side-by-side on medium screens and up\",\n },\n \"side-by-side\": {\n classes: \"grid-cols-2\",\n description: \"Grid items always displayed side-by-side\",\n },\n \"2-1\": {\n classes: \"grid-cols-1 md:grid-cols-[2fr_1fr]\",\n description:\n \"Two-thirds / one-third split (66%/33%) on medium screens and up\",\n },\n \"1-2\": {\n classes: \"grid-cols-1 md:grid-cols-[1fr_2fr]\",\n description:\n \"One-third / two-thirds split (33%/66%) on medium screens and up\",\n },\n \"1-3up\": {\n classes: \"grid-cols-1 lg:grid-cols-3\",\n description:\n \"Grid items stack on small screens, expand to 3 across on large screens\",\n },\n \"3up\": {\n classes: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-3\",\n description:\n \"Grid items stack on small screens, 2 across on medium, 3 across on large\",\n },\n \"4up\": {\n classes: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\",\n description:\n \"Grid items stack on small screens, progressively increase columns at larger breakpoints\",\n },\n \"6up\": {\n classes: \"grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-6\",\n description: \"Grid items start at 2 across, expand to 6 across on XL\",\n },\n \"1-2-4up\": {\n classes: \"grid-cols-1 md:grid-cols-2 lg:grid-cols-4\",\n description:\n \"Grid items stack on small screens, 2 across on medium, 4 across on large\",\n },\n },\n gap: {\n none: {\n classes: \"gap-0\",\n description: \"No gap between grid items\",\n },\n sm: {\n classes: \"gap-3\",\n description: \"Small gap between grid items\",\n },\n base: {\n classes: \"gap-2 md:gap-6 lg:gap-8\",\n description: \"Default responsive gap between grid items\",\n },\n lg: {\n classes: \"gap-8\",\n description: \"Large gap between grid items\",\n },\n },\n} as const;\n\nexport const KUMO_GRID_DEFAULT_VARIANTS = {\n gap: \"base\",\n} as const;\n\nexport type KumoGridVariant = keyof typeof KUMO_GRID_VARIANTS.variant;\nexport type KumoGridGap = keyof typeof KUMO_GRID_VARIANTS.gap;\n\n/**\n * Grid component props.\n *\n * @example\n * ```tsx\n * <Grid variant=\"3up\" gap=\"sm\">\n * <GridItem><Surface className=\"p-4\">1</Surface></GridItem>\n * <GridItem><Surface className=\"p-4\">2</Surface></GridItem>\n * <GridItem><Surface className=\"p-4\">3</Surface></GridItem>\n * </Grid>\n * ```\n */\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Grid items to render. */\n children?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Show dividers between grid items on mobile (only works with `\"4up\"` variant). */\n mobileDivider?: boolean;\n /**\n * Gap size between grid items.\n * - `\"none\"` — No gap\n * - `\"sm\"` — 12px gap\n * - `\"base\"` — Responsive gap (8px → 24px → 32px)\n * - `\"lg\"` — 32px gap\n * @default \"base\"\n */\n gap?: KumoGridGap;\n /**\n * Responsive column layout variant.\n * - `\"2up\"` — 1 col → 2 cols at md\n * - `\"side-by-side\"` — Always 2 cols\n * - `\"2-1\"` — 66%/33% split at md\n * - `\"1-2\"` — 33%/66% split at md\n * - `\"3up\"` — 1 → 2 → 3 cols\n * - `\"4up\"` — 1 → 2 → 3 → 4 cols\n * - `\"6up\"` — 2 → 3 → 4 → 6 cols\n * - `\"1-2-4up\"` — 1 → 2 → 4 cols\n */\n variant?: KumoGridVariant;\n}\n\n/** GridItem component props — a single cell within a Grid. */\nexport interface GridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Content for this grid cell. */\n children?: React.ReactNode;\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n}\n\ninterface GridContextValue {\n variant?: KumoGridVariant;\n gap: KumoGridGap;\n mobileDivider?: boolean;\n}\n\nconst GridContext = React.createContext<GridContextValue>({\n gap: \"base\",\n});\n\nexport function gridVariants({\n variant,\n gap = KUMO_GRID_DEFAULT_VARIANTS.gap,\n}: {\n variant?: KumoGridVariant;\n gap?: KumoGridGap;\n} = {}) {\n return cn(\n \"grid\",\n variant && KUMO_GRID_VARIANTS.variant[variant].classes,\n KUMO_GRID_VARIANTS.gap[gap].classes,\n );\n}\n\nexport function gridItemVariants({\n variant,\n mobileDivider,\n}: {\n variant?: KumoGridVariant;\n mobileDivider?: boolean;\n} = {}) {\n return cn(\n mobileDivider &&\n variant === \"4up\" &&\n \"border-b border-kumo-hairline pb-8 md:border-b-0 md:pb-0\",\n );\n}\n\n/**\n * Responsive CSS grid layout container with preset column configurations.\n *\n * @example\n * ```tsx\n * <Grid variant=\"2up\" gap=\"base\">\n * <GridItem>Left</GridItem>\n * <GridItem>Right</GridItem>\n * </Grid>\n * ```\n */\nexport const Grid = React.forwardRef<HTMLDivElement, GridProps>(\n (\n {\n children,\n className,\n mobileDivider,\n gap = KUMO_GRID_DEFAULT_VARIANTS.gap,\n variant,\n ...props\n },\n ref,\n ) => {\n return (\n <GridContext.Provider value={{ variant, gap, mobileDivider }}>\n <div\n ref={ref}\n className={cn(gridVariants({ variant, gap }), className)}\n {...props}\n >\n {children}\n </div>\n </GridContext.Provider>\n );\n },\n);\n\nGrid.displayName = \"Grid\";\n\nexport const GridItem = React.forwardRef<HTMLDivElement, GridItemProps>(\n ({ children, className, ...props }, ref) => {\n const { variant, mobileDivider } = React.useContext(GridContext);\n\n return (\n <div\n ref={ref}\n className={cn(gridItemVariants({ variant, mobileDivider }), className)}\n {...props}\n >\n {children}\n </div>\n );\n },\n);\n\nGridItem.displayName = \"GridItem\";\n"],"names":["KUMO_GRID_VARIANTS","KUMO_GRID_DEFAULT_VARIANTS","GridContext","React","gridVariants","variant","gap","cn","gridItemVariants","mobileDivider","Grid","children","className","props","ref","jsx","GridItem"],"mappings":";;;;AAIO,MAAMA,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,IAEJ,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aACE;AAAA,IAAA;AAAA,EACJ;AAAA,EAEF,KAAK;AAAA,IACH,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,KAAK;AACP,GA6DMC,IAAcC,EAAM,cAAgC;AAAA,EACxD,KAAK;AACP,CAAC;AAEM,SAASC,EAAa;AAAA,EAC3B,SAAAC;AAAA,EACA,KAAAC,IAAML,EAA2B;AACnC,IAGI,IAAI;AACN,SAAOM;AAAA,IACL;AAAA,IACAF,KAAWL,EAAmB,QAAQK,CAAO,EAAE;AAAA,IAC/CL,EAAmB,IAAIM,CAAG,EAAE;AAAA,EAAA;AAEhC;AAEO,SAASE,EAAiB;AAAA,EAC/B,SAAAH;AAAA,EACA,eAAAI;AACF,IAGI,IAAI;AACN,SAAOF;AAAA,IACLE,KACEJ,MAAY,SACZ;AAAA,EAAA;AAEN;AAaO,MAAMK,IAAOP,EAAM;AAAA,EACxB,CACE;AAAA,IACE,UAAAQ;AAAA,IACA,WAAAC;AAAA,IACA,eAAAH;AAAA,IACA,KAAAH,IAAML,EAA2B;AAAA,IACjC,SAAAI;AAAA,IACA,GAAGQ;AAAA,EAAA,GAELC,MAGE,gBAAAC,EAACb,EAAY,UAAZ,EAAqB,OAAO,EAAE,SAAAG,GAAS,KAAAC,GAAK,eAAAG,KAC3C,UAAA,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWP,EAAGH,EAAa,EAAE,SAAAC,GAAS,KAAAC,EAAA,CAAK,GAAGM,CAAS;AAAA,MACtD,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA,GAEL;AAGN;AAEAD,EAAK,cAAc;AAEZ,MAAMM,IAAWb,EAAM;AAAA,EAC5B,CAAC,EAAE,UAAAQ,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAAQ;AAC1C,UAAM,EAAE,SAAAT,GAAS,eAAAI,EAAA,IAAkBN,EAAM,WAAWD,CAAW;AAE/D,WACE,gBAAAa;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAD;AAAA,QACA,WAAWP,EAAGC,EAAiB,EAAE,SAAAH,GAAS,eAAAI,EAAA,CAAe,GAAGG,CAAS;AAAA,QACpE,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEAK,EAAS,cAAc;"}

package/dist/chunks/input-ncfowphv81yq7fyy.js.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/chunks/link-kt74pxkud4olmcer.js.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/chunks/loader-hr2w7cpqeev3p3vl.js.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/chunks/pagination-jb3mncivbwsoi1se.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"pagination-jb3mncivbwsoi1se.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 { 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 KUMO_PAGINATION_VARIANTS.controls[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/radio-datzh3pilz8ojak1.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"radio-datzh3pilz8ojak1.js","sources":["../../src/components/radio/radio.tsx"],"sourcesContent":["import { forwardRef, createContext, useContext, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\n\n/** Radio variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_RADIO_VARIANTS = {\n variant: {\n default: {\n classes: \"ring-kumo-hairline\",\n description: \"Default radio appearance\",\n },\n error: {\n classes: \"ring-kumo-danger\",\n description: \"Error state for validation failures\",\n },\n },\n appearance: {\n default: {\n classes: \"\",\n description: \"Standard inline radio item\",\n },\n card: {\n classes:\n \"rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors hover:bg-kumo-tint has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n description:\n \"Choice card appearance with border, padding, and highlighted selection state\",\n },\n },\n} as const;\n\nexport const KUMO_RADIO_DEFAULT_VARIANTS = {\n variant: \"default\",\n appearance: \"default\",\n} as const;\n\n// Derived types from KUMO_RADIO_VARIANTS\nexport type KumoRadioVariant = keyof typeof KUMO_RADIO_VARIANTS.variant;\nexport type KumoRadioAppearance = keyof typeof KUMO_RADIO_VARIANTS.appearance;\n\nexport interface KumoRadioVariantsProps {\n /**\n * Visual variant.\n * - `\"default\"` — Standard radio appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoRadioVariant;\n /**\n * Visual appearance.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n}\n\nexport function radioVariants({\n variant = KUMO_RADIO_DEFAULT_VARIANTS.variant,\n appearance = KUMO_RADIO_DEFAULT_VARIANTS.appearance,\n}: KumoRadioVariantsProps = {}) {\n return cn(\n KUMO_RADIO_VARIANTS.variant[variant].classes,\n KUMO_RADIO_VARIANTS.appearance[appearance].classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type RadioVariant = KumoRadioVariant;\n\n/** Position of the radio control relative to its label */\nexport type RadioControlPosition = \"start\" | \"end\";\n\n// Context for passing controlPosition and appearance from Group to Items.\n// `controlPosition` may be undefined so each item can fall back to an\n// appearance-appropriate default (start for default, end for card).\nconst RadioGroupContext = createContext<{\n controlPosition: RadioControlPosition | undefined;\n appearance: KumoRadioAppearance;\n}>({\n controlPosition: undefined,\n appearance: \"default\",\n});\n\n/**\n * Radio group component props (with built-in Fieldset and RadioGroup)\n *\n * @example\n * // Basic usage\n * ```tsx\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Horizontal layout\n * ```tsx\n * <Radio.Group legend=\"Size\" orientation=\"horizontal\" defaultValue=\"md\">\n * <Radio.Item label=\"Small\" value=\"sm\" />\n * <Radio.Item label=\"Medium\" value=\"md\" />\n * <Radio.Item label=\"Large\" value=\"lg\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // With error and description\n * ```tsx\n * <Radio.Group\n * legend=\"Payment method\"\n * error=\"Please select a payment method\"\n * description=\"Choose how you'd like to pay\"\n * >\n * <Radio.Item label=\"Credit Card\" value=\"card\" />\n * <Radio.Item label=\"PayPal\" value=\"paypal\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Controlled\n * ```tsx\n * const [value, setValue] = useState(\"email\");\n * <Radio.Group legend=\"Contact\" value={value} onValueChange={setValue}>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"Phone\" value=\"phone\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Label before radio (controlPosition=\"end\")\n * ```tsx\n * <Radio.Group legend=\"Options\" controlPosition=\"end\" defaultValue=\"a\">\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * <Radio.Item label=\"Option B\" value=\"b\" />\n * </Radio.Group>\n * ```\n */\n/**\n * Props for Radio.Legend — a composable sub-component for labeling a Radio.Group.\n *\n * Place as a direct child of `<Radio.Group>` to provide a styled, accessible legend.\n * Accepts `className` for full styling control (e.g. `className=\"sr-only\"` to visually hide).\n *\n * @example\n * ```tsx\n * <Radio.Group>\n * <Radio.Legend className=\"sr-only\">Paths</Radio.Legend>\n * <Radio.Item label=\"Allow all paths\" value=\"all\" />\n * </Radio.Group>\n * ```\n */\nexport interface RadioLegendProps {\n /** Legend content */\n children: ReactNode;\n /** Additional CSS classes (e.g. \"sr-only\" to visually hide the legend) */\n className?: string;\n}\n\nexport interface RadioGroupProps {\n /**\n * Legend text for the group (required for accessibility).\n * For more control over legend styling, omit this prop and use `<Radio.Legend>` as a child instead.\n */\n legend?: string;\n /** Child Radio.Item components (and optionally a Radio.Legend) */\n children: ReactNode;\n /** Layout direction of the radio items */\n orientation?: \"vertical\" | \"horizontal\";\n /**\n * Visual appearance applied to all Radio.Item children.\n * - `\"default\"` — Standard inline radio items\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * Individual items can override this with their own `appearance` prop.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Error message for the group */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Value of the radio that should be initially selected (uncontrolled) */\n defaultValue?: string;\n /** Value of the radio that should be selected (controlled) */\n value?: string;\n /** Event handler called when radio value changes */\n onValueChange?: (value: string) => void;\n /** Whether all radios in the group are disabled */\n disabled?: boolean;\n /** Position of radio control relative to label: \"start\" puts radio before label, \"end\" puts label before radio. Defaults to \"start\" for default appearance and \"end\" for card appearance. */\n controlPosition?: RadioControlPosition;\n /** Form submission name for the radio group */\n name?: string;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual radio item within a group\n *\n * @example\n * ```tsx\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * ```\n *\n * @example\n * // Disabled item\n * ```tsx\n * <Radio.Item label=\"Unavailable\" value=\"unavailable\" disabled />\n * ```\n */\nexport type RadioItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: RadioVariant;\n /**\n * Visual appearance of the radio item.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * When set on an individual item, overrides the group-level `appearance`.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Label content displayed next to radio (required). Accepts strings or React nodes for rich content. */\n label: ReactNode;\n /** Description text displayed below the label (only visible in card appearance) */\n description?: ReactNode;\n /** Value of the radio (required) */\n value: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n /** Whether the radio is disabled */\n disabled?: boolean;\n};\n\n// Radio.Item for use within Radio.Group\nconst RadioItem = forwardRef<HTMLButtonElement, RadioItemProps>(\n (\n {\n className,\n disabled,\n variant = \"default\",\n appearance: appearanceProp,\n label,\n description,\n value,\n },\n ref,\n ) => {\n const { controlPosition, appearance: groupAppearance } =\n useContext(RadioGroupContext);\n const appearance = appearanceProp ?? groupAppearance;\n const isCard = appearance === \"card\";\n\n // Fall back to an appearance-appropriate default when controlPosition is\n // not provided: card defaults to \"end\" (radio on the right), default\n // appearance defaults to \"start\" (radio on the left).\n const effectiveControlPosition: RadioControlPosition =\n controlPosition ?? (isCard ? \"end\" : \"start\");\n\n if (isCard) {\n const controlAtStart = effectiveControlPosition === \"start\";\n return (\n <label\n className={cn(\n \"m-0 group relative flex items-start gap-3 rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n controlAtStart && \"flex-row-reverse\",\n variant === \"error\" &&\n \"border-kumo-danger has-[[data-checked]]:border-kumo-danger has-[[data-checked]]:bg-kumo-base\",\n disabled\n ? \"cursor-not-allowed opacity-50\"\n : cn(\n \"has-[[data-disabled]]:cursor-not-allowed has-[[data-disabled]]:opacity-50 cursor-pointer\",\n variant !== \"error\" &&\n \"hover:not-has-[[data-disabled]]:bg-kumo-tint\",\n ),\n className,\n )}\n >\n <div className=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n <span className=\"text-base font-medium text-kumo-default\">\n {label}\n </span>\n {description && (\n <span className=\"text-sm text-kumo-subtle\">{description}</span>\n )}\n </div>\n <BaseRadio.Root\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\n \"relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring ring-2 focus:outline-none focus:ring-kumo-focus focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"group-hover:ring-kumo-hairline focus-visible:outline-offset-3\",\n !disabled &&\n variant === \"error\" &&\n \"focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n </label>\n );\n }\n\n return (\n <label\n className={cn(\n \"m-0 group relative inline-flex items-center gap-2\",\n // \"start\" (default): radio before label\n // \"end\": label before radio using flex-row-reverse\n effectiveControlPosition === \"end\" && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseRadio.Root\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\n \"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\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"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\",\n !disabled &&\n variant === \"error\" &&\n \"focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n <span className=\"text-base text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nRadioItem.displayName = \"Radio.Item\";\n\n// Radio.Legend — composable legend sub-component for Radio.Group\nfunction RadioLegend({ children, className }: RadioLegendProps) {\n return (\n <Fieldset.Legend\n className={cn(\"text-base font-medium text-kumo-default\", className)}\n >\n {children}\n </Fieldset.Legend>\n );\n}\n\nRadioLegend.displayName = \"Radio.Legend\";\n\n// Radio.Group with built-in Fieldset and RadioGroup\nfunction RadioGroup({\n legend,\n children,\n orientation = \"vertical\",\n appearance = \"default\",\n error,\n description,\n defaultValue,\n value,\n onValueChange,\n disabled,\n controlPosition,\n name,\n className,\n}: RadioGroupProps) {\n return (\n <RadioGroupContext.Provider value={{ controlPosition, appearance }}>\n <BaseRadioGroup\n defaultValue={defaultValue}\n value={value}\n onValueChange={(newValue) => onValueChange?.(newValue)}\n disabled={disabled}\n name={name}\n >\n <Fieldset.Root\n disabled={disabled}\n className={cn(\"flex flex-col gap-4\", className)}\n >\n {legend && (\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n )}\n <div\n className={cn(\n orientation === \"vertical\"\n ? cn(\"flex flex-col\", appearance === \"card\" ? \"gap-3\" : \"gap-2\")\n : appearance === \"card\"\n ? \"grid grid-cols-2 gap-3\"\n : \"flex flex-row flex-wrap gap-2\",\n )}\n >\n {children}\n </div>\n {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n {description && (\n <p className=\"text-sm text-kumo-subtle\">{description}</p>\n )}\n </Fieldset.Root>\n </BaseRadioGroup>\n </RadioGroupContext.Provider>\n );\n}\n\nRadioGroup.displayName = \"Radio.Group\";\n\n// Export RadioGroup directly for external usage\nexport { RadioGroup };\n\n/**\n * Radio — radio button group for single-select choices.\n *\n * Compound component: `Radio.Group` (with built-in Fieldset), `Radio.Item`, and `Radio.Legend`.\n * Built on `@base-ui/react/radio-group` + `@base-ui/react/radio`.\n *\n * @example\n * ```tsx\n * // Simple: legend as a string prop\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n *\n * // Composable: Radio.Legend for full styling control (e.g. visually hidden)\n * <Radio.Group defaultValue=\"email\">\n * <Radio.Legend className=\"sr-only\">Notification preference</Radio.Legend>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * </Radio.Group>\n * ```\n */\nexport const Radio = Object.assign(RadioGroup, {\n Item: RadioItem,\n Group: RadioGroup,\n Legend: RadioLegend,\n});\n"],"names":["KUMO_RADIO_VARIANTS","KUMO_RADIO_DEFAULT_VARIANTS","radioVariants","variant","appearance","cn","RadioGroupContext","createContext","RadioItem","forwardRef","className","disabled","appearanceProp","label","description","value","ref","controlPosition","groupAppearance","useContext","isCard","effectiveControlPosition","jsxs","jsx","BaseRadio.Root","BaseRadio.Indicator","RadioLegend","children","Fieldset.Legend","RadioGroup","legend","orientation","error","defaultValue","onValueChange","name","BaseRadioGroup","newValue","Fieldset.Root","Radio"],"mappings":"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"}

package/dist/chunks/switch-jdfsr3j3oa1qxegw.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"switch-jdfsr3j3oa1qxegw.js","sources":["../../src/components/switch/switch.tsx"],"sourcesContent":["import { Switch as BaseSwitch } from \"@base-ui/react/switch\";\nimport {\n forwardRef,\n type ButtonHTMLAttributes,\n type Ref,\n type ReactNode,\n createContext,\n useContext,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Field } from \"../field/field\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\n\n/** Switch size and variant definitions mapping names to their Tailwind classes. */\nexport const KUMO_SWITCH_VARIANTS = {\n size: {\n sm: {\n classes: \"h-5.5 w-8.5\",\n description: \"Small switch for compact UIs\",\n },\n base: {\n classes: \"h-6.5 w-10.5\",\n description: \"Default switch size\",\n },\n lg: {\n classes: \"h-7.5 w-12.5\",\n description: \"Large switch for prominent toggles\",\n },\n },\n variant: {\n default: {\n classes: \"\",\n description: \"Default switch with squircle shape and brand blue color\",\n },\n neutral: {\n classes: \"\",\n description: \"Monochrome switch with squircle shape for subtle toggles\",\n },\n },\n} as const;\n\nexport const KUMO_SWITCH_DEFAULT_VARIANTS = {\n size: \"base\",\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_SWITCH_VARIANTS\nexport type KumoSwitchSize = keyof typeof KUMO_SWITCH_VARIANTS.size;\nexport type KumoSwitchVariant = keyof typeof KUMO_SWITCH_VARIANTS.variant;\n\nexport interface KumoSwitchVariantsProps {\n /**\n * Switch size.\n * - `\"sm\"` — Small for compact UIs\n * - `\"base\"` — Default size\n * - `\"lg\"` — Large for prominent toggles\n * @default \"base\"\n */\n size?: KumoSwitchSize;\n /**\n * Visual variant.\n * - `\"default\"` — Standard switch appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoSwitchVariant;\n}\n\nexport function switchVariants({\n size = KUMO_SWITCH_DEFAULT_VARIANTS.size,\n variant = KUMO_SWITCH_DEFAULT_VARIANTS.variant,\n}: KumoSwitchVariantsProps = {}) {\n // Fallback to defaults if invalid size/variant passed\n const sizeConfig =\n KUMO_SWITCH_VARIANTS.size[size] ?? KUMO_SWITCH_VARIANTS.size.base;\n const variantConfig =\n KUMO_SWITCH_VARIANTS.variant[variant] ??\n KUMO_SWITCH_VARIANTS.variant.default;\n return cn(sizeConfig.classes, variantConfig.classes);\n}\n\n// Legacy type aliases for backwards compatibility\nexport type SwitchSize = KumoSwitchSize;\nexport type SwitchVariant = KumoSwitchVariant;\n\n// Context for passing controlFirst from Group to Items\nconst SwitchGroupContext = createContext<{ controlFirst: boolean }>({\n controlFirst: true,\n});\n\n/**\n * Single switch component props (with built-in Field)\n *\n * Usage patterns:\n *\n * Basic usage:\n * ```tsx\n * <Switch label=\"Enable notifications\" checked={true} onCheckedChange={setChecked} />\n * ```\n *\n * Label first layout:\n * ```tsx\n * <Switch label=\"Dark mode\" checked={false} onCheckedChange={setChecked} controlFirst={false} />\n * ```\n *\n * Neutral variant (monochrome, squircle shape):\n * ```tsx\n * <Switch label=\"Setting\" variant=\"neutral\" checked={false} onCheckedChange={setChecked} />\n * ```\n *\n * @property {string} label - Label text for the switch (Field wrapper is built-in)\n * @property {boolean} [controlFirst] - When true (default), switch appears before label\n */\nexport type SwitchProps = Omit<\n ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\"\n> & {\n /** Visual variant: \"default\" (pill, brand color) or \"neutral\" (squircle, monochrome) */\n variant?: SwitchVariant;\n /** Label content for the switch (Field wrapper is built-in) - can be a string or any React node. Optional when used standalone for visual-only purposes. */\n label?: ReactNode;\n /** Tooltip content to display next to the label via an info icon */\n labelTooltip?: ReactNode;\n /**\n * Whether the switch is required.\n * When explicitly false, shows \"(optional)\" text after the label.\n */\n required?: boolean;\n /** When true (default), switch appears before label. When false, label appears before switch. */\n controlFirst?: boolean;\n size?: KumoSwitchSize;\n checked?: boolean;\n disabled?: boolean;\n onCheckedChange?: (checked: boolean) => void;\n transitioning?: boolean;\n};\n\n/**\n * Switch group component props (with built-in Fieldset)\n *\n * Usage:\n * ```tsx\n * <Switch.Group\n * legend=\"Notification settings\"\n * error=\"You must enable at least one notification type\"\n * >\n * <Switch.Item label=\"Email notifications\" value=\"email\" />\n * <Switch.Item label=\"SMS notifications\" value=\"sms\" />\n * </Switch.Group>\n * ```\n */\n/**\n * Props for Switch.Legend — a composable sub-component for labeling a Switch.Group.\n *\n * Place as a direct child of `<Switch.Group>` to provide a styled, accessible legend.\n * Accepts `className` for full styling control (e.g. `className=\"sr-only\"` to visually hide).\n *\n * @example\n * ```tsx\n * <Switch.Group>\n * <Switch.Legend className=\"sr-only\">Notification settings</Switch.Legend>\n * <Switch.Item label=\"Email\" value=\"email\" />\n * </Switch.Group>\n * ```\n */\nexport interface SwitchLegendProps {\n /** Legend content */\n children: ReactNode;\n /** Additional CSS classes (e.g. \"sr-only\" to visually hide the legend) */\n className?: string;\n}\n\nexport interface SwitchGroupProps {\n /**\n * Legend text for the group.\n * For more control over legend styling, omit this prop and use `<Switch.Legend>` as a child instead.\n */\n legend?: string;\n /** Child Switch.Item components (and optionally a Switch.Legend) */\n children: ReactNode;\n /** Error message for the group (only appears in groups, not single switches) */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Whether all switches in the group are disabled */\n disabled?: boolean;\n /** When true (default), switch appears before label. When false, label appears before switch. */\n controlFirst?: boolean;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual switch item within a group\n */\nexport type SwitchItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: SwitchVariant;\n /** Label text displayed next to switch */\n label: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n checked?: boolean;\n disabled?: boolean;\n onCheckedChange?: (checked: boolean) => void;\n size?: KumoSwitchSize;\n transitioning?: boolean;\n};\n\n// Single switch with built-in Field\nconst SwitchBase = forwardRef<HTMLButtonElement, SwitchProps>(\n (\n {\n className,\n checked,\n disabled,\n size = \"base\",\n variant = \"default\",\n label,\n labelTooltip,\n required,\n controlFirst = true,\n onCheckedChange,\n transitioning,\n id,\n ...props\n },\n ref,\n ) => {\n // For aria-label, only use string labels (ReactNode labels can't be used for aria-label)\n const ariaLabelFallback = typeof label === \"string\" ? label : \"Switch\";\n const switchControl = (\n <BaseSwitch.Root\n ref={ref}\n id={id}\n checked={checked}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n nativeButton\n render={(rootProps, state) => {\n const {\n ref: rootRef,\n className: baseClassName,\n role: baseRole,\n \"aria-checked\": _ariaChecked,\n \"aria-pressed\": _ariaPressed,\n ...restRootProps\n } = rootProps as typeof rootProps & {\n ref?: Ref<HTMLButtonElement>;\n className?: string;\n role?: string;\n \"aria-checked\"?: boolean;\n \"aria-pressed\"?: boolean;\n };\n\n const isNeutral = variant === \"neutral\";\n\n // Squircle-aware border-radius (used by both variants)\n const squircleRadius =\n \"rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]\";\n\n // Size styles matching Kyle's stratus implementation\n const sizeStyles = {\n sm: { track: \"h-4 w-8\", thumb: \"w-4\", slide: \"left-4\" },\n base: { track: \"h-4.5 w-9\", thumb: \"w-4.5\", slide: \"left-4.5\" },\n lg: { track: \"h-5 w-10\", thumb: \"w-5\", slide: \"left-5\" },\n };\n const s = sizeStyles[size];\n\n // Track colors based on variant\n const trackColors = isNeutral\n ? state.checked\n ? \"bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700\"\n : \"bg-neutral-150 dark:bg-kumo-base ring-kumo-hairline\"\n : state.checked\n ? \"bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500\"\n : \"bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600\";\n\n // Thumb colors based on variant\n const thumbColors = isNeutral\n ? state.checked\n ? \"bg-kumo-base dark:bg-neutral-400\"\n : \"bg-kumo-base dark:bg-neutral-850\"\n : state.checked\n ? \"bg-kumo-base dark:bg-blue-300\"\n : \"bg-kumo-base dark:bg-neutral-850\";\n\n const trackClassName = cn(\n \"relative inline-flex items-center ring cursor-pointer border-none p-0\",\n \"focus:outline-none focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n \"transition-colors duration-150 ease-out motion-reduce:transition-none\",\n \"disabled:cursor-not-allowed disabled:opacity-50\",\n s.track,\n squircleRadius,\n trackColors,\n className,\n baseClassName,\n );\n\n const thumbClassName = cn(\n \"absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]\",\n s.thumb,\n squircleRadius,\n thumbColors,\n \"transition-all duration-150 ease-out motion-reduce:transition-none\",\n state.checked ? s.slide : \"left-0\",\n );\n\n const role =\n (props.role as string | undefined) ?? baseRole ?? \"switch\";\n const checkedA11yProps =\n role === \"switch\"\n ? { \"aria-checked\": state.checked }\n : { \"aria-pressed\": state.checked };\n\n return (\n <button\n {...restRootProps}\n {...props}\n ref={rootRef}\n type=\"button\"\n role={role}\n {...checkedA11yProps}\n aria-busy={transitioning || undefined}\n aria-label={props[\"aria-label\"] ?? ariaLabelFallback}\n className={trackClassName}\n >\n <div className={thumbClassName} />\n </button>\n );\n }}\n />\n );\n\n // Wrap in Field (built-in) - no description for single switches\n // If no label provided, return bare switch (for use in other components)\n if (!label) {\n return switchControl;\n }\n\n return (\n <Field\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n controlFirst={controlFirst}\n >\n {switchControl}\n </Field>\n );\n },\n);\n\nSwitchBase.displayName = \"Switch\";\n\n// Switch.Item for use within Switch.Group\nconst SwitchItem = forwardRef<HTMLButtonElement, SwitchItemProps>(\n (\n {\n className,\n checked,\n disabled,\n size = \"base\",\n variant = \"default\",\n label,\n onCheckedChange,\n transitioning,\n },\n ref,\n ) => {\n const { controlFirst } = useContext(SwitchGroupContext);\n\n return (\n <label\n className={cn(\n \"m-0 relative inline-flex items-center gap-2\",\n // Control first (default): switch before label\n // Label first: label before switch using flex-row-reverse\n !controlFirst && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseSwitch.Root\n ref={ref}\n checked={checked}\n disabled={disabled}\n onCheckedChange={onCheckedChange}\n nativeButton\n render={(rootProps, state) => {\n const {\n ref: rootRef,\n className: baseClassName,\n role: baseRole,\n \"aria-checked\": _ariaChecked,\n \"aria-pressed\": _ariaPressed,\n ...restRootProps\n } = rootProps as typeof rootProps & {\n ref?: Ref<HTMLButtonElement>;\n className?: string;\n role?: string;\n \"aria-checked\"?: boolean;\n \"aria-pressed\"?: boolean;\n };\n\n const isNeutral = variant === \"neutral\";\n\n // Squircle-aware border-radius (used by both variants)\n const squircleRadius =\n \"rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]\";\n\n // Size styles matching Kyle's stratus implementation\n const sizeStyles = {\n sm: { track: \"h-4 w-8\", thumb: \"w-4\", slide: \"left-4\" },\n base: { track: \"h-4.5 w-9\", thumb: \"w-4.5\", slide: \"left-4.5\" },\n lg: { track: \"h-5 w-10\", thumb: \"w-5\", slide: \"left-5\" },\n };\n const s = sizeStyles[size];\n\n // Track colors based on variant\n const trackColors = isNeutral\n ? state.checked\n ? \"bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700\"\n : \"bg-neutral-150 dark:bg-kumo-base ring-kumo-hairline\"\n : state.checked\n ? \"bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500\"\n : \"bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600\";\n\n // Thumb colors based on variant\n const thumbColors = isNeutral\n ? state.checked\n ? \"bg-kumo-base dark:bg-neutral-400\"\n : \"bg-kumo-base dark:bg-neutral-850\"\n : state.checked\n ? \"bg-kumo-base dark:bg-blue-300\"\n : \"bg-kumo-base dark:bg-neutral-850\";\n\n const trackClassName = cn(\n \"relative inline-flex items-center ring cursor-pointer border-none p-0\",\n \"focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n \"transition-colors duration-150 ease-out motion-reduce:transition-none\",\n \"disabled:cursor-not-allowed disabled:opacity-50\",\n s.track,\n squircleRadius,\n trackColors,\n baseClassName,\n );\n\n const thumbClassName = cn(\n \"absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]\",\n s.thumb,\n squircleRadius,\n thumbColors,\n \"transition-all duration-150 ease-out motion-reduce:transition-none\",\n state.checked ? s.slide : \"left-0\",\n );\n\n const role = baseRole ?? \"switch\";\n const checkedA11yProps =\n role === \"switch\"\n ? { \"aria-checked\": state.checked }\n : { \"aria-pressed\": state.checked };\n\n return (\n <button\n {...restRootProps}\n ref={rootRef}\n type=\"button\"\n role={role}\n {...checkedA11yProps}\n aria-busy={transitioning || undefined}\n className={trackClassName}\n >\n <div className={thumbClassName} />\n </button>\n );\n }}\n />\n <span className=\"text-base font-medium text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nSwitchItem.displayName = \"Switch.Item\";\n\n// Switch.Legend — composable legend sub-component for Switch.Group\nfunction SwitchLegend({ children, className }: SwitchLegendProps) {\n return (\n <Fieldset.Legend\n className={cn(\"text-base font-medium text-kumo-default\", className)}\n >\n {children}\n </Fieldset.Legend>\n );\n}\n\nSwitchLegend.displayName = \"Switch.Legend\";\n\n// Switch.Group with built-in Fieldset\nfunction SwitchGroup({\n legend,\n children,\n error,\n description,\n disabled,\n controlFirst = true,\n className,\n}: SwitchGroupProps) {\n return (\n <SwitchGroupContext.Provider value={{ controlFirst }}>\n <Fieldset.Root\n className={cn(\"flex flex-col gap-4\", className)}\n disabled={disabled}\n >\n {legend && (\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n )}\n <div className=\"flex flex-col gap-2\">{children}</div>\n {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n {description && (\n <p className=\"text-sm text-kumo-subtle\">{description}</p>\n )}\n </Fieldset.Root>\n </SwitchGroupContext.Provider>\n );\n}\n\n// Compound component\nexport const Switch = Object.assign(SwitchBase, {\n Item: SwitchItem,\n Group: SwitchGroup,\n Legend: SwitchLegend,\n});\n\nSwitch.displayName = \"Switch\";\n"],"names":["KUMO_SWITCH_VARIANTS","KUMO_SWITCH_DEFAULT_VARIANTS","SwitchGroupContext","createContext","SwitchBase","forwardRef","className","checked","disabled","size","variant","label","labelTooltip","required","controlFirst","onCheckedChange","transitioning","id","props","ref","ariaLabelFallback","switchControl","jsx","BaseSwitch.Root","rootProps","state","rootRef","baseClassName","baseRole","_ariaChecked","_ariaPressed","restRootProps","isNeutral","squircleRadius","s","trackColors","thumbColors","trackClassName","cn","thumbClassName","role","checkedA11yProps","Field","SwitchItem","useContext","jsxs","SwitchLegend","children","Fieldset.Legend","SwitchGroup","legend","error","description","Fieldset.Root","Switch"],"mappings":"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"}

package/dist/chunks/table-iudje0lva0z68jto.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"table-iudje0lva0z68jto.js","sources":["../../src/components/table/table.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils\";\nimport { Checkbox, type CheckboxChangeEventDetails } from \"../checkbox\";\n\n/** Table layout and row variant definitions mapping names to their Tailwind classes. */\nexport const KUMO_TABLE_VARIANTS = {\n layout: {\n auto: {\n classes: \"\",\n description: \"Auto table layout - columns resize based on content\",\n },\n fixed: {\n classes: \"table-fixed\",\n description:\n \"Fixed table layout - columns have equal width, controlled via colgroup\",\n },\n },\n variant: {\n default: {\n classes: \"\",\n description: \"Default row variant\",\n },\n selected: {\n classes: \"bg-kumo-tint\",\n description: \"Selected row variant\",\n },\n },\n sticky: {\n left: {\n classes: \"sticky left-0\",\n description: \"Pin column to the left edge of the scroll container\",\n },\n right: {\n classes: \"sticky right-0\",\n description: \"Pin column to the right edge of the scroll container\",\n },\n },\n} as const;\n\nexport type KumoTableStickyColumn = keyof typeof KUMO_TABLE_VARIANTS.sticky;\n\n/**\n * Shared sticky-column styles for `<th>` and `<td>`.\n *\n * - Opaque background so scrolling content doesn't show through.\n * - Gradient fade on the inner edge so the sticky boundary isn't a hard clip.\n * - z-index kept to z-0/z-1/z-2 within the table's `isolate` stacking context:\n * - `z-0` — normal cells (default)\n * - `z-1` — sticky body cells (`<td>`)\n * - `z-2` — sticky header cells (`<th>`) so they sit above sticky body cells\n *\n * Header cells use `:has()` to detect if they're in a compact header (which has\n * `bg-kumo-elevated`) and adjust both the background and gradient fade colors.\n */\nconst stickyColumnClasses = (\n side: KumoTableStickyColumn,\n /** \"head\" renders at z-2, \"cell\" at z-1 */\n element: \"head\" | \"cell\",\n) => {\n const base = KUMO_TABLE_VARIANTS.sticky[side].classes;\n const z = element === \"head\" ? \"z-2\" : \"z-1\";\n\n const fadePosition = side === \"right\" ? \"before:-left-6\" : \"before:-right-6\";\n const fadeBase =\n \"before:pointer-events-none before:absolute before:inset-y-0 before:w-6\";\n\n if (element === \"cell\") {\n // Body cells always use kumo-base\n const fade =\n side === \"right\"\n ? \"before:bg-gradient-to-r before:from-transparent before:to-kumo-base\"\n : \"before:bg-gradient-to-l before:from-transparent before:to-kumo-base\";\n return cn(base, z, \"bg-kumo-base\", fadeBase, fadePosition, fade);\n }\n\n // Header cells: use kumo-base by default, kumo-elevated when in compact header\n // The compact header applies a data attribute we can target with :has()\n const bg = \"bg-kumo-base group-data-[compact]/header:bg-kumo-elevated\";\n const fade =\n side === \"right\"\n ? \"before:bg-gradient-to-r before:from-transparent before:to-kumo-base group-data-[compact]/header:before:to-kumo-elevated\"\n : \"before:bg-gradient-to-l before:from-transparent before:to-kumo-base group-data-[compact]/header:before:to-kumo-elevated\";\n\n return cn(base, z, bg, fadeBase, fadePosition, fade);\n};\n\nexport const KUMO_TABLE_DEFAULT_VARIANTS = {\n layout: \"auto\",\n variant: \"default\",\n} as const;\n\nexport type KumoTableRowVariant = keyof typeof KUMO_TABLE_VARIANTS.variant;\nexport type KumoTableLayout = keyof typeof KUMO_TABLE_VARIANTS.layout;\n\n/**\n * Table root — applies layout, borders, padding, and header styles.\n *\n * @example\n * ```tsx\n * <Table layout=\"fixed\">\n * <Table.Header>\n * <Table.Row>\n * <Table.Head>Name</Table.Head>\n * <Table.Head>Status</Table.Head>\n * </Table.Row>\n * </Table.Header>\n * <Table.Body>\n * <Table.Row>\n * <Table.Cell>Worker A</Table.Cell>\n * <Table.Cell>Active</Table.Cell>\n * </Table.Row>\n * </Table.Body>\n * </Table>\n * ```\n */\nconst TableRoot = forwardRef<\n HTMLTableElement,\n React.HTMLAttributes<HTMLTableElement> & {\n /**\n * Table layout algorithm.\n * - `\"auto\"` — columns resize based on content\n * - `\"fixed\"` — equal-width columns, controlled via `<colgroup>`\n * @default \"auto\"\n */\n layout?: KumoTableLayout;\n }\n>(({ layout = \"auto\", ...props }, ref) => {\n const className = cn(\n \"isolate w-full\", // isolate creates a stacking context so z-0/z-1/z-2 never leak out\n KUMO_TABLE_VARIANTS.layout[layout].classes,\n \"[&_td]:border-b [&_td]:border-kumo-fill [&_tr:last-child_td]:border-b-0\", // Row border\n \"[&_td]:p-3\", // Cell padding\n \"[&_th]:border-b [&_th]:border-kumo-fill [&_th]:p-3 [&_th]:font-semibold [&_th]:text-base\", // Header styles\n \"[&_th]:bg-kumo-base\", // Header background color\n \"text-base text-left text-kumo-default\",\n props.className,\n );\n\n return <table ref={ref} {...props} className={className} />;\n});\n\nconst TableHeader = forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement> & {\n variant?: \"default\" | \"compact\";\n /**\n * Make the header row stick to the top of the scroll container.\n * Requires the table's parent to have a constrained height with\n * `overflow-y: auto`.\n */\n sticky?: boolean;\n }\n>(({ variant = \"default\", sticky, ...props }, ref) => {\n const isCompact = variant === \"compact\";\n const className = cn(\n \"group/header\",\n isCompact && \"[&_th]:bg-kumo-elevated [&_th]:py-2 text-xs text-kumo-strong\",\n sticky && \"[&_th]:sticky [&_th]:top-0 [&_th]:z-1\",\n props.className,\n );\n\n return (\n <thead\n ref={ref}\n {...props}\n className={className}\n {...(isCompact && { \"data-compact\": \"\" })}\n />\n );\n});\n\nconst TableHead = forwardRef<\n HTMLTableCellElement,\n React.HTMLAttributes<HTMLTableCellElement> & {\n /**\n * Pin this header cell to the left or right edge of the scroll container.\n * Adds `position: sticky`, an opaque background, and a gradient fade on the\n * inner edge. Sticky header columns render at `z-2` so they sit above both\n * normal cells and sticky body cells (`z-1`).\n */\n sticky?: KumoTableStickyColumn;\n }\n>(({ sticky, ...props }, ref) => {\n const className = cn(\n \"group relative\",\n sticky && stickyColumnClasses(sticky, \"head\"),\n props.className,\n );\n return <th ref={ref} {...props} className={className} />;\n});\n\nconst TableRow = forwardRef<\n HTMLTableRowElement,\n React.HTMLAttributes<HTMLTableRowElement> & {\n variant?: KumoTableRowVariant;\n }\n>(({ variant = KUMO_TABLE_DEFAULT_VARIANTS.variant, ...props }, ref) => {\n const className = cn(\n KUMO_TABLE_VARIANTS.variant[variant].classes,\n props.className,\n );\n\n return <tr ref={ref} {...props} className={className} />;\n});\n\nconst TableBody = forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n return <tbody ref={ref} {...props} />;\n});\n\nconst TableCell = forwardRef<\n HTMLTableCellElement,\n React.TdHTMLAttributes<HTMLTableCellElement> & {\n /**\n * Pin this cell to the left or right edge of the scroll container.\n * Adds `position: sticky`, an opaque background, and a gradient fade on\n * the inner edge. Requires the table's parent to have `overflow-x: auto`.\n */\n sticky?: KumoTableStickyColumn;\n }\n>(({ sticky, ...props }, ref) => {\n const className = cn(\n sticky && stickyColumnClasses(sticky, \"cell\"),\n props.className,\n );\n return <td ref={ref} {...props} className={className} />;\n});\n\nconst TableFooter = forwardRef<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n return <tfoot ref={ref} {...props} />;\n});\n\nconst TableResizeHandle = forwardRef<\n HTMLButtonElement,\n React.HTMLAttributes<HTMLButtonElement>\n>((props, ref) => {\n return (\n <button\n ref={ref}\n {...props}\n type=\"button\"\n aria-label=\"Resize column\"\n className={cn(\n \"invisible h-full group-hover:visible\", // Make the handle invisible by default\n \"w-[10px]\", // Hitting area\n \"flex items-center justify-center\", // Center the handle\n \"cursor-col-resize touch-none select-none\", // Prevent selection and touch events\n \"absolute top-0 right-0\", // Position the handle\n \"m-0 bg-kumo-base p-0\", // Override the stratus button styles\n \"focus-visible:ring-2 focus-visible:ring-kumo-brand\", // Consistent keyboard focus styling\n )}\n >\n <span className=\"h-5 w-[2px] rounded bg-kumo-hairline\" />\n </button>\n );\n});\n\n/**\n * Special cell that makes the entire cell area a hit target for the checkbox.\n */\n\nconst TableCheckCell = forwardRef<\n HTMLTableCellElement,\n React.TdHTMLAttributes<HTMLTableCellElement> & {\n checked?: boolean;\n indeterminate?: boolean;\n /**\n * Called when the checkbox's checked state changes. The optional second\n * argument exposes event details from the underlying Checkbox, matching\n * the Checkbox component's signature.\n */\n onCheckedChange?: (\n checked: boolean,\n eventDetails?: CheckboxChangeEventDetails,\n ) => void;\n /** @deprecated Use `onCheckedChange` instead. Will be removed in a future major version. */\n onValueChange?: (checked: boolean) => void;\n label?: string;\n disabled?: boolean;\n }\n>(\n (\n {\n checked,\n indeterminate,\n onCheckedChange,\n onValueChange,\n label,\n disabled,\n ...props\n },\n ref,\n ) => {\n return (\n <TableCell\n ref={ref}\n {...props}\n className={cn(\"w-10 leading-none\", props.className)}\n >\n <Checkbox\n checked={checked}\n indeterminate={indeterminate}\n onCheckedChange={(newChecked, eventDetails) => {\n onCheckedChange?.(newChecked, eventDetails);\n onValueChange?.(newChecked);\n }}\n aria-label={label ?? \"Select row\"}\n disabled={disabled}\n className=\"relative before:absolute before:-inset-3 before:content-['']\"\n />\n </TableCell>\n );\n },\n);\n\nconst TableCheckHead = forwardRef<\n HTMLTableCellElement,\n React.ThHTMLAttributes<HTMLTableCellElement> & {\n checked?: boolean;\n indeterminate?: boolean;\n /**\n * Called when the checkbox's checked state changes. The optional second\n * argument exposes event details from the underlying Checkbox, matching\n * the Checkbox component's signature.\n */\n onCheckedChange?: (\n checked: boolean,\n eventDetails?: CheckboxChangeEventDetails,\n ) => void;\n /** @deprecated Use `onCheckedChange` instead. Will be removed in a future major version. */\n onValueChange?: (checked: boolean) => void;\n label?: string;\n disabled?: boolean;\n }\n>(\n (\n {\n checked,\n indeterminate,\n onCheckedChange,\n onValueChange,\n label,\n disabled,\n ...props\n },\n ref,\n ) => {\n return (\n <TableHead\n ref={ref}\n {...props}\n className={cn(\"w-10 leading-none\", props.className)}\n >\n <Checkbox\n checked={checked}\n indeterminate={indeterminate}\n onCheckedChange={(newChecked, eventDetails) => {\n onCheckedChange?.(newChecked, eventDetails);\n onValueChange?.(newChecked);\n }}\n aria-label={label ?? \"Select all rows\"}\n disabled={disabled}\n className=\"relative before:absolute before:-inset-3 before:content-['']\"\n />\n </TableHead>\n );\n },\n);\n\nTableRoot.displayName = \"Table\";\nTableBody.displayName = \"Table.Body\";\nTableHead.displayName = \"Table.Head\";\nTableRow.displayName = \"Table.Row\";\nTableCell.displayName = \"Table.Cell\";\nTableFooter.displayName = \"Table.Footer\";\nTableHeader.displayName = \"Table.Header\";\nTableResizeHandle.displayName = \"Table.ResizeHandle\";\nTableCheckCell.displayName = \"Table.CheckCell\";\nTableCheckHead.displayName = \"Table.CheckHead\";\n\n/**\n * Table — semantic HTML table with styled rows, cells, and selection support.\n *\n * Compound component: `Table` (Root), `.Header`, `.Head`, `.Body`, `.Row`,\n * `.Cell`, `.Footer`, `.CheckCell`, `.CheckHead`, `.ResizeHandle`.\n *\n * @example\n * ```tsx\n * <Table>\n * <Table.Header>\n * <Table.Row>\n * <Table.CheckHead checked={allSelected} onCheckedChange={toggleAll} />\n * <Table.Head>Name</Table.Head>\n * </Table.Row>\n * </Table.Header>\n * <Table.Body>\n * {rows.map((row) => (\n * <Table.Row key={row.id} variant={selected.has(row.id) ? \"selected\" : \"default\"}>\n * <Table.CheckCell checked={selected.has(row.id)} onCheckedChange={() => toggle(row.id)} />\n * <Table.Cell>{row.name}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * </Table>\n * ```\n */\nexport const Table = Object.assign(TableRoot, {\n Header: TableHeader,\n Head: TableHead,\n Row: TableRow,\n Body: TableBody,\n Cell: TableCell,\n CheckCell: TableCheckCell,\n CheckHead: TableCheckHead,\n Footer: TableFooter,\n ResizeHandle: TableResizeHandle,\n});\n"],"names":["KUMO_TABLE_VARIANTS","stickyColumnClasses","side","element","base","z","fadePosition","fadeBase","cn","KUMO_TABLE_DEFAULT_VARIANTS","TableRoot","forwardRef","layout","props","ref","className","jsx","TableHeader","variant","sticky","isCompact","TableHead","TableRow","TableBody","TableCell","TableFooter","TableResizeHandle","TableCheckCell","checked","indeterminate","onCheckedChange","onValueChange","label","disabled","Checkbox","newChecked","eventDetails","TableCheckHead","Table"],"mappings":"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"}