@moderneinc/neo-styled-components 5.0.0-next.78c447 → 5.0.0-next.862835

package/dist/NavigationItem/NavigationItem.d.ts

@@ -21,6 +21,11 @@ type NeoNavigationItemOwnProps = {
      * @figma Tag
      */
     tag?: string;
+    /**
+     * Hover tooltip shown only when the surrounding NeoSideNav is collapsed
+     * (and the label is therefore hidden).
+     */
+    tooltip?: ReactNode;
     /**
      * Slot props for internal sub-components.
      */
@@ -47,7 +52,7 @@ export type NeoNavigationItemProps<C extends ElementType = typeof ButtonBase> =
  *
  * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=8455-6120
  */
-export declare function NeoNavigationItem<C extends ElementType = typeof ButtonBase>({ icon, label, selected, tag, slotProps, children, ...props }: NeoNavigationItemProps<C>): import("react/jsx-runtime").JSX.Element;
+export declare function NeoNavigationItem<C extends ElementType = typeof ButtonBase>({ icon, label, selected, tag, tooltip, slotProps, children, ...props }: NeoNavigationItemProps<C>): import("react/jsx-runtime").JSX.Element;
 export declare namespace NeoNavigationItem {
     var displayName: string;
 }

package/dist/SideNav/NeoSideNavContext.d.ts

@@ -0,0 +1,5 @@
+export type NeoSideNavContextValue = {
+    collapsed: boolean;
+};
+export declare const NeoSideNavContext: import("react").Context<NeoSideNavContextValue>;
+export declare const useNeoSideNav: () => NeoSideNavContextValue;

package/dist/SideNav/SideNav.d.ts

@@ -1,6 +1,19 @@
-/**
- * NeoSideNav
- *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4065-3425
- */
-export declare const NeoSideNav: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+export type NeoSideNavProps = {
+    /** Controlled collapsed state. */
+    collapsed: boolean;
+    /** Called with the next collapsed value when the toggle is activated. */
+    onCollapsedChange: (next: boolean) => void;
+    /** Fixed top slot (e.g. product logo). */
+    header?: ReactNode;
+    /** Fixed bottom slot (e.g. tenant branding), rendered above the toggle. */
+    footer?: ReactNode;
+    /** Scrolling content slot — the nav items. */
+    children: ReactNode;
+    /** Toggle label shown when expanded. Default "Less". */
+    collapseLabel?: string;
+} & Pick<ComponentPropsWithoutRef<'nav'>, 'className' | 'id' | 'aria-label'>;
+export declare function NeoSideNav({ collapsed, onCollapsedChange, header, footer, children, collapseLabel, ...rest }: NeoSideNavProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace NeoSideNav {
+    var displayName: string;
+}

package/dist/Tooltip/Tooltip.d.ts

@@ -1,4 +1,5 @@
 import { type TooltipProps } from '@mui/material/Tooltip';
+import type { ReactNode } from 'react';
 /**
  * Variant type for NeoTooltip
  */
@@ -14,13 +15,15 @@ export interface NeoTooltipProps extends Omit<TooltipProps, 'title' | 'variant'>
      */
     variant?: TooltipVariant;
     /**
-     * The main tooltip text
+     * The main tooltip content. Accepts a string or any ReactNode, so callers can
+     * compose richer content when the `description` variant isn't enough.
      * @figma text (literal content, not a variant property)
      */
-    title: string;
+    title: ReactNode;
     /**
-     * Optional supporting description text
-     * When provided, shows a larger tooltip with title (semibold) + description (medium)
+     * Optional supporting description text. When provided, shows a larger tooltip
+     * with a heading + body hierarchy: title (13px semibold) above a muted
+     * description (12px medium).
      * @default undefined
      * @figma Supporting text
      */
@@ -45,7 +48,7 @@ export interface NeoTooltipProps extends Omit<TooltipProps, 'title' | 'variant'>
  * - Dark: grey[50] (#f9fafb), grey[800] (#1f2937)
  * - Brand: digitalBlue[800] (#131e7a), typography.tooltip (#ffffff)
  * - Shadow: neutralMedium (0px 8px 15px 0px rgba(31,41,55,0.1))
- * - Typography: fontSize.xs (12), fontWeight.medium (500), fontWeight.semiBold (600)
+ * - Typography: fontSize.xs (12), fontSize.caption (13), fontWeight.medium (500), fontWeight.semiBold (600)
  */
 export declare const NeoTooltip: {
     ({ variant, title, description, children, arrow, placement, ...props }: NeoTooltipProps): import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -1937,6 +1937,11 @@ type NeoNavigationItemOwnProps = {
      * @figma Tag
      */
     tag?: string;
+    /**
+     * Hover tooltip shown only when the surrounding NeoSideNav is collapsed
+     * (and the label is therefore hidden).
+     */
+    tooltip?: ReactNode;
     /**
      * Slot props for internal sub-components.
      */
@@ -1963,7 +1968,7 @@ type NeoNavigationItemProps<C extends ElementType = typeof ButtonBase__default>
  *
  * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=8455-6120
  */
-declare function NeoNavigationItem<C extends ElementType = typeof ButtonBase__default>({ icon, label, selected, tag, slotProps, children, ...props }: NeoNavigationItemProps<C>): react_jsx_runtime.JSX.Element;
+declare function NeoNavigationItem<C extends ElementType = typeof ButtonBase__default>({ icon, label, selected, tag, tooltip, slotProps, children, ...props }: NeoNavigationItemProps<C>): react_jsx_runtime.JSX.Element;
 declare namespace NeoNavigationItem {
     var displayName: string;
 }
@@ -2381,12 +2386,24 @@ declare const NeoSelectField: {
 
 type NeoSelectFieldChangeEvent<T = unknown> = SelectChangeEvent<T>;
 
-/**
- * NeoSideNav
- *
- * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4065-3425
- */
-declare const NeoSideNav: StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material_styles.Theme>, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+type NeoSideNavProps = {
+    /** Controlled collapsed state. */
+    collapsed: boolean;
+    /** Called with the next collapsed value when the toggle is activated. */
+    onCollapsedChange: (next: boolean) => void;
+    /** Fixed top slot (e.g. product logo). */
+    header?: ReactNode;
+    /** Fixed bottom slot (e.g. tenant branding), rendered above the toggle. */
+    footer?: ReactNode;
+    /** Scrolling content slot — the nav items. */
+    children: ReactNode;
+    /** Toggle label shown when expanded. Default "Less". */
+    collapseLabel?: string;
+} & Pick<ComponentPropsWithoutRef<'nav'>, 'className' | 'id' | 'aria-label'>;
+declare function NeoSideNav({ collapsed, onCollapsedChange, header, footer, children, collapseLabel, ...rest }: NeoSideNavProps): react_jsx_runtime.JSX.Element;
+declare namespace NeoSideNav {
+    var displayName: string;
+}
 
 /**
  * Extended props for NeoSkeleton component
@@ -3053,13 +3070,15 @@ interface NeoTooltipProps extends Omit<TooltipProps, 'title' | 'variant'> {
      */
     variant?: TooltipVariant;
     /**
-     * The main tooltip text
+     * The main tooltip content. Accepts a string or any ReactNode, so callers can
+     * compose richer content when the `description` variant isn't enough.
      * @figma text (literal content, not a variant property)
      */
-    title: string;
+    title: ReactNode;
     /**
-     * Optional supporting description text
-     * When provided, shows a larger tooltip with title (semibold) + description (medium)
+     * Optional supporting description text. When provided, shows a larger tooltip
+     * with a heading + body hierarchy: title (13px semibold) above a muted
+     * description (12px medium).
      * @default undefined
      * @figma Supporting text
      */
@@ -3084,7 +3103,7 @@ interface NeoTooltipProps extends Omit<TooltipProps, 'title' | 'variant'> {
  * - Dark: grey[50] (#f9fafb), grey[800] (#1f2937)
  * - Brand: digitalBlue[800] (#131e7a), typography.tooltip (#ffffff)
  * - Shadow: neutralMedium (0px 8px 15px 0px rgba(31,41,55,0.1))
- * - Typography: fontSize.xs (12), fontWeight.medium (500), fontWeight.semiBold (600)
+ * - Typography: fontSize.xs (12), fontSize.caption (13), fontWeight.medium (500), fontWeight.semiBold (600)
  */
 declare const NeoTooltip: {
     ({ variant, title, description, children, arrow, placement, ...props }: NeoTooltipProps): react_jsx_runtime.JSX.Element;
@@ -3377,4 +3396,4 @@ declare module '@mui/x-data-grid-pro' {
 declare const version: string
 
 export { ActivityScene, CIRCLE_RADIUS, NeoActionsCell, NeoActivityHeader, NeoActivityIndicatorCell, NeoAlert, NeoAvatarCell, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonTab, NeoButtonTabGroup, NeoCard, NeoCheckbox, NeoCheckboxWithText, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoSelect as NeoDataGridSelect, NeoDatePicker, NeoDatePickerListItem, NeoDatePickerMenu, NeoDivider, NeoDot, NeoDownloadToast, NeoSelect as NeoDropdown, NeoMenu as NeoDropdownMenu, NeoMenuItem as NeoDropdownMenuItem, NeoMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoIconCell, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoLogoCell, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressCell, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoRadioButtonWithText, NeoSearchChip, NeoSelect, NeoSelectField, NeoMenuItem as NeoSelectOption, NeoSideNav, NeoSkeleton, NeoStatusBadgeCell, NeoStatusCell, NeoTab, NeoTabPanel, NeoTable, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToggleButton, NeoToggleButtonGroup, NeoToggleButtonWithText, NeoToolbar, NeoTooltip, NeoTopNav, NeoTourModal, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, focusRingStyles, getDataGridHeaderStyles, getDataGridRowStyles, version };
-export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActionsCellProps, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAlertProps, NeoAvatarCellProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonProps, NeoButtonTabGroupProps, NeoButtonTabProps, NeoCardLargeProps, NeoCardProps, NeoCardSize, NeoCardSmallProps, NeoCheckboxProps, NeoCheckboxWithTextProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoDownloadToastProps, NeoMenuItemProps as NeoDropdownMenuItemProps, NeoMenuProps as NeoDropdownMenuProps, NeoSelectProps as NeoDropdownProps, NeoFilterChipProps, NeoFooterProps, NeoGeneralAvatarProps, NeoIconButtonProps, NeoIconCellProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoLogoCellProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationAvatarProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressCellProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectFieldChangeEvent, NeoSelectFieldOption, NeoSelectFieldProps, NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusCellProps, NeoStatusCellVariant, NeoTabPanelProps, NeoTabProps, NeoTableColumn, NeoTableProps, NeoTagProps, NeoToastProps, NeoToggleButtonGroupProps, NeoToggleButtonProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };
+export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActionsCellProps, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAlertProps, NeoAvatarCellProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonProps, NeoButtonTabGroupProps, NeoButtonTabProps, NeoCardLargeProps, NeoCardProps, NeoCardSize, NeoCardSmallProps, NeoCheckboxProps, NeoCheckboxWithTextProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoDownloadToastProps, NeoMenuItemProps as NeoDropdownMenuItemProps, NeoMenuProps as NeoDropdownMenuProps, NeoSelectProps as NeoDropdownProps, NeoFilterChipProps, NeoFooterProps, NeoGeneralAvatarProps, NeoIconButtonProps, NeoIconCellProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoLogoCellProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationAvatarProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressCellProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectFieldChangeEvent, NeoSelectFieldOption, NeoSelectFieldProps, NeoSelectProps, NeoSideNavProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusCellProps, NeoStatusCellVariant, NeoTabPanelProps, NeoTabProps, NeoTableColumn, NeoTableProps, NeoTagProps, NeoToastProps, NeoToggleButtonGroupProps, NeoToggleButtonProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };