@moderneinc/neo-styled-components 5.0.0-next.0fa9b3 → 5.0.0-next.1b194d
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/DataGrid/DataGrid.d.ts +1 -1
- package/dist/DataGrid/DataGrid.styles.d.ts +3 -0
- package/dist/DataGridCell/DataGridCell.d.ts +0 -16
- package/dist/DataGridHeaderCell/DataGridHeaderCell.d.ts +0 -37
- package/dist/NavigationAvatar/NavigationAvatar.d.ts +2 -2
- package/dist/index.d.ts +7 -40
- package/dist/index.esm.js +29 -63
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +29 -62
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -38,7 +38,7 @@ export interface NeoDataGridProps extends Omit<DataGridProProps, 'slots'> {
|
|
|
38
38
|
* - `size` → Row heights (compact: 42px, standard: 48px, comfortable: 56px) and header heights (compact: 38px, standard: 44px, comfortable: 52px)
|
|
39
39
|
*
|
|
40
40
|
* Design tokens used:
|
|
41
|
-
* - Colors: semanticColors.border.primary, semanticColors.
|
|
41
|
+
* - Colors: semanticColors.border.primary, semanticColors.surfaces.dataGrid.*
|
|
42
42
|
* - Typography: typography.fontFamily.body, typography.fontSize.sm
|
|
43
43
|
* - Spacing: spacing.spacing_*
|
|
44
44
|
*
|
|
@@ -45,22 +45,6 @@ export declare const NeoDataGridCellContent: {
|
|
|
45
45
|
({ children, ...props }: NeoDataGridCellContentProps): import("react/jsx-runtime").JSX.Element;
|
|
46
46
|
displayName: string;
|
|
47
47
|
};
|
|
48
|
-
/**
|
|
49
|
-
* Utility function to get DataGrid sx styles for consistent cell appearance
|
|
50
|
-
*
|
|
51
|
-
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4212-41631
|
|
52
|
-
*
|
|
53
|
-
* Apply this to DataGrid's `sx` prop to ensure cells are properly aligned and styled.
|
|
54
|
-
*
|
|
55
|
-
* @param size - Row size variant (affects row height)
|
|
56
|
-
* @returns SxProps for DataGrid
|
|
57
|
-
*
|
|
58
|
-
* @example
|
|
59
|
-
* <DataGrid
|
|
60
|
-
* rows={rows}
|
|
61
|
-
* columns={columns}
|
|
62
|
-
* />
|
|
63
|
-
*/
|
|
64
48
|
/**
|
|
65
49
|
* Row height configuration for DataGrid size variants (from Figma specs)
|
|
66
50
|
* - compact: 42px
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import type { SxProps, Theme } from '@mui/material/styles';
|
|
2
1
|
/**
|
|
3
2
|
* Sort icon components for MUI DataGrid slots
|
|
4
3
|
*
|
|
@@ -7,39 +6,3 @@ import type { SxProps, Theme } from '@mui/material/styles';
|
|
|
7
6
|
export declare function SortedDescendingIcon(): import("react/jsx-runtime").JSX.Element;
|
|
8
7
|
export declare function SortedAscendingIcon(): import("react/jsx-runtime").JSX.Element;
|
|
9
8
|
export declare function UnsortedIcon(): import("react/jsx-runtime").JSX.Element;
|
|
10
|
-
/**
|
|
11
|
-
* Utility function to get DataGrid sx styles for header cells
|
|
12
|
-
*
|
|
13
|
-
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4212-41618
|
|
14
|
-
*
|
|
15
|
-
* Figma prop mappings:
|
|
16
|
-
* - `size` → `size`: Figma "condensed" → MUI 'compact', Figma "default" → MUI 'standard', Figma "relaxed" → MUI 'comfortable'
|
|
17
|
-
*
|
|
18
|
-
* Design tokens used:
|
|
19
|
-
* - Background: colors.grey[50] (#f9fafb)
|
|
20
|
-
* - Border: semanticColors.border.primary
|
|
21
|
-
* - Padding: 12px vertical, 24px horizontal
|
|
22
|
-
* - Gap: 12px
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
* @param size - Header row size variant (affects header cell height)
|
|
26
|
-
* @returns SxProps for DataGrid header cells
|
|
27
|
-
*
|
|
28
|
-
* @example
|
|
29
|
-
* import { getDataGridHeaderStyles, SortedDescendingIcon, SortedAscendingIcon, UnsortedIcon } from './DataGridHeaderCell'
|
|
30
|
-
*
|
|
31
|
-
* <DataGrid
|
|
32
|
-
* columnHeaderHeight={38} // for compact (Figma: condensed)
|
|
33
|
-
* sx={{
|
|
34
|
-
* ...getDataGridHeaderStyles(),
|
|
35
|
-
* }}
|
|
36
|
-
* slots={{
|
|
37
|
-
* columnSortedDescendingIcon: SortedDescendingIcon,
|
|
38
|
-
* columnSortedAscendingIcon: SortedAscendingIcon,
|
|
39
|
-
* columnUnsortedIcon: UnsortedIcon,
|
|
40
|
-
* }}
|
|
41
|
-
* rows={rows}
|
|
42
|
-
* columns={columns}
|
|
43
|
-
* />
|
|
44
|
-
*/
|
|
45
|
-
export declare const getDataGridHeaderStyles: () => SxProps<Theme>;
|
|
@@ -4,8 +4,8 @@ export interface NeoNavigationAvatarProps extends Omit<NeoGeneralAvatarProps, 's
|
|
|
4
4
|
/**
|
|
5
5
|
* NeoNavigationAvatar - Compact avatar for navigation contexts
|
|
6
6
|
*
|
|
7
|
-
* Wraps NeoGeneralAvatar (size="small") in a
|
|
8
|
-
* providing
|
|
7
|
+
* Wraps NeoGeneralAvatar (size="small") in a 40px container,
|
|
8
|
+
* providing an interactive area for navigation UI.
|
|
9
9
|
*
|
|
10
10
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=11325-102
|
|
11
11
|
*/
|
package/dist/index.d.ts
CHANGED
|
@@ -835,7 +835,7 @@ interface NeoDataGridProps extends Omit<DataGridProProps, 'slots'> {
|
|
|
835
835
|
* - `size` → Row heights (compact: 42px, standard: 48px, comfortable: 56px) and header heights (compact: 38px, standard: 44px, comfortable: 52px)
|
|
836
836
|
*
|
|
837
837
|
* Design tokens used:
|
|
838
|
-
* - Colors: semanticColors.border.primary, semanticColors.
|
|
838
|
+
* - Colors: semanticColors.border.primary, semanticColors.surfaces.dataGrid.*
|
|
839
839
|
* - Typography: typography.fontFamily.body, typography.fontSize.sm
|
|
840
840
|
* - Spacing: spacing.spacing_*
|
|
841
841
|
*
|
|
@@ -859,6 +859,9 @@ declare namespace NeoDataGrid {
|
|
|
859
859
|
var displayName: string;
|
|
860
860
|
}
|
|
861
861
|
|
|
862
|
+
declare const getDataGridHeaderStyles: () => SxProps<Theme>;
|
|
863
|
+
declare const getDataGridRowStyles: () => SxProps<Theme>;
|
|
864
|
+
|
|
862
865
|
interface NeoInfiniteScrollGridProps extends Omit<NeoDataGridProps, 'slots'> {
|
|
863
866
|
/**
|
|
864
867
|
* Callback when load more is triggered - either by scrolling or clicking button
|
|
@@ -1185,42 +1188,6 @@ declare const NeoDataGridFilterPanel: {
|
|
|
1185
1188
|
declare function SortedDescendingIcon(): react_jsx_runtime.JSX.Element;
|
|
1186
1189
|
declare function SortedAscendingIcon(): react_jsx_runtime.JSX.Element;
|
|
1187
1190
|
declare function UnsortedIcon(): react_jsx_runtime.JSX.Element;
|
|
1188
|
-
/**
|
|
1189
|
-
* Utility function to get DataGrid sx styles for header cells
|
|
1190
|
-
*
|
|
1191
|
-
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4212-41618
|
|
1192
|
-
*
|
|
1193
|
-
* Figma prop mappings:
|
|
1194
|
-
* - `size` → `size`: Figma "condensed" → MUI 'compact', Figma "default" → MUI 'standard', Figma "relaxed" → MUI 'comfortable'
|
|
1195
|
-
*
|
|
1196
|
-
* Design tokens used:
|
|
1197
|
-
* - Background: colors.grey[50] (#f9fafb)
|
|
1198
|
-
* - Border: semanticColors.border.primary
|
|
1199
|
-
* - Padding: 12px vertical, 24px horizontal
|
|
1200
|
-
* - Gap: 12px
|
|
1201
|
-
*
|
|
1202
|
-
*
|
|
1203
|
-
* @param size - Header row size variant (affects header cell height)
|
|
1204
|
-
* @returns SxProps for DataGrid header cells
|
|
1205
|
-
*
|
|
1206
|
-
* @example
|
|
1207
|
-
* import { getDataGridHeaderStyles, SortedDescendingIcon, SortedAscendingIcon, UnsortedIcon } from './DataGridHeaderCell'
|
|
1208
|
-
*
|
|
1209
|
-
* <DataGrid
|
|
1210
|
-
* columnHeaderHeight={38} // for compact (Figma: condensed)
|
|
1211
|
-
* sx={{
|
|
1212
|
-
* ...getDataGridHeaderStyles(),
|
|
1213
|
-
* }}
|
|
1214
|
-
* slots={{
|
|
1215
|
-
* columnSortedDescendingIcon: SortedDescendingIcon,
|
|
1216
|
-
* columnSortedAscendingIcon: SortedAscendingIcon,
|
|
1217
|
-
* columnUnsortedIcon: UnsortedIcon,
|
|
1218
|
-
* }}
|
|
1219
|
-
* rows={rows}
|
|
1220
|
-
* columns={columns}
|
|
1221
|
-
* />
|
|
1222
|
-
*/
|
|
1223
|
-
declare const getDataGridHeaderStyles: () => SxProps<Theme>;
|
|
1224
1191
|
|
|
1225
1192
|
interface NeoDataGridHeaderLabelProps {
|
|
1226
1193
|
/**
|
|
@@ -1741,8 +1708,8 @@ interface NeoNavigationAvatarProps extends Omit<NeoGeneralAvatarProps, 'size'> {
|
|
|
1741
1708
|
/**
|
|
1742
1709
|
* NeoNavigationAvatar - Compact avatar for navigation contexts
|
|
1743
1710
|
*
|
|
1744
|
-
* Wraps NeoGeneralAvatar (size="small") in a
|
|
1745
|
-
* providing
|
|
1711
|
+
* Wraps NeoGeneralAvatar (size="small") in a 40px container,
|
|
1712
|
+
* providing an interactive area for navigation UI.
|
|
1746
1713
|
*
|
|
1747
1714
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=11325-102
|
|
1748
1715
|
*/
|
|
@@ -2952,5 +2919,5 @@ declare module '@mui/x-data-grid-pro' {
|
|
|
2952
2919
|
|
|
2953
2920
|
declare const version: string
|
|
2954
2921
|
|
|
2955
|
-
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAlert, 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, NeoDivider, NeoDot, NeoDownloadToast, NeoSelect as NeoDropdown, NeoMenu as NeoDropdownMenu, NeoMenuItem as NeoDropdownMenuItem, NeoMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, focusRingStyles, getDataGridHeaderStyles, version };
|
|
2922
|
+
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAlert, 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, NeoDivider, NeoDot, NeoDownloadToast, NeoSelect as NeoDropdown, NeoMenu as NeoDropdownMenu, NeoMenuItem as NeoDropdownMenuItem, NeoMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, focusRingStyles, getDataGridHeaderStyles, getDataGridRowStyles, version };
|
|
2956
2923
|
export type { ActivityColor, ActivityEvent, ActivityHeaderSize, BreadcrumbItem, DataGridSize, NeoActivityHeaderProps, NeoActivityIndicatorCellProps, NeoAlertProps, 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, NeoInfiniteScrollGridProps, NeoInputFieldProps, NeoListItemButtonProps, NeoListItemProps, NeoLoadingSpinnerProps, NeoMenuItemProps, NeoMenuProps, NeoModalContentProps, NeoModalFooterProps, NeoModalHeaderProps, NeoModalProps, NeoMultiBadgesCellProps, NeoNavigationAvatarProps, NeoNavigationItemProps, NeoPageContentProps, NeoPaginatedGridProps, NeoProgressbarProps, NeoQuickFilterProps, NeoRadioProps, NeoSearchChipProps, NeoSelectProps, NeoSkeletonProps, NeoStatusBadgeCellProps, NeoTabProps, NeoTagProps, NeoToastProps, NeoToggleProps, NeoToolbarProps, NeoTooltipProps, NeoTreeItemData, NeoTreeItemProps, NeoTreeViewProps, NeoTypologyControlProps, NeoUserAvatarCellProps };
|
package/dist/index.esm.js
CHANGED
|
@@ -267,22 +267,6 @@ const NeoDataGridCellContent = ({ children, ...props }) => {
|
|
|
267
267
|
return jsx(CellContentContainer, { ...props, children: children });
|
|
268
268
|
};
|
|
269
269
|
NeoDataGridCellContent.displayName = 'NeoDataGridCellContent';
|
|
270
|
-
/**
|
|
271
|
-
* Utility function to get DataGrid sx styles for consistent cell appearance
|
|
272
|
-
*
|
|
273
|
-
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4212-41631
|
|
274
|
-
*
|
|
275
|
-
* Apply this to DataGrid's `sx` prop to ensure cells are properly aligned and styled.
|
|
276
|
-
*
|
|
277
|
-
* @param size - Row size variant (affects row height)
|
|
278
|
-
* @returns SxProps for DataGrid
|
|
279
|
-
*
|
|
280
|
-
* @example
|
|
281
|
-
* <DataGrid
|
|
282
|
-
* rows={rows}
|
|
283
|
-
* columns={columns}
|
|
284
|
-
* />
|
|
285
|
-
*/
|
|
286
270
|
/**
|
|
287
271
|
* Row height configuration for DataGrid size variants (from Figma specs)
|
|
288
272
|
* - compact: 42px
|
|
@@ -2544,47 +2528,13 @@ function SortedAscendingIcon() {
|
|
|
2544
2528
|
function UnsortedIcon() {
|
|
2545
2529
|
return jsx(ChevronsUpDown, { size: 16, color: semanticColors.icons.utility });
|
|
2546
2530
|
}
|
|
2547
|
-
|
|
2548
|
-
* Utility function to get DataGrid sx styles for header cells
|
|
2549
|
-
*
|
|
2550
|
-
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4212-41618
|
|
2551
|
-
*
|
|
2552
|
-
* Figma prop mappings:
|
|
2553
|
-
* - `size` → `size`: Figma "condensed" → MUI 'compact', Figma "default" → MUI 'standard', Figma "relaxed" → MUI 'comfortable'
|
|
2554
|
-
*
|
|
2555
|
-
* Design tokens used:
|
|
2556
|
-
* - Background: colors.grey[50] (#f9fafb)
|
|
2557
|
-
* - Border: semanticColors.border.primary
|
|
2558
|
-
* - Padding: 12px vertical, 24px horizontal
|
|
2559
|
-
* - Gap: 12px
|
|
2560
|
-
*
|
|
2561
|
-
*
|
|
2562
|
-
* @param size - Header row size variant (affects header cell height)
|
|
2563
|
-
* @returns SxProps for DataGrid header cells
|
|
2564
|
-
*
|
|
2565
|
-
* @example
|
|
2566
|
-
* import { getDataGridHeaderStyles, SortedDescendingIcon, SortedAscendingIcon, UnsortedIcon } from './DataGridHeaderCell'
|
|
2567
|
-
*
|
|
2568
|
-
* <DataGrid
|
|
2569
|
-
* columnHeaderHeight={38} // for compact (Figma: condensed)
|
|
2570
|
-
* sx={{
|
|
2571
|
-
* ...getDataGridHeaderStyles(),
|
|
2572
|
-
* }}
|
|
2573
|
-
* slots={{
|
|
2574
|
-
* columnSortedDescendingIcon: SortedDescendingIcon,
|
|
2575
|
-
* columnSortedAscendingIcon: SortedAscendingIcon,
|
|
2576
|
-
* columnUnsortedIcon: UnsortedIcon,
|
|
2577
|
-
* }}
|
|
2578
|
-
* rows={rows}
|
|
2579
|
-
* columns={columns}
|
|
2580
|
-
* />
|
|
2581
|
-
*/
|
|
2531
|
+
|
|
2582
2532
|
const getDataGridHeaderStyles = () => {
|
|
2583
2533
|
return {
|
|
2584
2534
|
// Header cell container styles - from Figma: bg, border, padding
|
|
2585
2535
|
// Height is set via density-specific selectors in DataGrid.tsx
|
|
2586
2536
|
[`& .${gridClasses.columnHeader}`]: {
|
|
2587
|
-
backgroundColor:
|
|
2537
|
+
backgroundColor: semanticColors.surfaces.dataGrid.header,
|
|
2588
2538
|
borderBottom: `1px solid ${semanticColors.border.primary}`,
|
|
2589
2539
|
paddingLeft: `${spacing.spacing_3}px`,
|
|
2590
2540
|
paddingRight: `${spacing.spacing_3}px`,
|
|
@@ -2593,7 +2543,7 @@ const getDataGridHeaderStyles = () => {
|
|
|
2593
2543
|
// Style the filler element to match header
|
|
2594
2544
|
// Height is set via density-specific selectors in DataGrid.tsx
|
|
2595
2545
|
[`& .${gridClasses.filler}`]: {
|
|
2596
|
-
backgroundColor:
|
|
2546
|
+
backgroundColor: semanticColors.surfaces.dataGrid.header,
|
|
2597
2547
|
borderBottom: `1px solid ${semanticColors.border.primary}`,
|
|
2598
2548
|
boxSizing: 'border-box',
|
|
2599
2549
|
},
|
|
@@ -2643,6 +2593,20 @@ const getDataGridHeaderStyles = () => {
|
|
|
2643
2593
|
},
|
|
2644
2594
|
};
|
|
2645
2595
|
};
|
|
2596
|
+
const getDataGridRowStyles = () => ({
|
|
2597
|
+
[`& .${gridClasses.row}`]: {
|
|
2598
|
+
backgroundColor: semanticColors.surfaces.dataGrid.default,
|
|
2599
|
+
},
|
|
2600
|
+
[`& .${gridClasses.row}:hover`]: {
|
|
2601
|
+
backgroundColor: semanticColors.surfaces.dataGrid.hover,
|
|
2602
|
+
},
|
|
2603
|
+
[`& .${gridClasses.row}.Mui-selected`]: {
|
|
2604
|
+
backgroundColor: semanticColors.surfaces.dataGrid.selected,
|
|
2605
|
+
},
|
|
2606
|
+
[`& .${gridClasses.row}.Mui-selected:hover`]: {
|
|
2607
|
+
backgroundColor: semanticColors.surfaces.dataGrid.selectedHover,
|
|
2608
|
+
},
|
|
2609
|
+
});
|
|
2646
2610
|
|
|
2647
2611
|
/**
|
|
2648
2612
|
* Adapter to use NeoCheckbox in DataGrid's baseCheckbox slot
|
|
@@ -2677,7 +2641,7 @@ const DataGridCheckbox = ({ slotProps, ...props }) => (jsx(NeoCheckbox, { size:
|
|
|
2677
2641
|
* - `size` → Row heights (compact: 42px, standard: 48px, comfortable: 56px) and header heights (compact: 38px, standard: 44px, comfortable: 52px)
|
|
2678
2642
|
*
|
|
2679
2643
|
* Design tokens used:
|
|
2680
|
-
* - Colors: semanticColors.border.primary, semanticColors.
|
|
2644
|
+
* - Colors: semanticColors.border.primary, semanticColors.surfaces.dataGrid.*
|
|
2681
2645
|
* - Typography: typography.fontFamily.body, typography.fontSize.sm
|
|
2682
2646
|
* - Spacing: spacing.spacing_*
|
|
2683
2647
|
*
|
|
@@ -2721,13 +2685,14 @@ function NeoDataGrid({ autoHeight = false, toolbar, slots, sx, density = 'standa
|
|
|
2721
2685
|
// See: https://github.com/mui/mui-x/issues/20107
|
|
2722
2686
|
// This must be set to prevent scroll shadow artifacts
|
|
2723
2687
|
[`& .${gridClasses.main}`]: {
|
|
2724
|
-
backgroundColor: semanticColors.surfaces.
|
|
2688
|
+
backgroundColor: semanticColors.surfaces.dataGrid.background,
|
|
2725
2689
|
},
|
|
2726
2690
|
// White background for empty/loading overlays
|
|
2727
2691
|
[`& .${gridClasses.overlay}`]: {
|
|
2728
|
-
backgroundColor: semanticColors.surfaces.
|
|
2692
|
+
backgroundColor: semanticColors.surfaces.dataGrid.background,
|
|
2729
2693
|
},
|
|
2730
2694
|
...getDataGridHeaderStyles(),
|
|
2695
|
+
...getDataGridRowStyles(),
|
|
2731
2696
|
border: `1px solid ${semanticColors.border.secondary}`,
|
|
2732
2697
|
// Style row selection checkboxes to match header (16px, proper spacing)
|
|
2733
2698
|
[`& .${gridClasses.cellCheckbox}`]: {
|
|
@@ -3508,7 +3473,8 @@ const StyledNavButton = styled(IconButton, {
|
|
|
3508
3473
|
*/
|
|
3509
3474
|
const NeoIconButton = ({ size = 'medium', variant = 'tertiary', active = false, loading, children, ...props }) => {
|
|
3510
3475
|
if (variant === 'nav') {
|
|
3511
|
-
|
|
3476
|
+
const { color, ...navProps } = props;
|
|
3477
|
+
return (jsx(StyledNavButton, { size: size, active: active, disableRipple: true, ...navProps, children: children }));
|
|
3512
3478
|
}
|
|
3513
3479
|
return (jsx(StyledIconOnlyButton, { variant: variant, size: size, loading: loading, ...props, children: children }));
|
|
3514
3480
|
};
|
|
@@ -5181,9 +5147,9 @@ NeoModalFooter.displayName = 'NeoModalFooter';
|
|
|
5181
5147
|
const NavigationAvatarContainer = styled('div')({
|
|
5182
5148
|
display: 'flex',
|
|
5183
5149
|
boxSizing: 'border-box',
|
|
5184
|
-
width: spacing.
|
|
5185
|
-
height: spacing.
|
|
5186
|
-
padding: spacing.
|
|
5150
|
+
width: spacing.spacing_5,
|
|
5151
|
+
height: spacing.spacing_5,
|
|
5152
|
+
padding: spacing.spacing_1_2,
|
|
5187
5153
|
justifyContent: 'center',
|
|
5188
5154
|
alignItems: 'center',
|
|
5189
5155
|
borderRadius: '50%',
|
|
@@ -5196,8 +5162,8 @@ const NavigationAvatarContainer = styled('div')({
|
|
|
5196
5162
|
/**
|
|
5197
5163
|
* NeoNavigationAvatar - Compact avatar for navigation contexts
|
|
5198
5164
|
*
|
|
5199
|
-
* Wraps NeoGeneralAvatar (size="small") in a
|
|
5200
|
-
* providing
|
|
5165
|
+
* Wraps NeoGeneralAvatar (size="small") in a 40px container,
|
|
5166
|
+
* providing an interactive area for navigation UI.
|
|
5201
5167
|
*
|
|
5202
5168
|
* @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC?node-id=11325-102
|
|
5203
5169
|
*/
|
|
@@ -6681,5 +6647,5 @@ NeoTypologyControl.displayName = 'NeoTypologyControl';
|
|
|
6681
6647
|
|
|
6682
6648
|
const version = '0.0.0-development';
|
|
6683
6649
|
|
|
6684
|
-
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAlert, 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, NeoDivider, NeoDot, NeoDownloadToast, NeoSelect as NeoDropdown, NeoMenu as NeoDropdownMenu, NeoMenuItem as NeoDropdownMenuItem, NeoMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoIconWrapper, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, focusRingStyles, getDataGridHeaderStyles, neoRowHeights, version };
|
|
6650
|
+
export { ActivityScene, CIRCLE_RADIUS, NeoActivityHeader, NeoActivityIndicatorCell, NeoAlert, 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, NeoDivider, NeoDot, NeoDownloadToast, NeoSelect as NeoDropdown, NeoMenu as NeoDropdownMenu, NeoMenuItem as NeoDropdownMenuItem, NeoMenuItem as NeoDropdownOption, NeoFilterChip, NeoFooter, NeoGeneralAvatar, NeoIconButton, NeoIconWrapper, NeoInfiniteScrollGrid, NeoInputField, NeoListItem, NeoListItemButton, NeoLoadingSpinner, NeoMenu, NeoMenuItem, NeoModal, NeoModalContent, NeoModalFooter, NeoModalHeader, NeoMultiBadgesCell, NeoNavigationAvatar, NeoNavigationItem, NeoPageContent, NeoPaginatedGrid, NeoProgressbar, NeoQuickFilter, NeoRadio, NeoSearchChip, NeoSelect, NeoMenuItem as NeoSelectOption, NeoSkeleton, NeoStatusBadgeCell, NeoTab, NeoTabs, NeoTag, NeoToast, NeoToastButton, NeoToggle, NeoToolbar, NeoTooltip, NeoTreeItem, NeoTreeView, StyledToggleButton as NeoTypologyButton, NeoTypologyControl, NeoUserAvatarCell, SortedAscendingIcon, SortedDescendingIcon, UnsortedIcon, focusRingStyles, getDataGridHeaderStyles, getDataGridRowStyles, neoRowHeights, version };
|
|
6685
6651
|
//# sourceMappingURL=index.esm.js.map
|