@alneas/appkit-react 0.1.0 → 0.3.0

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

@@ -1 +1 @@
-{"version":3,"file":"menubar.js","names":["MenubarPrimitive","MenuPrimitive","Menu$1","Menubar$1","Menubar","props","cn","className","MenubarMenu","DropdownMenu","MenubarGroup","DropdownMenuGroup","MenubarPortal","DropdownMenuPortal","MenubarTrigger","DropdownMenuTrigger","MenubarContent","DropdownMenuContent","MenubarItem","DropdownMenuItem","MenubarCheckboxItem","Check","children","MenubarRadioGroup","DropdownMenuRadioGroup","MenubarRadioItem","Circle","MenubarLabel","DropdownMenuLabel","MenubarSeparator","DropdownMenuSeparator","MenubarShortcut","DropdownMenuShortcut","MenubarSub","DropdownMenuSub","MenubarSubTrigger","DropdownMenuSubTrigger","MenubarSubContent","DropdownMenuSubContent"],"sources":["../../../../src/ui/components/ui/menubar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { Menubar as MenubarPrimitive } from '@base-ui/react/menubar';\nimport { Check, Circle } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from './dropdown-menu';\n\n/**\n * メニューバーのルートコンポーネント。\n */\nfunction Menubar({ className, ...props }: MenubarPrimitive.Props) {\n  return (\n    <MenubarPrimitive\n      data-slot='menubar'\n      className={cn('bg-background h-8 gap-0.5 rounded-lg border p-1 flex items-center', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メニューバー内の個々のメニューを管理するコンポーネント。\n */\nfunction MenubarMenu({ ...props }: React.ComponentProps<typeof DropdownMenu>) {\n  return <DropdownMenu data-slot='menubar-menu' {...props} />;\n}\n\n/**\n * メニュー項目をグループ化するためのコンポーネント。\n */\nfunction MenubarGroup({ ...props }: React.ComponentProps<typeof DropdownMenuGroup>) {\n  return <DropdownMenuGroup data-slot='menubar-group' {...props} />;\n}\n\n/**\n * メニューバーのメニュー項目をポータル経由でレンダリングするためのコンポーネント。\n */\nfunction MenubarPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPortal>) {\n  return <DropdownMenuPortal data-slot='menubar-portal' {...props} />;\n}\n\n/**\n * メニューバーからメニューを展開するためのトリガーボタン。\n */\nfunction MenubarTrigger({ className, ...props }: React.ComponentProps<typeof DropdownMenuTrigger>) {\n  return (\n    <DropdownMenuTrigger\n      data-slot='menubar-trigger'\n      className={cn(\n        'hover:bg-muted aria-expanded:bg-muted rounded-sm px-1.5 py-px text-sm font-medium flex items-center outline-hidden select-none',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * メニューバーのトリガーによって展開されるコンテンツのコンテナ。\n */\nfunction MenubarContent({\n  className,\n  align = 'start',\n  alignOffset = -4,\n  sideOffset = 8,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuContent>) {\n  return (\n    <DropdownMenuContent\n      data-slot='menubar-content'\n      align={align}\n      alignOffset={alignOffset}\n      sideOffset={sideOffset}\n      className={cn(\n        'bg-popover text-popover-foreground data-open:animate-in data-open:fade-in-0 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 min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * メニュー内の個々の通常のメニュー項目。\n */\nfunction MenubarItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {\n  inset?: boolean;\n  variant?: 'default' | 'destructive';\n}) {\n  return (\n    <DropdownMenuItem\n      data-slot='menubar-item'\n      inset={inset}\n      // ERP MenubarItem passes data-variant. Tools DropdownMenuItem wraps Primitive.Item.\n      // I will adhere to ERP implementation but I might need to adjust based on tools DropdownMenuItem\n      // ERP DropdownMenuItem accepts `variant`. Tools DropdownMenuItem might not.\n      // I'll assume safe for now, if error I fix.\n      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 data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 group/menubar-item\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * チェックボックスの選択状態を持つメニュー項目。\n */\nfunction MenubarCheckboxItem({\n  className,\n  children,\n  checked,\n  ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      data-slot='menubar-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-1.5 pl-7 text-sm data-disabled:opacity-50 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 className=\"left-1.5 size-4 [&_svg:not([class*='size-'])]:size-4 pointer-events-none absolute flex items-center justify-center\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <Check className='h-4 w-4' />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  );\n}\n\n/**\n * ラジオボタン形式のメニュー項目をグループ化するコンポーネント。\n */\nfunction MenubarRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuRadioGroup>) {\n  return <DropdownMenuRadioGroup data-slot='menubar-radio-group' {...props} />;\n}\n\n/**\n * 単一選択（ラジオ）形式のメニュー項目。\n */\nfunction MenubarRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props) {\n  return (\n    <MenuPrimitive.RadioItem\n      data-slot='menubar-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-1.5 pl-7 text-sm data-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"left-1.5 size-4 [&_svg:not([class*='size-'])]:size-4 pointer-events-none absolute flex items-center justify-center\">\n        <MenuPrimitive.RadioItemIndicator>\n          <Circle className='size-2 fill-current' />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  );\n}\n\n/**\n * メニュー内のヘッダーや見出しを定義するラベルコンポーネント。\n */\nfunction MenubarLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuLabel> & { inset?: boolean }) {\n  return (\n    <DropdownMenuLabel\n      data-slot='menubar-label'\n      inset={inset}\n      className={cn('px-1.5 py-1 text-sm font-medium data-[inset]:pl-8', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メニュー項目を区切るためのセパレーター（区切り線）。\n */\nfunction MenubarSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSeparator>) {\n  return (\n    <DropdownMenuSeparator\n      data-slot='menubar-separator'\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メニューアイテムの右側に表示されるキーボードショートカット用のコンポーネント。\n */\nfunction MenubarShortcut({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuShortcut>) {\n  return (\n    <DropdownMenuShortcut\n      data-slot='menubar-shortcut'\n      className={cn(\n        'text-muted-foreground group-focus/menubar-item:text-accent-foreground text-xs tracking-widest ml-auto',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * サブメニュー（入れ子にされたメニュー）を定義するためのコンポーネント。\n */\nfunction MenubarSub({ ...props }: React.ComponentProps<typeof DropdownMenuSub>) {\n  return <DropdownMenuSub data-slot='menubar-sub' {...props} />;\n}\n\n/**\n * サブメニューを展開するためのトリガー項目。\n */\nfunction MenubarSubTrigger({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubTrigger> & {\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuSubTrigger\n      data-slot='menubar-sub-trigger'\n      inset={inset}\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * サブメニューの中に表示されるコンテンツのコンテナ。\n */\nfunction MenubarSubContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubContent>) {\n  return (\n    <DropdownMenuSubContent\n      data-slot='menubar-sub-content'\n      className={cn(\n        'bg-popover text-popover-foreground 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 min-w-32 rounded-lg p-1 shadow-lg ring-1 duration-100',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Menubar,\n  MenubarPortal,\n  MenubarMenu,\n  MenubarTrigger,\n  MenubarContent,\n  MenubarGroup,\n  MenubarSeparator,\n  MenubarLabel,\n  MenubarItem,\n  MenubarShortcut,\n  MenubarCheckboxItem,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSub,\n  MenubarSubTrigger,\n  MenubarSubContent,\n};\n"],"mappings":"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"}
+{"version":3,"file":"menubar.js","names":["MenubarPrimitive","MenuPrimitive","Menu$1","Menubar$1","Menubar","props","cn","className","MenubarMenu","DropdownMenu","MenubarGroup","DropdownMenuGroup","MenubarPortal","DropdownMenuPortal","MenubarTrigger","DropdownMenuTrigger","MenubarContent","DropdownMenuContent","MenubarItem","DropdownMenuItem","MenubarCheckboxItem","Check","children","MenubarRadioGroup","DropdownMenuRadioGroup","MenubarRadioItem","Circle","MenubarLabel","DropdownMenuLabel","MenubarSeparator","DropdownMenuSeparator","MenubarShortcut","DropdownMenuShortcut","MenubarSub","DropdownMenuSub","MenubarSubTrigger","DropdownMenuSubTrigger","MenubarSubContent","DropdownMenuSubContent"],"sources":["../../../../src/ui/components/ui/menubar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { Menubar as MenubarPrimitive } from '@base-ui/react/menubar';\nimport { Check, Circle } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from './dropdown-menu';\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 Menubar composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction Menubar({ className, ...props }: MenubarPrimitive.Props) {\n  return (\n    <MenubarPrimitive\n      data-slot='menubar'\n      className={cn('bg-background h-8 gap-0.5 rounded-lg border p-1 flex items-center', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Provides one dropdown-menu root within a menubar.\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 MenubarMenu composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarMenu({ ...props }: React.ComponentProps<typeof DropdownMenu>) {\n  return <DropdownMenu data-slot='menubar-menu' {...props} />;\n}\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 MenubarGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarGroup({ ...props }: React.ComponentProps<typeof DropdownMenuGroup>) {\n  return <DropdownMenuGroup data-slot='menubar-group' {...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 MenubarPortal composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPortal>) {\n  return <DropdownMenuPortal data-slot='menubar-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 MenubarTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarTrigger({ className, ...props }: React.ComponentProps<typeof DropdownMenuTrigger>) {\n  return (\n    <DropdownMenuTrigger\n      data-slot='menubar-trigger'\n      className={cn(\n        'hover:bg-muted aria-expanded:bg-muted rounded-sm px-1.5 py-px text-sm font-medium flex items-center outline-hidden select-none',\n        className,\n      )}\n      {...props}\n    />\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=-4, sideOffset=8.\n * @returns The rendered MenubarContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarContent({\n  className,\n  align = 'start',\n  alignOffset = -4,\n  sideOffset = 8,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuContent>) {\n  return (\n    <DropdownMenuContent\n      data-slot='menubar-content'\n      align={align}\n      alignOffset={alignOffset}\n      sideOffset={sideOffset}\n      className={cn(\n        'bg-popover text-popover-foreground data-open:animate-in data-open:fade-in-0 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 min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\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 MenubarItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {\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  return (\n    <DropdownMenuItem\n      data-slot='menubar-item'\n      inset={inset}\n      // ERP MenubarItem passes data-variant. Tools DropdownMenuItem wraps Primitive.Item.\n      // I will adhere to ERP implementation but I might need to adjust based on tools DropdownMenuItem\n      // ERP DropdownMenuItem accepts `variant`. Tools DropdownMenuItem might not.\n      // I'll assume safe for now, if error I fix.\n      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 data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 group/menubar-item\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\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 MenubarCheckboxItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarCheckboxItem({\n  className,\n  children,\n  checked,\n  ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      data-slot='menubar-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-1.5 pl-7 text-sm data-disabled:opacity-50 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 className=\"left-1.5 size-4 [&_svg:not([class*='size-'])]:size-4 pointer-events-none absolute flex items-center justify-center\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <Check className='h-4 w-4' />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  );\n}\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 MenubarRadioGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuRadioGroup>) {\n  return <DropdownMenuRadioGroup data-slot='menubar-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 MenubarRadioItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props) {\n  return (\n    <MenuPrimitive.RadioItem\n      data-slot='menubar-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-1.5 pl-7 text-sm data-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"left-1.5 size-4 [&_svg:not([class*='size-'])]:size-4 pointer-events-none absolute flex items-center justify-center\">\n        <MenuPrimitive.RadioItemIndicator>\n          <Circle className='size-2 fill-current' />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  );\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 MenubarLabel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuLabel> & { /**\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 */\ninset?: boolean }) {\n  return (\n    <DropdownMenuLabel\n      data-slot='menubar-label'\n      inset={inset}\n      className={cn('px-1.5 py-1 text-sm font-medium data-[inset]:pl-8', className)}\n      {...props}\n    />\n  );\n}\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 MenubarSeparator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSeparator>) {\n  return (\n    <DropdownMenuSeparator\n      data-slot='menubar-separator'\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  );\n}\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 MenubarShortcut composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarShortcut({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuShortcut>) {\n  return (\n    <DropdownMenuShortcut\n      data-slot='menubar-shortcut'\n      className={cn(\n        'text-muted-foreground group-focus/menubar-item:text-accent-foreground text-xs tracking-widest ml-auto',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\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 MenubarSub composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarSub({ ...props }: React.ComponentProps<typeof DropdownMenuSub>) {\n  return <DropdownMenuSub data-slot='menubar-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 MenubarSubTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarSubTrigger({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubTrigger> & {\n  /**\n   * Adds left inset spacing when true; omitted/false uses normal alignment.\n   */\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuSubTrigger\n      data-slot='menubar-sub-trigger'\n      inset={inset}\n      className={cn(\n        \"focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\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.\n * @returns The rendered MenubarSubContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Place each trigger/content pair inside MenubarMenu under Menubar. Menubar uses the Base UI Menubar root and DropdownMenu wrappers for menus; these supply popup context. Items/labels/radio/submenu parts require the corresponding menu/group contexts. Shortcut text does not register handlers; actions belong to the host.\n * @example\n * ```tsx\n * import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Menubar><MenubarMenu><MenubarTrigger>File</MenubarTrigger><MenubarContent><MenubarItem>Open</MenubarItem></MenubarContent></MenubarMenu></Menubar>);\n * }\n * ```\n */\nfunction MenubarSubContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubContent>) {\n  return (\n    <DropdownMenuSubContent\n      data-slot='menubar-sub-content'\n      className={cn(\n        'bg-popover text-popover-foreground 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 min-w-32 rounded-lg p-1 shadow-lg ring-1 duration-100',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Menubar,\n  MenubarPortal,\n  MenubarMenu,\n  MenubarTrigger,\n  MenubarContent,\n  MenubarGroup,\n  MenubarSeparator,\n  MenubarLabel,\n  MenubarItem,\n  MenubarShortcut,\n  MenubarCheckboxItem,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSub,\n  MenubarSubTrigger,\n  MenubarSubContent,\n};\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"meter.cjs","names":["MeterPrimitive","cn","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","_base_ui_react_meter","Meter","props","className","MeterIndicator","MeterLabel","MeterValue"],"sources":["../../../../src/ui/components/ui/meter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Meter as MeterPrimitive } from '@base-ui/react/meter';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * 測定値や進捗状況（ゲージなど）を表示するメーターのルートコンポーネント。\n */\nfunction Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>) {\n  return (\n    <MeterPrimitive.Root\n      data-slot='meter'\n      className={cn('relative flex w-full flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メーターの進捗バーを視覚的に表現するインジケーター。\n */\nfunction MeterIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MeterPrimitive.Track>) {\n  return (\n    <MeterPrimitive.Track\n      data-slot='meter-track'\n      className='h-2 w-full overflow-hidden rounded-full bg-secondary'\n    >\n      <MeterPrimitive.Indicator\n        data-slot='meter-indicator'\n        className={cn('h-full w-full flex-1 bg-primary transition-all', className)}\n        {...props}\n      />\n    </MeterPrimitive.Track>\n  );\n}\n\n/**\n * メーターの名前や説明を表示するラベル。\n */\nfunction MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>) {\n  return (\n    <MeterPrimitive.Label\n      data-slot='meter-label'\n      className={cn('text-sm font-medium leading-none', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メーターの現在の数値を表示するコンポーネント。\n */\nfunction MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>) {\n  return (\n    <MeterPrimitive.Value\n      data-slot='meter-value'\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport { Meter, MeterIndicator, MeterLabel, MeterValue };\n"],"mappings":"A,sSAUA,SAASO,EAAM,CAAE,YAAW,GAAGC,GAA2D,CACxF,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,KAAhB,CACE,YAAU,QACV,UAAWC,EAAAA,GAAG,sCAAuCQ,CAAS,EAC9D,GAAID,CACL,CAAA,CAEL,CAKA,SAASE,EAAe,CACtB,YACA,GAAGF,GACiD,CACpD,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAU,uDAEV,UAAA,EAAAI,EAAA,IAAA,CAACJ,EAAAA,MAAe,UAAhB,CACE,YAAU,kBACV,UAAWC,EAAAA,GAAG,iDAAkDQ,CAAS,EACzE,GAAID,CACL,CAAA,CACmB,CAAA,CAE1B,CAKA,SAASG,EAAW,CAAE,YAAW,GAAGH,GAA4D,CAC9F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAWC,EAAAA,GAAG,mCAAoCQ,CAAS,EAC3D,GAAID,CACL,CAAA,CAEL,CAKA,SAASI,EAAW,CAAE,YAAW,GAAGJ,GAA4D,CAC9F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAWC,EAAAA,GAAG,gCAAiCQ,CAAS,EACxD,GAAID,CACL,CAAA,CAEL,C"}
+{"version":3,"file":"meter.cjs","names":["MeterPrimitive","cn","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","_base_ui_react_meter","Meter","props","className","MeterIndicator","MeterLabel","MeterValue"],"sources":["../../../../src/ui/components/ui/meter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Meter as MeterPrimitive } from '@base-ui/react/meter';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates an accessible bounded measurement display.\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 Meter composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>) {\n  return (\n    <MeterPrimitive.Root\n      data-slot='meter'\n      className={cn('relative flex w-full flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a meter track containing its styled measurement 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 MeterIndicator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MeterPrimitive.Track>) {\n  return (\n    <MeterPrimitive.Track\n      data-slot='meter-track'\n      className='h-2 w-full overflow-hidden rounded-full bg-secondary'\n    >\n      <MeterPrimitive.Indicator\n        data-slot='meter-indicator'\n        className={cn('h-full w-full flex-1 bg-primary transition-all', className)}\n        {...props}\n      />\n    </MeterPrimitive.Track>\n  );\n}\n\n/**\n * Provides the accessible label of a meter.\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 MeterLabel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>) {\n  return (\n    <MeterPrimitive.Label\n      data-slot='meter-label'\n      className={cn('text-sm font-medium leading-none', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders the formatted current measurement from meter context.\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 MeterValue composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>) {\n  return (\n    <MeterPrimitive.Value\n      data-slot='meter-value'\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport { Meter, MeterIndicator, MeterLabel, MeterValue };\n"],"mappings":"A,sSAsBA,SAASO,EAAM,CAAE,YAAW,GAAGC,GAA2D,CACxF,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,KAAhB,CACE,YAAU,QACV,UAAWC,EAAAA,GAAG,sCAAuCQ,CAAS,EAC9D,GAAID,CACL,CAAA,CAEL,CAiBA,SAASE,EAAe,CACtB,YACA,GAAGF,GACiD,CACpD,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAU,uDAEV,UAAA,EAAAI,EAAA,IAAA,CAACJ,EAAAA,MAAe,UAAhB,CACE,YAAU,kBACV,UAAWC,EAAAA,GAAG,iDAAkDQ,CAAS,EACzE,GAAID,CACL,CAAA,CACmB,CAAA,CAE1B,CAiBA,SAASG,EAAW,CAAE,YAAW,GAAGH,GAA4D,CAC9F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAWC,EAAAA,GAAG,mCAAoCQ,CAAS,EAC3D,GAAID,CACL,CAAA,CAEL,CAiBA,SAASI,EAAW,CAAE,YAAW,GAAGJ,GAA4D,CAC9F,OACE,EAAAJ,EAAA,IAAA,CAACJ,EAAAA,MAAe,MAAhB,CACE,YAAU,cACV,UAAWC,EAAAA,GAAG,gCAAiCQ,CAAS,EACxD,GAAID,CACL,CAAA,CAEL,C"}

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

@@ -1,19 +1,67 @@
 import { Meter as MeterPrimitive } from '@base-ui/react/meter';
 import * as React from 'react';
 /**
- * 測定値や進捗状況（ゲージなど）を表示するメーターのルートコンポーネント。
+ * Coordinates an accessible bounded measurement display.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered Meter composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>): React.JSX.Element;
 /**
- * メーターの進捗バーを視覚的に表現するインジケーター。
+ * Renders a meter track containing its styled measurement indicator.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterIndicator composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterIndicator({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Track>): React.JSX.Element;
 /**
- * メーターの名前や説明を表示するラベル。
+ * Provides the accessible label of a meter.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterLabel composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>): React.JSX.Element;
 /**
- * メーターの現在の数値を表示するコンポーネント。
+ * Renders the formatted current measurement from meter context.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterValue composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>): React.JSX.Element;
 export { Meter, MeterIndicator, MeterLabel, MeterValue };

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

@@ -1,19 +1,67 @@
 import { Meter as MeterPrimitive } from '@base-ui/react/meter';
 import * as React from 'react';
 /**
- * 測定値や進捗状況（ゲージなど）を表示するメーターのルートコンポーネント。
+ * Coordinates an accessible bounded measurement display.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered Meter composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>): React.JSX.Element;
 /**
- * メーターの進捗バーを視覚的に表現するインジケーター。
+ * Renders a meter track containing its styled measurement indicator.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterIndicator composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterIndicator({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Track>): React.JSX.Element;
 /**
- * メーターの名前や説明を表示するラベル。
+ * Provides the accessible label of a meter.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterLabel composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>): React.JSX.Element;
 /**
- * メーターの現在の数値を表示するコンポーネント。
+ * Renders the formatted current measurement from meter context.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered MeterValue composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.
+ * @example
+ * ```tsx
+ * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);
+ * }
+ * ```
  */
 declare function MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>): React.JSX.Element;
 export { Meter, MeterIndicator, MeterLabel, MeterValue };

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

@@ -1 +1 @@
-{"version":3,"file":"meter.js","names":["MeterPrimitive","Meter$1","Meter","props","cn","className","MeterIndicator","MeterLabel","MeterValue"],"sources":["../../../../src/ui/components/ui/meter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Meter as MeterPrimitive } from '@base-ui/react/meter';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * 測定値や進捗状況（ゲージなど）を表示するメーターのルートコンポーネント。\n */\nfunction Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>) {\n  return (\n    <MeterPrimitive.Root\n      data-slot='meter'\n      className={cn('relative flex w-full flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メーターの進捗バーを視覚的に表現するインジケーター。\n */\nfunction MeterIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MeterPrimitive.Track>) {\n  return (\n    <MeterPrimitive.Track\n      data-slot='meter-track'\n      className='h-2 w-full overflow-hidden rounded-full bg-secondary'\n    >\n      <MeterPrimitive.Indicator\n        data-slot='meter-indicator'\n        className={cn('h-full w-full flex-1 bg-primary transition-all', className)}\n        {...props}\n      />\n    </MeterPrimitive.Track>\n  );\n}\n\n/**\n * メーターの名前や説明を表示するラベル。\n */\nfunction MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>) {\n  return (\n    <MeterPrimitive.Label\n      data-slot='meter-label'\n      className={cn('text-sm font-medium leading-none', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * メーターの現在の数値を表示するコンポーネント。\n */\nfunction MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>) {\n  return (\n    <MeterPrimitive.Value\n      data-slot='meter-value'\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport { Meter, MeterIndicator, MeterLabel, MeterValue };\n"],"mappings":";;;;;;;AAUA,SAASE,EAAM,EAAE,cAAW,GAAGC,KAA2D;CACxF,OACE,kBAACH,EAAe,MAAhB;EACE,aAAU;EACV,WAAWI,EAAG,uCAAuCC,CAAS;EAC9D,GAAIF;CACL,CAAA;AAEL;AAKA,SAASG,EAAe,EACtB,cACA,GAAGH,KACiD;CACpD,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAU;EAEV,UAAA,kBAACA,EAAe,WAAhB;GACE,aAAU;GACV,WAAWI,EAAG,kDAAkDC,CAAS;GACzE,GAAIF;EACL,CAAA;CACmB,CAAA;AAE1B;AAKA,SAASI,EAAW,EAAE,cAAW,GAAGJ,KAA4D;CAC9F,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAWI,EAAG,oCAAoCC,CAAS;EAC3D,GAAIF;CACL,CAAA;AAEL;AAKA,SAASK,EAAW,EAAE,cAAW,GAAGL,KAA4D;CAC9F,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAWI,EAAG,iCAAiCC,CAAS;EACxD,GAAIF;CACL,CAAA;AAEL"}
+{"version":3,"file":"meter.js","names":["MeterPrimitive","Meter$1","Meter","props","cn","className","MeterIndicator","MeterLabel","MeterValue"],"sources":["../../../../src/ui/components/ui/meter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Meter as MeterPrimitive } from '@base-ui/react/meter';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates an accessible bounded measurement display.\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 Meter composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction Meter({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Root>) {\n  return (\n    <MeterPrimitive.Root\n      data-slot='meter'\n      className={cn('relative flex w-full flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a meter track containing its styled measurement 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 MeterIndicator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MeterPrimitive.Track>) {\n  return (\n    <MeterPrimitive.Track\n      data-slot='meter-track'\n      className='h-2 w-full overflow-hidden rounded-full bg-secondary'\n    >\n      <MeterPrimitive.Indicator\n        data-slot='meter-indicator'\n        className={cn('h-full w-full flex-1 bg-primary transition-all', className)}\n        {...props}\n      />\n    </MeterPrimitive.Track>\n  );\n}\n\n/**\n * Provides the accessible label of a meter.\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 MeterLabel composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterLabel({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Label>) {\n  return (\n    <MeterPrimitive.Label\n      data-slot='meter-label'\n      className={cn('text-sm font-medium leading-none', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders the formatted current measurement from meter context.\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 MeterValue composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Indicator, Label and Value require Meter context. Base UI owns numeric range and accessible measurement state. MeterIndicator is typed with Track props but forwards its received props and className to the inner Indicator, not the outer track.\n * @example\n * ```tsx\n * import { Meter, MeterIndicator, MeterLabel, MeterValue } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<Meter value={65}><MeterLabel>Storage used</MeterLabel><MeterValue /><MeterIndicator /></Meter>);\n * }\n * ```\n */\nfunction MeterValue({ className, ...props }: React.ComponentProps<typeof MeterPrimitive.Value>) {\n  return (\n    <MeterPrimitive.Value\n      data-slot='meter-value'\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport { Meter, MeterIndicator, MeterLabel, MeterValue };\n"],"mappings":";;;;;;;AAsBA,SAASE,EAAM,EAAE,cAAW,GAAGC,KAA2D;CACxF,OACE,kBAACH,EAAe,MAAhB;EACE,aAAU;EACV,WAAWI,EAAG,uCAAuCC,CAAS;EAC9D,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASG,EAAe,EACtB,cACA,GAAGH,KACiD;CACpD,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAU;EAEV,UAAA,kBAACA,EAAe,WAAhB;GACE,aAAU;GACV,WAAWI,EAAG,kDAAkDC,CAAS;GACzE,GAAIF;EACL,CAAA;CACmB,CAAA;AAE1B;AAiBA,SAASI,EAAW,EAAE,cAAW,GAAGJ,KAA4D;CAC9F,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAWI,EAAG,oCAAoCC,CAAS;EAC3D,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASK,EAAW,EAAE,cAAW,GAAGL,KAA4D;CAC9F,OACE,kBAACH,EAAe,OAAhB;EACE,aAAU;EACV,WAAWI,EAAG,iCAAiCC,CAAS;EACxD,GAAIF;CACL,CAAA;AAEL"}

package/dist/ui/components/ui/mobile-form-variants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"mobile-form-variants.cjs","names":["cva","class_variance_authority","mobileButtonVariants","fabVariants"],"sources":["../../../../src/ui/components/ui/mobile-form-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const mobileButtonVariants = cva(\n  // Base styles\n  [\n    'inline-flex items-center justify-center gap-2 rounded-lg font-medium',\n    'transition-all outline-none select-none shrink-0',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n    'disabled:pointer-events-none disabled:opacity-50',\n    'active:scale-[0.98]',\n    \"[&_svg:not([class*='size-'])]:size-5 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',\n        ghost: 'hover:bg-accent hover:text-accent-foreground',\n        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',\n      },\n      size: {\n        sm: 'h-10 px-4 text-sm',\n        default: 'h-12 px-6 text-base',\n        lg: 'h-14 px-8 text-lg',\n        full: 'h-12 w-full text-base',\n        icon: 'h-12 w-12',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nexport const fabVariants = cva(\n  [\n    'fixed z-50 flex items-center justify-center gap-2',\n    'bg-primary text-primary-foreground shadow-lg',\n    'transition-all active:scale-95',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:ring-offset-2 outline-none',\n    \"[&_svg:not([class*='size-'])]:size-6 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      position: {\n        'bottom-right': 'right-4 bottom-20',\n        'bottom-center': 'left-1/2 -translate-x-1/2 bottom-20',\n        'bottom-left': 'left-4 bottom-20',\n      },\n      extended: {\n        true: 'h-14 px-6 rounded-full',\n        false: 'h-14 w-14 rounded-full',\n      },\n    },\n    defaultVariants: {\n      position: 'bottom-right',\n      extended: false,\n    },\n  },\n);\n"],"mappings":"A,0HAEA,IAAaE,GAAA,EAAuBF,EAAAA,IAAAA,CAElC,CACE,uEACA,mDACA,sDACA,mDACA,sBACA,mFACF,CAAC,CAAC,KAAK,GAAG,EACV,CACE,SAAU,CACR,QAAS,CACP,QAAS,yDACT,UAAW,+DACX,QAAS,iFACT,MAAO,+CACP,YAAa,oEACf,EACA,KAAM,CACJ,GAAI,oBACJ,QAAS,sBACT,GAAI,oBACJ,KAAM,wBACN,KAAM,WACR,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,SACR,CACF,CACF,EAEaG,GAAA,EAAcH,EAAAA,IAAAA,CACzB,CACE,oDACA,+CACA,iCACA,+FACA,mFACF,CAAC,CAAC,KAAK,GAAG,EACV,CACE,SAAU,CACR,SAAU,CACR,eAAgB,oBAChB,gBAAiB,sCACjB,cAAe,kBACjB,EACA,SAAU,CACR,KAAM,yBACN,MAAO,wBACT,CACF,EACA,gBAAiB,CACf,SAAU,eACV,SAAU,EACZ,CACF,CACF,E"}
+{"version":3,"file":"mobile-form-variants.cjs","names":["cva","class_variance_authority","mobileButtonVariants","fabVariants"],"sources":["../../../../src/ui/components/ui/mobile-form-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * Builds large-touch button classes for mobile forms.\n * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.\n * @returns The combined CSS class string for the supplied variant axes and additional class/className values.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);\n * }\n * ```\n */\nexport const mobileButtonVariants = cva(\n  // Base styles\n  [\n    'inline-flex items-center justify-center gap-2 rounded-lg font-medium',\n    'transition-all outline-none select-none shrink-0',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n    'disabled:pointer-events-none disabled:opacity-50',\n    'active:scale-[0.98]',\n    \"[&_svg:not([class*='size-'])]:size-5 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      /**\n       * Visual treatment selected by the consumer; these values change CSS classes only.\n       * Accepted values: default, secondary, outline, ghost, destructive.\n       * @defaultValue 'default'\n       * @see mobileButtonVariants\n       */\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',\n        ghost: 'hover:bg-accent hover:text-accent-foreground',\n        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',\n      },\n      /**\n       * Control size preset selected by the consumer; sizes are class-based rather than numeric dimensions.\n       * Accepted values: sm, default, lg, full, icon.\n       * @defaultValue 'default'\n       * @see mobileButtonVariants\n       */\n      size: {\n        sm: 'h-10 px-4 text-sm',\n        default: 'h-12 px-6 text-base',\n        lg: 'h-14 px-8 text-lg',\n        full: 'h-12 w-full text-base',\n        icon: 'h-12 w-12',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\n/**\n * Builds fixed-position classes for circular or extended floating action buttons.\n * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.\n * @returns The fixed-position FAB class string; position defaults to bottom-right and extended to false.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);\n * }\n * ```\n */\nexport const fabVariants = cva(\n  [\n    'fixed z-50 flex items-center justify-center gap-2',\n    'bg-primary text-primary-foreground shadow-lg',\n    'transition-all active:scale-95',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:ring-offset-2 outline-none',\n    \"[&_svg:not([class*='size-'])]:size-6 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      /**\n       * Fixed floating-action placement relative to the viewport.\n       * Accepted values: 'bottom-right', 'bottom-center', 'bottom-left'.\n       * @defaultValue 'bottom-right'\n       * @see fabVariants\n       */\n      position: {\n        'bottom-right': 'right-4 bottom-20',\n        'bottom-center': 'left-1/2 -translate-x-1/2 bottom-20',\n        'bottom-left': 'left-4 bottom-20',\n      },\n      /**\n       * Whether the floating action surface uses extended padding instead of a circular footprint.\n       * Accepted values: true, false.\n       * @defaultValue false\n       * @see fabVariants\n       */\n      extended: {\n        true: 'h-14 px-6 rounded-full',\n        false: 'h-14 w-14 rounded-full',\n      },\n    },\n    defaultVariants: {\n      position: 'bottom-right',\n      extended: false,\n    },\n  },\n);\n"],"mappings":"A,0HAiBA,IAAaE,GAAA,EAAuBF,EAAAA,IAAAA,CAElC,CACE,uEACA,mDACA,sDACA,mDACA,sBACA,mFACF,CAAC,CAAC,KAAK,GAAG,EACV,CACE,SAAU,CAOR,QAAS,CACP,QAAS,yDACT,UAAW,+DACX,QAAS,iFACT,MAAO,+CACP,YAAa,oEACf,EAOA,KAAM,CACJ,GAAI,oBACJ,QAAS,sBACT,GAAI,oBACJ,KAAM,wBACN,KAAM,WACR,CACF,EACA,gBAAiB,CACf,QAAS,UACT,KAAM,SACR,CACF,CACF,EAiBaG,GAAA,EAAcH,EAAAA,IAAAA,CACzB,CACE,oDACA,+CACA,iCACA,+FACA,mFACF,CAAC,CAAC,KAAK,GAAG,EACV,CACE,SAAU,CAOR,SAAU,CACR,eAAgB,oBAChB,gBAAiB,sCACjB,cAAe,kBACjB,EAOA,SAAU,CACR,KAAM,yBACN,MAAO,wBACT,CACF,EACA,gBAAiB,CACf,SAAU,eACV,SAAU,EACZ,CACF,CACF,E"}

package/dist/ui/components/ui/mobile-form-variants.d.cts

@@ -1,7 +1,37 @@
+/**
+ * Builds large-touch button classes for mobile forms.
+ * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.
+ * @returns The combined CSS class string for the supplied variant axes and additional class/className values.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);
+ * }
+ * ```
+ */
 export declare const mobileButtonVariants: (props?: ({
     variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | "full" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/**
+ * Builds fixed-position classes for circular or extended floating action buttons.
+ * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.
+ * @returns The fixed-position FAB class string; position defaults to bottom-right and extended to false.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);
+ * }
+ * ```
+ */
 export declare const fabVariants: (props?: ({
     position?: "bottom-right" | "bottom-center" | "bottom-left" | null | undefined;
     extended?: boolean | null | undefined;

package/dist/ui/components/ui/mobile-form-variants.d.ts

@@ -1,7 +1,37 @@
+/**
+ * Builds large-touch button classes for mobile forms.
+ * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.
+ * @returns The combined CSS class string for the supplied variant axes and additional class/className values.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);
+ * }
+ * ```
+ */
 export declare const mobileButtonVariants: (props?: ({
     variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | "full" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/**
+ * Builds fixed-position classes for circular or extended floating action buttons.
+ * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.
+ * @returns The fixed-position FAB class string; position defaults to bottom-right and extended to false.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);
+ * }
+ * ```
+ */
 export declare const fabVariants: (props?: ({
     position?: "bottom-right" | "bottom-center" | "bottom-left" | null | undefined;
     extended?: boolean | null | undefined;

package/dist/ui/components/ui/mobile-form-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile-form-variants.js","names":["mobileButtonVariants","cva","fabVariants"],"sources":["../../../../src/ui/components/ui/mobile-form-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const mobileButtonVariants = cva(\n  // Base styles\n  [\n    'inline-flex items-center justify-center gap-2 rounded-lg font-medium',\n    'transition-all outline-none select-none shrink-0',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n    'disabled:pointer-events-none disabled:opacity-50',\n    'active:scale-[0.98]',\n    \"[&_svg:not([class*='size-'])]:size-5 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',\n        ghost: 'hover:bg-accent hover:text-accent-foreground',\n        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',\n      },\n      size: {\n        sm: 'h-10 px-4 text-sm',\n        default: 'h-12 px-6 text-base',\n        lg: 'h-14 px-8 text-lg',\n        full: 'h-12 w-full text-base',\n        icon: 'h-12 w-12',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nexport const fabVariants = cva(\n  [\n    'fixed z-50 flex items-center justify-center gap-2',\n    'bg-primary text-primary-foreground shadow-lg',\n    'transition-all active:scale-95',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:ring-offset-2 outline-none',\n    \"[&_svg:not([class*='size-'])]:size-6 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      position: {\n        'bottom-right': 'right-4 bottom-20',\n        'bottom-center': 'left-1/2 -translate-x-1/2 bottom-20',\n        'bottom-left': 'left-4 bottom-20',\n      },\n      extended: {\n        true: 'h-14 px-6 rounded-full',\n        false: 'h-14 w-14 rounded-full',\n      },\n    },\n    defaultVariants: {\n      position: 'bottom-right',\n      extended: false,\n    },\n  },\n);\n"],"mappings":";;;AAEA,IAAaA,IAAuBC,EAElC;CACE;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG,GACV;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,WAAW;GACX,SAAS;GACT,OAAO;GACP,aAAa;EACf;EACA,MAAM;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,MAAM;GACN,MAAM;EACR;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF,GAEaC,IAAcD,EACzB;CACE;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG,GACV;CACE,UAAU;EACR,UAAU;GACR,gBAAgB;GAChB,iBAAiB;GACjB,eAAe;EACjB;EACA,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,UAAU;EACV,UAAU;CACZ;AACF,CACF"}
+{"version":3,"file":"mobile-form-variants.js","names":["mobileButtonVariants","cva","fabVariants"],"sources":["../../../../src/ui/components/ui/mobile-form-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * Builds large-touch button classes for mobile forms.\n * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.\n * @returns The combined CSS class string for the supplied variant axes and additional class/className values.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);\n * }\n * ```\n */\nexport const mobileButtonVariants = cva(\n  // Base styles\n  [\n    'inline-flex items-center justify-center gap-2 rounded-lg font-medium',\n    'transition-all outline-none select-none shrink-0',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n    'disabled:pointer-events-none disabled:opacity-50',\n    'active:scale-[0.98]',\n    \"[&_svg:not([class*='size-'])]:size-5 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      /**\n       * Visual treatment selected by the consumer; these values change CSS classes only.\n       * Accepted values: default, secondary, outline, ghost, destructive.\n       * @defaultValue 'default'\n       * @see mobileButtonVariants\n       */\n      variant: {\n        default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',\n        ghost: 'hover:bg-accent hover:text-accent-foreground',\n        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',\n      },\n      /**\n       * Control size preset selected by the consumer; sizes are class-based rather than numeric dimensions.\n       * Accepted values: sm, default, lg, full, icon.\n       * @defaultValue 'default'\n       * @see mobileButtonVariants\n       */\n      size: {\n        sm: 'h-10 px-4 text-sm',\n        default: 'h-12 px-6 text-base',\n        lg: 'h-14 px-8 text-lg',\n        full: 'h-12 w-full text-base',\n        icon: 'h-12 w-12',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\n/**\n * Builds fixed-position classes for circular or extended floating action buttons.\n * @param props - Optional declared variant axes and additional class/className values; omission applies the CVA defaults documented below.\n * @returns The fixed-position FAB class string; position defaults to bottom-right and extended to false.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. variant and size default to default; sizes sm/lg/full/icon are also supported. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { mobileButtonVariants, fabVariants } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><div className={mobileButtonVariants()}>Touch button</div><div className={fabVariants()}>Floating action</div></>);\n * }\n * ```\n */\nexport const fabVariants = cva(\n  [\n    'fixed z-50 flex items-center justify-center gap-2',\n    'bg-primary text-primary-foreground shadow-lg',\n    'transition-all active:scale-95',\n    'focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:ring-offset-2 outline-none',\n    \"[&_svg:not([class*='size-'])]:size-6 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  ].join(' '),\n  {\n    variants: {\n      /**\n       * Fixed floating-action placement relative to the viewport.\n       * Accepted values: 'bottom-right', 'bottom-center', 'bottom-left'.\n       * @defaultValue 'bottom-right'\n       * @see fabVariants\n       */\n      position: {\n        'bottom-right': 'right-4 bottom-20',\n        'bottom-center': 'left-1/2 -translate-x-1/2 bottom-20',\n        'bottom-left': 'left-4 bottom-20',\n      },\n      /**\n       * Whether the floating action surface uses extended padding instead of a circular footprint.\n       * Accepted values: true, false.\n       * @defaultValue false\n       * @see fabVariants\n       */\n      extended: {\n        true: 'h-14 px-6 rounded-full',\n        false: 'h-14 w-14 rounded-full',\n      },\n    },\n    defaultVariants: {\n      position: 'bottom-right',\n      extended: false,\n    },\n  },\n);\n"],"mappings":";;;AAiBA,IAAaA,IAAuBC,EAElC;CACE;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG,GACV;CACE,UAAU;EAOR,SAAS;GACP,SAAS;GACT,WAAW;GACX,SAAS;GACT,OAAO;GACP,aAAa;EACf;EAOA,MAAM;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;GACJ,MAAM;GACN,MAAM;EACR;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF,GAiBaC,IAAcD,EACzB;CACE;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG,GACV;CACE,UAAU;EAOR,UAAU;GACR,gBAAgB;GAChB,iBAAiB;GACjB,eAAe;EACjB;EAOA,UAAU;GACR,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,UAAU;EACV,UAAU;CACZ;AACF,CACF"}

package/dist/ui/components/ui/mobile-form.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("./mobile-form-variants.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("@base-ui/react/button"),s=require("@base-ui/react/input");var c=i.forwardRef(({className:e,testId:n,...i},a)=>(0,r.jsx)(`form`,{ref:a,"data-slot":`mobile-form`,"data-testid":n,className:t.cn(`space-y-4 px-4 pb-safe`,e),...i}));c.displayName=`MobileForm`;var l=i.forwardRef(({title:e,description:n,className:i,children:a,...o},s)=>(0,r.jsxs)(`div`,{ref:s,"data-slot":`mobile-form-section`,className:t.cn(`space-y-3`,i),...o,children:[(e||n)&&(0,r.jsxs)(`div`,{className:`space-y-1`,children:[e&&(0,r.jsx)(`h3`,{className:`text-sm font-medium text-foreground`,children:e}),n&&(0,r.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:n})]}),(0,r.jsx)(`div`,{className:`space-y-3`,children:a})]}));l.displayName=`MobileFormSection`;var u=i.forwardRef(({label:e,error:n,helperText:a,icon:o,className:c,testId:l,...u},d)=>{let f=i.useId(),p=u.id??f,m=p+`-description`,{children:h,...g}=u;return(0,r.jsxs)(`div`,{className:`space-y-1.5`,"data-slot":`mobile-input-wrapper`,children:[(0,r.jsx)(`label`,{htmlFor:p,className:`text-sm font-medium text-foreground`,children:e}),(0,r.jsxs)(`div`,{className:`relative`,children:[o&&(0,r.jsx)(`div`,{className:`absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground`,children:o}),(0,r.jsx)(s.Input,{ref:d,"data-slot":`mobile-input`,"data-testid":l,"aria-invalid":!!n,className:t.cn(`w-full h-12 px-4 text-base rounded-lg border bg-background`,`transition-colors outline-none`,`focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]`,`aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40`,`aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 aria-invalid:ring-[3px]`,`disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,`placeholder:text-muted-foreground`,o&&`pl-10`,c),...g,id:p,"aria-describedby":[u[`aria-describedby`],(n||a)&&m].filter(Boolean).join(` `)||void 0})]}),n&&(0,r.jsx)(`p`,{id:m,className:`text-xs text-destructive`,children:n}),a&&!n&&(0,r.jsx)(`p`,{id:m,className:`text-xs text-muted-foreground`,children:a})]})});u.displayName=`MobileInput`;var d=i.forwardRef(({label:e,options:n,error:a,placeholder:o,className:s,testId:c,...l},u)=>{let d=i.useId(),f=l.id??d,p=f+`-description`;return(0,r.jsxs)(`div`,{className:`space-y-1.5`,"data-slot":`mobile-select-wrapper`,children:[(0,r.jsx)(`label`,{htmlFor:f,className:`text-sm font-medium text-foreground`,children:e}),(0,r.jsxs)(`select`,{ref:u,"data-slot":`mobile-select`,"data-testid":c,"aria-invalid":!!a,className:t.cn(`w-full h-12 px-4 text-base rounded-lg border bg-background appearance-none`,`transition-colors outline-none`,`focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]`,`aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40`,`aria-invalid:border-destructive aria-invalid:ring-[3px]`,`disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,s),...l,id:f,"aria-describedby":[l[`aria-describedby`],a&&p].filter(Boolean).join(` `)||void 0,children:[o&&(0,r.jsx)(`option`,{value:``,disabled:!0,children:o}),n.map(e=>(0,r.jsx)(`option`,{value:e.value,children:e.label},e.value))]}),a&&(0,r.jsx)(`p`,{id:p,className:`text-xs text-destructive`,children:a})]})});d.displayName=`MobileSelect`;var f=i.forwardRef(({className:e,variant:i,size:s,loading:c,icon:l,disabled:u,children:d,testId:f,...p},m)=>(0,r.jsxs)(o.Button,{ref:m,"data-slot":`mobile-button`,"data-testid":f,"data-loading":c||void 0,"aria-busy":c||void 0,disabled:u||c,className:typeof e==`function`?r=>t.cn(n.mobileButtonVariants({variant:i,size:s}),e(r)):t.cn(n.mobileButtonVariants({variant:i,size:s,className:e})),...p,children:[c?(0,r.jsx)(a.Loader2,{className:`animate-spin`,"aria-hidden":`true`}):l,d]}));f.displayName=`MobileButton`;var p=i.forwardRef(({icon:e,label:i,position:a,extended:s,className:c,testId:l,...u},d)=>(0,r.jsxs)(o.Button,{ref:d,"data-slot":`fab`,"data-testid":l,className:typeof c==`function`?e=>t.cn(n.fabVariants({position:a,extended:s||!!i}),c(e)):t.cn(n.fabVariants({position:a,extended:s||!!i,className:c})),...u,children:[e,(s||i)&&i&&(0,r.jsx)(`span`,{className:`font-medium`,children:i})]}));p.displayName=`FAB`,exports.FAB=p,exports.MobileButton=f,exports.MobileForm=c,exports.MobileFormSection=l,exports.MobileInput=u,exports.MobileSelect=d;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("./mobile-form-variants.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("@base-ui/react/button"),s=require("@base-ui/react/input");function c({ref:e,className:n,testId:i,...a}){return(0,r.jsx)(`form`,{ref:e,"data-slot":`mobile-form`,"data-testid":i,className:t.cn(`space-y-4 px-4 pb-safe`,n),...a})}c.displayName=`MobileForm`;function l({ref:e,title:n,description:i,className:a,children:o,...s}){return(0,r.jsxs)(`div`,{ref:e,"data-slot":`mobile-form-section`,className:t.cn(`space-y-3`,a),...s,children:[(n||i)&&(0,r.jsxs)(`div`,{className:`space-y-1`,children:[n&&(0,r.jsx)(`h3`,{className:`text-sm font-medium text-foreground`,children:n}),i&&(0,r.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:i})]}),(0,r.jsx)(`div`,{className:`space-y-3`,children:o})]})}l.displayName=`MobileFormSection`;function u({ref:e,label:n,error:a,helperText:o,icon:c,className:l,testId:u,...d}){let f=i.useId(),p=d.id??f,m=p+`-description`,{children:h,...g}=d;return(0,r.jsxs)(`div`,{className:`space-y-1.5`,"data-slot":`mobile-input-wrapper`,children:[(0,r.jsx)(`label`,{htmlFor:p,className:`text-sm font-medium text-foreground`,children:n}),(0,r.jsxs)(`div`,{className:`relative`,children:[c&&(0,r.jsx)(`div`,{className:`absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground`,children:c}),(0,r.jsx)(s.Input,{ref:e,"data-slot":`mobile-input`,"data-testid":u,"aria-invalid":!!a,className:t.cn(`w-full h-12 px-4 text-base rounded-lg border bg-background`,`transition-colors outline-none`,`focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]`,`aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40`,`aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 aria-invalid:ring-[3px]`,`disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,`placeholder:text-muted-foreground`,c&&`pl-10`,l),...g,id:p,"aria-describedby":[d[`aria-describedby`],(a||o)&&m].filter(Boolean).join(` `)||void 0})]}),a&&(0,r.jsx)(`p`,{id:m,className:`text-xs text-destructive`,children:a}),o&&!a&&(0,r.jsx)(`p`,{id:m,className:`text-xs text-muted-foreground`,children:o})]})}u.displayName=`MobileInput`;function d({ref:e,label:n,options:a,error:o,placeholder:s,className:c,testId:l,...u}){let d=i.useId(),f=u.id??d,p=f+`-description`;return(0,r.jsxs)(`div`,{className:`space-y-1.5`,"data-slot":`mobile-select-wrapper`,children:[(0,r.jsx)(`label`,{htmlFor:f,className:`text-sm font-medium text-foreground`,children:n}),(0,r.jsxs)(`select`,{ref:e,"data-slot":`mobile-select`,"data-testid":l,"aria-invalid":!!o,className:t.cn(`w-full h-12 px-4 text-base rounded-lg border bg-background appearance-none`,`transition-colors outline-none`,`focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]`,`aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40`,`aria-invalid:border-destructive aria-invalid:ring-[3px]`,`disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,c),...u,id:f,"aria-describedby":[u[`aria-describedby`],o&&p].filter(Boolean).join(` `)||void 0,children:[s&&(0,r.jsx)(`option`,{value:``,disabled:!0,children:s}),a.map(e=>(0,r.jsx)(`option`,{value:e.value,children:e.label},e.value))]}),o&&(0,r.jsx)(`p`,{id:p,className:`text-xs text-destructive`,children:o})]})}d.displayName=`MobileSelect`;function f({ref:e,className:i,variant:s,size:c,loading:l,icon:u,disabled:d,children:f,testId:p,...m}){return(0,r.jsxs)(o.Button,{ref:e,"data-slot":`mobile-button`,"data-testid":p,"data-loading":l||void 0,"aria-busy":l||void 0,disabled:d||l,className:typeof i==`function`?e=>t.cn(n.mobileButtonVariants({variant:s,size:c}),i(e)):t.cn(n.mobileButtonVariants({variant:s,size:c,className:i})),...m,children:[l?(0,r.jsx)(a.Loader2,{className:`animate-spin`,"aria-hidden":`true`}):u,f]})}f.displayName=`MobileButton`;function p({ref:e,icon:i,label:a,position:s,extended:c,className:l,testId:u,...d}){return(0,r.jsxs)(o.Button,{ref:e,"data-slot":`fab`,"data-testid":u,className:typeof l==`function`?e=>t.cn(n.fabVariants({position:s,extended:c||!!a}),l(e)):t.cn(n.fabVariants({position:s,extended:c||!!a,className:l})),...d,children:[i,(c||a)&&a&&(0,r.jsx)(`span`,{className:`font-medium`,children:a})]})}p.displayName=`FAB`,exports.FAB=p,exports.MobileButton=f,exports.MobileForm=c,exports.MobileFormSection=l,exports.MobileInput=u,exports.MobileSelect=d;
 //# sourceMappingURL=mobile-form.cjs.map

package/dist/ui/components/ui/mobile-form.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"mobile-form.cjs","names":["React","cn","InputPrimitive","ButtonPrimitive","mobileButtonVariants","Loader2","fabVariants","require_runtime","require_ui_lib_utils","require_ui_components_ui_mobile_form_variants","react_jsx_runtime","react","lucide_react","_base_ui_react_button","_base_ui_react_input","MobileForm","props","testId","className","MobileFormSection","title","description","MobileInput","generatedId","controlId","descriptionId","_children","restProps","label","icon","error","helperText","MobileSelect","placeholder","options","opt","MobileButton","loading","disabled","state","children","FAB","extended"],"sources":["../../../../src/ui/components/ui/mobile-form.tsx"],"sourcesContent":["/**\n * モバイル最適化フォームコンポーネント\n *\n * shadcn/ui パターンに準拠:\n * - CVA でバリアント管理\n * - @base-ui/react プリミティブ使用\n * - テーマトークン使用\n * - testId prop 対応\n */\n\nimport * as React from 'react';\nimport { Input as InputPrimitive } from '@base-ui/react/input';\nimport { Button as ButtonPrimitive } from '@base-ui/react/button';\nimport { type VariantProps } from 'class-variance-authority';\nimport { Loader2 } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { mobileButtonVariants, fabVariants } from './mobile-form-variants';\n\n// ============================================================================\n// Mobile Form Container\n// ============================================================================\n\nexport interface MobileFormProps extends React.FormHTMLAttributes<HTMLFormElement> {\n  testId?: string;\n}\n\nconst MobileForm = React.forwardRef<HTMLFormElement, MobileFormProps>(\n  ({ className, testId, ...props }, ref) => (\n    <form\n      ref={ref}\n      data-slot='mobile-form'\n      data-testid={testId}\n      className={cn('space-y-4 px-4 pb-safe', className)}\n      {...props}\n    />\n  ),\n);\nMobileForm.displayName = 'MobileForm';\n\n// ============================================================================\n// Mobile Form Section\n// ============================================================================\n\nexport interface MobileFormSectionProps extends React.HTMLAttributes<HTMLDivElement> {\n  title?: string;\n  description?: string;\n}\n\nconst MobileFormSection = React.forwardRef<HTMLDivElement, MobileFormSectionProps>(\n  ({ title, description, className, children, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot='mobile-form-section'\n      className={cn('space-y-3', className)}\n      {...props}\n    >\n      {(title || description) && (\n        <div className='space-y-1'>\n          {title && <h3 className='text-sm font-medium text-foreground'>{title}</h3>}\n          {description && <p className='text-xs text-muted-foreground'>{description}</p>}\n        </div>\n      )}\n      <div className='space-y-3'>{children}</div>\n    </div>\n  ),\n);\nMobileFormSection.displayName = 'MobileFormSection';\n\n// ============================================================================\n// Mobile Input (uses @base-ui/react Input)\n// ============================================================================\n\nexport interface MobileInputProps extends React.ComponentProps<typeof InputPrimitive> {\n  label: string;\n  error?: string;\n  helperText?: string;\n  icon?: React.ReactNode;\n  testId?: string;\n}\n\nconst MobileInput = React.forwardRef<HTMLInputElement, MobileInputProps>(\n  ({ label, error, helperText, icon, className, testId, ...props }, ref) => {\n    const generatedId = React.useId();\n    const controlId = props.id ?? generatedId;\n    const descriptionId = controlId + '-description';\n    // Exclude children from the void element\n    const {\n      children: _children,\n      ...restProps\n    } = props as MobileInputProps & {\n      children?: React.ReactNode;\n      };\n\n    return (\n      <div className='space-y-1.5' data-slot='mobile-input-wrapper'>\n        <label htmlFor={controlId} className='text-sm font-medium text-foreground'>{label}</label>\n        <div className='relative'>\n          {icon && (\n            <div className='absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground'>\n              {icon}\n            </div>\n          )}\n          <InputPrimitive\n            ref={ref}\n            data-slot='mobile-input'\n            data-testid={testId}\n            aria-invalid={!!error}\n            className={cn(\n              // Base styles\n              'w-full h-12 px-4 text-base rounded-lg border bg-background',\n              'transition-colors outline-none',\n              // Focus\n              'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n              // Error\n              'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',\n              'aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 aria-invalid:ring-[3px]',\n              // Disabled\n              'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n              // Placeholder\n              'placeholder:text-muted-foreground',\n              // Icon padding\n              icon && 'pl-10',\n              className,\n            )}\n            {...restProps}\n            id={controlId}\n            aria-describedby={[props['aria-describedby'], (error || helperText) && descriptionId].filter(Boolean).join(' ') || undefined}\n          />\n        </div>\n        {error && <p id={descriptionId} className='text-xs text-destructive'>{error}</p>}\n        {helperText && !error && <p id={descriptionId} className='text-xs text-muted-foreground'>{helperText}</p>}\n      </div>\n    );\n  },\n);\nMobileInput.displayName = 'MobileInput';\n\n// ============================================================================\n// Mobile Select\n// ============================================================================\n\nexport interface MobileSelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {\n  label: string;\n  options: Array<{ value: string; label: string }>;\n  error?: string;\n  placeholder?: string;\n  testId?: string;\n}\n\nconst MobileSelect = React.forwardRef<HTMLSelectElement, MobileSelectProps>(\n  ({ label, options, error, placeholder, className, testId, ...props }, ref) => {\n    const generatedId = React.useId();\n    const controlId = props.id ?? generatedId;\n    const descriptionId = controlId + '-description';\n    return (\n    <div className='space-y-1.5' data-slot='mobile-select-wrapper'>\n      <label htmlFor={controlId} className='text-sm font-medium text-foreground'>{label}</label>\n      <select\n        ref={ref}\n        data-slot='mobile-select'\n        data-testid={testId}\n        aria-invalid={!!error}\n        className={cn(\n          // Base\n          'w-full h-12 px-4 text-base rounded-lg border bg-background appearance-none',\n          'transition-colors outline-none',\n          // Focus\n          'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n          // Error\n          'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',\n          'aria-invalid:border-destructive aria-invalid:ring-[3px]',\n          // Disabled\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n        {...props}\n        id={controlId}\n        aria-describedby={[props['aria-describedby'], error && descriptionId].filter(Boolean).join(' ') || undefined}\n      >\n        {placeholder && (\n          <option value='' disabled>\n            {placeholder}\n          </option>\n        )}\n        {options.map((opt) => (\n          <option key={opt.value} value={opt.value}>\n            {opt.label}\n          </option>\n        ))}\n      </select>\n      {error && <p id={descriptionId} className='text-xs text-destructive'>{error}</p>}\n    </div>\n  );\n  },\n);\nMobileSelect.displayName = 'MobileSelect';\n\n// ============================================================================\n// Mobile Button (CVA variants + @base-ui/react Button)\n// ============================================================================\n\nexport interface MobileButtonProps\n  extends ButtonPrimitive.Props, VariantProps<typeof mobileButtonVariants> {\n  loading?: boolean;\n  icon?: React.ReactNode;\n  testId?: string;\n}\n\nconst MobileButton = React.forwardRef<HTMLElement, MobileButtonProps>(\n  ({ className, variant, size, loading, icon, disabled, children, testId, ...props }, ref) => {\n    const isDisabled = disabled || loading;\n\n    return (\n      <ButtonPrimitive\n        ref={ref}\n        data-slot='mobile-button'\n        data-testid={testId}\n        data-loading={loading || undefined}\n        aria-busy={loading || undefined}\n        disabled={isDisabled}\n        className={typeof className === 'function' ? state => cn(mobileButtonVariants({ variant, size }), className(state)) : cn(mobileButtonVariants({ variant, size, className }))}\n        {...props}\n      >\n        {loading ? <Loader2 className='animate-spin' aria-hidden='true' /> : icon}\n        {children}\n      </ButtonPrimitive>\n    );\n  },\n);\nMobileButton.displayName = 'MobileButton';\n\n// ============================================================================\n// Floating Action Button (FAB)\n// ============================================================================\n\nexport interface FABProps extends ButtonPrimitive.Props, VariantProps<typeof fabVariants> {\n  icon: React.ReactNode;\n  label?: string;\n  testId?: string;\n}\n\nconst FAB = React.forwardRef<HTMLElement, FABProps>(\n  ({ icon, label, position, extended, className, testId, ...props }, ref) => (\n    <ButtonPrimitive\n      ref={ref}\n      data-slot='fab'\n      data-testid={testId}\n      className={typeof className === 'function' ? state => cn(fabVariants({ position, extended: extended || !!label }), className(state)) : cn(fabVariants({ position, extended: extended || !!label, className }))}\n      {...props}\n    >\n      {icon}\n      {(extended || label) && label && <span className='font-medium'>{label}</span>}\n    </ButtonPrimitive>\n  ),\n);\nFAB.displayName = 'FAB';\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB };\n"],"mappings":"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"}
+{"version":3,"file":"mobile-form.cjs","names":["cn","React","InputPrimitive","ButtonPrimitive","mobileButtonVariants","Loader2","fabVariants","require_runtime","require_ui_lib_utils","require_ui_components_ui_mobile_form_variants","react_jsx_runtime","react","lucide_react","_base_ui_react_button","_base_ui_react_input","MobileForm","props","testId","className","MobileFormSection","title","description","MobileInput","generatedId","controlId","descriptionId","_children","restProps","label","icon","error","helperText","MobileSelect","placeholder","options","opt","MobileButton","loading","disabled","state","children","FAB","extended"],"sources":["../../../../src/ui/components/ui/mobile-form.tsx"],"sourcesContent":["/** Mobile-sized native and Base UI form controls with linked labels and Appkit variants. */\n\nimport * as React from 'react';\nimport { Input as InputPrimitive } from '@base-ui/react/input';\nimport { Button as ButtonPrimitive } from '@base-ui/react/button';\nimport { type VariantProps } from 'class-variance-authority';\nimport { Loader2 } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { mobileButtonVariants, fabVariants } from './mobile-form-variants';\n\n// ============================================================================\n// Mobile Form Container\n// ============================================================================\n\n/**\n * Native form attributes and a stable selector for MobileForm.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see MobileForm\n */\nexport interface MobileFormProps extends React.FormHTMLAttributes<HTMLFormElement> {\n  /**\n   * Stable data-testid assigned to the rendered control/container; omitted means no selector.\n   */\n  testId?: string;\n}\n\n/**\n * Renders a mobile-spaced native form without adding a form-state provider.\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 MobileForm composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction MobileForm({\n  ref,\n  className,\n  testId,\n  ...props\n}: React.PropsWithoutRef<MobileFormProps> & React.RefAttributes<HTMLFormElement>) {\n  return (\n    <form\n      ref={ref}\n      data-slot='mobile-form'\n      data-testid={testId}\n      className={cn('space-y-4 px-4 pb-safe', className)}\n      {...props}\n    />\n  );\n}\nMobileForm.displayName = 'MobileForm';\n\n// ============================================================================\n// Mobile Form Section\n// ============================================================================\n\n/**\n * Native div attributes and optional section heading/description.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see MobileFormSection\n */\nexport interface MobileFormSectionProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Optional section heading rendered before its content.\n   */\n  title?: string;\n  /**\n   * Supporting text displayed by the owning component.\n   */\n  description?: string;\n}\n\n/**\n * Groups mobile form controls under an optional title and description.\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 MobileFormSection composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction MobileFormSection({\n  ref,\n  title,\n  description,\n  className,\n  children,\n  ...props\n}: React.PropsWithoutRef<MobileFormSectionProps> & React.RefAttributes<HTMLDivElement>) {\n  return (\n    <div\n      ref={ref}\n      data-slot='mobile-form-section'\n      className={cn('space-y-3', className)}\n      {...props}\n    >\n      {(title || description) && (\n        <div className='space-y-1'>\n          {title && <h3 className='text-sm font-medium text-foreground'>{title}</h3>}\n          {description && <p className='text-xs text-muted-foreground'>{description}</p>}\n        </div>\n      )}\n      <div className='space-y-3'>{children}</div>\n    </div>\n  );\n}\nMobileFormSection.displayName = 'MobileFormSection';\n\n// ============================================================================\n// Mobile Input (uses @base-ui/react Input)\n// ============================================================================\n\n/**\n * Base UI input attributes with required visible label and linked helper/error content.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see MobileInput\n */\nexport interface MobileInputProps extends React.ComponentProps<typeof InputPrimitive> {\n  /**\n   * Visible control/option text or content; does not perform persistence or validation.\n   */\n  label: string;\n  /**\n   * Error text displayed and used to mark the control invalid; the host supplies validation results.\n   */\n  error?: string;\n  /**\n   * Supporting text linked through aria-describedby when no error is present.\n   */\n  helperText?: string;\n  /**\n   * Leading visual content; provide an accessible name separately when it is the only button content.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Stable data-testid assigned to the rendered control/container; omitted means no selector.\n   */\n  testId?: string;\n}\n\n/**\n * Renders a labeled large-touch input with generated IDs and linked helper/error text.\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 MobileInput composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction MobileInput({\n  ref,\n  label,\n  error,\n  helperText,\n  icon,\n  className,\n  testId,\n  ...props\n}: React.PropsWithoutRef<MobileInputProps> & React.RefAttributes<HTMLInputElement>) {\n  const generatedId = React.useId();\n  const controlId = props.id ?? generatedId;\n  const descriptionId = controlId + '-description';\n  // Exclude children from the void element\n  const { children: _children, ...restProps } = props as MobileInputProps & {\n    children?: React.ReactNode;\n  };\n\n  return (\n    <div className='space-y-1.5' data-slot='mobile-input-wrapper'>\n      <label htmlFor={controlId} className='text-sm font-medium text-foreground'>\n        {label}\n      </label>\n      <div className='relative'>\n        {icon && (\n          <div className='absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground'>\n            {icon}\n          </div>\n        )}\n        <InputPrimitive\n          ref={ref}\n          data-slot='mobile-input'\n          data-testid={testId}\n          aria-invalid={!!error}\n          className={cn(\n            // Base styles\n            'w-full h-12 px-4 text-base rounded-lg border bg-background',\n            'transition-colors outline-none',\n            // Focus\n            'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n            // Error\n            'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',\n            'aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 aria-invalid:ring-[3px]',\n            // Disabled\n            'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n            // Placeholder\n            'placeholder:text-muted-foreground',\n            // Icon padding\n            icon && 'pl-10',\n            className,\n          )}\n          {...restProps}\n          id={controlId}\n          aria-describedby={\n            [props['aria-describedby'], (error || helperText) && descriptionId]\n              .filter(Boolean)\n              .join(' ') || undefined\n          }\n        />\n      </div>\n      {error && (\n        <p id={descriptionId} className='text-xs text-destructive'>\n          {error}\n        </p>\n      )}\n      {helperText && !error && (\n        <p id={descriptionId} className='text-xs text-muted-foreground'>\n          {helperText}\n        </p>\n      )}\n    </div>\n  );\n}\nMobileInput.displayName = 'MobileInput';\n\n// ============================================================================\n// Mobile Select\n// ============================================================================\n\n/**\n * Native select attributes with required label and option data.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see MobileSelect\n */\nexport interface MobileSelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {\n  /**\n   * Visible control/option text or content; does not perform persistence or validation.\n   */\n  label: string;\n  /**\n   * Native option entries in display order; each value must be a stable unique string and label is its visible text.\n   */\n  options: Array<{ /**\n * Identity for this choice within the surrounding group; provide a distinct stable string.\n */\n  /**\n   * Identity for this choice within the surrounding group; provide a distinct stable string.\n   */\n  value: string; /**\n * Visible control/option text or content; does not perform persistence or validation.\n */\n  /**\n   * Visible control/option text or content; does not perform persistence or validation.\n   */\n  label: string }>;\n  /**\n   * Error text displayed and used to mark the control invalid; the host supplies validation results.\n   */\n  error?: string;\n  /**\n   * Text displayed while no value is selected/entered; omitted means no placeholder.\n   */\n  placeholder?: string;\n  /**\n   * Stable data-testid assigned to the rendered control/container; omitted means no selector.\n   */\n  testId?: string;\n}\n\n/**\n * Renders a labeled native select with generated IDs and linked error text.\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 MobileSelect composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction MobileSelect({\n  ref,\n  label,\n  options,\n  error,\n  placeholder,\n  className,\n  testId,\n  ...props\n}: React.PropsWithoutRef<MobileSelectProps> & React.RefAttributes<HTMLSelectElement>) {\n  const generatedId = React.useId();\n  const controlId = props.id ?? generatedId;\n  const descriptionId = controlId + '-description';\n  return (\n    <div className='space-y-1.5' data-slot='mobile-select-wrapper'>\n      <label htmlFor={controlId} className='text-sm font-medium text-foreground'>\n        {label}\n      </label>\n      <select\n        ref={ref}\n        data-slot='mobile-select'\n        data-testid={testId}\n        aria-invalid={!!error}\n        className={cn(\n          // Base\n          'w-full h-12 px-4 text-base rounded-lg border bg-background appearance-none',\n          'transition-colors outline-none',\n          // Focus\n          'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n          // Error\n          'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',\n          'aria-invalid:border-destructive aria-invalid:ring-[3px]',\n          // Disabled\n          'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n          className,\n        )}\n        {...props}\n        id={controlId}\n        aria-describedby={\n          [props['aria-describedby'], error && descriptionId].filter(Boolean).join(' ') || undefined\n        }\n      >\n        {placeholder && (\n          <option value='' disabled>\n            {placeholder}\n          </option>\n        )}\n        {options.map((opt) => (\n          <option key={opt.value} value={opt.value}>\n            {opt.label}\n          </option>\n        ))}\n      </select>\n      {error && (\n        <p id={descriptionId} className='text-xs text-destructive'>\n          {error}\n        </p>\n      )}\n    </div>\n  );\n}\nMobileSelect.displayName = 'MobileSelect';\n\n// ============================================================================\n// Mobile Button (CVA variants + @base-ui/react Button)\n// ============================================================================\n\n/**\n * Base UI button attributes with mobile variants, loading state and optional icon.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see MobileButton\n */\nexport interface MobileButtonProps\n  extends ButtonPrimitive.Props, VariantProps<typeof mobileButtonVariants> {\n  /**\n   * Shows the loading spinner and disables activation when true; omitted means not loading. This does not manage an asynchronous task.\n   */\n  loading?: boolean;\n  /**\n   * Leading visual content; provide an accessible name separately when it is the only button content.\n   */\n  icon?: React.ReactNode;\n  /**\n   * Stable data-testid assigned to the rendered control/container; omitted means no selector.\n   */\n  testId?: string;\n}\n\n/**\n * Renders a large-touch Base UI button with optional loading spinner or leading icon.\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 MobileButton composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction MobileButton({\n  ref,\n  className,\n  variant,\n  size,\n  loading,\n  icon,\n  disabled,\n  children,\n  testId,\n  ...props\n}: React.PropsWithoutRef<MobileButtonProps> & React.RefAttributes<HTMLElement>) {\n  const isDisabled = disabled || loading;\n\n  return (\n    <ButtonPrimitive\n      ref={ref}\n      data-slot='mobile-button'\n      data-testid={testId}\n      data-loading={loading || undefined}\n      aria-busy={loading || undefined}\n      disabled={isDisabled}\n      className={\n        typeof className === 'function'\n          ? (state) => cn(mobileButtonVariants({ variant, size }), className(state))\n          : cn(mobileButtonVariants({ variant, size, className }))\n      }\n      {...props}\n    >\n      {loading ? <Loader2 className='animate-spin' aria-hidden='true' /> : icon}\n      {children}\n    </ButtonPrimitive>\n  );\n}\nMobileButton.displayName = 'MobileButton';\n\n// ============================================================================\n// Floating Action Button (FAB)\n// ============================================================================\n\n/**\n * Base UI button attributes and fixed-position floating-action styling.\n * @remarks Inherited native or primitive props keep their upstream types and behavior; this declaration documents only the wrapper-owned options.\n * @see FAB\n */\nexport interface FABProps extends ButtonPrimitive.Props, VariantProps<typeof fabVariants> {\n  /**\n   * Required visual content in the floating action button; provide aria-label for icon-only use.\n   */\n  icon: React.ReactNode;\n  /**\n   * Optional visible text; a truthy label forces extended styling even when extended=false.\n   */\n  label?: string;\n  /**\n   * Stable data-testid assigned to the rendered control/container; omitted means no selector.\n   */\n  testId?: string;\n}\n\n/**\n * Renders a fixed floating action button that expands when label content is supplied.\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 FAB composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. The host owns submit effects and values. Input/Select use the caller id or React useId and append -description for help/errors; error text takes precedence over helperText. testId targets the control/form/button. MobileInput uses Base UI Input directly, not Appkit Input numeric normalization. MobileButton loading disables it and replaces icon with a spinner. FAB label forces extended styling even if extended=false; an icon-only FAB needs an accessible name. The ref prop forwards to the rendered control or container declared by the component ref type.\n * @example\n * ```tsx\n * import { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<><MobileForm onSubmit={event => event.preventDefault()}><MobileFormSection title=\"Contact\"><MobileInput label=\"Name\" /><MobileSelect label=\"Method\" defaultValue=\"email\" options={[{ value: \"email\", label: \"Email\" }]} /><MobileButton type=\"submit\">Save</MobileButton></MobileFormSection></MobileForm><FAB icon={<span>+</span>} label=\"Create\" /></>);\n * }\n * ```\n */\nfunction FAB({\n  ref,\n  icon,\n  label,\n  position,\n  extended,\n  className,\n  testId,\n  ...props\n}: React.PropsWithoutRef<FABProps> & React.RefAttributes<HTMLElement>) {\n  return (\n    <ButtonPrimitive\n      ref={ref}\n      data-slot='fab'\n      data-testid={testId}\n      className={\n        typeof className === 'function'\n          ? (state) =>\n              cn(fabVariants({ position, extended: extended || !!label }), className(state))\n          : cn(fabVariants({ position, extended: extended || !!label, className }))\n      }\n      {...props}\n    >\n      {icon}\n      {(extended || label) && label && <span className='font-medium'>{label}</span>}\n    </ButtonPrimitive>\n  );\n}\nFAB.displayName = 'FAB';\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport { MobileForm, MobileFormSection, MobileInput, MobileSelect, MobileButton, FAB };\n"],"mappings":"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"}