@alneas/appkit-react 0.1.0 → 0.3.0

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.js","names":["MenuPrimitive","React","React$1","Menu$1","DropdownMenu","props","DropdownMenuPortal","DropdownMenuTrigger","DropdownMenuContent","cn","className","DropdownMenuGroup","DropdownMenuLabel","inset","DropdownMenuItem","variant","DropdownMenuSub","DropdownMenuSubTrigger","children","ChevronRightIcon","DropdownMenuSubContent","DropdownMenuCheckboxItem","CheckIcon","DropdownMenuRadioGroup","DropdownMenuRadioItem","DropdownMenuSeparator","DropdownMenuShortcut"],"sources":["../../../../src/ui/components/ui/dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { ChevronRightIcon, CheckIcon } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * ドロップダウンメニューのルートコンポーネント。\n */\nfunction DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {\n  return <MenuPrimitive.Root data-slot='dropdown-menu' {...props} />;\n}\n\n/**\n * メニュー要素をポータル経由でDOMの別の場所に描画するためのコンポーネント。\n */\nfunction DropdownMenuPortal({ ...props }: MenuPrimitive.Portal.Props) {\n  return <MenuPrimitive.Portal data-slot='dropdown-menu-portal' {...props} />;\n}\n\n/**\n * ドロップダウンメニューを開くためのトリガーボタン。\n */\nfunction DropdownMenuTrigger({\n  children,\n  ...props\n}: MenuPrimitive.Trigger.Props) {\n  return (\n    <MenuPrimitive.Trigger\n      data-slot='dropdown-menu-trigger'\n      {...props}\n    >\n      {children}\n    </MenuPrimitive.Trigger>\n  );\n}\n\nconst DropdownMenuContent = React.forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.Popup.Props &\n    Pick<MenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>\n>(\n  (\n    { className, align = 'start', alignOffset = 0, side = 'bottom', sideOffset = 4, ...props },\n    ref,\n  ) => (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        className='isolate z-50 outline-none'\n        align={align}\n        alignOffset={alignOffset}\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <MenuPrimitive.Popup\n          ref={ref}\n          data-slot='dropdown-menu-content'\n          className={cn(\n            'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-32 rounded-lg p-1 shadow-md ring-1 duration-100 z-50 max-h-(--available-height) w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto outline-none data-closed:overflow-hidden',\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  ),\n);\nDropdownMenuContent.displayName = MenuPrimitive.Popup.displayName;\n\n/**\n * メニューアイテムを論理的なグループにまとめるためのコンポーネント。\n */\nfunction DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props) {\n  return <MenuPrimitive.Group data-slot='dropdown-menu-group' {...props} />;\n}\n\nconst DropdownMenuLabel = React.forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.GroupLabel.Props & { inset?: boolean }\n>(({ className, inset, ...props }, ref) => (\n  <MenuPrimitive.GroupLabel\n    ref={ref}\n    data-slot='dropdown-menu-label'\n    data-inset={inset}\n    className={cn(\n      'text-muted-foreground px-1.5 py-1 text-xs font-medium data-[inset]:pl-8',\n      className,\n    )}\n    {...props}\n  />\n));\nDropdownMenuLabel.displayName = MenuPrimitive.GroupLabel.displayName;\n\nconst DropdownMenuItem = React.forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.Item.Props & {\n    inset?: boolean;\n    variant?: 'default' | 'destructive';\n  }\n>(({ className, inset, variant = 'default', children, ...props }, ref) => (\n  <MenuPrimitive.Item\n    ref={ref}\n    data-slot='dropdown-menu-item'\n    data-inset={inset}\n    data-variant={variant}\n    className={cn(\n      \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm [&_svg:not([class*='size-'])]:size-4 group/dropdown-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n      className,\n    )}\n    {...props}\n  >\n    {children}\n  </MenuPrimitive.Item>\n));\nDropdownMenuItem.displayName = MenuPrimitive.Item.displayName;\n\n/**\n * サブメニュー（入れ子になったメニュー）用のルートコンポーネント。\n */\nfunction DropdownMenuSub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {\n  return <MenuPrimitive.SubmenuRoot data-slot='dropdown-menu-sub' {...props} />;\n}\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.SubmenuTrigger.Props & { inset?: boolean }\n>(({ className, inset, children, ...props }, ref) => (\n  <MenuPrimitive.SubmenuTrigger\n    ref={ref}\n    data-slot='dropdown-menu-sub-trigger'\n    data-inset={inset}\n    className={cn(\n      \"focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm [&_svg:not([class*='size-'])]:size-4 flex cursor-default items-center outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRightIcon className='ml-auto' />\n  </MenuPrimitive.SubmenuTrigger>\n));\nDropdownMenuSubTrigger.displayName = MenuPrimitive.SubmenuTrigger.displayName;\n\nconst DropdownMenuSubContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuContent>\n>(\n  (\n    { className, align = 'start', alignOffset = -3, side = 'right', sideOffset = 0, ...props },\n    ref,\n  ) => (\n    <DropdownMenuContent\n      ref={ref}\n      data-slot='dropdown-menu-sub-content'\n      className={cn(\n        'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-[96px] rounded-md p-1 shadow-lg ring-1 duration-100 w-auto',\n        className,\n      )}\n      align={align}\n      alignOffset={alignOffset}\n      side={side}\n      sideOffset={sideOffset}\n      {...props}\n    />\n  ),\n);\nDropdownMenuSubContent.displayName = 'DropdownMenuSubContent';\n\nconst DropdownMenuCheckboxItem = React.forwardRef<HTMLDivElement, MenuPrimitive.CheckboxItem.Props>(\n  ({ className, children, checked, ...props }, ref) => (\n    <MenuPrimitive.CheckboxItem\n      ref={ref}\n      data-slot='dropdown-menu-checkbox-item'\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span\n        className='pointer-events-none absolute right-2 flex items-center justify-center pointer-events-none'\n        data-slot='dropdown-menu-checkbox-item-indicator'\n      >\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  ),\n);\nDropdownMenuCheckboxItem.displayName = MenuPrimitive.CheckboxItem.displayName;\n\n/**\n * 選択状態を共有し、単一選択（ラジオ）可能なアイテムをグループ化するコンポーネント。\n */\nfunction DropdownMenuRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n  return <MenuPrimitive.RadioGroup data-slot='dropdown-menu-radio-group' {...props} />;\n}\n\nconst DropdownMenuRadioItem = React.forwardRef<HTMLDivElement, MenuPrimitive.RadioItem.Props>(\n  ({ className, children, ...props }, ref) => (\n    <MenuPrimitive.RadioItem\n      ref={ref}\n      data-slot='dropdown-menu-radio-item'\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className='pointer-events-none absolute right-2 flex items-center justify-center pointer-events-none'\n        data-slot='dropdown-menu-radio-item-indicator'\n      >\n        <MenuPrimitive.RadioItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  ),\n);\nDropdownMenuRadioItem.displayName = MenuPrimitive.RadioItem.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<HTMLDivElement, MenuPrimitive.Separator.Props>(\n  ({ className, ...props }, ref) => (\n    <MenuPrimitive.Separator\n      ref={ref}\n      data-slot='dropdown-menu-separator'\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  ),\n);\nDropdownMenuSeparator.displayName = MenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = React.forwardRef<HTMLSpanElement, React.ComponentProps<'span'>>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      data-slot='dropdown-menu-shortcut'\n      className={cn(\n        'text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut';\n\nexport {\n  DropdownMenu,\n  DropdownMenuPortal,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuLabel,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n};\n"],"mappings":"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"}
+{"version":3,"file":"dropdown-menu.js","names":["MenuPrimitive","Menu$1","DropdownMenu","props","DropdownMenuPortal","DropdownMenuTrigger","DropdownMenuContent","cn","className","DropdownMenuGroup","DropdownMenuLabel","inset","DropdownMenuItem","variant","DropdownMenuSub","DropdownMenuSubTrigger","children","ChevronRightIcon","DropdownMenuSubContent","DropdownMenuCheckboxItem","CheckIcon","DropdownMenuRadioGroup","DropdownMenuRadioItem","DropdownMenuSeparator","DropdownMenuShortcut"],"sources":["../../../../src/ui/components/ui/dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { ChevronRightIcon, CheckIcon } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates popup menu state and focus behavior.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenu composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {\n  return <MenuPrimitive.Root data-slot='dropdown-menu' {...props} />;\n}\n\n/**\n * Mounts menu descendants in a separate DOM container.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuPortal composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuPortal({ ...props }: MenuPrimitive.Portal.Props) {\n  return <MenuPrimitive.Portal data-slot='dropdown-menu-portal' {...props} />;\n}\n\n/**\n * Renders the control or context target that opens a menu.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuTrigger({\n  children,\n  ...props\n}: MenuPrimitive.Trigger.Props) {\n  return (\n    <MenuPrimitive.Trigger\n      data-slot='dropdown-menu-trigger'\n      {...props}\n    >\n      {children}\n    </MenuPrimitive.Trigger>\n  );\n}\n\n/**\n * Portals the menu popup through its positioned container.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: align='start', alignOffset=0, side='bottom', sideOffset=4.\n * @returns The rendered DropdownMenuContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuContent({\n  ref,\n  className,\n  align = 'start',\n  alignOffset = 0,\n  side = 'bottom',\n  sideOffset = 4,\n  ...props\n}: React.PropsWithoutRef<\n  MenuPrimitive.Popup.Props &\n    Pick<MenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        className='isolate z-50 outline-none'\n        align={align}\n        alignOffset={alignOffset}\n        side={side}\n        sideOffset={sideOffset}\n      >\n        <MenuPrimitive.Popup\n          ref={ref}\n          data-slot='dropdown-menu-content'\n          className={cn(\n            'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-32 rounded-lg p-1 shadow-md ring-1 duration-100 z-50 max-h-(--available-height) w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto outline-none data-closed:overflow-hidden',\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  );\n}\nDropdownMenuContent.displayName = MenuPrimitive.Popup.displayName;\n\n/**\n * Groups related menu actions.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props) {\n  return <MenuPrimitive.Group data-slot='dropdown-menu-group' {...props} />;\n}\n\n/**\n * Renders the accessible label of a menu group with optional inset spacing.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuLabel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuLabel({\n  ref,\n  className,\n  inset,\n  ...props\n}: React.PropsWithoutRef<\n  MenuPrimitive.GroupLabel.Props & {\n    /**\n     * Adds left inset spacing when true; omitted/false uses normal alignment.\n     */\n    /**\n     * Adds left inset spacing when true; omitted/false uses normal alignment.\n     */\n    inset?: boolean;\n  }\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.GroupLabel\n      ref={ref}\n      data-slot='dropdown-menu-label'\n      data-inset={inset}\n      className={cn(\n        'text-muted-foreground px-1.5 py-1 text-xs font-medium data-[inset]:pl-8',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nDropdownMenuLabel.displayName = MenuPrimitive.GroupLabel.displayName;\n\n/**\n * Renders a menu action with optional destructive styling and inset spacing.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: variant='default'.\n * @returns The rendered DropdownMenuItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuItem({\n  ref,\n  className,\n  inset,\n  variant = 'default',\n  children,\n  ...props\n}: React.PropsWithoutRef<\n  MenuPrimitive.Item.Props & {\n    /**\n     * Adds left inset spacing when true; omitted/false uses normal alignment.\n     */\n    inset?: boolean;\n    /**\n     * Visual treatment from the declared variant union; changing it does not alter host action semantics.\n     */\n    variant?: 'default' | 'destructive';\n  }\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.Item\n      ref={ref}\n      data-slot='dropdown-menu-item'\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm [&_svg:not([class*='size-'])]:size-4 group/dropdown-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </MenuPrimitive.Item>\n  );\n}\nDropdownMenuItem.displayName = MenuPrimitive.Item.displayName;\n\n/**\n * Coordinates a submenu nested inside a parent menu.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuSub composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuSub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {\n  return <MenuPrimitive.SubmenuRoot data-slot='dropdown-menu-sub' {...props} />;\n}\n\n/**\n * Renders a submenu opener with a trailing chevron.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuSubTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuSubTrigger({\n  ref,\n  className,\n  inset,\n  children,\n  ...props\n}: React.PropsWithoutRef<\n  MenuPrimitive.SubmenuTrigger.Props & {\n    /**\n     * Adds left inset spacing when true; omitted/false uses normal alignment.\n     */\n    /**\n     * Adds left inset spacing when true; omitted/false uses normal alignment.\n     */\n    inset?: boolean;\n  }\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.SubmenuTrigger\n      ref={ref}\n      data-slot='dropdown-menu-sub-trigger'\n      data-inset={inset}\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm [&_svg:not([class*='size-'])]:size-4 flex cursor-default items-center outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronRightIcon className='ml-auto' />\n    </MenuPrimitive.SubmenuTrigger>\n  );\n}\nDropdownMenuSubTrigger.displayName = MenuPrimitive.SubmenuTrigger.displayName;\n\n/**\n * Renders a positioned submenu popup.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: align='start', alignOffset=-3, side='right', sideOffset=0.\n * @returns The rendered DropdownMenuSubContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuSubContent({\n  ref,\n  className,\n  align = 'start',\n  alignOffset = -3,\n  side = 'right',\n  sideOffset = 0,\n  ...props\n}: React.PropsWithoutRef<React.ComponentPropsWithoutRef<typeof DropdownMenuContent>> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <DropdownMenuContent\n      ref={ref}\n      data-slot='dropdown-menu-sub-content'\n      className={cn(\n        'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-[96px] rounded-md p-1 shadow-lg ring-1 duration-100 w-auto',\n        className,\n      )}\n      align={align}\n      alignOffset={alignOffset}\n      side={side}\n      sideOffset={sideOffset}\n      {...props}\n    />\n  );\n}\nDropdownMenuSubContent.displayName = 'DropdownMenuSubContent';\n\n/**\n * Renders a checked menu action with a checkmark indicator.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuCheckboxItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuCheckboxItem({\n  ref,\n  className,\n  children,\n  checked,\n  ...props\n}: React.PropsWithoutRef<MenuPrimitive.CheckboxItem.Props> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      ref={ref}\n      data-slot='dropdown-menu-checkbox-item'\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span\n        className='pointer-events-none absolute right-2 flex items-center justify-center pointer-events-none'\n        data-slot='dropdown-menu-checkbox-item-indicator'\n      >\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  );\n}\nDropdownMenuCheckboxItem.displayName = MenuPrimitive.CheckboxItem.displayName;\n\n/**\n * Coordinates mutually exclusive menu choices.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuRadioGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n  return <MenuPrimitive.RadioGroup data-slot='dropdown-menu-radio-group' {...props} />;\n}\n\n/**\n * Renders one value in a menu radio group.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuRadioItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuRadioItem({\n  ref,\n  className,\n  children,\n  ...props\n}: React.PropsWithoutRef<MenuPrimitive.RadioItem.Props> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.RadioItem\n      ref={ref}\n      data-slot='dropdown-menu-radio-item'\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className='pointer-events-none absolute right-2 flex items-center justify-center pointer-events-none'\n        data-slot='dropdown-menu-radio-item-indicator'\n      >\n        <MenuPrimitive.RadioItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  );\n}\nDropdownMenuRadioItem.displayName = MenuPrimitive.RadioItem.displayName;\n\n/**\n * Draws a divider between menu sections.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuSeparator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuSeparator({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<MenuPrimitive.Separator.Props> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <MenuPrimitive.Separator\n      ref={ref}\n      data-slot='dropdown-menu-separator'\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  );\n}\nDropdownMenuSeparator.displayName = MenuPrimitive.Separator.displayName;\n\n/**\n * Styles a shortcut hint without installing keyboard listeners.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered DropdownMenuShortcut composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Items and popup parts require the matching DropdownMenu root. Put labels inside a Group and RadioItems inside RadioGroup. SubTrigger/SubContent require Sub under the parent menu. Content supplies its portal/positioner. inset adds left spacing when truthy; item variant defaults to default. Shortcut is presentational. Custom render composition follows Base UI; there is no asChild adapter. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuSeparator } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<DropdownMenu><DropdownMenuTrigger>Actions</DropdownMenuTrigger><DropdownMenuContent><DropdownMenuGroup><DropdownMenuLabel>Document</DropdownMenuLabel><DropdownMenuItem onClick={() => console.log(\"Open requested\")}>Open</DropdownMenuItem></DropdownMenuGroup><DropdownMenuSeparator /><DropdownMenuItem disabled>Unavailable</DropdownMenuItem></DropdownMenuContent></DropdownMenu>);\n * }\n * ```\n */\nfunction DropdownMenuShortcut({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<React.ComponentProps<'span'>> & React.RefAttributes<HTMLSpanElement>) {\n  return (\n    <span\n      ref={ref}\n      data-slot='dropdown-menu-shortcut'\n      className={cn(\n        'text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut';\n\nexport {\n  DropdownMenu,\n  DropdownMenuPortal,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuLabel,\n  DropdownMenuItem,\n  DropdownMenuCheckboxItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubTrigger,\n  DropdownMenuSubContent,\n};\n"],"mappings":"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"}

package/dist/ui/components/ui/empty.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.cjs","names":["cn","cva","require_ui_lib_utils","react_jsx_runtime","class_variance_authority","Empty","props","className","EmptyHeader","emptyMediaVariants","EmptyMedia","variant","EmptyTitle","EmptyDescription","EmptyContent"],"sources":["../../../../src/ui/components/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * データが空であることを示すプレースホルダー全体のコンテナ。\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty'\n      className={cn(\n        'gap-4 rounded-lg border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態で表示される見出しやアイコンをグループ化するヘッダー領域。\n */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-header'\n      className={cn('gap-2 flex max-w-sm flex-col items-center', className)}\n      {...props}\n    />\n  );\n}\n\nconst emptyMediaVariants = cva(\n  'mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        default: 'bg-transparent',\n        icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\n/**\n * 空の状態を視覚的に表すアイコンや画像を表示するコンポーネント。\n */\nfunction EmptyMedia({\n  className,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot='empty-icon'\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態で表示されるタイトル（件名）。\n */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-title'\n      className={cn('text-sm font-medium tracking-tight', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態に関する詳細な説明テキスト。\n */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot='empty-description'\n      className={cn(\n        'text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * ユーザーが次のアクションを実行するためのコンテンツ領域（ボタンなど）。\n */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-content'\n      className={cn(\n        'gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"A,gMAOA,SAASK,EAAM,CAAE,YAAW,GAAGC,GAAsC,CACnE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,QACV,UAAWH,EAAAA,GACT,8HACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAKA,SAASE,EAAY,CAAE,YAAW,GAAGF,GAAsC,CACzE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GAAG,4CAA6CO,CAAS,EACpE,GAAID,CACL,CAAA,CAEL,CAEA,IAAMG,GAAA,EAAqBR,EAAAA,IAAAA,CACzB,8FACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,2HACR,CACF,EACA,gBAAiB,CACf,QAAS,SACX,CACF,CACF,EAKA,SAASS,EAAW,CAClB,YACA,UAAU,UACV,GAAGJ,GACqE,CACxE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,aACV,eAAcQ,EACd,UAAWX,EAAAA,GAAGS,EAAmB,CAAE,UAAS,WAAU,CAAC,CAAC,EACxD,GAAIH,CACL,CAAA,CAEL,CAKA,SAASM,EAAW,CAAE,YAAW,GAAGN,GAAsC,CACxE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,cACV,UAAWH,EAAAA,GAAG,qCAAsCO,CAAS,EAC7D,GAAID,CACL,CAAA,CAEL,CAKA,SAASO,EAAiB,CAAE,YAAW,GAAGP,GAAoC,CAC5E,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,oBACV,UAAWH,EAAAA,GACT,0GACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAKA,SAASQ,EAAa,CAAE,YAAW,GAAGR,GAAsC,CAC1E,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,gBACV,UAAWH,EAAAA,GACT,kFACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,C"}
+{"version":3,"file":"empty.cjs","names":["cn","cva","require_ui_lib_utils","react_jsx_runtime","class_variance_authority","Empty","props","className","EmptyHeader","emptyMediaVariants","EmptyMedia","variant","EmptyTitle","EmptyDescription","EmptyContent"],"sources":["../../../../src/ui/components/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Lays out an empty-state panel with centered content.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered Empty composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty'\n      className={cn(\n        'gap-4 rounded-lg border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Groups the empty-state media, title and explanation.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyHeader composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-header'\n      className={cn('gap-2 flex max-w-sm flex-col items-center', className)}\n      {...props}\n    />\n  );\n}\n\nconst emptyMediaVariants = cva(\n  'mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  {\n    variants: {\n      /**\n       * Visual treatment selected by the consumer; these values change CSS classes only.\n       * Accepted values: default, icon.\n       * @defaultValue 'default'\n       * @see emptyMediaVariants\n       */\n      variant: {\n        default: 'bg-transparent',\n        icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\n/**\n * Styles empty-state media with an optional icon treatment.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling. Wrapper defaults: variant='default'.\n * @returns The rendered EmptyMedia composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyMedia({\n  className,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot='empty-icon'\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles an empty-state title without imposing a heading level.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyTitle composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-title'\n      className={cn('text-sm font-medium tracking-tight', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles the empty-state explanation and links.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyDescription composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot='empty-description'\n      className={cn(\n        'text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Constrains the width of empty-state actions or supplemental content.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-content'\n      className={cn(\n        'gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":"A,gMAmBA,SAASK,EAAM,CAAE,YAAW,GAAGC,GAAsC,CACnE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,QACV,UAAWH,EAAAA,GACT,8HACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAiBA,SAASE,EAAY,CAAE,YAAW,GAAGF,GAAsC,CACzE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,eACV,UAAWH,EAAAA,GAAG,4CAA6CO,CAAS,EACpE,GAAID,CACL,CAAA,CAEL,CAEA,IAAMG,GAAA,EAAqBR,EAAAA,IAAAA,CACzB,8FACA,CACE,SAAU,CAOR,QAAS,CACP,QAAS,iBACT,KAAM,2HACR,CACF,EACA,gBAAiB,CACf,QAAS,SACX,CACF,CACF,EAiBA,SAASS,EAAW,CAClB,YACA,UAAU,UACV,GAAGJ,GACqE,CACxE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,aACV,eAAcQ,EACd,UAAWX,EAAAA,GAAGS,EAAmB,CAAE,UAAS,WAAU,CAAC,CAAC,EACxD,GAAIH,CACL,CAAA,CAEL,CAiBA,SAASM,EAAW,CAAE,YAAW,GAAGN,GAAsC,CACxE,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,cACV,UAAWH,EAAAA,GAAG,qCAAsCO,CAAS,EAC7D,GAAID,CACL,CAAA,CAEL,CAiBA,SAASO,EAAiB,CAAE,YAAW,GAAGP,GAAoC,CAC5E,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,oBACV,UAAWH,EAAAA,GACT,0GACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAiBA,SAASQ,EAAa,CAAE,YAAW,GAAGR,GAAsC,CAC1E,OACE,EAAAH,EAAA,IAAA,CAAC,MAAD,CACE,YAAU,gBACV,UAAWH,EAAAA,GACT,kFACAO,CACF,EACA,GAAID,CACL,CAAA,CAEL,C"}

package/dist/ui/components/ui/empty.d.cts

@@ -1,29 +1,101 @@
 import { VariantProps } from 'class-variance-authority';
 /**
- * データが空であることを示すプレースホルダー全体のコンテナ。
+ * Lays out an empty-state panel with centered content.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered Empty composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function Empty({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 /**
- * 空の状態で表示される見出しやアイコンをグループ化するヘッダー領域。
+ * Groups the empty-state media, title and explanation.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyHeader composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyHeader({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 declare const emptyMediaVariants: (props?: ({
     variant?: "default" | "icon" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**
- * 空の状態を視覚的に表すアイコンや画像を表示するコンポーネント。
+ * Styles empty-state media with an optional icon treatment.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling. Wrapper defaults: variant='default'.
+ * @returns The rendered EmptyMedia composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): import('react').JSX.Element;
 /**
- * 空の状態で表示されるタイトル（件名）。
+ * Styles an empty-state title without imposing a heading level.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyTitle composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyTitle({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 /**
- * 空の状態に関する詳細な説明テキスト。
+ * Styles the empty-state explanation and links.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyDescription composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyDescription({ className, ...props }: React.ComponentProps<'p'>): import('react').JSX.Element;
 /**
- * ユーザーが次のアクションを実行するためのコンテンツ領域（ボタンなど）。
+ * Constrains the width of empty-state actions or supplemental content.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyContent composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyContent({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 export { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };

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

@@ -1,29 +1,101 @@
 import { VariantProps } from 'class-variance-authority';
 /**
- * データが空であることを示すプレースホルダー全体のコンテナ。
+ * Lays out an empty-state panel with centered content.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered Empty composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function Empty({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 /**
- * 空の状態で表示される見出しやアイコンをグループ化するヘッダー領域。
+ * Groups the empty-state media, title and explanation.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyHeader composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyHeader({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 declare const emptyMediaVariants: (props?: ({
     variant?: "default" | "icon" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**
- * 空の状態を視覚的に表すアイコンや画像を表示するコンポーネント。
+ * Styles empty-state media with an optional icon treatment.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling. Wrapper defaults: variant='default'.
+ * @returns The rendered EmptyMedia composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): import('react').JSX.Element;
 /**
- * 空の状態で表示されるタイトル（件名）。
+ * Styles an empty-state title without imposing a heading level.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyTitle composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyTitle({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 /**
- * 空の状態に関する詳細な説明テキスト。
+ * Styles the empty-state explanation and links.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyDescription composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyDescription({ className, ...props }: React.ComponentProps<'p'>): import('react').JSX.Element;
 /**
- * ユーザーが次のアクションを実行するためのコンテンツ領域（ボタンなど）。
+ * Constrains the width of empty-state actions or supplemental content.
+ * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.
+ * @returns The rendered EmptyContent composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.
+ * @example
+ * ```tsx
+ * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Empty><EmptyHeader><EmptyMedia variant="icon">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type="button">Create</button></EmptyContent></Empty>);
+ * }
+ * ```
  */
 declare function EmptyContent({ className, ...props }: React.ComponentProps<'div'>): import('react').JSX.Element;
 export { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };

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

@@ -1 +1 @@
-{"version":3,"file":"empty.js","names":["Empty","props","cn","className","EmptyHeader","emptyMediaVariants","cva","EmptyMedia","variant","EmptyTitle","EmptyDescription","EmptyContent"],"sources":["../../../../src/ui/components/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * データが空であることを示すプレースホルダー全体のコンテナ。\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty'\n      className={cn(\n        'gap-4 rounded-lg border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態で表示される見出しやアイコンをグループ化するヘッダー領域。\n */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-header'\n      className={cn('gap-2 flex max-w-sm flex-col items-center', className)}\n      {...props}\n    />\n  );\n}\n\nconst emptyMediaVariants = cva(\n  'mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        default: 'bg-transparent',\n        icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\n/**\n * 空の状態を視覚的に表すアイコンや画像を表示するコンポーネント。\n */\nfunction EmptyMedia({\n  className,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot='empty-icon'\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態で表示されるタイトル（件名）。\n */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-title'\n      className={cn('text-sm font-medium tracking-tight', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * 空の状態に関する詳細な説明テキスト。\n */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot='empty-description'\n      className={cn(\n        'text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * ユーザーが次のアクションを実行するためのコンテンツ領域（ボタンなど）。\n */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-content'\n      className={cn(\n        'gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":";;;;;AAOA,SAASA,EAAM,EAAE,cAAW,GAAGC,KAAsC;CACnE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,+HACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASG,EAAY,EAAE,cAAW,GAAGH,KAAsC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EAAG,6CAA6CC,CAAS;EACpE,GAAIF;CACL,CAAA;AAEL;AAEA,IAAMI,IAAqBC,EACzB,+FACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;CACR,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAKA,SAASC,EAAW,EAClB,cACA,aAAU,WACV,GAAGN,KACqE;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,gBAAcO;EACd,WAAWN,EAAGG,EAAmB;GAAE;GAAS;EAAU,CAAC,CAAC;EACxD,GAAIJ;CACL,CAAA;AAEL;AAKA,SAASQ,EAAW,EAAE,cAAW,GAAGR,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EAAG,sCAAsCC,CAAS;EAC7D,GAAIF;CACL,CAAA;AAEL;AAKA,SAASS,EAAiB,EAAE,cAAW,GAAGT,KAAoC;CAC5E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,2GACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASU,EAAa,EAAE,cAAW,GAAGV,KAAsC;CAC1E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,mFACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL"}
+{"version":3,"file":"empty.js","names":["Empty","props","cn","className","EmptyHeader","emptyMediaVariants","cva","EmptyMedia","variant","EmptyTitle","EmptyDescription","EmptyContent"],"sources":["../../../../src/ui/components/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Lays out an empty-state panel with centered content.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered Empty composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction Empty({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty'\n      className={cn(\n        'gap-4 rounded-lg border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Groups the empty-state media, title and explanation.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyHeader composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-header'\n      className={cn('gap-2 flex max-w-sm flex-col items-center', className)}\n      {...props}\n    />\n  );\n}\n\nconst emptyMediaVariants = cva(\n  'mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  {\n    variants: {\n      /**\n       * Visual treatment selected by the consumer; these values change CSS classes only.\n       * Accepted values: default, icon.\n       * @defaultValue 'default'\n       * @see emptyMediaVariants\n       */\n      variant: {\n        default: 'bg-transparent',\n        icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\n/**\n * Styles empty-state media with an optional icon treatment.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling. Wrapper defaults: variant='default'.\n * @returns The rendered EmptyMedia composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyMedia({\n  className,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot='empty-icon'\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles an empty-state title without imposing a heading level.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyTitle composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-title'\n      className={cn('text-sm font-medium tracking-tight', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Styles the empty-state explanation and links.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyDescription composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  return (\n    <div\n      data-slot='empty-description'\n      className={cn(\n        'text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Constrains the width of empty-state actions or supplemental content.\n * @param props - Component attributes and children accepted by the declared native/underlying prop type; className customizes wrapper styling.\n * @returns The rendered EmptyContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. These presentational slots do not fetch data or detect empty collections. The host decides whether to render them. EmptyMedia variant defaults to default; icon adds a muted icon surface.\n * @example\n * ```tsx\n * import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Empty><EmptyHeader><EmptyMedia variant=\"icon\">?</EmptyMedia><EmptyTitle>No documents</EmptyTitle><EmptyDescription>Create your first document.</EmptyDescription></EmptyHeader><EmptyContent><button type=\"button\">Create</button></EmptyContent></Empty>);\n * }\n * ```\n */\nfunction EmptyContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='empty-content'\n      className={cn(\n        'gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia };\n"],"mappings":";;;;;AAmBA,SAASA,EAAM,EAAE,cAAW,GAAGC,KAAsC;CACnE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,+HACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASG,EAAY,EAAE,cAAW,GAAGH,KAAsC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EAAG,6CAA6CC,CAAS;EACpE,GAAIF;CACL,CAAA;AAEL;AAEA,IAAMI,IAAqBC,EACzB,+FACA;CACE,UAAU,EAOR,SAAS;EACP,SAAS;EACT,MAAM;CACR,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAiBA,SAASC,EAAW,EAClB,cACA,aAAU,WACV,GAAGN,KACqE;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,gBAAcO;EACd,WAAWN,EAAGG,EAAmB;GAAE;GAAS;EAAU,CAAC,CAAC;EACxD,GAAIJ;CACL,CAAA;AAEL;AAiBA,SAASQ,EAAW,EAAE,cAAW,GAAGR,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EAAG,sCAAsCC,CAAS;EAC7D,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASS,EAAiB,EAAE,cAAW,GAAGT,KAAoC;CAC5E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,2GACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASU,EAAa,EAAE,cAAW,GAAGV,KAAsC;CAC1E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAWC,EACT,mFACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL"}

package/dist/ui/components/ui/field.cjs

@@ -1,2 +1,2 @@
-"use client";"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("./separator.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("class-variance-authority"),o=require("@base-ui/react/field"),s=require("@base-ui/react/fieldset");function c({className:e,...n}){return(0,r.jsx)(s.Fieldset.Root,{"data-slot":`field-set`,className:t.cn(`gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col`,e),...n})}function l({className:e,variant:n=`legend`,...i}){return(0,r.jsx)(s.Fieldset.Legend,{"data-slot":`field-legend`,"data-variant":n,className:t.cn(`mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,e),...i})}function u({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-group`,className:t.cn(`gap-5 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4 group/field-group @container/field-group flex w-full flex-col`,e),...n})}var d=(0,a.cva)(`data-[invalid]:text-destructive gap-2 group/field flex w-full`,{variants:{orientation:{vertical:`flex-col [&>*]:w-full [&>.sr-only]:w-auto`,horizontal:`flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,responsive:`flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px max-sm:flex-col max-sm:[&>*]:w-full max-sm:[&>[data-slot=field-label]]:w-full max-sm:[&>[data-slot=field-label]]:text-left`}},defaultVariants:{orientation:`vertical`}}),f=i.forwardRef(({className:e,orientation:n=`vertical`,...i},a)=>(0,r.jsx)(o.Field.Root,{ref:a,"data-slot":`field`,"data-orientation":n,className:t.cn(d({orientation:n}),e),...i}));f.displayName=`Field`;function p({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-content`,className:t.cn(`gap-0.5 group/field-content flex flex-1 flex-col leading-snug`,e),...n})}var m=i.forwardRef(({className:e,...n},i)=>(0,r.jsx)(o.Field.Label,{ref:i,"data-slot":`field-label`,className:t.cn(`has-data-checked:bg-primary/5 has-data-checked:border-primary dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug text-sm font-medium`,`has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col`,`data-[invalid]:text-destructive`,e),...n}));m.displayName=`FieldLabel`;function h({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-label`,className:t.cn(`gap-2 text-sm font-medium group-data-[disabled]/field:opacity-50 flex w-fit items-center leading-snug`,e),...n})}var g=i.forwardRef(({className:e,...n},i)=>(0,r.jsx)(o.Field.Description,{ref:i,"data-slot":`field-description`,className:t.cn(`text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance`,`last:mt-0 nth-last-2:-mt-1`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,e),...n}));g.displayName=`FieldDescription`;function _({children:e,className:i,...a}){return(0,r.jsxs)(`div`,{"data-slot":`field-separator`,"data-content":!!e,className:t.cn(`-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative`,i),...a,children:[(0,r.jsx)(n.Separator,{className:`absolute inset-0 top-1/2`}),e&&(0,r.jsx)(`span`,{className:`text-muted-foreground px-2 bg-background relative mx-auto block w-fit`,"data-slot":`field-separator-content`,children:e})]})}var v=i.forwardRef(({className:e,children:n,errors:a,...s},c)=>{let l=(0,i.useMemo)(()=>{if(n)return n;if(!a?.length)return null;let e=[...new Map(a.map(e=>[e?.message,e])).values()];return e?.length==1?e[0]?.message:(0,r.jsx)(`ul`,{className:`ml-4 flex list-disc flex-col gap-1`,children:e.map((e,t)=>e?.message&&(0,r.jsx)(`li`,{children:e.message},t))})},[n,a]);return l?(0,r.jsx)(o.Field.Error,{ref:c,"data-slot":`field-error`,className:t.cn(`text-destructive text-sm font-normal`,e),...s,children:l}):null});v.displayName=`FieldError`;var y=o.Field.Validity,b=o.Field.Control;exports.Field=f,exports.FieldContent=p,exports.FieldControl=b,exports.FieldDescription=g,exports.FieldError=v,exports.FieldGroup=u,exports.FieldLabel=m,exports.FieldLegend=l,exports.FieldSeparator=_,exports.FieldSet=c,exports.FieldTitle=h,exports.FieldValidity=y;
+"use client";"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("./separator.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("class-variance-authority"),o=require("@base-ui/react/field"),s=require("@base-ui/react/fieldset");function c({className:e,...n}){return(0,r.jsx)(s.Fieldset.Root,{"data-slot":`field-set`,className:t.cn(`gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col`,e),...n})}function l({className:e,variant:n=`legend`,...i}){return(0,r.jsx)(s.Fieldset.Legend,{"data-slot":`field-legend`,"data-variant":n,className:t.cn(`mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,e),...i})}function u({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-group`,className:t.cn(`gap-5 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4 group/field-group @container/field-group flex w-full flex-col`,e),...n})}var d=(0,a.cva)(`data-[invalid]:text-destructive gap-2 group/field flex w-full`,{variants:{orientation:{vertical:`flex-col [&>*]:w-full [&>.sr-only]:w-auto`,horizontal:`flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,responsive:`flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px max-sm:flex-col max-sm:[&>*]:w-full max-sm:[&>[data-slot=field-label]]:w-full max-sm:[&>[data-slot=field-label]]:text-left`}},defaultVariants:{orientation:`vertical`}});function f({ref:e,className:n,orientation:i=`vertical`,...a}){return(0,r.jsx)(o.Field.Root,{ref:e,"data-slot":`field`,"data-orientation":i,className:t.cn(d({orientation:i}),n),...a})}f.displayName=`Field`;function p({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-content`,className:t.cn(`gap-0.5 group/field-content flex flex-1 flex-col leading-snug`,e),...n})}function m({ref:e,className:n,...i}){return(0,r.jsx)(o.Field.Label,{ref:e,"data-slot":`field-label`,className:t.cn(`has-data-checked:bg-primary/5 has-data-checked:border-primary dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug text-sm font-medium`,`has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col`,`data-[invalid]:text-destructive`,n),...i})}m.displayName=`FieldLabel`;function h({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`field-label`,className:t.cn(`gap-2 text-sm font-medium group-data-[disabled]/field:opacity-50 flex w-fit items-center leading-snug`,e),...n})}function g({ref:e,className:n,...i}){return(0,r.jsx)(o.Field.Description,{ref:e,"data-slot":`field-description`,className:t.cn(`text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance`,`last:mt-0 nth-last-2:-mt-1`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,n),...i})}g.displayName=`FieldDescription`;function _({children:e,className:i,...a}){return(0,r.jsxs)(`div`,{"data-slot":`field-separator`,"data-content":!!e,className:t.cn(`-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative`,i),...a,children:[(0,r.jsx)(n.Separator,{className:`absolute inset-0 top-1/2`}),e&&(0,r.jsx)(`span`,{className:`text-muted-foreground px-2 bg-background relative mx-auto block w-fit`,"data-slot":`field-separator-content`,children:e})]})}function v({ref:e,className:n,children:a,errors:s,...c}){let l=(0,i.useMemo)(()=>{if(a)return a;if(!s?.length)return null;let e=[...new Map(s.map(e=>[e?.message,e])).values()];return e?.length==1?e[0]?.message:(0,r.jsx)(`ul`,{className:`ml-4 flex list-disc flex-col gap-1`,children:e.map((e,t)=>e?.message&&(0,r.jsx)(`li`,{children:e.message},t))})},[a,s]);return l?(0,r.jsx)(o.Field.Error,{ref:e,"data-slot":`field-error`,className:t.cn(`text-destructive text-sm font-normal`,n),...c,children:l}):null}v.displayName=`FieldError`;var y=o.Field.Validity,b=o.Field.Control;exports.Field=f,exports.FieldContent=p,exports.FieldControl=b,exports.FieldDescription=g,exports.FieldError=v,exports.FieldGroup=u,exports.FieldLabel=m,exports.FieldLegend=l,exports.FieldSeparator=_,exports.FieldSet=c,exports.FieldTitle=h,exports.FieldValidity=y;
 //# sourceMappingURL=field.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"field.cjs","names":["FieldsetPrimitive","cn","cva","React","FieldPrimitive","Separator","useMemo","require_runtime","require_ui_lib_utils","require_ui_components_ui_separator","react_jsx_runtime","react","class_variance_authority","_base_ui_react_field","_base_ui_react_fieldset","FieldSet","props","className","FieldLegend","variant","FieldGroup","fieldVariants","Field","orientation","FieldContent","FieldLabel","FieldTitle","FieldDescription","FieldSeparator","children","FieldError","content","errors","uniqueErrors","error","index","FieldValidity","FieldControl"],"sources":["../../../../src/ui/components/ui/field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Field as FieldPrimitive } from '@base-ui/react/field';\nimport { Fieldset as FieldsetPrimitive } from '@base-ui/react/fieldset';\n\nimport { cn } from '../../lib/utils';\nimport { Separator } from './separator';\n\n// ============================================================================\n// FieldSet (Fieldset.Root)\n// ============================================================================\n\n/**\n * フォーム内で関連する入力フィールドをグループ化するためのコンテナ。\n */\nfunction FieldSet({ className, ...props }: FieldsetPrimitive.Root.Props) {\n  return (\n    <FieldsetPrimitive.Root\n      data-slot='field-set'\n      className={cn(\n        'gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldLegend (Fieldset.Legend)\n// ============================================================================\n\n/**\n * FieldSet グループのタイトル（見出し）を指定するコンポーネント。\n */\nfunction FieldLegend({\n  className,\n  variant = 'legend',\n  ...props\n}: FieldsetPrimitive.Legend.Props & { variant?: 'legend' | 'label' }) {\n  return (\n    <FieldsetPrimitive.Legend\n      data-slot='field-legend'\n      data-variant={variant}\n      className={cn(\n        'mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldGroup\n// ============================================================================\n\n/**\n * 複数のフィールドをまとめて配置・整理するためのグループコンテナ。\n */\nfunction FieldGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-group'\n      className={cn(\n        'gap-5 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4 group/field-group @container/field-group flex w-full flex-col',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Field (Field.Root)\n// Primtive Field Component (was FieldRoot)\n// ============================================================================\n\nconst fieldVariants = cva('data-[invalid]:text-destructive gap-2 group/field flex w-full', {\n  variants: {\n    orientation: {\n      vertical: 'flex-col [&>*]:w-full [&>.sr-only]:w-auto',\n      horizontal:\n        'flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n      responsive:\n        'flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px max-sm:flex-col max-sm:[&>*]:w-full max-sm:[&>[data-slot=field-label]]:w-full max-sm:[&>[data-slot=field-label]]:text-left',\n    },\n  },\n  defaultVariants: {\n    orientation: 'vertical',\n  },\n});\n\nconst Field = React.forwardRef<\n  HTMLDivElement,\n  FieldPrimitive.Root.Props & VariantProps<typeof fieldVariants>\n>(({ className, orientation = 'vertical', ...props }, ref) => {\n  return (\n    <FieldPrimitive.Root\n      ref={ref}\n      data-slot='field'\n      data-orientation={orientation}\n      className={cn(fieldVariants({ orientation }), className)}\n      {...props}\n    />\n  );\n});\nField.displayName = 'Field';\n\n// ============================================================================\n// FieldContent\n// ============================================================================\n\n/**\n * フィールド内のコントロールや説明、エラーメッセージを囲むコンテンツ領域。\n */\nfunction FieldContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-content'\n      className={cn('gap-0.5 group/field-content flex flex-1 flex-col leading-snug', className)}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldLabel (Field.Label)\n// ============================================================================\n\nconst FieldLabel = React.forwardRef<HTMLLabelElement, FieldPrimitive.Label.Props>(\n  ({ className, ...props }, ref) => {\n    return (\n      <FieldPrimitive.Label\n        ref={ref}\n        data-slot='field-label'\n        className={cn(\n          'has-data-checked:bg-primary/5 has-data-checked:border-primary dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug text-sm font-medium',\n          'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n          'data-[invalid]:text-destructive',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nFieldLabel.displayName = 'FieldLabel';\n\n// ============================================================================\n// FieldTitle\n// ============================================================================\n\n/**\n * フィールドのタイトル（ラベル）用のコンポーネント。\n */\nfunction FieldTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-label'\n      className={cn(\n        'gap-2 text-sm font-medium group-data-[disabled]/field:opacity-50 flex w-fit items-center leading-snug',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldDescription (Field.Description)\n// ============================================================================\n\nconst FieldDescription = React.forwardRef<HTMLParagraphElement, FieldPrimitive.Description.Props>(\n  ({ className, ...props }, ref) => {\n    return (\n      <FieldPrimitive.Description\n        ref={ref}\n        data-slot='field-description'\n        className={cn(\n          'text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance',\n          'last:mt-0 nth-last-2:-mt-1',\n          '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nFieldDescription.displayName = 'FieldDescription';\n\n// ============================================================================\n// FieldSeparator\n// ============================================================================\n\n/**\n * フォームセクションやフィールド間を区切るためのセパレーター（区切り線）。\n */\nfunction FieldSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<'div'> & {\n  children?: React.ReactNode;\n}) {\n  return (\n    <div\n      data-slot='field-separator'\n      data-content={!!children}\n      className={cn(\n        '-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative',\n        className,\n      )}\n      {...props}\n    >\n      <Separator className='absolute inset-0 top-1/2' />\n      {children && (\n        <span\n          className='text-muted-foreground px-2 bg-background relative mx-auto block w-fit'\n          data-slot='field-separator-content'\n        >\n          {children}\n        </span>\n      )}\n    </div>\n  );\n}\n\n// ============================================================================\n// FieldError (Field.Error)\n// ============================================================================\n\nconst FieldError = React.forwardRef<\n  HTMLDivElement,\n  FieldPrimitive.Error.Props & {\n    errors?: Array<{ message?: string } | undefined>;\n  }\n>(({ className, children, errors, ...props }, ref) => {\n  const content = useMemo(() => {\n    if (children) {\n      return children;\n    }\n\n    if (!errors?.length) {\n      return null;\n    }\n\n    const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()];\n\n    if (uniqueErrors?.length == 1) {\n      return uniqueErrors[0]?.message;\n    }\n\n    return (\n      <ul className='ml-4 flex list-disc flex-col gap-1'>\n        {uniqueErrors.map((error, index) => error?.message && <li key={index}>{error.message}</li>)}\n      </ul>\n    );\n  }, [children, errors]);\n\n  if (!content) {\n    return null;\n  }\n\n  return (\n    <FieldPrimitive.Error\n      ref={ref}\n      data-slot='field-error'\n      className={cn('text-destructive text-sm font-normal', className)}\n      {...props}\n    >\n      {content}\n    </FieldPrimitive.Error>\n  );\n});\nFieldError.displayName = 'FieldError';\n\n// ============================================================================\n// FieldValidity (Field.Validity)\n// ============================================================================\n\nconst FieldValidity = FieldPrimitive.Validity;\n\n// ============================================================================\n// FieldControl (Helper for Smart Field / Legacy)\n// ============================================================================\n\nconst FieldControl = FieldPrimitive.Control;\n\n\nexport { Field, FieldLabel, FieldControl, FieldError, FieldDescription, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, FieldValidity };\n"],"mappings":"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"}
+{"version":3,"file":"field.cjs","names":["FieldsetPrimitive","cn","cva","FieldPrimitive","Separator","useMemo","require_runtime","require_ui_lib_utils","require_ui_components_ui_separator","react_jsx_runtime","react","class_variance_authority","_base_ui_react_field","_base_ui_react_fieldset","FieldSet","props","className","FieldLegend","variant","FieldGroup","fieldVariants","Field","orientation","FieldContent","FieldLabel","FieldTitle","FieldDescription","FieldSeparator","children","FieldError","content","errors","uniqueErrors","error","index","FieldValidity","FieldControl"],"sources":["../../../../src/ui/components/ui/field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Field as FieldPrimitive } from '@base-ui/react/field';\nimport { Fieldset as FieldsetPrimitive } from '@base-ui/react/fieldset';\n\nimport { cn } from '../../lib/utils';\nimport { Separator } from './separator';\n\n// ============================================================================\n// FieldSet (Fieldset.Root)\n// ============================================================================\n\n/**\n * Groups related form fields using the Base UI fieldset root.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldSet composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldSet({ className, ...props }: FieldsetPrimitive.Root.Props) {\n  return (\n    <FieldsetPrimitive.Root\n      data-slot='field-set'\n      className={cn(\n        'gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldLegend (Fieldset.Legend)\n// ============================================================================\n\n/**\n * Labels the fieldset with legend or compact label styling.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: variant='legend'.\n * @returns The rendered FieldLegend composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values. variant defaults to legend; label selects smaller typography.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldLegend({\n  className,\n  variant = 'legend',\n  ...props\n}: FieldsetPrimitive.Legend.Props & { /**\n * Visual treatment from the declared variant union; changing it does not alter host action semantics.\n */\n/**\n * Visual treatment from the declared variant union; changing it does not alter host action semantics.\n */\nvariant?: 'legend' | 'label' }) {\n  return (\n    <FieldsetPrimitive.Legend\n      data-slot='field-legend'\n      data-variant={variant}\n      className={cn(\n        'mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldGroup\n// ============================================================================\n\n/**\n * Lays out a vertical group of fields and nested field groups.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-group'\n      className={cn(\n        'gap-5 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4 group/field-group @container/field-group flex w-full flex-col',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// Field (Field.Root)\n// Primtive Field Component (was FieldRoot)\n// ============================================================================\n\nconst fieldVariants = cva('data-[invalid]:text-destructive gap-2 group/field flex w-full', {\n  variants: {\n    /**\n     * Axis used to join/group controls or arrange field content.\n     * Accepted values: vertical, horizontal, responsive.\n     * @defaultValue 'vertical'\n     * @see fieldVariants\n     */\n    orientation: {\n      vertical: 'flex-col [&>*]:w-full [&>.sr-only]:w-auto',\n      horizontal:\n        'flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n      responsive:\n        'flex-row items-center [&>[data-slot=field-label]]:w-24 [&>[data-slot=field-label]]:shrink-0 [&>[data-slot=field-label]]:text-right has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px max-sm:flex-col max-sm:[&>*]:w-full max-sm:[&>[data-slot=field-label]]:w-full max-sm:[&>[data-slot=field-label]]:text-left',\n    },\n  },\n  defaultVariants: {\n    orientation: 'vertical',\n  },\n});\n\n/**\n * Coordinates one field control, label, description and validation state.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: orientation='vertical'.\n * @returns The rendered Field composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values. The ref prop forwards to the rendered control or container declared by the component ref type. orientation defaults to vertical; horizontal/responsive change layout rather than field validation.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction Field({\n  ref,\n  className,\n  orientation = 'vertical',\n  ...props\n}: React.PropsWithoutRef<FieldPrimitive.Root.Props & VariantProps<typeof fieldVariants>> &\n  React.RefAttributes<HTMLDivElement>) {\n  return (\n    <FieldPrimitive.Root\n      ref={ref}\n      data-slot='field'\n      data-orientation={orientation}\n      className={cn(fieldVariants({ orientation }), className)}\n      {...props}\n    />\n  );\n}\nField.displayName = 'Field';\n\n// ============================================================================\n// FieldContent\n// ============================================================================\n\n/**\n * Groups the textual content adjacent to a field control.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldContent({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-content'\n      className={cn('gap-0.5 group/field-content flex flex-1 flex-col leading-snug', className)}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldLabel (Field.Label)\n// ============================================================================\n\n/**\n * Associates a visible label with its Base UI field control.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldLabel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldLabel({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<FieldPrimitive.Label.Props> & React.RefAttributes<HTMLLabelElement>) {\n  return (\n    <FieldPrimitive.Label\n      ref={ref}\n      data-slot='field-label'\n      className={cn(\n        'has-data-checked:bg-primary/5 has-data-checked:border-primary dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug text-sm font-medium',\n        'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n        'data-[invalid]:text-destructive',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nFieldLabel.displayName = 'FieldLabel';\n\n// ============================================================================\n// FieldTitle\n// ============================================================================\n\n/**\n * Styles label-like title content without creating a label association.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldTitle composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot='field-label'\n      className={cn(\n        'gap-2 text-sm font-medium group-data-[disabled]/field:opacity-50 flex w-fit items-center leading-snug',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n// ============================================================================\n// FieldDescription (Field.Description)\n// ============================================================================\n\n/**\n * Provides descriptive text associated with the surrounding field.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldDescription composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldDescription({\n  ref,\n  className,\n  ...props\n}: React.PropsWithoutRef<FieldPrimitive.Description.Props> &\n  React.RefAttributes<HTMLParagraphElement>) {\n  return (\n    <FieldPrimitive.Description\n      ref={ref}\n      data-slot='field-description'\n      className={cn(\n        'text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance',\n        'last:mt-0 nth-last-2:-mt-1',\n        '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\nFieldDescription.displayName = 'FieldDescription';\n\n// ============================================================================\n// FieldSeparator\n// ============================================================================\n\n/**\n * Draws a divider with optional centered text between field groups.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldSeparator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<'div'> & {\n  /**\n   * Content rendered in the wrapper's child region.\n   */\n  children?: React.ReactNode;\n}) {\n  return (\n    <div\n      data-slot='field-separator'\n      data-content={!!children}\n      className={cn(\n        '-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative',\n        className,\n      )}\n      {...props}\n    >\n      <Separator className='absolute inset-0 top-1/2' />\n      {children && (\n        <span\n          className='text-muted-foreground px-2 bg-background relative mx-auto block w-fit'\n          data-slot='field-separator-content'\n        >\n          {children}\n        </span>\n      )}\n    </div>\n  );\n}\n\n// ============================================================================\n// FieldError (Field.Error)\n// ============================================================================\n\n/**\n * Renders supplied children or deduplicated error messages when content exists.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered FieldError composition, or null when it has no visible content.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nfunction FieldError({\n  ref,\n  className,\n  children,\n  errors,\n  ...props\n}: React.PropsWithoutRef<\n  FieldPrimitive.Error.Props & {\n    /**\n     * Explicit validation messages; duplicate message strings are collapsed and missing/empty messages may yield no content.\n     */\n    errors?: Array<\n      | {\n          /**\n           * Optional error message used for deduplication and display; missing messages do not render a list item.\n           */\n          /**\n           * Optional error message used for deduplication and display; missing messages do not render a list item.\n           */\n          message?: string;\n        }\n      | undefined\n    >;\n  }\n> &\n  React.RefAttributes<HTMLDivElement>) {\n  const content = useMemo(() => {\n    if (children) {\n      return children;\n    }\n\n    if (!errors?.length) {\n      return null;\n    }\n\n    const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()];\n\n    if (uniqueErrors?.length == 1) {\n      return uniqueErrors[0]?.message;\n    }\n\n    return (\n      <ul className='ml-4 flex list-disc flex-col gap-1'>\n        {uniqueErrors.map((error, index) => error?.message && <li key={index}>{error.message}</li>)}\n      </ul>\n    );\n  }, [children, errors]);\n\n  if (!content) {\n    return null;\n  }\n\n  return (\n    <FieldPrimitive.Error\n      ref={ref}\n      data-slot='field-error'\n      className={cn('text-destructive text-sm font-normal', className)}\n      {...props}\n    >\n      {content}\n    </FieldPrimitive.Error>\n  );\n}\nFieldError.displayName = 'FieldError';\n\n// ============================================================================\n// FieldValidity (Field.Validity)\n// ============================================================================\n\n/**\n * Exposes the surrounding Base UI field validity state to its child renderer.\n * @param props - Inherited primitive configuration, children and controlled/default state; the upstream prop type remains authoritative.\n * @returns The rendered FieldValidity composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nconst FieldValidity = FieldPrimitive.Validity;\n\n// ============================================================================\n// FieldControl (Helper for Smart Field / Legacy)\n// ============================================================================\n\n/**\n * Renders a Base UI control bound to its surrounding field context.\n * @param props - Inherited primitive configuration, children and controlled/default state; the upstream prop type remains authoritative.\n * @returns The rendered FieldControl composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Label, Control, Description, Error and Validity require the surrounding Field context. FieldSet/Legend provide related-field semantics. FieldError prefers truthy children; otherwise it deduplicates errors by message and returns null when empty. These wrappers do not persist form values.\n * @example\n * ```tsx\n * import { FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldControl, FieldDescription, FieldError } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<FieldSet><FieldLegend>Contact</FieldLegend><FieldGroup><Field name=\"email\"><FieldLabel>Email</FieldLabel><FieldControl type=\"email\" /><FieldDescription>Used for replies</FieldDescription><FieldError /></Field></FieldGroup></FieldSet>);\n * }\n * ```\n */\nconst FieldControl = FieldPrimitive.Control;\n\n\nexport { Field, FieldLabel, FieldControl, FieldError, FieldDescription, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, FieldValidity };\n"],"mappings":"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"}