@aviala-design/spiral 0.1.0 → 0.2.0

package/dist/index.d.cts

@@ -1577,6 +1577,51 @@ type NavigationActionsProps = HTMLAttributes<HTMLDivElement>;
 declare const NavigationActions: react.ForwardRefExoticComponent<NavigationActionsProps & react.RefAttributes<HTMLDivElement>>;
 type NavigationActionsSlotProps = HTMLAttributes<HTMLDivElement>;
 declare const NavigationActionsSlot: react.ForwardRefExoticComponent<NavigationActionsSlotProps & react.RefAttributes<HTMLDivElement>>;
+type NavigationItemMenuProps = {
+    /** Selected child value — similar to Select `value`. */
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+};
+declare function NavigationItemMenu({ value: valueProp, defaultValue, onValueChange, open: openProp, onOpenChange, children, }: NavigationItemMenuProps): react.JSX.Element;
+type NavigationItemMenuTriggerProps = Omit<ComponentPropsWithoutRef<"button">, "children"> & {
+    /** Defaults to highlighted when the menu has a selected child. */
+    active?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+};
+/** Parent item — renders as a Navigation tab item and anchors the flyout. */
+declare const NavigationItemMenuTrigger: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
+    /** Defaults to highlighted when the menu has a selected child. */
+    active?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
+type NavigationItemMenuContentProps = ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>;
+/** Flyout surface — right of the item in vertical, below it in horizontal. */
+declare const NavigationItemMenuContent: react.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+type NavigationItemMenuItemProps = Omit<ComponentPropsWithoutRef<"button">, "children" | "value"> & {
+    value: string;
+    /** Defaults to highlighted when it matches the menu value. */
+    selected?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+};
+/** Child option — highlighted when selected, no check icon by default. */
+declare const NavigationItemMenuItem: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "value"> & {
+    value: string;
+    /** Defaults to highlighted when it matches the menu value. */
+    selected?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
 
 /** Figma Components → Information Collect → Slider (384:21585) */
 type SliderSize = "default" | "big";
@@ -1914,4 +1959,4 @@ declare function cn(...inputs: ClassValue[]): string;
  */
 declare function initKeyboardFocus(): void;
 
-export { Alert, type AlertAppearance, type AlertProps, type AlertSize, type AlertType, Anchor, type AnchorIndentLevel, AnchorItem, type AnchorItemProps, type AnchorProps, Avatar, type AvatarContent, type AvatarLevel, type AvatarProps, Badge, type BadgeLevel, type BadgeLineHeightFix, type BadgeProps, type BadgeStyle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbEllipsisItem, type BreadcrumbEllipsisItemProps, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, type BreadcrumbSize, Button, type ButtonMode, type ButtonProps, type ButtonSize, Card, CardBody, type CardBodyProps, CardBottom, type CardBottomProps, CardHead, type CardHeadProps, type CardProps, type CardSlotType, Cascader, CascaderColumn, type CascaderColumnProps, CascaderContent, type CascaderContentProps, CascaderField, type CascaderFieldProps, CascaderItem, type CascaderItemFunction, CascaderItemGroup, type CascaderItemGroupProps, type CascaderItemLayout, type CascaderItemProps, CascaderMenu, type CascaderMenuProps, type CascaderOption, CascaderOptionsMenu, type CascaderOptionsMenuProps, type CascaderProps, type CascaderSize, CascaderTrigger, type CascaderTriggerProps, Checkbox, CheckboxGroup, type CheckboxGroupDirection, type CheckboxGroupProps, CheckboxInput, type CheckboxInputProps, type CheckboxProps, type ColorFormat, ColorPickButton, type ColorPickButtonProps, ColorPicker, ColorPickerArea, type ColorPickerAreaProps, ColorPickerContent, type ColorPickerContentProps, ColorPickerInputs, type ColorPickerInputsProps, ColorPickerPanel, type ColorPickerPanelProps, ColorPickerPresets, type ColorPickerPresetsProps, type ColorPickerProps, ColorPickerSlider, type ColorPickerSliderProps, ColorPickerTrigger, type ColorPickerTriggerProps, DEFAULT_COLOR, DatePicker, DatePickerCalendar, type DatePickerCalendarProps, DatePickerContent, type DatePickerContentProps, DatePickerField, type DatePickerFieldProps, type DatePickerMode, type DatePickerPanel, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DatePickerSize, type DatePickerTimeValue, DatePickerTrigger, type DatePickerTriggerProps, type DateRange, Feedback, type FeedbackMode, type FeedbackProps, type FeedbackSize, type FeedbackType, Fieldset, FormField, type FormFieldProps, type HSVA, Input, InputGroup, InputGroupAddon, type InputGroupProps, type InputProps, type InputSize, Label, Link, type LinkLevel, type LinkMode, type LinkProps, List, ListDivider, type ListDividerProps, ListGroup, type ListGroupProps, ListItem, ListItemGroup, type ListItemGroupProps, type ListItemLeading, type ListItemProps, type ListItemType, type ListProps, ListSeparator, type ListSeparatorProps, ListTitle, type ListTitleProps, Loading, type LoadingButtonSize, type LoadingLevel, type LoadingMode, type LoadingProps, Modal, ModalBody, type ModalBodyProps, ModalClose, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHeaderText, type ModalHeaderTextProps, ModalOverlay, type ModalOverlayProps, ModalPortal, type ModalProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, Navigation, NavigationActions, type NavigationActionsProps, NavigationActionsSlot, type NavigationActionsSlotProps, type NavigationBackground, NavigationBrand, type NavigationBrandProps, NavigationBrandTitle, type NavigationBrandTitleProps, type NavigationDirection, NavigationGroup, type NavigationGroupProps, NavigationItem, NavigationItemGroup, type NavigationItemGroupProps, type NavigationItemProps, type NavigationItemType, type NavigationProps, NavigationSection, type NavigationSectionProps, Pagehead, type PageheadProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressShape, type ProgressSize, type ProgressType, RadioGroup, type RadioGroupDirection, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioInput, type RadioInputProps, type RadioInputVariant, Scroll, type ScrollOrientation, ScrollPicker, ScrollPickerColumn, type ScrollPickerColumnProps, ScrollPickerItem, type ScrollPickerItemProps, type ScrollPickerProps, type ScrollProps, type ScrollSize, SegmentatorGroup, type SegmentatorGroupProps, SegmentatorItem, type SegmentatorItemProps, type SegmentatorMode, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemFunction, SelectItemGroup, type SelectItemGroupProps, type SelectItemLayout, SelectItemPeople, type SelectItemPeopleProps, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectSeparator, type SelectSeparatorProps, type SelectSize, SelectSubItem, SelectSubItemPeople, type SelectSubItemPeopleProps, type SelectSubItemProps, SelectSubMenu, type SelectSubMenuProps, SelectTrigger, type SelectTriggerProps, SelectValue, Slider, type SliderProps, type SliderSize, type SliderType, Stack, type StackProps, Steps, type StepsDirection, StepsIcon, type StepsIconProps, StepsItem, type StepsItemProps, type StepsProps, type StepsState, Switch, type SwitchProps, type SwitchSize, TOOLTIP_DELAY_DURATION, Table, TableCell, type TableCellContent, type TableCellProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tag, TagClose, type TagCloseProps, type TagContent, type TagLevel, type TagLineHeightFix, type TagProps, Textarea, type TextareaProps, type TextareaSize, ThemeProvider, type ThemeProviderProps, ThemeScript, TimePicker, TimePickerContent, type TimePickerContentProps, TimePickerField, type TimePickerFieldProps, TimePickerPanel, type TimePickerPanelProps, type TimePickerProps, type TimePickerSize, TimePickerTrigger, type TimePickerTriggerProps, type TimePickerValue, TimePickerWheels, type TimePickerWheelsValue, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, Typeface, type TypefaceContent, TypefacePair, type TypefacePairProps, type TypefaceProps, Typography, type TypographyContent, type TypographyLevel, type TypographyProps, type TypographyTone, Upload, type UploadProps, type UploadStyle, type UseColorPickerStateOptions, alertVariants, buttonVariants, cn, formatDisplayDate, formatMonthYear, formatTimeValue, initKeyboardFocus, inputRootVariants, loadingLevelForButtonSize, modalContentVariants, typographyVariants, useColorPickerState, useTheme, useThemeLayoutKey };
+export { Alert, type AlertAppearance, type AlertProps, type AlertSize, type AlertType, Anchor, type AnchorIndentLevel, AnchorItem, type AnchorItemProps, type AnchorProps, Avatar, type AvatarContent, type AvatarLevel, type AvatarProps, Badge, type BadgeLevel, type BadgeLineHeightFix, type BadgeProps, type BadgeStyle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbEllipsisItem, type BreadcrumbEllipsisItemProps, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, type BreadcrumbSize, Button, type ButtonMode, type ButtonProps, type ButtonSize, Card, CardBody, type CardBodyProps, CardBottom, type CardBottomProps, CardHead, type CardHeadProps, type CardProps, type CardSlotType, Cascader, CascaderColumn, type CascaderColumnProps, CascaderContent, type CascaderContentProps, CascaderField, type CascaderFieldProps, CascaderItem, type CascaderItemFunction, CascaderItemGroup, type CascaderItemGroupProps, type CascaderItemLayout, type CascaderItemProps, CascaderMenu, type CascaderMenuProps, type CascaderOption, CascaderOptionsMenu, type CascaderOptionsMenuProps, type CascaderProps, type CascaderSize, CascaderTrigger, type CascaderTriggerProps, Checkbox, CheckboxGroup, type CheckboxGroupDirection, type CheckboxGroupProps, CheckboxInput, type CheckboxInputProps, type CheckboxProps, type ColorFormat, ColorPickButton, type ColorPickButtonProps, ColorPicker, ColorPickerArea, type ColorPickerAreaProps, ColorPickerContent, type ColorPickerContentProps, ColorPickerInputs, type ColorPickerInputsProps, ColorPickerPanel, type ColorPickerPanelProps, ColorPickerPresets, type ColorPickerPresetsProps, type ColorPickerProps, ColorPickerSlider, type ColorPickerSliderProps, ColorPickerTrigger, type ColorPickerTriggerProps, DEFAULT_COLOR, DatePicker, DatePickerCalendar, type DatePickerCalendarProps, DatePickerContent, type DatePickerContentProps, DatePickerField, type DatePickerFieldProps, type DatePickerMode, type DatePickerPanel, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DatePickerSize, type DatePickerTimeValue, DatePickerTrigger, type DatePickerTriggerProps, type DateRange, Feedback, type FeedbackMode, type FeedbackProps, type FeedbackSize, type FeedbackType, Fieldset, FormField, type FormFieldProps, type HSVA, Input, InputGroup, InputGroupAddon, type InputGroupProps, type InputProps, type InputSize, Label, Link, type LinkLevel, type LinkMode, type LinkProps, List, ListDivider, type ListDividerProps, ListGroup, type ListGroupProps, ListItem, ListItemGroup, type ListItemGroupProps, type ListItemLeading, type ListItemProps, type ListItemType, type ListProps, ListSeparator, type ListSeparatorProps, ListTitle, type ListTitleProps, Loading, type LoadingButtonSize, type LoadingLevel, type LoadingMode, type LoadingProps, Modal, ModalBody, type ModalBodyProps, ModalClose, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHeaderText, type ModalHeaderTextProps, ModalOverlay, type ModalOverlayProps, ModalPortal, type ModalProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, Navigation, NavigationActions, type NavigationActionsProps, NavigationActionsSlot, type NavigationActionsSlotProps, type NavigationBackground, NavigationBrand, type NavigationBrandProps, NavigationBrandTitle, type NavigationBrandTitleProps, type NavigationDirection, NavigationGroup, type NavigationGroupProps, NavigationItem, NavigationItemGroup, type NavigationItemGroupProps, NavigationItemMenu, NavigationItemMenuContent, type NavigationItemMenuContentProps, NavigationItemMenuItem, type NavigationItemMenuItemProps, type NavigationItemMenuProps, NavigationItemMenuTrigger, type NavigationItemMenuTriggerProps, type NavigationItemProps, type NavigationItemType, type NavigationProps, NavigationSection, type NavigationSectionProps, Pagehead, type PageheadProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressShape, type ProgressSize, type ProgressType, RadioGroup, type RadioGroupDirection, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioInput, type RadioInputProps, type RadioInputVariant, Scroll, type ScrollOrientation, ScrollPicker, ScrollPickerColumn, type ScrollPickerColumnProps, ScrollPickerItem, type ScrollPickerItemProps, type ScrollPickerProps, type ScrollProps, type ScrollSize, SegmentatorGroup, type SegmentatorGroupProps, SegmentatorItem, type SegmentatorItemProps, type SegmentatorMode, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemFunction, SelectItemGroup, type SelectItemGroupProps, type SelectItemLayout, SelectItemPeople, type SelectItemPeopleProps, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectSeparator, type SelectSeparatorProps, type SelectSize, SelectSubItem, SelectSubItemPeople, type SelectSubItemPeopleProps, type SelectSubItemProps, SelectSubMenu, type SelectSubMenuProps, SelectTrigger, type SelectTriggerProps, SelectValue, Slider, type SliderProps, type SliderSize, type SliderType, Stack, type StackProps, Steps, type StepsDirection, StepsIcon, type StepsIconProps, StepsItem, type StepsItemProps, type StepsProps, type StepsState, Switch, type SwitchProps, type SwitchSize, TOOLTIP_DELAY_DURATION, Table, TableCell, type TableCellContent, type TableCellProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tag, TagClose, type TagCloseProps, type TagContent, type TagLevel, type TagLineHeightFix, type TagProps, Textarea, type TextareaProps, type TextareaSize, ThemeProvider, type ThemeProviderProps, ThemeScript, TimePicker, TimePickerContent, type TimePickerContentProps, TimePickerField, type TimePickerFieldProps, TimePickerPanel, type TimePickerPanelProps, type TimePickerProps, type TimePickerSize, TimePickerTrigger, type TimePickerTriggerProps, type TimePickerValue, TimePickerWheels, type TimePickerWheelsValue, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, Typeface, type TypefaceContent, TypefacePair, type TypefacePairProps, type TypefaceProps, Typography, type TypographyContent, type TypographyLevel, type TypographyProps, type TypographyTone, Upload, type UploadProps, type UploadStyle, type UseColorPickerStateOptions, alertVariants, buttonVariants, cn, formatDisplayDate, formatMonthYear, formatTimeValue, initKeyboardFocus, inputRootVariants, loadingLevelForButtonSize, modalContentVariants, typographyVariants, useColorPickerState, useTheme, useThemeLayoutKey };

package/dist/index.d.ts

@@ -1577,6 +1577,51 @@ type NavigationActionsProps = HTMLAttributes<HTMLDivElement>;
 declare const NavigationActions: react.ForwardRefExoticComponent<NavigationActionsProps & react.RefAttributes<HTMLDivElement>>;
 type NavigationActionsSlotProps = HTMLAttributes<HTMLDivElement>;
 declare const NavigationActionsSlot: react.ForwardRefExoticComponent<NavigationActionsSlotProps & react.RefAttributes<HTMLDivElement>>;
+type NavigationItemMenuProps = {
+    /** Selected child value — similar to Select `value`. */
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+};
+declare function NavigationItemMenu({ value: valueProp, defaultValue, onValueChange, open: openProp, onOpenChange, children, }: NavigationItemMenuProps): react.JSX.Element;
+type NavigationItemMenuTriggerProps = Omit<ComponentPropsWithoutRef<"button">, "children"> & {
+    /** Defaults to highlighted when the menu has a selected child. */
+    active?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+};
+/** Parent item — renders as a Navigation tab item and anchors the flyout. */
+declare const NavigationItemMenuTrigger: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
+    /** Defaults to highlighted when the menu has a selected child. */
+    active?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
+type NavigationItemMenuContentProps = ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>;
+/** Flyout surface — right of the item in vertical, below it in horizontal. */
+declare const NavigationItemMenuContent: react.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+type NavigationItemMenuItemProps = Omit<ComponentPropsWithoutRef<"button">, "children" | "value"> & {
+    value: string;
+    /** Defaults to highlighted when it matches the menu value. */
+    selected?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+};
+/** Child option — highlighted when selected, no check icon by default. */
+declare const NavigationItemMenuItem: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "value"> & {
+    value: string;
+    /** Defaults to highlighted when it matches the menu value. */
+    selected?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
 
 /** Figma Components → Information Collect → Slider (384:21585) */
 type SliderSize = "default" | "big";
@@ -1914,4 +1959,4 @@ declare function cn(...inputs: ClassValue[]): string;
  */
 declare function initKeyboardFocus(): void;
 
-export { Alert, type AlertAppearance, type AlertProps, type AlertSize, type AlertType, Anchor, type AnchorIndentLevel, AnchorItem, type AnchorItemProps, type AnchorProps, Avatar, type AvatarContent, type AvatarLevel, type AvatarProps, Badge, type BadgeLevel, type BadgeLineHeightFix, type BadgeProps, type BadgeStyle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbEllipsisItem, type BreadcrumbEllipsisItemProps, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, type BreadcrumbSize, Button, type ButtonMode, type ButtonProps, type ButtonSize, Card, CardBody, type CardBodyProps, CardBottom, type CardBottomProps, CardHead, type CardHeadProps, type CardProps, type CardSlotType, Cascader, CascaderColumn, type CascaderColumnProps, CascaderContent, type CascaderContentProps, CascaderField, type CascaderFieldProps, CascaderItem, type CascaderItemFunction, CascaderItemGroup, type CascaderItemGroupProps, type CascaderItemLayout, type CascaderItemProps, CascaderMenu, type CascaderMenuProps, type CascaderOption, CascaderOptionsMenu, type CascaderOptionsMenuProps, type CascaderProps, type CascaderSize, CascaderTrigger, type CascaderTriggerProps, Checkbox, CheckboxGroup, type CheckboxGroupDirection, type CheckboxGroupProps, CheckboxInput, type CheckboxInputProps, type CheckboxProps, type ColorFormat, ColorPickButton, type ColorPickButtonProps, ColorPicker, ColorPickerArea, type ColorPickerAreaProps, ColorPickerContent, type ColorPickerContentProps, ColorPickerInputs, type ColorPickerInputsProps, ColorPickerPanel, type ColorPickerPanelProps, ColorPickerPresets, type ColorPickerPresetsProps, type ColorPickerProps, ColorPickerSlider, type ColorPickerSliderProps, ColorPickerTrigger, type ColorPickerTriggerProps, DEFAULT_COLOR, DatePicker, DatePickerCalendar, type DatePickerCalendarProps, DatePickerContent, type DatePickerContentProps, DatePickerField, type DatePickerFieldProps, type DatePickerMode, type DatePickerPanel, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DatePickerSize, type DatePickerTimeValue, DatePickerTrigger, type DatePickerTriggerProps, type DateRange, Feedback, type FeedbackMode, type FeedbackProps, type FeedbackSize, type FeedbackType, Fieldset, FormField, type FormFieldProps, type HSVA, Input, InputGroup, InputGroupAddon, type InputGroupProps, type InputProps, type InputSize, Label, Link, type LinkLevel, type LinkMode, type LinkProps, List, ListDivider, type ListDividerProps, ListGroup, type ListGroupProps, ListItem, ListItemGroup, type ListItemGroupProps, type ListItemLeading, type ListItemProps, type ListItemType, type ListProps, ListSeparator, type ListSeparatorProps, ListTitle, type ListTitleProps, Loading, type LoadingButtonSize, type LoadingLevel, type LoadingMode, type LoadingProps, Modal, ModalBody, type ModalBodyProps, ModalClose, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHeaderText, type ModalHeaderTextProps, ModalOverlay, type ModalOverlayProps, ModalPortal, type ModalProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, Navigation, NavigationActions, type NavigationActionsProps, NavigationActionsSlot, type NavigationActionsSlotProps, type NavigationBackground, NavigationBrand, type NavigationBrandProps, NavigationBrandTitle, type NavigationBrandTitleProps, type NavigationDirection, NavigationGroup, type NavigationGroupProps, NavigationItem, NavigationItemGroup, type NavigationItemGroupProps, type NavigationItemProps, type NavigationItemType, type NavigationProps, NavigationSection, type NavigationSectionProps, Pagehead, type PageheadProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressShape, type ProgressSize, type ProgressType, RadioGroup, type RadioGroupDirection, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioInput, type RadioInputProps, type RadioInputVariant, Scroll, type ScrollOrientation, ScrollPicker, ScrollPickerColumn, type ScrollPickerColumnProps, ScrollPickerItem, type ScrollPickerItemProps, type ScrollPickerProps, type ScrollProps, type ScrollSize, SegmentatorGroup, type SegmentatorGroupProps, SegmentatorItem, type SegmentatorItemProps, type SegmentatorMode, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemFunction, SelectItemGroup, type SelectItemGroupProps, type SelectItemLayout, SelectItemPeople, type SelectItemPeopleProps, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectSeparator, type SelectSeparatorProps, type SelectSize, SelectSubItem, SelectSubItemPeople, type SelectSubItemPeopleProps, type SelectSubItemProps, SelectSubMenu, type SelectSubMenuProps, SelectTrigger, type SelectTriggerProps, SelectValue, Slider, type SliderProps, type SliderSize, type SliderType, Stack, type StackProps, Steps, type StepsDirection, StepsIcon, type StepsIconProps, StepsItem, type StepsItemProps, type StepsProps, type StepsState, Switch, type SwitchProps, type SwitchSize, TOOLTIP_DELAY_DURATION, Table, TableCell, type TableCellContent, type TableCellProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tag, TagClose, type TagCloseProps, type TagContent, type TagLevel, type TagLineHeightFix, type TagProps, Textarea, type TextareaProps, type TextareaSize, ThemeProvider, type ThemeProviderProps, ThemeScript, TimePicker, TimePickerContent, type TimePickerContentProps, TimePickerField, type TimePickerFieldProps, TimePickerPanel, type TimePickerPanelProps, type TimePickerProps, type TimePickerSize, TimePickerTrigger, type TimePickerTriggerProps, type TimePickerValue, TimePickerWheels, type TimePickerWheelsValue, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, Typeface, type TypefaceContent, TypefacePair, type TypefacePairProps, type TypefaceProps, Typography, type TypographyContent, type TypographyLevel, type TypographyProps, type TypographyTone, Upload, type UploadProps, type UploadStyle, type UseColorPickerStateOptions, alertVariants, buttonVariants, cn, formatDisplayDate, formatMonthYear, formatTimeValue, initKeyboardFocus, inputRootVariants, loadingLevelForButtonSize, modalContentVariants, typographyVariants, useColorPickerState, useTheme, useThemeLayoutKey };
+export { Alert, type AlertAppearance, type AlertProps, type AlertSize, type AlertType, Anchor, type AnchorIndentLevel, AnchorItem, type AnchorItemProps, type AnchorProps, Avatar, type AvatarContent, type AvatarLevel, type AvatarProps, Badge, type BadgeLevel, type BadgeLineHeightFix, type BadgeProps, type BadgeStyle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbEllipsisItem, type BreadcrumbEllipsisItemProps, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, type BreadcrumbSize, Button, type ButtonMode, type ButtonProps, type ButtonSize, Card, CardBody, type CardBodyProps, CardBottom, type CardBottomProps, CardHead, type CardHeadProps, type CardProps, type CardSlotType, Cascader, CascaderColumn, type CascaderColumnProps, CascaderContent, type CascaderContentProps, CascaderField, type CascaderFieldProps, CascaderItem, type CascaderItemFunction, CascaderItemGroup, type CascaderItemGroupProps, type CascaderItemLayout, type CascaderItemProps, CascaderMenu, type CascaderMenuProps, type CascaderOption, CascaderOptionsMenu, type CascaderOptionsMenuProps, type CascaderProps, type CascaderSize, CascaderTrigger, type CascaderTriggerProps, Checkbox, CheckboxGroup, type CheckboxGroupDirection, type CheckboxGroupProps, CheckboxInput, type CheckboxInputProps, type CheckboxProps, type ColorFormat, ColorPickButton, type ColorPickButtonProps, ColorPicker, ColorPickerArea, type ColorPickerAreaProps, ColorPickerContent, type ColorPickerContentProps, ColorPickerInputs, type ColorPickerInputsProps, ColorPickerPanel, type ColorPickerPanelProps, ColorPickerPresets, type ColorPickerPresetsProps, type ColorPickerProps, ColorPickerSlider, type ColorPickerSliderProps, ColorPickerTrigger, type ColorPickerTriggerProps, DEFAULT_COLOR, DatePicker, DatePickerCalendar, type DatePickerCalendarProps, DatePickerContent, type DatePickerContentProps, DatePickerField, type DatePickerFieldProps, type DatePickerMode, type DatePickerPanel, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DatePickerSize, type DatePickerTimeValue, DatePickerTrigger, type DatePickerTriggerProps, type DateRange, Feedback, type FeedbackMode, type FeedbackProps, type FeedbackSize, type FeedbackType, Fieldset, FormField, type FormFieldProps, type HSVA, Input, InputGroup, InputGroupAddon, type InputGroupProps, type InputProps, type InputSize, Label, Link, type LinkLevel, type LinkMode, type LinkProps, List, ListDivider, type ListDividerProps, ListGroup, type ListGroupProps, ListItem, ListItemGroup, type ListItemGroupProps, type ListItemLeading, type ListItemProps, type ListItemType, type ListProps, ListSeparator, type ListSeparatorProps, ListTitle, type ListTitleProps, Loading, type LoadingButtonSize, type LoadingLevel, type LoadingMode, type LoadingProps, Modal, ModalBody, type ModalBodyProps, ModalClose, ModalContent, type ModalContentProps, ModalDescription, type ModalDescriptionProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, ModalHeaderText, type ModalHeaderTextProps, ModalOverlay, type ModalOverlayProps, ModalPortal, type ModalProps, type ModalSize, ModalTitle, type ModalTitleProps, ModalTrigger, Navigation, NavigationActions, type NavigationActionsProps, NavigationActionsSlot, type NavigationActionsSlotProps, type NavigationBackground, NavigationBrand, type NavigationBrandProps, NavigationBrandTitle, type NavigationBrandTitleProps, type NavigationDirection, NavigationGroup, type NavigationGroupProps, NavigationItem, NavigationItemGroup, type NavigationItemGroupProps, NavigationItemMenu, NavigationItemMenuContent, type NavigationItemMenuContentProps, NavigationItemMenuItem, type NavigationItemMenuItemProps, type NavigationItemMenuProps, NavigationItemMenuTrigger, type NavigationItemMenuTriggerProps, type NavigationItemProps, type NavigationItemType, type NavigationProps, NavigationSection, type NavigationSectionProps, Pagehead, type PageheadProps, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, type ProgressShape, type ProgressSize, type ProgressType, RadioGroup, type RadioGroupDirection, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RadioInput, type RadioInputProps, type RadioInputVariant, Scroll, type ScrollOrientation, ScrollPicker, ScrollPickerColumn, type ScrollPickerColumnProps, ScrollPickerItem, type ScrollPickerItemProps, type ScrollPickerProps, type ScrollProps, type ScrollSize, SegmentatorGroup, type SegmentatorGroupProps, SegmentatorItem, type SegmentatorItemProps, type SegmentatorMode, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemFunction, SelectItemGroup, type SelectItemGroupProps, type SelectItemLayout, SelectItemPeople, type SelectItemPeopleProps, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectSeparator, type SelectSeparatorProps, type SelectSize, SelectSubItem, SelectSubItemPeople, type SelectSubItemPeopleProps, type SelectSubItemProps, SelectSubMenu, type SelectSubMenuProps, SelectTrigger, type SelectTriggerProps, SelectValue, Slider, type SliderProps, type SliderSize, type SliderType, Stack, type StackProps, Steps, type StepsDirection, StepsIcon, type StepsIconProps, StepsItem, type StepsItemProps, type StepsProps, type StepsState, Switch, type SwitchProps, type SwitchSize, TOOLTIP_DELAY_DURATION, Table, TableCell, type TableCellContent, type TableCellProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tag, TagClose, type TagCloseProps, type TagContent, type TagLevel, type TagLineHeightFix, type TagProps, Textarea, type TextareaProps, type TextareaSize, ThemeProvider, type ThemeProviderProps, ThemeScript, TimePicker, TimePickerContent, type TimePickerContentProps, TimePickerField, type TimePickerFieldProps, TimePickerPanel, type TimePickerPanelProps, type TimePickerProps, type TimePickerSize, TimePickerTrigger, type TimePickerTriggerProps, type TimePickerValue, TimePickerWheels, type TimePickerWheelsValue, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, type TooltipProviderProps, TooltipTrigger, Typeface, type TypefaceContent, TypefacePair, type TypefacePairProps, type TypefaceProps, Typography, type TypographyContent, type TypographyLevel, type TypographyProps, type TypographyTone, Upload, type UploadProps, type UploadStyle, type UseColorPickerStateOptions, alertVariants, buttonVariants, cn, formatDisplayDate, formatMonthYear, formatTimeValue, initKeyboardFocus, inputRootVariants, loadingLevelForButtonSize, modalContentVariants, typographyVariants, useColorPickerState, useTheme, useThemeLayoutKey };

package/dist/index.js

@@ -6980,13 +6980,16 @@ var ListItem = forwardRef33(
 ListItem.displayName = "ListItem";
 
 // src/components/navigation.tsx
+import * as PopoverPrimitive7 from "@radix-ui/react-popover";
 import { Slot as Slot5 } from "@radix-ui/react-slot";
 import {
   createContext as createContext8,
   forwardRef as forwardRef34,
   useCallback as useCallback14,
   useContext as useContext8,
+  useEffect as useEffect9,
   useLayoutEffect as useLayoutEffect5,
+  useMemo as useMemo8,
   useRef as useRef10,
   useState as useState13
 } from "react";
@@ -7100,6 +7103,9 @@ function measureIndicatorFromElement(indicatorEl, groupEl) {
     visible: indicatorEl.dataset.visible === "true"
   };
 }
+function easeOutCubic(t) {
+  return 1 - Math.pow(1 - t, 3);
+}
 function metricsApproxEqual2(a, b, epsilon = 0.5) {
   return Math.abs(a.x - b.x) < epsilon && Math.abs(a.y - b.y) < epsilon && Math.abs(a.width - b.width) < epsilon && Math.abs(a.height - b.height) < epsilon && a.visible === b.visible;
 }
@@ -7185,73 +7191,63 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     isAnimatingRef.current = false;
     syncIndicator(metrics, true);
   }, [measureIndicator, syncIndicator]);
-  const startExpandCollapseTracking = useCallback14(
-    (expanded) => {
-      const group = groupRef.current;
-      const el = indicatorRef.current;
-      if (!group || !el) return;
-      cancelLayoutTracking();
-      animationRef.current?.cancel();
-      animationRef.current = null;
-      isAnimatingRef.current = false;
-      const prefersReducedMotion2 = typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-      if (prefersReducedMotion2) {
-        const metrics = measureIndicator();
-        if (metrics) syncIndicator(metrics, true);
-        return;
-      }
-      const { durationMs, easing } = getNavigationAnimationTiming(group);
-      const startMetrics = measureIndicatorFromElement(el, group);
-      if (!expanded) {
-        const next = measureIndicator();
-        if (!next?.visible) {
-          syncIndicator(next ?? startMetrics, true);
-          return;
-        }
-        const generation = ++animationGenerationRef.current;
-        isLayoutTrackingRef.current = true;
-        runIndicatorAnimation(
-          el,
-          group,
-          startMetrics,
-          next,
-          durationMs,
-          easing,
-          generation,
-          animationGenerationRef,
-          animationRef,
-          isAnimatingRef,
-          syncIndicator
-        );
-        window.setTimeout(() => {
-          if (!isLayoutTrackingRef.current) return;
-          isLayoutTrackingRef.current = false;
-          const final = measureIndicator();
-          if (final) syncIndicator(final, true);
-        }, durationMs);
+  const startExpandCollapseTracking = useCallback14(() => {
+    const group = groupRef.current;
+    const el = indicatorRef.current;
+    if (!group || !el) return;
+    cancelLayoutTracking();
+    animationRef.current?.cancel();
+    animationRef.current = null;
+    isAnimatingRef.current = false;
+    const prefersReducedMotion2 = typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+    if (prefersReducedMotion2) {
+      const metrics = measureIndicator();
+      if (metrics) syncIndicator(metrics, true);
+      return;
+    }
+    const { durationMs } = getNavigationAnimationTiming(group);
+    const startRect = el.getBoundingClientRect();
+    const startVisible = el.dataset.visible === "true";
+    const startTime = performance.now();
+    isLayoutTrackingRef.current = true;
+    const finish = () => {
+      layoutTrackingFrameRef.current = null;
+      isLayoutTrackingRef.current = false;
+      const final = measureIndicator();
+      if (final) syncIndicator(final, true);
+    };
+    const tick = (now) => {
+      if (!isLayoutTrackingRef.current) return;
+      const progress = Math.min(1, (now - startTime) / durationMs);
+      if (progress >= 1) {
+        finish();
         return;
       }
-      isLayoutTrackingRef.current = true;
-      applyIndicatorMetrics(el, startMetrics, true);
-      metricsRef.current = startMetrics;
-      const deadline = performance.now() + durationMs;
-      const tick = () => {
-        if (!isLayoutTrackingRef.current) return;
-        const metrics = measureIndicator();
-        if (metrics) syncIndicator(metrics, true);
-        if (performance.now() < deadline) {
-          layoutTrackingFrameRef.current = requestAnimationFrame(tick);
+      const target = measureIndicator();
+      if (target) {
+        if (!startVisible || !target.visible) {
+          syncIndicator(target, true);
         } else {
-          layoutTrackingFrameRef.current = null;
-          isLayoutTrackingRef.current = false;
-          const final = measureIndicator();
-          if (final) syncIndicator(final, true);
+          const eased = easeOutCubic(progress);
+          const groupRect = group.getBoundingClientRect();
+          const targetAbsX = groupRect.left + target.x;
+          const targetAbsY = groupRect.top + target.y;
+          syncIndicator(
+            {
+              x: startRect.left + (targetAbsX - startRect.left) * eased - groupRect.left,
+              y: startRect.top + (targetAbsY - startRect.top) * eased - groupRect.top,
+              width: startRect.width + (target.width - startRect.width) * eased,
+              height: startRect.height + (target.height - startRect.height) * eased,
+              visible: true
+            },
+            true
+          );
         }
-      };
+      }
       layoutTrackingFrameRef.current = requestAnimationFrame(tick);
-    },
-    [cancelLayoutTracking, groupRef, measureIndicator, syncIndicator]
-  );
+    };
+    layoutTrackingFrameRef.current = requestAnimationFrame(tick);
+  }, [cancelLayoutTracking, groupRef, measureIndicator, syncIndicator]);
   const onIndicatorRef = useCallback14((node) => {
     indicatorRef.current = node;
     if (node && metricsRef.current && isInitialMount.current) {
@@ -7311,14 +7307,11 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     const group = groupRef.current;
     if (!group) return;
     const observer = new MutationObserver((mutations) => {
-      let expandCollapseChange = null;
-      for (const mutation of mutations) {
-        if (mutation.type === "attributes" && mutation.attributeName === "data-expanded" && mutation.target instanceof HTMLElement) {
-          expandCollapseChange = mutation.target.getAttribute("data-expanded") === "true";
-        }
-      }
-      if (expandCollapseChange !== null) {
-        startExpandCollapseTracking(expandCollapseChange);
+      const expandCollapseChanged = mutations.some(
+        (mutation) => mutation.type === "attributes" && mutation.attributeName === "data-expanded" && mutation.target instanceof HTMLElement
+      );
+      if (expandCollapseChanged) {
+        startExpandCollapseTracking();
       }
       setActiveRevision((revision) => revision + 1);
     });
@@ -7338,7 +7331,9 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
       resizeObserver.observe(inner);
     });
     const onTransitionEnd = (event) => {
-      if (event.propertyName !== "grid-template-rows") return;
+      if (event.propertyName !== "grid-template-rows" && event.propertyName !== "width") {
+        return;
+      }
       if (!(event.target instanceof HTMLElement)) return;
       if (!event.target.classList.contains("aviala-navigation-item-group")) {
         return;
@@ -7569,6 +7564,225 @@ var NavigationActionsSlot = forwardRef34(({ className, ...props }, ref) => /* @_
   }
 ));
 NavigationActionsSlot.displayName = "NavigationActionsSlot";
+var NAVIGATION_MENU_CLOSE_DELAY_MS = 150;
+var NavigationItemMenuContext = createContext8(null);
+function useNavigationItemMenuContext(component) {
+  const context = useContext8(NavigationItemMenuContext);
+  if (!context) {
+    throw new Error(`${component} must be used within <NavigationItemMenu>`);
+  }
+  return context;
+}
+function NavigationItemMenu({
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  open: openProp,
+  onOpenChange,
+  children
+}) {
+  const [internalValue, setInternalValue] = useState13(defaultValue);
+  const isValueControlled = valueProp !== void 0;
+  const value = isValueControlled ? valueProp : internalValue;
+  const [internalOpen, setInternalOpen] = useState13(false);
+  const isOpenControlled = openProp !== void 0;
+  const open = isOpenControlled ? openProp : internalOpen;
+  const closeTimerRef = useRef10(null);
+  const openedByHoverRef = useRef10(false);
+  const setOpen = useCallback14(
+    (nextOpen) => {
+      if (!isOpenControlled) setInternalOpen(nextOpen);
+      onOpenChange?.(nextOpen);
+    },
+    [isOpenControlled, onOpenChange]
+  );
+  const cancelClose = useCallback14(() => {
+    if (closeTimerRef.current != null) {
+      window.clearTimeout(closeTimerRef.current);
+      closeTimerRef.current = null;
+    }
+  }, []);
+  const openMenu = useCallback14(
+    (viaHover) => {
+      cancelClose();
+      openedByHoverRef.current = viaHover;
+      setOpen(true);
+    },
+    [cancelClose, setOpen]
+  );
+  const scheduleClose = useCallback14(() => {
+    cancelClose();
+    closeTimerRef.current = window.setTimeout(() => {
+      closeTimerRef.current = null;
+      setOpen(false);
+    }, NAVIGATION_MENU_CLOSE_DELAY_MS);
+  }, [cancelClose, setOpen]);
+  const select = useCallback14(
+    (nextValue) => {
+      if (!isValueControlled) setInternalValue(nextValue);
+      onValueChange?.(nextValue);
+      cancelClose();
+      setOpen(false);
+    },
+    [cancelClose, isValueControlled, onValueChange, setOpen]
+  );
+  useEffect9(() => cancelClose, [cancelClose]);
+  const contextValue = useMemo8(
+    () => ({
+      value,
+      hasSelection: value != null && value !== "",
+      select,
+      openMenu,
+      scheduleClose,
+      cancelClose,
+      openedByHoverRef
+    }),
+    [cancelClose, openMenu, scheduleClose, select, value]
+  );
+  const handleOpenChange = useCallback14(
+    (nextOpen) => {
+      if (nextOpen) openedByHoverRef.current = false;
+      cancelClose();
+      setOpen(nextOpen);
+    },
+    [cancelClose, setOpen]
+  );
+  return /* @__PURE__ */ jsx45(NavigationItemMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx45(Popover, { open, onOpenChange: handleOpenChange, children }) });
+}
+var NavigationItemMenuTrigger = forwardRef34(
+  ({
+    className,
+    active,
+    leftIcon,
+    rightIcon,
+    children,
+    ...props
+  }, ref) => {
+    const menu = useNavigationItemMenuContext("NavigationItemMenuTrigger");
+    const isActive = active ?? menu.hasSelection;
+    const mode = navigationItemButtonMode(isActive);
+    return /* @__PURE__ */ jsx45(
+      "span",
+      {
+        className: cn("aviala-navigation-item", className),
+        "data-item-type": "default",
+        "data-active": isActive ? "true" : "false",
+        onMouseEnter: () => menu.openMenu(true),
+        onMouseLeave: menu.scheduleClose,
+        children: /* @__PURE__ */ jsx45(PopoverPrimitive7.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs35(
+          "button",
+          {
+            ref,
+            type: "button",
+            className: cn(
+              buttonVariants({ mode }),
+              "aviala-navigation-item__control whitespace-normal"
+            ),
+            "data-size": "regular",
+            ...props,
+            children: [
+              renderItemIcon3(leftIcon),
+              /* @__PURE__ */ jsx45(
+                Typography,
+                {
+                  level: "text",
+                  as: "span",
+                  className: "aviala-navigation-item__label",
+                  children
+                }
+              ),
+              rightIcon ? /* @__PURE__ */ jsx45("span", { className: "aviala-navigation-item__chevron", children: renderItemIcon3(rightIcon) }) : null
+            ]
+          }
+        ) })
+      }
+    );
+  }
+);
+NavigationItemMenuTrigger.displayName = "NavigationItemMenuTrigger";
+var NavigationItemMenuContent = forwardRef34(
+  ({
+    className,
+    side,
+    align = "start",
+    sideOffset = 6,
+    collisionPadding = 8,
+    onOpenAutoFocus,
+    ...props
+  }, ref) => {
+    const direction = useNavigationDirection();
+    const menu = useNavigationItemMenuContext("NavigationItemMenuContent");
+    return /* @__PURE__ */ jsx45(PopoverPrimitive7.Portal, { children: /* @__PURE__ */ jsx45(
+      PopoverPrimitive7.Content,
+      {
+        ref,
+        side: side ?? (direction === "vertical" ? "right" : "bottom"),
+        align,
+        sideOffset,
+        collisionPadding,
+        className: cn("aviala-navigation-menu", className),
+        onMouseEnter: menu.cancelClose,
+        onMouseLeave: menu.scheduleClose,
+        onOpenAutoFocus: (event) => {
+          if (menu.openedByHoverRef.current) event.preventDefault();
+          onOpenAutoFocus?.(event);
+        },
+        ...props
+      }
+    ) });
+  }
+);
+NavigationItemMenuContent.displayName = "NavigationItemMenuContent";
+var NavigationItemMenuItem = forwardRef34(
+  ({
+    className,
+    value,
+    selected,
+    leftIcon,
+    rightIcon,
+    disabled,
+    onClick,
+    children,
+    ...props
+  }, ref) => {
+    const menu = useNavigationItemMenuContext("NavigationItemMenuItem");
+    const isSelected = selected ?? menu.value === value;
+    return /* @__PURE__ */ jsxs35(
+      "button",
+      {
+        ref,
+        type: "button",
+        disabled,
+        className: cn(
+          "aviala-navigation-menu-item aviala-focus-ring",
+          className
+        ),
+        "data-selected": isSelected ? "true" : "false",
+        "data-disabled": disabled ? "" : void 0,
+        "aria-current": isSelected ? "true" : void 0,
+        onClick: (event) => {
+          onClick?.(event);
+          if (!event.defaultPrevented) menu.select(value);
+        },
+        ...props,
+        children: [
+          renderItemIcon3(leftIcon),
+          /* @__PURE__ */ jsx45(
+            Typography,
+            {
+              level: "text",
+              as: "span",
+              className: "aviala-navigation-menu-item__label",
+              children
+            }
+          ),
+          rightIcon ? /* @__PURE__ */ jsx45("span", { className: "aviala-navigation-menu-item__trailing", children: renderItemIcon3(rightIcon) }) : null
+        ]
+      }
+    );
+  }
+);
+NavigationItemMenuItem.displayName = "NavigationItemMenuItem";
 
 // src/components/slider.tsx
 import * as SliderPrimitive from "@radix-ui/react-slider";
@@ -7759,10 +7973,10 @@ Upload.displayName = "Upload";
 // src/components/scroll-picker.tsx
 import {
   useCallback as useCallback15,
-  useEffect as useEffect9,
+  useEffect as useEffect10,
   useId as useId3,
   useLayoutEffect as useLayoutEffect6,
-  useMemo as useMemo8,
+  useMemo as useMemo9,
   useRef as useRef12
 } from "react";
 import { jsx as jsx48, jsxs as jsxs38 } from "react/jsx-runtime";
@@ -7809,7 +8023,7 @@ function ScrollPickerColumn({
     },
     [values]
   );
-  const repeatedValues = useMemo8(() => {
+  const repeatedValues = useMemo9(() => {
     if (!loop) return [...values];
     return Array.from({ length: LOOP_SECTIONS2 }, () => values).flat();
   }, [loop, values]);
@@ -7876,7 +8090,7 @@ function ScrollPickerColumn({
     if (currentValueIndex === valueIndex && inMiddleSection) return;
     scrollToIndex(targetIndex, "auto");
   }, [getIndex, loop, scrollToIndex, value, values.length]);
-  useEffect9(() => {
+  useEffect10(() => {
     const container = scrollRef.current;
     if (!container) return;
     const onScrollEnd = () => {
@@ -8876,6 +9090,10 @@ export {
   NavigationGroup,
   NavigationItem,
   NavigationItemGroup,
+  NavigationItemMenu,
+  NavigationItemMenuContent,
+  NavigationItemMenuItem,
+  NavigationItemMenuTrigger,
   NavigationSection,
   PALETTE_HUE_FAMILIES,
   Pagehead,