@devalok/shilp-sutra 0.37.1 → 0.39.0

package/dist/ui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/ui/lib/check-tokens.ts","../../src/ui/index.ts"],"sourcesContent":["/**\n * Dev-mode check for missing token CSS.\n *\n * If the consumer forgets `import '@devalok/shilp-sutra/tokens'`, all CSS\n * custom properties resolve to empty strings and components render with\n * transparent/broken backgrounds. This check detects that condition and\n * warns in the console.\n *\n * Only runs once, only in development, only in the browser.\n */\nlet checked = false\n\nexport function checkTokensLoaded(): void {\n  if (checked) return\n  if (typeof window === 'undefined') return\n\n  // Skip in production — bundlers (Vite, Next.js, webpack) define import.meta.env or process.env\n  try {\n    // @ts-expect-error -- import.meta.env is Vite-specific, not in base TS lib\n    if (import.meta.env?.PROD) return\n  } catch { /* not in Vite */ }\n\n  checked = true\n\n  // Wait for stylesheets to load\n  requestAnimationFrame(() => {\n    const value = getComputedStyle(document.documentElement).getPropertyValue('--color-accent-9').trim()\n    if (!value) {\n      console.warn(\n        '[shilp-sutra] Design system tokens CSS not loaded. ' +\n        'Add `import \\'@devalok/shilp-sutra/tokens\\'` to your root layout. ' +\n        'Without it, components will render with missing colors, spacing, and typography.'\n      )\n    }\n  })\n}\n","/**\n * @module @devalok/shilp-sutra/ui\n *\n * Core UI primitives: buttons, inputs, dialogs, cards, tables, badges, navigation, and more.\n * Most components require client-side React (\"use client\").\n *\n * **Server-safe components** (import individually for Server Components):\n * `Text`, `Skeleton`, `Stack`, `Container`, `Table`, `Code`, `VisuallyHidden`\n *\n * @example\n * // Server Component — import individually:\n * import { Text } from '@devalok/shilp-sutra/ui/text'\n * import { Stack } from '@devalok/shilp-sutra/ui/stack'\n *\n * // Client Component — barrel import:\n * import { Button, Dialog } from '@devalok/shilp-sutra/ui'\n */\n\n// Dev-mode token presence check — runs once on first import\nimport { checkTokensLoaded } from './lib/check-tokens'\ncheckTokensLoaded()\n\n// Core\nexport { Button, type ButtonProps,buttonVariants } from './button'\nexport { ButtonGroup, type ButtonGroupProps,useButtonGroup } from './button-group'\nexport { ColorInput, type ColorInputProps } from './color-input'\nexport { Icon, type IconProps } from './icon'\nexport { IconButton, type IconButtonProps } from './icon-button'\nexport { IconContext, type IconContextValue, IconProvider, type IconSize, type IconStroke,useIconContext } from './icon-context'\nexport { IconGroup, type IconGroupProps } from './icon-group'\nexport { Input, type InputProps, type InputState,inputVariants } from './input'\nexport { Label, type LabelProps } from './label'\nexport { Separator, type SeparatorProps } from './separator'\nexport { SplitButton, type SplitButtonProps } from './split-button'\nexport { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden'\n\n// Autocomplete\nexport { Autocomplete, type AutocompleteOption,type AutocompleteProps } from './autocomplete'\n\n// Combobox\nexport { Combobox, type ComboboxOption, type ComboboxProps, type ComboboxSize,comboboxTriggerVariants } from './combobox'\n\n// FileUpload\nexport { FileUpload, type FileUploadProps } from './file-upload'\n\n// Form Controls\nexport { Checkbox, type CheckboxProps } from './checkbox'\nexport { FormField, type FormFieldProps, type FormHelperState, FormHelperText, type FormHelperTextProps,useFormField } from './form'\nexport { InputOTP, InputOTPGroup, type InputOTPProps,InputOTPSeparator, InputOTPSlot } from './input-otp'\nexport { NumberInput, type NumberInputProps, type NumberInputSize, type NumberInputState,numberInputWrapperVariants } from './number-input'\nexport { RadioGroup, RadioGroupItem, type RadioGroupItemProps,type RadioGroupProps } from './radio'\nexport { SearchInput, type SearchInputProps } from './search-input'\nexport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectScrollDownButton,\n  SelectScrollUpButton,\n  SelectSeparator,\n  SelectTrigger,\n  type SelectTriggerProps,\n  selectTriggerVariants,\n  SelectValue,\n} from './select'\nexport { Slider, type SliderColor,type SliderProps, type SliderSize, sliderThumbVariants, sliderTrackVariants } from './slider'\nexport { Switch, type SwitchProps } from './switch'\nexport { Textarea, type TextareaProps,textareaVariants } from './textarea'\nexport { Toggle, type ToggleProps,toggleVariants } from './toggle'\nexport { ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps,type ToggleGroupProps } from './toggle-group'\n\n// Feedback & Overlays\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  type AlertDialogActionProps,\n  AlertDialogCancel,\n  type AlertDialogCancelProps,\n  AlertDialogContent,\n  type AlertDialogContentProps,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n} from './alert-dialog'\nexport { Collapsible, CollapsibleContent, type CollapsibleProps,CollapsibleTrigger } from './collapsible'\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  type DialogContentProps,\n  DialogContentRaw,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  type DialogTitleProps,\n  DialogTrigger,\n} from './dialog'\nexport { HoverCard, HoverCardContent, type HoverCardContentProps,HoverCardTrigger } from './hover-card'\nexport { Popover, PopoverAnchor, PopoverContent, type PopoverContentProps,PopoverTrigger } from './popover'\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  type SheetContentProps,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n} from './sheet'\nexport {\n  formatFileSize,\n  toast,\n  type ToastActionOptions,\n  type ToastOptions,\n  type ToastProps,\n  type ToastType,\n  type ToastUndoOptions,\n  type ToastUploadOptions,\n  type UploadFile,\n} from './toast'\nexport { Toaster, type ToasterProps } from './toaster'\nexport { Tooltip, TooltipContent, type TooltipContentProps,TooltipProvider, TooltipTrigger } from './tooltip'\n// ---------------------------------------------------------------------------\n// Notifications — pick the right one:\n//   Alert   — inline, static feedback within a form or page section (no user action needed to show)\n//   Banner  — persistent, page-level notice shown above main content (survives navigation)\n//   Toast   — imperative, transient, action-triggered (fires on user action, auto-dismisses)\n//             Requires <Toaster /> mounted once at layout root. Use toast.success() etc. from anywhere.\n// ---------------------------------------------------------------------------\nexport { Alert, type AlertProps,alertVariants } from './alert'\nexport { Banner, type BannerProps,bannerVariants } from './banner'\nexport { Spinner, type SpinnerProps } from './spinner'\n\n// Data Display\nexport { AspectRatio } from './aspect-ratio'\nexport { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarProps, type AvatarRing,type AvatarStatus, avatarVariants } from './avatar'\nexport { Badge, type BadgeProps,badgeVariants } from './badge'\nexport { BadgeGroup, type BadgeGroupProps } from './badge-group'\nexport { BadgeIndicator, type BadgeIndicatorProps } from './badge-indicator'\nexport { Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps,CardTitle, cardVariants } from './card'\nexport { Code, type CodeProps } from './code'\nexport { ColorSwatch, type ColorSwatchProps } from './color-swatch'\nexport { Progress, progressIndicatorVariants, type ProgressProps,progressTrackVariants } from './progress'\nexport { MultiProgressRing, type MultiProgressRingProps,ProgressRing, type ProgressRingProps } from './progress-ring'\nexport {\n  Skeleton,\n  SkeletonAvatar,\n  type SkeletonAvatarProps,\n  SkeletonButton,\n  type SkeletonButtonProps,\n  SkeletonChart,\n  type SkeletonChartProps,\n  SkeletonGroup,\n  type SkeletonGroupProps,\n  SkeletonImage,\n  type SkeletonImageProps,\n  SkeletonInput,\n  type SkeletonInputProps,\n  type SkeletonProps,\n  SkeletonText,\n  type SkeletonTextProps,\n  skeletonVariants,\n} from './skeleton'\nexport { StatCard, type StatCardProps } from './stat-card'\nexport { StatusDot, type StatusDotProps, type StatusDotStatus } from './status-dot'\nexport { Table, TableBody, TableCaption, TableCell, type TableCellProps,TableFooter, TableHead, TableHeader, type TableProps, TableRow, type TableRowProps } from './table'\n\n// Navigation\nexport { Accordion, AccordionContent, type AccordionContentProps,AccordionItem, type AccordionItemProps, AccordionTrigger, type AccordionTriggerProps } from './accordion'\nexport {\n  Breadcrumb,\n  BreadcrumbEllipsis,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  type BreadcrumbLinkProps,\n  BreadcrumbList,\n  BreadcrumbPage,\n  type BreadcrumbProps,\n  BreadcrumbSeparator,\n} from './breadcrumb'\nexport {\n  ContextMenu,\n  ContextMenuCheckboxItem,\n  ContextMenuContent,\n  type ContextMenuContentProps,\n  ContextMenuGroup,\n  ContextMenuItem,\n  type ContextMenuItemProps,\n  ContextMenuLabel,\n  ContextMenuPortal,\n  ContextMenuRadioGroup,\n  ContextMenuRadioItem,\n  ContextMenuSeparator,\n  ContextMenuShortcut,\n  ContextMenuSub,\n  ContextMenuSubContent,\n  ContextMenuSubTrigger,\n  ContextMenuTrigger,\n} from './context-menu'\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  type DropdownMenuContentProps,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  type DropdownMenuItemProps,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from './dropdown-menu'\nexport {\n  Menubar,\n  MenubarCheckboxItem,\n  MenubarContent,\n  type MenubarContentProps,\n  MenubarGroup,\n  MenubarItem,\n  type MenubarItemProps,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarPortal,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarShortcut,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n} from './menubar'\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  type NavigationMenuContentProps,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  type NavigationMenuProps,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n} from './navigation-menu'\nexport {\n  generatePagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  type PaginationLinkProps,\n  PaginationNav,\n  type PaginationNavProps,\n  PaginationNext,\n  PaginationPrevious,\n  PaginationRoot,\n} from './pagination'\nexport {\n  Sidebar,\n  SidebarContent,\n  SidebarFooter,\n  SidebarGroup,\n  SidebarGroupAction,\n  SidebarGroupContent,\n  SidebarGroupLabel,\n  SidebarHeader,\n  SidebarInput,\n  SidebarInset,\n  SidebarMenu,\n  SidebarMenuAction,\n  SidebarMenuBadge,\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSkeleton,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n  type SidebarProps,\n  SidebarProvider,\n  SidebarRail,\n  SidebarSeparator,\n  SidebarTrigger,\n  useSidebar,\n} from './sidebar'\nexport { Tabs, type TabsColor, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsOrientation,type TabsProps, type TabsSize, TabsTrigger, type TabsTriggerProps } from './tabs'\n\n// Workflow\nexport { Step, Stepper, type StepperProps, type StepProps } from './stepper'\n\n\n// Typography\nexport { Text, type TextProps, type TextVariant,textVariants } from './text'\n\n// Layout\nexport { Container, type ContainerProps } from './container'\nexport { type SpacingToken,Stack, type StackProps } from './stack'\n\n// Tree View\nexport { TreeItem, type TreeItemProps, type TreeNode,TreeView, type TreeViewProps, useTree } from './tree-view'\n\n// Segmented Control\nexport {\n  SegmentedControl,\n  type SegmentedControlOption,\n  type SegmentedControlProps,\n  type SegmentedControlSize,\n  type SegmentedControlVariant,\n} from './segmented-control'\n\n// Brand Texture\nexport { DevalokGrain, type DevalokGrainProps, type GrainIntensity } from './devalok-grain'\n\n// Chat primitives\nexport {\n  DateSeparator,\n  type DateSeparatorProps,\n  Message,\n  type MessageActionProps,\n  type MessageActionsProps,\n  type MessageAuthorProps,\n  type MessageAvatarProps,\n  type MessageBodyProps,\n  type MessageContentProps,\n  type MessageContextValue,\n  type MessageEditableBodyProps,\n  MessageInput,\n  type MessageInputProps,\n  MessageList,\n  type MessageListProps,\n  type MessageProps,\n  type MessageReactionsProps,\n  SystemMessage,\n  type SystemMessageProps,\n  TypingIndicator,\n  type TypingIndicatorProps,\n  UnreadSeparator,\n  type UnreadSeparatorProps,\n  useMessageContext,\n} from './chat'\n\n// Other\nexport { Link, type LinkProps } from './link'\n\n// Utilities\nexport { formatRelativeTime } from './lib/date-utils'\nexport type { SpringPreset, TweenPreset } from './lib/motion'\nexport { springs, stagger, tweens, withReducedMotion } from './lib/motion'\nexport { cn } from './lib/utils'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAI,IAAU;AAEd,SAAgB,KAA0B;AACpC,WACA,SAAO,SAAW,MAGtB;MAAI;AAEyB;UACrB;AAKR,EAHA,IAAU,IAGV,4BAA4B;AAE1B,GADc,iBAAiB,SAAS,gBAAgB,CAAC,iBAAiB,mBAAmB,CAAC,MAAM,IAElG,QAAQ,KACN,sMAGD;IAEH;;;;;ACdJ,IAAmB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/ui/lib/check-tokens.ts","../../src/ui/index.ts"],"sourcesContent":["/**\n * Dev-mode check for missing token CSS.\n *\n * If the consumer forgets `import '@devalok/shilp-sutra/tokens'`, all CSS\n * custom properties resolve to empty strings and components render with\n * transparent/broken backgrounds. This check detects that condition and\n * warns in the console.\n *\n * Only runs once, only in development, only in the browser.\n */\nlet checked = false\n\nexport function checkTokensLoaded(): void {\n  if (checked) return\n  if (typeof window === 'undefined') return\n\n  // Skip in production — bundlers (Vite, Next.js, webpack) define import.meta.env or process.env\n  try {\n    // @ts-expect-error -- import.meta.env is Vite-specific, not in base TS lib\n    if (import.meta.env?.PROD) return\n  } catch { /* not in Vite */ }\n\n  checked = true\n\n  // Wait for stylesheets to load\n  requestAnimationFrame(() => {\n    const value = getComputedStyle(document.documentElement).getPropertyValue('--color-accent-9').trim()\n    if (!value) {\n      console.warn(\n        '[shilp-sutra] Design system tokens CSS not loaded. ' +\n        'Add `import \\'@devalok/shilp-sutra/tokens\\'` to your root layout. ' +\n        'Without it, components will render with missing colors, spacing, and typography.'\n      )\n    }\n  })\n}\n","/**\n * @module @devalok/shilp-sutra/ui\n *\n * Core UI primitives: buttons, inputs, dialogs, cards, tables, badges, navigation, and more.\n * Most components require client-side React (\"use client\").\n *\n * **Server-safe components** (import individually for Server Components):\n * `Text`, `Skeleton`, `Stack`, `Container`, `Table`, `Code`, `VisuallyHidden`\n *\n * @example\n * // Server Component — import individually:\n * import { Text } from '@devalok/shilp-sutra/ui/text'\n * import { Stack } from '@devalok/shilp-sutra/ui/stack'\n *\n * // Client Component — barrel import:\n * import { Button, Dialog } from '@devalok/shilp-sutra/ui'\n */\n\n// Dev-mode token presence check — runs once on first import\nimport { checkTokensLoaded } from './lib/check-tokens'\ncheckTokensLoaded()\n\n// Core\nexport { Button, type ButtonProps,buttonVariants } from './button'\nexport { ButtonGroup, type ButtonGroupProps,useButtonGroup } from './button-group'\nexport { ColorInput, type ColorInputProps } from './color-input'\nexport { Icon, type IconProps } from './icon'\nexport { IconButton, type IconButtonProps } from './icon-button'\nexport { IconContext, type IconContextValue, IconProvider, type IconSize, type IconStroke,useIconContext } from './icon-context'\nexport { IconGroup, type IconGroupProps } from './icon-group'\nexport { Input, type InputProps, type InputState, inputWrapperVariants } from './input'\nexport { Label, type LabelProps } from './label'\nexport { Separator, type SeparatorProps } from './separator'\nexport { SplitButton, type SplitButtonProps } from './split-button'\nexport { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden'\n\n// Autocomplete\nexport { Autocomplete, type AutocompleteOption,type AutocompleteProps } from './autocomplete'\n\n// Combobox\nexport { Combobox, type ComboboxOption, type ComboboxProps, type ComboboxSize,comboboxTriggerVariants } from './combobox'\n\n// FileUpload\nexport { FileUpload, type FileUploadProps } from './file-upload'\n\n// Form Controls\nexport { Checkbox, type CheckboxProps } from './checkbox'\nexport { FormField, type FormFieldProps, type FormHelperState, FormHelperText, type FormHelperTextProps,useFormField } from './form'\nexport { InputOTP, InputOTPGroup, type InputOTPProps,InputOTPSeparator, InputOTPSlot } from './input-otp'\nexport { NumberInput, type NumberInputProps, type NumberInputSize, type NumberInputState,numberInputWrapperVariants } from './number-input'\nexport { RadioGroup, RadioGroupItem, type RadioGroupItemProps,type RadioGroupProps } from './radio'\nexport { SearchInput, type SearchInputProps } from './search-input'\nexport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectScrollDownButton,\n  SelectScrollUpButton,\n  SelectSeparator,\n  SelectTrigger,\n  type SelectTriggerProps,\n  selectTriggerVariants,\n  SelectValue,\n} from './select'\nexport { Slider, type SliderColor,type SliderProps, type SliderSize, sliderThumbVariants, sliderTrackVariants } from './slider'\nexport { Switch, type SwitchProps } from './switch'\nexport { Textarea, type TextareaProps,textareaVariants } from './textarea'\nexport { Toggle, type ToggleProps,toggleVariants } from './toggle'\nexport { ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps,type ToggleGroupProps } from './toggle-group'\n\n// Feedback & Overlays\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  type AlertDialogActionProps,\n  AlertDialogCancel,\n  type AlertDialogCancelProps,\n  AlertDialogContent,\n  type AlertDialogContentProps,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n} from './alert-dialog'\nexport { Collapsible, CollapsibleContent, type CollapsibleProps,CollapsibleTrigger } from './collapsible'\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  type DialogContentProps,\n  DialogContentRaw,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  type DialogTitleProps,\n  DialogTrigger,\n} from './dialog'\nexport { HoverCard, HoverCardContent, type HoverCardContentProps,HoverCardTrigger } from './hover-card'\nexport { Popover, PopoverAnchor, PopoverContent, type PopoverContentProps,PopoverTrigger } from './popover'\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  type SheetContentProps,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n} from './sheet'\nexport {\n  formatFileSize,\n  toast,\n  type ToastActionOptions,\n  type ToastOptions,\n  type ToastProps,\n  type ToastType,\n  type ToastUndoOptions,\n  type ToastUploadOptions,\n  type UploadFile,\n} from './toast'\nexport { Toaster, type ToasterProps } from './toaster'\nexport { Tooltip, TooltipContent, type TooltipContentProps,TooltipProvider, TooltipTrigger } from './tooltip'\n// ---------------------------------------------------------------------------\n// Notifications — pick the right one:\n//   Alert   — inline, static feedback within a form or page section (no user action needed to show)\n//   Banner  — persistent, page-level notice shown above main content (survives navigation)\n//   Toast   — imperative, transient, action-triggered (fires on user action, auto-dismisses)\n//             Requires <Toaster /> mounted once at layout root. Use toast.success() etc. from anywhere.\n// ---------------------------------------------------------------------------\nexport { Alert, type AlertProps,alertVariants } from './alert'\nexport { Banner, type BannerProps,bannerVariants } from './banner'\nexport { Spinner, type SpinnerProps } from './spinner'\n\n// Data Display\nexport { AspectRatio } from './aspect-ratio'\nexport { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarProps, type AvatarRing,type AvatarStatus, avatarVariants } from './avatar'\nexport { Badge, type BadgeProps,badgeVariants } from './badge'\nexport { BadgeGroup, type BadgeGroupProps } from './badge-group'\nexport { BadgeIndicator, type BadgeIndicatorProps } from './badge-indicator'\nexport { Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps,CardTitle, cardVariants } from './card'\nexport { Code, type CodeProps } from './code'\nexport { ColorSwatch, type ColorSwatchProps } from './color-swatch'\nexport { Progress, progressIndicatorVariants, type ProgressProps,progressTrackVariants } from './progress'\nexport { MultiProgressRing, type MultiProgressRingProps,ProgressRing, type ProgressRingProps } from './progress-ring'\nexport {\n  Skeleton,\n  SkeletonAvatar,\n  type SkeletonAvatarProps,\n  SkeletonButton,\n  type SkeletonButtonProps,\n  SkeletonChart,\n  type SkeletonChartProps,\n  SkeletonGroup,\n  type SkeletonGroupProps,\n  SkeletonImage,\n  type SkeletonImageProps,\n  SkeletonInput,\n  type SkeletonInputProps,\n  type SkeletonProps,\n  SkeletonText,\n  type SkeletonTextProps,\n  skeletonVariants,\n} from './skeleton'\nexport { StatCard, type StatCardProps } from './stat-card'\nexport { StatusDot, type StatusDotProps, type StatusDotStatus } from './status-dot'\nexport { Table, TableBody, TableCaption, TableCell, type TableCellProps,TableFooter, TableHead, TableHeader, type TableProps, TableRow, type TableRowProps } from './table'\n\n// Navigation\nexport { Accordion, AccordionContent, type AccordionContentProps,AccordionItem, type AccordionItemProps, AccordionTrigger, type AccordionTriggerProps } from './accordion'\nexport {\n  Breadcrumb,\n  BreadcrumbEllipsis,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  type BreadcrumbLinkProps,\n  BreadcrumbList,\n  BreadcrumbPage,\n  type BreadcrumbProps,\n  BreadcrumbSeparator,\n} from './breadcrumb'\nexport {\n  ContextMenu,\n  ContextMenuCheckboxItem,\n  ContextMenuContent,\n  type ContextMenuContentProps,\n  ContextMenuGroup,\n  ContextMenuItem,\n  type ContextMenuItemProps,\n  ContextMenuLabel,\n  ContextMenuPortal,\n  ContextMenuRadioGroup,\n  ContextMenuRadioItem,\n  ContextMenuSeparator,\n  ContextMenuShortcut,\n  ContextMenuSub,\n  ContextMenuSubContent,\n  ContextMenuSubTrigger,\n  ContextMenuTrigger,\n} from './context-menu'\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  type DropdownMenuContentProps,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  type DropdownMenuItemProps,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from './dropdown-menu'\nexport {\n  Menubar,\n  MenubarCheckboxItem,\n  MenubarContent,\n  type MenubarContentProps,\n  MenubarGroup,\n  MenubarItem,\n  type MenubarItemProps,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarPortal,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarShortcut,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n} from './menubar'\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  type NavigationMenuContentProps,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  type NavigationMenuProps,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n} from './navigation-menu'\nexport {\n  generatePagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  type PaginationLinkProps,\n  PaginationNav,\n  type PaginationNavProps,\n  PaginationNext,\n  PaginationPrevious,\n  PaginationRoot,\n} from './pagination'\nexport {\n  Sidebar,\n  SidebarContent,\n  SidebarFooter,\n  SidebarGroup,\n  SidebarGroupAction,\n  SidebarGroupContent,\n  SidebarGroupLabel,\n  SidebarHeader,\n  SidebarInput,\n  SidebarInset,\n  SidebarMenu,\n  SidebarMenuAction,\n  SidebarMenuBadge,\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSkeleton,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n  type SidebarProps,\n  SidebarProvider,\n  SidebarRail,\n  SidebarSeparator,\n  SidebarTrigger,\n  useSidebar,\n} from './sidebar'\nexport { Tabs, type TabsColor, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsOrientation,type TabsProps, type TabsSize, TabsTrigger, type TabsTriggerProps } from './tabs'\n\n// Workflow\nexport { Step, Stepper, type StepperProps, type StepProps } from './stepper'\n\n\n// Typography\nexport { Text, type TextProps, type TextVariant,textVariants } from './text'\n\n// Layout\nexport { Container, type ContainerProps } from './container'\nexport { type SpacingToken,Stack, type StackProps } from './stack'\n\n// Tree View\nexport { TreeItem, type TreeItemProps, type TreeNode,TreeView, type TreeViewProps, useTree } from './tree-view'\n\n// Segmented Control\nexport {\n  SegmentedControl,\n  type SegmentedControlOption,\n  type SegmentedControlProps,\n  type SegmentedControlSize,\n  type SegmentedControlVariant,\n} from './segmented-control'\n\n// Brand Texture\nexport { DevalokGrain, type DevalokGrainProps, type GrainIntensity } from './devalok-grain'\n\n// Chat primitives\nexport {\n  DateSeparator,\n  type DateSeparatorProps,\n  Message,\n  type MessageActionProps,\n  type MessageActionsProps,\n  type MessageAuthorProps,\n  type MessageAvatarProps,\n  type MessageBodyProps,\n  type MessageContentProps,\n  type MessageContextValue,\n  type MessageEditableBodyProps,\n  MessageInput,\n  type MessageInputProps,\n  MessageList,\n  type MessageListProps,\n  type MessageProps,\n  type MessageReactionsProps,\n  SystemMessage,\n  type SystemMessageProps,\n  TypingIndicator,\n  type TypingIndicatorProps,\n  UnreadSeparator,\n  type UnreadSeparatorProps,\n  useMessageContext,\n} from './chat'\n\n// Other\nexport { Link, type LinkProps } from './link'\n\n// Utilities\nexport { formatRelativeTime } from './lib/date-utils'\nexport type { SpringPreset, TweenPreset } from './lib/motion'\nexport { springs, stagger, tweens, withReducedMotion } from './lib/motion'\nexport { cn } from './lib/utils'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAI,IAAU;AAEd,SAAgB,KAA0B;AACpC,WACA,SAAO,SAAW,MAGtB;MAAI;AAEyB;UACrB;AAKR,EAHA,IAAU,IAGV,4BAA4B;AAE1B,GADc,iBAAiB,SAAS,gBAAgB,CAAC,iBAAiB,mBAAmB,CAAC,MAAM,IAElG,QAAQ,KACN,sMAGD;IAEH;;;;;ACdJ,IAAmB"}

package/dist/ui/input-otp.js

@@ -37,7 +37,7 @@ var p = r.forwardRef(({ index: t, className: n, ...o }, s) => {
 	let d = r.useContext(c), f = r.useContext(l), { char: p, hasFakeCaret: m, isActive: h } = d.slots[t];
 	return /* @__PURE__ */ a("div", {
 		ref: s,
-		className: e("relative flex items-center justify-center border-y border-r border-surface-border-strong shadow-raised transition-[box-shadow,border-color] first:rounded-l-ds-md first:border-l last:rounded-r-ds-md", u[f], "group-[.is-error]/otp:border-error-7", h && "z-raised ring-2 ring-accent-9", n),
+		className: e("relative flex items-center justify-center border-y border-r border-surface-border-strong shadow-raised transition-[box-shadow,border-color] first:rounded-l-control first:border-l last:rounded-r-control", u[f], "group-[.is-error]/otp:border-error-7", h && "z-raised ring-2 ring-accent-9", n),
 		...o,
 		children: [p, m && /* @__PURE__ */ i("div", {
 			className: "pointer-events-none absolute inset-0 flex items-center justify-center",

package/dist/ui/input-otp.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-otp.js","names":[],"sources":["../../src/ui/input-otp.tsx"],"sourcesContent":["'use client'\n\nimport { IconMinus } from '@tabler/icons-react'\nimport { OTPInput, OTPInputContext } from 'input-otp'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { Icon } from './icon'\nimport { cn } from './lib/utils'\n\n// ── Size context ────────────────────────────────────────────────────\n\ntype InputOTPSize = 'sm' | 'md' | 'lg'\n\nconst InputOTPSizeContext = React.createContext<InputOTPSize>('md')\n\nconst slotSizeClasses: Record<InputOTPSize, string> = {\n  sm: 'h-ds-sm w-ds-sm text-ds-sm',\n  md: 'h-ds-sm-plus w-ds-sm-plus text-ds-md',\n  lg: 'h-ds-md w-ds-md text-ds-lg',\n}\n\n// ── InputOTP ────────────────────────────────────────────────────────\n\nconst InputOTP = React.forwardRef<\n  React.ElementRef<typeof OTPInput>,\n  React.ComponentPropsWithoutRef<typeof OTPInput> & {\n    state?: 'default' | 'error'\n    /** Slot size. @default 'md' */\n    size?: InputOTPSize\n  }\n>(({ className, containerClassName, state, size: sizeProp, ...props }, ref) => {\n  const formField = useFormField()\n  const isError = state === 'error' || formField?.state === 'error'\n  const size: InputOTPSize = (typeof sizeProp === 'string' ? sizeProp : undefined) ?? 'md'\n\n  return (\n    <InputOTPSizeContext.Provider value={size}>\n      <OTPInput\n        ref={ref}\n        aria-invalid={isError || undefined}\n        aria-describedby={formField?.helperTextId}\n        aria-required={formField?.required || undefined}\n        containerClassName={cn(\n          'group/otp flex items-center gap-ds-03 has-[:disabled]:opacity-action-disabled',\n          isError && 'is-error',\n          containerClassName,\n        )}\n        className={cn('disabled:cursor-not-allowed', className)}\n        {...props}\n      />\n    </InputOTPSizeContext.Provider>\n  )\n})\nInputOTP.displayName = 'InputOTP'\n\nconst InputOTPGroup = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex items-center', className)} {...props} />\n))\nInputOTPGroup.displayName = 'InputOTPGroup'\n\nconst InputOTPSlot = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'> & { index: number }\n>(({ index, className, ...props }, ref) => {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const size = React.useContext(InputOTPSizeContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index]\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'relative flex items-center justify-center border-y border-r border-surface-border-strong shadow-raised transition-[box-shadow,border-color] first:rounded-l-ds-md first:border-l last:rounded-r-ds-md',\n        slotSizeClasses[size],\n        'group-[.is-error]/otp:border-error-7',\n        isActive && 'z-raised ring-2 ring-accent-9',\n        className,\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"animate-caret-blink h-[16px] w-px bg-surface-fg duration-slow-02\" />\n        </div>\n      )}\n    </div>\n  )\n})\nInputOTPSlot.displayName = 'InputOTPSlot'\n\nconst InputOTPSeparator = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'>\n>(({ ...props }, ref) => (\n  <div ref={ref} role=\"separator\" {...props}>\n    <Icon icon={IconMinus} size=\"sm\" />\n  </div>\n))\nInputOTPSeparator.displayName = 'InputOTPSeparator'\n\nexport type InputOTPProps = React.ComponentPropsWithoutRef<typeof OTPInput> & {\n  state?: 'default' | 'error'\n  /** Slot size. @default 'md' */\n  size?: InputOTPSize\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSeparator,InputOTPSlot }\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAsB,EAAM,cAA4B,KAAK,EAE7D,IAAgD;CACpD,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAIK,IAAW,EAAM,YAOpB,EAAE,cAAW,uBAAoB,UAAO,MAAM,GAAU,GAAG,KAAS,MAAQ;CAC7E,IAAM,IAAY,GAAc,EAC1B,IAAU,MAAU,WAAW,GAAW,UAAU,SACpD,KAAsB,OAAO,KAAa,WAAW,IAAW,KAAA,MAAc;AAEpF,QACE,kBAAC,EAAoB,UAArB;EAA8B,OAAO;YACnC,kBAAC,GAAD;GACO;GACL,gBAAc,KAAW,KAAA;GACzB,oBAAkB,GAAW;GAC7B,iBAAe,GAAW,YAAY,KAAA;GACtC,oBAAoB,EAClB,iFACA,KAAW,YACX,EACD;GACD,WAAW,EAAG,+BAA+B,EAAU;GACvD,GAAI;GACJ,CAAA;EAC2B,CAAA;EAEjC;AACF,EAAS,cAAc;AAEvB,IAAM,IAAgB,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CAAU;CAAK,WAAW,EAAG,qBAAqB,EAAU;CAAE,GAAI;CAAS,CAAA,CAC3E;AACF,EAAc,cAAc;AAE5B,IAAM,IAAe,EAAM,YAGxB,EAAE,UAAO,cAAW,GAAG,KAAS,MAAQ;CACzC,IAAM,IAAkB,EAAM,WAAW,EAAgB,EACnD,IAAO,EAAM,WAAW,EAAoB,EAC5C,EAAE,SAAM,iBAAc,gBAAa,EAAgB,MAAM;AAE/D,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,yMACA,EAAgB,IAChB,wCACA,KAAY,iCACZ,EACD;EACD,GAAI;YATN,CAWG,GACA,KACC,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD,EAAK,WAAU,oEAAqE,CAAA;GAChF,CAAA,CAEJ;;EAER;AACF,EAAa,cAAc;AAE3B,IAAM,IAAoB,EAAM,YAG7B,EAAE,GAAG,KAAS,MACf,kBAAC,OAAD;CAAU;CAAK,MAAK;CAAY,GAAI;WAClC,kBAAC,GAAD;EAAM,MAAM;EAAW,MAAK;EAAO,CAAA;CAC/B,CAAA,CACN;AACF,EAAkB,cAAc"}
+{"version":3,"file":"input-otp.js","names":[],"sources":["../../src/ui/input-otp.tsx"],"sourcesContent":["'use client'\n\nimport { IconMinus } from '@tabler/icons-react'\nimport { OTPInput, OTPInputContext } from 'input-otp'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { Icon } from './icon'\nimport { cn } from './lib/utils'\n\n// ── Size context ────────────────────────────────────────────────────\n\ntype InputOTPSize = 'sm' | 'md' | 'lg'\n\nconst InputOTPSizeContext = React.createContext<InputOTPSize>('md')\n\nconst slotSizeClasses: Record<InputOTPSize, string> = {\n  sm: 'h-ds-sm w-ds-sm text-ds-sm',\n  md: 'h-ds-sm-plus w-ds-sm-plus text-ds-md',\n  lg: 'h-ds-md w-ds-md text-ds-lg',\n}\n\n// ── InputOTP ────────────────────────────────────────────────────────\n\nconst InputOTP = React.forwardRef<\n  React.ElementRef<typeof OTPInput>,\n  React.ComponentPropsWithoutRef<typeof OTPInput> & {\n    state?: 'default' | 'error'\n    /** Slot size. @default 'md' */\n    size?: InputOTPSize\n  }\n>(({ className, containerClassName, state, size: sizeProp, ...props }, ref) => {\n  const formField = useFormField()\n  const isError = state === 'error' || formField?.state === 'error'\n  const size: InputOTPSize = (typeof sizeProp === 'string' ? sizeProp : undefined) ?? 'md'\n\n  return (\n    <InputOTPSizeContext.Provider value={size}>\n      <OTPInput\n        ref={ref}\n        aria-invalid={isError || undefined}\n        aria-describedby={formField?.helperTextId}\n        aria-required={formField?.required || undefined}\n        containerClassName={cn(\n          'group/otp flex items-center gap-ds-03 has-[:disabled]:opacity-action-disabled',\n          isError && 'is-error',\n          containerClassName,\n        )}\n        className={cn('disabled:cursor-not-allowed', className)}\n        {...props}\n      />\n    </InputOTPSizeContext.Provider>\n  )\n})\nInputOTP.displayName = 'InputOTP'\n\nconst InputOTPGroup = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex items-center', className)} {...props} />\n))\nInputOTPGroup.displayName = 'InputOTPGroup'\n\nconst InputOTPSlot = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'> & { index: number }\n>(({ index, className, ...props }, ref) => {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const size = React.useContext(InputOTPSizeContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index]\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'relative flex items-center justify-center border-y border-r border-surface-border-strong shadow-raised transition-[box-shadow,border-color] first:rounded-l-control first:border-l last:rounded-r-control',\n        slotSizeClasses[size],\n        'group-[.is-error]/otp:border-error-7',\n        isActive && 'z-raised ring-2 ring-accent-9',\n        className,\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"animate-caret-blink h-[16px] w-px bg-surface-fg duration-slow-02\" />\n        </div>\n      )}\n    </div>\n  )\n})\nInputOTPSlot.displayName = 'InputOTPSlot'\n\nconst InputOTPSeparator = React.forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'>\n>(({ ...props }, ref) => (\n  <div ref={ref} role=\"separator\" {...props}>\n    <Icon icon={IconMinus} size=\"sm\" />\n  </div>\n))\nInputOTPSeparator.displayName = 'InputOTPSeparator'\n\nexport type InputOTPProps = React.ComponentPropsWithoutRef<typeof OTPInput> & {\n  state?: 'default' | 'error'\n  /** Slot size. @default 'md' */\n  size?: InputOTPSize\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSeparator,InputOTPSlot }\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAsB,EAAM,cAA4B,KAAK,EAE7D,IAAgD;CACpD,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAIK,IAAW,EAAM,YAOpB,EAAE,cAAW,uBAAoB,UAAO,MAAM,GAAU,GAAG,KAAS,MAAQ;CAC7E,IAAM,IAAY,GAAc,EAC1B,IAAU,MAAU,WAAW,GAAW,UAAU,SACpD,KAAsB,OAAO,KAAa,WAAW,IAAW,KAAA,MAAc;AAEpF,QACE,kBAAC,EAAoB,UAArB;EAA8B,OAAO;YACnC,kBAAC,GAAD;GACO;GACL,gBAAc,KAAW,KAAA;GACzB,oBAAkB,GAAW;GAC7B,iBAAe,GAAW,YAAY,KAAA;GACtC,oBAAoB,EAClB,iFACA,KAAW,YACX,EACD;GACD,WAAW,EAAG,+BAA+B,EAAU;GACvD,GAAI;GACJ,CAAA;EAC2B,CAAA;EAEjC;AACF,EAAS,cAAc;AAEvB,IAAM,IAAgB,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CAAU;CAAK,WAAW,EAAG,qBAAqB,EAAU;CAAE,GAAI;CAAS,CAAA,CAC3E;AACF,EAAc,cAAc;AAE5B,IAAM,IAAe,EAAM,YAGxB,EAAE,UAAO,cAAW,GAAG,KAAS,MAAQ;CACzC,IAAM,IAAkB,EAAM,WAAW,EAAgB,EACnD,IAAO,EAAM,WAAW,EAAoB,EAC5C,EAAE,SAAM,iBAAc,gBAAa,EAAgB,MAAM;AAE/D,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,6MACA,EAAgB,IAChB,wCACA,KAAY,iCACZ,EACD;EACD,GAAI;YATN,CAWG,GACA,KACC,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD,EAAK,WAAU,oEAAqE,CAAA;GAChF,CAAA,CAEJ;;EAER;AACF,EAAa,cAAc;AAE3B,IAAM,IAAoB,EAAM,YAG7B,EAAE,GAAG,KAAS,MACf,kBAAC,OAAD;CAAU;CAAK,MAAK;CAAY,GAAI;WAClC,kBAAC,GAAD;EAAM,MAAM;EAAW,MAAK;EAAO,CAAA;CAC/B,CAAA,CACN;AACF,EAAkB,cAAc"}

package/dist/ui/input.d.ts

@@ -52,15 +52,7 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     endSectionType?: 'icon' | 'label';
     /** Classes for the wrapper div (border, bg, ring). */
     wrapperClassName?: string;
-    /** @deprecated Use startSection */
-    startIcon?: React.ReactNode;
-    /** @deprecated Use endSection */
-    endIcon?: React.ReactNode;
 }
 declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
-/** @deprecated Use inputWrapperVariants — semantics changed (now targets wrapper, not input) */
-declare const inputVariants: (props?: ({
-    size?: "xs" | "sm" | "md" | "lg" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export { Input, inputVariants, inputWrapperVariants };
+export { Input, inputWrapperVariants };
 //# sourceMappingURL=input.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/ui/input.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAA;AAEpE,QAAA,MAAM,oBAAoB;;8EAsBzB,CAAA;AAgBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,EAC/D,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;qFACiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACnC;qFACiF;IACjF,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACjC,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,mCAAmC;IACnC,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,iCAAiC;IACjC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,QAAA,MAAM,KAAK,qFA+JV,CAAA;AAGD,gGAAgG;AAChG,QAAA,MAAM,aAAa;;8EAAuB,CAAA;AAE1C,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,oBAAoB,EAAE,CAAA"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/ui/input.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAA;AAEpE,QAAA,MAAM,oBAAoB;;8EAsBzB,CAAA;AAgBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,EAC/D,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B;qFACiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACnC;qFACiF;IACjF,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACjC,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,QAAA,MAAM,KAAK,qFAyJV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,oBAAoB,EAAE,CAAA"}

package/dist/ui/input.js

@@ -9,7 +9,7 @@ import { jsx as a, jsxs as o } from "react/jsx-runtime";
 var s = t([
 	"relative flex items-center w-full font-sans",
 	"bg-surface-raised-hover text-surface-fg",
-	"border border-surface-border-strong rounded-ds-md",
+	"border border-surface-border-strong rounded-control",
 	"hover:bg-surface-raised-active",
 	"transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard",
 	"focus-within:outline-hidden focus-within:ring-2 focus-within:ring-accent-9 focus-within:ring-offset-2 focus-within:border-surface-border",
@@ -20,7 +20,7 @@ var s = t([
 		xs: "h-ds-xs-plus text-ds-sm",
 		sm: "h-ds-sm text-ds-sm",
 		md: "h-ds-md text-ds-md",
-		lg: "h-ds-lg rounded-ds-lg text-ds-md"
+		lg: "h-ds-lg text-ds-md"
 	} },
 	defaultVariants: { size: "md" }
 }), c = {
@@ -33,30 +33,30 @@ var s = t([
 	sm: "sm",
 	md: "md",
 	lg: "lg"
-}, u = i.forwardRef(({ className: t, type: i, state: u, size: d = "md", startSection: f, endSection: p, startSectionClickable: m, endSectionClickable: h, startSectionType: g, endSectionType: _, startIcon: v, endIcon: y, wrapperClassName: b, ...x }, S) => {
-	let C = d ?? "md", w = r(), T = u ?? (w.state === "helper" ? void 0 : w.state), E = x["aria-describedby"] ?? w.helperTextId, D = x["aria-required"] ?? w.required, O = x.id ?? w.inputId, k = f ?? v, A = p ?? y, j = !!k, M = !!A, N = g ?? (typeof k == "string" ? "label" : "icon"), P = _ ?? (typeof A == "string" ? "label" : "icon"), F = {
+}, u = i.forwardRef(({ className: t, type: i, state: u, size: d = "md", startSection: f, endSection: p, startSectionClickable: m, endSectionClickable: h, startSectionType: g, endSectionType: _, wrapperClassName: v, ...y }, b) => {
+	let x = d ?? "md", S = r(), C = u ?? (S.state === "helper" ? void 0 : S.state), w = y["aria-describedby"] ?? S.helperTextId, T = y["aria-required"] ?? S.required, E = y.id ?? S.inputId, D = !!f, O = !!p, k = g ?? (typeof f == "string" ? "label" : "icon"), A = _ ?? (typeof p == "string" ? "label" : "icon"), j = {
 		xs: "px-ds-02",
 		sm: "px-ds-02",
 		md: "px-ds-03",
 		lg: "px-ds-03"
-	}, I = {
+	}, M = {
 		xs: "text-ds-sm",
 		sm: "text-ds-sm",
 		md: "text-ds-sm",
 		lg: "text-ds-md"
 	};
 	return /* @__PURE__ */ o("div", {
-		className: n(s({ size: C }), T === "error" && "border-error-7 focus-within:ring-error-7", T === "warning" && "border-warning-7 focus-within:ring-warning-7", T === "success" && "border-success-7 focus-within:ring-success-7", b),
+		className: n(s({ size: x }), C === "error" && "border-error-7 focus-within:ring-error-7", C === "warning" && "border-warning-7 focus-within:ring-warning-7", C === "success" && "border-success-7 focus-within:ring-success-7", v),
 		children: [
-			j && N === "label" && /* @__PURE__ */ a("span", {
-				className: n("flex items-center shrink-0 select-none self-stretch", "border-r border-surface-border", "bg-surface-raised text-surface-fg-muted", "rounded-l-[inherit]", F[C], I[C], !m && "pointer-events-none"),
-				children: k
+			D && k === "label" && /* @__PURE__ */ a("span", {
+				className: n("flex items-center shrink-0 select-none self-stretch", "border-r border-surface-border", "bg-surface-raised text-surface-fg-muted", "rounded-l-[inherit]", j[x], M[x], !m && "pointer-events-none"),
+				children: f
 			}),
-			j && N === "icon" && /* @__PURE__ */ a(e, {
-				size: l[C],
+			D && k === "icon" && /* @__PURE__ */ a(e, {
+				size: l[x],
 				children: /* @__PURE__ */ a("span", {
-					className: n("flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted", c[C], !m && "pointer-events-none"),
-					children: k
+					className: n("flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted", c[x], !m && "pointer-events-none"),
+					children: f
 				})
 			}),
 			/* @__PURE__ */ a("input", {
@@ -66,29 +66,28 @@ var s = t([
 					sm: "px-ds-03",
 					md: "px-ds-03",
 					lg: "px-ds-04"
-				}[C], j && N === "icon" && "pl-0", M && P === "icon" && "pr-0", t),
-				"aria-invalid": T === "error" || void 0,
-				"aria-describedby": E,
-				"aria-required": D || void 0,
-				ref: S,
-				...x,
-				id: O
+				}[x], D && k === "icon" && "pl-0", O && A === "icon" && "pr-0", t),
+				"aria-invalid": C === "error" || void 0,
+				"aria-describedby": w,
+				"aria-required": T || void 0,
+				ref: b,
+				...y,
+				id: E
 			}),
-			M && P === "label" && /* @__PURE__ */ a("span", {
-				className: n("flex items-center shrink-0 select-none self-stretch", "border-l border-surface-border", "bg-surface-raised text-surface-fg-muted", "rounded-r-[inherit]", F[C], I[C], !h && "pointer-events-none"),
-				children: A
+			O && A === "label" && /* @__PURE__ */ a("span", {
+				className: n("flex items-center shrink-0 select-none self-stretch", "border-l border-surface-border", "bg-surface-raised text-surface-fg-muted", "rounded-r-[inherit]", j[x], M[x], !h && "pointer-events-none"),
+				children: p
 			}),
-			M && P === "icon" && /* @__PURE__ */ a(e, {
-				size: l[C],
+			O && A === "icon" && /* @__PURE__ */ a(e, {
+				size: l[x],
 				children: /* @__PURE__ */ a("span", {
-					className: n("flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted", c[C], !h && "pointer-events-none"),
-					children: A
+					className: n("flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted", c[x], !h && "pointer-events-none"),
+					children: p
 				})
 			})
 		]
 	});
 });
 u.displayName = "Input";
-var d = s;
 //#endregion
-export { u as Input, d as inputVariants, s as inputWrapperVariants };
+export { u as Input, s as inputWrapperVariants };

package/dist/ui/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","names":[],"sources":["../../src/ui/input.tsx"],"sourcesContent":["'use client'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { IconProvider, type IconSize } from './icon-context'\nimport { cn } from './lib/utils'\n\nexport type InputState = 'default' | 'error' | 'warning' | 'success'\n\nconst inputWrapperVariants = cva(\n  [\n    'relative flex items-center w-full font-sans',\n    'bg-surface-raised-hover text-surface-fg',\n    'border border-surface-border-strong rounded-ds-md',\n    'hover:bg-surface-raised-active',\n    'transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard',\n    'focus-within:outline-hidden focus-within:ring-2 focus-within:ring-accent-9 focus-within:ring-offset-2 focus-within:border-surface-border',\n    'has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-action-disabled',\n    'has-[:read-only]:bg-surface-raised has-[:read-only]:cursor-default',\n  ],\n  {\n    variants: {\n      size: {\n        xs: 'h-ds-xs-plus text-ds-sm',\n        sm: 'h-ds-sm text-ds-sm',\n        md: 'h-ds-md text-ds-md',\n        lg: 'h-ds-lg rounded-ds-lg text-ds-md',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nconst sectionWidthMap: Record<string, string> = {\n  xs: 'w-[26px]',\n  sm: 'w-[30px]',\n  md: 'w-[38px]',\n  lg: 'w-[46px]',\n}\n\nconst iconSizeMap: Record<string, IconSize> = {\n  xs: 'xs',\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n}\n\n/**\n * Props for Input — a single-line text field with container-first architecture,\n * section-based icons with automatic padding, per-size scaling, and validation state coloring.\n *\n * **Sizes:** `xs` (28px) | `sm` (32px) | `md` (40px, default) | `lg` (48px)\n * HTML's native `size` attribute is excluded — use CSS width instead.\n *\n * **Validation states:** `state=\"error\"` colors the border red and sets `aria-invalid`.\n * Use with `<FormField>` to show helper text below the input.\n *\n * **Section-based icons:** `startSection` and `endSection` accept any React node.\n * Icons are auto-sized via `IconProvider`. Sections are `pointer-events-none` by default;\n * use `startSectionClickable`/`endSectionClickable` for interactive sections.\n *\n * **className** targets the `<input>` element (backward compatible).\n * **wrapperClassName** targets the wrapper div for border/bg/ring overrides.\n *\n * @example\n * // Basic email field with placeholder:\n * <Input type=\"email\" placeholder=\"you@example.com\" />\n *\n * @example\n * // Search input with a leading icon:\n * <Input size=\"md\" startSection={<IconSearch />} placeholder=\"Search projects...\" />\n *\n * @example\n * // Validated error state (pair with FormField for label + helper text):\n * <Input state=\"error\" value={email} onChange={handleChange} />\n *\n * @example\n * // Read-only field (shows a muted background, non-editable):\n * <Input readOnly value=\"https://devalok.com/api/key/abc123\" endSection={<IconCopy />} />\n */\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>,\n    VariantProps<typeof inputWrapperVariants> {\n  state?: InputState\n  startSection?: React.ReactNode\n  endSection?: React.ReactNode\n  startSectionClickable?: boolean\n  endSectionClickable?: boolean\n  /** Section display type. `'icon'` = fixed-width centered cell (default for ReactElements).\n   *  `'label'` = tinted background with border separator (default for strings). */\n  startSectionType?: 'icon' | 'label'\n  /** Section display type. `'icon'` = fixed-width centered cell (default for ReactElements).\n   *  `'label'` = tinted background with border separator (default for strings). */\n  endSectionType?: 'icon' | 'label'\n  /** Classes for the wrapper div (border, bg, ring). */\n  wrapperClassName?: string\n  /** @deprecated Use startSection */\n  startIcon?: React.ReactNode\n  /** @deprecated Use endSection */\n  endIcon?: React.ReactNode\n}\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      type,\n      state: stateProp,\n      size: sizeProp = 'md',\n      startSection,\n      endSection,\n      startSectionClickable,\n      endSectionClickable,\n      startSectionType: startSectionTypeProp,\n      endSectionType: endSectionTypeProp,\n      startIcon,\n      endIcon,\n      wrapperClassName,\n      ...props\n    },\n    ref,\n  ) => {\n    const size = sizeProp ?? 'md'\n    const fieldCtx = useFormField()\n    // Merge FormField context — explicit props always win\n    const state =\n      stateProp ??\n      (fieldCtx.state === 'helper'\n        ? undefined\n        : (fieldCtx.state as InputState | undefined))\n    const ariaDescribedBy = props['aria-describedby'] ?? fieldCtx.helperTextId\n    const ariaRequired = props['aria-required'] ?? fieldCtx.required\n    // Explicit id wins; otherwise adopt FormField's inputId so <Label htmlFor> resolves.\n    const inputId = props.id ?? fieldCtx.inputId\n\n    // Backward compat: map deprecated props\n    const resolvedStart = startSection ?? startIcon\n    const resolvedEnd = endSection ?? endIcon\n\n    const hasStart = !!resolvedStart\n    const hasEnd = !!resolvedEnd\n\n    // Infer section type: string → label, ReactElement → icon\n    const startType = startSectionTypeProp ?? (typeof resolvedStart === 'string' ? 'label' : 'icon')\n    const endType = endSectionTypeProp ?? (typeof resolvedEnd === 'string' ? 'label' : 'icon')\n\n    const labelPaddingMap: Record<string, string> = {\n      xs: 'px-ds-02',\n      sm: 'px-ds-02',\n      md: 'px-ds-03',\n      lg: 'px-ds-03',\n    }\n\n    const labelTextMap: Record<string, string> = {\n      xs: 'text-ds-sm',\n      sm: 'text-ds-sm',\n      md: 'text-ds-sm',\n      lg: 'text-ds-md',\n    }\n\n    const inputPadding: Record<string, string> = {\n      xs: 'px-ds-02',\n      sm: 'px-ds-03',\n      md: 'px-ds-03',\n      lg: 'px-ds-04',\n    }\n\n    return (\n      <div\n        className={cn(\n          inputWrapperVariants({ size }),\n          state === 'error' && 'border-error-7 focus-within:ring-error-7',\n          state === 'warning' && 'border-warning-7 focus-within:ring-warning-7',\n          state === 'success' && 'border-success-7 focus-within:ring-success-7',\n          wrapperClassName,\n        )}\n      >\n        {hasStart && startType === 'label' && (\n          <span\n            className={cn(\n              'flex items-center shrink-0 select-none self-stretch',\n              'border-r border-surface-border',\n              'bg-surface-raised text-surface-fg-muted',\n              'rounded-l-[inherit]',\n              labelPaddingMap[size],\n              labelTextMap[size],\n              !startSectionClickable && 'pointer-events-none',\n            )}\n          >\n            {resolvedStart}\n          </span>\n        )}\n\n        {hasStart && startType === 'icon' && (\n          <IconProvider size={iconSizeMap[size]}>\n            <span\n              className={cn(\n                'flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted',\n                sectionWidthMap[size],\n                !startSectionClickable && 'pointer-events-none',\n              )}\n            >\n              {resolvedStart}\n            </span>\n          </IconProvider>\n        )}\n\n        <input\n          type={type}\n          className={cn(\n            'flex-1 min-w-0 h-full bg-transparent outline-hidden font-sans',\n            'placeholder:text-surface-fg-subtle',\n            'disabled:cursor-not-allowed',\n            'read-only:cursor-default',\n            inputPadding[size],\n            // Remove left padding when start icon section is present (icon provides visual space)\n            hasStart && startType === 'icon' && 'pl-0',\n            // Remove right padding when end icon section is present\n            hasEnd && endType === 'icon' && 'pr-0',\n            className,\n          )}\n          aria-invalid={state === 'error' || undefined}\n          aria-describedby={ariaDescribedBy}\n          aria-required={ariaRequired || undefined}\n          ref={ref}\n          {...props}\n          id={inputId}\n        />\n\n        {hasEnd && endType === 'label' && (\n          <span\n            className={cn(\n              'flex items-center shrink-0 select-none self-stretch',\n              'border-l border-surface-border',\n              'bg-surface-raised text-surface-fg-muted',\n              'rounded-r-[inherit]',\n              labelPaddingMap[size],\n              labelTextMap[size],\n              !endSectionClickable && 'pointer-events-none',\n            )}\n          >\n            {resolvedEnd}\n          </span>\n        )}\n\n        {hasEnd && endType === 'icon' && (\n          <IconProvider size={iconSizeMap[size]}>\n            <span\n              className={cn(\n                'flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted',\n                sectionWidthMap[size],\n                !endSectionClickable && 'pointer-events-none',\n              )}\n            >\n              {resolvedEnd}\n            </span>\n          </IconProvider>\n        )}\n      </div>\n    )\n  },\n)\nInput.displayName = 'Input'\n\n/** @deprecated Use inputWrapperVariants — semantics changed (now targets wrapper, not input) */\nconst inputVariants = inputWrapperVariants\n\nexport { Input, inputVariants, inputWrapperVariants }\n"],"mappings":";;;;;;;;AAWA,IAAM,IAAuB,EAC3B;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACD;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAEK,IAA0C;CAC9C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAwC;CAC5C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAyDK,IAAQ,EAAM,YAEhB,EACE,cACA,SACA,OAAO,GACP,MAAM,IAAW,MACjB,iBACA,eACA,0BACA,wBACA,kBAAkB,GAClB,gBAAgB,GAChB,cACA,YACA,qBACA,GAAG,KAEL,MACG;CACH,IAAM,IAAO,KAAY,MACnB,IAAW,GAAc,EAEzB,IACJ,MACC,EAAS,UAAU,WAChB,KAAA,IACC,EAAS,QACV,IAAkB,EAAM,uBAAuB,EAAS,cACxD,IAAe,EAAM,oBAAoB,EAAS,UAElD,IAAU,EAAM,MAAM,EAAS,SAG/B,IAAgB,KAAgB,GAChC,IAAc,KAAc,GAE5B,IAAW,CAAC,CAAC,GACb,IAAS,CAAC,CAAC,GAGX,IAAY,MAAyB,OAAO,KAAkB,WAAW,UAAU,SACnF,IAAU,MAAuB,OAAO,KAAgB,WAAW,UAAU,SAE7E,IAA0C;EAC9C,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EAEK,IAAuC;EAC3C,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;AASD,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAAqB,EAAE,SAAM,CAAC,EAC9B,MAAU,WAAW,4CACrB,MAAU,aAAa,gDACvB,MAAU,aAAa,gDACvB,EACD;YAPH;GASG,KAAY,MAAc,WACzB,kBAAC,QAAD;IACE,WAAW,EACT,uDACA,kCACA,2CACA,uBACA,EAAgB,IAChB,EAAa,IACb,CAAC,KAAyB,sBAC3B;cAEA;IACI,CAAA;GAGR,KAAY,MAAc,UACzB,kBAAC,GAAD;IAAc,MAAM,EAAY;cAC9B,kBAAC,QAAD;KACE,WAAW,EACT,gFACA,EAAgB,IAChB,CAAC,KAAyB,sBAC3B;eAEA;KACI,CAAA;IACM,CAAA;GAGjB,kBAAC,SAAD;IACQ;IACN,WAAW,EACT,iEACA,sCACA,+BACA,4BArDqC;KAC3C,IAAI;KACJ,IAAI;KACJ,IAAI;KACJ,IAAI;KACL,CAiDoB,IAEb,KAAY,MAAc,UAAU,QAEpC,KAAU,MAAY,UAAU,QAChC,EACD;IACD,gBAAc,MAAU,WAAW,KAAA;IACnC,oBAAkB;IAClB,iBAAe,KAAgB,KAAA;IAC1B;IACL,GAAI;IACJ,IAAI;IACJ,CAAA;GAED,KAAU,MAAY,WACrB,kBAAC,QAAD;IACE,WAAW,EACT,uDACA,kCACA,2CACA,uBACA,EAAgB,IAChB,EAAa,IACb,CAAC,KAAuB,sBACzB;cAEA;IACI,CAAA;GAGR,KAAU,MAAY,UACrB,kBAAC,GAAD;IAAc,MAAM,EAAY;cAC9B,kBAAC,QAAD;KACE,WAAW,EACT,gFACA,EAAgB,IAChB,CAAC,KAAuB,sBACzB;eAEA;KACI,CAAA;IACM,CAAA;GAEb;;EAGX;AACD,EAAM,cAAc;AAGpB,IAAM,IAAgB"}
+{"version":3,"file":"input.js","names":[],"sources":["../../src/ui/input.tsx"],"sourcesContent":["'use client'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { IconProvider, type IconSize } from './icon-context'\nimport { cn } from './lib/utils'\n\nexport type InputState = 'default' | 'error' | 'warning' | 'success'\n\nconst inputWrapperVariants = cva(\n  [\n    'relative flex items-center w-full font-sans',\n    'bg-surface-raised-hover text-surface-fg',\n    'border border-surface-border-strong rounded-control',\n    'hover:bg-surface-raised-active',\n    'transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard',\n    'focus-within:outline-hidden focus-within:ring-2 focus-within:ring-accent-9 focus-within:ring-offset-2 focus-within:border-surface-border',\n    'has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-action-disabled',\n    'has-[:read-only]:bg-surface-raised has-[:read-only]:cursor-default',\n  ],\n  {\n    variants: {\n      size: {\n        xs: 'h-ds-xs-plus text-ds-sm',\n        sm: 'h-ds-sm text-ds-sm',\n        md: 'h-ds-md text-ds-md',\n        lg: 'h-ds-lg text-ds-md',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nconst sectionWidthMap: Record<string, string> = {\n  xs: 'w-[26px]',\n  sm: 'w-[30px]',\n  md: 'w-[38px]',\n  lg: 'w-[46px]',\n}\n\nconst iconSizeMap: Record<string, IconSize> = {\n  xs: 'xs',\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n}\n\n/**\n * Props for Input — a single-line text field with container-first architecture,\n * section-based icons with automatic padding, per-size scaling, and validation state coloring.\n *\n * **Sizes:** `xs` (28px) | `sm` (32px) | `md` (40px, default) | `lg` (48px)\n * HTML's native `size` attribute is excluded — use CSS width instead.\n *\n * **Validation states:** `state=\"error\"` colors the border red and sets `aria-invalid`.\n * Use with `<FormField>` to show helper text below the input.\n *\n * **Section-based icons:** `startSection` and `endSection` accept any React node.\n * Icons are auto-sized via `IconProvider`. Sections are `pointer-events-none` by default;\n * use `startSectionClickable`/`endSectionClickable` for interactive sections.\n *\n * **className** targets the `<input>` element (backward compatible).\n * **wrapperClassName** targets the wrapper div for border/bg/ring overrides.\n *\n * @example\n * // Basic email field with placeholder:\n * <Input type=\"email\" placeholder=\"you@example.com\" />\n *\n * @example\n * // Search input with a leading icon:\n * <Input size=\"md\" startSection={<IconSearch />} placeholder=\"Search projects...\" />\n *\n * @example\n * // Validated error state (pair with FormField for label + helper text):\n * <Input state=\"error\" value={email} onChange={handleChange} />\n *\n * @example\n * // Read-only field (shows a muted background, non-editable):\n * <Input readOnly value=\"https://devalok.com/api/key/abc123\" endSection={<IconCopy />} />\n */\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>,\n    VariantProps<typeof inputWrapperVariants> {\n  state?: InputState\n  startSection?: React.ReactNode\n  endSection?: React.ReactNode\n  startSectionClickable?: boolean\n  endSectionClickable?: boolean\n  /** Section display type. `'icon'` = fixed-width centered cell (default for ReactElements).\n   *  `'label'` = tinted background with border separator (default for strings). */\n  startSectionType?: 'icon' | 'label'\n  /** Section display type. `'icon'` = fixed-width centered cell (default for ReactElements).\n   *  `'label'` = tinted background with border separator (default for strings). */\n  endSectionType?: 'icon' | 'label'\n  /** Classes for the wrapper div (border, bg, ring). */\n  wrapperClassName?: string\n}\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      type,\n      state: stateProp,\n      size: sizeProp = 'md',\n      startSection,\n      endSection,\n      startSectionClickable,\n      endSectionClickable,\n      startSectionType: startSectionTypeProp,\n      endSectionType: endSectionTypeProp,\n      wrapperClassName,\n      ...props\n    },\n    ref,\n  ) => {\n    const size = sizeProp ?? 'md'\n    const fieldCtx = useFormField()\n    // Merge FormField context — explicit props always win\n    const state =\n      stateProp ??\n      (fieldCtx.state === 'helper'\n        ? undefined\n        : (fieldCtx.state as InputState | undefined))\n    const ariaDescribedBy = props['aria-describedby'] ?? fieldCtx.helperTextId\n    const ariaRequired = props['aria-required'] ?? fieldCtx.required\n    // Explicit id wins; otherwise adopt FormField's inputId so <Label htmlFor> resolves.\n    const inputId = props.id ?? fieldCtx.inputId\n\n    const hasStart = !!startSection\n    const hasEnd = !!endSection\n\n    // Infer section type: string → label, ReactElement → icon\n    const startType = startSectionTypeProp ?? (typeof startSection === 'string' ? 'label' : 'icon')\n    const endType = endSectionTypeProp ?? (typeof endSection === 'string' ? 'label' : 'icon')\n\n    const labelPaddingMap: Record<string, string> = {\n      xs: 'px-ds-02',\n      sm: 'px-ds-02',\n      md: 'px-ds-03',\n      lg: 'px-ds-03',\n    }\n\n    const labelTextMap: Record<string, string> = {\n      xs: 'text-ds-sm',\n      sm: 'text-ds-sm',\n      md: 'text-ds-sm',\n      lg: 'text-ds-md',\n    }\n\n    const inputPadding: Record<string, string> = {\n      xs: 'px-ds-02',\n      sm: 'px-ds-03',\n      md: 'px-ds-03',\n      lg: 'px-ds-04',\n    }\n\n    return (\n      <div\n        className={cn(\n          inputWrapperVariants({ size }),\n          state === 'error' && 'border-error-7 focus-within:ring-error-7',\n          state === 'warning' && 'border-warning-7 focus-within:ring-warning-7',\n          state === 'success' && 'border-success-7 focus-within:ring-success-7',\n          wrapperClassName,\n        )}\n      >\n        {hasStart && startType === 'label' && (\n          <span\n            className={cn(\n              'flex items-center shrink-0 select-none self-stretch',\n              'border-r border-surface-border',\n              'bg-surface-raised text-surface-fg-muted',\n              'rounded-l-[inherit]',\n              labelPaddingMap[size],\n              labelTextMap[size],\n              !startSectionClickable && 'pointer-events-none',\n            )}\n          >\n            {startSection}\n          </span>\n        )}\n\n        {hasStart && startType === 'icon' && (\n          <IconProvider size={iconSizeMap[size]}>\n            <span\n              className={cn(\n                'flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted',\n                sectionWidthMap[size],\n                !startSectionClickable && 'pointer-events-none',\n              )}\n            >\n              {startSection}\n            </span>\n          </IconProvider>\n        )}\n\n        <input\n          type={type}\n          className={cn(\n            'flex-1 min-w-0 h-full bg-transparent outline-hidden font-sans',\n            'placeholder:text-surface-fg-subtle',\n            'disabled:cursor-not-allowed',\n            'read-only:cursor-default',\n            inputPadding[size],\n            // Remove left padding when start icon section is present (icon provides visual space)\n            hasStart && startType === 'icon' && 'pl-0',\n            // Remove right padding when end icon section is present\n            hasEnd && endType === 'icon' && 'pr-0',\n            className,\n          )}\n          aria-invalid={state === 'error' || undefined}\n          aria-describedby={ariaDescribedBy}\n          aria-required={ariaRequired || undefined}\n          ref={ref}\n          {...props}\n          id={inputId}\n        />\n\n        {hasEnd && endType === 'label' && (\n          <span\n            className={cn(\n              'flex items-center shrink-0 select-none self-stretch',\n              'border-l border-surface-border',\n              'bg-surface-raised text-surface-fg-muted',\n              'rounded-r-[inherit]',\n              labelPaddingMap[size],\n              labelTextMap[size],\n              !endSectionClickable && 'pointer-events-none',\n            )}\n          >\n            {endSection}\n          </span>\n        )}\n\n        {hasEnd && endType === 'icon' && (\n          <IconProvider size={iconSizeMap[size]}>\n            <span\n              className={cn(\n                'flex items-center justify-center shrink-0 self-stretch text-surface-fg-muted',\n                sectionWidthMap[size],\n                !endSectionClickable && 'pointer-events-none',\n              )}\n            >\n              {endSection}\n            </span>\n          </IconProvider>\n        )}\n      </div>\n    )\n  },\n)\nInput.displayName = 'Input'\n\nexport { Input, inputWrapperVariants }\n"],"mappings":";;;;;;;;AAWA,IAAM,IAAuB,EAC3B;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACD;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAEK,IAA0C;CAC9C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAwC;CAC5C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAqDK,IAAQ,EAAM,YAEhB,EACE,cACA,SACA,OAAO,GACP,MAAM,IAAW,MACjB,iBACA,eACA,0BACA,wBACA,kBAAkB,GAClB,gBAAgB,GAChB,qBACA,GAAG,KAEL,MACG;CACH,IAAM,IAAO,KAAY,MACnB,IAAW,GAAc,EAEzB,IACJ,MACC,EAAS,UAAU,WAChB,KAAA,IACC,EAAS,QACV,IAAkB,EAAM,uBAAuB,EAAS,cACxD,IAAe,EAAM,oBAAoB,EAAS,UAElD,IAAU,EAAM,MAAM,EAAS,SAE/B,IAAW,CAAC,CAAC,GACb,IAAS,CAAC,CAAC,GAGX,IAAY,MAAyB,OAAO,KAAiB,WAAW,UAAU,SAClF,IAAU,MAAuB,OAAO,KAAe,WAAW,UAAU,SAE5E,IAA0C;EAC9C,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EAEK,IAAuC;EAC3C,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;AASD,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAAqB,EAAE,SAAM,CAAC,EAC9B,MAAU,WAAW,4CACrB,MAAU,aAAa,gDACvB,MAAU,aAAa,gDACvB,EACD;YAPH;GASG,KAAY,MAAc,WACzB,kBAAC,QAAD;IACE,WAAW,EACT,uDACA,kCACA,2CACA,uBACA,EAAgB,IAChB,EAAa,IACb,CAAC,KAAyB,sBAC3B;cAEA;IACI,CAAA;GAGR,KAAY,MAAc,UACzB,kBAAC,GAAD;IAAc,MAAM,EAAY;cAC9B,kBAAC,QAAD;KACE,WAAW,EACT,gFACA,EAAgB,IAChB,CAAC,KAAyB,sBAC3B;eAEA;KACI,CAAA;IACM,CAAA;GAGjB,kBAAC,SAAD;IACQ;IACN,WAAW,EACT,iEACA,sCACA,+BACA,4BArDqC;KAC3C,IAAI;KACJ,IAAI;KACJ,IAAI;KACJ,IAAI;KACL,CAiDoB,IAEb,KAAY,MAAc,UAAU,QAEpC,KAAU,MAAY,UAAU,QAChC,EACD;IACD,gBAAc,MAAU,WAAW,KAAA;IACnC,oBAAkB;IAClB,iBAAe,KAAgB,KAAA;IAC1B;IACL,GAAI;IACJ,IAAI;IACJ,CAAA;GAED,KAAU,MAAY,WACrB,kBAAC,QAAD;IACE,WAAW,EACT,uDACA,kCACA,2CACA,uBACA,EAAgB,IAChB,EAAa,IACb,CAAC,KAAuB,sBACzB;cAEA;IACI,CAAA;GAGR,KAAU,MAAY,UACrB,kBAAC,GAAD;IAAc,MAAM,EAAY;cAC9B,kBAAC,QAAD;KACE,WAAW,EACT,gFACA,EAAgB,IAChB,CAAC,KAAuB,sBACzB;eAEA;KACI,CAAA;IACM,CAAA;GAEb;;EAGX;AACD,EAAM,cAAc"}

package/dist/ui/link.js

@@ -6,7 +6,7 @@ import { jsx as r } from "react/jsx-runtime";
 //#region src/ui/link.tsx
 var i = n.forwardRef(({ className: n, inline: i = !0, asChild: a = !1, ...o }, s) => /* @__PURE__ */ r(a ? e : "a", {
 	ref: s,
-	className: t("text-accent-11 underline decoration-transparent hover:decoration-current underline-offset-2", "hover:text-accent-12 active:opacity-80 transition-[color,text-decoration-color,opacity] duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 rounded-ds-sm", i ? "inline" : "block", n),
+	className: t("text-accent-11 underline decoration-transparent hover:decoration-current underline-offset-2", "hover:text-accent-12 active:opacity-80 transition-[color,text-decoration-color,opacity] duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 rounded-control-inner", i ? "inline" : "block", n),
 	...o
 }));
 i.displayName = "Link";

package/dist/ui/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","names":[],"sources":["../../src/ui/link.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport * as React from 'react'\n\nimport { cn } from './lib/utils'\n\nexport interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  inline?: boolean\n  asChild?: boolean\n}\n\nconst Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ className, inline = true, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'a'\n\n    return (\n      <Comp\n        ref={ref}\n        className={cn(\n          'text-accent-11 underline decoration-transparent hover:decoration-current underline-offset-2',\n          'hover:text-accent-12 active:opacity-80 transition-[color,text-decoration-color,opacity] duration-fast-01 ease-productive-standard',\n          'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 rounded-ds-sm',\n          inline ? 'inline' : 'block',\n          className,\n        )}\n        {...props}\n      />\n    )\n  },\n)\nLink.displayName = 'Link'\n\nexport { Link }\n"],"mappings":";;;;;;AAYA,IAAM,IAAO,EAAM,YAChB,EAAE,cAAW,YAAS,IAAM,aAAU,IAAO,GAAG,KAAS,MAItD,kBAHW,IAAU,IAAO,KAG5B;CACO;CACL,WAAW,EACT,+FACA,qIACA,2HACA,IAAS,WAAW,SACpB,EACD;CACD,GAAI;CACJ,CAAA,CAGP;AACD,EAAK,cAAc"}
+{"version":3,"file":"link.js","names":[],"sources":["../../src/ui/link.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport * as React from 'react'\n\nimport { cn } from './lib/utils'\n\nexport interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  inline?: boolean\n  asChild?: boolean\n}\n\nconst Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ className, inline = true, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'a'\n\n    return (\n      <Comp\n        ref={ref}\n        className={cn(\n          'text-accent-11 underline decoration-transparent hover:decoration-current underline-offset-2',\n          'hover:text-accent-12 active:opacity-80 transition-[color,text-decoration-color,opacity] duration-fast-01 ease-productive-standard',\n          'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 rounded-control-inner',\n          inline ? 'inline' : 'block',\n          className,\n        )}\n        {...props}\n      />\n    )\n  },\n)\nLink.displayName = 'Link'\n\nexport { Link }\n"],"mappings":";;;;;;AAYA,IAAM,IAAO,EAAM,YAChB,EAAE,cAAW,YAAS,IAAM,aAAU,IAAO,GAAG,KAAS,MAItD,kBAHW,IAAU,IAAO,KAG5B;CACO;CACL,WAAW,EACT,+FACA,qIACA,mIACA,IAAS,WAAW,SACpB,EACD;CACD,GAAI;CACJ,CAAA,CAGP;AACD,EAAK,cAAc"}

package/dist/ui/menubar.js

@@ -26,19 +26,19 @@ var A = l, j = s, M = ({ open: e, defaultOpen: t = !1, onOpenChange: n, ...r })
 M.displayName = "MenubarSub";
 var N = m, P = b.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ x(e, {
 	ref: r,
-	className: v("flex h-ds-sm-plus items-center space-x-ds-02 rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised", t),
+	className: v("flex h-ds-sm-plus items-center space-x-ds-02 rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised", t),
 	...n
 }));
 P.displayName = e.displayName;
 var F = b.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ x(r, {
 	ref: n,
-	className: v("flex cursor-default select-none items-center rounded-ds-sm px-ds-04 py-ds-02 text-ds-md font-medium outline-hidden transition-colors hover:bg-surface-raised-hover focus-visible:bg-surface-raised-hover data-[state=open]:bg-surface-raised-hover", e),
+	className: v("flex cursor-default select-none items-center rounded-control px-ds-04 py-ds-02 text-ds-md font-medium outline-hidden transition-colors hover:bg-surface-raised-hover focus-visible:bg-surface-raised-hover data-[state=open]:bg-surface-raised-hover", e),
 	...t
 }));
 F.displayName = r.displayName;
 var I = b.forwardRef(({ className: e, inset: n, children: r, ...i }, a) => /* @__PURE__ */ S(t, {
 	ref: a,
-	className: v("flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-hidden focus:bg-surface-raised data-[state=open]:bg-surface-raised [&_svg]:pointer-events-none [&_svg]:h-ico-sm [&_svg]:w-ico-sm [&_svg]:shrink-0", n && "pl-ds-07", e),
+	className: v("flex cursor-default select-none items-center gap-ds-03 rounded-control px-ds-03 py-ds-02b text-ds-md outline-hidden focus:bg-surface-raised data-[state=open]:bg-surface-raised [&_svg]:pointer-events-none [&_svg]:h-ico-sm [&_svg]:w-ico-sm [&_svg]:shrink-0", n && "pl-ds-07", e),
 	...i,
 	children: [r, /* @__PURE__ */ x(y, {
 		icon: w,
@@ -69,7 +69,7 @@ var L = b.forwardRef(({ className: e, children: t, ...r }, i) => /* @__PURE__ */
 			...g.snappy,
 			opacity: _.fade
 		},
-		className: v("z-popover min-w-[8rem] overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating", e),
+		className: v("z-popover min-w-[8rem] overflow-hidden rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating", e),
 		children: t
 	})
 }) }));
@@ -79,20 +79,20 @@ var R = b.forwardRef(({ className: e, align: t = "start", alignOffset: n = -4, s
 	align: t,
 	alignOffset: n,
 	sideOffset: r,
-	className: v("z-popover min-w-[12rem] rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating", "data-[state=open]:animate-popover-in data-[state=closed]:animate-popover-out", e),
+	className: v("z-popover min-w-[12rem] rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating", "data-[state=open]:animate-popover-in data-[state=closed]:animate-popover-out", e),
 	...a,
 	children: i
 }) }));
 R.displayName = u.displayName;
 var z = b.forwardRef(({ className: e, inset: t, ...n }, r) => /* @__PURE__ */ x(c, {
 	ref: r,
-	className: v("relative flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0", t && "pl-ds-07", e),
+	className: v("relative flex cursor-default select-none items-center gap-ds-03 rounded-control px-ds-03 py-ds-02b text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0", t && "pl-ds-07", e),
 	...n
 }));
 z.displayName = c.displayName;
 var B = b.forwardRef(({ className: e, children: t, checked: n, ...r }, i) => /* @__PURE__ */ S(d, {
 	ref: i,
-	className: v("relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled", e),
+	className: v("relative flex cursor-default select-none items-center rounded-control py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled", e),
 	checked: n,
 	...r,
 	children: [/* @__PURE__ */ x("span", {
@@ -106,7 +106,7 @@ var B = b.forwardRef(({ className: e, children: t, checked: n, ...r }, i) => /*
 B.displayName = d.displayName;
 var V = b.forwardRef(({ className: e, children: t, ...n }, r) => /* @__PURE__ */ S(i, {
 	ref: r,
-	className: v("relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled", e),
+	className: v("relative flex cursor-default select-none items-center rounded-control py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled", e),
 	...n,
 	children: [/* @__PURE__ */ x("span", {
 		className: "absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center",

package/dist/ui/menubar.js.map

@@ -1 +1 @@
-{"version":3,"file":"menubar.js","names":[],"sources":["../../src/ui/menubar.tsx"],"sourcesContent":["'use client'\n\nimport * as MenubarPrimitive from '@primitives/react-menubar'\nimport { IconCheck, IconChevronRight, IconCircle } from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { springs, tweens } from './lib/motion'\nimport { cn } from './lib/utils'\n\n// ── Internal contexts to thread open state ──\n\nconst MenubarSubOpenContext = React.createContext(false)\n\nconst MenubarMenu: React.FC<React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Menu>> = (props) => {\n  // MenubarPrimitive.Menu doesn't expose open/onOpenChange directly.\n  // We derive open from data-state on the trigger via a callback ref approach,\n  // but the cleanest way is to use the Menubar root's value prop.\n  // Since MenubarMenu doesn't have open/onOpenChange, we track via a wrapper\n  // that observes the trigger's data-state.\n  //\n  // Alternative: MenubarPrimitive.Menu has a `value` that the root uses.\n  // We'll use a simpler approach: track open via content mount state.\n  return <MenubarPrimitive.Menu {...props} />\n}\nMenubarMenu.displayName = 'MenubarMenu'\n\n// For Menubar, the Menu doesn't expose open/onOpenChange. Instead, we'll use a\n// different approach: wrap Content to use a local presence state based on data-state.\n// We create a wrapper component that tracks whether content should be shown.\n\nconst MenubarGroup: typeof MenubarPrimitive.Group = MenubarPrimitive.Group\n\nconst MenubarPortal: typeof MenubarPrimitive.Portal = MenubarPrimitive.Portal\n\nconst MenubarSub: React.FC<React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Sub>> = ({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  ...props\n}) => {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n  const isControlled = controlledOpen !== undefined\n  const open = isControlled ? controlledOpen : uncontrolledOpen\n\n  const handleOpenChange = React.useCallback(\n    (value: boolean) => {\n      if (!isControlled) setUncontrolledOpen(value)\n      onOpenChange?.(value)\n    },\n    [isControlled, onOpenChange],\n  )\n\n  return (\n    <MenubarSubOpenContext.Provider value={open}>\n      <MenubarPrimitive.Sub open={open} onOpenChange={handleOpenChange} {...props} />\n    </MenubarSubOpenContext.Provider>\n  )\n}\nMenubarSub.displayName = 'MenubarSub'\n\nconst MenubarRadioGroup: typeof MenubarPrimitive.RadioGroup =\n  MenubarPrimitive.RadioGroup\n\nconst Menubar = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Root\n    ref={ref}\n    className={cn(\n      'flex h-ds-sm-plus items-center space-x-ds-02 rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubar.displayName = MenubarPrimitive.Root.displayName\n\nconst MenubarTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      'flex cursor-default select-none items-center rounded-ds-sm px-ds-04 py-ds-02 text-ds-md font-medium outline-hidden transition-colors hover:bg-surface-raised-hover focus-visible:bg-surface-raised-hover data-[state=open]:bg-surface-raised-hover',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName\n\nconst MenubarSubTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <MenubarPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      'flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-hidden focus:bg-surface-raised data-[state=open]:bg-surface-raised [&_svg]:pointer-events-none [&_svg]:h-ico-sm [&_svg]:w-ico-sm [&_svg]:shrink-0',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <Icon icon={IconChevronRight} size=\"sm\" className=\"ml-auto\" />\n  </MenubarPrimitive.SubTrigger>\n))\nMenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName\n\nconst MenubarSubContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubContent>\n>(({ className, children, ...props }, ref) => {\n  const open = React.useContext(MenubarSubOpenContext)\n\n  return (\n    <AnimatePresence>\n      {open && (\n        <MenubarPrimitive.SubContent\n          ref={ref}\n          forceMount\n          asChild\n          {...props}\n        >\n          <motion.div\n            initial={{ opacity: 0, scale: 0.95 }}\n            animate={{ opacity: 1, scale: 1 }}\n            exit={{ opacity: 0, scale: 0.95 }}\n            transition={{ ...springs.snappy, opacity: tweens.fade }}\n            className={cn(\n              'z-popover min-w-[8rem] overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating',\n              className,\n            )}\n          >\n            {children}\n          </motion.div>\n        </MenubarPrimitive.SubContent>\n      )}\n    </AnimatePresence>\n  )\n})\nMenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName\n\n// For MenubarContent, since MenubarMenu doesn't expose open/onOpenChange,\n// we use a wrapper that reads presence from a callback approach.\n// The cleanest solution: use a local state tracker via onCloseAutoFocus/onOpenAutoFocus\n// or simply keep CSS-free and let Radix handle mount/unmount naturally.\n//\n// Since Menubar menus are opened by the Menubar root (which tracks which menu value is open),\n// and MenubarPrimitive.Content already handles mount/unmount, we can use a ref-based approach\n// to detect the data-state attribute. However, the simplest reliable approach is to use\n// a wrapper that detects mount via useEffect.\n\n// MenubarContent uses CSS data-state animations instead of framer-motion because\n// MenubarPrimitive.Menu doesn't expose open/onOpenChange, making AnimatePresence\n// impossible to wire up for exit animations. The popover-in/popover-out keyframes\n// are defined in the tailwind preset and triggered by Radix's data-state attribute.\nconst MenubarContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\n>(\n  (\n    { className, align = 'start', alignOffset = -4, sideOffset = 8, children, ...props },\n    ref,\n  ) => (\n    <MenubarPrimitive.Portal>\n      <MenubarPrimitive.Content\n        ref={ref}\n        align={align}\n        alignOffset={alignOffset}\n        sideOffset={sideOffset}\n        className={cn(\n          'z-popover min-w-[12rem] rounded-ds-lg border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating',\n          'data-[state=open]:animate-popover-in data-[state=closed]:animate-popover-out',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </MenubarPrimitive.Content>\n    </MenubarPrimitive.Portal>\n  ),\n)\nMenubarContent.displayName = MenubarPrimitive.Content.displayName\n\nconst MenubarItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center gap-ds-03 rounded-ds-md px-ds-03 py-ds-02b text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarItem.displayName = MenubarPrimitive.Item.displayName\n\nconst MenubarCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <MenubarPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled',\n      className,\n    )}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <Icon icon={IconCheck} size=\"sm\" />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.CheckboxItem>\n))\nMenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName\n\nconst MenubarRadioItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <MenubarPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled',\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <IconCircle className=\"h-2 w-2 fill-current\" />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.RadioItem>\n))\nMenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName\n\nconst MenubarLabel = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Label\n    ref={ref}\n    className={cn(\n      'px-ds-03 py-ds-02b text-ds-md font-semibold',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarLabel.displayName = MenubarPrimitive.Label.displayName\n\nconst MenubarSeparator = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Separator\n    ref={ref}\n    className={cn('-mx-ds-01 my-ds-02 h-px bg-surface-border', className)}\n    {...props}\n  />\n))\nMenubarSeparator.displayName = MenubarPrimitive.Separator.displayName\n\nconst MenubarShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span\n      className={cn(\n        'ml-auto text-ds-sm text-surface-fg-subtle',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nMenubarShortcut.displayName = 'MenubarShortcut'\n\nexport type MenubarContentProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\nexport type MenubarItemProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item>\n\nexport {\n  Menubar,\n  MenubarCheckboxItem,\n  MenubarContent,\n  MenubarGroup,\n  MenubarItem,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarPortal,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarShortcut,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n}\n"],"mappings":"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"}
+{"version":3,"file":"menubar.js","names":[],"sources":["../../src/ui/menubar.tsx"],"sourcesContent":["'use client'\n\nimport * as MenubarPrimitive from '@primitives/react-menubar'\nimport { IconCheck, IconChevronRight, IconCircle } from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { springs, tweens } from './lib/motion'\nimport { cn } from './lib/utils'\n\n// ── Internal contexts to thread open state ──\n\nconst MenubarSubOpenContext = React.createContext(false)\n\nconst MenubarMenu: React.FC<React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Menu>> = (props) => {\n  // MenubarPrimitive.Menu doesn't expose open/onOpenChange directly.\n  // We derive open from data-state on the trigger via a callback ref approach,\n  // but the cleanest way is to use the Menubar root's value prop.\n  // Since MenubarMenu doesn't have open/onOpenChange, we track via a wrapper\n  // that observes the trigger's data-state.\n  //\n  // Alternative: MenubarPrimitive.Menu has a `value` that the root uses.\n  // We'll use a simpler approach: track open via content mount state.\n  return <MenubarPrimitive.Menu {...props} />\n}\nMenubarMenu.displayName = 'MenubarMenu'\n\n// For Menubar, the Menu doesn't expose open/onOpenChange. Instead, we'll use a\n// different approach: wrap Content to use a local presence state based on data-state.\n// We create a wrapper component that tracks whether content should be shown.\n\nconst MenubarGroup: typeof MenubarPrimitive.Group = MenubarPrimitive.Group\n\nconst MenubarPortal: typeof MenubarPrimitive.Portal = MenubarPrimitive.Portal\n\nconst MenubarSub: React.FC<React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Sub>> = ({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  ...props\n}) => {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n  const isControlled = controlledOpen !== undefined\n  const open = isControlled ? controlledOpen : uncontrolledOpen\n\n  const handleOpenChange = React.useCallback(\n    (value: boolean) => {\n      if (!isControlled) setUncontrolledOpen(value)\n      onOpenChange?.(value)\n    },\n    [isControlled, onOpenChange],\n  )\n\n  return (\n    <MenubarSubOpenContext.Provider value={open}>\n      <MenubarPrimitive.Sub open={open} onOpenChange={handleOpenChange} {...props} />\n    </MenubarSubOpenContext.Provider>\n  )\n}\nMenubarSub.displayName = 'MenubarSub'\n\nconst MenubarRadioGroup: typeof MenubarPrimitive.RadioGroup =\n  MenubarPrimitive.RadioGroup\n\nconst Menubar = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Root\n    ref={ref}\n    className={cn(\n      'flex h-ds-sm-plus items-center space-x-ds-02 rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 shadow-raised',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubar.displayName = MenubarPrimitive.Root.displayName\n\nconst MenubarTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      'flex cursor-default select-none items-center rounded-control px-ds-04 py-ds-02 text-ds-md font-medium outline-hidden transition-colors hover:bg-surface-raised-hover focus-visible:bg-surface-raised-hover data-[state=open]:bg-surface-raised-hover',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName\n\nconst MenubarSubTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & {\n    inset?: boolean\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <MenubarPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      'flex cursor-default select-none items-center gap-ds-03 rounded-control px-ds-03 py-ds-02b text-ds-md outline-hidden focus:bg-surface-raised data-[state=open]:bg-surface-raised [&_svg]:pointer-events-none [&_svg]:h-ico-sm [&_svg]:w-ico-sm [&_svg]:shrink-0',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <Icon icon={IconChevronRight} size=\"sm\" className=\"ml-auto\" />\n  </MenubarPrimitive.SubTrigger>\n))\nMenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName\n\nconst MenubarSubContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubContent>\n>(({ className, children, ...props }, ref) => {\n  const open = React.useContext(MenubarSubOpenContext)\n\n  return (\n    <AnimatePresence>\n      {open && (\n        <MenubarPrimitive.SubContent\n          ref={ref}\n          forceMount\n          asChild\n          {...props}\n        >\n          <motion.div\n            initial={{ opacity: 0, scale: 0.95 }}\n            animate={{ opacity: 1, scale: 1 }}\n            exit={{ opacity: 0, scale: 0.95 }}\n            transition={{ ...springs.snappy, opacity: tweens.fade }}\n            className={cn(\n              'z-popover min-w-[8rem] overflow-hidden rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating',\n              className,\n            )}\n          >\n            {children}\n          </motion.div>\n        </MenubarPrimitive.SubContent>\n      )}\n    </AnimatePresence>\n  )\n})\nMenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName\n\n// For MenubarContent, since MenubarMenu doesn't expose open/onOpenChange,\n// we use a wrapper that reads presence from a callback approach.\n// The cleanest solution: use a local state tracker via onCloseAutoFocus/onOpenAutoFocus\n// or simply keep CSS-free and let Radix handle mount/unmount naturally.\n//\n// Since Menubar menus are opened by the Menubar root (which tracks which menu value is open),\n// and MenubarPrimitive.Content already handles mount/unmount, we can use a ref-based approach\n// to detect the data-state attribute. However, the simplest reliable approach is to use\n// a wrapper that detects mount via useEffect.\n\n// MenubarContent uses CSS data-state animations instead of framer-motion because\n// MenubarPrimitive.Menu doesn't expose open/onOpenChange, making AnimatePresence\n// impossible to wire up for exit animations. The popover-in/popover-out keyframes\n// are defined in the tailwind preset and triggered by Radix's data-state attribute.\nconst MenubarContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\n>(\n  (\n    { className, align = 'start', alignOffset = -4, sideOffset = 8, children, ...props },\n    ref,\n  ) => (\n    <MenubarPrimitive.Portal>\n      <MenubarPrimitive.Content\n        ref={ref}\n        align={align}\n        alignOffset={alignOffset}\n        sideOffset={sideOffset}\n        className={cn(\n          'z-popover min-w-[12rem] rounded-overlay border border-surface-border-strong bg-surface-overlay p-ds-02 text-surface-fg shadow-floating',\n          'data-[state=open]:animate-popover-in data-[state=closed]:animate-popover-out',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </MenubarPrimitive.Content>\n    </MenubarPrimitive.Portal>\n  ),\n)\nMenubarContent.displayName = MenubarPrimitive.Content.displayName\n\nconst MenubarItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center gap-ds-03 rounded-control px-ds-03 py-ds-02b text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled [&>svg]:h-ico-sm [&>svg]:w-ico-sm [&>svg]:shrink-0',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarItem.displayName = MenubarPrimitive.Item.displayName\n\nconst MenubarCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <MenubarPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-control py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled',\n      className,\n    )}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <Icon icon={IconCheck} size=\"sm\" />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.CheckboxItem>\n))\nMenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName\n\nconst MenubarRadioItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <MenubarPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-control py-ds-02b pl-ds-07 pr-ds-03 text-ds-md outline-hidden transition-colors focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled',\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-ds-03 flex h-ico-sm w-ico-sm items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <IconCircle className=\"h-2 w-2 fill-current\" />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.RadioItem>\n))\nMenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName\n\nconst MenubarLabel = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Label> & {\n    inset?: boolean\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Label\n    ref={ref}\n    className={cn(\n      'px-ds-03 py-ds-02b text-ds-md font-semibold',\n      inset && 'pl-ds-07',\n      className,\n    )}\n    {...props}\n  />\n))\nMenubarLabel.displayName = MenubarPrimitive.Label.displayName\n\nconst MenubarSeparator = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Separator\n    ref={ref}\n    className={cn('-mx-ds-01 my-ds-02 h-px bg-surface-border', className)}\n    {...props}\n  />\n))\nMenubarSeparator.displayName = MenubarPrimitive.Separator.displayName\n\nconst MenubarShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span\n      className={cn(\n        'ml-auto text-ds-sm text-surface-fg-subtle',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nMenubarShortcut.displayName = 'MenubarShortcut'\n\nexport type MenubarContentProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\nexport type MenubarItemProps = React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item>\n\nexport {\n  Menubar,\n  MenubarCheckboxItem,\n  MenubarContent,\n  MenubarGroup,\n  MenubarItem,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarPortal,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarShortcut,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n}\n"],"mappings":"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"}

package/dist/ui/navigation-menu.js

@@ -23,7 +23,7 @@ var v = f.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ p(i, {
 v.displayName = i.displayName;
 var y = o, b = f.forwardRef(({ className: e, children: t, ...r }, i) => /* @__PURE__ */ m(n, {
 	ref: i,
-	className: u("group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-ds-md bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled", e),
+	className: u("group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-control bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled", e),
 	...r,
 	children: [
 		t,
@@ -113,7 +113,7 @@ var C = t, w = f.forwardRef(({ className: e, ...t }, n) => {
 	}, []), /* @__PURE__ */ m("div", {
 		className: u("absolute left-0 top-full flex justify-center"),
 		children: [/* @__PURE__ */ p(r, {
-			className: u("origin-top-center relative mt-ds-02b h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay shadow-floating md:w-[var(--radix-navigation-menu-viewport-width)]", e),
+			className: u("origin-top-center relative mt-ds-02b h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-overlay border border-surface-border-strong bg-surface-overlay shadow-floating md:w-[var(--radix-navigation-menu-viewport-width)]", e),
 			ref: a,
 			...t
 		}), /* @__PURE__ */ p(g.div, {
@@ -159,7 +159,7 @@ var T = f.forwardRef(({ className: e, ...t }, n) => {
 			initial: !1,
 			animate: o ? { opacity: 1 } : { opacity: 0 },
 			transition: l.fade,
-			className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-surface-border shadow-raised-hover"
+			className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-control-inner bg-surface-border shadow-raised-hover"
 		})
 	});
 });

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

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.js","names":[],"sources":["../../src/ui/navigation-menu.tsx"],"sourcesContent":["'use client'\n\nimport * as NavigationMenuPrimitive from '@primitives/react-navigation-menu'\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { springs, tweens } from './lib/motion'\nimport { cn } from './lib/utils'\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      'relative z-raised flex max-w-max flex-1 items-center justify-center',\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n))\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\n      'group flex flex-1 list-none items-center justify-center space-x-ds-02',\n      className,\n    )}\n    {...props}\n  />\n))\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      'group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-ds-md bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled',\n      className,\n    )}\n    {...props}\n  >\n    {children}{' '}\n    <Icon icon={IconChevronDown} size=\"sm\" className=\"relative top-[1px] ml-ds-02 transition-transform duration-moderate-02 group-data-[state=open]:rotate-180\" />\n  </NavigationMenuPrimitive.Trigger>\n))\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName\n\n// ── NavigationMenuContent — directional slide using data-motion ──\n\nconst contentSlideVariants = {\n  'from-start': { x: '-13rem', opacity: 0 },\n  'from-end': { x: '13rem', opacity: 0 },\n  'to-start': { x: '-13rem', opacity: 0 },\n  'to-end': { x: '13rem', opacity: 0 },\n  center: { x: 0, opacity: 1 },\n} as const\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [motionDir, setMotionDir] = React.useState<string | null>(null)\n\n  // Observe data-motion attribute changes from Radix\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    // Read initial value\n    const initial = el.getAttribute('data-motion')\n    if (initial) setMotionDir(initial)\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-motion') {\n          const val = el.getAttribute('data-motion')\n          setMotionDir(val)\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-motion'] })\n    return () => observer.disconnect()\n  }, [])\n\n  const initial = motionDir && motionDir.startsWith('from-')\n    ? contentSlideVariants[motionDir as keyof typeof contentSlideVariants]\n    : motionDir && motionDir.startsWith('to-')\n      ? contentSlideVariants.center\n      : { x: 0, opacity: 0 }\n\n  const animate = motionDir && motionDir.startsWith('from-')\n    ? contentSlideVariants.center\n    : motionDir && motionDir.startsWith('to-')\n      ? contentSlideVariants[motionDir as keyof typeof contentSlideVariants]\n      : contentSlideVariants.center\n\n  return (\n    <NavigationMenuPrimitive.Content\n      ref={composedRef}\n      className={cn(\n        'left-0 top-0 w-full md:absolute md:w-auto',\n        className,\n      )}\n      {...props}\n    >\n      <motion.div\n        key={motionDir}\n        initial={initial}\n        animate={animate}\n        transition={{ ...springs.smooth, opacity: tweens.fade }}\n        className=\"w-full\"\n      >\n        {props.children}\n      </motion.div>\n    </NavigationMenuPrimitive.Content>\n  )\n})\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link\n\n// ── NavigationMenuViewport — scale + fade with layout for size changes ──\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [isOpen, setIsOpen] = React.useState(false)\n\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    const initial = el.getAttribute('data-state')\n    setIsOpen(initial === 'open')\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-state') {\n          setIsOpen(el.getAttribute('data-state') === 'open')\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n    return () => observer.disconnect()\n  }, [])\n\n  return (\n    <div className={cn('absolute left-0 top-full flex justify-center')}>\n      <NavigationMenuPrimitive.Viewport\n        className={cn(\n          'origin-top-center relative mt-ds-02b h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay shadow-floating md:w-[var(--radix-navigation-menu-viewport-width)]',\n          className,\n        )}\n        ref={composedRef}\n        {...props}\n      />\n      {/* Overlay motion element for scale+fade animation */}\n      <motion.div\n        aria-hidden\n        className=\"absolute inset-0 pointer-events-none\"\n        initial={false}\n        animate={isOpen ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }}\n        transition={{ ...springs.smooth, opacity: tweens.fade }}\n      />\n    </div>\n  )\n})\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName\n\n// ── NavigationMenuIndicator — fade + layout position sliding ──\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [isVisible, setIsVisible] = React.useState(false)\n\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    const initial = el.getAttribute('data-state')\n    setIsVisible(initial === 'visible')\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-state') {\n          setIsVisible(el.getAttribute('data-state') === 'visible')\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n    return () => observer.disconnect()\n  }, [])\n\n  return (\n    <NavigationMenuPrimitive.Indicator\n      ref={composedRef}\n      className={cn(\n        'top-full z-base flex h-ds-02b items-end justify-center overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <motion.div\n        layout\n        initial={false}\n        animate={isVisible ? { opacity: 1 } : { opacity: 0 }}\n        transition={tweens.fade}\n        className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-surface-border shadow-raised-hover\"\n      />\n    </NavigationMenuPrimitive.Indicator>\n  )\n})\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName\n\nexport type NavigationMenuProps = React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\nexport type NavigationMenuContentProps = React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n}\n"],"mappings":"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"}
+{"version":3,"file":"navigation-menu.js","names":[],"sources":["../../src/ui/navigation-menu.tsx"],"sourcesContent":["'use client'\n\nimport * as NavigationMenuPrimitive from '@primitives/react-navigation-menu'\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { springs, tweens } from './lib/motion'\nimport { cn } from './lib/utils'\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      'relative z-raised flex max-w-max flex-1 items-center justify-center',\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n))\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\n      'group flex flex-1 list-none items-center justify-center space-x-ds-02',\n      className,\n    )}\n    {...props}\n  />\n))\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      'group inline-flex h-ds-sm-plus w-max items-center justify-center rounded-control bg-transparent px-ds-05 py-ds-03 text-ds-md font-medium transition-colors hover:bg-surface-raised-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 disabled:pointer-events-none disabled:opacity-action-disabled',\n      className,\n    )}\n    {...props}\n  >\n    {children}{' '}\n    <Icon icon={IconChevronDown} size=\"sm\" className=\"relative top-[1px] ml-ds-02 transition-transform duration-moderate-02 group-data-[state=open]:rotate-180\" />\n  </NavigationMenuPrimitive.Trigger>\n))\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName\n\n// ── NavigationMenuContent — directional slide using data-motion ──\n\nconst contentSlideVariants = {\n  'from-start': { x: '-13rem', opacity: 0 },\n  'from-end': { x: '13rem', opacity: 0 },\n  'to-start': { x: '-13rem', opacity: 0 },\n  'to-end': { x: '13rem', opacity: 0 },\n  center: { x: 0, opacity: 1 },\n} as const\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [motionDir, setMotionDir] = React.useState<string | null>(null)\n\n  // Observe data-motion attribute changes from Radix\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    // Read initial value\n    const initial = el.getAttribute('data-motion')\n    if (initial) setMotionDir(initial)\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-motion') {\n          const val = el.getAttribute('data-motion')\n          setMotionDir(val)\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-motion'] })\n    return () => observer.disconnect()\n  }, [])\n\n  const initial = motionDir && motionDir.startsWith('from-')\n    ? contentSlideVariants[motionDir as keyof typeof contentSlideVariants]\n    : motionDir && motionDir.startsWith('to-')\n      ? contentSlideVariants.center\n      : { x: 0, opacity: 0 }\n\n  const animate = motionDir && motionDir.startsWith('from-')\n    ? contentSlideVariants.center\n    : motionDir && motionDir.startsWith('to-')\n      ? contentSlideVariants[motionDir as keyof typeof contentSlideVariants]\n      : contentSlideVariants.center\n\n  return (\n    <NavigationMenuPrimitive.Content\n      ref={composedRef}\n      className={cn(\n        'left-0 top-0 w-full md:absolute md:w-auto',\n        className,\n      )}\n      {...props}\n    >\n      <motion.div\n        key={motionDir}\n        initial={initial}\n        animate={animate}\n        transition={{ ...springs.smooth, opacity: tweens.fade }}\n        className=\"w-full\"\n      >\n        {props.children}\n      </motion.div>\n    </NavigationMenuPrimitive.Content>\n  )\n})\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link\n\n// ── NavigationMenuViewport — scale + fade with layout for size changes ──\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [isOpen, setIsOpen] = React.useState(false)\n\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    const initial = el.getAttribute('data-state')\n    setIsOpen(initial === 'open')\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-state') {\n          setIsOpen(el.getAttribute('data-state') === 'open')\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n    return () => observer.disconnect()\n  }, [])\n\n  return (\n    <div className={cn('absolute left-0 top-full flex justify-center')}>\n      <NavigationMenuPrimitive.Viewport\n        className={cn(\n          'origin-top-center relative mt-ds-02b h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-overlay border border-surface-border-strong bg-surface-overlay shadow-floating md:w-[var(--radix-navigation-menu-viewport-width)]',\n          className,\n        )}\n        ref={composedRef}\n        {...props}\n      />\n      {/* Overlay motion element for scale+fade animation */}\n      <motion.div\n        aria-hidden\n        className=\"absolute inset-0 pointer-events-none\"\n        initial={false}\n        animate={isOpen ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }}\n        transition={{ ...springs.smooth, opacity: tweens.fade }}\n      />\n    </div>\n  )\n})\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName\n\n// ── NavigationMenuIndicator — fade + layout position sliding ──\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => {\n  const innerRef = React.useRef<HTMLDivElement>(null)\n  const composedRef = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      (innerRef as React.MutableRefObject<HTMLDivElement | null>).current = node\n      if (typeof ref === 'function') ref(node)\n      else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n    },\n    [ref],\n  )\n\n  const [isVisible, setIsVisible] = React.useState(false)\n\n  React.useEffect(() => {\n    const el = innerRef.current\n    if (!el) return\n\n    const initial = el.getAttribute('data-state')\n    setIsVisible(initial === 'visible')\n\n    const observer = new MutationObserver((mutations) => {\n      for (const m of mutations) {\n        if (m.attributeName === 'data-state') {\n          setIsVisible(el.getAttribute('data-state') === 'visible')\n        }\n      }\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n    return () => observer.disconnect()\n  }, [])\n\n  return (\n    <NavigationMenuPrimitive.Indicator\n      ref={composedRef}\n      className={cn(\n        'top-full z-base flex h-ds-02b items-end justify-center overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <motion.div\n        layout\n        initial={false}\n        animate={isVisible ? { opacity: 1 } : { opacity: 0 }}\n        transition={tweens.fade}\n        className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-control-inner bg-surface-border shadow-raised-hover\"\n      />\n    </NavigationMenuPrimitive.Indicator>\n  )\n})\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName\n\nexport type NavigationMenuProps = React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\nexport type NavigationMenuContentProps = React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n}\n"],"mappings":"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"}