@moderneinc/neo-styled-components 2.7.0-next.96fb64 → 2.7.0-next.a498e7

package/dist/Avatar/Avatar.d.ts

@@ -16,7 +16,7 @@ export interface NeoAvatarProps extends Omit<AvatarProps, 'variant'> {
 /**
  * NeoAvatar - User avatar component based on MUI Avatar
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4214-58134
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=9600-185
  *
  * Figma Props Mapping:
  * - Figma Type "Initials" → variant="initials", size="small" (20px)

package/dist/DataGridFilterPanel/DataGridFilterPanel.d.ts

@@ -1,6 +1,6 @@
 import { GridFilterPanel as MuiGridFilterPanel } from '@mui/x-data-grid';
 import type React from 'react';
-import { NeoSelect } from '../Select/Select';
+import { NeoDropdown } from '../Dropdown/Dropdown';
 export type { GridFilterItem as FilterItem, GridFilterOperator as FilterOperator, } from '@mui/x-data-grid';
 /**
  * Icon components for DataGrid filter panel slots
@@ -50,7 +50,7 @@ export declare const NeoDataGridFilterPanelRemoveAllIcon: {
  * />
  * ```
  */
-export { NeoSelect as NeoDataGridSelect };
+export { NeoDropdown as NeoDataGridSelect };
 export declare const NeoDataGridFilterPanel: {
     (props: React.ComponentProps<typeof MuiGridFilterPanel>): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/dist/Divider/Divider.d.ts

@@ -7,16 +7,16 @@ export interface NeoDividerProps extends DividerProps {
  * Generic divider component that can be used in menus, lists, cards, or any layout
  * that needs visual separation between content sections.
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4633-39807
  *
  * @example
  * ```tsx
  * // In a menu
- * <NeoMenu>
- *   <NeoMenuItem>Settings</NeoMenuItem>
+ * <NeoDropdownMenu>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
  *   <NeoDivider />
- *   <NeoMenuItem>Sign out</NeoMenuItem>
- * </NeoMenu>
+ *   <NeoDropdownMenuItem>Sign out</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
  *
  * // In a card
  * <Card>

package/dist/Dropdown/Dropdown.d.ts

@@ -0,0 +1,24 @@
+import { type SelectProps as MuiSelectProps } from '@mui/material/Select';
+import { NeoDropdownMenuItem } from '../DropdownMenuItem/DropdownMenuItem';
+export type NeoDropdownProps = MuiSelectProps;
+/**
+ * NeoDropdown - Dropdown select component with Neo design system styling
+ *
+ * A styled version of MUI's Select that uses Neo design tokens, Lucide ChevronDown icon,
+ * and NeoDropdownMenu/NeoDropdownMenuItem for the dropdown list.
+ *
+ * @example
+ * ```tsx
+ * import { NeoDropdown, NeoDropdownOption } from '@moderneinc/neo-styled-components'
+ *
+ * <NeoDropdown value={value} onChange={handleChange}>
+ *   <NeoDropdownOption value="option1">Option 1</NeoDropdownOption>
+ *   <NeoDropdownOption value="option2">Option 2</NeoDropdownOption>
+ * </NeoDropdown>
+ * ```
+ */
+export declare const NeoDropdown: {
+    (props: NeoDropdownProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { NeoDropdownMenuItem as NeoDropdownOption };

package/dist/DropdownMenu/DropdownMenu.d.ts

@@ -0,0 +1,32 @@
+import { type MenuProps } from '@mui/material/Menu';
+export interface NeoDropdownMenuProps extends MenuProps {
+    /**
+     * Menu content (typically NeoDropdownMenuItem components)
+     */
+    children?: React.ReactNode;
+}
+/**
+ * NeoDropdownMenu - Dropdown menu component based on MUI Menu
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=11141-4980
+ *
+ * @example
+ * ```tsx
+ * const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
+ * const open = Boolean(anchorEl);
+ *
+ * <Button onClick={(e) => setAnchorEl(e.currentTarget)}>Open Menu</Button>
+ * <NeoDropdownMenu
+ *   open={open}
+ *   anchorEl={anchorEl}
+ *   onClose={() => setAnchorEl(null)}
+ * >
+ *   <NeoDropdownMenuItem icon={<Icon />} shortcut="⌘+P">View profile</NeoDropdownMenuItem>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
+ * ```
+ */
+export declare const NeoDropdownMenu: {
+    ({ children, ...props }: NeoDropdownMenuProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/DropdownMenuItem/DropdownMenuItem.d.ts

@@ -0,0 +1,50 @@
+import { type MenuItemProps } from '@mui/material/MenuItem';
+import type { ReactNode } from 'react';
+export interface NeoDropdownMenuItemProps extends MenuItemProps {
+    /**
+     * Optional icon to display on the left side
+     * Note: Cannot be directly mapped from Figma (ReactNode)
+     */
+    icon?: ReactNode;
+    /**
+     * Optional keyboard shortcut to display on the right side
+     * @example "⌘+P" or "Ctrl+K"
+     * Note: Cannot be directly mapped from Figma (ReactNode/string)
+     */
+    shortcut?: string;
+    /**
+     * Optional secondary text to display next to the primary label
+     * @example "@username" or supporting text
+     * Note: Cannot be directly mapped from Figma (ReactNode/string)
+     */
+    secondaryText?: string;
+    /**
+     * Menu item content (text label)
+     * @figma children mapped from Figma layer content
+     */
+    children?: ReactNode;
+}
+/**
+ * NeoDropdownMenuItem - Dropdown menu item component based on MUI MenuItem
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8584
+ *
+ * @example
+ * ```tsx
+ * // With icon and shortcut
+ * <NeoDropdownMenuItem icon={<UserIcon />} shortcut="⌘+P">
+ *   View profile
+ * </NeoDropdownMenuItem>
+ *
+ * // With secondary text (user list pattern from Figma node 4305:41844)
+ * <NeoDropdownMenuItem secondaryText="@phoenix">Phoenix Baker</NeoDropdownMenuItem>
+ * <NeoDropdownMenuItem secondaryText="@olivia">Olivia Rhye</NeoDropdownMenuItem>
+ *
+ * // Disabled state
+ * <NeoDropdownMenuItem disabled>Disabled item</NeoDropdownMenuItem>
+ * ```
+ */
+export declare const NeoDropdownMenuItem: {
+    ({ icon, shortcut, secondaryText, children, ...props }: NeoDropdownMenuItemProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/index.d.ts

@@ -305,7 +305,7 @@ interface NeoAvatarProps extends Omit<AvatarProps, 'variant'> {
 /**
  * NeoAvatar - User avatar component based on MUI Avatar
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4214-58134
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=9600-185
  *
  * Figma Props Mapping:
  * - Figma Type "Initials" → variant="initials", size="small" (20px)
@@ -1102,7 +1102,7 @@ declare namespace NeoDataGridFiltersButton {
     var displayName: string;
 }
 
-interface NeoMenuItemProps extends MenuItemProps {
+interface NeoDropdownMenuItemProps extends MenuItemProps {
     /**
      * Optional icon to display on the left side
      * Note: Cannot be directly mapped from Figma (ReactNode)
@@ -1127,60 +1127,49 @@ interface NeoMenuItemProps extends MenuItemProps {
     children?: ReactNode;
 }
 /**
- * NeoMenuItem - Menu item component based on MUI MenuItem
+ * NeoDropdownMenuItem - Dropdown menu item component based on MUI MenuItem
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
- *
- * Figma Props Mapping:
- * - Figma "Dropdown - Menu" component uses Type (Avatar|Button|Icon) and Open (True|False)
- *   to control the menu trigger. NeoMenuItem is the individual item inside the menu.
- * - Text label → children prop (mapped via figma.children)
- * - selected → selected prop (React-controlled)
- * - disabled → disabled prop (React-controlled)
- * - Hover state → CSS :hover (not mapped)
- * - Icon slot → icon prop (not mappable - ReactNode)
- * - Secondary text → secondaryText prop (not mappable - ReactNode/string)
- * - Keyboard shortcut → shortcut prop (not mappable - ReactNode/string)
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8584
  *
  * @example
  * ```tsx
  * // With icon and shortcut
- * <NeoMenuItem icon={<UserIcon />} shortcut="⌘+P">
+ * <NeoDropdownMenuItem icon={<UserIcon />} shortcut="⌘+P">
  *   View profile
- * </NeoMenuItem>
+ * </NeoDropdownMenuItem>
  *
  * // With secondary text (user list pattern from Figma node 4305:41844)
- * <NeoMenuItem secondaryText="@phoenix">Phoenix Baker</NeoMenuItem>
- * <NeoMenuItem secondaryText="@olivia">Olivia Rhye</NeoMenuItem>
+ * <NeoDropdownMenuItem secondaryText="@phoenix">Phoenix Baker</NeoDropdownMenuItem>
+ * <NeoDropdownMenuItem secondaryText="@olivia">Olivia Rhye</NeoDropdownMenuItem>
  *
  * // Disabled state
- * <NeoMenuItem disabled>Disabled item</NeoMenuItem>
+ * <NeoDropdownMenuItem disabled>Disabled item</NeoDropdownMenuItem>
  * ```
  */
-declare const NeoMenuItem: {
-    ({ icon, shortcut, secondaryText, children, ...props }: NeoMenuItemProps): react_jsx_runtime.JSX.Element;
+declare const NeoDropdownMenuItem: {
+    ({ icon, shortcut, secondaryText, children, ...props }: NeoDropdownMenuItemProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 
-type NeoSelectProps = SelectProps;
+type NeoDropdownProps = SelectProps;
 /**
- * NeoSelect - Select dropdown component with Neo design system styling
+ * NeoDropdown - Dropdown select component with Neo design system styling
  *
  * A styled version of MUI's Select that uses Neo design tokens, Lucide ChevronDown icon,
- * and NeoMenu/NeoMenuItem for the dropdown list.
+ * and NeoDropdownMenu/NeoDropdownMenuItem for the dropdown list.
  *
  * @example
  * ```tsx
- * import { NeoSelect, NeoSelectOption } from '@moderneinc/neo-styled-components'
+ * import { NeoDropdown, NeoDropdownOption } from '@moderneinc/neo-styled-components'
  *
- * <NeoSelect value={value} onChange={handleChange}>
- *   <NeoSelectOption value="option1">Option 1</NeoSelectOption>
- *   <NeoSelectOption value="option2">Option 2</NeoSelectOption>
- * </NeoSelect>
+ * <NeoDropdown value={value} onChange={handleChange}>
+ *   <NeoDropdownOption value="option1">Option 1</NeoDropdownOption>
+ *   <NeoDropdownOption value="option2">Option 2</NeoDropdownOption>
+ * </NeoDropdown>
  * ```
  */
-declare const NeoSelect: {
-    (props: NeoSelectProps): react_jsx_runtime.JSX.Element;
+declare const NeoDropdown: {
+    (props: NeoDropdownProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 
@@ -1276,16 +1265,16 @@ interface NeoDividerProps extends DividerProps {
  * Generic divider component that can be used in menus, lists, cards, or any layout
  * that needs visual separation between content sections.
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4633-39807
  *
  * @example
  * ```tsx
  * // In a menu
- * <NeoMenu>
- *   <NeoMenuItem>Settings</NeoMenuItem>
+ * <NeoDropdownMenu>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
  *   <NeoDivider />
- *   <NeoMenuItem>Sign out</NeoMenuItem>
- * </NeoMenu>
+ *   <NeoDropdownMenuItem>Sign out</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
  *
  * // In a card
  * <Card>
@@ -1551,48 +1540,35 @@ declare const NeoLoadingSpinner: {
     displayName: string;
 };
 
-interface NeoMenuProps extends MenuProps {
+interface NeoDropdownMenuProps extends MenuProps {
     /**
-     * Menu content (typically NeoMenuItem components)
+     * Menu content (typically NeoDropdownMenuItem components)
      */
     children?: React.ReactNode;
 }
 /**
- * NeoMenu - Dropdown menu component based on MUI Menu
+ * NeoDropdownMenu - Dropdown menu component based on MUI Menu
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4305-41844 (Dropdown list pattern)
- *
- * Figma Props Mapping:
- * - Container shown in Figma is the Menu Paper component
- * - Menu items are styled separately via NeoMenuItem
- * - Any trigger component (Button, IconButton, etc.) can open the menu
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=11141-4980
  *
  * @example
  * ```tsx
  * const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
  * const open = Boolean(anchorEl);
  *
- * // Standard menu with icons and shortcuts
  * <Button onClick={(e) => setAnchorEl(e.currentTarget)}>Open Menu</Button>
- * <NeoMenu
+ * <NeoDropdownMenu
  *   open={open}
  *   anchorEl={anchorEl}
  *   onClose={() => setAnchorEl(null)}
  * >
- *   <NeoMenuItem icon={<Icon />} shortcut="⌘+P">View profile</NeoMenuItem>
- *   <NeoMenuItem>Settings</NeoMenuItem>
- * </NeoMenu>
- *
- * // Dropdown list with secondary text (user list pattern)
- * <NeoMenu open={open} anchorEl={anchorEl} onClose={() => setAnchorEl(null)}>
- *   <NeoMenuItem secondaryText="@phoenix">Phoenix Baker</NeoMenuItem>
- *   <NeoMenuItem secondaryText="@olivia" selected>Olivia Rhye</NeoMenuItem>
- * </NeoMenu>
+ *   <NeoDropdownMenuItem icon={<Icon />} shortcut="⌘+P">View profile</NeoDropdownMenuItem>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
  * ```
  */
-declare const NeoMenu: {
-    ({ children, ...props }: NeoMenuProps): react_jsx_runtime.JSX.Element;
+declare const NeoDropdownMenu: {
+    ({ children, ...props }: NeoDropdownMenuProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 
@@ -2976,5 +2952,5 @@ declare module '@mui/x-data-grid-pro' {
 
 declare const version: string
 
-export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonTab, NeoButtonTabGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoSelect as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoStatusBanner, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, getDataGridHeaderStyles, version };
-export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAvatarProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonProps, NeoButtonTabGroupProps, NeoButtonTabProps, NeoCheckboxProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoFilterChipProps, NeoFooterProps, NeoGeneralAvatarProps, NeoIconButtonProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoMarketplaceCardProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationAvatarProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusBannerProps, NeoTabProps, NeoTagProps, NeoToastProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };
+export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonTab, NeoButtonTabGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoDropdown as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoDropdown, NeoDropdownMenu, NeoDropdownMenuItem, NeoDropdownMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoDropdownMenu as NeoMenu, NeoDropdownMenuItem as NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoDropdown as NeoSelect, NeoDropdownMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoStatusBanner, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, getDataGridHeaderStyles, version };
+export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAvatarProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonProps, NeoButtonTabGroupProps, NeoButtonTabProps, NeoCheckboxProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoDropdownMenuItemProps, NeoDropdownMenuProps, NeoDropdownProps, NeoFilterChipProps, NeoFooterProps, NeoGeneralAvatarProps, NeoIconButtonProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoMarketplaceCardProps, NeoDropdownMenuItemProps as NeoMenuItemProps, NeoDropdownMenuProps as NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationAvatarProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoDropdownProps as NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusBannerProps, NeoTabProps, NeoTagProps, NeoToastProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };

package/dist/index.esm.js

@@ -36,6 +36,9 @@ import { PickersShortcuts } from '@mui/x-date-pickers/PickersShortcuts';
 import { DateRangePicker } from '@mui/x-date-pickers-pro/DateRangePicker';
 import { dateRangePickerDayClasses } from '@mui/x-date-pickers-pro/DateRangePickerDay';
 import Badge, { badgeClasses } from '@mui/material/Badge';
+import { listClasses } from '@mui/material/List';
+import Menu from '@mui/material/Menu';
+import { paperClasses } from '@mui/material/Paper';
 import FormControl from '@mui/material/FormControl';
 import FormHelperText, { formHelperTextClasses } from '@mui/material/FormHelperText';
 import ListItemButton, { listItemButtonClasses } from '@mui/material/ListItemButton';
@@ -43,9 +46,6 @@ import ListItemIcon, { listItemIconClasses } from '@mui/material/ListItemIcon';
 import ListItemText, { listItemTextClasses } from '@mui/material/ListItemText';
 import Typography from '@mui/material/Typography';
 import MuiCard from '@mui/material/Card';
-import { listClasses } from '@mui/material/List';
-import Menu from '@mui/material/Menu';
-import { paperClasses } from '@mui/material/Paper';
 import Dialog, { dialogClasses } from '@mui/material/Dialog';
 import DialogActions, { dialogActionsClasses } from '@mui/material/DialogActions';
 import DialogContent, { dialogContentClasses } from '@mui/material/DialogContent';
@@ -145,7 +145,7 @@ const AvatarContainer = styled(Box)(({ size = 'medium' }) => ({
 /**
  * NeoAvatar - User avatar component based on MUI Avatar
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4214-58134
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=9600-185
  *
  * Figma Props Mapping:
  * - Figma Type "Initials" → variant="initials", size="small" (20px)
@@ -2047,43 +2047,32 @@ const Shortcut = styled('span')(({ theme }) => ({
     backgroundColor: semanticColors.surfaces.white,
 }));
 /**
- * NeoMenuItem - Menu item component based on MUI MenuItem
- *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
+ * NeoDropdownMenuItem - Dropdown menu item component based on MUI MenuItem
  *
- * Figma Props Mapping:
- * - Figma "Dropdown - Menu" component uses Type (Avatar|Button|Icon) and Open (True|False)
- *   to control the menu trigger. NeoMenuItem is the individual item inside the menu.
- * - Text label → children prop (mapped via figma.children)
- * - selected → selected prop (React-controlled)
- * - disabled → disabled prop (React-controlled)
- * - Hover state → CSS :hover (not mapped)
- * - Icon slot → icon prop (not mappable - ReactNode)
- * - Secondary text → secondaryText prop (not mappable - ReactNode/string)
- * - Keyboard shortcut → shortcut prop (not mappable - ReactNode/string)
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8584
  *
  * @example
  * ```tsx
  * // With icon and shortcut
- * <NeoMenuItem icon={<UserIcon />} shortcut="⌘+P">
+ * <NeoDropdownMenuItem icon={<UserIcon />} shortcut="⌘+P">
  *   View profile
- * </NeoMenuItem>
+ * </NeoDropdownMenuItem>
  *
  * // With secondary text (user list pattern from Figma node 4305:41844)
- * <NeoMenuItem secondaryText="@phoenix">Phoenix Baker</NeoMenuItem>
- * <NeoMenuItem secondaryText="@olivia">Olivia Rhye</NeoMenuItem>
+ * <NeoDropdownMenuItem secondaryText="@phoenix">Phoenix Baker</NeoDropdownMenuItem>
+ * <NeoDropdownMenuItem secondaryText="@olivia">Olivia Rhye</NeoDropdownMenuItem>
  *
  * // Disabled state
- * <NeoMenuItem disabled>Disabled item</NeoMenuItem>
+ * <NeoDropdownMenuItem disabled>Disabled item</NeoDropdownMenuItem>
  * ```
  */
-const NeoMenuItem = ({ icon, shortcut, secondaryText, children, ...props }) => {
+const NeoDropdownMenuItem = ({ icon, shortcut, secondaryText, children, ...props }) => {
     return (jsx(StyledMenuItem, { ...props, children: jsxs(MenuItemContent, { children: [icon && jsx(IconWrapper$1, { children: icon }), jsxs(LabelContainer$3, { children: [jsx(Label$3, { children: children }), secondaryText && jsx(SecondaryLabel, { children: secondaryText })] }), shortcut && jsx(Shortcut, { children: shortcut })] }) }));
 };
-NeoMenuItem.displayName = 'NeoMenuItem';
+NeoDropdownMenuItem.displayName = 'NeoDropdownMenuItem';
 
 /**
- * Custom chevron icon for select dropdown
+ * Custom chevron icon for dropdown
  * Must accept props from MUI Select to work correctly
  */
 const ChevronDownIcon = (props) => (jsx(ChevronDown, { ...props, size: spacing.spacing_2_1_2, color: semanticColors.typography.input.default, style: { ...props.style } }));
@@ -2123,25 +2112,24 @@ const StyledSelect = styled(MuiSelect)({
     },
 });
 /**
- * NeoSelect - Select dropdown component with Neo design system styling
+ * NeoDropdown - Dropdown select component with Neo design system styling
  *
  * A styled version of MUI's Select that uses Neo design tokens, Lucide ChevronDown icon,
- * and NeoMenu/NeoMenuItem for the dropdown list.
+ * and NeoDropdownMenu/NeoDropdownMenuItem for the dropdown list.
  *
  * @example
  * ```tsx
- * import { NeoSelect, NeoSelectOption } from '@moderneinc/neo-styled-components'
+ * import { NeoDropdown, NeoDropdownOption } from '@moderneinc/neo-styled-components'
  *
- * <NeoSelect value={value} onChange={handleChange}>
- *   <NeoSelectOption value="option1">Option 1</NeoSelectOption>
- *   <NeoSelectOption value="option2">Option 2</NeoSelectOption>
- * </NeoSelect>
+ * <NeoDropdown value={value} onChange={handleChange}>
+ *   <NeoDropdownOption value="option1">Option 1</NeoDropdownOption>
+ *   <NeoDropdownOption value="option2">Option 2</NeoDropdownOption>
+ * </NeoDropdown>
  * ```
  */
-const NeoSelect = (props) => {
+const NeoDropdown = (props) => {
     return (jsx(StyledSelect, { ...props, IconComponent: ChevronDownIcon, variant: "standard", MenuProps: {
             ...props.MenuProps,
-            // Apply NeoMenu styling to the dropdown
             PaperProps: {
                 sx: {
                     backgroundColor: semanticColors.surfaces.white,
@@ -2154,7 +2142,7 @@ const NeoSelect = (props) => {
             },
         } }));
 };
-NeoSelect.displayName = 'NeoSelect';
+NeoDropdown.displayName = 'NeoDropdown';
 
 /**
  * Icon components for DataGrid filter panel slots
@@ -3570,16 +3558,16 @@ const StyledDivider = styled(Divider)(({ theme }) => ({
  * Generic divider component that can be used in menus, lists, cards, or any layout
  * that needs visual separation between content sections.
  *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4633-39807
  *
  * @example
  * ```tsx
  * // In a menu
- * <NeoMenu>
- *   <NeoMenuItem>Settings</NeoMenuItem>
+ * <NeoDropdownMenu>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
  *   <NeoDivider />
- *   <NeoMenuItem>Sign out</NeoMenuItem>
- * </NeoMenu>
+ *   <NeoDropdownMenuItem>Sign out</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
  *
  * // In a card
  * <Card>
@@ -3650,6 +3638,47 @@ const NeoDot = ({ size = 'medium', variant = 'solid', color = 'neutral', ...prop
 };
 NeoDot.displayName = 'NeoDot';
 
+const StyledMenu = styled(Menu)(({ theme }) => ({
+    [`& .${paperClasses.root}`]: {
+        backgroundColor: semanticColors.surfaces.white,
+        borderRadius: borderRadius.s,
+        border: `1px solid ${semanticColors.border.primary}`,
+        boxShadow: `${shadows.dropdown.x}px ${shadows.dropdown.y}px ${shadows.dropdown.blur}px ${shadows.dropdown.spread}px ${shadows.dropdown.shadow}`,
+        minWidth: 200,
+        marginTop: theme.spacing(1),
+        paddingTop: theme.spacing(1),
+        paddingBottom: theme.spacing(1),
+    },
+    [`& .${listClasses.root}`]: {
+        padding: 0,
+    },
+}));
+/**
+ * NeoDropdownMenu - Dropdown menu component based on MUI Menu
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=11141-4980
+ *
+ * @example
+ * ```tsx
+ * const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
+ * const open = Boolean(anchorEl);
+ *
+ * <Button onClick={(e) => setAnchorEl(e.currentTarget)}>Open Menu</Button>
+ * <NeoDropdownMenu
+ *   open={open}
+ *   anchorEl={anchorEl}
+ *   onClose={() => setAnchorEl(null)}
+ * >
+ *   <NeoDropdownMenuItem icon={<Icon />} shortcut="⌘+P">View profile</NeoDropdownMenuItem>
+ *   <NeoDropdownMenuItem>Settings</NeoDropdownMenuItem>
+ * </NeoDropdownMenu>
+ * ```
+ */
+const NeoDropdownMenu = ({ children, ...props }) => {
+    return jsx(StyledMenu, { ...props, children: children });
+};
+NeoDropdownMenu.displayName = 'NeoDropdownMenu';
+
 const filterChipOnlyProps = ['selected', 'expanded', 'selectedLabel', 'count', 'onClear'];
 const StyledChip = styled(Chip, {
     shouldForwardProp: prop => !filterChipOnlyProps.includes(prop),
@@ -4971,60 +5000,6 @@ const NeoMarketplaceLargeCard = ({ state = 'default', cardTheme = 'light', showI
 };
 NeoMarketplaceLargeCard.displayName = 'NeoMarketplaceLargeCard';
 
-const StyledMenu = styled(Menu)(({ theme }) => ({
-    [`& .${paperClasses.root}`]: {
-        backgroundColor: semanticColors.surfaces.white,
-        borderRadius: borderRadius.s,
-        border: `1px solid ${semanticColors.border.primary}`,
-        boxShadow: `${shadows.dropdown.x}px ${shadows.dropdown.y}px ${shadows.dropdown.blur}px ${shadows.dropdown.spread}px ${shadows.dropdown.shadow}`,
-        minWidth: 200,
-        marginTop: theme.spacing(1),
-        paddingTop: theme.spacing(1),
-        paddingBottom: theme.spacing(1),
-    },
-    [`& .${listClasses.root}`]: {
-        padding: 0,
-    },
-}));
-/**
- * NeoMenu - Dropdown menu component based on MUI Menu
- *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4305-41844 (Dropdown list pattern)
- *
- * Figma Props Mapping:
- * - Container shown in Figma is the Menu Paper component
- * - Menu items are styled separately via NeoMenuItem
- * - Any trigger component (Button, IconButton, etc.) can open the menu
- *
- * @example
- * ```tsx
- * const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
- * const open = Boolean(anchorEl);
- *
- * // Standard menu with icons and shortcuts
- * <Button onClick={(e) => setAnchorEl(e.currentTarget)}>Open Menu</Button>
- * <NeoMenu
- *   open={open}
- *   anchorEl={anchorEl}
- *   onClose={() => setAnchorEl(null)}
- * >
- *   <NeoMenuItem icon={<Icon />} shortcut="⌘+P">View profile</NeoMenuItem>
- *   <NeoMenuItem>Settings</NeoMenuItem>
- * </NeoMenu>
- *
- * // Dropdown list with secondary text (user list pattern)
- * <NeoMenu open={open} anchorEl={anchorEl} onClose={() => setAnchorEl(null)}>
- *   <NeoMenuItem secondaryText="@phoenix">Phoenix Baker</NeoMenuItem>
- *   <NeoMenuItem secondaryText="@olivia" selected>Olivia Rhye</NeoMenuItem>
- * </NeoMenu>
- * ```
- */
-const NeoMenu = ({ children, ...props }) => {
-    return jsx(StyledMenu, { ...props, children: children });
-};
-NeoMenu.displayName = 'NeoMenu';
-
 // ============================================================================
 // NeoModal - Main Dialog Container
 // ============================================================================
@@ -6904,5 +6879,5 @@ NeoTypologyControl.displayName = 'NeoTypologyControl';
 
 const version = '0.0.0-development';
 
-export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonTab, NeoButtonTabGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoSelect as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoIconWrapper, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoMarketplaceLargeCard, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoStatusBanner, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, getDataGridHeaderStyles, neoRowHeights, version };
+export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonTab, NeoButtonTabGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoDropdown as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoDropdown, NeoDropdownMenu, NeoDropdownMenuItem, NeoDropdownMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoIconWrapper, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoMarketplaceLargeCard, NeoDropdownMenu as NeoMenu, NeoDropdownMenuItem as NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoDropdown as NeoSelect, NeoDropdownMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoStatusBanner, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, getDataGridHeaderStyles, neoRowHeights, version };
 //# sourceMappingURL=index.esm.js.map