@czi-sds/components 22.2.1 → 22.3.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.
- package/dist/index.cjs.d.ts +107 -13
- package/dist/index.cjs.js +921 -354
- package/dist/index.esm.d.ts +107 -13
- package/dist/index.esm.js +917 -357
- package/dist/tailwind.json +18 -18
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/variables.css +18 -18
- package/dist/variables.scss +18 -18
- package/package.json +2 -2
package/dist/index.cjs.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { AccordionDetailsProps, PaletteMode, PopperProps, AutocompleteInputChangeReason, AutocompleteRenderInputParams, PaperProps, SliderProps, SwitchProps, TabsProps, DrawerProps, ToggleButtonGroupProps } from "@mui/material";
|
|
2
|
+
import { AccordionDetailsProps, PaletteMode, PopperProps, AutocompleteInputChangeReason, AutocompleteRenderInputParams, PaperProps, CardMedia, CardMediaProps, CardProps, SliderProps, SwitchProps, TabsProps, DrawerProps, ToggleButtonGroupProps } from "@mui/material";
|
|
3
3
|
import { AccordionProps as RawAccordionProps } from "@mui/material";
|
|
4
4
|
import { AccordionSummaryProps as RawAccordionSummaryProps } from "@mui/material";
|
|
5
5
|
import { AutocompleteChangeDetails as AutocompleteChangeDetails$0 } from "@mui/material";
|
|
@@ -32,7 +32,7 @@ import { ChipProps as ChipProps$0 } from "@mui/material";
|
|
|
32
32
|
import { TabProps as RawTabProps } from "@mui/material";
|
|
33
33
|
import { TabsProps as RawTabsProps } from "@mui/material";
|
|
34
34
|
import React from "react";
|
|
35
|
-
import { CSSProperties, ReactElement, ReactNode, SyntheticEvent, ComponentType } from "react";
|
|
35
|
+
import { CSSProperties, ReactElement, ReactNode, SyntheticEvent, ComponentType, ElementType } from "react";
|
|
36
36
|
import { Theme, ThemeOptions, TypographyStyle, Breakpoints, PaletteOptions } from "@mui/material/styles";
|
|
37
37
|
import { SerializedStyles } from "@emotion/react";
|
|
38
38
|
import { AlertProps } from "@mui/lab";
|
|
@@ -90,16 +90,16 @@ interface BaseColor {
|
|
|
90
90
|
fillDisabled: string;
|
|
91
91
|
divider: string;
|
|
92
92
|
dividerInverse: string;
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
93
|
+
borderPrimary: string;
|
|
94
|
+
borderPrimaryInverse: string;
|
|
95
|
+
borderSecondary: string;
|
|
96
|
+
borderPrimaryHover: string;
|
|
97
|
+
borderPrimaryHoverInverse: string;
|
|
97
98
|
borderOnFill: string;
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
borderTable: string;
|
|
99
|
+
borderPrimaryPressed: string;
|
|
100
|
+
borderPrimaryPressedInverse: string;
|
|
101
|
+
borderPrimaryDisabled: string;
|
|
102
|
+
borderPrimaryDisabledInverse: string;
|
|
103
103
|
ornamentDisabled: string;
|
|
104
104
|
ornamentDisabledInverse: string;
|
|
105
105
|
ornamentOnFill: string;
|
|
@@ -1118,6 +1118,68 @@ interface ComplexFilterProps<T extends DefaultAutocompleteOption, Multiple exten
|
|
|
1118
1118
|
}
|
|
1119
1119
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
1120
1120
|
declare const ComplexFilter: <T extends DefaultAutocompleteOption, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined>({ options, label, multiple, search, onChange, DropdownMenuProps, InputDropdownProps, value: propValue, PopperComponent, InputDropdownComponent, isTriggerChangeOnOptionClick, ...rest }: ComplexFilterProps<T, Multiple, DisableClearable, FreeSolo>) => JSX.Element;
|
|
1121
|
+
type CardExtraProps = Partial<ContentCardProps> & CommonThemeProps;
|
|
1122
|
+
declare const StyledContentCardBody: import("@emotion/styled").StyledComponent<import("@mui/material").CardContentOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
1123
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
1124
|
+
}, "className" | "style" | "classes" | "children" | "sx"> & {
|
|
1125
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
1126
|
+
} & CardExtraProps, {}, {}>;
|
|
1127
|
+
interface ContentCardTitleProps {
|
|
1128
|
+
overlineText?: string;
|
|
1129
|
+
titleText?: string;
|
|
1130
|
+
subtitleText?: string;
|
|
1131
|
+
metadataText?: string;
|
|
1132
|
+
}
|
|
1133
|
+
interface ContentCardActionsProps {
|
|
1134
|
+
buttonsPosition?: "left" | "right";
|
|
1135
|
+
clickableCard?: ContentCardProps["clickableCard"];
|
|
1136
|
+
children: React.ReactElement<ButtonProps> | Array<React.ReactElement<ButtonProps>>;
|
|
1137
|
+
}
|
|
1138
|
+
/**
|
|
1139
|
+
* @see https://mui.com/material-ui/api/card-actions/
|
|
1140
|
+
*/
|
|
1141
|
+
declare const ContentCardActions: React.ForwardRefExoticComponent<ContentCardActionsProps & React.RefAttributes<HTMLDivElement>>;
|
|
1142
|
+
interface BaseContentCardProps extends CardProps {
|
|
1143
|
+
sdsType?: "wide" | "narrow";
|
|
1144
|
+
overlineText?: string;
|
|
1145
|
+
titleText?: string;
|
|
1146
|
+
subtitleText?: string;
|
|
1147
|
+
metadataText?: string;
|
|
1148
|
+
boundingBox?: boolean;
|
|
1149
|
+
decorativeBorder?: boolean;
|
|
1150
|
+
children?: React.ReactNode;
|
|
1151
|
+
clickableCard?: boolean;
|
|
1152
|
+
buttonsPosition?: "left" | "right";
|
|
1153
|
+
}
|
|
1154
|
+
interface ImageContentCardProps extends BaseContentCardProps {
|
|
1155
|
+
visualElementType: "image";
|
|
1156
|
+
image?: React.ReactNode;
|
|
1157
|
+
imagePosition?: "left" | "right";
|
|
1158
|
+
imagePadding?: boolean;
|
|
1159
|
+
imageSize?: number;
|
|
1160
|
+
icon?: never;
|
|
1161
|
+
}
|
|
1162
|
+
interface IconContentCardProps extends BaseContentCardProps {
|
|
1163
|
+
visualElementType: "icon";
|
|
1164
|
+
icon?: React.ReactNode;
|
|
1165
|
+
image?: never;
|
|
1166
|
+
imageSize?: never;
|
|
1167
|
+
imagePosition?: never;
|
|
1168
|
+
imagePadding?: never;
|
|
1169
|
+
}
|
|
1170
|
+
interface NoneContentCardProps extends BaseContentCardProps {
|
|
1171
|
+
visualElementType: "none";
|
|
1172
|
+
icon?: never;
|
|
1173
|
+
image?: never;
|
|
1174
|
+
imagePosition?: never;
|
|
1175
|
+
imagePadding?: never;
|
|
1176
|
+
imageSize?: never;
|
|
1177
|
+
}
|
|
1178
|
+
type ContentCardProps = ImageContentCardProps | IconContentCardProps | NoneContentCardProps;
|
|
1179
|
+
/**
|
|
1180
|
+
* @see https://mui.com/material-ui/react-card/
|
|
1181
|
+
*/
|
|
1182
|
+
declare const ContentCard: React.ForwardRefExoticComponent<(Omit<ImageContentCardProps, "ref"> | Omit<IconContentCardProps, "ref"> | Omit<NoneContentCardProps, "ref">) & React.RefAttributes<HTMLDivElement>>;
|
|
1121
1183
|
type DialogPaperProps = PaperProps;
|
|
1122
1184
|
/**
|
|
1123
1185
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -1385,6 +1447,38 @@ type TagProps = SdsTagProps & ExtraTagProps;
|
|
|
1385
1447
|
* [string, string, string] - applies custom colors for [font, background, icon]
|
|
1386
1448
|
*/
|
|
1387
1449
|
declare const Tag: (props: TagProps) => JSX.Element;
|
|
1450
|
+
interface NavigationFooterNavItem {
|
|
1451
|
+
label: string;
|
|
1452
|
+
url: string;
|
|
1453
|
+
component?: ElementType;
|
|
1454
|
+
linkProps?: Record<string, unknown>;
|
|
1455
|
+
}
|
|
1456
|
+
interface FooterImage {
|
|
1457
|
+
image: ReactNode;
|
|
1458
|
+
url: string;
|
|
1459
|
+
}
|
|
1460
|
+
interface NavigationFooterProps {
|
|
1461
|
+
hasInvertedStyle?: boolean;
|
|
1462
|
+
images?: FooterImage[];
|
|
1463
|
+
logo?: ReactNode;
|
|
1464
|
+
logoUrl?: string;
|
|
1465
|
+
navItems?: NavigationFooterNavItem[];
|
|
1466
|
+
navLinks?: NavigationFooterNavItem[];
|
|
1467
|
+
tag?: string;
|
|
1468
|
+
tagColor?: TagProps["tagColor"];
|
|
1469
|
+
title: string;
|
|
1470
|
+
}
|
|
1471
|
+
interface NavItemProps {
|
|
1472
|
+
item: NavigationFooterNavItem;
|
|
1473
|
+
hasInvertedStyle?: boolean;
|
|
1474
|
+
isNarrow?: boolean;
|
|
1475
|
+
}
|
|
1476
|
+
interface FooterLinkProps {
|
|
1477
|
+
link: NavigationFooterNavItem;
|
|
1478
|
+
showDivider: boolean;
|
|
1479
|
+
hasInvertedStyle?: boolean;
|
|
1480
|
+
}
|
|
1481
|
+
declare function NavigationFooter({ hasInvertedStyle, images, logo, logoUrl, navItems, navLinks, tag, tagColor, title, ...rest }: NavigationFooterProps): import("react/jsx-runtime").JSX.Element;
|
|
1388
1482
|
interface NavigationHeaderPrimaryNavItem<T extends string> extends Record<string, unknown> {
|
|
1389
1483
|
key: T;
|
|
1390
1484
|
label: ReactNode;
|
|
@@ -1587,5 +1681,5 @@ type TooltipTableContentProps = TooltipTableExtraProps;
|
|
|
1587
1681
|
* @see https://mui.com/material-ui/react-table/
|
|
1588
1682
|
*/
|
|
1589
1683
|
declare const TooltipTableContent: (props: TooltipTableContentProps) => JSX.Element;
|
|
1590
|
-
export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerProps, Banner, 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, InputDropdown as ComplexFilterInputDropdown, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPopper$1 as ComplexFilterPopper, StyledPopper$1 as DropdownPopper, ComplexFilterProps, ComplexFilter, DialogContext, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle$0 as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, StyledPaper$1 as DropdownPaper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, LinkProps$0 as LinkProps, Link, ListProps, List, ListItemLabel, ListItemProps, ListItem, ListSubheaderProps, ListSubheader, LoadingIndicatorProps$0 as LoadingIndicatorProps, LoadingIndicator, MenuProps, Menu, IconNameToSmallSizes, MenuItemExtraProps, MenuItemProps, MenuItem, DefaultMenuSelectOption, MenuSelectProps, MenuSelect, NavigationHeaderProps, IconButtonProps, 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, makeSdsSemanticAppTheme, SDSLightAppTheme, SDSDarkAppTheme, SDSChooseTheme, defaultAppTheme, SDSPaletteLight, SDSPaletteDark, makeThemeOptions, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, fontCode, fontCodeXs, fontCodeS, fontCodeSemiboldXs, fontCodeSemiboldS, fontTabular, fontTabularXs, fontTabularS, fontTabularSemiboldXs, fontTabularSemiboldS, CommonThemeProps, getSpaces, getSpacings, getTypography, getMode, getPalette, getColors, getSemanticColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders, getBreakpoints };
|
|
1591
|
-
export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, PanelProps, BasicPanelProps, OverlayPanelProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };
|
|
1684
|
+
export { AccordionDetails, AccordionHeader, AccordionProps, Accordion, Alert, AutocompleteSingleColumnOption, AutocompleteMultiColumnOption, SDSAutocompleteOptions, AutocompleteMultiColumnValue, AutocompleteSingleColumnValue, SDSAutocompleteValue, AutocompleteSingleColumnOnChange, AutocompleteMultiColumnOnChange, SDSAutocompleteOnChange, AutocompleteProps, StyledPopper as AutocompleteMultiColumnStyledPopper, StyledPaper$0 as AutocompleteSingleColumnStyledPaper, Autocomplete$0 as Autocomplete, BannerProps, Banner, 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, InputDropdown as ComplexFilterInputDropdown, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPopper$1 as ComplexFilterPopper, StyledPopper$1 as DropdownPopper, ComplexFilterProps, ComplexFilter, ContentCardActions, StyledContentCardBody as ContentCardBody, CardMedia as ContentCardMedia, ContentCard, DialogContext, DialogProps, Dialog, DialogActionsProps, DialogActions, DialogContentProps, _default, _default as DialogContent, DialogPaperProps, DialogPaper, Subtitle$0 as DialogTitleSubtitle, Title as DialogTitleTitle, Overline as DialogTitleOverline, DialogTitleProps, DialogTitle, StyledPaper$1 as DropdownPaper, ExtraDropdownProps, DropdownProps, Dropdown, DefaultDropdownMenuOption, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, DropdownMenuProps, DropdownMenu, SdsIconWithColor$0 as SdsIconWithColor, IconProps, Icon, CheckboxProps, InputCheckbox, InputDropdownProps$0 as InputDropdownProps, RadioContentProps, RadioProps, InputRadio, AccessibleInputSearchProps, InputSearchProps, InputSearch, InputSliderProps, InputSlider, InputTextProps, InputText, InputToggle, LinkProps$0 as 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, NavigationHeaderProps, IconButtonProps, 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, makeSdsSemanticAppTheme, SDSLightAppTheme, SDSDarkAppTheme, SDSChooseTheme, defaultAppTheme, SDSPaletteLight, SDSPaletteDark, makeThemeOptions, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, fontCode, fontCodeXs, fontCodeS, fontCodeSemiboldXs, fontCodeSemiboldS, fontTabular, fontTabularXs, fontTabularS, fontTabularSemiboldXs, fontTabularSemiboldS, CommonThemeProps, getSpaces, getSpacings, getTypography, getMode, getPalette, getColors, getSemanticColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders, getBreakpoints };
|
|
1685
|
+
export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, ContentCardProps, CardMediaProps as ContentCardMediaProps, ContentCardActionsProps, ContentCardTitleProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, PanelProps, BasicPanelProps, OverlayPanelProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };
|