@alneas/appkit-react 0.1.0 → 0.2.0

package/dist/ui/components/ui/navigation-menu-components.d.ts

@@ -1,34 +1,130 @@
 import { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';
 /**
- * ナビゲーションメニューのルートコンポーネント。
+ * Coordinates navigation items and appends a shared popup positioner.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenu composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenu({ className, children, ...props }: NavigationMenuPrimitive.Root.Props): import('react').JSX.Element;
 /**
- * ナビゲーションアイテムを横並びにするためのリストコンテナ。
+ * Lays out top-level navigation items in a horizontal list.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuList composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuList({ className, ...props }: NavigationMenuPrimitive.List.Props): import('react').JSX.Element;
 /**
- * ナビゲーションメニュー内の個々の項目。
+ * Associates a navigation trigger/link with its content.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuItem composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuItem({ className, ...props }: NavigationMenuPrimitive.Item.Props): import('react').JSX.Element;
 /**
- * サブメニューを展開するためのトリガーボタン。
+ * Renders a navigation popup opener with a chevron.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuTrigger composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuTrigger({ className, children, ...props }: NavigationMenuPrimitive.Trigger.Props): import('react').JSX.Element;
 /**
- * トリガーによって展開されるサブメニューのコンテンツコンテナ。
+ * Renders the content associated with its navigation item.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuContent composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuContent({ className, ...props }: NavigationMenuPrimitive.Content.Props): import('react').JSX.Element;
 /**
- * サブメニューのポップアップ位置を制御するポジショナーコンポーネント。
+ * Portals the shared navigation popup and viewport with configurable alignment.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: side='bottom', sideOffset=8, align='start', alignOffset=0.
+ * @returns The rendered NavigationMenuPositioner composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.  children are replaced by the shared popup/viewport composition.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuPositioner({ className, side, sideOffset, align, alignOffset, ...props }: NavigationMenuPrimitive.Positioner.Props): import('react').JSX.Element;
 /**
- * ナビゲーション用のリンクコンポーネント。
+ * Renders an accessible navigation link inside the menu.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuLink composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuLink({ className, ...props }: NavigationMenuPrimitive.Link.Props): import('react').JSX.Element;
 /**
- * 現在アクティブな項目を指し示すインジケーター。
+ * Renders a diamond-shaped decoration through the Base UI navigation icon primitive.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NavigationMenuIndicator composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.  children are replaced by the diamond-shaped marker.
+ * @example
+ * ```tsx
+ * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href="/overview">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);
+ * }
+ * ```
  */
 declare function NavigationMenuIndicator({ className, ...props }: NavigationMenuPrimitive.Icon.Props): import('react').JSX.Element;
 export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuPositioner, };

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

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu-components.js","names":["NavigationMenuPrimitive","NavigationMenu$1","NavigationMenu","props","cn","className","children","NavigationMenuPositioner","NavigationMenuList","NavigationMenuItem","NavigationMenuTrigger","navigationMenuTriggerStyle","ChevronDown","NavigationMenuContent","NavigationMenuLink","NavigationMenuIndicator"],"sources":["../../../../src/ui/components/ui/navigation-menu-components.tsx"],"sourcesContent":["'use client';\n\nimport { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';\nimport { ChevronDown } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { navigationMenuTriggerStyle } from './navigation-menu-variants';\n\n/**\n * ナビゲーションメニューのルートコンポーネント。\n */\nfunction NavigationMenu({ className, children, ...props }: NavigationMenuPrimitive.Root.Props) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot='navigation-menu'\n      className={cn(\n        'max-w-max group/navigation-menu relative flex max-w-max flex-1 items-center justify-center',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <NavigationMenuPositioner />\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/**\n * ナビゲーションアイテムを横並びにするためのリストコンテナ。\n */\nfunction NavigationMenuList({ className, ...props }: NavigationMenuPrimitive.List.Props) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot='navigation-menu-list'\n      className={cn('gap-0 group flex flex-1 list-none items-center justify-center', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * ナビゲーションメニュー内の個々の項目。\n */\nfunction NavigationMenuItem({ className, ...props }: NavigationMenuPrimitive.Item.Props) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot='navigation-menu-item'\n      className={cn('relative', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * サブメニューを展開するためのトリガーボタン。\n */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: NavigationMenuPrimitive.Trigger.Props) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot='navigation-menu-trigger'\n      className={cn(navigationMenuTriggerStyle(), 'group', className)}\n      {...props}\n    >\n      {children}{' '}\n      <ChevronDown\n        className='relative top-[1px] ml-1 size-3 transition duration-300 group-data-open/navigation-menu-trigger:rotate-180 group-data-popup-open/navigation-menu-trigger:rotate-180'\n        aria-hidden='true'\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/**\n * トリガーによって展開されるサブメニューのコンテンツコンテナ。\n */\nfunction NavigationMenuContent({ className, ...props }: NavigationMenuPrimitive.Content.Props) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot='navigation-menu-content'\n      className={cn(\n        'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:ring-foreground/10 p-1 ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:duration-300 h-full w-auto **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * サブメニューのポップアップ位置を制御するポジショナーコンポーネント。\n */\nfunction NavigationMenuPositioner({\n  className,\n  side = 'bottom',\n  sideOffset = 8,\n  align = 'start',\n  alignOffset = 0,\n  ...props\n}: NavigationMenuPrimitive.Positioner.Props) {\n  return (\n    <NavigationMenuPrimitive.Portal>\n      <NavigationMenuPrimitive.Positioner\n        side={side}\n        sideOffset={sideOffset}\n        align={align}\n        alignOffset={alignOffset}\n        className={cn(\n          'transition-[top,left,right,bottom] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0 isolate z-50 h-[var(--positioner-height)] w-[var(--positioner-width)] max-w-[var(--available-width)] data-[instant]:transition-none',\n          className,\n        )}\n        {...props}\n      >\n        <NavigationMenuPrimitive.Popup className='bg-popover text-popover-foreground ring-foreground/10 rounded-lg shadow ring-1 transition-all ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-[ending-style]:scale-90 data-[ending-style]:opacity-0 data-[ending-style]:duration-150 data-[starting-style]:scale-90 data-[starting-style]:opacity-0 xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin)'>\n          <NavigationMenuPrimitive.Viewport className='relative size-full overflow-hidden' />\n        </NavigationMenuPrimitive.Popup>\n      </NavigationMenuPrimitive.Positioner>\n    </NavigationMenuPrimitive.Portal>\n  );\n}\n\n/**\n * ナビゲーション用のリンクコンポーネント。\n */\nfunction NavigationMenuLink({ className, ...props }: NavigationMenuPrimitive.Link.Props) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot='navigation-menu-link'\n      className={cn(\n        \"data-active:focus:bg-muted data-active:hover:bg-muted data-active:bg-muted/50 focus-visible:ring-ring/50 hover:bg-muted focus:bg-muted flex items-center gap-2 rounded-lg p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4 [[data-slot=navigation-menu-content]_&]:rounded-md\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * 現在アクティブな項目を指し示すインジケーター。\n */\nfunction NavigationMenuIndicator({ className, ...props }: NavigationMenuPrimitive.Icon.Props) {\n  return (\n    <NavigationMenuPrimitive.Icon\n      data-slot='navigation-menu-indicator'\n      className={cn(\n        'data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <div className='bg-border rounded-tl-sm shadow-md relative top-[60%] h-2 w-2 rotate-45' />\n    </NavigationMenuPrimitive.Icon>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuPositioner,\n};\n"],"mappings":";;;;;;;;AAWA,SAASE,EAAe,EAAE,cAAW,aAAU,GAAGC,KAA6C;CAC7F,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,8FACAC,CACF;EACA,GAAIF;EANN,UAAA,CAQGG,GACD,kBAACC,GAAD,CAA2B,CAAA,CACC;;AAElC;AAKA,SAASC,EAAmB,EAAE,cAAW,GAAGL,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EAAG,iEAAiEC,CAAS;EACxF,GAAIF;CACL,CAAA;AAEL;AAKA,SAASM,EAAmB,EAAE,cAAW,GAAGN,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EAAG,YAAYC,CAAS;EACnC,GAAIF;CACL,CAAA;AAEL;AAKA,SAASO,EAAsB,EAC7B,cACA,aACA,GAAGP,KACqC;CACxC,OACE,kBAACH,EAAwB,SAAzB;EACE,aAAU;EACV,WAAWI,EAAGO,EAA2B,GAAG,SAASN,CAAS;EAC9D,GAAIF;EAHN,UAAA;GAKGG;GAAU;GACX,kBAACM,GAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;AAKA,SAASC,EAAsB,EAAE,cAAW,GAAGV,KAAgD;CAC7F,OACE,kBAACH,EAAwB,SAAzB;EACE,aAAU;EACV,WAAWI,EACT,yuCACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASI,EAAyB,EAChC,cACA,UAAO,UACP,gBAAa,GACb,WAAQ,SACR,iBAAc,GACd,GAAGJ,KACwC;CAC3C,OACE,kBAACH,EAAwB,QAAzB,EAAA,UACE,kBAACA,EAAwB,YAAzB;EACQ;EACM;EACL;EACM;EACb,WAAWI,EACT,mUACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACH,EAAwB,OAAzB;GAA+B,WAAU;GACvC,UAAA,kBAACA,EAAwB,UAAzB,EAAkC,WAAU,qCAAsC,CAAA;EACrD,CAAA;CACG,CAAA,EACN,CAAA;AAEpC;AAKA,SAASc,EAAmB,EAAE,cAAW,GAAGX,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,8VACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASY,EAAwB,EAAE,cAAW,GAAGZ,KAA6C;CAC5F,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,gMACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAAC,OAAD,EAAK,WAAU,yEAA0E,CAAA;CAC7D,CAAA;AAElC"}
+{"version":3,"file":"navigation-menu-components.js","names":["NavigationMenuPrimitive","NavigationMenu$1","NavigationMenu","props","cn","className","children","NavigationMenuPositioner","NavigationMenuList","NavigationMenuItem","NavigationMenuTrigger","navigationMenuTriggerStyle","ChevronDown","NavigationMenuContent","NavigationMenuLink","NavigationMenuIndicator"],"sources":["../../../../src/ui/components/ui/navigation-menu-components.tsx"],"sourcesContent":["'use client';\n\nimport { NavigationMenu as NavigationMenuPrimitive } from '@base-ui/react/navigation-menu';\nimport { ChevronDown } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { navigationMenuTriggerStyle } from './navigation-menu-variants';\n\n/**\n * Coordinates navigation items and appends a shared popup positioner.\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 NavigationMenu composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenu({ className, children, ...props }: NavigationMenuPrimitive.Root.Props) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot='navigation-menu'\n      className={cn(\n        'max-w-max group/navigation-menu relative flex max-w-max flex-1 items-center justify-center',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <NavigationMenuPositioner />\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/**\n * Lays out top-level navigation items in a horizontal list.\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 NavigationMenuList composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuList({ className, ...props }: NavigationMenuPrimitive.List.Props) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot='navigation-menu-list'\n      className={cn('gap-0 group flex flex-1 list-none items-center justify-center', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Associates a navigation trigger/link with its content.\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 NavigationMenuItem composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuItem({ className, ...props }: NavigationMenuPrimitive.Item.Props) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot='navigation-menu-item'\n      className={cn('relative', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a navigation popup opener with a 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 NavigationMenuTrigger composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: NavigationMenuPrimitive.Trigger.Props) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot='navigation-menu-trigger'\n      className={cn(navigationMenuTriggerStyle(), 'group', className)}\n      {...props}\n    >\n      {children}{' '}\n      <ChevronDown\n        className='relative top-[1px] ml-1 size-3 transition duration-300 group-data-open/navigation-menu-trigger:rotate-180 group-data-popup-open/navigation-menu-trigger:rotate-180'\n        aria-hidden='true'\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/**\n * Renders the content associated with its navigation item.\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 NavigationMenuContent composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuContent({ className, ...props }: NavigationMenuPrimitive.Content.Props) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot='navigation-menu-content'\n      className={cn(\n        'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:ring-foreground/10 p-1 ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:duration-300 h-full w-auto **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Portals the shared navigation popup and viewport with configurable alignment.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling. Wrapper defaults: side='bottom', sideOffset=8, align='start', alignOffset=0.\n * @returns The rendered NavigationMenuPositioner composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.  children are replaced by the shared popup/viewport composition.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuPositioner({\n  className,\n  side = 'bottom',\n  sideOffset = 8,\n  align = 'start',\n  alignOffset = 0,\n  ...props\n}: NavigationMenuPrimitive.Positioner.Props) {\n  return (\n    <NavigationMenuPrimitive.Portal>\n      <NavigationMenuPrimitive.Positioner\n        side={side}\n        sideOffset={sideOffset}\n        align={align}\n        alignOffset={alignOffset}\n        className={cn(\n          'transition-[top,left,right,bottom] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0 isolate z-50 h-[var(--positioner-height)] w-[var(--positioner-width)] max-w-[var(--available-width)] data-[instant]:transition-none',\n          className,\n        )}\n        {...props}\n      >\n        <NavigationMenuPrimitive.Popup className='bg-popover text-popover-foreground ring-foreground/10 rounded-lg shadow ring-1 transition-all ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-[ending-style]:scale-90 data-[ending-style]:opacity-0 data-[ending-style]:duration-150 data-[starting-style]:scale-90 data-[starting-style]:opacity-0 xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin)'>\n          <NavigationMenuPrimitive.Viewport className='relative size-full overflow-hidden' />\n        </NavigationMenuPrimitive.Popup>\n      </NavigationMenuPrimitive.Positioner>\n    </NavigationMenuPrimitive.Portal>\n  );\n}\n\n/**\n * Renders an accessible navigation link inside the 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 NavigationMenuLink composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuLink({ className, ...props }: NavigationMenuPrimitive.Link.Props) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot='navigation-menu-link'\n      className={cn(\n        \"data-active:focus:bg-muted data-active:hover:bg-muted data-active:bg-muted/50 focus-visible:ring-ring/50 hover:bg-muted focus:bg-muted flex items-center gap-2 rounded-lg p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4 [[data-slot=navigation-menu-content]_&]:rounded-md\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a diamond-shaped decoration through the Base UI navigation icon primitive.\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 NavigationMenuIndicator composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. Compose List/Item/Trigger/Content under NavigationMenu. The root already appends NavigationMenuPositioner; adding another creates another popup composition. Content is routed through the shared viewport by Base UI. The host supplies destinations and authorization; the Indicator export wraps Icon rather than computing active-item geometry.  children are replaced by the diamond-shaped marker.\n * @example\n * ```tsx\n * import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NavigationMenu><NavigationMenuList><NavigationMenuItem><NavigationMenuTrigger>Project</NavigationMenuTrigger><NavigationMenuContent><NavigationMenuLink href=\"/overview\">Overview</NavigationMenuLink></NavigationMenuContent></NavigationMenuItem></NavigationMenuList></NavigationMenu>);\n * }\n * ```\n */\nfunction NavigationMenuIndicator({ className, ...props }: NavigationMenuPrimitive.Icon.Props) {\n  return (\n    <NavigationMenuPrimitive.Icon\n      data-slot='navigation-menu-indicator'\n      className={cn(\n        'data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <div className='bg-border rounded-tl-sm shadow-md relative top-[60%] h-2 w-2 rotate-45' />\n    </NavigationMenuPrimitive.Icon>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuPositioner,\n};\n"],"mappings":";;;;;;;;AAuBA,SAASE,EAAe,EAAE,cAAW,aAAU,GAAGC,KAA6C;CAC7F,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,8FACAC,CACF;EACA,GAAIF;EANN,UAAA,CAQGG,GACD,kBAACC,GAAD,CAA2B,CAAA,CACC;;AAElC;AAiBA,SAASC,EAAmB,EAAE,cAAW,GAAGL,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EAAG,iEAAiEC,CAAS;EACxF,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASM,EAAmB,EAAE,cAAW,GAAGN,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EAAG,YAAYC,CAAS;EACnC,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASO,EAAsB,EAC7B,cACA,aACA,GAAGP,KACqC;CACxC,OACE,kBAACH,EAAwB,SAAzB;EACE,aAAU;EACV,WAAWI,EAAGO,EAA2B,GAAG,SAASN,CAAS;EAC9D,GAAIF;EAHN,UAAA;GAKGG;GAAU;GACX,kBAACM,GAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;AAiBA,SAASC,EAAsB,EAAE,cAAW,GAAGV,KAAgD;CAC7F,OACE,kBAACH,EAAwB,SAAzB;EACE,aAAU;EACV,WAAWI,EACT,yuCACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASI,EAAyB,EAChC,cACA,UAAO,UACP,gBAAa,GACb,WAAQ,SACR,iBAAc,GACd,GAAGJ,KACwC;CAC3C,OACE,kBAACH,EAAwB,QAAzB,EAAA,UACE,kBAACA,EAAwB,YAAzB;EACQ;EACM;EACL;EACM;EACb,WAAWI,EACT,mUACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACH,EAAwB,OAAzB;GAA+B,WAAU;GACvC,UAAA,kBAACA,EAAwB,UAAzB,EAAkC,WAAU,qCAAsC,CAAA;EACrD,CAAA;CACG,CAAA,EACN,CAAA;AAEpC;AAiBA,SAASc,EAAmB,EAAE,cAAW,GAAGX,KAA6C;CACvF,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,8VACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASY,EAAwB,EAAE,cAAW,GAAGZ,KAA6C;CAC5F,OACE,kBAACH,EAAwB,MAAzB;EACE,aAAU;EACV,WAAWI,EACT,gMACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAAC,OAAD,EAAK,WAAU,yEAA0E,CAAA;CAC7D,CAAA;AAElC"}

package/dist/ui/components/ui/navigation-menu-variants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu-variants.cjs","names":["cva","navigationMenuTriggerStyle"],"sources":["../../../../src/ui/components/ui/navigation-menu-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const navigationMenuTriggerStyle = cva(\n  'bg-background hover:bg-muted focus:bg-muted data-open:hover:bg-muted data-open:focus:bg-muted data-open:bg-muted/50 focus-visible:ring-ring/50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all focus-visible:ring-[3px] focus-visible:outline-1 disabled:opacity-50 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center disabled:pointer-events-none outline-none',\n);\n"],"mappings":"A,gFAEA,IAAaC,GAAA,E,kCAA6BD,CAAAA,CAAAA,IAAAA,CACxC,scACF,E"}
+{"version":3,"file":"navigation-menu-variants.cjs","names":["cva","navigationMenuTriggerStyle"],"sources":["../../../../src/ui/components/ui/navigation-menu-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * Builds the shared navigation-menu trigger classes.\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. No named variant axes are defined; optional class/className values add classes. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { navigationMenuTriggerStyle } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<div className={navigationMenuTriggerStyle()}>Styled content</div>);\n * }\n * ```\n */\nexport const navigationMenuTriggerStyle = cva(\n  'bg-background hover:bg-muted focus:bg-muted data-open:hover:bg-muted data-open:focus:bg-muted data-open:bg-muted/50 focus-visible:ring-ring/50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all focus-visible:ring-[3px] focus-visible:outline-1 disabled:opacity-50 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center disabled:pointer-events-none outline-none',\n);\n"],"mappings":"A,gFAiBA,IAAaC,GAAA,E,kCAA6BD,CAAAA,CAAAA,IAAAA,CACxC,scACF,E"}

package/dist/ui/components/ui/navigation-menu-variants.d.cts

@@ -1 +1,16 @@
+/**
+ * Builds the shared navigation-menu trigger classes.
+ * @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. No named variant axes are defined; optional class/className values add classes. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { navigationMenuTriggerStyle } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<div className={navigationMenuTriggerStyle()}>Styled content</div>);
+ * }
+ * ```
+ */
 export declare const navigationMenuTriggerStyle: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/ui/components/ui/navigation-menu-variants.d.ts

@@ -1 +1,16 @@
+/**
+ * Builds the shared navigation-menu trigger classes.
+ * @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. No named variant axes are defined; optional class/className values add classes. These pure CVA helpers return class strings and do not add behavior or DOM attributes.
+ * @example
+ * ```tsx
+ * import { navigationMenuTriggerStyle } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<div className={navigationMenuTriggerStyle()}>Styled content</div>);
+ * }
+ * ```
+ */
 export declare const navigationMenuTriggerStyle: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/ui/components/ui/navigation-menu-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu-variants.js","names":["navigationMenuTriggerStyle","cva"],"sources":["../../../../src/ui/components/ui/navigation-menu-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const navigationMenuTriggerStyle = cva(\n  'bg-background hover:bg-muted focus:bg-muted data-open:hover:bg-muted data-open:focus:bg-muted data-open:bg-muted/50 focus-visible:ring-ring/50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all focus-visible:ring-[3px] focus-visible:outline-1 disabled:opacity-50 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center disabled:pointer-events-none outline-none',\n);\n"],"mappings":";;;AAEA,IAAaA,IAA6BC,EACxC,scACF"}
+{"version":3,"file":"navigation-menu-variants.js","names":["navigationMenuTriggerStyle","cva"],"sources":["../../../../src/ui/components/ui/navigation-menu-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/**\n * Builds the shared navigation-menu trigger classes.\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. No named variant axes are defined; optional class/className values add classes. These pure CVA helpers return class strings and do not add behavior or DOM attributes.\n * @example\n * ```tsx\n * import { navigationMenuTriggerStyle } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<div className={navigationMenuTriggerStyle()}>Styled content</div>);\n * }\n * ```\n */\nexport const navigationMenuTriggerStyle = cva(\n  'bg-background hover:bg-muted focus:bg-muted data-open:hover:bg-muted data-open:focus:bg-muted data-open:bg-muted/50 focus-visible:ring-ring/50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all focus-visible:ring-[3px] focus-visible:outline-1 disabled:opacity-50 group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center disabled:pointer-events-none outline-none',\n);\n"],"mappings":";;;AAiBA,IAAaA,IAA6BC,EACxC,scACF"}

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

@@ -1 +1 @@
-{"version":3,"file":"number-field.cjs","names":["NumberFieldPrimitive","cn","Plus","Minus","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","lucide_react","_base_ui_react_number_field","NumberField","props","className","NumberFieldInput","NumberFieldScrubArea","NumberFieldGroup","NumberFieldIncrement","NumberFieldDecrement"],"sources":["../../../../src/ui/components/ui/number-field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';\nimport { Minus, Plus } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * 数値入力フィールド全体のルートコンポーネント。\n */\nfunction NumberField({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Root>) {\n  return (\n    <NumberFieldPrimitive.Root\n      data-slot='number-field'\n      className={cn('flex flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * 数値を直接入力するためのテキストフィールド。\n */\nfunction NumberFieldInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Input>) {\n  return (\n    <NumberFieldPrimitive.Input\n      data-slot='number-field-input'\n      className={cn(\n        'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 text-center',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * ドラッグ操作によって数値を増減させることができるスクラブ操作領域。\n */\nfunction NumberFieldScrubArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>) {\n  return (\n    <NumberFieldPrimitive.ScrubArea\n      data-slot='number-field-scrub-area'\n      className={cn('cursor-ew-resize', className)}\n      {...props}\n    >\n      {children}\n    </NumberFieldPrimitive.ScrubArea>\n  );\n}\n\n/**\n * 入力フィールドと増減用のボタンなどの子要素をまとめるグループコンテナ。\n */\nfunction NumberFieldGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Group>) {\n  return (\n    <NumberFieldPrimitive.Group\n      data-slot='number-field-group'\n      className={cn(\n        'flex items-center rounded-md border border-input focus-within:ring-1 focus-within:ring-ring',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * 数値を増加させるためのボタン（＋）。\n */\nfunction NumberFieldIncrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Increment>) {\n  return (\n    <NumberFieldPrimitive.Increment\n      data-slot='number-field-increment'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-r-md border-l border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Plus className='size-4' />\n    </NumberFieldPrimitive.Increment>\n  );\n}\n\n/**\n * 数値を減少させるためのボタン（ー）。\n */\nfunction NumberFieldDecrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>) {\n  return (\n    <NumberFieldPrimitive.Decrement\n      data-slot='number-field-decrement'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-l-md border-r border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Minus className='size-4' />\n    </NumberFieldPrimitive.Decrement>\n  );\n}\n\nexport {\n  NumberField,\n  NumberFieldInput,\n  NumberFieldGroup,\n  NumberFieldScrubArea,\n  NumberFieldIncrement,\n  NumberFieldDecrement,\n};\n"],"mappings":"A,uUAWA,SAASU,EAAY,CACnB,YACA,GAAGC,GACsD,CACzD,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,KAAtB,CACE,YAAU,eACV,UAAWC,EAAAA,GAAG,sBAAuBW,CAAS,EAC9C,GAAID,CACL,CAAA,CAEL,CAKA,SAASE,EAAiB,CACxB,YACA,GAAGF,GACuD,CAC1D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,MAAtB,CACE,YAAU,qBACV,UAAWC,EAAAA,GACT,oVACAW,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAKA,SAASG,EAAqB,CAC5B,YACA,WACA,GAAGH,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,0BACV,UAAWC,EAAAA,GAAG,mBAAoBW,CAAS,EAC3C,GAAID,EAEH,UAC6B,CAAA,CAEpC,CAKA,SAASI,EAAiB,CACxB,YACA,GAAGJ,GACuD,CAC1D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,MAAtB,CACE,YAAU,qBACV,UAAWC,EAAAA,GACT,8FACAW,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAKA,SAASK,EAAqB,CAC5B,YACA,GAAGL,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,yBACV,UAAWC,EAAAA,GACT,gRACAW,CACF,EACA,GAAID,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAACJ,EAAAA,KAAD,CAAM,UAAU,QAAU,CAAA,CACI,CAAA,CAEpC,CAKA,SAASe,EAAqB,CAC5B,YACA,GAAGN,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,yBACV,UAAWC,EAAAA,GACT,gRACAW,CACF,EACA,GAAID,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAACH,EAAAA,MAAD,CAAO,UAAU,QAAU,CAAA,CACG,CAAA,CAEpC,C"}
+{"version":3,"file":"number-field.cjs","names":["NumberFieldPrimitive","cn","Plus","Minus","require_runtime","require_ui_lib_utils","react_jsx_runtime","react","lucide_react","_base_ui_react_number_field","NumberField","props","className","NumberFieldInput","NumberFieldScrubArea","NumberFieldGroup","NumberFieldIncrement","NumberFieldDecrement"],"sources":["../../../../src/ui/components/ui/number-field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';\nimport { Minus, Plus } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates an accessible numeric value and its editing controls.\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 NumberField composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberField({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Root>) {\n  return (\n    <NumberFieldPrimitive.Root\n      data-slot='number-field'\n      className={cn('flex flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders the numeric text input for its NumberField root.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered NumberFieldInput composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Input>) {\n  return (\n    <NumberFieldPrimitive.Input\n      data-slot='number-field-input'\n      className={cn(\n        'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 text-center',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a draggable region that adjusts its NumberField value.\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 NumberFieldScrubArea composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldScrubArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>) {\n  return (\n    <NumberFieldPrimitive.ScrubArea\n      data-slot='number-field-scrub-area'\n      className={cn('cursor-ew-resize', className)}\n      {...props}\n    >\n      {children}\n    </NumberFieldPrimitive.ScrubArea>\n  );\n}\n\n/**\n * Visually groups the numeric input and increment/decrement controls.\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 NumberFieldGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Group>) {\n  return (\n    <NumberFieldPrimitive.Group\n      data-slot='number-field-group'\n      className={cn(\n        'flex items-center rounded-md border border-input focus-within:ring-1 focus-within:ring-ring',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a numeric increment control with a plus 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 NumberFieldIncrement composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldIncrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Increment>) {\n  return (\n    <NumberFieldPrimitive.Increment\n      data-slot='number-field-increment'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-r-md border-l border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Plus className='size-4' />\n    </NumberFieldPrimitive.Increment>\n  );\n}\n\n/**\n * Renders a numeric decrement control with a minus 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 NumberFieldDecrement composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldDecrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>) {\n  return (\n    <NumberFieldPrimitive.Decrement\n      data-slot='number-field-decrement'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-l-md border-r border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Minus className='size-4' />\n    </NumberFieldPrimitive.Decrement>\n  );\n}\n\nexport {\n  NumberField,\n  NumberFieldInput,\n  NumberFieldGroup,\n  NumberFieldScrubArea,\n  NumberFieldIncrement,\n  NumberFieldDecrement,\n};\n"],"mappings":"A,uUAuBA,SAASU,EAAY,CACnB,YACA,GAAGC,GACsD,CACzD,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,KAAtB,CACE,YAAU,eACV,UAAWC,EAAAA,GAAG,sBAAuBW,CAAS,EAC9C,GAAID,CACL,CAAA,CAEL,CAiBA,SAASE,EAAiB,CACxB,YACA,GAAGF,GACuD,CAC1D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,MAAtB,CACE,YAAU,qBACV,UAAWC,EAAAA,GACT,oVACAW,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAiBA,SAASG,EAAqB,CAC5B,YACA,WACA,GAAGH,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,0BACV,UAAWC,EAAAA,GAAG,mBAAoBW,CAAS,EAC3C,GAAID,EAEH,UAC6B,CAAA,CAEpC,CAiBA,SAASI,EAAiB,CACxB,YACA,GAAGJ,GACuD,CAC1D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,MAAtB,CACE,YAAU,qBACV,UAAWC,EAAAA,GACT,8FACAW,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAiBA,SAASK,EAAqB,CAC5B,YACA,GAAGL,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,yBACV,UAAWC,EAAAA,GACT,gRACAW,CACF,EACA,GAAID,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAACJ,EAAAA,KAAD,CAAM,UAAU,QAAU,CAAA,CACI,CAAA,CAEpC,CAiBA,SAASe,EAAqB,CAC5B,YACA,GAAGN,GAC2D,CAC9D,OACE,EAAAL,EAAA,IAAA,CAACN,EAAAA,YAAqB,UAAtB,CACE,YAAU,yBACV,UAAWC,EAAAA,GACT,gRACAW,CACF,EACA,GAAID,EAEJ,UAAA,EAAAL,EAAA,IAAA,CAACH,EAAAA,MAAD,CAAO,UAAU,QAAU,CAAA,CACG,CAAA,CAEpC,C"}

package/dist/ui/components/ui/number-field.d.cts

@@ -1,27 +1,99 @@
 import { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';
 import * as React from 'react';
 /**
- * 数値入力フィールド全体のルートコンポーネント。
+ * Coordinates an accessible numeric value and its editing controls.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberField composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberField({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Root>): React.JSX.Element;
 /**
- * 数値を直接入力するためのテキストフィールド。
+ * Renders the numeric text input for its NumberField root.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldInput composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldInput({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Input>): React.JSX.Element;
 /**
- * ドラッグ操作によって数値を増減させることができるスクラブ操作領域。
+ * Renders a draggable region that adjusts its NumberField value.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldScrubArea composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldScrubArea({ className, children, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>): React.JSX.Element;
 /**
- * 入力フィールドと増減用のボタンなどの子要素をまとめるグループコンテナ。
+ * Visually groups the numeric input and increment/decrement controls.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldGroup composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldGroup({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Group>): React.JSX.Element;
 /**
- * 数値を増加させるためのボタン（＋）。
+ * Renders a numeric increment control with a plus icon.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldIncrement composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldIncrement({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Increment>): React.JSX.Element;
 /**
- * 数値を減少させるためのボタン（ー）。
+ * Renders a numeric decrement control with a minus icon.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldDecrement composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldDecrement({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>): React.JSX.Element;
 export { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement, };

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

@@ -1,27 +1,99 @@
 import { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';
 import * as React from 'react';
 /**
- * 数値入力フィールド全体のルートコンポーネント。
+ * Coordinates an accessible numeric value and its editing controls.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberField composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberField({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Root>): React.JSX.Element;
 /**
- * 数値を直接入力するためのテキストフィールド。
+ * Renders the numeric text input for its NumberField root.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldInput composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldInput({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Input>): React.JSX.Element;
 /**
- * ドラッグ操作によって数値を増減させることができるスクラブ操作領域。
+ * Renders a draggable region that adjusts its NumberField value.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldScrubArea composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldScrubArea({ className, children, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>): React.JSX.Element;
 /**
- * 入力フィールドと増減用のボタンなどの子要素をまとめるグループコンテナ。
+ * Visually groups the numeric input and increment/decrement controls.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldGroup composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldGroup({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Group>): React.JSX.Element;
 /**
- * 数値を増加させるためのボタン（＋）。
+ * Renders a numeric increment control with a plus icon.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldIncrement composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldIncrement({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Increment>): React.JSX.Element;
 /**
- * 数値を減少させるためのボタン（ー）。
+ * Renders a numeric decrement control with a minus icon.
+ * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.
+ * @returns The rendered NumberFieldDecrement composition.
+ * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.
+ * @example
+ * ```tsx
+ * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';
+ * import '@alneas/appkit-react/styles';
+ *
+ * export function Example() {
+ *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label="Decrease" /><NumberFieldInput aria-label="Quantity" /><NumberFieldIncrement aria-label="Increase" /></NumberFieldGroup></NumberField>);
+ * }
+ * ```
  */
 declare function NumberFieldDecrement({ className, ...props }: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>): React.JSX.Element;
 export { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement, };

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

@@ -1 +1 @@
-{"version":3,"file":"number-field.js","names":["NumberFieldPrimitive","NumberField$1","NumberField","props","cn","className","NumberFieldInput","NumberFieldScrubArea","NumberFieldGroup","NumberFieldIncrement","Plus","NumberFieldDecrement","Minus"],"sources":["../../../../src/ui/components/ui/number-field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';\nimport { Minus, Plus } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * 数値入力フィールド全体のルートコンポーネント。\n */\nfunction NumberField({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Root>) {\n  return (\n    <NumberFieldPrimitive.Root\n      data-slot='number-field'\n      className={cn('flex flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * 数値を直接入力するためのテキストフィールド。\n */\nfunction NumberFieldInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Input>) {\n  return (\n    <NumberFieldPrimitive.Input\n      data-slot='number-field-input'\n      className={cn(\n        'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 text-center',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * ドラッグ操作によって数値を増減させることができるスクラブ操作領域。\n */\nfunction NumberFieldScrubArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>) {\n  return (\n    <NumberFieldPrimitive.ScrubArea\n      data-slot='number-field-scrub-area'\n      className={cn('cursor-ew-resize', className)}\n      {...props}\n    >\n      {children}\n    </NumberFieldPrimitive.ScrubArea>\n  );\n}\n\n/**\n * 入力フィールドと増減用のボタンなどの子要素をまとめるグループコンテナ。\n */\nfunction NumberFieldGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Group>) {\n  return (\n    <NumberFieldPrimitive.Group\n      data-slot='number-field-group'\n      className={cn(\n        'flex items-center rounded-md border border-input focus-within:ring-1 focus-within:ring-ring',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * 数値を増加させるためのボタン（＋）。\n */\nfunction NumberFieldIncrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Increment>) {\n  return (\n    <NumberFieldPrimitive.Increment\n      data-slot='number-field-increment'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-r-md border-l border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Plus className='size-4' />\n    </NumberFieldPrimitive.Increment>\n  );\n}\n\n/**\n * 数値を減少させるためのボタン（ー）。\n */\nfunction NumberFieldDecrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>) {\n  return (\n    <NumberFieldPrimitive.Decrement\n      data-slot='number-field-decrement'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-l-md border-r border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Minus className='size-4' />\n    </NumberFieldPrimitive.Decrement>\n  );\n}\n\nexport {\n  NumberField,\n  NumberFieldInput,\n  NumberFieldGroup,\n  NumberFieldScrubArea,\n  NumberFieldIncrement,\n  NumberFieldDecrement,\n};\n"],"mappings":";;;;;;;;AAWA,SAASE,EAAY,EACnB,cACA,GAAGC,KACsD;CACzD,OACE,kBAACH,EAAqB,MAAtB;EACE,aAAU;EACV,WAAWI,EAAG,uBAAuBC,CAAS;EAC9C,GAAIF;CACL,CAAA;AAEL;AAKA,SAASG,EAAiB,EACxB,cACA,GAAGH,KACuD;CAC1D,OACE,kBAACH,EAAqB,OAAtB;EACE,aAAU;EACV,WAAWI,EACT,qVACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASI,EAAqB,EAC5B,cACA,aACA,GAAGJ,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EAAG,oBAAoBC,CAAS;EAC3C,GAAIF;EAEH;CAC6B,CAAA;AAEpC;AAKA,SAASK,EAAiB,EACxB,cACA,GAAGL,KACuD;CAC1D,OACE,kBAACH,EAAqB,OAAtB;EACE,aAAU;EACV,WAAWI,EACT,+FACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAKA,SAASM,EAAqB,EAC5B,cACA,GAAGN,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EACT,iRACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACO,GAAD,EAAM,WAAU,SAAU,CAAA;CACI,CAAA;AAEpC;AAKA,SAASC,EAAqB,EAC5B,cACA,GAAGR,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EACT,iRACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACS,GAAD,EAAO,WAAU,SAAU,CAAA;CACG,CAAA;AAEpC"}
+{"version":3,"file":"number-field.js","names":["NumberFieldPrimitive","NumberField$1","NumberField","props","cn","className","NumberFieldInput","NumberFieldScrubArea","NumberFieldGroup","NumberFieldIncrement","Plus","NumberFieldDecrement","Minus"],"sources":["../../../../src/ui/components/ui/number-field.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';\nimport { Minus, Plus } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\n\n/**\n * Coordinates an accessible numeric value and its editing controls.\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 NumberField composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberField({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Root>) {\n  return (\n    <NumberFieldPrimitive.Root\n      data-slot='number-field'\n      className={cn('flex flex-col gap-2', className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders the numeric text input for its NumberField root.\n * @param props - Component attributes and children accepted by the declared Base UI or native prop type; className customizes wrapper styling.\n * @returns The rendered NumberFieldInput composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Input>) {\n  return (\n    <NumberFieldPrimitive.Input\n      data-slot='number-field-input'\n      className={cn(\n        'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 text-center',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a draggable region that adjusts its NumberField value.\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 NumberFieldScrubArea composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldScrubArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.ScrubArea>) {\n  return (\n    <NumberFieldPrimitive.ScrubArea\n      data-slot='number-field-scrub-area'\n      className={cn('cursor-ew-resize', className)}\n      {...props}\n    >\n      {children}\n    </NumberFieldPrimitive.ScrubArea>\n  );\n}\n\n/**\n * Visually groups the numeric input and increment/decrement controls.\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 NumberFieldGroup composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Group>) {\n  return (\n    <NumberFieldPrimitive.Group\n      data-slot='number-field-group'\n      className={cn(\n        'flex items-center rounded-md border border-input focus-within:ring-1 focus-within:ring-ring',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Renders a numeric increment control with a plus 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 NumberFieldIncrement composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldIncrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Increment>) {\n  return (\n    <NumberFieldPrimitive.Increment\n      data-slot='number-field-increment'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-r-md border-l border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Plus className='size-4' />\n    </NumberFieldPrimitive.Increment>\n  );\n}\n\n/**\n * Renders a numeric decrement control with a minus 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 NumberFieldDecrement composition.\n * @remarks Import @alneas/appkit-react/styles in the rendering host. All editing parts require NumberField context. Base UI owns parsing, value constraints, stepping and pointer/keyboard behavior; this wrapper does not implement additional numeric defaults. Buttons render fixed plus/minus children.  children are replaced by the fixed plus/minus icon.\n * @example\n * ```tsx\n * import { NumberField, NumberFieldInput, NumberFieldGroup, NumberFieldScrubArea, NumberFieldIncrement, NumberFieldDecrement } from '@alneas/appkit-react/ui';\n * import '@alneas/appkit-react/styles';\n *\n * export function Example() {\n *   return (<NumberField defaultValue={1} min={0}><NumberFieldScrubArea>Quantity</NumberFieldScrubArea><NumberFieldGroup><NumberFieldDecrement aria-label=\"Decrease\" /><NumberFieldInput aria-label=\"Quantity\" /><NumberFieldIncrement aria-label=\"Increase\" /></NumberFieldGroup></NumberField>);\n * }\n * ```\n */\nfunction NumberFieldDecrement({\n  className,\n  ...props\n}: React.ComponentProps<typeof NumberFieldPrimitive.Decrement>) {\n  return (\n    <NumberFieldPrimitive.Decrement\n      data-slot='number-field-decrement'\n      className={cn(\n        'flex size-9 items-center justify-center rounded-l-md border-r border-input bg-transparent text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    >\n      <Minus className='size-4' />\n    </NumberFieldPrimitive.Decrement>\n  );\n}\n\nexport {\n  NumberField,\n  NumberFieldInput,\n  NumberFieldGroup,\n  NumberFieldScrubArea,\n  NumberFieldIncrement,\n  NumberFieldDecrement,\n};\n"],"mappings":";;;;;;;;AAuBA,SAASE,EAAY,EACnB,cACA,GAAGC,KACsD;CACzD,OACE,kBAACH,EAAqB,MAAtB;EACE,aAAU;EACV,WAAWI,EAAG,uBAAuBC,CAAS;EAC9C,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASG,EAAiB,EACxB,cACA,GAAGH,KACuD;CAC1D,OACE,kBAACH,EAAqB,OAAtB;EACE,aAAU;EACV,WAAWI,EACT,qVACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASI,EAAqB,EAC5B,cACA,aACA,GAAGJ,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EAAG,oBAAoBC,CAAS;EAC3C,GAAIF;EAEH;CAC6B,CAAA;AAEpC;AAiBA,SAASK,EAAiB,EACxB,cACA,GAAGL,KACuD;CAC1D,OACE,kBAACH,EAAqB,OAAtB;EACE,aAAU;EACV,WAAWI,EACT,+FACAC,CACF;EACA,GAAIF;CACL,CAAA;AAEL;AAiBA,SAASM,EAAqB,EAC5B,cACA,GAAGN,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EACT,iRACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACO,GAAD,EAAM,WAAU,SAAU,CAAA;CACI,CAAA;AAEpC;AAiBA,SAASC,EAAqB,EAC5B,cACA,GAAGR,KAC2D;CAC9D,OACE,kBAACH,EAAqB,WAAtB;EACE,aAAU;EACV,WAAWI,EACT,iRACAC,CACF;EACA,GAAIF;EAEJ,UAAA,kBAACS,GAAD,EAAO,WAAU,SAAU,CAAA;CACG,CAAA;AAEpC"}