@czi-sds/components 23.4.0 → 23.5.0

package/dist/index.cjs.d.ts

@@ -32,6 +32,7 @@ import { MenuProps as RawMenuProps } from "@mui/material";
 import { ChipProps as ChipProps$0 } from "@mui/material";
 import { LinkProps as LinkProps$0 } from "@mui/material";
 import { MenuProps as MenuProps$0 } from "@mui/material";
+import { PopoverProps as RawPopoverProps } from "@mui/material";
 import { TabProps as RawTabProps } from "@mui/material";
 import { TabsProps as RawTabsProps } from "@mui/material";
 import React from "react";
@@ -2252,6 +2253,11 @@ type PanelProps = BasicPanelProps | OverlayPanelProps;
  * @see https://mui.com/material-ui/react-drawer/
  */
 declare const Panel: React.ForwardRefExoticComponent<(Omit<BasicPanelProps, "ref"> | Omit<OverlayPanelProps, "ref">) & React.RefAttributes<HTMLDivElement>>;
+type PopoverProps = RawPopoverProps;
+/**
+ * @see https://mui.com/material-ui/react-popover/
+ */
+declare const Popover: import("react").ForwardRefExoticComponent<Omit<RawPopoverProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 interface RowExtraProps extends CommonThemeProps, Omit<React.HTMLProps<HTMLTableRowElement>, "as" | "rev"> {
     rowHeight?: number;
     useDivider?: boolean;
@@ -2308,7 +2314,14 @@ declare const PreComposedTable: <TData extends unknown>({ data, columns, border,
 // first item in array first button, etc
 interface SingleButtonDefinition {
     disabled?: boolean;
-    icon: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    label?: string;
+    shouldShowTooltip?: boolean;
+    tooltipProps?: Partial<Omit<TooltipProps, "children">>;
+    /**
+     * @deprecated Use `tooltipProps` instead.
+     * Example: `{ tooltipProps: { title: "My tooltip" } }`
+     */
     tooltipText?: string;
     value: string;
 }
@@ -2424,5 +2437,5 @@ interface DiscreteColorGeneratorOptions {
  * @returns Array of color strings in hex format
  */
 declare const generateDiscreteColors: (count: number, options?: DiscreteColorGeneratorOptions) => string[];
-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, Button, ButtonDropdown, isIconOnlyButton, ButtonGroup, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggle, ButtonLegacyType, ButtonLegacyTypeMap, ButtonLegacySize, SdsIconButtonLegacyProps, SdsMinimalButtonLegacyProps, SdsButtonLegacyProps, SdsLegacyProps, ButtonLegacyProps, ButtonLegacy, ButtonDropdownLegacyProps, ButtonDropdownLegacy, ButtonToggleLegacyProps, ButtonToggleLegacy, 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, CheckboxContentProps, 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, PreComposedTableProps, RowHoverContext, PreComposedTable, 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 };
+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, Button, ButtonDropdown, isIconOnlyButton, ButtonGroup, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggle, ButtonLegacyType, ButtonLegacyTypeMap, ButtonLegacySize, SdsIconButtonLegacyProps, SdsMinimalButtonLegacyProps, SdsButtonLegacyProps, SdsLegacyProps, ButtonLegacyProps, ButtonLegacy, ButtonDropdownLegacyProps, ButtonDropdownLegacy, ButtonToggleLegacyProps, ButtonToggleLegacy, 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, CheckboxContentProps, 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, PopoverProps, Popover, PreComposedTableProps, RowHoverContext, PreComposedTable, 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 };
 export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ButtonProps, ButtonDropdownProps, ButtonGroupProps, ButtonToggleProps, 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 };

package/dist/index.cjs.js

@@ -7397,6 +7397,9 @@ var SDSWarningTypes;
     SDSWarningTypes["TooltipInvertStyle"] = "tooltipInvertStyle";
     SDSWarningTypes["ContentCardActionsOnlyButtons"] = "contentCardActionsOnlyButtons";
     SDSWarningTypes["ClickableContentCardNumberOfButtons"] = "clickableContentCardNumberOfButtons";
+    SDSWarningTypes["SegmentedControlTooltipTextDeprecated"] = "segmentedControlTooltipTextDeprecated";
+    SDSWarningTypes["SegmentedControlMissingIconOrLabel"] = "segmentedControlMissingIconOrLabel";
+    SDSWarningTypes["SegmentedControlIconAndLabelConflict"] = "segmentedControlIconAndLabelConflict";
 })(SDSWarningTypes || (SDSWarningTypes = {}));
 const SDS_WARNINGS = {
     [SDSWarningTypes.ButtonMinimalIsAllCaps]: {
@@ -7454,6 +7457,21 @@ const SDS_WARNINGS = {
     [SDSWarningTypes.ClickableContentCardNumberOfButtons]: {
         hasWarned: false,
         message: "Warning: Clickable Content Cards can only have one or no buttons!"
+    },
+    [SDSWarningTypes.SegmentedControlTooltipTextDeprecated]: {
+        hasWarned: false,
+        message: 'Warning: "tooltipText" in SegmentedControl buttonDefinition is deprecated. ' +
+            'Please use "tooltipProps" instead. Example: { tooltipProps: { title: "My tooltip" } }'
+    },
+    [SDSWarningTypes.SegmentedControlMissingIconOrLabel]: {
+        hasWarned: false,
+        message: 'Warning: Each SegmentedControl button must have either an "icon" or a "label" prop. ' +
+            "A button was found with neither."
+    },
+    [SDSWarningTypes.SegmentedControlIconAndLabelConflict]: {
+        hasWarned: false,
+        message: 'Warning: Each SegmentedControl button should have either an "icon" or a "label", ' +
+            "not both. Please use only one per button."
     }
 };
 const showWarningIfFirstOccurence = (warningType) => {
@@ -7501,6 +7519,10 @@ const GeneralButtonGroupStyles = (props) => {
       min-width: fit-content;
       z-index: 1;
 
+      &::before {
+        border-radius: inherit;
+      }
+
       &:hover,
       &:active,
       &:focus {
@@ -7607,10 +7629,11 @@ const LargeButtonGroupStyles = (props) => {
       }
     }
 
-    /* Icon-only buttons: has svg but no startIcon/endIcon slots */
+    /* Icon-only buttons: has svg but no startIcon/endIcon slots, or startIcon is the only child (e.g. ButtonToggle) */
     .${material.buttonGroupClasses.grouped}:has(svg):not(
         :has(.${material.buttonClasses.startIcon})
-      ):not(:has(.${material.buttonClasses.endIcon})) {
+      ):not(:has(.${material.buttonClasses.endIcon})),
+    .${material.buttonGroupClasses.grouped}:has(> .${material.buttonClasses.startIcon}:only-child) {
       padding: ${iconOnlyPaddingWide};
 
       ${theme?.breakpoints?.down("md")} {
@@ -7618,8 +7641,10 @@ const LargeButtonGroupStyles = (props) => {
       }
     }
 
-    /* Text + icon buttons: has startIcon or endIcon */
-    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}),
+    /* Text + icon buttons: has startIcon or endIcon (excluding icon-only ButtonToggle) */
+    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}):not(
+        :has(> .${material.buttonClasses.startIcon}:only-child)
+      ),
     .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.endIcon}) {
       ${theme?.breakpoints?.down("md")} {
         padding: 0 14px;
@@ -7685,10 +7710,11 @@ const MediumButtonGroupStyles = (props) => {
       }
     }
 
-    /* Icon-only buttons: has svg but no startIcon/endIcon slots */
+    /* Icon-only buttons: has svg but no startIcon/endIcon slots, or startIcon is the only child (e.g. ButtonToggle) */
     .${material.buttonGroupClasses.grouped}:has(svg):not(
         :has(.${material.buttonClasses.startIcon})
-      ):not(:has(.${material.buttonClasses.endIcon})) {
+      ):not(:has(.${material.buttonClasses.endIcon})),
+    .${material.buttonGroupClasses.grouped}:has(> .${material.buttonClasses.startIcon}:only-child) {
       padding: ${iconOnlyPaddingWide};
 
       ${theme?.breakpoints?.down("md")} {
@@ -7696,8 +7722,10 @@ const MediumButtonGroupStyles = (props) => {
       }
     }
 
-    /* Text + icon buttons: has startIcon or endIcon - ensure spaceS (8px) padding on wide screen */
-    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}),
+    /* Text + icon buttons: has startIcon or endIcon (excluding icon-only ButtonToggle) */
+    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}):not(
+        :has(> .${material.buttonClasses.startIcon}:only-child)
+      ),
     .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.endIcon}) {
       padding: 0 10px;
     }
@@ -7761,10 +7789,11 @@ const SmallButtonGroupStyles = (props) => {
       }
     }
 
-    /* Icon-only buttons: has svg but no startIcon/endIcon slots */
+    /* Icon-only buttons: has svg but no startIcon/endIcon slots, or startIcon is the only child (e.g. ButtonToggle) */
     .${material.buttonGroupClasses.grouped}:has(svg):not(
         :has(.${material.buttonClasses.startIcon})
-      ):not(:has(.${material.buttonClasses.endIcon})) {
+      ):not(:has(.${material.buttonClasses.endIcon})),
+    .${material.buttonGroupClasses.grouped}:has(> .${material.buttonClasses.startIcon}:only-child) {
       padding: ${iconOnlyPaddingWide};
 
       ${theme?.breakpoints?.down("md")} {
@@ -7772,8 +7801,10 @@ const SmallButtonGroupStyles = (props) => {
       }
     }
 
-    /* Text + icon buttons: has startIcon or endIcon - ensure spaceS (8px) padding on wide screen */
-    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}),
+    /* Text + icon buttons: has startIcon or endIcon (excluding icon-only ButtonToggle) */
+    .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.startIcon}):not(
+        :has(> .${material.buttonClasses.startIcon}:only-child)
+      ),
     .${material.buttonGroupClasses.grouped}:has(.${material.buttonClasses.endIcon}) {
       padding: 0 ${spaces?.s}px;
     }
@@ -7822,6 +7853,7 @@ const PrimaryButtonGroupStyles = (props) => {
     && .${material.buttonGroupClasses.grouped} {
       background-color: transparent;
       border: 1px solid ${defaultColor};
+      box-shadow: none;
       color: ${defaultColor};
 
       svg {
@@ -7833,6 +7865,7 @@ const PrimaryButtonGroupStyles = (props) => {
       color: ${hoverColor};
       background-color: ${hoverBgColor};
       border: 1px solid ${hoverColor};
+      box-shadow: none;
 
       svg {
         color: ${hoverColor};
@@ -7843,6 +7876,7 @@ const PrimaryButtonGroupStyles = (props) => {
       color: ${pressedColor};
       background-color: ${hoverBgColor};
       border: 1px solid ${pressedColor};
+      box-shadow: none;
 
       svg {
         color: ${pressedColor};
@@ -7857,6 +7891,7 @@ const PrimaryButtonGroupStyles = (props) => {
       color: ${textDisabledColor};
       background-color: transparent;
       border: 1px solid ${disabledColor};
+      box-shadow: none;
 
       svg {
         color: ${ornamentDisabledColor};
@@ -7910,6 +7945,7 @@ const SecondaryButtonGroupStyles = (props) => {
     && .${material.buttonGroupClasses.grouped} {
       background-color: transparent;
       border: 1px solid ${defaultColor};
+      box-shadow: none;
       color: ${textColor};
 
       svg {
@@ -7921,6 +7957,7 @@ const SecondaryButtonGroupStyles = (props) => {
       color: ${textColor};
       background-color: ${hoverBgColor};
       border: 1px solid ${defaultColor};
+      box-shadow: none;
 
       svg {
         color: ${ornamentColor};
@@ -7931,6 +7968,7 @@ const SecondaryButtonGroupStyles = (props) => {
       color: ${textColor};
       background-color: ${pressedBgColor};
       border: 1px solid ${defaultColor};
+      box-shadow: none;
 
       svg {
         color: ${ornamentColor};
@@ -7945,6 +7983,7 @@ const SecondaryButtonGroupStyles = (props) => {
       color: ${textDisabledColor};
       background-color: transparent;
       border: 1px solid ${disabledColor};
+      box-shadow: none;
 
       svg {
         color: ${ornamentDisabledColor};
@@ -8283,29 +8322,44 @@ const StageOnStyles = (props) => {
     // So we need to apply the "on" state background to ::before as well
     const isSecondary = sdsType === "secondary";
     if (isSecondary) {
+        /**
+         * Specificity boost via Emotion's `&&&&` technique.
+         *
+         * Each `&` repeats the component's generated class, producing a selector
+         * like `.css-abc123.css-abc123.css-abc123.css-abc123` — specificity (0,4,0).
+         *
+         * This is needed because ButtonGroup styles its children with
+         * `&& .MuiButtonGroup-grouped` which has specificity (0,3,0).
+         * Without the boost, the sdsStage="on" styles would always lose
+         * the cascade to the ButtonGroup's parent-level overrides.
+         */
         return react.css `
-      color: ${contentColor};
+      &&&& {
+        color: ${contentColor};
 
-      svg {
-        color: ${ornamentColor};
-      }
+        svg {
+          color: ${ornamentColor};
+        }
 
-      /* Apply "on" state background via ::before to match Button's hover pattern */
-      &::before {
-        background-color: ${sdsStyle === "minimal" && !backgroundOnHover
+        /* Apply "on" state background via ::before to match Button's hover pattern */
+        &::before {
+          background-color: ${sdsStyle === "minimal" && !backgroundOnHover
             ? "transparent"
             : backgroundColor};
+        }
       }
     `;
     }
     return react.css `
-    background-color: ${sdsStyle === "minimal" && !backgroundOnHover
+    &&&& {
+      background-color: ${sdsStyle === "minimal" && !backgroundOnHover
         ? "transparent"
         : backgroundColor};
-    color: ${contentColor};
+      color: ${contentColor};
 
-    svg {
-      color: ${ornamentColor};
+      svg {
+        color: ${ornamentColor};
+      }
     }
   `;
 };
@@ -18590,6 +18644,41 @@ const Panel = React__namespace.default.forwardRef((props, ref) => {
         }, slotProps: SLOT_PROPS, hideBackdrop: !isBackdropClickEnabled, children: [isOverlayPanelProps(props) && (jsxRuntime.jsxs(StyledHeaderComponent, { children: [props?.HeaderComponent && (jsxRuntime.jsx(PanelHeader, { children: props?.HeaderComponent })), jsxRuntime.jsx(PanelHeaderClose, { onClick: props?.closeButtonOnClick, CloseButtonComponent: props?.CloseButtonComponent })] })), children] })));
 });
 
+const StyledPopover = styled__default.default(material.Popover) `
+  & .${material.popoverClasses.paper} {
+    ${(props) => {
+    const corners = getCorners(props);
+    const shadows = getShadows(props);
+    const semanticColors = getSemanticColors(props);
+    const borders = getBorders(props);
+    const spaces = getSpaces(props);
+    return `
+        background-color: ${semanticColors?.base?.surfacePrimary};
+        background-image: none;
+        border-radius: ${corners?.l}px;
+        padding: ${spaces?.xs}px ${spaces?.m}px;
+        border: ${borders?.none};
+        outline: 1px solid ${addOpacityToHex(semanticColors?.base?.borderSecondary || "#000000", 15)};
+        box-shadow: ${shadows?.m};
+        box-sizing: border-box;
+        z-index: ${props?.theme?.zIndex?.tooltip ?? 1400};
+      `;
+}}
+  }
+`;
+
+/**
+ * @see https://mui.com/material-ui/react-popover/
+ */
+const Popover = React.forwardRef(function Popover(props, ref) {
+    const theme = material.useTheme();
+    const spaces = getSpaces({ theme });
+    return (jsxRuntime.jsx(StyledPopover, __assign({ ref: ref, anchorOrigin: {
+            horizontal: "left",
+            vertical: "bottom"
+        }, transformOrigin: { vertical: -(spaces?.s || 8), horizontal: 0 } }, props)));
+});
+
 const doNotForwardProps = ["buttonDefinition"];
 const StyledSegmentedControl = styled__default.default(material.ToggleButtonGroup, {
     shouldForwardProp: (prop) => !doNotForwardProps.includes(prop)
@@ -18631,7 +18720,6 @@ const StyledSegmentedControl = styled__default.default(material.ToggleButtonGrou
         ${focusVisibleA11yStyle(props)}
         background-color: transparent;
         border: none;
-        line-height: 0px;
         color: ${semanticColors?.base?.ornamentSecondary};
         padding: ${spaces?.xxs}px ${spaces?.m}px;
         border-radius: ${corners?.m}px;
@@ -18660,6 +18748,14 @@ const StyledToggleButton = styled__default.default(material.ToggleButton, {
     `;
 }}
 `;
+const StyledToggleButtonIcon = styled__default.default("div") `
+  line-height: 0px;
+`;
+const StyledToggleButtonLabel = styled__default.default("div") `
+  ${fontBodyMediumS}
+  white-space: nowrap;
+  line-height: 16px !important;
+`;
 
 /**
  * @see https://mui.com/material-ui/react-toggle-button/
@@ -18679,13 +18775,27 @@ const SegmentedControl = (props) => {
             onChangeProp(event, newActive);
         }
     };
-    return (jsxRuntime.jsxs(StyledSegmentedControl, __assign({ "aria-label": "Segmented Control", size: "small", value: value, exclusive: true, onChange: handleActive }, restProps, { children: [buttonDefinition.map((button) => {
-                const { icon, tooltipText, value: buttonValue, disabled = false, } = button;
-                const iconItem = icon ? (typeof icon !== "string" ? (icon) : (jsxRuntime.jsx(Icon, { sdsIcon: icon, sdsSize: "s" }))) : null;
-                const toggleButton = (jsxRuntime.jsx(StyledToggleButton, { "aria-label": tooltipText ?? buttonValue, value: buttonValue, disabled: disabled, children: jsxRuntime.jsx("span", { tabIndex: -1, children: iconItem }) }, buttonValue));
-                // (masoudmanson): If the button is disabled, we don't want to show the tooltip.
-                return disabled ? (toggleButton) : (jsxRuntime.jsx(Tooltip, { title: tooltipText ?? buttonValue, sdsStyle: "dark", arrow: true, children: toggleButton }, buttonValue));
-            }), ";"] })));
+    return (jsxRuntime.jsx(StyledSegmentedControl, __assign({ "aria-label": "Segmented Control", size: "small", value: value, exclusive: true, onChange: handleActive }, restProps, { children: buttonDefinition.map((button) => {
+            const { icon, label, shouldShowTooltip = true, tooltipProps, tooltipText, value: buttonValue, disabled = false, } = button;
+            if (tooltipText) {
+                showWarningIfFirstOccurence(SDSWarningTypes.SegmentedControlTooltipTextDeprecated);
+            }
+            if (!icon && !label) {
+                showWarningIfFirstOccurence(SDSWarningTypes.SegmentedControlMissingIconOrLabel);
+            }
+            if (icon && label) {
+                showWarningIfFirstOccurence(SDSWarningTypes.SegmentedControlIconAndLabelConflict);
+            }
+            const iconItem = icon ? (typeof icon !== "string" ? (icon) : (jsxRuntime.jsx(Icon, { sdsIcon: icon, sdsSize: "s" }))) : null;
+            const buttonContent = label ? (jsxRuntime.jsx(StyledToggleButtonLabel, { children: label })) : iconItem ? (jsxRuntime.jsx(StyledToggleButtonIcon, { children: iconItem })) : (jsxRuntime.jsx(StyledToggleButtonLabel, { children: buttonValue }));
+            const toggleButton = (jsxRuntime.jsx(StyledToggleButton, { "aria-label": tooltipText ?? label ?? buttonValue, value: buttonValue, disabled: disabled, children: jsxRuntime.jsx("span", { tabIndex: -1, children: buttonContent }) }, buttonValue));
+            // Resolve the tooltip title: tooltipText takes priority,
+            // then tooltipProps.title, then label, then falls back to buttonValue.
+            const resolvedTitle = tooltipText ?? tooltipProps?.title ?? label ?? buttonValue;
+            // (masoudmanson): If the button is disabled or shouldShowTooltip
+            // is false, we don't render the tooltip.
+            return disabled || !shouldShowTooltip ? (toggleButton) : (React.createElement(Tooltip, __assign({ arrow: true }, tooltipProps, { title: resolvedTitle, key: buttonValue }), toggleButton));
+        }) })));
 };
 
 const TabsContext = React.createContext({ sdsSize: "large" });
@@ -22590,6 +22700,7 @@ exports.NavigationJumpTo = NavigationJumpTo;
 exports.Notification = Notification;
 exports.Pagination = Pagination;
 exports.Panel = Panel;
+exports.Popover = Popover;
 exports.PreComposedTable = PreComposedTable;
 exports.RowHoverContext = RowHoverContext;
 exports.SDSChooseTheme = SDSChooseTheme;

package/dist/index.esm.d.ts

@@ -32,6 +32,7 @@ import { MenuProps as RawMenuProps } from "@mui/material";
 import { ChipProps as ChipProps$0 } from "@mui/material";
 import { LinkProps as LinkProps$0 } from "@mui/material";
 import { MenuProps as MenuProps$0 } from "@mui/material";
+import { PopoverProps as RawPopoverProps } from "@mui/material";
 import { TabProps as RawTabProps } from "@mui/material";
 import { TabsProps as RawTabsProps } from "@mui/material";
 import React from "react";
@@ -2252,6 +2253,11 @@ type PanelProps = BasicPanelProps | OverlayPanelProps;
  * @see https://mui.com/material-ui/react-drawer/
  */
 declare const Panel: React.ForwardRefExoticComponent<(Omit<BasicPanelProps, "ref"> | Omit<OverlayPanelProps, "ref">) & React.RefAttributes<HTMLDivElement>>;
+type PopoverProps = RawPopoverProps;
+/**
+ * @see https://mui.com/material-ui/react-popover/
+ */
+declare const Popover: import("react").ForwardRefExoticComponent<Omit<RawPopoverProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 interface RowExtraProps extends CommonThemeProps, Omit<React.HTMLProps<HTMLTableRowElement>, "as" | "rev"> {
     rowHeight?: number;
     useDivider?: boolean;
@@ -2308,7 +2314,14 @@ declare const PreComposedTable: <TData extends unknown>({ data, columns, border,
 // first item in array first button, etc
 interface SingleButtonDefinition {
     disabled?: boolean;
-    icon: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    icon?: keyof IconNameToSizes | React.ReactElement<CustomSVGProps>;
+    label?: string;
+    shouldShowTooltip?: boolean;
+    tooltipProps?: Partial<Omit<TooltipProps, "children">>;
+    /**
+     * @deprecated Use `tooltipProps` instead.
+     * Example: `{ tooltipProps: { title: "My tooltip" } }`
+     */
     tooltipText?: string;
     value: string;
 }
@@ -2424,5 +2437,5 @@ interface DiscreteColorGeneratorOptions {
  * @returns Array of color strings in hex format
  */
 declare const generateDiscreteColors: (count: number, options?: DiscreteColorGeneratorOptions) => string[];
-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, Button, ButtonDropdown, isIconOnlyButton, ButtonGroup, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggle, ButtonLegacyType, ButtonLegacyTypeMap, ButtonLegacySize, SdsIconButtonLegacyProps, SdsMinimalButtonLegacyProps, SdsButtonLegacyProps, SdsLegacyProps, ButtonLegacyProps, ButtonLegacy, ButtonDropdownLegacyProps, ButtonDropdownLegacy, ButtonToggleLegacyProps, ButtonToggleLegacy, 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, CheckboxContentProps, 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, PreComposedTableProps, RowHoverContext, PreComposedTable, 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 };
+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, Button, ButtonDropdown, isIconOnlyButton, ButtonGroup, ButtonIconInternalProps, ButtonIconProps, ButtonIcon, ButtonToggle, ButtonLegacyType, ButtonLegacyTypeMap, ButtonLegacySize, SdsIconButtonLegacyProps, SdsMinimalButtonLegacyProps, SdsButtonLegacyProps, SdsLegacyProps, ButtonLegacyProps, ButtonLegacy, ButtonDropdownLegacyProps, ButtonDropdownLegacy, ButtonToggleLegacyProps, ButtonToggleLegacy, 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, CheckboxContentProps, 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, PopoverProps, Popover, PreComposedTableProps, RowHoverContext, PreComposedTable, 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 };
 export type { AutocompleteBaseProps, AutocompleteMultiColumnProps, AutocompleteOptionBasic, AutocompleteOptionComponent, DefaultAutocompleteOption, ButtonProps, ButtonDropdownProps, ButtonGroupProps, ButtonToggleProps, 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 };