@czi-sds/components 22.3.3 → 22.5.0

package/dist/index.cjs.d.ts

@@ -364,10 +364,65 @@ declare const Theme$0: (t: PaletteMode) => import("@mui/material").Theme;
  * Use the `theme` export to get a flexible light/dark mode theme function
  */
 declare const defaultTheme: import("@mui/material").Theme;
+declare const createAppThemeBorders: (colors: Colors, isDarkMode: boolean) => {
+    accent: {
+        default: string;
+        focused: string;
+        hover: string;
+        open: string;
+        pressed: string;
+        selected: string;
+    };
+    base: {
+        default: string;
+        disabled: string;
+        divider: string;
+        dividerInverse: string;
+        hover: string;
+        inverse: string;
+        pressed: string;
+        table: string;
+    };
+    beta: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+    info: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+    link: {
+        dashed: string;
+        solid: string;
+    };
+    negative: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+    neutral: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+    none: string;
+    notice: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+    positive: {
+        default: string;
+        extraThick: string;
+        thick: string;
+    };
+};
 /**
  * Create a SDS App Theme with custom colors that follows the SDS color model.
  */
-declare const makeSdsSemanticAppTheme: (colors: Colors) => AppTheme;
+declare const makeSdsSemanticAppTheme: (colors: Colors, isDarkTheme?: boolean) => AppTheme;
 declare const SDSLightAppTheme: AppTheme;
 declare const SDSDarkAppTheme: AppTheme;
 /**
@@ -811,6 +866,9 @@ declare const Button: React.ForwardRefExoticComponent<(Omit<SdsIconButtonProps,
 interface BannerExtraProps extends CommonThemeProps {
     sdsType: "primary" | "secondary";
 }
+type ButtonType$0 = ButtonProps & {
+    bannerType: string;
+} & CommonThemeProps;
 interface BannerProps extends BannerExtraProps {
     children: React.ReactNode;
     icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
@@ -820,19 +878,18 @@ interface BannerProps extends BannerExtraProps {
     onClose?: (e: React.MouseEvent) => void;
 }
 declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<HTMLDivElement | null>>;
-type SDSButtonDropdownSizes = "small" | "medium" | "large";
 type SdsProps$0 = {
     sdsStyle: "icon";
-    sdsType?: "primary" | "secondary" | "tertiary";
+    sdsType?: ButtonTypeMap["icon"];
     icon: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
     sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>>;
-    sdsSize?: SDSButtonDropdownSizes;
+    sdsSize?: ButtonSize;
 } | {
     sdsStyle: "rounded" | "square";
-    sdsType?: "primary" | "secondary" | "destructive";
+    sdsType?: ButtonTypeMap["rounded"];
     icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
     sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>>;
-    sdsSize?: SDSButtonDropdownSizes;
+    sdsSize?: ButtonSize;
 };
 type ButtonDropdownProps = ButtonProps & SdsProps$0;
 /**
@@ -843,13 +900,13 @@ declare const ButtonDropdown: React.ForwardRefExoticComponent<(Omit<SdsIconButto
     sdsType?: "primary" | "secondary" | "tertiary" | undefined;
     icon: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
     sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>> | undefined;
-    sdsSize?: SDSButtonDropdownSizes | undefined;
+    sdsSize?: ButtonSize | undefined;
 }, "ref"> | Omit<SdsButtonProps & {
     sdsStyle: "rounded" | "square";
     sdsType?: "primary" | "secondary" | "destructive" | undefined;
     icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps, string | React.JSXElementConstructor<any>> | undefined;
     sdsIconProps?: Partial<IconProps<keyof IconNameToSizes>> | undefined;
-    sdsSize?: SDSButtonDropdownSizes | undefined;
+    sdsSize?: ButtonSize | undefined;
 }, "ref">) & React.RefAttributes<HTMLButtonElement>>;
 interface ButtonIconExtraProps extends CommonThemeProps {
     disabled?: boolean;
@@ -1108,40 +1165,15 @@ declare const StyledContentCardBody: import("@emotion/styled").StyledComponent<i
 }, "className" | "style" | "classes" | "children" | "sx"> & {
     theme?: import("@emotion/react").Theme | undefined;
 } & CardExtraProps, {}, {}>;
-interface ContentCardTitleProps {
-    overlineText?: string;
-    titleText?: string;
-    subtitleText?: string;
-    metadataText?: string;
-    classes?: {
-        cardHeader?: string;
-        cardOverline?: string;
-        cardTitle?: string;
-        cardSubtitle?: string;
-        cardMetadata?: string;
-    };
-}
-interface ContentCardActionsProps {
-    buttonsPosition?: "left" | "right";
-    clickableCard?: ContentCardProps["clickableCard"];
-    classes?: {
-        cardActions?: string;
-    };
-    children: React.ReactElement<ButtonProps> | Array<React.ReactElement<ButtonProps>>;
-}
-/**
- * @see https://mui.com/material-ui/api/card-actions/
- */
-declare const ContentCardActions: React.ForwardRefExoticComponent<ContentCardActionsProps & React.RefAttributes<HTMLDivElement>>;
 interface BaseContentCardProps extends CardProps {
     sdsType?: "wide" | "narrow";
-    overlineText?: string;
-    titleText?: string;
-    subtitleText?: string;
-    metadataText?: string;
+    overlineText?: ReactNode;
+    titleText?: ReactNode;
+    subtitleText?: ReactNode;
+    metadataText?: ReactNode;
     boundingBox?: boolean;
     decorativeBorder?: boolean;
-    children?: React.ReactNode;
+    children?: ReactNode;
     clickableCard?: boolean;
     clickableCardProps?: Partial<SdsMinimalButtonProps>;
     buttonsPosition?: "left" | "right";
@@ -1160,7 +1192,7 @@ interface BaseContentCardProps extends CardProps {
 }
 interface ImageContentCardProps extends BaseContentCardProps {
     visualElementType: "image";
-    image?: React.ReactNode;
+    image?: ReactNode;
     imagePosition?: "left" | "right";
     imagePadding?: boolean;
     imageSize?: number;
@@ -1168,7 +1200,7 @@ interface ImageContentCardProps extends BaseContentCardProps {
 }
 interface IconContentCardProps extends BaseContentCardProps {
     visualElementType: "icon";
-    icon?: React.ReactNode;
+    icon?: ReactNode;
     image?: never;
     imageSize?: never;
     imagePosition?: never;
@@ -1183,6 +1215,31 @@ interface NoneContentCardProps extends BaseContentCardProps {
     imageSize?: never;
 }
 type ContentCardProps = ImageContentCardProps | IconContentCardProps | NoneContentCardProps;
+interface ContentCardTitleProps extends Pick<BaseContentCardProps, "overlineText" | "titleText" | "subtitleText" | "metadataText"> {
+    classes?: {
+        cardHeader?: string;
+        cardOverline?: string;
+        cardTitle?: string;
+        cardSubtitle?: string;
+        cardMetadata?: string;
+    };
+}
+interface ContentCardActionsProps {
+    buttonsPosition?: "left" | "right";
+    clickableCard?: ContentCardProps["clickableCard"];
+    classes?: {
+        cardActions?: string;
+    };
+    children: React.ReactElement<ButtonProps> | Array<React.ReactElement<ButtonProps>>;
+}
+/**
+ * @see https://mui.com/material-ui/api/card-actions/
+ */
+declare const ContentCardActions: React.ForwardRefExoticComponent<ContentCardActionsProps & React.RefAttributes<HTMLDivElement>>;
+declare const StyledOverlineText: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CommonThemeProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+declare const StyledTitleText: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CommonThemeProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+declare const StyledSubtitleText: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CommonThemeProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+declare const StyledMetadataText: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CommonThemeProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
 /**
  * @see https://mui.com/material-ui/react-card/
  */
@@ -1490,13 +1547,29 @@ interface FooterLinkProps {
     hasInvertedStyle?: boolean;
 }
 declare function NavigationFooter({ hasInvertedStyle, images, logo, logoUrl, logoComponent, logoLinkProps, navItems, navLinks, tag, tagColor, title, ...rest }: NavigationFooterProps): import("react/jsx-runtime").JSX.Element;
-interface NavigationHeaderPrimaryNavItem<T extends string> extends Record<string, unknown> {
+interface BaseNavigationHeaderPrimaryNavItem<T extends string> extends Record<string, unknown> {
     key: T;
     label: ReactNode;
+}
+interface TextNavigationHeaderPrimaryNavItem<T extends string> extends BaseNavigationHeaderPrimaryNavItem<T> {
+    itemType: "text";
     tag?: string;
     tagColor?: SdsTagColorType;
     onClick?: (e: React.SyntheticEvent) => void;
 }
+interface DropdownItem {
+    label: ReactNode;
+    onClick?: () => void;
+    component?: React.ElementType;
+    href?: string;
+    rel?: string;
+    target?: string;
+}
+interface DropdownNavigationHeaderPrimaryNavItem<T extends string> extends BaseNavigationHeaderPrimaryNavItem<T> {
+    itemType: "dropdown";
+    items: DropdownItem[];
+}
+type NavigationHeaderPrimaryNavItem<T extends string> = TextNavigationHeaderPrimaryNavItem<T> | DropdownNavigationHeaderPrimaryNavItem<T>;
 interface NavigationHeaderPrimaryNavProps<T extends string> {
     hasInvertedStyle?: boolean;
     isNarrow?: boolean;
@@ -1504,16 +1577,22 @@ interface NavigationHeaderPrimaryNavProps<T extends string> {
     onChange(value: T): void;
     value: T;
 }
-interface BaseHeaderSecondaryNavItem extends Partial<SdsMinimalButtonProps> {
+interface TextHeaderSecondaryNavItem extends Partial<SdsMinimalButtonProps> {
     label: string;
-}
-interface TextHeaderSecondaryNavItem extends BaseHeaderSecondaryNavItem {
-    onClick?(): void;
     itemType: "text";
 }
-interface DropdownHeaderSecondaryNavItem extends BaseHeaderSecondaryNavItem {
+interface DropdownItem$0 {
+    label: ReactNode;
+    onClick?: (event: React.MouseEvent) => void;
+    component?: React.ElementType;
+    href?: string;
+    rel?: string;
+    target?: string;
+}
+interface DropdownHeaderSecondaryNavItem extends Partial<SdsMinimalButtonProps> {
+    label: string;
     itemType: "dropdown";
-    items: Pick<TextHeaderSecondaryNavItem, "label" | "onClick" | "component" | "href" | "rel" | "target">[];
+    items: DropdownItem$0[];
 }
 type NavigationHeaderSecondaryNavItem = TextHeaderSecondaryNavItem | DropdownHeaderSecondaryNavItem;
 interface NavigationHeaderSecondaryNavProps {
@@ -1709,5 +1788,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, 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, 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 };
+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, 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, InputDropdown as ComplexFilterInputDropdown, InputDropdown as DropdownInputDropdown, InputDropdown, StyledPopper$1 as ComplexFilterPopper, StyledPopper$1 as DropdownPopper, ComplexFilterProps, ComplexFilter, ContentCardActions, StyledContentCardBody as ContentCardBody, CardMedia as ContentCardMedia, StyledTitleText as ContentCardTitle, StyledSubtitleText as ContentCardSubtitle, StyledMetadataText as ContentCardMetadata, StyledOverlineText as ContentCardOverline, 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, 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, createAppThemeBorders, 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 };
 export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ChipProps, ContentCardProps, CardMediaProps as ContentCardMediaProps, ContentCardActionsProps, ContentCardTitleProps, IconNameToSizes, InputToggleExtraProps as InputToggleProps, NavigationHeaderProps, IconButtonProps, NavigationHeaderPrimaryNavItem, NavigationHeaderPrimaryNavProps, NavigationHeaderSecondaryNavItem, NavigationHeaderSecondaryNavProps, PanelProps, BasicPanelProps, OverlayPanelProps, TabsProps$0 as TabsProps, SdsTagColorType, TooltipProps, TooltipTableContentProps };