@moderneinc/neo-styled-components 2.5.0-next.2238f1 → 2.5.0-next.3473ff
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Button/Button.d.ts +3 -2
- package/dist/MarketplaceCard/MarketplaceCard.d.ts +7 -6
- package/dist/Tree/Tree.d.ts +31 -15
- package/dist/index.d.ts +89 -10
- package/dist/index.esm.js +207 -46
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +208 -45
- package/dist/index.js.map +1 -1
- package/package.json +24 -2
package/dist/Button/Button.d.ts
CHANGED
|
@@ -7,9 +7,10 @@ declare module '@mui/material/ButtonBase' {
|
|
|
7
7
|
destructive: true;
|
|
8
8
|
link: true;
|
|
9
9
|
linkColor: true;
|
|
10
|
+
tertiary: true;
|
|
10
11
|
}
|
|
11
12
|
}
|
|
12
|
-
type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link' | 'linkColor';
|
|
13
|
+
type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link' | 'linkColor' | 'tertiary';
|
|
13
14
|
type ButtonSize = 'small' | 'medium';
|
|
14
15
|
type NeoButtonOwnProps = {
|
|
15
16
|
/**
|
|
@@ -59,7 +60,7 @@ export type NeoButtonProps<C extends ElementType = typeof ButtonBase> = NeoButto
|
|
|
59
60
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4086-7590
|
|
60
61
|
*
|
|
61
62
|
* Figma Props Mapping:
|
|
62
|
-
* - Hierarchy (Primary|Secondary|Destructive|Link|Link Color) → variant prop
|
|
63
|
+
* - Hierarchy (Primary|Secondary|Destructive|Link|Link Color|Tertiary) → variant prop
|
|
63
64
|
* - Size (Small|Medium) → size prop
|
|
64
65
|
* - State=Disabled → disabled prop
|
|
65
66
|
* - State=Loading → loading prop
|
|
@@ -23,13 +23,13 @@ export interface NeoMarketplaceCardProps extends Omit<CardProps, 'children' | 't
|
|
|
23
23
|
/**
|
|
24
24
|
* Whether the card is in selected/active state
|
|
25
25
|
* @default false
|
|
26
|
-
* @figma
|
|
26
|
+
* @figma State (Active)
|
|
27
27
|
*/
|
|
28
28
|
selected?: boolean;
|
|
29
29
|
/**
|
|
30
30
|
* Whether the card is disabled
|
|
31
31
|
* @default false
|
|
32
|
-
* @figma
|
|
32
|
+
* @figma State (Disabled)
|
|
33
33
|
*/
|
|
34
34
|
disabled?: boolean;
|
|
35
35
|
/**
|
|
@@ -59,10 +59,11 @@ export interface NeoMarketplaceCardProps extends Omit<CardProps, 'children' | 't
|
|
|
59
59
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4286-1635&t=Bo58EpFmg6ILJtmv-11
|
|
60
60
|
*
|
|
61
61
|
* Figma Props Mapping:
|
|
62
|
-
* -
|
|
63
|
-
* -
|
|
64
|
-
* -
|
|
65
|
-
* -
|
|
62
|
+
* - State="Active" → selected={true}
|
|
63
|
+
* - State="Disabled" → disabled={true}
|
|
64
|
+
* - State="Focused" → CSS :focus-visible state (not a prop)
|
|
65
|
+
* - State="Hover" → CSS :hover state (not a prop)
|
|
66
|
+
* - State="Default" → Base state (no props)
|
|
66
67
|
*
|
|
67
68
|
* Design Tokens Used:
|
|
68
69
|
* - semanticColors.surfaces.card (#FFFFFF) - Default card background
|
package/dist/Tree/Tree.d.ts
CHANGED
|
@@ -1,26 +1,42 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type TreeItemProps } from '@mui/x-tree-view/TreeItem';
|
|
2
|
+
import { type RichTreeViewProProps } from '@mui/x-tree-view-pro/RichTreeViewPro';
|
|
3
|
+
import { type ReactNode } from 'react';
|
|
2
4
|
/**
|
|
3
|
-
*
|
|
5
|
+
* Extended item data that NeoTreeItem can read from the items array.
|
|
6
|
+
* Consumers pass these via the `items` prop on NeoTreeView.
|
|
4
7
|
*/
|
|
5
|
-
export interface
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
export interface NeoTreeItemData {
|
|
9
|
+
id: string;
|
|
10
|
+
label: string;
|
|
11
|
+
icon?: ReactNode;
|
|
12
|
+
checkbox?: ReactNode;
|
|
13
|
+
secondaryLabel?: ReactNode;
|
|
14
|
+
endAction?: ReactNode;
|
|
15
|
+
statusIcon?: ReactNode;
|
|
16
|
+
children?: NeoTreeItemData[];
|
|
10
17
|
}
|
|
18
|
+
export type NeoTreeItemProps = TreeItemProps;
|
|
11
19
|
/**
|
|
12
|
-
*
|
|
20
|
+
* NeoTreeItem - Styled tree item row with optional icon, checkbox,
|
|
21
|
+
* secondaryLabel, endAction, and statusIcon slots.
|
|
22
|
+
*
|
|
23
|
+
* Slot data is read from the item model (passed via `items` on NeoTreeView).
|
|
13
24
|
*
|
|
14
25
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4190-30493
|
|
26
|
+
*/
|
|
27
|
+
export declare const NeoTreeItem: import("react").ForwardRefExoticComponent<TreeItemProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
28
|
+
export interface NeoTreeViewProps extends Omit<RichTreeViewProProps<NeoTreeItemData, false>, 'slots'> {
|
|
29
|
+
slots?: RichTreeViewProProps<NeoTreeItemData, false>['slots'];
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* NeoTreeView - Styled tree container wrapping MUI RichTreeViewPro.
|
|
15
33
|
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
* - FigmaProp → reactProp
|
|
34
|
+
* Provides neo-design token styling, default expand/collapse icons,
|
|
35
|
+
* and NeoTreeItem as the default item slot.
|
|
19
36
|
*
|
|
20
|
-
*
|
|
21
|
-
* - TODO: List design tokens used (e.g., semanticColors.text.primary, typography.body.medium)
|
|
37
|
+
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4190-30493
|
|
22
38
|
*/
|
|
23
|
-
export declare const
|
|
24
|
-
({
|
|
39
|
+
export declare const NeoTreeView: {
|
|
40
|
+
({ slots, ...props }: NeoTreeViewProps): import("react/jsx-runtime").JSX.Element;
|
|
25
41
|
displayName: string;
|
|
26
42
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -40,6 +40,8 @@ import { DatePickerProps } from '@mui/x-date-pickers/DatePicker';
|
|
|
40
40
|
import { PickersShortcutsItem } from '@mui/x-date-pickers/PickersShortcuts';
|
|
41
41
|
import { DateRangePickerProps } from '@mui/x-date-pickers-pro/DateRangePicker';
|
|
42
42
|
import { DateRange } from '@mui/x-date-pickers-pro/models';
|
|
43
|
+
import { TreeItemProps } from '@mui/x-tree-view/TreeItem';
|
|
44
|
+
import { RichTreeViewProProps } from '@mui/x-tree-view-pro/RichTreeViewPro';
|
|
43
45
|
|
|
44
46
|
interface NeoFooterProps {
|
|
45
47
|
/**
|
|
@@ -489,9 +491,10 @@ declare module '@mui/material/ButtonBase' {
|
|
|
489
491
|
destructive: true;
|
|
490
492
|
link: true;
|
|
491
493
|
linkColor: true;
|
|
494
|
+
tertiary: true;
|
|
492
495
|
}
|
|
493
496
|
}
|
|
494
|
-
type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link' | 'linkColor';
|
|
497
|
+
type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link' | 'linkColor' | 'tertiary';
|
|
495
498
|
type ButtonSize = 'small' | 'medium';
|
|
496
499
|
type NeoButtonOwnProps = {
|
|
497
500
|
/**
|
|
@@ -541,7 +544,7 @@ type NeoButtonProps<C extends ElementType = typeof ButtonBase__default> = NeoBut
|
|
|
541
544
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4086-7590
|
|
542
545
|
*
|
|
543
546
|
* Figma Props Mapping:
|
|
544
|
-
* - Hierarchy (Primary|Secondary|Destructive|Link|Link Color) → variant prop
|
|
547
|
+
* - Hierarchy (Primary|Secondary|Destructive|Link|Link Color|Tertiary) → variant prop
|
|
545
548
|
* - Size (Small|Medium) → size prop
|
|
546
549
|
* - State=Disabled → disabled prop
|
|
547
550
|
* - State=Loading → loading prop
|
|
@@ -1658,6 +1661,41 @@ declare const NeoModalFooter: {
|
|
|
1658
1661
|
displayName: string;
|
|
1659
1662
|
};
|
|
1660
1663
|
|
|
1664
|
+
interface NeoNavigationItemProps extends Omit<ButtonBaseProps, 'children'> {
|
|
1665
|
+
/**
|
|
1666
|
+
* Icon element to display
|
|
1667
|
+
*/
|
|
1668
|
+
icon?: ReactNode;
|
|
1669
|
+
/**
|
|
1670
|
+
* Text label below the icon
|
|
1671
|
+
*/
|
|
1672
|
+
label?: string;
|
|
1673
|
+
/**
|
|
1674
|
+
* Whether the item is selected/active
|
|
1675
|
+
* @figma State (Selected)
|
|
1676
|
+
* @default false
|
|
1677
|
+
*/
|
|
1678
|
+
selected?: boolean;
|
|
1679
|
+
/**
|
|
1680
|
+
* Optional tag badge content (e.g., count)
|
|
1681
|
+
* @figma Tag
|
|
1682
|
+
*/
|
|
1683
|
+
tag?: string;
|
|
1684
|
+
/**
|
|
1685
|
+
* Additional content
|
|
1686
|
+
*/
|
|
1687
|
+
children?: ReactNode;
|
|
1688
|
+
}
|
|
1689
|
+
/**
|
|
1690
|
+
* NeoNavigationItem - Vertical navigation item with icon, label, and optional tag
|
|
1691
|
+
*
|
|
1692
|
+
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=8455-6120
|
|
1693
|
+
*/
|
|
1694
|
+
declare const NeoNavigationItem: {
|
|
1695
|
+
({ icon, label, selected, tag, children, ...props }: NeoNavigationItemProps): react_jsx_runtime.JSX.Element;
|
|
1696
|
+
displayName: string;
|
|
1697
|
+
};
|
|
1698
|
+
|
|
1661
1699
|
/**
|
|
1662
1700
|
* Breadcrumb item configuration
|
|
1663
1701
|
*/
|
|
@@ -2622,13 +2660,13 @@ interface NeoMarketplaceCardProps extends Omit<CardProps, 'children' | 'title'>
|
|
|
2622
2660
|
/**
|
|
2623
2661
|
* Whether the card is in selected/active state
|
|
2624
2662
|
* @default false
|
|
2625
|
-
* @figma
|
|
2663
|
+
* @figma State (Active)
|
|
2626
2664
|
*/
|
|
2627
2665
|
selected?: boolean;
|
|
2628
2666
|
/**
|
|
2629
2667
|
* Whether the card is disabled
|
|
2630
2668
|
* @default false
|
|
2631
|
-
* @figma
|
|
2669
|
+
* @figma State (Disabled)
|
|
2632
2670
|
*/
|
|
2633
2671
|
disabled?: boolean;
|
|
2634
2672
|
/**
|
|
@@ -2658,10 +2696,11 @@ interface NeoMarketplaceCardProps extends Omit<CardProps, 'children' | 'title'>
|
|
|
2658
2696
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4286-1635&t=Bo58EpFmg6ILJtmv-11
|
|
2659
2697
|
*
|
|
2660
2698
|
* Figma Props Mapping:
|
|
2661
|
-
* -
|
|
2662
|
-
* -
|
|
2663
|
-
* -
|
|
2664
|
-
* -
|
|
2699
|
+
* - State="Active" → selected={true}
|
|
2700
|
+
* - State="Disabled" → disabled={true}
|
|
2701
|
+
* - State="Focused" → CSS :focus-visible state (not a prop)
|
|
2702
|
+
* - State="Hover" → CSS :hover state (not a prop)
|
|
2703
|
+
* - State="Default" → Base state (no props)
|
|
2665
2704
|
*
|
|
2666
2705
|
* Design Tokens Used:
|
|
2667
2706
|
* - semanticColors.surfaces.card (#FFFFFF) - Default card background
|
|
@@ -2816,6 +2855,46 @@ declare const NeoDatePicker: {
|
|
|
2816
2855
|
displayName: string;
|
|
2817
2856
|
};
|
|
2818
2857
|
|
|
2858
|
+
/**
|
|
2859
|
+
* Extended item data that NeoTreeItem can read from the items array.
|
|
2860
|
+
* Consumers pass these via the `items` prop on NeoTreeView.
|
|
2861
|
+
*/
|
|
2862
|
+
interface NeoTreeItemData {
|
|
2863
|
+
id: string;
|
|
2864
|
+
label: string;
|
|
2865
|
+
icon?: ReactNode;
|
|
2866
|
+
checkbox?: ReactNode;
|
|
2867
|
+
secondaryLabel?: ReactNode;
|
|
2868
|
+
endAction?: ReactNode;
|
|
2869
|
+
statusIcon?: ReactNode;
|
|
2870
|
+
children?: NeoTreeItemData[];
|
|
2871
|
+
}
|
|
2872
|
+
type NeoTreeItemProps = TreeItemProps;
|
|
2873
|
+
/**
|
|
2874
|
+
* NeoTreeItem - Styled tree item row with optional icon, checkbox,
|
|
2875
|
+
* secondaryLabel, endAction, and statusIcon slots.
|
|
2876
|
+
*
|
|
2877
|
+
* Slot data is read from the item model (passed via `items` on NeoTreeView).
|
|
2878
|
+
*
|
|
2879
|
+
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4190-30493
|
|
2880
|
+
*/
|
|
2881
|
+
declare const NeoTreeItem: React$1.ForwardRefExoticComponent<TreeItemProps & React$1.RefAttributes<HTMLLIElement>>;
|
|
2882
|
+
interface NeoTreeViewProps extends Omit<RichTreeViewProProps<NeoTreeItemData, false>, 'slots'> {
|
|
2883
|
+
slots?: RichTreeViewProProps<NeoTreeItemData, false>['slots'];
|
|
2884
|
+
}
|
|
2885
|
+
/**
|
|
2886
|
+
* NeoTreeView - Styled tree container wrapping MUI RichTreeViewPro.
|
|
2887
|
+
*
|
|
2888
|
+
* Provides neo-design token styling, default expand/collapse icons,
|
|
2889
|
+
* and NeoTreeItem as the default item slot.
|
|
2890
|
+
*
|
|
2891
|
+
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=4190-30493
|
|
2892
|
+
*/
|
|
2893
|
+
declare const NeoTreeView: {
|
|
2894
|
+
({ slots, ...props }: NeoTreeViewProps): react_jsx_runtime.JSX.Element;
|
|
2895
|
+
displayName: string;
|
|
2896
|
+
};
|
|
2897
|
+
|
|
2819
2898
|
/**
|
|
2820
2899
|
* @moderneinc/neo-styled-components
|
|
2821
2900
|
*
|
|
@@ -2835,5 +2914,5 @@ declare module '@mui/x-data-grid-pro' {
|
|
|
2835
2914
|
|
|
2836
2915
|
declare const version: string
|
|
2837
2916
|
|
|
2838
|
-
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoSelect as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoFilterChip, NeoFooter, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoStatusBanner, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, getDataGridHeaderStyles, version };
|
|
2839
|
-
export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAvatarProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonGroupProps, NeoButtonProps, NeoCheckboxProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoFilterChipProps, NeoFooterProps, NeoIconButtonProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoMarketplaceCardProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusBannerProps, NeoTabProps, NeoTagProps, NeoToastProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTypologyControlProps, NeoUserAvatarCellProps };
|
|
2917
|
+
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAvatar, NeoBadge, NeoBanner, NeoBreadcrumbLink, NeoBreadcrumbs, NeoButton, NeoButtonGroup, NeoCheckbox, NeoCodeSnippet, NeoDataGrid, NeoDataGridCellContent, NeoDataGridColumnsButton, NeoDataGridColumnsPanel, NeoDataGridFilterPanel, NeoDataGridFilterPanelAddIcon, NeoDataGridFilterPanelDeleteIcon, NeoDataGridFilterPanelRemoveAllIcon, NeoDataGridFiltersButton, NeoDataGridHeaderLabel, NeoSelect as NeoDataGridSelect, NeoDatePicker, NeoDivider, NeoDot, NeoFilterChip, NeoFooter, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMarketplaceCard, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, 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 };
|
|
2918
|
+
export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAvatarProps, NeoBadgeProps, NeoBannerProps, NeoBreadcrumbLinkProps, NeoBreadcrumbsProps, NeoButtonGroupProps, NeoButtonProps, NeoCheckboxProps, NeoCodeSnippetProps, NeoDataGridCellContentProps, NeoDataGridHeaderLabelProps, NeoDataGridProps, NeoDatePickerProps, NeoDividerProps, NeoDotProps, NeoFilterChipProps, NeoFooterProps, NeoIconButtonProps, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoMarketplaceCardProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoStatusBannerProps, NeoTabProps, NeoTagProps, NeoToastProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };
|