@karakuri-ui/react 0.3.7 → 0.3.9

package/dist/components/ui/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/dropdown.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'\nimport { cn } from '../../lib/utils'\n\n// Radius variants for Content and Item (concentric rounded rectangles)\ntype DropdownMenuRadius = 'md' | 'lg' | 'xl'\n\nconst contentRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded-md',     // 6px\n  lg: 'rounded-lg',     // 8px\n  xl: 'rounded-xl',     // 12px (default)\n}\n\nconst itemRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded',        // 4px — perceptual balance (67%)\n  lg: 'rounded-md',     // 6px — perceptual balance (75%)\n  xl: 'rounded-lg',     // 8px — perceptual balance (67%)\n}\n\n// Size variants\ntype DropdownMenuSize = 'sm' | 'md' | 'lg'\n\nconst itemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-sm',\n  lg: 'px-3 py-2.5 text-md',\n}\n\nconst indicatorItemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'py-1.5 pl-6 pr-2 text-xs',\n  md: 'py-1.5 pl-8 pr-2 text-sm',\n  lg: 'py-2.5 pl-10 pr-3 text-md',\n}\n\nconst indicatorSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'left-2 h-3 w-3',\n  md: 'left-2 h-3.5 w-3.5',\n  lg: 'left-3 h-4 w-4',\n}\n\nconst labelSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-xs',\n  lg: 'px-3 py-2.5 text-xs',\n}\n\nconst flushItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-3',\n  md: 'px-3',\n  lg: 'px-4',\n}\n\nconst flushIndicatorItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-7 pr-3',\n  md: 'pl-9 pr-3',\n  lg: 'pl-11 pr-4',\n}\n\nconst insetSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-6',\n  md: 'pl-8',\n  lg: 'pl-10',\n}\n\n// Style context — propagates radius, flush, size from Content to children\nconst DropdownMenuStyleContext = React.createContext<{\n  radius: DropdownMenuRadius\n  flush: boolean\n  size: DropdownMenuSize\n}>({ radius: 'lg', flush: false, size: 'md' })\n\n// Root — state management (controlled / uncontrolled)\nconst DropdownMenu = DropdownMenuPrimitive.Root\n\n// Trigger — the element that toggles the menu\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger\n\n// Group — groups related items\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group\n\n// Sub — submenu root\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub\n\n// RadioGroup — radio selection group\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup\n\n// Content — the floating panel (rendered in a Portal)\nconst DropdownMenuContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n    radius?: DropdownMenuRadius\n    flush?: boolean\n    size?: DropdownMenuSize\n  }\n>(({ className, sideOffset = 4, radius = 'md', flush = false, size = 'md', onCloseAutoFocus, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuStyleContext.Provider value={{ radius, flush, size }}>\n      <DropdownMenuPrimitive.Content\n        ref={ref}\n        sideOffset={sideOffset}\n        onCloseAutoFocus={(e) => {\n          e.preventDefault()\n          onCloseAutoFocus?.(e)\n        }}\n        className={cn(\n          'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n          flush ? 'py-1' : 'p-1',\n          contentRadiusMap[radius],\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuStyleContext.Provider>\n  </DropdownMenuPrimitive.Portal>\n))\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName\n\n// Item — a single menu item\nconst DropdownMenuItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Item\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName\n\n// CheckboxItem — item with a checkbox indicator\nconst DropdownMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={3} aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 13l4 4L19 7\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  )\n})\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName\n\n// RadioItem — item within a RadioGroup\nconst DropdownMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"6\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  )\n})\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName\n\n// Label — non-interactive group heading\nconst DropdownMenuLabel = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Label\n      ref={ref}\n      className={cn(\n        'font-semibold text-text-muted',\n        labelSizeMap[size],\n        flush && flushItemPaddingMap[size],\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName\n\n// Separator — visual divider between groups\nconst DropdownMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n  const { flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Separator\n      ref={ref}\n      className={cn('h-px bg-border my-1', !flush && '-mx-1', className)}\n      {...props}\n    />\n  )\n})\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName\n\n// SubTrigger — item that opens a submenu\nconst DropdownMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      ref={ref}\n      className={cn(\n        'flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'focus:bg-background-muted data-[state=open]:bg-background-muted',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <svg className=\"ml-auto icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n      </svg>\n    </DropdownMenuPrimitive.SubTrigger>\n  )\n})\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName\n\n// SubContent — the floating panel for a submenu\nconst DropdownMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => {\n  const { radius, flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubContent\n      ref={ref}\n      className={cn(\n        'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n        flush ? 'py-1' : 'p-1',\n        contentRadiusMap[radius],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName\n\n// Shortcut — keyboard shortcut hint text\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n  return (\n    <span\n      className={cn('ml-auto pl-4 text-xs text-text-subtle tracking-widest', className)}\n      {...props}\n    />\n  )\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut'\n\nexport type { DropdownMenuRadius, DropdownMenuSize }\n\nexport {\n  DropdownMenu,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuGroup,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n  DropdownMenuShortcut,\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/ui/dropdown.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'\nimport { cn } from '../../lib/utils'\n\n// Radius variants for Content and Item (concentric rounded rectangles)\ntype DropdownMenuRadius = 'md' | 'lg' | 'xl'\n\nconst contentRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded-md',     // 6px (default)\n  lg: 'rounded-lg',     // 8px\n  xl: 'rounded-xl',     // 12px\n}\n\nconst itemRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded',        // 4px — perceptual balance (67%)\n  lg: 'rounded-md',     // 6px — perceptual balance (75%)\n  xl: 'rounded-lg',     // 8px — perceptual balance (67%)\n}\n\n// Size variants\ntype DropdownMenuSize = 'sm' | 'md' | 'lg'\n\nconst itemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-sm',\n  lg: 'px-3 py-2.5 text-md',\n}\n\nconst indicatorItemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'py-1.5 pl-6 pr-2 text-xs',\n  md: 'py-1.5 pl-8 pr-2 text-sm',\n  lg: 'py-2.5 pl-10 pr-3 text-md',\n}\n\nconst indicatorSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'left-2 h-3 w-3',\n  md: 'left-2 h-3.5 w-3.5',\n  lg: 'left-3 h-4 w-4',\n}\n\nconst labelSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-xs',\n  lg: 'px-3 py-2.5 text-xs',\n}\n\nconst flushItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-3',\n  md: 'px-3',\n  lg: 'px-4',\n}\n\nconst flushIndicatorItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-7 pr-3',\n  md: 'pl-9 pr-3',\n  lg: 'pl-11 pr-4',\n}\n\nconst insetSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-6',\n  md: 'pl-8',\n  lg: 'pl-10',\n}\n\n// Style context — propagates radius, flush, size from Content to children\nconst DropdownMenuStyleContext = React.createContext<{\n  radius: DropdownMenuRadius\n  flush: boolean\n  size: DropdownMenuSize\n}>({ radius: 'md', flush: false, size: 'md' })\n\n// Root — state management (controlled / uncontrolled)\nconst DropdownMenu = DropdownMenuPrimitive.Root\n\n// Trigger — the element that toggles the menu\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger\n\n// Group — groups related items\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group\n\n// Sub — submenu root\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub\n\n// RadioGroup — radio selection group\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup\n\n// Content — the floating panel (rendered in a Portal)\nconst DropdownMenuContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n    radius?: DropdownMenuRadius\n    flush?: boolean\n    size?: DropdownMenuSize\n  }\n>(({ className, sideOffset = 4, radius = 'md', flush = false, size = 'md', onCloseAutoFocus, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuStyleContext.Provider value={{ radius, flush, size }}>\n      <DropdownMenuPrimitive.Content\n        ref={ref}\n        sideOffset={sideOffset}\n        onCloseAutoFocus={(e) => {\n          e.preventDefault()\n          onCloseAutoFocus?.(e)\n        }}\n        className={cn(\n          'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n          flush ? 'py-1' : 'p-1',\n          contentRadiusMap[radius],\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuStyleContext.Provider>\n  </DropdownMenuPrimitive.Portal>\n))\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName\n\n// Item — a single menu item\nconst DropdownMenuItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Item\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName\n\n// CheckboxItem — item with a checkbox indicator\nconst DropdownMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={3} aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 13l4 4L19 7\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  )\n})\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName\n\n// RadioItem — item within a RadioGroup\nconst DropdownMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"6\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  )\n})\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName\n\n// Label — non-interactive group heading\nconst DropdownMenuLabel = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Label\n      ref={ref}\n      className={cn(\n        'font-semibold text-text-muted',\n        labelSizeMap[size],\n        flush && flushItemPaddingMap[size],\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName\n\n// Separator — visual divider between groups\nconst DropdownMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n  const { flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Separator\n      ref={ref}\n      className={cn('h-px bg-border my-1', !flush && '-mx-1', className)}\n      {...props}\n    />\n  )\n})\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName\n\n// SubTrigger — item that opens a submenu\nconst DropdownMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      ref={ref}\n      className={cn(\n        'flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'focus:bg-background-muted data-[state=open]:bg-background-muted',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <svg className=\"ml-auto icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n      </svg>\n    </DropdownMenuPrimitive.SubTrigger>\n  )\n})\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName\n\n// SubContent — the floating panel for a submenu\nconst DropdownMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => {\n  const { radius, flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubContent\n      ref={ref}\n      className={cn(\n        'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n        flush ? 'py-1' : 'p-1',\n        contentRadiusMap[radius],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName\n\n// Shortcut — keyboard shortcut hint text\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n  return (\n    <span\n      className={cn('ml-auto pl-4 text-xs text-text-subtle tracking-widest', className)}\n      {...props}\n    />\n  )\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut'\n\nexport type { DropdownMenuRadius, DropdownMenuSize }\n\nexport {\n  DropdownMenu,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuGroup,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n  DropdownMenuShortcut,\n}\n"],"mappings":"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","names":[]}

package/dist/components/ui/dropdown.mjs

@@ -5,11 +5,11 @@ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { cn } from "../../lib/utils.mjs";
 const contentRadiusMap = {
   md: "rounded-md",
-  // 6px
+  // 6px (default)
   lg: "rounded-lg",
   // 8px
   xl: "rounded-xl"
-  // 12px (default)
+  // 12px
 };
 const itemRadiusMap = {
   md: "rounded",
@@ -54,7 +54,7 @@ const insetSizeMap = {
   md: "pl-8",
   lg: "pl-10"
 };
-const DropdownMenuStyleContext = React.createContext({ radius: "lg", flush: false, size: "md" });
+const DropdownMenuStyleContext = React.createContext({ radius: "md", flush: false, size: "md" });
 const DropdownMenu = DropdownMenuPrimitive.Root;
 const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 const DropdownMenuGroup = DropdownMenuPrimitive.Group;

package/dist/components/ui/dropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/dropdown.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'\nimport { cn } from '../../lib/utils'\n\n// Radius variants for Content and Item (concentric rounded rectangles)\ntype DropdownMenuRadius = 'md' | 'lg' | 'xl'\n\nconst contentRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded-md',     // 6px\n  lg: 'rounded-lg',     // 8px\n  xl: 'rounded-xl',     // 12px (default)\n}\n\nconst itemRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded',        // 4px — perceptual balance (67%)\n  lg: 'rounded-md',     // 6px — perceptual balance (75%)\n  xl: 'rounded-lg',     // 8px — perceptual balance (67%)\n}\n\n// Size variants\ntype DropdownMenuSize = 'sm' | 'md' | 'lg'\n\nconst itemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-sm',\n  lg: 'px-3 py-2.5 text-md',\n}\n\nconst indicatorItemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'py-1.5 pl-6 pr-2 text-xs',\n  md: 'py-1.5 pl-8 pr-2 text-sm',\n  lg: 'py-2.5 pl-10 pr-3 text-md',\n}\n\nconst indicatorSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'left-2 h-3 w-3',\n  md: 'left-2 h-3.5 w-3.5',\n  lg: 'left-3 h-4 w-4',\n}\n\nconst labelSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-xs',\n  lg: 'px-3 py-2.5 text-xs',\n}\n\nconst flushItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-3',\n  md: 'px-3',\n  lg: 'px-4',\n}\n\nconst flushIndicatorItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-7 pr-3',\n  md: 'pl-9 pr-3',\n  lg: 'pl-11 pr-4',\n}\n\nconst insetSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-6',\n  md: 'pl-8',\n  lg: 'pl-10',\n}\n\n// Style context — propagates radius, flush, size from Content to children\nconst DropdownMenuStyleContext = React.createContext<{\n  radius: DropdownMenuRadius\n  flush: boolean\n  size: DropdownMenuSize\n}>({ radius: 'lg', flush: false, size: 'md' })\n\n// Root — state management (controlled / uncontrolled)\nconst DropdownMenu = DropdownMenuPrimitive.Root\n\n// Trigger — the element that toggles the menu\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger\n\n// Group — groups related items\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group\n\n// Sub — submenu root\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub\n\n// RadioGroup — radio selection group\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup\n\n// Content — the floating panel (rendered in a Portal)\nconst DropdownMenuContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n    radius?: DropdownMenuRadius\n    flush?: boolean\n    size?: DropdownMenuSize\n  }\n>(({ className, sideOffset = 4, radius = 'md', flush = false, size = 'md', onCloseAutoFocus, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuStyleContext.Provider value={{ radius, flush, size }}>\n      <DropdownMenuPrimitive.Content\n        ref={ref}\n        sideOffset={sideOffset}\n        onCloseAutoFocus={(e) => {\n          e.preventDefault()\n          onCloseAutoFocus?.(e)\n        }}\n        className={cn(\n          'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n          flush ? 'py-1' : 'p-1',\n          contentRadiusMap[radius],\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuStyleContext.Provider>\n  </DropdownMenuPrimitive.Portal>\n))\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName\n\n// Item — a single menu item\nconst DropdownMenuItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Item\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName\n\n// CheckboxItem — item with a checkbox indicator\nconst DropdownMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={3} aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 13l4 4L19 7\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  )\n})\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName\n\n// RadioItem — item within a RadioGroup\nconst DropdownMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"6\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  )\n})\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName\n\n// Label — non-interactive group heading\nconst DropdownMenuLabel = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Label\n      ref={ref}\n      className={cn(\n        'font-semibold text-text-muted',\n        labelSizeMap[size],\n        flush && flushItemPaddingMap[size],\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName\n\n// Separator — visual divider between groups\nconst DropdownMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n  const { flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Separator\n      ref={ref}\n      className={cn('h-px bg-border my-1', !flush && '-mx-1', className)}\n      {...props}\n    />\n  )\n})\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName\n\n// SubTrigger — item that opens a submenu\nconst DropdownMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      ref={ref}\n      className={cn(\n        'flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'focus:bg-background-muted data-[state=open]:bg-background-muted',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <svg className=\"ml-auto icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n      </svg>\n    </DropdownMenuPrimitive.SubTrigger>\n  )\n})\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName\n\n// SubContent — the floating panel for a submenu\nconst DropdownMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => {\n  const { radius, flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubContent\n      ref={ref}\n      className={cn(\n        'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n        flush ? 'py-1' : 'p-1',\n        contentRadiusMap[radius],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName\n\n// Shortcut — keyboard shortcut hint text\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n  return (\n    <span\n      className={cn('ml-auto pl-4 text-xs text-text-subtle tracking-widest', className)}\n      {...props}\n    />\n  )\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut'\n\nexport type { DropdownMenuRadius, DropdownMenuSize }\n\nexport {\n  DropdownMenu,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuGroup,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n  DropdownMenuShortcut,\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/ui/dropdown.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'\nimport { cn } from '../../lib/utils'\n\n// Radius variants for Content and Item (concentric rounded rectangles)\ntype DropdownMenuRadius = 'md' | 'lg' | 'xl'\n\nconst contentRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded-md',     // 6px (default)\n  lg: 'rounded-lg',     // 8px\n  xl: 'rounded-xl',     // 12px\n}\n\nconst itemRadiusMap: Record<DropdownMenuRadius, string> = {\n  md: 'rounded',        // 4px — perceptual balance (67%)\n  lg: 'rounded-md',     // 6px — perceptual balance (75%)\n  xl: 'rounded-lg',     // 8px — perceptual balance (67%)\n}\n\n// Size variants\ntype DropdownMenuSize = 'sm' | 'md' | 'lg'\n\nconst itemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-sm',\n  lg: 'px-3 py-2.5 text-md',\n}\n\nconst indicatorItemSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'py-1.5 pl-6 pr-2 text-xs',\n  md: 'py-1.5 pl-8 pr-2 text-sm',\n  lg: 'py-2.5 pl-10 pr-3 text-md',\n}\n\nconst indicatorSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'left-2 h-3 w-3',\n  md: 'left-2 h-3.5 w-3.5',\n  lg: 'left-3 h-4 w-4',\n}\n\nconst labelSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-2 py-1.5 text-xs',\n  md: 'px-2 py-1.5 text-xs',\n  lg: 'px-3 py-2.5 text-xs',\n}\n\nconst flushItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'px-3',\n  md: 'px-3',\n  lg: 'px-4',\n}\n\nconst flushIndicatorItemPaddingMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-7 pr-3',\n  md: 'pl-9 pr-3',\n  lg: 'pl-11 pr-4',\n}\n\nconst insetSizeMap: Record<DropdownMenuSize, string> = {\n  sm: 'pl-6',\n  md: 'pl-8',\n  lg: 'pl-10',\n}\n\n// Style context — propagates radius, flush, size from Content to children\nconst DropdownMenuStyleContext = React.createContext<{\n  radius: DropdownMenuRadius\n  flush: boolean\n  size: DropdownMenuSize\n}>({ radius: 'md', flush: false, size: 'md' })\n\n// Root — state management (controlled / uncontrolled)\nconst DropdownMenu = DropdownMenuPrimitive.Root\n\n// Trigger — the element that toggles the menu\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger\n\n// Group — groups related items\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group\n\n// Sub — submenu root\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub\n\n// RadioGroup — radio selection group\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup\n\n// Content — the floating panel (rendered in a Portal)\nconst DropdownMenuContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n    radius?: DropdownMenuRadius\n    flush?: boolean\n    size?: DropdownMenuSize\n  }\n>(({ className, sideOffset = 4, radius = 'md', flush = false, size = 'md', onCloseAutoFocus, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuStyleContext.Provider value={{ radius, flush, size }}>\n      <DropdownMenuPrimitive.Content\n        ref={ref}\n        sideOffset={sideOffset}\n        onCloseAutoFocus={(e) => {\n          e.preventDefault()\n          onCloseAutoFocus?.(e)\n        }}\n        className={cn(\n          'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n          flush ? 'py-1' : 'p-1',\n          contentRadiusMap[radius],\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuStyleContext.Provider>\n  </DropdownMenuPrimitive.Portal>\n))\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName\n\n// Item — a single menu item\nconst DropdownMenuItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Item\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName\n\n// CheckboxItem — item with a checkbox indicator\nconst DropdownMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={3} aria-hidden=\"true\">\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 13l4 4L19 7\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  )\n})\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName\n\n// RadioItem — item within a RadioGroup\nconst DropdownMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      ref={ref}\n      className={cn(\n        'relative flex cursor-default select-none items-center outline-none',\n        indicatorItemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushIndicatorItemPaddingMap[size],\n        'transition-colors duration-fast',\n        'focus:bg-background-muted',\n        'data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <span className={cn('absolute flex items-center justify-center', indicatorSizeMap[size])}>\n        <DropdownMenuPrimitive.ItemIndicator>\n          <svg className=\"icon-xs\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n            <circle cx=\"12\" cy=\"12\" r=\"6\" />\n          </svg>\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  )\n})\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName\n\n// Label — non-interactive group heading\nconst DropdownMenuLabel = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => {\n  const { flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Label\n      ref={ref}\n      className={cn(\n        'font-semibold text-text-muted',\n        labelSizeMap[size],\n        flush && flushItemPaddingMap[size],\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName\n\n// Separator — visual divider between groups\nconst DropdownMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n  const { flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.Separator\n      ref={ref}\n      className={cn('h-px bg-border my-1', !flush && '-mx-1', className)}\n      {...props}\n    />\n  )\n})\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName\n\n// SubTrigger — item that opens a submenu\nconst DropdownMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => {\n  const { radius, flush, size } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      ref={ref}\n      className={cn(\n        'flex cursor-default select-none items-center outline-none',\n        itemSizeMap[size],\n        !flush && itemRadiusMap[radius],\n        flush && flushItemPaddingMap[size],\n        'focus:bg-background-muted data-[state=open]:bg-background-muted',\n        inset && insetSizeMap[size],\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <svg className=\"ml-auto icon-xs\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n      </svg>\n    </DropdownMenuPrimitive.SubTrigger>\n  )\n})\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName\n\n// SubContent — the floating panel for a submenu\nconst DropdownMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => {\n  const { radius, flush } = React.useContext(DropdownMenuStyleContext)\n  return (\n    <DropdownMenuPrimitive.SubContent\n      ref={ref}\n      className={cn(\n        'z-popover min-w-[8rem] overflow-hidden border border-border bg-background text-foreground shadow-lg',\n        flush ? 'py-1' : 'p-1',\n        contentRadiusMap[radius],\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName\n\n// Shortcut — keyboard shortcut hint text\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n  return (\n    <span\n      className={cn('ml-auto pl-4 text-xs text-text-subtle tracking-widest', className)}\n      {...props}\n    />\n  )\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut'\n\nexport type { DropdownMenuRadius, DropdownMenuSize }\n\nexport {\n  DropdownMenu,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuGroup,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n  DropdownMenuShortcut,\n}\n"],"mappings":"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","names":[]}

package/dist/components/ui/field.d.mts

@@ -12,14 +12,17 @@ interface FieldContextValue {
     hasLabel: boolean;
     /** The Field holds labelled checkboxes / switches / a radio group and no single input */
     isGroup: boolean;
+    /** The FieldLabel is marked required; single controls set aria-required */
+    required: boolean;
     registerLabel: () => () => void;
+    registerRequired: () => () => void;
     registerControl: (kind: FieldControlKind) => () => void;
 }
 type FieldControlKind = 'single' | 'group' | 'labelled';
 declare function useFieldContext(): FieldContextValue | null;
 declare function useFieldControl(kind: FieldControlKind, enabled: boolean): void;
 declare const fieldVariants: (props?: ({
-    gap?: "default" | "sm" | "lg" | "none" | "xs" | null | undefined;
+    gap?: "xs" | "sm" | "default" | "lg" | "none" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof fieldVariants> {
     error?: boolean;
@@ -28,6 +31,8 @@ interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<
 declare const Field: React.ForwardRefExoticComponent<FieldProps & React.RefAttributes<HTMLDivElement>>;
 interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     required?: boolean;
+    /** Text of the required badge shown when `required` is set */
+    requiredLabel?: React.ReactNode;
 }
 declare const FieldLabel: React.ForwardRefExoticComponent<FieldLabelProps & React.RefAttributes<HTMLLabelElement>>;
 declare const FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;

package/dist/components/ui/field.d.ts

@@ -12,14 +12,17 @@ interface FieldContextValue {
     hasLabel: boolean;
     /** The Field holds labelled checkboxes / switches / a radio group and no single input */
     isGroup: boolean;
+    /** The FieldLabel is marked required; single controls set aria-required */
+    required: boolean;
     registerLabel: () => () => void;
+    registerRequired: () => () => void;
     registerControl: (kind: FieldControlKind) => () => void;
 }
 type FieldControlKind = 'single' | 'group' | 'labelled';
 declare function useFieldContext(): FieldContextValue | null;
 declare function useFieldControl(kind: FieldControlKind, enabled: boolean): void;
 declare const fieldVariants: (props?: ({
-    gap?: "default" | "sm" | "lg" | "none" | "xs" | null | undefined;
+    gap?: "xs" | "sm" | "default" | "lg" | "none" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof fieldVariants> {
     error?: boolean;
@@ -28,6 +31,8 @@ interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<
 declare const Field: React.ForwardRefExoticComponent<FieldProps & React.RefAttributes<HTMLDivElement>>;
 interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     required?: boolean;
+    /** Text of the required badge shown when `required` is set */
+    requiredLabel?: React.ReactNode;
 }
 declare const FieldLabel: React.ForwardRefExoticComponent<FieldLabelProps & React.RefAttributes<HTMLLabelElement>>;
 declare const FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;

package/dist/components/ui/field.js

@@ -72,21 +72,27 @@ const Field = React.forwardRef(
     const id = React.useId();
     const labelId = `${id}-label`;
     const [labelCount, setLabelCount] = React.useState(0);
+    const [requiredCount, setRequiredCount] = React.useState(0);
     const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 });
     const registerLabel = React.useCallback(() => {
       setLabelCount((n) => n + 1);
       return () => setLabelCount((n) => n - 1);
     }, []);
+    const registerRequired = React.useCallback(() => {
+      setRequiredCount((n) => n + 1);
+      return () => setRequiredCount((n) => n - 1);
+    }, []);
     const registerControl = React.useCallback((kind) => {
       setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }));
       return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }));
     }, []);
     const hasLabel = labelCount > 0;
+    const required = requiredCount > 0;
     const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0);
     const asGroup = counts.single === 0 && counts.group > 0;
     const contextValue = React.useMemo(
-      () => ({ id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl }),
-      [id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl]
+      () => ({ id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl }),
+      [id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl]
     );
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
@@ -105,10 +111,12 @@ const Field = React.forwardRef(
 );
 Field.displayName = "Field";
 const FieldLabel = React.forwardRef(
-  ({ className, required, children, ...props }, ref) => {
+  ({ className, required, requiredLabel = "\u5FC5\u9808", children, ...props }, ref) => {
     const context = useFieldContext();
     const registerLabel = context?.registerLabel;
     React.useEffect(() => registerLabel?.(), [registerLabel]);
+    const registerRequired = context?.registerRequired;
+    React.useEffect(() => required ? registerRequired?.() : void 0, [required, registerRequired]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "label",
       {
@@ -124,7 +132,17 @@ const FieldLabel = React.forwardRef(
         ...props,
         children: [
           children,
-          required && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-error ml-0.5", children: "*" })
+          required && // Neutral badge, not the error color: red stays reserved for errors.
+          // Inside a Field the single control carries aria-required, so the badge is hidden
+          // from assistive technology there to avoid announcing "required" twice.
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "span",
+            {
+              "aria-hidden": context && !context.isGroup ? true : void 0,
+              className: "ml-1.5 inline-flex h-5 items-center rounded px-1.5 align-middle text-2xs font-semibold whitespace-nowrap bg-background-muted text-text-muted",
+              children: requiredLabel
+            }
+          )
         ]
       }
     );

package/dist/components/ui/field.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Field Context for sharing state between components\ninterface FieldContextValue {\n  id: string\n  /** id of the FieldLabel, for aria-labelledby on grouped controls */\n  labelId: string\n  error?: boolean\n  disabled?: boolean\n  /** A FieldLabel is rendered inside this Field */\n  hasLabel: boolean\n  /** The Field holds labelled checkboxes / switches / a radio group and no single input */\n  isGroup: boolean\n  registerLabel: () => () => void\n  registerControl: (kind: FieldControlKind) => () => void\n}\n\ntype FieldControlKind = 'single' | 'group' | 'labelled'\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nfunction useFieldContext() {\n  return React.useContext(FieldContext)\n}\n\n// Controls tell their Field what they are, so FieldLabel can point at the right thing.\n// 'single': one input that takes the Field id (Input, Textarea, a bare Checkbox / Switch);\n//   FieldLabel targets it with htmlFor.\n// 'group': a Checkbox / Switch with its own label keeps a unique id; the Field becomes\n//   role=\"group\" named by FieldLabel instead of every item sharing one id.\n// 'labelled': a RadioGroup names itself from FieldLabel (aria-labelledby).\n// A single input wins: with one present, FieldLabel keeps pointing at it.\nfunction useFieldControl(kind: FieldControlKind, enabled: boolean) {\n  const context = useFieldContext()\n  const register = context?.registerControl\n  React.useEffect(() => {\n    if (!enabled || !register) return\n    return register(kind)\n  }, [enabled, register, kind])\n}\n\n// Field wrapper\nconst fieldVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      none: 'gap-0',\n      xs: 'gap-1',\n      sm: 'gap-1.5',\n      default: 'gap-2',\n      lg: 'gap-3',\n    },\n  },\n  defaultVariants: {\n    gap: 'default',\n  },\n})\n\nexport interface FieldProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof fieldVariants> {\n  error?: boolean\n  disabled?: boolean\n}\n\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n  ({ className, gap, error, disabled, children, ...props }, ref) => {\n    const id = React.useId()\n    const labelId = `${id}-label`\n    const [labelCount, setLabelCount] = React.useState(0)\n    const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 })\n\n    const registerLabel = React.useCallback(() => {\n      setLabelCount((n) => n + 1)\n      return () => setLabelCount((n) => n - 1)\n    }, [])\n    const registerControl = React.useCallback((kind: FieldControlKind) => {\n      setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }))\n      return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }))\n    }, [])\n\n    const hasLabel = labelCount > 0\n    const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0)\n    const asGroup = counts.single === 0 && counts.group > 0\n    const contextValue = React.useMemo(\n      () => ({ id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl }),\n      [id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl]\n    )\n\n    return (\n      <FieldContext.Provider value={contextValue}>\n        <div\n          ref={ref}\n          role={asGroup ? 'group' : undefined}\n          aria-labelledby={asGroup && hasLabel ? labelId : undefined}\n          className={cn(fieldVariants({ gap }), className)}\n          data-error={error || undefined}\n          data-disabled={disabled || undefined}\n          {...props}\n        >\n          {children}\n        </div>\n      </FieldContext.Provider>\n    )\n  }\n)\nField.displayName = 'Field'\n\n// Field Label\nexport interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean\n}\n\nconst FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n  ({ className, required, children, ...props }, ref) => {\n    const context = useFieldContext()\n    const registerLabel = context?.registerLabel\n    React.useEffect(() => registerLabel?.(), [registerLabel])\n\n    return (\n      <label\n        ref={ref}\n        id={context?.labelId}\n        // Grouped controls have their own labels; the group title targets no input\n        htmlFor={context && !context.isGroup ? context.id : undefined}\n        className={cn(\n          'text-md font-semibold text-foreground', // 14px - primary field identifier\n          context?.disabled && 'opacity-50 cursor-not-allowed',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {required && <span className=\"text-error ml-0.5\">*</span>}\n      </label>\n    )\n  }\n)\nFieldLabel.displayName = 'FieldLabel'\n\n// Field Error\nconst FieldError = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const context = useFieldContext()\n\n  if (!children) return null\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-error` : undefined}\n      role=\"alert\"\n      className={cn('text-xs text-error pl-1', className)} // 12px - color-distinguished, left-aligned with input text\n      {...props}\n    >\n      {children}\n    </p>\n  )\n})\nFieldError.displayName = 'FieldError'\n\n// Field Character Count\nconst FieldCharCount = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const context = useFieldContext()\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-charcount` : undefined}\n      className={cn(\n        'text-xs text-text-muted text-right pr-1 -mt-1', // 12px - right-aligned, 4px gap from input (gap-2 8px - mt-1 4px)\n        context?.disabled && 'opacity-50',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nFieldCharCount.displayName = 'FieldCharCount'\n\nexport { Field, FieldLabel, FieldError, FieldCharCount, useFieldContext, useFieldControl }\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Field Context for sharing state between components\ninterface FieldContextValue {\n  id: string\n  /** id of the FieldLabel, for aria-labelledby on grouped controls */\n  labelId: string\n  error?: boolean\n  disabled?: boolean\n  /** A FieldLabel is rendered inside this Field */\n  hasLabel: boolean\n  /** The Field holds labelled checkboxes / switches / a radio group and no single input */\n  isGroup: boolean\n  /** The FieldLabel is marked required; single controls set aria-required */\n  required: boolean\n  registerLabel: () => () => void\n  registerRequired: () => () => void\n  registerControl: (kind: FieldControlKind) => () => void\n}\n\ntype FieldControlKind = 'single' | 'group' | 'labelled'\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nfunction useFieldContext() {\n  return React.useContext(FieldContext)\n}\n\n// Controls tell their Field what they are, so FieldLabel can point at the right thing.\n// 'single': one input that takes the Field id (Input, Textarea, a bare Checkbox / Switch);\n//   FieldLabel targets it with htmlFor.\n// 'group': a Checkbox / Switch with its own label keeps a unique id; the Field becomes\n//   role=\"group\" named by FieldLabel instead of every item sharing one id.\n// 'labelled': a RadioGroup names itself from FieldLabel (aria-labelledby).\n// A single input wins: with one present, FieldLabel keeps pointing at it.\nfunction useFieldControl(kind: FieldControlKind, enabled: boolean) {\n  const context = useFieldContext()\n  const register = context?.registerControl\n  React.useEffect(() => {\n    if (!enabled || !register) return\n    return register(kind)\n  }, [enabled, register, kind])\n}\n\n// Field wrapper\nconst fieldVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      none: 'gap-0',\n      xs: 'gap-1',\n      sm: 'gap-1.5',\n      default: 'gap-2',\n      lg: 'gap-3',\n    },\n  },\n  defaultVariants: {\n    gap: 'default',\n  },\n})\n\nexport interface FieldProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof fieldVariants> {\n  error?: boolean\n  disabled?: boolean\n}\n\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n  ({ className, gap, error, disabled, children, ...props }, ref) => {\n    const id = React.useId()\n    const labelId = `${id}-label`\n    const [labelCount, setLabelCount] = React.useState(0)\n    const [requiredCount, setRequiredCount] = React.useState(0)\n    const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 })\n\n    const registerLabel = React.useCallback(() => {\n      setLabelCount((n) => n + 1)\n      return () => setLabelCount((n) => n - 1)\n    }, [])\n    const registerRequired = React.useCallback(() => {\n      setRequiredCount((n) => n + 1)\n      return () => setRequiredCount((n) => n - 1)\n    }, [])\n    const registerControl = React.useCallback((kind: FieldControlKind) => {\n      setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }))\n      return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }))\n    }, [])\n\n    const hasLabel = labelCount > 0\n    const required = requiredCount > 0\n    const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0)\n    const asGroup = counts.single === 0 && counts.group > 0\n    const contextValue = React.useMemo(\n      () => ({ id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl }),\n      [id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl]\n    )\n\n    return (\n      <FieldContext.Provider value={contextValue}>\n        <div\n          ref={ref}\n          role={asGroup ? 'group' : undefined}\n          aria-labelledby={asGroup && hasLabel ? labelId : undefined}\n          className={cn(fieldVariants({ gap }), className)}\n          data-error={error || undefined}\n          data-disabled={disabled || undefined}\n          {...props}\n        >\n          {children}\n        </div>\n      </FieldContext.Provider>\n    )\n  }\n)\nField.displayName = 'Field'\n\n// Field Label\nexport interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean\n  /** Text of the required badge shown when `required` is set */\n  requiredLabel?: React.ReactNode\n}\n\nconst FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n  ({ className, required, requiredLabel = '必須', children, ...props }, ref) => {\n    const context = useFieldContext()\n    const registerLabel = context?.registerLabel\n    React.useEffect(() => registerLabel?.(), [registerLabel])\n    const registerRequired = context?.registerRequired\n    React.useEffect(() => (required ? registerRequired?.() : undefined), [required, registerRequired])\n\n    return (\n      <label\n        ref={ref}\n        id={context?.labelId}\n        // Grouped controls have their own labels; the group title targets no input\n        htmlFor={context && !context.isGroup ? context.id : undefined}\n        className={cn(\n          'text-md font-semibold text-foreground', // 14px - primary field identifier\n          context?.disabled && 'opacity-50 cursor-not-allowed',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {required && (\n          // Neutral badge, not the error color: red stays reserved for errors.\n          // Inside a Field the single control carries aria-required, so the badge is hidden\n          // from assistive technology there to avoid announcing \"required\" twice.\n          <span\n            aria-hidden={context && !context.isGroup ? true : undefined}\n            className=\"ml-1.5 inline-flex h-5 items-center rounded px-1.5 align-middle text-2xs font-semibold whitespace-nowrap bg-background-muted text-text-muted\"\n          >\n            {requiredLabel}\n          </span>\n        )}\n      </label>\n    )\n  }\n)\nFieldLabel.displayName = 'FieldLabel'\n\n// Field Error\nconst FieldError = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const context = useFieldContext()\n\n  if (!children) return null\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-error` : undefined}\n      role=\"alert\"\n      className={cn('text-xs text-error pl-1', className)} // 12px - color-distinguished, left-aligned with input text\n      {...props}\n    >\n      {children}\n    </p>\n  )\n})\nFieldError.displayName = 'FieldError'\n\n// Field Character Count\nconst FieldCharCount = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const context = useFieldContext()\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-charcount` : undefined}\n      className={cn(\n        'text-xs text-text-muted text-right pr-1 -mt-1', // 12px - right-aligned, 4px gap from input (gap-2 8px - mt-1 4px)\n        context?.disabled && 'opacity-50',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nFieldCharCount.displayName = 'FieldCharCount'\n\nexport { Field, FieldLabel, FieldError, FieldCharCount, useFieldContext, useFieldControl }\n"],"mappings":"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","names":[]}

package/dist/components/ui/field.mjs

@@ -34,21 +34,27 @@ const Field = React.forwardRef(
     const id = React.useId();
     const labelId = `${id}-label`;
     const [labelCount, setLabelCount] = React.useState(0);
+    const [requiredCount, setRequiredCount] = React.useState(0);
     const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 });
     const registerLabel = React.useCallback(() => {
       setLabelCount((n) => n + 1);
       return () => setLabelCount((n) => n - 1);
     }, []);
+    const registerRequired = React.useCallback(() => {
+      setRequiredCount((n) => n + 1);
+      return () => setRequiredCount((n) => n - 1);
+    }, []);
     const registerControl = React.useCallback((kind) => {
       setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }));
       return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }));
     }, []);
     const hasLabel = labelCount > 0;
+    const required = requiredCount > 0;
     const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0);
     const asGroup = counts.single === 0 && counts.group > 0;
     const contextValue = React.useMemo(
-      () => ({ id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl }),
-      [id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl]
+      () => ({ id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl }),
+      [id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl]
     );
     return /* @__PURE__ */ jsx(FieldContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
       "div",
@@ -67,10 +73,12 @@ const Field = React.forwardRef(
 );
 Field.displayName = "Field";
 const FieldLabel = React.forwardRef(
-  ({ className, required, children, ...props }, ref) => {
+  ({ className, required, requiredLabel = "\u5FC5\u9808", children, ...props }, ref) => {
     const context = useFieldContext();
     const registerLabel = context?.registerLabel;
     React.useEffect(() => registerLabel?.(), [registerLabel]);
+    const registerRequired = context?.registerRequired;
+    React.useEffect(() => required ? registerRequired?.() : void 0, [required, registerRequired]);
     return /* @__PURE__ */ jsxs(
       "label",
       {
@@ -86,7 +94,17 @@ const FieldLabel = React.forwardRef(
         ...props,
         children: [
           children,
-          required && /* @__PURE__ */ jsx("span", { className: "text-error ml-0.5", children: "*" })
+          required && // Neutral badge, not the error color: red stays reserved for errors.
+          // Inside a Field the single control carries aria-required, so the badge is hidden
+          // from assistive technology there to avoid announcing "required" twice.
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              "aria-hidden": context && !context.isGroup ? true : void 0,
+              className: "ml-1.5 inline-flex h-5 items-center rounded px-1.5 align-middle text-2xs font-semibold whitespace-nowrap bg-background-muted text-text-muted",
+              children: requiredLabel
+            }
+          )
         ]
       }
     );

package/dist/components/ui/field.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Field Context for sharing state between components\ninterface FieldContextValue {\n  id: string\n  /** id of the FieldLabel, for aria-labelledby on grouped controls */\n  labelId: string\n  error?: boolean\n  disabled?: boolean\n  /** A FieldLabel is rendered inside this Field */\n  hasLabel: boolean\n  /** The Field holds labelled checkboxes / switches / a radio group and no single input */\n  isGroup: boolean\n  registerLabel: () => () => void\n  registerControl: (kind: FieldControlKind) => () => void\n}\n\ntype FieldControlKind = 'single' | 'group' | 'labelled'\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nfunction useFieldContext() {\n  return React.useContext(FieldContext)\n}\n\n// Controls tell their Field what they are, so FieldLabel can point at the right thing.\n// 'single': one input that takes the Field id (Input, Textarea, a bare Checkbox / Switch);\n//   FieldLabel targets it with htmlFor.\n// 'group': a Checkbox / Switch with its own label keeps a unique id; the Field becomes\n//   role=\"group\" named by FieldLabel instead of every item sharing one id.\n// 'labelled': a RadioGroup names itself from FieldLabel (aria-labelledby).\n// A single input wins: with one present, FieldLabel keeps pointing at it.\nfunction useFieldControl(kind: FieldControlKind, enabled: boolean) {\n  const context = useFieldContext()\n  const register = context?.registerControl\n  React.useEffect(() => {\n    if (!enabled || !register) return\n    return register(kind)\n  }, [enabled, register, kind])\n}\n\n// Field wrapper\nconst fieldVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      none: 'gap-0',\n      xs: 'gap-1',\n      sm: 'gap-1.5',\n      default: 'gap-2',\n      lg: 'gap-3',\n    },\n  },\n  defaultVariants: {\n    gap: 'default',\n  },\n})\n\nexport interface FieldProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof fieldVariants> {\n  error?: boolean\n  disabled?: boolean\n}\n\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n  ({ className, gap, error, disabled, children, ...props }, ref) => {\n    const id = React.useId()\n    const labelId = `${id}-label`\n    const [labelCount, setLabelCount] = React.useState(0)\n    const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 })\n\n    const registerLabel = React.useCallback(() => {\n      setLabelCount((n) => n + 1)\n      return () => setLabelCount((n) => n - 1)\n    }, [])\n    const registerControl = React.useCallback((kind: FieldControlKind) => {\n      setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }))\n      return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }))\n    }, [])\n\n    const hasLabel = labelCount > 0\n    const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0)\n    const asGroup = counts.single === 0 && counts.group > 0\n    const contextValue = React.useMemo(\n      () => ({ id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl }),\n      [id, labelId, error, disabled, hasLabel, isGroup, registerLabel, registerControl]\n    )\n\n    return (\n      <FieldContext.Provider value={contextValue}>\n        <div\n          ref={ref}\n          role={asGroup ? 'group' : undefined}\n          aria-labelledby={asGroup && hasLabel ? labelId : undefined}\n          className={cn(fieldVariants({ gap }), className)}\n          data-error={error || undefined}\n          data-disabled={disabled || undefined}\n          {...props}\n        >\n          {children}\n        </div>\n      </FieldContext.Provider>\n    )\n  }\n)\nField.displayName = 'Field'\n\n// Field Label\nexport interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean\n}\n\nconst FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n  ({ className, required, children, ...props }, ref) => {\n    const context = useFieldContext()\n    const registerLabel = context?.registerLabel\n    React.useEffect(() => registerLabel?.(), [registerLabel])\n\n    return (\n      <label\n        ref={ref}\n        id={context?.labelId}\n        // Grouped controls have their own labels; the group title targets no input\n        htmlFor={context && !context.isGroup ? context.id : undefined}\n        className={cn(\n          'text-md font-semibold text-foreground', // 14px - primary field identifier\n          context?.disabled && 'opacity-50 cursor-not-allowed',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {required && <span className=\"text-error ml-0.5\">*</span>}\n      </label>\n    )\n  }\n)\nFieldLabel.displayName = 'FieldLabel'\n\n// Field Error\nconst FieldError = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const context = useFieldContext()\n\n  if (!children) return null\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-error` : undefined}\n      role=\"alert\"\n      className={cn('text-xs text-error pl-1', className)} // 12px - color-distinguished, left-aligned with input text\n      {...props}\n    >\n      {children}\n    </p>\n  )\n})\nFieldError.displayName = 'FieldError'\n\n// Field Character Count\nconst FieldCharCount = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const context = useFieldContext()\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-charcount` : undefined}\n      className={cn(\n        'text-xs text-text-muted text-right pr-1 -mt-1', // 12px - right-aligned, 4px gap from input (gap-2 8px - mt-1 4px)\n        context?.disabled && 'opacity-50',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nFieldCharCount.displayName = 'FieldCharCount'\n\nexport { Field, FieldLabel, FieldError, FieldCharCount, useFieldContext, useFieldControl }\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Field Context for sharing state between components\ninterface FieldContextValue {\n  id: string\n  /** id of the FieldLabel, for aria-labelledby on grouped controls */\n  labelId: string\n  error?: boolean\n  disabled?: boolean\n  /** A FieldLabel is rendered inside this Field */\n  hasLabel: boolean\n  /** The Field holds labelled checkboxes / switches / a radio group and no single input */\n  isGroup: boolean\n  /** The FieldLabel is marked required; single controls set aria-required */\n  required: boolean\n  registerLabel: () => () => void\n  registerRequired: () => () => void\n  registerControl: (kind: FieldControlKind) => () => void\n}\n\ntype FieldControlKind = 'single' | 'group' | 'labelled'\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nfunction useFieldContext() {\n  return React.useContext(FieldContext)\n}\n\n// Controls tell their Field what they are, so FieldLabel can point at the right thing.\n// 'single': one input that takes the Field id (Input, Textarea, a bare Checkbox / Switch);\n//   FieldLabel targets it with htmlFor.\n// 'group': a Checkbox / Switch with its own label keeps a unique id; the Field becomes\n//   role=\"group\" named by FieldLabel instead of every item sharing one id.\n// 'labelled': a RadioGroup names itself from FieldLabel (aria-labelledby).\n// A single input wins: with one present, FieldLabel keeps pointing at it.\nfunction useFieldControl(kind: FieldControlKind, enabled: boolean) {\n  const context = useFieldContext()\n  const register = context?.registerControl\n  React.useEffect(() => {\n    if (!enabled || !register) return\n    return register(kind)\n  }, [enabled, register, kind])\n}\n\n// Field wrapper\nconst fieldVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      none: 'gap-0',\n      xs: 'gap-1',\n      sm: 'gap-1.5',\n      default: 'gap-2',\n      lg: 'gap-3',\n    },\n  },\n  defaultVariants: {\n    gap: 'default',\n  },\n})\n\nexport interface FieldProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof fieldVariants> {\n  error?: boolean\n  disabled?: boolean\n}\n\nconst Field = React.forwardRef<HTMLDivElement, FieldProps>(\n  ({ className, gap, error, disabled, children, ...props }, ref) => {\n    const id = React.useId()\n    const labelId = `${id}-label`\n    const [labelCount, setLabelCount] = React.useState(0)\n    const [requiredCount, setRequiredCount] = React.useState(0)\n    const [counts, setCounts] = React.useState({ single: 0, group: 0, labelled: 0 })\n\n    const registerLabel = React.useCallback(() => {\n      setLabelCount((n) => n + 1)\n      return () => setLabelCount((n) => n - 1)\n    }, [])\n    const registerRequired = React.useCallback(() => {\n      setRequiredCount((n) => n + 1)\n      return () => setRequiredCount((n) => n - 1)\n    }, [])\n    const registerControl = React.useCallback((kind: FieldControlKind) => {\n      setCounts((c) => ({ ...c, [kind]: c[kind] + 1 }))\n      return () => setCounts((c) => ({ ...c, [kind]: c[kind] - 1 }))\n    }, [])\n\n    const hasLabel = labelCount > 0\n    const required = requiredCount > 0\n    const isGroup = counts.single === 0 && (counts.group > 0 || counts.labelled > 0)\n    const asGroup = counts.single === 0 && counts.group > 0\n    const contextValue = React.useMemo(\n      () => ({ id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl }),\n      [id, labelId, error, disabled, hasLabel, isGroup, required, registerLabel, registerRequired, registerControl]\n    )\n\n    return (\n      <FieldContext.Provider value={contextValue}>\n        <div\n          ref={ref}\n          role={asGroup ? 'group' : undefined}\n          aria-labelledby={asGroup && hasLabel ? labelId : undefined}\n          className={cn(fieldVariants({ gap }), className)}\n          data-error={error || undefined}\n          data-disabled={disabled || undefined}\n          {...props}\n        >\n          {children}\n        </div>\n      </FieldContext.Provider>\n    )\n  }\n)\nField.displayName = 'Field'\n\n// Field Label\nexport interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean\n  /** Text of the required badge shown when `required` is set */\n  requiredLabel?: React.ReactNode\n}\n\nconst FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n  ({ className, required, requiredLabel = '必須', children, ...props }, ref) => {\n    const context = useFieldContext()\n    const registerLabel = context?.registerLabel\n    React.useEffect(() => registerLabel?.(), [registerLabel])\n    const registerRequired = context?.registerRequired\n    React.useEffect(() => (required ? registerRequired?.() : undefined), [required, registerRequired])\n\n    return (\n      <label\n        ref={ref}\n        id={context?.labelId}\n        // Grouped controls have their own labels; the group title targets no input\n        htmlFor={context && !context.isGroup ? context.id : undefined}\n        className={cn(\n          'text-md font-semibold text-foreground', // 14px - primary field identifier\n          context?.disabled && 'opacity-50 cursor-not-allowed',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {required && (\n          // Neutral badge, not the error color: red stays reserved for errors.\n          // Inside a Field the single control carries aria-required, so the badge is hidden\n          // from assistive technology there to avoid announcing \"required\" twice.\n          <span\n            aria-hidden={context && !context.isGroup ? true : undefined}\n            className=\"ml-1.5 inline-flex h-5 items-center rounded px-1.5 align-middle text-2xs font-semibold whitespace-nowrap bg-background-muted text-text-muted\"\n          >\n            {requiredLabel}\n          </span>\n        )}\n      </label>\n    )\n  }\n)\nFieldLabel.displayName = 'FieldLabel'\n\n// Field Error\nconst FieldError = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const context = useFieldContext()\n\n  if (!children) return null\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-error` : undefined}\n      role=\"alert\"\n      className={cn('text-xs text-error pl-1', className)} // 12px - color-distinguished, left-aligned with input text\n      {...props}\n    >\n      {children}\n    </p>\n  )\n})\nFieldError.displayName = 'FieldError'\n\n// Field Character Count\nconst FieldCharCount = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const context = useFieldContext()\n\n  return (\n    <p\n      ref={ref}\n      id={context ? `${context.id}-charcount` : undefined}\n      className={cn(\n        'text-xs text-text-muted text-right pr-1 -mt-1', // 12px - right-aligned, 4px gap from input (gap-2 8px - mt-1 4px)\n        context?.disabled && 'opacity-50',\n        className\n      )}\n      {...props}\n    />\n  )\n})\nFieldCharCount.displayName = 'FieldCharCount'\n\nexport { Field, FieldLabel, FieldError, FieldCharCount, useFieldContext, useFieldControl }\n"],"mappings":"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","names":[]}

package/dist/components/ui/icon-button.d.mts

@@ -5,8 +5,8 @@ import { ButtonColor } from './button.mjs';
 
 declare const iconButtonVariants: (props?: ({
     variant?: "outline" | "solid" | "subtle" | "ghost" | null | undefined;
-    size?: "default" | "sm" | "lg" | "md" | "xs" | null | undefined;
-    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "md" | null | undefined;
+    radius?: "sm" | "default" | "lg" | "xl" | "2xl" | "base" | "none" | "3xl" | "full" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof iconButtonVariants> {
     /** Solid variant color */

package/dist/components/ui/icon-button.d.ts

@@ -5,8 +5,8 @@ import { ButtonColor } from './button.js';
 
 declare const iconButtonVariants: (props?: ({
     variant?: "outline" | "solid" | "subtle" | "ghost" | null | undefined;
-    size?: "default" | "sm" | "lg" | "md" | "xs" | null | undefined;
-    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "md" | null | undefined;
+    radius?: "sm" | "default" | "lg" | "xl" | "2xl" | "base" | "none" | "3xl" | "full" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof iconButtonVariants> {
     /** Solid variant color */

package/dist/components/ui/input.d.mts

@@ -5,8 +5,8 @@ import { VariantProps } from 'class-variance-authority';
 declare const inputVariants: (props?: ({
     variant?: "default" | "filled" | null | undefined;
     focusRing?: boolean | null | undefined;
-    size?: "default" | "sm" | "lg" | "xl" | "xs" | null | undefined;
-    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
+    radius?: "sm" | "default" | "lg" | "xl" | "2xl" | "base" | "none" | "3xl" | "full" | null | undefined;
     state?: "default" | "error" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {

package/dist/components/ui/input.d.ts

@@ -5,8 +5,8 @@ import { VariantProps } from 'class-variance-authority';
 declare const inputVariants: (props?: ({
     variant?: "default" | "filled" | null | undefined;
     focusRing?: boolean | null | undefined;
-    size?: "default" | "sm" | "lg" | "xl" | "xs" | null | undefined;
-    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
+    radius?: "sm" | "default" | "lg" | "xl" | "2xl" | "base" | "none" | "3xl" | "full" | null | undefined;
     state?: "default" | "error" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {

package/dist/components/ui/input.js

@@ -213,6 +213,7 @@ const Input = React.forwardRef(
               className
             ),
             "aria-invalid": resolvedError || void 0,
+            "aria-required": fieldContext?.required || void 0,
             "aria-describedby": ariaDescribedBy,
             disabled: isDisabled,
             ref,
@@ -238,6 +239,7 @@ const Input = React.forwardRef(
           className
         ),
         "aria-invalid": resolvedError || void 0,
+        "aria-required": fieldContext?.required || void 0,
         "aria-describedby": ariaDescribedBy,
         disabled: isDisabled,
         ref,