@salt-ds/core 1.59.1 → 1.61.0

package/dist-cjs/salt-provider/SaltProvider.js

@@ -5,11 +5,13 @@ var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
 var clsx = require('clsx');
 var React = require('react');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+var ViewportProvider = require('../viewport/ViewportProvider.js');
 require('../aria-announcer/AriaAnnouncerContext.js');
 var AriaAnnouncerProvider = require('../aria-announcer/AriaAnnouncerProvider.js');
 var BreakpointProvider = require('../breakpoints/BreakpointProvider.js');
 var Breakpoints = require('../breakpoints/Breakpoints.js');
-var ViewportProvider = require('../viewport/ViewportProvider.js');
 var ProviderContext = require('./ProviderContext.js');
 var SaltProvider$1 = require('./SaltProvider.css.js');
 var ThemeApplicator = require('./ThemeApplicator.js');

package/dist-cjs/salt-provider/SaltProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import {\n  StyleInjectionProvider,\n  useComponentCssInjection,\n} from \"@salt-ds/styles\";\nimport { useWindow, type WindowContextType } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useContext,\n  useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport {\n  BreakpointProvider,\n  type Breakpoints,\n  DEFAULT_BREAKPOINTS,\n  useMatchedBreakpoints,\n} from \"../breakpoints\";\nimport type {\n  Accent,\n  ActionFont,\n  Corner,\n  Density,\n  HeadingFont,\n  Mode,\n  ThemeName,\n} from \"../theme\";\nimport { ViewportProvider } from \"../viewport\";\nimport { ProviderContext } from \"./ProviderContext\";\nimport saltProviderCss from \"./SaltProvider.css\";\nimport { ThemeApplicator, type ThemeApplicatorProps } from \"./ThemeApplicator\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst DEFAULT_THEME_NAME_NEXT = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: Corner = \"sharp\";\nconst DEFAULT_HEADING_FONT: HeadingFont = \"Open Sans\";\nconst DEFAULT_ACCENT: Accent = \"blue\";\nconst DEFAULT_ACTION_FONT: ActionFont = \"Open Sans\";\nexport interface ThemeContextProps {\n  theme: ThemeName;\n  mode: Mode;\n  window?: WindowContextType;\n  /** Only available when using SaltProviderNext. */\n  themeNext: boolean;\n  corner: Corner;\n  /** @deprecated use `corner`*/\n  UNSTABLE_corner: Corner;\n  headingFont: HeadingFont;\n  /** @deprecated use `headingFont` */\n  UNSTABLE_headingFont: HeadingFont;\n  accent: Accent;\n  /** @deprecated use `accent` */\n  UNSTABLE_accent: Accent;\n  actionFont: ActionFont;\n  /** @deprecated use `actionFont` */\n  UNSTABLE_actionFont: ActionFont;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n  theme: \"\",\n  mode: DEFAULT_MODE,\n  themeNext: false,\n  corner: DEFAULT_CORNER,\n  UNSTABLE_corner: DEFAULT_CORNER,\n  headingFont: DEFAULT_HEADING_FONT,\n  UNSTABLE_headingFont: DEFAULT_HEADING_FONT,\n  accent: DEFAULT_ACCENT,\n  UNSTABLE_accent: DEFAULT_ACCENT,\n  actionFont: DEFAULT_ACTION_FONT,\n  UNSTABLE_actionFont: DEFAULT_ACTION_FONT,\n});\n\nexport const BreakpointContext =\n  createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\ntype ThemeNextOnlyAttributes =\n  | \"accent\"\n  | \"corner\"\n  | \"actionFont\"\n  | \"headingFont\";\n\ninterface SaltProviderBaseProps\n  extends Partial<\n    Omit<ThemeApplicatorProps, \"children\" | ThemeNextOnlyAttributes>\n  > {\n  /**\n   * Shape of `{ xs: number; sm: number; md: number; lg: number; xl: number; }`.\n   * Determines breakpoints used in responsive calculation for layout components.\n   */\n  breakpoints?: Breakpoints;\n  /**\n   * A boolean. Enables dynamic style injection for each component.\n   *\n   * If `false`, you'll need to include component CSS yourself.\n   *\n   * @default true\n   */\n  enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n  children: ReactElement;\n  applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n  children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n  extends SaltProviderThatInjectsThemeElement {\n  applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n  | SaltProviderThatAppliesClassesToChild\n  | SaltProviderThatInjectsThemeElement\n  | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n  applyClassesTo: applyClassesToProp,\n  children,\n  density: densityProp,\n  theme: themeProp,\n  mode: modeProp,\n  breakpoints: breakpointsProp,\n  themeNext,\n  corner: cornerProp,\n  headingFont: headingFontProp,\n  accent: accentProp,\n  actionFont: actionFontProp,\n}: Omit<\n  SaltProviderProps & {\n    themeNext?: boolean;\n  } & SaltProviderNextProps,\n  \"enableStyleInjection\"\n>) {\n  const prevProvider = useContext(ProviderContext);\n  const inheritedDensity = useContext(DensityContext);\n  const {\n    theme: inheritedTheme,\n    mode: inheritedMode,\n    corner: inheritedCorner,\n    headingFont: inheritedHeadingFont,\n    accent: inheritedAccent,\n    actionFont: inheritedActionFont,\n  } = useContext(ThemeContext);\n\n  const isRootProvider = prevProvider === null;\n\n  const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n  const inheritedThemeName =\n    inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme;\n  const themeName = themeProp ?? inheritedThemeName;\n  const mode = modeProp ?? inheritedMode;\n  const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n\n  const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n  const headingFont =\n    headingFontProp ?? inheritedHeadingFont ?? DEFAULT_HEADING_FONT;\n  const accent = accentProp ?? inheritedAccent ?? DEFAULT_ACCENT;\n  const actionFont =\n    actionFontProp ?? inheritedActionFont ?? DEFAULT_ACTION_FONT;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-provider\",\n    css: saltProviderCss,\n    window: targetWindow,\n  });\n\n  const themeContextValue = useMemo(\n    () => ({\n      theme: themeName,\n      mode,\n      window: targetWindow,\n      themeNext: Boolean(themeNext),\n      corner: corner,\n      headingFont: headingFont,\n      accent: accent,\n      actionFont: actionFont,\n      // Backward compatibility\n      UNSTABLE_corner: corner,\n      UNSTABLE_headingFont: headingFont,\n      UNSTABLE_accent: accent,\n      UNSTABLE_actionFont: actionFont,\n    }),\n    [\n      themeName,\n      mode,\n      targetWindow,\n      themeNext,\n      corner,\n      headingFont,\n      accent,\n      actionFont,\n    ],\n  );\n\n  const matchedBreakpoints = useMatchedBreakpoints(breakpoints);\n\n  const saltProvider = (\n    <ProviderContext.Provider value={{ targetWindow }}>\n      <DensityContext.Provider value={density}>\n        <ThemeContext.Provider value={themeContextValue}>\n          <BreakpointProvider matchedBreakpoints={matchedBreakpoints}>\n            <BreakpointContext.Provider value={breakpoints}>\n              <ViewportProvider>\n                <ThemeApplicator\n                  applyClassesTo={\n                    applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\")\n                  }\n                  density={density}\n                  theme={clsx(\n                    DEFAULT_THEME_NAME,\n                    { [DEFAULT_THEME_NAME_NEXT]: themeNext },\n                    themeName,\n                  )}\n                  mode={mode}\n                  accent={themeNext ? accent : undefined}\n                  actionFont={themeNext ? actionFont : undefined}\n                  headingFont={themeNext ? headingFont : undefined}\n                  corner={themeNext ? corner : undefined}\n                >\n                  {children}\n                </ThemeApplicator>\n              </ViewportProvider>\n            </BreakpointContext.Provider>\n          </BreakpointProvider>\n        </ThemeContext.Provider>\n      </DensityContext.Provider>\n    </ProviderContext.Provider>\n  );\n\n  if (isRootProvider) {\n    return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n  }\n  return saltProvider;\n}\n\nexport function SaltProvider({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      <InternalSaltProvider {...restProps} />\n    </StyleInjectionProvider>\n  );\n}\n\nexport type SaltProviderNextProps = SaltProviderProps &\n  Pick<ThemeApplicatorProps, ThemeNextOnlyAttributes>;\nexport function SaltProviderNext({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderNextProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n      <InternalSaltProvider {...restProps} themeNext={true} />\n    </StyleInjectionProvider>\n  );\n}\n\n/** @deprecated use `SaltProviderNextProps` */\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderNextProps;\n\n/** @deprecated use `SaltProviderNext` */\nexport const UNSTABLE_SaltProviderNext = SaltProviderNext;\n\nexport const useTheme = (): ThemeContextProps => {\n  const { window: _window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n  return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n  const densityFromContext = useContext(DensityContext);\n  return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n  return useContext(BreakpointContext);\n};\n"],"names":["createContext","DEFAULT_BREAKPOINTS","useContext","ProviderContext","useWindow","useComponentCssInjection","saltProviderCss","useMemo","useMatchedBreakpoints","jsx","BreakpointProvider","ViewportProvider","ThemeApplicator","clsx","AriaAnnouncerProvider","StyleInjectionProvider"],"mappings":"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"}
+{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import {\n  StyleInjectionProvider,\n  useComponentCssInjection,\n} from \"@salt-ds/styles\";\nimport { useWindow, type WindowContextType } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useContext,\n  useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport {\n  BreakpointProvider,\n  type Breakpoints,\n  DEFAULT_BREAKPOINTS,\n  useMatchedBreakpoints,\n} from \"../breakpoints\";\nimport type {\n  Accent,\n  ActionFont,\n  Corner,\n  Density,\n  HeadingFont,\n  Mode,\n  ThemeName,\n} from \"../theme\";\nimport { ViewportProvider } from \"../viewport\";\nimport { ProviderContext } from \"./ProviderContext\";\nimport saltProviderCss from \"./SaltProvider.css\";\nimport { ThemeApplicator, type ThemeApplicatorProps } from \"./ThemeApplicator\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst DEFAULT_THEME_NAME_NEXT = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: Corner = \"sharp\";\nconst DEFAULT_HEADING_FONT: HeadingFont = \"Open Sans\";\nconst DEFAULT_ACCENT: Accent = \"blue\";\nconst DEFAULT_ACTION_FONT: ActionFont = \"Open Sans\";\nexport interface ThemeContextProps {\n  theme: ThemeName;\n  mode: Mode;\n  window?: WindowContextType;\n  /** Only available when using SaltProviderNext. */\n  themeNext: boolean;\n  corner: Corner;\n  /** @deprecated use `corner`*/\n  UNSTABLE_corner: Corner;\n  headingFont: HeadingFont;\n  /** @deprecated use `headingFont` */\n  UNSTABLE_headingFont: HeadingFont;\n  accent: Accent;\n  /** @deprecated use `accent` */\n  UNSTABLE_accent: Accent;\n  actionFont: ActionFont;\n  /** @deprecated use `actionFont` */\n  UNSTABLE_actionFont: ActionFont;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n  theme: \"\",\n  mode: DEFAULT_MODE,\n  themeNext: false,\n  corner: DEFAULT_CORNER,\n  UNSTABLE_corner: DEFAULT_CORNER,\n  headingFont: DEFAULT_HEADING_FONT,\n  UNSTABLE_headingFont: DEFAULT_HEADING_FONT,\n  accent: DEFAULT_ACCENT,\n  UNSTABLE_accent: DEFAULT_ACCENT,\n  actionFont: DEFAULT_ACTION_FONT,\n  UNSTABLE_actionFont: DEFAULT_ACTION_FONT,\n});\n\nexport const BreakpointContext =\n  createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\ntype ThemeNextOnlyAttributes =\n  | \"accent\"\n  | \"corner\"\n  | \"actionFont\"\n  | \"headingFont\";\n\ninterface SaltProviderBaseProps\n  extends Partial<\n    Omit<ThemeApplicatorProps, \"children\" | ThemeNextOnlyAttributes>\n  > {\n  /**\n   * Shape of `{ xs: number; sm: number; md: number; lg: number; xl: number; }`.\n   * Determines breakpoints used in responsive calculation for layout components.\n   */\n  breakpoints?: Breakpoints;\n  /**\n   * A boolean. Enables dynamic style injection for each component.\n   *\n   * If `false`, you'll need to include component CSS yourself.\n   *\n   * @default true\n   */\n  enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n  children: ReactElement;\n  applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n  children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n  extends SaltProviderThatInjectsThemeElement {\n  applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n  | SaltProviderThatAppliesClassesToChild\n  | SaltProviderThatInjectsThemeElement\n  | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n  applyClassesTo: applyClassesToProp,\n  children,\n  density: densityProp,\n  theme: themeProp,\n  mode: modeProp,\n  breakpoints: breakpointsProp,\n  themeNext,\n  corner: cornerProp,\n  headingFont: headingFontProp,\n  accent: accentProp,\n  actionFont: actionFontProp,\n}: Omit<\n  SaltProviderProps & {\n    themeNext?: boolean;\n  } & SaltProviderNextProps,\n  \"enableStyleInjection\"\n>) {\n  const prevProvider = useContext(ProviderContext);\n  const inheritedDensity = useContext(DensityContext);\n  const {\n    theme: inheritedTheme,\n    mode: inheritedMode,\n    corner: inheritedCorner,\n    headingFont: inheritedHeadingFont,\n    accent: inheritedAccent,\n    actionFont: inheritedActionFont,\n  } = useContext(ThemeContext);\n\n  const isRootProvider = prevProvider === null;\n\n  const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n  const inheritedThemeName =\n    inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme;\n  const themeName = themeProp ?? inheritedThemeName;\n  const mode = modeProp ?? inheritedMode;\n  const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n\n  const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n  const headingFont =\n    headingFontProp ?? inheritedHeadingFont ?? DEFAULT_HEADING_FONT;\n  const accent = accentProp ?? inheritedAccent ?? DEFAULT_ACCENT;\n  const actionFont =\n    actionFontProp ?? inheritedActionFont ?? DEFAULT_ACTION_FONT;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-provider\",\n    css: saltProviderCss,\n    window: targetWindow,\n  });\n\n  const themeContextValue = useMemo(\n    () => ({\n      theme: themeName,\n      mode,\n      window: targetWindow,\n      themeNext: Boolean(themeNext),\n      corner: corner,\n      headingFont: headingFont,\n      accent: accent,\n      actionFont: actionFont,\n      // Backward compatibility\n      UNSTABLE_corner: corner,\n      UNSTABLE_headingFont: headingFont,\n      UNSTABLE_accent: accent,\n      UNSTABLE_actionFont: actionFont,\n    }),\n    [\n      themeName,\n      mode,\n      targetWindow,\n      themeNext,\n      corner,\n      headingFont,\n      accent,\n      actionFont,\n    ],\n  );\n\n  const matchedBreakpoints = useMatchedBreakpoints(breakpoints);\n\n  const saltProvider = (\n    <ProviderContext.Provider value={{ targetWindow }}>\n      <DensityContext.Provider value={density}>\n        <ThemeContext.Provider value={themeContextValue}>\n          <BreakpointProvider matchedBreakpoints={matchedBreakpoints}>\n            <BreakpointContext.Provider value={breakpoints}>\n              <ViewportProvider>\n                <ThemeApplicator\n                  applyClassesTo={\n                    applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\")\n                  }\n                  density={density}\n                  theme={clsx(\n                    DEFAULT_THEME_NAME,\n                    { [DEFAULT_THEME_NAME_NEXT]: themeNext },\n                    themeName,\n                  )}\n                  mode={mode}\n                  accent={themeNext ? accent : undefined}\n                  actionFont={themeNext ? actionFont : undefined}\n                  headingFont={themeNext ? headingFont : undefined}\n                  corner={themeNext ? corner : undefined}\n                >\n                  {children}\n                </ThemeApplicator>\n              </ViewportProvider>\n            </BreakpointContext.Provider>\n          </BreakpointProvider>\n        </ThemeContext.Provider>\n      </DensityContext.Provider>\n    </ProviderContext.Provider>\n  );\n\n  if (isRootProvider) {\n    return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n  }\n  return saltProvider;\n}\n\nexport function SaltProvider({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      <InternalSaltProvider {...restProps} />\n    </StyleInjectionProvider>\n  );\n}\n\nexport type SaltProviderNextProps = SaltProviderProps &\n  Pick<ThemeApplicatorProps, ThemeNextOnlyAttributes>;\nexport function SaltProviderNext({\n  enableStyleInjection,\n  ...restProps\n}: SaltProviderNextProps) {\n  return (\n    <StyleInjectionProvider value={enableStyleInjection}>\n      {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n      <InternalSaltProvider {...restProps} themeNext={true} />\n    </StyleInjectionProvider>\n  );\n}\n\n/** @deprecated use `SaltProviderNextProps` */\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderNextProps;\n\n/** @deprecated use `SaltProviderNext` */\nexport const UNSTABLE_SaltProviderNext = SaltProviderNext;\n\nexport const useTheme = (): ThemeContextProps => {\n  const { window: _window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n  return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n  const densityFromContext = useContext(DensityContext);\n  return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n  return useContext(BreakpointContext);\n};\n"],"names":["createContext","DEFAULT_BREAKPOINTS","useContext","ProviderContext","useWindow","useComponentCssInjection","saltProviderCss","useMemo","useMatchedBreakpoints","jsx","BreakpointProvider","ViewportProvider","ThemeApplicator","clsx","AriaAnnouncerProvider","StyleInjectionProvider"],"mappings":"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"}

package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js

@@ -8,35 +8,37 @@ var SuccessAdornment = require('../status-adornment/SuccessAdornment.js');
 var WarningAdornment = require('../status-adornment/WarningAdornment.js');
 
 const defaultIconMap = {
-  ExpandIcon: icons.ChevronDownIcon,
-  CollapseIcon: icons.ChevronUpIcon,
-  ExpandGroupIcon: icons.ChevronRightIcon,
+  ActiveIcon: icons.StepActiveIcon,
+  CalendarIcon: icons.CalendarIcon,
+  CloseIcon: icons.CloseIcon,
   CollapseGroupIcon: icons.ChevronDownIcon,
-  NextIcon: icons.ChevronRightIcon,
-  PreviousIcon: icons.ChevronLeftIcon,
-  IncreaseIcon: icons.TriangleUpIcon,
+  CollapseIcon: icons.ChevronUpIcon,
+  CollapseLeftIcon: icons.DoubleChevronLeftIcon,
+  CollapseRightIcon: icons.DoubleChevronRightIcon,
+  CompletedIcon: icons.SuccessCircleSolidIcon,
   DecreaseIcon: icons.TriangleDownIcon,
-  UploadIcon: icons.UploadIcon,
   ErrorIcon: icons.ErrorSolidIcon,
-  SuccessIcon: icons.SuccessCircleSolidIcon,
+  ErrorStatusAdornment: ErrorAdornment.ErrorAdornmentIcon,
+  ExpandGroupIcon: icons.ChevronRightIcon,
+  ExpandIcon: icons.ChevronDownIcon,
+  ExternalIcon: icons.TearOutIcon,
+  IncreaseIcon: icons.TriangleUpIcon,
   InfoIcon: icons.InfoSolidIcon,
-  WarningIcon: icons.WarningSolidIcon,
+  InProgressIcon: icons.ProgressInprogressIcon,
+  LockedIcon: icons.LockedIcon,
+  NextIcon: icons.ChevronRightIcon,
   OverflowIcon: icons.OverflowMenuIcon,
-  UserIcon: icons.UserSolidIcon,
-  CalendarIcon: icons.CalendarIcon,
-  CloseIcon: icons.CloseIcon,
-  ExternalIcon: icons.TearOutIcon,
   PendingIcon: icons.StepDefaultIcon,
-  ActiveIcon: icons.StepActiveIcon,
-  CompletedIcon: icons.SuccessCircleSolidIcon,
-  LockedIcon: icons.LockedIcon,
-  InProgressIcon: icons.ProgressInprogressIcon,
+  PreviousIcon: icons.ChevronLeftIcon,
   RatingIcon: icons.FavoriteIcon,
   RatingSelectedIcon: icons.FavoriteSolidIcon,
   RatingUnselectingIcon: icons.FavoriteStrongIcon,
-  ErrorStatusAdornment: ErrorAdornment.ErrorAdornmentIcon,
-  WarningStatusAdornment: WarningAdornment.WarningAdornmentIcon,
-  SuccessStatusAdornment: SuccessAdornment.SuccessAdornmentIcon
+  SuccessIcon: icons.SuccessCircleSolidIcon,
+  SuccessStatusAdornment: SuccessAdornment.SuccessAdornmentIcon,
+  UploadIcon: icons.UploadIcon,
+  UserIcon: icons.UserSolidIcon,
+  WarningIcon: icons.WarningSolidIcon,
+  WarningStatusAdornment: WarningAdornment.WarningAdornmentIcon
 };
 const SemanticIconContext = React.createContext(defaultIconMap);
 const SemanticIconProvider = ({

package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  ErrorSolidIcon,\n  FavoriteIcon,\n  FavoriteSolidIcon,\n  FavoriteStrongIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  SuccessCircleSolidIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserSolidIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  createContext,\n  type ElementType,\n  type ReactNode,\n  useContext,\n} from \"react\";\nimport { ErrorAdornmentIcon } from \"../status-adornment/ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"../status-adornment/SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"../status-adornment/WarningAdornment\";\n\nexport interface SemanticIconMap {\n  ExpandIcon: ElementType;\n  CollapseIcon: ElementType;\n  ExpandGroupIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  NextIcon: ElementType;\n  PreviousIcon: ElementType;\n  IncreaseIcon: ElementType;\n  DecreaseIcon: ElementType;\n  UploadIcon: ElementType;\n  ErrorIcon: ElementType;\n  SuccessIcon: ElementType;\n  InfoIcon: ElementType;\n  WarningIcon: ElementType;\n  OverflowIcon: ElementType;\n  UserIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  ExternalIcon: ElementType;\n  PendingIcon: ElementType;\n  ActiveIcon: ElementType;\n  CompletedIcon: ElementType;\n  LockedIcon: ElementType;\n  InProgressIcon: ElementType;\n  RatingIcon: ElementType;\n  RatingSelectedIcon: ElementType;\n  RatingUnselectingIcon: ElementType;\n  ErrorStatusAdornment: ElementType;\n  WarningStatusAdornment: ElementType;\n  SuccessStatusAdornment: ElementType;\n}\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ExpandIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  NextIcon: ChevronRightIcon,\n  PreviousIcon: ChevronLeftIcon,\n  IncreaseIcon: TriangleUpIcon,\n  DecreaseIcon: TriangleDownIcon,\n  UploadIcon,\n  ErrorIcon: ErrorSolidIcon,\n  SuccessIcon: SuccessCircleSolidIcon,\n  InfoIcon: InfoSolidIcon,\n  WarningIcon: WarningSolidIcon,\n  OverflowIcon: OverflowMenuIcon,\n  UserIcon: UserSolidIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  ExternalIcon: TearOutIcon,\n  PendingIcon: StepDefaultIcon,\n  ActiveIcon: StepActiveIcon,\n  CompletedIcon: SuccessCircleSolidIcon,\n  LockedIcon: LockedIcon,\n  InProgressIcon: ProgressInprogressIcon,\n  RatingIcon: FavoriteIcon,\n  RatingSelectedIcon: FavoriteSolidIcon,\n  RatingUnselectingIcon: FavoriteStrongIcon,\n  ErrorStatusAdornment: ErrorAdornmentIcon,\n  WarningStatusAdornment: WarningAdornmentIcon,\n  SuccessStatusAdornment: SuccessAdornmentIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":["ChevronDownIcon","ChevronUpIcon","ChevronRightIcon","ChevronLeftIcon","TriangleUpIcon","TriangleDownIcon","UploadIcon","ErrorSolidIcon","SuccessCircleSolidIcon","InfoSolidIcon","WarningSolidIcon","OverflowMenuIcon","UserSolidIcon","CalendarIcon","CloseIcon","TearOutIcon","StepDefaultIcon","StepActiveIcon","LockedIcon","ProgressInprogressIcon","FavoriteIcon","FavoriteSolidIcon","FavoriteStrongIcon","ErrorAdornmentIcon","WarningAdornmentIcon","SuccessAdornmentIcon","createContext","jsx","useContext"],"mappings":";;;;;;;;;AA+EA,MAAM,cAAA,GAAkC;AAAA,EACtC,UAAA,EAAYA,qBAAA;AAAA,EACZ,YAAA,EAAcC,mBAAA;AAAA,EACd,eAAA,EAAiBC,sBAAA;AAAA,EACjB,iBAAA,EAAmBF,qBAAA;AAAA,EACnB,QAAA,EAAUE,sBAAA;AAAA,EACV,YAAA,EAAcC,qBAAA;AAAA,EACd,YAAA,EAAcC,oBAAA;AAAA,EACd,YAAA,EAAcC,sBAAA;AAAA,cACdC,gBAAA;AAAA,EACA,SAAA,EAAWC,oBAAA;AAAA,EACX,WAAA,EAAaC,4BAAA;AAAA,EACb,QAAA,EAAUC,mBAAA;AAAA,EACV,WAAA,EAAaC,sBAAA;AAAA,EACb,YAAA,EAAcC,sBAAA;AAAA,EACd,QAAA,EAAUC,mBAAA;AAAA,gBACVC,kBAAA;AAAA,aACAC,eAAA;AAAA,EACA,YAAA,EAAcC,iBAAA;AAAA,EACd,WAAA,EAAaC,qBAAA;AAAA,EACb,UAAA,EAAYC,oBAAA;AAAA,EACZ,aAAA,EAAeT,4BAAA;AAAA,cACfU,gBAAA;AAAA,EACA,cAAA,EAAgBC,4BAAA;AAAA,EAChB,UAAA,EAAYC,kBAAA;AAAA,EACZ,kBAAA,EAAoBC,uBAAA;AAAA,EACpB,qBAAA,EAAuBC,wBAAA;AAAA,EACvB,oBAAA,EAAsBC,iCAAA;AAAA,EACtB,sBAAA,EAAwBC,qCAAA;AAAA,EACxB,sBAAA,EAAwBC;AAC1B,CAAA;AAEA,MAAM,mBAAA,GAAsBC,oBAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CAAA,qBACEC,cAAA,CAAC,mBAAA,CAAoB,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAA,EAAgB,GAAG,OAAA,EAAQ,EAClE,QAAA,EACH;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAA,MAAM,OAAA,GAAUC,iBAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAA,IAAW,cAAA;AACpB;;;;;"}
+{"version":3,"file":"SemanticIconProvider.js","sources":["../src/semantic-icon-provider/SemanticIconProvider.tsx"],"sourcesContent":["import {\n  CalendarIcon,\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n  CloseIcon,\n  DoubleChevronLeftIcon,\n  DoubleChevronRightIcon,\n  ErrorSolidIcon,\n  FavoriteIcon,\n  FavoriteSolidIcon,\n  FavoriteStrongIcon,\n  InfoSolidIcon,\n  LockedIcon,\n  OverflowMenuIcon,\n  ProgressInprogressIcon,\n  StepActiveIcon,\n  StepDefaultIcon,\n  SuccessCircleSolidIcon,\n  TearOutIcon,\n  TriangleDownIcon,\n  TriangleUpIcon,\n  UploadIcon,\n  UserSolidIcon,\n  WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport {\n  createContext,\n  type ElementType,\n  type ReactNode,\n  useContext,\n} from \"react\";\nimport { ErrorAdornmentIcon } from \"../status-adornment/ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"../status-adornment/SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"../status-adornment/WarningAdornment\";\n\nexport interface SemanticIconMap {\n  ActiveIcon: ElementType;\n  CalendarIcon: ElementType;\n  CloseIcon: ElementType;\n  CollapseGroupIcon: ElementType;\n  CollapseIcon: ElementType;\n  CollapseLeftIcon: ElementType;\n  CollapseRightIcon: ElementType;\n  CompletedIcon: ElementType;\n  DecreaseIcon: ElementType;\n  ErrorIcon: ElementType;\n  ErrorStatusAdornment: ElementType;\n  ExpandGroupIcon: ElementType;\n  ExpandIcon: ElementType;\n  ExternalIcon: ElementType;\n  IncreaseIcon: ElementType;\n  InfoIcon: ElementType;\n  InProgressIcon: ElementType;\n  LockedIcon: ElementType;\n  NextIcon: ElementType;\n  OverflowIcon: ElementType;\n  PendingIcon: ElementType;\n  PreviousIcon: ElementType;\n  RatingIcon: ElementType;\n  RatingSelectedIcon: ElementType;\n  RatingUnselectingIcon: ElementType;\n  SuccessIcon: ElementType;\n  SuccessStatusAdornment: ElementType;\n  UploadIcon: ElementType;\n  UserIcon: ElementType;\n  WarningIcon: ElementType;\n  WarningStatusAdornment: ElementType;\n}\n\nexport interface SemanticIconProviderProps {\n  /**\n   * Custom mapping of icon names to components. Overrides default icons if provided.\n   */\n  iconMap?: Partial<SemanticIconMap>;\n\n  /**\n   * Child elements that will use the provided icons.\n   */\n  children: ReactNode;\n}\n\nconst defaultIconMap: SemanticIconMap = {\n  ActiveIcon: StepActiveIcon,\n  CalendarIcon: CalendarIcon,\n  CloseIcon: CloseIcon,\n  CollapseGroupIcon: ChevronDownIcon,\n  CollapseIcon: ChevronUpIcon,\n  CollapseLeftIcon: DoubleChevronLeftIcon,\n  CollapseRightIcon: DoubleChevronRightIcon,\n  CompletedIcon: SuccessCircleSolidIcon,\n  DecreaseIcon: TriangleDownIcon,\n  ErrorIcon: ErrorSolidIcon,\n  ErrorStatusAdornment: ErrorAdornmentIcon,\n  ExpandGroupIcon: ChevronRightIcon,\n  ExpandIcon: ChevronDownIcon,\n  ExternalIcon: TearOutIcon,\n  IncreaseIcon: TriangleUpIcon,\n  InfoIcon: InfoSolidIcon,\n  InProgressIcon: ProgressInprogressIcon,\n  LockedIcon: LockedIcon,\n  NextIcon: ChevronRightIcon,\n  OverflowIcon: OverflowMenuIcon,\n  PendingIcon: StepDefaultIcon,\n  PreviousIcon: ChevronLeftIcon,\n  RatingIcon: FavoriteIcon,\n  RatingSelectedIcon: FavoriteSolidIcon,\n  RatingUnselectingIcon: FavoriteStrongIcon,\n  SuccessIcon: SuccessCircleSolidIcon,\n  SuccessStatusAdornment: SuccessAdornmentIcon,\n  UploadIcon,\n  UserIcon: UserSolidIcon,\n  WarningIcon: WarningSolidIcon,\n  WarningStatusAdornment: WarningAdornmentIcon,\n};\n\nconst SemanticIconContext = createContext<SemanticIconMap>(defaultIconMap);\n\nexport const SemanticIconProvider = ({\n  iconMap = {},\n  children,\n}: SemanticIconProviderProps) => (\n  <SemanticIconContext.Provider value={{ ...defaultIconMap, ...iconMap }}>\n    {children}\n  </SemanticIconContext.Provider>\n);\n\nexport const useIcon = () => {\n  const context = useContext(SemanticIconContext);\n  return context || defaultIconMap;\n};\n"],"names":["StepActiveIcon","CalendarIcon","CloseIcon","ChevronDownIcon","ChevronUpIcon","DoubleChevronLeftIcon","DoubleChevronRightIcon","SuccessCircleSolidIcon","TriangleDownIcon","ErrorSolidIcon","ErrorAdornmentIcon","ChevronRightIcon","TearOutIcon","TriangleUpIcon","InfoSolidIcon","ProgressInprogressIcon","LockedIcon","OverflowMenuIcon","StepDefaultIcon","ChevronLeftIcon","FavoriteIcon","FavoriteSolidIcon","FavoriteStrongIcon","SuccessAdornmentIcon","UploadIcon","UserSolidIcon","WarningSolidIcon","WarningAdornmentIcon","createContext","jsx","useContext"],"mappings":";;;;;;;;;AAmFA,MAAM,cAAA,GAAkC;AAAA,EACtC,UAAA,EAAYA,oBAAA;AAAA,gBACZC,kBAAA;AAAA,aACAC,eAAA;AAAA,EACA,iBAAA,EAAmBC,qBAAA;AAAA,EACnB,YAAA,EAAcC,mBAAA;AAAA,EACd,gBAAA,EAAkBC,2BAAA;AAAA,EAClB,iBAAA,EAAmBC,4BAAA;AAAA,EACnB,aAAA,EAAeC,4BAAA;AAAA,EACf,YAAA,EAAcC,sBAAA;AAAA,EACd,SAAA,EAAWC,oBAAA;AAAA,EACX,oBAAA,EAAsBC,iCAAA;AAAA,EACtB,eAAA,EAAiBC,sBAAA;AAAA,EACjB,UAAA,EAAYR,qBAAA;AAAA,EACZ,YAAA,EAAcS,iBAAA;AAAA,EACd,YAAA,EAAcC,oBAAA;AAAA,EACd,QAAA,EAAUC,mBAAA;AAAA,EACV,cAAA,EAAgBC,4BAAA;AAAA,cAChBC,gBAAA;AAAA,EACA,QAAA,EAAUL,sBAAA;AAAA,EACV,YAAA,EAAcM,sBAAA;AAAA,EACd,WAAA,EAAaC,qBAAA;AAAA,EACb,YAAA,EAAcC,qBAAA;AAAA,EACd,UAAA,EAAYC,kBAAA;AAAA,EACZ,kBAAA,EAAoBC,uBAAA;AAAA,EACpB,qBAAA,EAAuBC,wBAAA;AAAA,EACvB,WAAA,EAAaf,4BAAA;AAAA,EACb,sBAAA,EAAwBgB,qCAAA;AAAA,cACxBC,gBAAA;AAAA,EACA,QAAA,EAAUC,mBAAA;AAAA,EACV,WAAA,EAAaC,sBAAA;AAAA,EACb,sBAAA,EAAwBC;AAC1B,CAAA;AAEA,MAAM,mBAAA,GAAsBC,oBAA+B,cAAc,CAAA;AAElE,MAAM,uBAAuB,CAAC;AAAA,EACnC,UAAU,EAAC;AAAA,EACX;AACF,CAAA,qBACEC,cAAA,CAAC,mBAAA,CAAoB,QAAA,EAApB,EAA6B,KAAA,EAAO,EAAE,GAAG,cAAA,EAAgB,GAAG,OAAA,EAAQ,EAClE,QAAA,EACH;AAGK,MAAM,UAAU,MAAM;AAC3B,EAAA,MAAM,OAAA,GAAUC,iBAAW,mBAAmB,CAAA;AAC9C,EAAA,OAAO,OAAA,IAAW,cAAA;AACpB;;;;;"}

package/dist-cjs/spinner/Spinner.js

@@ -7,6 +7,7 @@ var clsx = require('clsx');
 var React = require('react');
 var useAriaAnnouncer = require('../aria-announcer/useAriaAnnouncer.js');
 require('../aria-announcer/AriaAnnouncerContext.js');
+require('../aria-announcer/AriaAnnouncerProvider.js');
 var SaltProvider = require('../salt-provider/SaltProvider.js');
 var makePrefixer = require('../utils/makePrefixer.js');
 require('../utils/useFloatingUI/useFloatingUI.js');

package/dist-cjs/spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useDensity } from \"../salt-provider\";\nimport { makePrefixer, useId } from \"../utils\";\nimport spinnerCss from \"./Spinner.css\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n  \"default\",\n  \"large\",\n  \"small\",\n  \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n  size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n   */\n  announcerInterval?: number;\n  /**\n   *  * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n   */\n  announcerTimeout?: number;\n  /**\n   * The className(s) of the component\n   */\n  className?: string;\n  /**\n   * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n   */\n  completionAnnouncement?: string | null;\n  /**\n   * If true, built in aria announcer will be inactive\n   */\n  disableAnnouncer?: boolean;\n  /**\n   * The prop for the role attribute of the component\n   */\n  role?: string;\n  /**\n   * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n   */\n  size?: SpinnerSize;\n  /**\n   * The ids of the SvgSpinner components\n   */\n  id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n  function Spinner(\n    {\n      \"aria-label\": ariaLabel = \"loading\",\n      announcerInterval = 5000,\n      announcerTimeout = 20000,\n      completionAnnouncement = `finished ${ariaLabel}`,\n      disableAnnouncer,\n      className,\n      size = \"medium\",\n      id: idProp,\n      ...rest\n    },\n    ref,\n  ) {\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-spinner\",\n      css: spinnerCss,\n      window: targetWindow,\n    });\n\n    const { announce } = useAriaAnnouncer();\n\n    const density = useDensity();\n    size = handleSize(size);\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      announce(ariaLabel);\n\n      const startTime = Date.now();\n\n      const interval =\n        announcerInterval > 0 &&\n        setInterval(() => {\n          if (Date.now() - startTime > announcerTimeout) {\n            // The announcer will stop after `announcerTimeout` time\n            announce(\n              `${ariaLabel} is still in progress, but will no longer announce.`,\n            );\n            interval && clearInterval(interval);\n            return;\n          }\n          announce(ariaLabel);\n        }, announcerInterval);\n\n      return () => {\n        if (disableAnnouncer) return;\n\n        interval && clearInterval(interval);\n        if (completionAnnouncement) {\n          announce(completionAnnouncement);\n        }\n      };\n    }, [\n      announce,\n      announcerInterval,\n      announcerTimeout,\n      ariaLabel,\n      completionAnnouncement,\n      disableAnnouncer,\n    ]);\n\n    return (\n      <div\n        aria-label={ariaLabel}\n        className={clsx(withBaseName(), withBaseName(size), className)}\n        ref={ref}\n        role=\"img\"\n        {...rest}\n      >\n        <SpinnerSVG size={size} density={density} id={id} />\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Spinner","useId","useWindow","useComponentCssInjection","spinnerCss","useAriaAnnouncer","useDensity","useEffect","jsx","clsx","SpinnerSVG"],"mappings":";;;;;;;;;;;;;;;;;AAiBO,MAAM,iBAAA,GAAoB;AAAA,EAC/B,SAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF;AAMA,MAAM,UAAA,GAAa,CAAC,IAAA,KAClB,IAAA,KAAS,YAAY,QAAA,GAAW,IAAA;AAElC,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAqCxC,MAAM,OAAA,GAAUC,gBAAA;AAAA,EACrB,SAASC,QAAAA,CACP;AAAA,IACE,cAAc,SAAA,GAAY,SAAA;AAAA,IAC1B,iBAAA,GAAoB,GAAA;AAAA,IACpB,gBAAA,GAAmB,GAAA;AAAA,IACnB,sBAAA,GAAyB,YAAY,SAAS,CAAA,CAAA;AAAA,IAC9C,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA,GAAO,QAAA;AAAA,IACP,EAAA,EAAI,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,SAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAS,GAAIC,iCAAA,EAAiB;AAEtC,IAAA,MAAM,UAAUC,uBAAA,EAAW;AAC3B,IAAA,IAAA,GAAO,WAAW,IAAI,CAAA;AAEtB,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,gBAAA,EAAkB;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA;AAElB,MAAA,MAAM,SAAA,GAAY,KAAK,GAAA,EAAI;AAE3B,MAAA,MAAM,QAAA,GACJ,iBAAA,GAAoB,CAAA,IACpB,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAA,CAAK,GAAA,EAAI,GAAI,SAAA,GAAY,gBAAA,EAAkB;AAE7C,UAAA,QAAA;AAAA,YACE,GAAG,SAAS,CAAA,mDAAA;AAAA,WACd;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,UAAA;AAAA,QACF;AACA,QAAA,QAAA,CAAS,SAAS,CAAA;AAAA,MACpB,GAAG,iBAAiB,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAA,IAAI,gBAAA,EAAkB;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,QAAA,IAAI,sBAAA,EAAwB;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA;AAAA,QACjC;AAAA,MACF,CAAA;AAAA,IACF,CAAA,EAAG;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,SAAA;AAAA,QACZ,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,IAAI,GAAG,SAAS,CAAA;AAAA,QAC7D,GAAA;AAAA,QACA,IAAA,EAAK,KAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAAD,cAAA,CAACE,qBAAA,EAAA,EAAW,IAAA,EAAY,OAAA,EAAkB,EAAA,EAAQ;AAAA;AAAA,KACpD;AAAA,EAEJ;AACF;;;;;"}
+{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useDensity } from \"../salt-provider\";\nimport { makePrefixer, useId } from \"../utils\";\nimport spinnerCss from \"./Spinner.css\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n  \"default\",\n  \"large\",\n  \"small\",\n  \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n  size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n   */\n  announcerInterval?: number;\n  /**\n   *  * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n   */\n  announcerTimeout?: number;\n  /**\n   * The className(s) of the component\n   */\n  className?: string;\n  /**\n   * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n   */\n  completionAnnouncement?: string | null;\n  /**\n   * If true, built in aria announcer will be inactive\n   */\n  disableAnnouncer?: boolean;\n  /**\n   * The prop for the role attribute of the component\n   */\n  role?: string;\n  /**\n   * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n   */\n  size?: SpinnerSize;\n  /**\n   * The ids of the SvgSpinner components\n   */\n  id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n  function Spinner(\n    {\n      \"aria-label\": ariaLabel = \"loading\",\n      announcerInterval = 5000,\n      announcerTimeout = 20000,\n      completionAnnouncement = `finished ${ariaLabel}`,\n      disableAnnouncer,\n      className,\n      size = \"medium\",\n      id: idProp,\n      ...rest\n    },\n    ref,\n  ) {\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-spinner\",\n      css: spinnerCss,\n      window: targetWindow,\n    });\n\n    const { announce } = useAriaAnnouncer();\n\n    const density = useDensity();\n    size = handleSize(size);\n\n    useEffect(() => {\n      if (disableAnnouncer) return;\n\n      announce(ariaLabel);\n\n      const startTime = Date.now();\n\n      const interval =\n        announcerInterval > 0 &&\n        setInterval(() => {\n          if (Date.now() - startTime > announcerTimeout) {\n            // The announcer will stop after `announcerTimeout` time\n            announce(\n              `${ariaLabel} is still in progress, but will no longer announce.`,\n            );\n            interval && clearInterval(interval);\n            return;\n          }\n          announce(ariaLabel);\n        }, announcerInterval);\n\n      return () => {\n        if (disableAnnouncer) return;\n\n        interval && clearInterval(interval);\n        if (completionAnnouncement) {\n          announce(completionAnnouncement);\n        }\n      };\n    }, [\n      announce,\n      announcerInterval,\n      announcerTimeout,\n      ariaLabel,\n      completionAnnouncement,\n      disableAnnouncer,\n    ]);\n\n    return (\n      <div\n        aria-label={ariaLabel}\n        className={clsx(withBaseName(), withBaseName(size), className)}\n        ref={ref}\n        role=\"img\"\n        {...rest}\n      >\n        <SpinnerSVG size={size} density={density} id={id} />\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Spinner","useId","useWindow","useComponentCssInjection","spinnerCss","useAriaAnnouncer","useDensity","useEffect","jsx","clsx","SpinnerSVG"],"mappings":";;;;;;;;;;;;;;;;;;AAiBO,MAAM,iBAAA,GAAoB;AAAA,EAC/B,SAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF;AAMA,MAAM,UAAA,GAAa,CAAC,IAAA,KAClB,IAAA,KAAS,YAAY,QAAA,GAAW,IAAA;AAElC,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAqCxC,MAAM,OAAA,GAAUC,gBAAA;AAAA,EACrB,SAASC,QAAAA,CACP;AAAA,IACE,cAAc,SAAA,GAAY,SAAA;AAAA,IAC1B,iBAAA,GAAoB,GAAA;AAAA,IACpB,gBAAA,GAAmB,GAAA;AAAA,IACnB,sBAAA,GAAyB,YAAY,SAAS,CAAA,CAAA;AAAA,IAC9C,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA,GAAO,QAAA;AAAA,IACP,EAAA,EAAI,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,SAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAS,GAAIC,iCAAA,EAAiB;AAEtC,IAAA,MAAM,UAAUC,uBAAA,EAAW;AAC3B,IAAA,IAAA,GAAO,WAAW,IAAI,CAAA;AAEtB,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,gBAAA,EAAkB;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA;AAElB,MAAA,MAAM,SAAA,GAAY,KAAK,GAAA,EAAI;AAE3B,MAAA,MAAM,QAAA,GACJ,iBAAA,GAAoB,CAAA,IACpB,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAA,CAAK,GAAA,EAAI,GAAI,SAAA,GAAY,gBAAA,EAAkB;AAE7C,UAAA,QAAA;AAAA,YACE,GAAG,SAAS,CAAA,mDAAA;AAAA,WACd;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,UAAA;AAAA,QACF;AACA,QAAA,QAAA,CAAS,SAAS,CAAA;AAAA,MACpB,GAAG,iBAAiB,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAA,IAAI,gBAAA,EAAkB;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,QAAA,IAAI,sBAAA,EAAwB;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA;AAAA,QACjC;AAAA,MACF,CAAA;AAAA,IACF,CAAA,EAAG;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,SAAA;AAAA,QACZ,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,IAAI,GAAG,SAAS,CAAA;AAAA,QAC7D,GAAA;AAAA,QACA,IAAA,EAAK,KAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAAD,cAAA,CAACE,qBAAA,EAAA,EAAW,IAAA,EAAY,OAAA,EAAkB,EAAA,EAAQ;AAAA;AAAA,KACpD;AAAA,EAEJ;AACF;;;;;"}

package/dist-cjs/tabs/Tab.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = "/* Class applied to root Tab element */\n.saltTab {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  appearance: none;\n  -webkit-appearance: none;\n  gap: var(--salt-spacing-100);\n  border: none;\n  border-left: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;\n  border-right: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;\n  white-space: pre;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  min-width: 4em;\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  position: relative;\n  flex-shrink: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n\n  cursor: var(--salt-cursor-hover);\n  color: var(--salt-content-primary-foreground);\n  font-weight: var(--salt-text-fontWeight);\n  font-family: var(--salt-text-fontFamily);\n  text-align: var(--salt-text-textAlign);\n  letter-spacing: var(--salt-text-letterSpacing);\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n  max-width: 100%;\n}\n\n@supports selector(:has(*)) {\n  .saltTabList:has([data-overflowbutton]) .saltTab {\n    /* 100% of the tab list but reserving space for the overflow button */\n    max-width: calc(100% - var(--salt-spacing-100) - var(--salt-size-base));\n  }\n}\n\n.saltTab::after {\n  content: \"\";\n  position: absolute;\n  left: calc(var(--salt-size-fixed-100) * -1);\n  right: calc(var(--salt-size-fixed-100) * -1);\n  height: var(--salt-size-indicator);\n}\n\n.saltTabList-bordered .saltTab::after {\n  top: 0;\n}\n\n.saltTabList-transparent .saltTab::after {\n  bottom: 0;\n}\n\n.saltTab:hover::after,\n.saltTab-focusVisible::after {\n  background: var(--salt-navigable-indicator-hover);\n}\n\n.saltTab-disabled:hover::after,\n.saltTab-disabled.saltTab-focusVisible::after {\n  background: none;\n}\n\n.saltTab-focusVisible {\n  outline: var(--salt-focused-outline);\n}\n\n.saltTabList-bordered .saltTab.saltTab-selected {\n  background: var(--saltTabList-activeColor);\n  border-left: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n  border-right: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n}\n\n.saltTab.saltTab-selected::after {\n  background: var(--salt-navigable-accent-indicator-active);\n}\n\n.saltTab.saltTab-disabled {\n  cursor: var(--salt-cursor-disabled);\n  color: var(--salt-content-primary-foreground-disabled);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=Tab.css.js.map

package/dist-cjs/tabs/Tab.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/tabs/Tab.js

@@ -0,0 +1,211 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var reactDom = require('react-dom');
+var makePrefixer = require('../utils/makePrefixer.js');
+var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+var useForkRef = require('../utils/useForkRef.js');
+var useId = require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var TabContext = require('./internal/contexts/TabContext.js');
+var TabsContext = require('./internal/contexts/TabsContext.js');
+var useRenderedTabWidth = require('./internal/overflow/useRenderedTabWidth.js');
+var widthMeasurement = require('./internal/overflow/widthMeasurement.js');
+var Tab$1 = require('./Tab.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltTab");
+const Tab = React.forwardRef(
+  function Tab2(props, ref) {
+    const {
+      children,
+      className,
+      disabled: disabledProp,
+      onBlur,
+      onMouseDown,
+      onFocus,
+      onFocusCapture,
+      value,
+      id: idProp,
+      ...rest
+    } = props;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-tab",
+      css: Tab$1,
+      window: targetWindow
+    });
+    const {
+      selected,
+      activeTab,
+      renderMode,
+      registerBootstrapTab,
+      setBootstrapTabReady,
+      registerRenderedTab,
+      updateRenderedTab
+    } = TabsContext.useTabs();
+    const disabled = !!disabledProp;
+    const id = useId.useId(idProp);
+    const wasMouseDown = React.useRef(false);
+    const [focusVisible, setFocusVisible] = React.useState(false);
+    const [focused, setFocused] = React.useState(false);
+    const [hostElement, setHostElement] = React.useState(null);
+    const markerRef = React.useRef(null);
+    const tabRootRef = React.useRef(null);
+    const handleFocusCapture = (event) => {
+      onFocusCapture == null ? void 0 : onFocusCapture(event);
+      if (id) {
+        activeTab.current = { value, id };
+      }
+    };
+    const handleFocus = (event) => {
+      onFocus == null ? void 0 : onFocus(event);
+      setFocused(true);
+      if (!wasMouseDown.current && event.target.getAttribute("role") === "tab") {
+        setFocusVisible(true);
+      }
+      wasMouseDown.current = false;
+    };
+    const handleBlur = (event) => {
+      onBlur == null ? void 0 : onBlur(event);
+      setFocused(false);
+      setFocusVisible(false);
+    };
+    const handleMouseDown = (event) => {
+      onMouseDown == null ? void 0 : onMouseDown(event);
+      if (id) {
+        activeTab.current = { value, id };
+      }
+      wasMouseDown.current = true;
+    };
+    const [actionIds, setActionIds] = React.useState(() => /* @__PURE__ */ new Set());
+    const registerAction = React.useCallback((id2) => {
+      setActionIds((old) => {
+        if (old.has(id2)) {
+          return old;
+        }
+        const next = new Set(old);
+        next.add(id2);
+        return next;
+      });
+      return () => {
+        setActionIds((old) => {
+          if (!old.has(id2)) {
+            return old;
+          }
+          const next = new Set(old);
+          next.delete(id2);
+          return next;
+        });
+      };
+    }, []);
+    const actions = React.useMemo(() => Array.from(actionIds), [actionIds]);
+    const context = React.useMemo(
+      () => ({
+        tabId: id,
+        selected: selected === value,
+        focused,
+        value,
+        disabled,
+        actions,
+        registerAction
+      }),
+      [id, selected, value, focused, disabled, actions, registerAction]
+    );
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      const doc = targetWindow == null ? void 0 : targetWindow.document;
+      if (!doc) {
+        return;
+      }
+      const host = doc.createElement("div");
+      host.dataset.tabHost = value;
+      host.role = "presentation";
+      host.style.display = "contents";
+      setHostElement(host);
+      return () => {
+        host.remove();
+      };
+    }, [targetWindow, value]);
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      if (renderMode !== "inline") {
+        return;
+      }
+      return registerBootstrapTab(value);
+    }, [registerBootstrapTab, renderMode, value]);
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      setBootstrapTabReady(value, hostElement != null);
+      return () => {
+        setBootstrapTabReady(value, false);
+      };
+    }, [hostElement, setBootstrapTabReady, value]);
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      if (!hostElement || !id) {
+        return;
+      }
+      return registerRenderedTab({
+        host: hostElement,
+        id,
+        marker: markerRef.current,
+        root: tabRootRef.current,
+        trigger: null,
+        value,
+        width: widthMeasurement.getIntrinsicMeasuredWidth(tabRootRef.current)
+      });
+    }, [hostElement, id, registerRenderedTab, value]);
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      const updates = {
+        marker: markerRef.current,
+        root: tabRootRef.current
+      };
+      if (renderMode === "inline") {
+        updates.width = widthMeasurement.getIntrinsicMeasuredWidth(tabRootRef.current);
+      }
+      updateRenderedTab(value, updates);
+    }, [renderMode, updateRenderedTab, value]);
+    useRenderedTabWidth.useRenderedTabWidth({
+      hostElement,
+      renderMode,
+      tabRootRef,
+      targetWindow,
+      updateRenderedTab,
+      value
+    });
+    const handleTabRootRef = useForkRef.useForkRef(tabRootRef, ref);
+    const tabMarkup = /* @__PURE__ */ jsxRuntime.jsx(TabContext.TabContext.Provider, { value: context, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: clsx.clsx(
+          withBaseName(),
+          {
+            [withBaseName("selected")]: selected === value,
+            [withBaseName("disabled")]: disabled,
+            [withBaseName("focusVisible")]: focusVisible
+          },
+          className
+        ),
+        "data-overflowitem": "true",
+        "data-value": value,
+        ref: handleTabRootRef,
+        onMouseDown: handleMouseDown,
+        onFocusCapture: handleFocusCapture,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        role: "presentation",
+        ...rest,
+        children
+      }
+    ) });
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { role: "presentation", "data-tab-marker": "", hidden: true, ref: markerRef }),
+      renderMode === "inline" ? tabMarkup : hostElement ? reactDom.createPortal(tabMarkup, hostElement) : null
+    ] });
+  }
+);
+
+exports.Tab = Tab;
+//# sourceMappingURL=Tab.js.map

package/dist-cjs/tabs/Tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sources":["../src/tabs/Tab.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type MouseEvent,\n  type ReactElement,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport {\n  makePrefixer,\n  useForkRef,\n  useId,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { TabContext } from \"./internal/contexts/TabContext\";\nimport { useTabs } from \"./internal/contexts/TabsContext\";\nimport { useRenderedTabWidth } from \"./internal/overflow/useRenderedTabWidth\";\nimport { getIntrinsicMeasuredWidth } from \"./internal/overflow/widthMeasurement\";\nimport tabCss from \"./Tab.css\";\n\nconst withBaseName = makePrefixer(\"saltTab\");\n\nexport interface TabProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true`, the tab will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The value of the tab. This must be unique within a `Tabs` instance.\n   */\n  value: string;\n}\n\nexport const Tab = forwardRef<HTMLDivElement, TabProps>(\n  function Tab(props, ref): ReactElement<TabProps> {\n    const {\n      children,\n      className,\n      disabled: disabledProp,\n      onBlur,\n      onMouseDown,\n      onFocus,\n      onFocusCapture,\n      value,\n      id: idProp,\n      ...rest\n    } = props;\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tab\",\n      css: tabCss,\n      window: targetWindow,\n    });\n\n    const {\n      selected,\n      activeTab,\n      renderMode,\n      registerBootstrapTab,\n      setBootstrapTabReady,\n      registerRenderedTab,\n      updateRenderedTab,\n    } = useTabs();\n\n    const disabled = !!disabledProp;\n\n    const id = useId(idProp);\n\n    const wasMouseDown = useRef(false);\n    const [focusVisible, setFocusVisible] = useState(false);\n    const [focused, setFocused] = useState(false);\n    const [hostElement, setHostElement] = useState<HTMLDivElement | null>(null);\n    const markerRef = useRef<HTMLSpanElement>(null);\n    const tabRootRef = useRef<HTMLDivElement>(null);\n\n    const handleFocusCapture = (event: FocusEvent<HTMLDivElement>) => {\n      onFocusCapture?.(event);\n      if (id) {\n        activeTab.current = { value, id };\n      }\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n      onFocus?.(event);\n\n      setFocused(true);\n\n      if (\n        !wasMouseDown.current &&\n        event.target.getAttribute(\"role\") === \"tab\"\n      ) {\n        setFocusVisible(true);\n      }\n\n      wasMouseDown.current = false;\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n      onBlur?.(event);\n      setFocused(false);\n      setFocusVisible(false);\n    };\n\n    const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n      onMouseDown?.(event);\n      if (id) {\n        activeTab.current = { value, id };\n      }\n      wasMouseDown.current = true;\n    };\n\n    const [actionIds, setActionIds] = useState(() => new Set<string>());\n\n    const registerAction = useCallback((id: string) => {\n      setActionIds((old) => {\n        if (old.has(id)) {\n          return old;\n        }\n\n        const next = new Set(old);\n        next.add(id);\n        return next;\n      });\n\n      return () => {\n        setActionIds((old) => {\n          if (!old.has(id)) {\n            return old;\n          }\n\n          const next = new Set(old);\n          next.delete(id);\n          return next;\n        });\n      };\n    }, []);\n\n    const actions = useMemo(() => Array.from(actionIds), [actionIds]);\n\n    const context = useMemo(\n      () => ({\n        tabId: id,\n        selected: selected === value,\n        focused,\n        value,\n        disabled,\n        actions,\n        registerAction,\n      }),\n      [id, selected, value, focused, disabled, actions, registerAction],\n    );\n\n    useIsomorphicLayoutEffect(() => {\n      const doc = targetWindow?.document;\n      if (!doc) {\n        return;\n      }\n\n      const host = doc.createElement(\"div\");\n      host.dataset.tabHost = value;\n      host.role = \"presentation\";\n      host.style.display = \"contents\";\n      setHostElement(host);\n\n      return () => {\n        host.remove();\n      };\n    }, [targetWindow, value]);\n\n    useIsomorphicLayoutEffect(() => {\n      if (renderMode !== \"inline\") {\n        return;\n      }\n\n      return registerBootstrapTab(value);\n    }, [registerBootstrapTab, renderMode, value]);\n\n    useIsomorphicLayoutEffect(() => {\n      setBootstrapTabReady(value, hostElement != null);\n\n      return () => {\n        setBootstrapTabReady(value, false);\n      };\n    }, [hostElement, setBootstrapTabReady, value]);\n\n    useIsomorphicLayoutEffect(() => {\n      if (!hostElement || !id) {\n        return;\n      }\n\n      return registerRenderedTab({\n        host: hostElement,\n        id,\n        marker: markerRef.current,\n        root: tabRootRef.current,\n        trigger: null,\n        value,\n        width: getIntrinsicMeasuredWidth(tabRootRef.current),\n      });\n    }, [hostElement, id, registerRenderedTab, value]);\n\n    useIsomorphicLayoutEffect(() => {\n      const updates = {\n        marker: markerRef.current,\n        root: tabRootRef.current,\n      } as Partial<{\n        host: HTMLDivElement;\n        id: string;\n        marker: HTMLElement | null;\n        root: HTMLElement | null;\n        trigger: HTMLButtonElement | null;\n        width: number;\n      }>;\n\n      if (renderMode === \"inline\") {\n        updates.width = getIntrinsicMeasuredWidth(tabRootRef.current);\n      }\n\n      updateRenderedTab(value, updates);\n    }, [renderMode, updateRenderedTab, value]);\n\n    useRenderedTabWidth({\n      hostElement,\n      renderMode,\n      tabRootRef,\n      targetWindow,\n      updateRenderedTab,\n      value,\n    });\n\n    const handleTabRootRef = useForkRef(tabRootRef, ref);\n\n    const tabMarkup = (\n      <TabContext.Provider value={context}>\n        <div\n          className={clsx(\n            withBaseName(),\n            {\n              [withBaseName(\"selected\")]: selected === value,\n              [withBaseName(\"disabled\")]: disabled,\n              [withBaseName(\"focusVisible\")]: focusVisible,\n            },\n            className,\n          )}\n          data-overflowitem=\"true\"\n          data-value={value}\n          ref={handleTabRootRef}\n          onMouseDown={handleMouseDown}\n          onFocusCapture={handleFocusCapture}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          role=\"presentation\"\n          {...rest}\n        >\n          {children}\n        </div>\n      </TabContext.Provider>\n    );\n\n    return (\n      <>\n        <span role=\"presentation\" data-tab-marker=\"\" hidden ref={markerRef} />\n        {renderMode === \"inline\"\n          ? tabMarkup\n          : hostElement\n            ? createPortal(tabMarkup, hostElement)\n            : null}\n      </>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Tab","useWindow","useComponentCssInjection","tabCss","useTabs","useId","useRef","useState","useCallback","id","useMemo","useIsomorphicLayoutEffect","getIntrinsicMeasuredWidth","useRenderedTabWidth","useForkRef","jsx","TabContext","clsx","jsxs","Fragment","createPortal"],"mappings":"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"}

package/dist-cjs/tabs/TabAction.js

@@ -0,0 +1,63 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var React = require('react');
+var Button = require('../button/Button.js');
+var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+var useId = require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var TabContext = require('./internal/contexts/TabContext.js');
+var TabsContext = require('./internal/contexts/TabsContext.js');
+
+const TabAction = React.forwardRef(
+  function TabAction2(props, ref) {
+    const {
+      "aria-labelledby": ariaLabelledBy,
+      id: idProp,
+      onFocus,
+      onMouseDown,
+      ...rest
+    } = props;
+    const id = useId.useId(idProp);
+    const { focused, selected, tabId, registerAction, value } = TabContext.useTab();
+    const { activeTab } = TabsContext.useTabs();
+    useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+      if (id) {
+        return registerAction(id);
+      }
+    }, [registerAction, id]);
+    const setActiveTab = () => {
+      if (tabId) {
+        activeTab.current = { id: tabId, value };
+      }
+    };
+    const handleFocus = (event) => {
+      onFocus == null ? void 0 : onFocus(event);
+      setActiveTab();
+    };
+    const handleMouseDown = (event) => {
+      onMouseDown == null ? void 0 : onMouseDown(event);
+      setActiveTab();
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Button.Button,
+      {
+        id,
+        "aria-labelledby": clsx.clsx(ariaLabelledBy, tabId, id),
+        tabIndex: focused || selected ? void 0 : -1,
+        appearance: "transparent",
+        sentiment: "neutral",
+        ref,
+        onFocus: handleFocus,
+        onMouseDown: handleMouseDown,
+        ...rest
+      }
+    );
+  }
+);
+
+exports.TabAction = TabAction;
+//# sourceMappingURL=TabAction.js.map

package/dist-cjs/tabs/TabAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabAction.js","sources":["../src/tabs/TabAction.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { type FocusEvent, forwardRef, type MouseEvent } from \"react\";\nimport { Button, type ButtonProps } from \"../button\";\nimport { useId, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useTab } from \"./internal/contexts/TabContext\";\nimport { useTabs } from \"./internal/contexts/TabsContext\";\n\nexport interface TabActionProps extends ButtonProps {}\n\nexport const TabAction = forwardRef<HTMLButtonElement, TabActionProps>(\n  function TabAction(props, ref) {\n    const {\n      \"aria-labelledby\": ariaLabelledBy,\n      id: idProp,\n      onFocus,\n      onMouseDown,\n      ...rest\n    } = props;\n\n    const id = useId(idProp);\n    const { focused, selected, tabId, registerAction, value } = useTab();\n    const { activeTab } = useTabs();\n\n    useIsomorphicLayoutEffect(() => {\n      if (id) {\n        return registerAction(id);\n      }\n    }, [registerAction, id]);\n\n    const setActiveTab = () => {\n      if (tabId) {\n        activeTab.current = { id: tabId, value };\n      }\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n      onFocus?.(event);\n      setActiveTab();\n    };\n\n    const handleMouseDown = (event: MouseEvent<HTMLButtonElement>) => {\n      onMouseDown?.(event);\n      setActiveTab();\n    };\n\n    return (\n      <Button\n        id={id}\n        aria-labelledby={clsx(ariaLabelledBy, tabId, id)}\n        tabIndex={focused || selected ? undefined : -1}\n        appearance=\"transparent\"\n        sentiment=\"neutral\"\n        ref={ref}\n        onFocus={handleFocus}\n        onMouseDown={handleMouseDown}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","TabAction","useId","useTab","useTabs","useIsomorphicLayoutEffect","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;AASO,MAAM,SAAA,GAAYA,gBAAA;AAAA,EACvB,SAASC,UAAAA,CAAU,KAAA,EAAO,GAAA,EAAK;AAC7B,IAAA,MAAM;AAAA,MACJ,iBAAA,EAAmB,cAAA;AAAA,MACnB,EAAA,EAAI,MAAA;AAAA,MACJ,OAAA;AAAA,MACA,WAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,IAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,OAAO,cAAA,EAAgB,KAAA,KAAUC,iBAAA,EAAO;AACnE,IAAA,MAAM,EAAE,SAAA,EAAU,GAAIC,mBAAA,EAAQ;AAE9B,IAAAC,mDAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,EAAA,EAAI;AACN,QAAA,OAAO,eAAe,EAAE,CAAA;AAAA,MAC1B;AAAA,IACF,CAAA,EAAG,CAAC,cAAA,EAAgB,EAAE,CAAC,CAAA;AAEvB,IAAA,MAAM,eAAe,MAAM;AACzB,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,SAAA,CAAU,OAAA,GAAU,EAAE,EAAA,EAAI,KAAA,EAAO,KAAA,EAAM;AAAA,MACzC;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,MAAA,YAAA,EAAa;AAAA,IACf,CAAA;AAEA,IAAA,MAAM,eAAA,GAAkB,CAAC,KAAA,KAAyC;AAChE,MAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,KAAA,CAAA;AACd,MAAA,YAAA,EAAa;AAAA,IACf,CAAA;AAEA,IAAA,uBACEC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,iBAAA,EAAiBC,SAAA,CAAK,cAAA,EAAgB,KAAA,EAAO,EAAE,CAAA;AAAA,QAC/C,QAAA,EAAU,OAAA,IAAW,QAAA,GAAW,MAAA,GAAY,EAAA;AAAA,QAC5C,UAAA,EAAW,aAAA;AAAA,QACX,SAAA,EAAU,SAAA;AAAA,QACV,GAAA;AAAA,QACA,OAAA,EAAS,WAAA;AAAA,QACT,WAAA,EAAa,eAAA;AAAA,QACZ,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/tabs/TabBar.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltTabBar {\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  position: relative;\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n}\n\n.saltTabBar-strip {\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  flex: 1 1 auto;\n  gap: var(--salt-spacing-100);\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n}\n\n.saltTabBar-divider::before {\n  content: \"\";\n  position: absolute;\n  inset: auto 0 0 0;\n  height: var(--salt-size-fixed-100);\n  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n}\n\n.saltTabBar-inset {\n  padding-left: var(--salt-spacing-300);\n  padding-right: var(--salt-spacing-300);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=TabBar.css.js.map

package/dist-cjs/tabs/TabBar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabBar.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/tabs/TabBar.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var TabBar$1 = require('./TabBar.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltTabBar");
+const TabBar = React.forwardRef(
+  function TabBar2(props, ref) {
+    const { className, children, divider, inset, ...rest } = props;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-tab-bar",
+      css: TabBar$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: clsx.clsx(
+          withBaseName(),
+          {
+            [withBaseName("divider")]: divider,
+            [withBaseName("inset")]: inset
+          },
+          className
+        ),
+        ...rest,
+        ref,
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("strip"), children })
+      }
+    );
+  }
+);
+
+exports.TabBar = TabBar;
+//# sourceMappingURL=TabBar.js.map

package/dist-cjs/tabs/TabBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabBar.js","sources":["../src/tabs/TabBar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport tabBarCss from \"./TabBar.css\";\n\nexport interface TabBarProps extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Styling variant with a bottom separator. Defaults to false\n   */\n  divider?: boolean;\n  /**\n   * Styling variant with left and right padding. Defaults to false\n   */\n  inset?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltTabBar\");\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(\n  function TabBar(props, ref) {\n    const { className, children, divider, inset, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tab-bar\",\n      css: tabBarCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"divider\")]: divider,\n            [withBaseName(\"inset\")]: inset,\n          },\n          className,\n        )}\n        {...rest}\n        ref={ref}\n      >\n        <div className={withBaseName(\"strip\")}>{children}</div>\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","TabBar","useWindow","useComponentCssInjection","tabBarCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA;AAEvC,MAAM,MAAA,GAASC,gBAAA;AAAA,EACpB,SAASC,OAAAA,CAAO,KAAA,EAAO,GAAA,EAAK;AAC1B,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEzD,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,OAAA;AAAA,YAC3B,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG;AAAA,WAC3B;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEA,yCAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,GAAI,QAAA,EAAS;AAAA;AAAA,KACnD;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/tabs/TabList.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = "/* Component class applied to the root element */\n.saltTabList {\n  display: flex;\n  flex-wrap: nowrap;\n  justify-content: flex-start;\n  align-items: center;\n  position: relative;\n  background: transparent;\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  gap: var(--salt-spacing-100);\n  max-width: 100%;\n  min-width: 0;\n  flex: 0 1 auto;\n}\n\n.saltTabList-center {\n  justify-content: center;\n}\n\n.saltTabList-right {\n  justify-content: flex-end;\n}\n\n.saltTabList-activeColorPrimary {\n  --saltTabList-activeColor: var(--salt-container-primary-background);\n}\n\n.saltTabList-activeColorSecondary {\n  --saltTabList-activeColor: var(--salt-container-secondary-background);\n}\n\n.saltTabList-activeColorTertiary {\n  --saltTabList-activeColor: var(--salt-container-tertiary-background);\n}\n\n.saltTabList-measureContainer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 0;\n  overflow: hidden;\n  pointer-events: none;\n  visibility: hidden;\n  white-space: nowrap;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=TabList.css.js.map

package/dist-cjs/tabs/TabList.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabList.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}