@czi-sds/components 19.2.0 → 19.3.0

package/dist/index.esm.d.ts

@@ -232,11 +232,13 @@ interface IconNameToSizes {
     check: "xs" | "s";
     checkCircle: "xs" | "s" | "l" | "xl";
     chevronDown: "xs" | "s" | "l" | "xl";
+    chevronDown2: "xs" | "s";
     chevronLeft2: "xs" | "s";
     chevronLeft: "xs" | "s" | "l" | "xl";
     chevronRight2: "xs" | "s";
     chevronRight: "xs" | "s" | "l" | "xl";
     chevronUp: "xs" | "s" | "l" | "xl";
+    chevronUp2: "xs" | "s";
     circlesOverlap: "xs" | "s" | "l" | "xl";
     code: "l" | "xl";
     compass: "l" | "xl";
@@ -247,6 +249,7 @@ interface IconNameToSizes {
     dotsHorizontal: "xs" | "s" | "l" | "xl";
     download: "xs" | "s" | "l" | "xl";
     edit: "xs" | "s" | "l" | "xl";
+    envelope: "xs" | "s";
     exclamationMarkCircle: "xs" | "s" | "l" | "xl";
     exclamationMarkSpeechBubble: "l" | "xl";
     eyeClosed: "xs" | "s";
@@ -265,6 +268,7 @@ interface IconNameToSizes {
     grid: "l" | "xl";
     gridPrivate: "l" | "xl";
     gridPublic: "l" | "xl";
+    gridThreeDots: "l" | "xl";
     house: "xs" | "s";
     infoCircle: "xs" | "s" | "l" | "xl";
     infoSpeechBubble: "l" | "xl";
@@ -292,7 +296,9 @@ interface IconNameToSizes {
     puzzlePiece: "xs" | "s";
     questionMark: "l" | "xl";
     quote: "l" | "xl";
+    read: "l" | "xl";
     refresh: "xs" | "s" | "l" | "xl";
+    rocket: "l" | "xl";
     save: "l" | "xl";
     search: "xs" | "s" | "l" | "xl";
     searchLinesHorizontal: "xs" | "s" | "l" | "xl";
@@ -314,9 +320,11 @@ interface IconNameToSizes {
     triangleLeft: "xs" | "s";
     triangleRight: "xs" | "s";
     triangleUp: "xs" | "s";
+    updated: "l" | "xl";
     upload: "l" | "xl";
     virus: "l" | "xl";
     virusCircleS: "l" | "xl";
+    widget: "l" | "xl";
     xMark: "xs" | "s" | "l" | "xl";
     xMarkCircle: "xs" | "s";
 }
@@ -379,7 +387,13 @@ type IconNameToSmallSizes = {
 interface MenuItemExtraProps<IconName extends keyof IconNameToSmallSizes> {
     column?: React.ReactNode;
     isMultiSelect?: boolean;
-    sdsIcon?: IconName;
+    icon?: IconName | React.ReactElement<CustomSVGProps>;
+    /**
+     * @deprecated Use `icon` instead.
+     * (masoudmanson): This prop is deprecated and will be removed in the next major version.
+     * Please replace instances of `sdsIcon` with `icon`.
+     */
+    sdsIcon?: IconName | React.ReactElement<CustomSVGProps>;
     sdsIconProps?: Partial<IconProps<IconName>>;
     sdsStyle?: "determinate" | "indeterminate";
 }
@@ -387,7 +401,7 @@ type MenuItemProps<IconName extends keyof IconNameToSmallSizes> = MenuItemExtraP
 /**
  * @see https://mui.com/material-ui/react-menu/
  */
-declare const MenuItem: React.ForwardRefExoticComponent<Omit<MenuItemProps<"link" | "search" | "table" | "filter" | "download" | "bacteria" | "barChartHorizontal3" | "barChartVertical3" | "barChartVertical4" | "check" | "checkCircle" | "chevronDown" | "chevronLeft2" | "chevronLeft" | "chevronRight2" | "chevronRight" | "chevronUp" | "circlesOverlap" | "copy" | "document" | "dotsHorizontal" | "edit" | "exclamationMarkCircle" | "eyeClosed" | "eyeOpen" | "flagCheck" | "flagOutline" | "flagQuestionmark" | "flagXmark" | "gear" | "globe" | "house" | "infoCircle" | "lifeRing" | "lightBulb" | "linesDashed3Solid1" | "linesHorizontal" | "list" | "loading" | "lock" | "lockCircle" | "minus" | "open" | "people" | "percentage" | "person" | "pin" | "pinLocation" | "plus" | "plusCircle" | "puzzlePiece" | "refresh" | "searchLinesHorizontal" | "starburst" | "trashCan" | "treeHorizontal" | "treeVertical" | "triangleDown" | "triangleLeft" | "triangleRight" | "triangleUp" | "xMark" | "xMarkCircle">, "ref"> & React.RefAttributes<HTMLLIElement | null>>;
+declare const MenuItem: React.ForwardRefExoticComponent<Omit<MenuItemProps<"link" | "search" | "table" | "filter" | "download" | "bacteria" | "barChartHorizontal3" | "barChartVertical3" | "barChartVertical4" | "check" | "checkCircle" | "chevronDown" | "chevronDown2" | "chevronLeft2" | "chevronLeft" | "chevronRight2" | "chevronRight" | "chevronUp" | "chevronUp2" | "circlesOverlap" | "copy" | "document" | "dotsHorizontal" | "edit" | "envelope" | "exclamationMarkCircle" | "eyeClosed" | "eyeOpen" | "flagCheck" | "flagOutline" | "flagQuestionmark" | "flagXmark" | "gear" | "globe" | "house" | "infoCircle" | "lifeRing" | "lightBulb" | "linesDashed3Solid1" | "linesHorizontal" | "list" | "loading" | "lock" | "lockCircle" | "minus" | "open" | "people" | "percentage" | "person" | "pin" | "pinLocation" | "plus" | "plusCircle" | "puzzlePiece" | "refresh" | "searchLinesHorizontal" | "starburst" | "trashCan" | "treeHorizontal" | "treeVertical" | "triangleDown" | "triangleLeft" | "triangleRight" | "triangleUp" | "xMark" | "xMarkCircle">, "ref"> & React.RefAttributes<HTMLLIElement | null>>;
 interface StyleProps extends CommonThemeProps {
     count?: number;
     icon?: ReactElement;
@@ -403,7 +417,7 @@ interface AutocompleteOptionGeneral {
 interface AutocompleteOptionBasic extends AutocompleteOptionGeneral {
     count?: number; // An optional count associated with the option.
     details?: string; // An optional string for additional details.
-    sdsIcon?: keyof IconNameToSmallSizes; // An optional icon key.
+    icon?: keyof IconNameToSmallSizes | React.ReactElement<CustomSVGProps>; // An optional icon key.
     sdsIconProps?: Partial<IconProps<keyof IconNameToSmallSizes>>; // Optional properties for the associated icon.
 }
 // (masoudmanson): Represents an autocomplete option that includes a custom React component.
@@ -505,7 +519,13 @@ interface ButtonIconExtraProps<ButtonIconSize extends keyof ButtonIconSizeToType
     sdsType?: ButtonIconSizeToTypes[ButtonIconSize];
 }
 interface ButtonIconInternalProps<IconName extends keyof IconNameToSizes> {
-    sdsIcon: IconName;
+    icon: IconName | React.ReactElement<CustomSVGProps>;
+    /**
+     * @deprecated
+     * (masoudmanson): This prop is deprecated and will be removed in the next major version.
+     * Please use `icon` instead.
+     */
+    sdsIcon?: IconName | React.ReactElement<CustomSVGProps>;
     sdsIconProps?: Partial<IconProps<IconName>>;
 }
 type ButtonIconProps<IconName extends keyof IconNameToSizes, ButtonIconSize extends keyof ButtonIconSizeToTypes> = ButtonIconExtraProps<ButtonIconSize> & RawButtonIconProps & ButtonIconInternalProps<IconName>;
@@ -518,6 +538,8 @@ interface BannerExtraProps<ButtonIconSize extends keyof ButtonIconSizeToTypes> e
 }
 interface BannerProps<ButtonIconSize extends keyof ButtonIconSizeToTypes> extends BannerExtraProps<ButtonIconSize> {
     children: React.ReactNode;
+    icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>>;
     dismissed?: boolean;
     dismissible?: boolean;
     onClose?: (e: React.MouseEvent) => void;
@@ -540,7 +562,6 @@ type ButtonProps<C extends React.ElementType = "button"> = RawButtonProps<C, {
 declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 interface SdsProps$0 {
     icon?: JSX.Element;
-    isRounded?: boolean;
     sdsStyle?: "rounded" | "square";
     sdsType?: "primary" | "secondary";
 }
@@ -557,7 +578,8 @@ interface CalloutProps {
     autoDismiss?: boolean | number;
     dismissed?: boolean;
     expandable?: boolean;
-    icon?: React.ReactNode;
+    icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>>;
     intent: "info" | "error" | "success" | "warning";
     sdsStage?: typeof SDS_STAGE_CLOSED | typeof SDS_STAGE_OPEN;
 }
@@ -565,8 +587,11 @@ type ExposedCalloutProps = AlertProps & CalloutProps;
 /**
  * @see https://mui.com/material-ui/react-alert/
  */
-declare const Callout: ({ autoDismiss, children, dismissed, expandable, onClose, icon, intent, sdsStage, ...rest }: ExposedCalloutProps) => JSX.Element;
-declare const CalloutTitle: ({ children }: AlertTitleProps) => JSX.Element;
+declare const Callout: ({ autoDismiss, children, dismissed, expandable, onClose, icon, sdsIconProps, intent, sdsStage, ...rest }: ExposedCalloutProps) => JSX.Element;
+declare const CalloutTitle: {
+    ({ children }: AlertTitleProps): JSX.Element;
+    displayName: string;
+};
 interface TooltipExtraProps extends CommonThemeProps {
     // TODO(185930): remove custom `followCursor` prop when we upgrade to MUIv5
     arrowOffset?: number;
@@ -602,7 +627,7 @@ interface CellBasicContentProps extends Omit<React.HTMLProps<HTMLTableCellElemen
     tertiaryText?: string;
     tertiaryTextWrapLineCount?: number;
     shouldTextWrap?: boolean;
-    icon?: JSX.Element;
+    icon?: React.ReactElement<CustomSVGProps>;
     iconVerticalAlign?: "top" | "center" | "bottom";
 }
 interface CellBasicRawProps {
@@ -736,7 +761,6 @@ interface ComplexFilterProps<T extends DefaultAutocompleteOption, Multiple exten
     className?: string;
     PopperComponent?: typeof StyledPopper$1;
     InputDropdownComponent?: typeof InputDropdown;
-    isTriggerChangeOnOptionClick?: boolean;
 }
 // eslint-disable-next-line sonarjs/cognitive-complexity
 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, ...rest }: ComplexFilterProps<T, Multiple, DisableClearable, FreeSolo>) => JSX.Element;
@@ -860,7 +884,7 @@ type InputTextProps = RawTextFieldProps & InputTextExtraProps & AccessibleInputT
  * @see https://mui.com/material-ui/react-text-field/
  */
 declare const InputText: import("react").ForwardRefExoticComponent<(Omit<import("@mui/material").StandardTextFieldProps & InputTextExtraProps & AccessibleInputTextProps, "ref"> | Omit<import("@mui/material").FilledTextFieldProps & InputTextExtraProps & AccessibleInputTextProps, "ref"> | Omit<import("@mui/material").OutlinedTextFieldProps & InputTextExtraProps & AccessibleInputTextProps, "ref">) & import("react").RefAttributes<HTMLInputElement>>;
-interface InputToggleExtraProps extends Omit<SwitchProps, "nonce" | "rev" | "rel" | "autoFocus" | "content">, CommonThemeProps {
+interface InputToggleExtraProps extends SwitchProps, CommonThemeProps {
     offLabel?: string;
     onChange?(e: React.ChangeEvent): void;
     onLabel?: string;
@@ -961,12 +985,14 @@ interface NotificationProps {
     slideDirection: "left" | "right";
     extraContent?: boolean;
     intent: "info" | "error" | "success" | "warning";
+    icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>>;
 }
 type ExposedNotificationProps = AlertProps & NotificationProps;
 /**
  * @see https://mui.com/material-ui/react-alert/
  */
-declare const Notification: ({ autoDismiss, children, dismissed, slideDirection, intent, onClose, buttonOnClick, buttonText, ...rest }: ExposedNotificationProps) => JSX.Element;
+declare const Notification: ({ autoDismiss, children, dismissed, slideDirection, intent, onClose, buttonOnClick, buttonText, icon, sdsIconProps, ...rest }: ExposedNotificationProps) => JSX.Element;
 interface PaginationExtraProps extends CommonThemeProps {
     sdsStyle?: "round" | "square";
     disabled?: boolean;
@@ -988,7 +1014,7 @@ declare const Pagination: import("react").ForwardRefExoticComponent<PaginationEx
 // one prop is array of objects: with icon name and tooltip text. They need to make
 // first item in array first button, etc
 interface SingleButtonDefinition {
-    iconName: string;
+    icon: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
     tooltipText: string;
 }
 interface SegmentedControlExtraProps extends Omit<ToggleButtonGroupProps, "color"> {
@@ -1105,5 +1131,5 @@ type TooltipTableContentProps = TooltipTableExtraProps;
  * @see https://mui.com/material-ui/react-table/
  */
 declare const TooltipTableContent: (props: TooltipTableContentProps) => JSX.Element;
-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, SdsProps, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIcon, 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, 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, NavigationJumpToProps, NavigationJumpTo, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, 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, defaultAppTheme, makeThemeOptions, SDSTheme, SDSThemeOptions, Shadows, Typography, FontWeights, Corners, Spaces, Spacings, Color, Colors, IconSizes, Border, Borders, defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, CommonThemeProps, getSpaces, getSpacings, getTypography, getPalette, getColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders };
+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, SdsProps, ButtonProps, Button, ButtonDropdownProps, ButtonDropdown, ButtonIconInternalProps, ButtonIcon, 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, 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, NavigationJumpToProps, NavigationJumpTo, NotificationProps, ExposedNotificationProps, Notification, PaginationInternalProps, PaginationProps, Pagination, 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, defaultAppTheme, makeThemeOptions, SDSTheme, SDSThemeOptions, Shadows, Typography, FontWeights, Corners, Spaces, Spacings, Color, Colors, IconSizes, Border, Borders, defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL, fontBodyM, fontBodyS, fontBodyXs, fontBodyXxs, fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontHeader, fontHeaderXxl, fontHeaderXl, fontHeaderL, fontHeaderM, fontHeaderS, fontHeaderXs, fontHeaderXxs, fontHeaderXxxs, CommonThemeProps, getSpaces, getSpacings, getTypography, getPalette, getColors, getShadows, getCorners, getFontWeights, getIconSizes, getBorders };
 export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ButtonIconProps, ButtonIconSizeToTypes, ChipProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };