@czi-sds/components 23.0.0 → 23.2.0

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.
@@ -80,11 +80,12 @@ interface BaseColor {
80
80
  backgroundPrimaryDark: string;
81
81
  backgroundPrimaryInverse: string;
82
82
  backgroundSecondary: string;
83
- backgroundSecondaryOnDark: string;
83
+ backgroundSecondaryDark: string;
84
84
  backgroundSecondaryInverse: string;
85
85
  backgroundTertiary: string;
86
- surface: string;
87
- surfaceOnDark: string;
86
+ surfacePrimary: string;
87
+ surfaceSecondary: string;
88
+ surfacePrimaryDark: string;
88
89
  surfaceInverse: string;
89
90
  textPrimary: string;
90
91
  textPrimaryOnDark: string;
@@ -99,15 +100,13 @@ interface BaseColor {
99
100
  textDisabledOnDark: string;
100
101
  textDisabledInverse: string;
101
102
  textOnFill: string;
102
- fillHover: string;
103
- fillHoverOnDark: string;
103
+ fillInteraction: string;
104
+ fillInteractionOnDark: string;
104
105
  fillHoverInverse: string;
105
106
  fillPressed: string;
106
107
  fillPressedOnDark: string;
107
108
  fillPressedInverse: string;
108
109
  fillPrimary: string;
109
- fillOpen: string;
110
- fillOpenOnDark: string;
111
110
  fillOpenInverse: string;
112
111
  fillSelected: string;
113
112
  fillDisabled: string;
@@ -118,12 +117,10 @@ interface BaseColor {
118
117
  borderPrimaryOnDark: string;
119
118
  borderPrimaryInverse: string;
120
119
  borderSecondary: string;
121
- borderPrimaryHover: string;
122
- borderPrimaryHoverOnDark: string;
120
+ borderPrimaryInteraction: string;
121
+ borderPrimaryInteractionOnDark: string;
123
122
  borderPrimaryHoverInverse: string;
124
123
  borderOnFill: string;
125
- borderPrimaryPressed: string;
126
- borderPrimaryPressedOnDark: string;
127
124
  borderPrimaryPressedInverse: string;
128
125
  borderPrimaryDisabled: string;
129
126
  borderPrimaryDisabledOnDark: string;
@@ -138,11 +135,9 @@ interface BaseColor {
138
135
  ornamentSecondary: string;
139
136
  ornamentSecondaryOnDark: string;
140
137
  ornamentSecondaryInverse: string;
141
- ornamentSecondaryHover: string;
142
- ornamentSecondaryHoverOnDark: string;
138
+ ornamentSecondaryInteraction: string;
139
+ ornamentSecondaryInteractionOnDark: string;
143
140
  ornamentSecondaryHoverInverse: string;
144
- ornamentSecondaryPressed: string;
145
- ornamentSecondaryPressedOnDark: string;
146
141
  ornamentSecondaryPressedInverse: string;
147
142
  }
148
143
  interface IntentColor {
@@ -950,6 +945,7 @@ interface StyleProps extends CommonThemeProps {
950
945
  interface AutocompleteOptionGeneral {
951
946
  name: string; // The name of the autocomplete option.
952
947
  section?: string; // An optional section for categorization.
948
+ disabled?: boolean; // An optional disabled flag.
953
949
  }
954
950
  // (masoudmanson): Represents a basic autocomplete option.
955
951
  interface AutocompleteOptionBasic extends AutocompleteOptionGeneral {
@@ -1327,6 +1323,7 @@ interface ExtraDropdownMenuProps extends StyleProps$1 {
1327
1323
  InputBaseProps?: Partial<InputSearchProps>;
1328
1324
  PopperBaseProps?: Partial<PopperProps>;
1329
1325
  title?: React.ReactNode;
1326
+ subTitle?: React.ReactNode;
1330
1327
  headerComponentSlot?: JSX.Element;
1331
1328
  label?: string;
1332
1329
  anchorEl: HTMLElement | null;
@@ -1701,6 +1698,20 @@ interface InputToggleExtraProps extends SwitchProps, CommonThemeProps {
1701
1698
  * @see https://mui.com/material-ui/react-switch/
1702
1699
  */
1703
1700
  declare const InputToggle: (props: InputToggleExtraProps) => import("react/jsx-runtime").JSX.Element;
1701
+ type IntentMessageIntent = "negative" | "notice" | "positive";
1702
+ interface IntentMessageItem {
1703
+ intent: IntentMessageIntent;
1704
+ icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
1705
+ text: string;
1706
+ }
1707
+ interface IntentMessageProps {
1708
+ autoOrder?: boolean;
1709
+ orderBy?: IntentMessageIntent[];
1710
+ children?: React.ReactNode;
1711
+ messages?: IntentMessageItem[];
1712
+ border?: boolean;
1713
+ }
1714
+ declare const IntentMessage: (props: IntentMessageProps) => JSX.Element;
1704
1715
  interface LegendItemData {
1705
1716
  /**
1706
1717
  * Name/label for the legend item
@@ -1969,6 +1980,7 @@ interface NavigationHeaderPrimaryNavProps<T extends string> {
1969
1980
  onDrawerStateChange?: (isOpen: boolean) => void;
1970
1981
  topOffset?: number;
1971
1982
  onClose?: () => void;
1983
+ onDrawerStyleNavItemHover?: (item: NavigationHeaderPrimaryNavItem<T>) => void;
1972
1984
  }
1973
1985
  interface BaseNavigationHeaderSecondaryNavItem<T extends string> extends Record<string, unknown> {
1974
1986
  key: T;
@@ -2003,6 +2015,7 @@ interface NavigationHeaderSecondaryNavProps<T extends string> {
2003
2015
  onDrawerStateChange?: (isOpen: boolean) => void;
2004
2016
  topOffset?: number;
2005
2017
  onClose?: () => void;
2018
+ onDrawerStyleNavItemHover?: (item: NavigationHeaderSecondaryNavItem<T>) => void;
2006
2019
  }
2007
2020
  interface NavigationHeaderProps<T extends string = string> extends Omit<AppBarProps, "position"> {
2008
2021
  activePrimaryNavKey?: string;
@@ -2026,6 +2039,7 @@ interface NavigationHeaderProps<T extends string = string> extends Omit<AppBarPr
2026
2039
  setDrawerOpen?: (open: boolean) => void;
2027
2040
  menuProps?: Partial<MenuProps$0>;
2028
2041
  sdsStyle?: "dropdown" | "drawer";
2042
+ onDrawerStyleNavItemHover?: (item: NavigationHeaderPrimaryNavItem<T> | NavigationHeaderSecondaryNavItem<T>) => void;
2029
2043
  isSticky?: boolean;
2030
2044
  topComponentSlot?: ReactNode;
2031
2045
  }
@@ -2250,5 +2264,5 @@ interface DiscreteColorGeneratorOptions {
2250
2264
  * @returns Array of color strings in hex format
2251
2265
  */
2252
2266
  declare const generateDiscreteColors: (count: number, options?: DiscreteColorGeneratorOptions) => string[];
2253
- export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps$0 as AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerIntentType, BannerProps, Banner, ButtonType$0 as ButtonType, ButtonTypeMap, ButtonSize, SdsIconButtonProps, SdsMinimalButtonProps, SdsButtonProps, SdsProps, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggleProps, ButtonToggle, CalloutIntentType, CalloutSdsStyleType, CalloutProps, ExposedCalloutProps, Callout, CalloutTitle, CellBasicRawProps, CellBasicProps, CellBasic, CellComponentProps, CellComponent, CellHeaderDirection, CellHeaderProps, CellHeader, Chip, DropdownInputDropdown as ComplexFilterInputDropdown, DropdownPopper as ComplexFilterPopper, ComplexFilterProps, ComplexFilter, ContentCardActions, StyledContentCardBody as ContentCardBody, CardMedia as ContentCardMedia, StyledTitleText as ContentCardTitle, StyledSubtitleText as ContentCardSubtitle, StyledMetadataText as ContentCardMetadata, StyledOverlineText as ContentCardOverline, ContentCard, DialogExtraProps, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPaper$1 as DropdownPaper, StyledPopper$1 as DropdownPopper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, Hero, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, Legend, LinkProps, Link, ListProps, List, ListItemLabel, ListItemProps, ListItem, ListSubheaderProps, ListSubheader, LoadingIndicatorProps$0 as LoadingIndicatorProps, LoadingIndicator, MenuProps, Menu, IconNameToSmallSizes, MenuItemExtraProps, MenuItemProps, MenuItem, DefaultMenuSelectOption, MenuSelectProps, MenuSelect, NavigationFooterNavItem, FooterImage, NavigationFooterProps, NavItemProps, FooterLinkProps, NavigationFooter, NavigationHeader, NavigationJumpToProps, NavigationJumpTo, NotificationIntentType, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, Panel, SingleButtonDefinition, SegmentedControlProps, SegmentedControl, SdsTableProps, TableProps, Table, TableHeaderProps, TableHeader, TableRowProps, TableRow, Tabs, TabProps$0 as TabProps, Tab, SdsTagProps, TagProps, Tag, SdsTagFilterProps, TagFilterProps, TagFilter, Tooltip, TooltipCondensedProps, TooltipCondensed, TooltipTableContent, TooltipTableContent as TooltipTable, AccentColor, BaseColor, IntentColor, SDSPalette, SDSTheme, SDSThemeOptions, AppTheme, Shadows, TypographyStyles, Typography, FontWeights, Corners, Spaces, Spacings, Color, Colors, IconSize, IconSizes, Border, Borders, Theme$0 as Theme, defaultTheme, SDSDarkThemeColors, SDSLightThemeColors, makeSdsSemanticAppTheme, SDSLightAppTheme, SDSDarkAppTheme, SDSChooseTheme, defaultAppTheme, SDSPaletteLight, SDSPaletteDark, makeThemeOptions, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontBodyXxxxs, fontBodyMediumL, fontBodyMediumM, fontBodyMediumS, fontBodyMediumXs, fontBodyMediumXxs, fontBodyMediumXxxs, fontBodyMediumXxxxs, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodySemiboldXxxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, fontCode, fontCodeXs, fontCodeS, fontCodeMediumXs, fontCodeMediumS, fontCodeSemiboldXs, fontCodeSemiboldS, fontTabular, fontTabularXxxxs, fontTabularXxxs, fontTabularXxs, fontTabularXs, fontTabularS, fontTabularMediumXxxxs, fontTabularMediumXxxs, fontTabularMediumXxs, fontTabularMediumXs, fontTabularMediumS, fontTabularSemiboldXxxxs, fontTabularSemiboldXxxs, fontTabularSemiboldXxs, fontTabularSemiboldXs, fontTabularSemiboldS, fontTitle, fontTitleBoldS, fontTitleBoldM, fontTitleBoldL, fontLink, fontLinkL, fontLinkM, fontLinkS, fontLinkXs, fontLinkXxs, fontLinkXxxs, fontLinkXxxxs, fontLinkMediumL, fontLinkMediumM, fontLinkMediumS, fontLinkMediumXs, fontLinkMediumXxs, fontLinkMediumXxxs, fontLinkMediumXxxxs, fontLinkSemiboldL, fontLinkSemiboldM, fontLinkSemiboldS, fontLinkSemiboldXs, fontLinkSemiboldXxs, fontLinkSemiboldXxxs, fontLinkSemiboldXxxxs, CommonThemeProps, getSpaces, getSpacings, getTypography, getMode, getPalette, getColors, getSemanticColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders, getBreakpoints, DiscreteColorGeneratorOptions, generateDiscreteColors };
2254
- export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, ContentCardProps, CardMediaProps as ContentCardMediaProps, ContentCardActionsProps, ContentCardTitleProps, HeroProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, LegendProps, LegendItemData, NavigationHeaderProps, IconButtonProps, NavigationHeaderPrimaryNavItem, NavigationHeaderPrimaryNavProps, NavigationHeaderSecondaryNavItem, NavigationHeaderSecondaryNavProps, PanelProps, BasicPanelProps, OverlayPanelProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };
2267
+ export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps$0 as AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerIntentType, BannerProps, Banner, ButtonType$0 as ButtonType, ButtonTypeMap, ButtonSize, SdsIconButtonProps, SdsMinimalButtonProps, SdsButtonProps, SdsProps, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggleProps, ButtonToggle, CalloutIntentType, CalloutSdsStyleType, CalloutProps, ExposedCalloutProps, Callout, CalloutTitle, CellBasicRawProps, CellBasicProps, CellBasic, CellComponentProps, CellComponent, CellHeaderDirection, CellHeaderProps, CellHeader, Chip, DropdownInputDropdown as ComplexFilterInputDropdown, DropdownPopper as ComplexFilterPopper, ComplexFilterProps, ComplexFilter, ContentCardActions, StyledContentCardBody as ContentCardBody, CardMedia as ContentCardMedia, StyledTitleText as ContentCardTitle, StyledSubtitleText as ContentCardSubtitle, StyledMetadataText as ContentCardMetadata, StyledOverlineText as ContentCardOverline, ContentCard, DialogExtraProps, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPaper$1 as DropdownPaper, StyledPopper$1 as DropdownPopper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, Hero, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, IntentMessage, Legend, LinkProps, Link, ListProps, List, ListItemLabel, ListItemProps, ListItem, ListSubheaderProps, ListSubheader, LoadingIndicatorProps$0 as LoadingIndicatorProps, LoadingIndicator, MenuProps, Menu, IconNameToSmallSizes, MenuItemExtraProps, MenuItemProps, MenuItem, DefaultMenuSelectOption, MenuSelectProps, MenuSelect, NavigationFooterNavItem, FooterImage, NavigationFooterProps, NavItemProps, FooterLinkProps, NavigationFooter, NavigationHeader, NavigationJumpToProps, NavigationJumpTo, NotificationIntentType, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, Panel, SingleButtonDefinition, SegmentedControlProps, SegmentedControl, SdsTableProps, TableProps, Table, TableHeaderProps, TableHeader, TableRowProps, TableRow, Tabs, TabProps$0 as TabProps, Tab, SdsTagProps, TagProps, Tag, SdsTagFilterProps, TagFilterProps, TagFilter, Tooltip, TooltipCondensedProps, TooltipCondensed, TooltipTableContent, TooltipTableContent as TooltipTable, AccentColor, BaseColor, IntentColor, SDSPalette, SDSTheme, SDSThemeOptions, AppTheme, Shadows, TypographyStyles, Typography, FontWeights, Corners, Spaces, Spacings, Color, Colors, IconSize, IconSizes, Border, Borders, Theme$0 as Theme, defaultTheme, SDSDarkThemeColors, SDSLightThemeColors, makeSdsSemanticAppTheme, SDSLightAppTheme, SDSDarkAppTheme, SDSChooseTheme, defaultAppTheme, SDSPaletteLight, SDSPaletteDark, makeThemeOptions, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontBodyXxxxs, fontBodyMediumL, fontBodyMediumM, fontBodyMediumS, fontBodyMediumXs, fontBodyMediumXxs, fontBodyMediumXxxs, fontBodyMediumXxxxs, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodySemiboldXxxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, fontCode, fontCodeXs, fontCodeS, fontCodeMediumXs, fontCodeMediumS, fontCodeSemiboldXs, fontCodeSemiboldS, fontTabular, fontTabularXxxxs, fontTabularXxxs, fontTabularXxs, fontTabularXs, fontTabularS, fontTabularMediumXxxxs, fontTabularMediumXxxs, fontTabularMediumXxs, fontTabularMediumXs, fontTabularMediumS, fontTabularSemiboldXxxxs, fontTabularSemiboldXxxs, fontTabularSemiboldXxs, fontTabularSemiboldXs, fontTabularSemiboldS, fontTitle, fontTitleBoldS, fontTitleBoldM, fontTitleBoldL, fontLink, fontLinkL, fontLinkM, fontLinkS, fontLinkXs, fontLinkXxs, fontLinkXxxs, fontLinkXxxxs, fontLinkMediumL, fontLinkMediumM, fontLinkMediumS, fontLinkMediumXs, fontLinkMediumXxs, fontLinkMediumXxxs, fontLinkMediumXxxxs, fontLinkSemiboldL, fontLinkSemiboldM, fontLinkSemiboldS, fontLinkSemiboldXs, fontLinkSemiboldXxs, fontLinkSemiboldXxxs, fontLinkSemiboldXxxxs, CommonThemeProps, getSpaces, getSpacings, getTypography, getMode, getPalette, getColors, getSemanticColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders, getBreakpoints, DiscreteColorGeneratorOptions, generateDiscreteColors };
2268
+ export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, ContentCardProps, CardMediaProps as ContentCardMediaProps, ContentCardActionsProps, ContentCardTitleProps, HeroProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, IntentMessageItem, IntentMessageProps, LegendProps, LegendItemData, NavigationHeaderProps, IconButtonProps, NavigationHeaderPrimaryNavItem, NavigationHeaderPrimaryNavProps, NavigationHeaderSecondaryNavItem, NavigationHeaderSecondaryNavProps, PanelProps, BasicPanelProps, OverlayPanelProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };