@salt-ds/core 1.72.0 → 1.74.0

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sources":["../src/tabs/Tabs.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n  type SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { type Item, TabsContext } from \"./internal/contexts/TabsContext\";\nimport { useOverflowSelectionState } from \"./internal/overflow/useOverflowSelectionState\";\nimport { useCollection } from \"./internal/registry/useCollection\";\nimport { useRenderedTabsRegistry } from \"./internal/registry/useRenderedTabsRegistry\";\nimport tabsCss from \"./Tabs.css\";\n\nexport interface TabsProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n  children?: ReactNode;\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: string;\n  /**\n   * The value. Use when the component is controlled.\n   */\n  value?: string;\n  /**\n   * Callback fired when the selection changes.\n   * The event will be null when selection is moved automatically, such as when\n   * the currently selected tab is removed and the next available tab is\n   * selected.\n   */\n  onChange?: (event: SyntheticEvent | null, value: string) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltTabs\");\n\nfunction setValueIdMapEntry(\n  map: Map<string, string>,\n  value: string,\n  id: string,\n) {\n  if (map.get(value) === id) {\n    return map;\n  }\n\n  const next = new Map(map);\n  next.set(value, id);\n  return next;\n}\n\nfunction removeValueIdMapEntry(\n  map: Map<string, string>,\n  value: string,\n  id: string,\n) {\n  if (map.get(value) !== id) {\n    return map;\n  }\n\n  const next = new Map(map);\n  next.delete(value);\n  return next;\n}\n\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(\n  function Tabs(props, ref) {\n    const { className, children, value, defaultValue, onChange, ...rest } =\n      props;\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tabs\",\n      css: tabsCss,\n      window: targetWindow,\n    });\n\n    const [valueToTabIdMap, setValueToIdMap] = useState(\n      () => new Map<string, string>(),\n    );\n    const [valueToPanelIdMap, setValueToPanelIdMap] = useState(\n      () => new Map<string, string>(),\n    );\n    const {\n      renderMode,\n      registerBootstrapTab,\n      setBootstrapTabReady,\n      setBootstrapOverflowReady,\n      registerRenderedTab,\n      updateRenderedTab,\n      getRenderedTab,\n      getRenderedTabOrder,\n      renderedTabs,\n    } = useRenderedTabsRegistry();\n\n    const {\n      registerItem,\n      updateItem,\n      item,\n      getNext,\n      getPrevious,\n      getFirst,\n      getLast,\n      itemAt,\n      getIndex,\n      sortItems,\n      removalVersion,\n      getRemovedItems,\n    } = useCollection({ targetWindow, wrap: true });\n\n    const activeTab = useRef<Pick<Item, \"id\" | \"value\">>();\n\n    const [menuOpen, setMenuOpen] = useState(false);\n\n    const [selected, setSelectedState] = useControlled({\n      controlled: value,\n      default: defaultValue,\n      name: \"Tabs\",\n      state: \"selected\",\n    });\n\n    const commitSelection = useCallback(\n      (event: SyntheticEvent | null, newValue: string) => {\n        setSelectedState(newValue);\n        if (selected !== newValue) {\n          onChange?.(event, newValue);\n        }\n      },\n      [onChange, selected],\n    );\n    const { selectionFromOverflowValueRef, setSelected } =\n      useOverflowSelectionState({\n        commitSelection,\n        menuOpen,\n        selected,\n        setMenuOpen,\n      });\n\n    const registerTab = useCallback(\n      (tab: Item) => {\n        const cleanup = registerItem(tab);\n        setValueToIdMap((map) => setValueIdMapEntry(map, tab.value, tab.id));\n\n        return () => {\n          cleanup();\n          setValueToIdMap((map) =>\n            removeValueIdMapEntry(map, tab.value, tab.id),\n          );\n        };\n      },\n      [registerItem],\n    );\n\n    const registerPanel = useCallback((id: string, value: string) => {\n      setValueToPanelIdMap((map) => setValueIdMapEntry(map, value, id));\n      return () => {\n        setValueToPanelIdMap((map) => removeValueIdMapEntry(map, value, id));\n      };\n    }, []);\n\n    const getPanelId = useCallback(\n      (value: string) => {\n        return valueToPanelIdMap.get(value);\n      },\n      [valueToPanelIdMap],\n    );\n\n    const getTabId = useCallback(\n      (value: string) => {\n        return valueToTabIdMap.get(value);\n      },\n      [valueToTabIdMap],\n    );\n\n    const context = useMemo(\n      () => ({\n        renderMode,\n        registerBootstrapTab,\n        setBootstrapTabReady,\n        setBootstrapOverflowReady,\n        registerTab,\n        updateTab: updateItem,\n        registerRenderedTab,\n        updateRenderedTab,\n        getRenderedTab,\n        getRenderedTabOrder,\n        renderedTabs,\n        registerPanel,\n        getPanelId,\n        getTabId,\n        selected,\n        setSelected,\n        item,\n        getNext,\n        getPrevious,\n        getFirst,\n        getLast,\n        activeTab,\n        selectionFromOverflowValueRef,\n        menuOpen,\n        setMenuOpen,\n        itemAt,\n        getIndex,\n        sortItems,\n        removalVersion,\n        getRemovedItems,\n      }),\n      [\n        renderMode,\n        registerBootstrapTab,\n        setBootstrapTabReady,\n        setBootstrapOverflowReady,\n        registerPanel,\n        registerTab,\n        updateItem,\n        registerRenderedTab,\n        updateRenderedTab,\n        getRenderedTab,\n        getRenderedTabOrder,\n        renderedTabs,\n        getPanelId,\n        getTabId,\n        selected,\n        setSelected,\n        item,\n        getNext,\n        getPrevious,\n        getFirst,\n        getLast,\n        menuOpen,\n        itemAt,\n        getIndex,\n        sortItems,\n        removalVersion,\n        getRemovedItems,\n        selectionFromOverflowValueRef,\n      ],\n    );\n\n    return (\n      <TabsContext.Provider value={context}>\n        <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n          {children}\n        </div>\n      </TabsContext.Provider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Tabs","useWindow","useComponentCssInjection","tabsCss","useState","useRenderedTabsRegistry","useCollection","useRef","useControlled","useCallback","useOverflowSelectionState","value","useMemo","TabsContext","clsx"],"mappings":"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"}
+{"version":3,"file":"Tabs.js","sources":["../src/tabs/Tabs.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n  type SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { type Item, TabsContext } from \"./internal/contexts/TabsContext\";\nimport { useOverflowSelectionState } from \"./internal/overflow/useOverflowSelectionState\";\nimport { useCollection } from \"./internal/registry/useCollection\";\nimport { useRenderedTabsRegistry } from \"./internal/registry/useRenderedTabsRegistry\";\nimport tabsCss from \"./Tabs.css\";\n\nexport interface TabsProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n  children?: ReactNode;\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: string;\n  /**\n   * The value. Use when the component is controlled.\n   */\n  value?: string;\n  /**\n   * Callback fired when the selection changes.\n   * The event will be null when selection is moved automatically, such as when\n   * the currently selected tab is removed and the next available tab is\n   * selected.\n   */\n  onChange?: (event: SyntheticEvent | null, value: string) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltTabs\");\n\nfunction setValueIdMapEntry(\n  map: Map<string, string>,\n  value: string,\n  id: string,\n) {\n  if (map.get(value) === id) {\n    return map;\n  }\n\n  const next = new Map(map);\n  next.set(value, id);\n  return next;\n}\n\nfunction removeValueIdMapEntry(\n  map: Map<string, string>,\n  value: string,\n  id: string,\n) {\n  if (map.get(value) !== id) {\n    return map;\n  }\n\n  const next = new Map(map);\n  next.delete(value);\n  return next;\n}\n\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(\n  function Tabs(props, ref) {\n    const { className, children, value, defaultValue, onChange, ...rest } =\n      props;\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-tabs\",\n      css: tabsCss,\n      window: targetWindow,\n    });\n\n    const [valueToTabIdMap, setValueToIdMap] = useState(\n      () => new Map<string, string>(),\n    );\n    const [valueToPanelIdMap, setValueToPanelIdMap] = useState(\n      () => new Map<string, string>(),\n    );\n    const {\n      renderMode,\n      registerBootstrapTab,\n      setBootstrapTabReady,\n      setBootstrapOverflowReady,\n      registerRenderedTab,\n      updateRenderedTab,\n      getRenderedTab,\n      getRenderedTabOrder,\n      renderedTabs,\n    } = useRenderedTabsRegistry();\n\n    const {\n      registerItem,\n      updateItem,\n      item,\n      getNext,\n      getPrevious,\n      getFirst,\n      getLast,\n      itemAt,\n      getIndex,\n      sortItems,\n      removalVersion,\n      getRemovedItems,\n    } = useCollection({ targetWindow, wrap: true });\n\n    const activeTab = useRef<Pick<Item, \"id\" | \"value\"> | undefined>(undefined);\n\n    const [menuOpen, setMenuOpen] = useState(false);\n\n    const [selected, setSelectedState] = useControlled({\n      controlled: value,\n      default: defaultValue,\n      name: \"Tabs\",\n      state: \"selected\",\n    });\n\n    const commitSelection = useCallback(\n      (event: SyntheticEvent | null, newValue: string) => {\n        setSelectedState(newValue);\n        if (selected !== newValue) {\n          onChange?.(event, newValue);\n        }\n      },\n      [onChange, selected],\n    );\n    const { selectionFromOverflowValueRef, setSelected } =\n      useOverflowSelectionState({\n        commitSelection,\n        menuOpen,\n        selected,\n        setMenuOpen,\n      });\n\n    const registerTab = useCallback(\n      (tab: Item) => {\n        const cleanup = registerItem(tab);\n        setValueToIdMap((map) => setValueIdMapEntry(map, tab.value, tab.id));\n\n        return () => {\n          cleanup();\n          setValueToIdMap((map) =>\n            removeValueIdMapEntry(map, tab.value, tab.id),\n          );\n        };\n      },\n      [registerItem],\n    );\n\n    const registerPanel = useCallback((id: string, value: string) => {\n      setValueToPanelIdMap((map) => setValueIdMapEntry(map, value, id));\n      return () => {\n        setValueToPanelIdMap((map) => removeValueIdMapEntry(map, value, id));\n      };\n    }, []);\n\n    const getPanelId = useCallback(\n      (value: string) => {\n        return valueToPanelIdMap.get(value);\n      },\n      [valueToPanelIdMap],\n    );\n\n    const getTabId = useCallback(\n      (value: string) => {\n        return valueToTabIdMap.get(value);\n      },\n      [valueToTabIdMap],\n    );\n\n    const context = useMemo(\n      () => ({\n        renderMode,\n        registerBootstrapTab,\n        setBootstrapTabReady,\n        setBootstrapOverflowReady,\n        registerTab,\n        updateTab: updateItem,\n        registerRenderedTab,\n        updateRenderedTab,\n        getRenderedTab,\n        getRenderedTabOrder,\n        renderedTabs,\n        registerPanel,\n        getPanelId,\n        getTabId,\n        selected,\n        setSelected,\n        item,\n        getNext,\n        getPrevious,\n        getFirst,\n        getLast,\n        activeTab,\n        selectionFromOverflowValueRef,\n        menuOpen,\n        setMenuOpen,\n        itemAt,\n        getIndex,\n        sortItems,\n        removalVersion,\n        getRemovedItems,\n      }),\n      [\n        renderMode,\n        registerBootstrapTab,\n        setBootstrapTabReady,\n        setBootstrapOverflowReady,\n        registerPanel,\n        registerTab,\n        updateItem,\n        registerRenderedTab,\n        updateRenderedTab,\n        getRenderedTab,\n        getRenderedTabOrder,\n        renderedTabs,\n        getPanelId,\n        getTabId,\n        selected,\n        setSelected,\n        item,\n        getNext,\n        getPrevious,\n        getFirst,\n        getLast,\n        menuOpen,\n        itemAt,\n        getIndex,\n        sortItems,\n        removalVersion,\n        getRemovedItems,\n        selectionFromOverflowValueRef,\n      ],\n    );\n\n    return (\n      <TabsContext.Provider value={context}>\n        <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n          {children}\n        </div>\n      </TabsContext.Provider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Tabs","useWindow","useComponentCssInjection","tabsCss","useState","useRenderedTabsRegistry","useCollection","useRef","useControlled","useCallback","useOverflowSelectionState","value","useMemo","TabsContext","clsx"],"mappings":"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"}

package/dist-cjs/tabs/internal/overflow/useOverflow.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOverflow.js","sources":["../src/tabs/internal/overflow/useOverflow.ts"],"sourcesContent":["import {\n  type MutableRefObject,\n  type RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { ownerWindow, useIsomorphicLayoutEffect } from \"../../../utils\";\nimport type { RenderedTab } from \"../contexts/TabsContext\";\nimport { isHTMLElement } from \"../utils/domUtils\";\nimport {\n  calculateVisibleCount,\n  MIN_TRUSTED_TAB_WIDTH,\n  partitionVisibleValues,\n} from \"./overflowMath\";\nimport {\n  getGapValue,\n  getMeasuredWidth,\n  seedWidthMap,\n  updateWidthMap,\n} from \"./widthMeasurement\";\n\ninterface UseOverflowProps {\n  container: RefObject<HTMLElement>;\n  selected?: string;\n  tabs: RenderedTab[];\n  overflowButton: RefObject<HTMLButtonElement>;\n  menuOpen: boolean;\n}\n\nfunction getTabWidth(tab: RenderedTab) {\n  const width = tab.width || getMeasuredWidth(tab.root);\n  return width > MIN_TRUSTED_TAB_WIDTH ? width : null;\n}\n\nfunction getAvailableWidth(element: HTMLElement) {\n  const parent = element.parentElement;\n  if (!parent) {\n    return getMeasuredWidth(element);\n  }\n\n  const parentWidth = getMeasuredWidth(parent);\n  const parentStyles = ownerWindow(parent).getComputedStyle(parent);\n  const parentGap = getGapValue(parentStyles);\n  const siblings = Array.from(parent.children).filter(\n    (child): child is HTMLElement => {\n      if (!isHTMLElement(child) || child === element) {\n        return false;\n      }\n\n      return ownerWindow(child).getComputedStyle(child).display !== \"none\";\n    },\n  );\n\n  const siblingWidth = siblings.reduce((width, sibling) => {\n    return width + getMeasuredWidth(sibling);\n  }, 0);\n  const gapCount = siblings.length > 0 ? siblings.length : 0;\n  const availableWidth = Math.max(\n    0,\n    parentWidth - siblingWidth - gapCount * parentGap,\n  );\n  return availableWidth;\n}\n\nfunction isSelectedValueHidden(\n  selected: string | undefined,\n  hiddenValues: string[],\n) {\n  return selected !== undefined && hiddenValues.includes(selected);\n}\n\nfunction getPinnedSelectionValue(\n  selected: string | undefined,\n  selectedIsHidden: boolean,\n  pinnedSelectionRef: MutableRefObject<string | undefined>,\n) {\n  return selectedIsHidden ? selected : pinnedSelectionRef.current;\n}\n\nexport function useOverflow({\n  container,\n  overflowButton,\n  tabs,\n  selected,\n  menuOpen,\n}: UseOverflowProps) {\n  const orderedValues = useMemo(() => tabs.map((tab) => tab.value), [tabs]);\n  const measurementInputKey = useMemo(() => {\n    return tabs.map((tab) => `${tab.value}:${tab.width.toFixed(2)}`).join(\"\\0\");\n  }, [tabs]);\n  const [visibleCount, setVisibleCount] = useState(0);\n  const [isMeasuring, setIsMeasuring] = useState(true);\n  const [measureRetryVersion, setMeasureRetryVersion] = useState(0);\n  const pinnedSelectionRef = useRef(selected);\n  const previousOverflowButtonWidthRef = useRef(0);\n  const previousMeasurementInputKeyRef = useRef(measurementInputKey);\n  const previousMenuOpenRef = useRef(menuOpen);\n  const measureRetryFrameRef = useRef<number | null>(null);\n  const measureRetryCountRef = useRef(0);\n  const baseHiddenValues = orderedValues.slice(visibleCount);\n  const selectedIsHidden = isSelectedValueHidden(selected, baseHiddenValues);\n  const pinnedValue = getPinnedSelectionValue(\n    selected,\n    selectedIsHidden,\n    pinnedSelectionRef,\n  );\n  const getCurrentPinnedValue = useCallback(() => {\n    return getPinnedSelectionValue(\n      selected,\n      selectedIsHidden,\n      pinnedSelectionRef,\n    );\n  }, [selected, selectedIsHidden]);\n  const markMeasurementStale = useCallback(() => {\n    setIsMeasuring(true);\n  }, []);\n\n  const measureVisibleCount = useCallback(\n    (pinnedValue?: string) => {\n      const element = container.current;\n      if (!element) {\n        return null;\n      }\n\n      const maxWidth = getAvailableWidth(element);\n      const styles = ownerWindow(element).getComputedStyle(element);\n      const gap = getGapValue(styles);\n      const overflowWidth = overflowButton.current\n        ? overflowButton.current.offsetWidth + gap\n        : 0;\n      const measuredTabs = tabs.map((tab) => ({\n        value: tab.value,\n        width: getTabWidth(tab),\n      }));\n\n      return calculateVisibleCount({\n        gap,\n        maxWidth,\n        overflowWidth,\n        pinnedValue,\n        tabs: measuredTabs,\n      });\n    },\n    [container, overflowButton, tabs],\n  );\n  const clearMeasureRetry = useCallback(() => {\n    const element = container.current;\n    const frame = measureRetryFrameRef.current;\n\n    if (element && frame != null) {\n      ownerWindow(element).cancelAnimationFrame(frame);\n    }\n\n    measureRetryFrameRef.current = null;\n    measureRetryCountRef.current = 0;\n  }, [container]);\n\n  useEffect(() => {\n    return clearMeasureRetry;\n  }, [clearMeasureRetry]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (selected !== undefined && selectedIsHidden) {\n      pinnedSelectionRef.current = selected;\n      const nextVisibleCount = measureVisibleCount(selected);\n      if (nextVisibleCount == null) {\n        markMeasurementStale();\n        return;\n      }\n      if (nextVisibleCount !== visibleCount) {\n        setVisibleCount(nextVisibleCount);\n      }\n      if (isMeasuring) {\n        setIsMeasuring(false);\n      }\n    }\n  }, [\n    isMeasuring,\n    markMeasurementStale,\n    measureVisibleCount,\n    selected,\n    selectedIsHidden,\n    visibleCount,\n  ]);\n\n  useEffect(() => {\n    const element = container.current;\n    if (!element || menuOpen || isMeasuring) {\n      return;\n    }\n\n    const observedElements = [element];\n    const parent = element.parentElement;\n    if (parent) {\n      observedElements.push(parent);\n      for (const child of Array.from(parent.children)) {\n        if (isHTMLElement(child) && child !== element) {\n          observedElements.push(child);\n        }\n      }\n    }\n\n    const widths = seedWidthMap(observedElements);\n    const resizeObserverCtor = ownerWindow(element).ResizeObserver;\n    if (!resizeObserverCtor) {\n      return;\n    }\n\n    const resizeObserver = new resizeObserverCtor(\n      (entries: ResizeObserverEntry[]) => {\n        for (const entry of entries) {\n          if (!isHTMLElement(entry.target)) {\n            continue;\n          }\n\n          const nextWidth = entry.contentRect.width;\n          if (updateWidthMap(widths, entry.target, nextWidth)) {\n            const nextVisibleCount = measureVisibleCount(\n              getCurrentPinnedValue(),\n            );\n\n            if (nextVisibleCount != null && nextVisibleCount === visibleCount) {\n              continue;\n            }\n\n            markMeasurementStale();\n            return;\n          }\n        }\n      },\n    );\n\n    for (const observedElement of observedElements) {\n      resizeObserver.observe(observedElement);\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [\n    container,\n    getCurrentPinnedValue,\n    isMeasuring,\n    markMeasurementStale,\n    measureVisibleCount,\n    menuOpen,\n    visibleCount,\n  ]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (previousMenuOpenRef.current && !menuOpen) {\n      markMeasurementStale();\n    }\n\n    previousMenuOpenRef.current = menuOpen;\n  }, [markMeasurementStale, menuOpen]);\n\n  useIsomorphicLayoutEffect(() => {\n    const nextOverflowButtonWidth = overflowButton.current?.offsetWidth ?? 0;\n    if (previousOverflowButtonWidthRef.current === nextOverflowButtonWidth) {\n      return;\n    }\n\n    previousOverflowButtonWidthRef.current = nextOverflowButtonWidth;\n    if (visibleCount < tabs.length) {\n      markMeasurementStale();\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (previousMeasurementInputKeyRef.current !== measurementInputKey) {\n      previousMeasurementInputKeyRef.current = measurementInputKey;\n      markMeasurementStale();\n    }\n  }, [markMeasurementStale, measurementInputKey]);\n\n  useIsomorphicLayoutEffect(() => {\n    // A content-only tab width update can briefly leave a tab without a\n    // trustworthy measured width after it moves through the portal slots.\n    // Retry on the next frame instead of leaving overflow stuck measuring.\n    void measureRetryVersion;\n\n    if (!isMeasuring || menuOpen) {\n      return;\n    }\n\n    const nextVisibleCount = measureVisibleCount(getCurrentPinnedValue());\n\n    if (nextVisibleCount == null) {\n      if (measureRetryFrameRef.current != null) {\n        return;\n      }\n\n      const element = container.current;\n      if (!element || getMeasuredWidth(element) <= MIN_TRUSTED_TAB_WIDTH) {\n        measureRetryCountRef.current = 0;\n        return;\n      }\n\n      if (measureRetryCountRef.current >= 5) {\n        return;\n      }\n\n      measureRetryCountRef.current += 1;\n      measureRetryFrameRef.current = ownerWindow(element).requestAnimationFrame(\n        () => {\n          measureRetryFrameRef.current = null;\n          setMeasureRetryVersion((currentVersion) => currentVersion + 1);\n        },\n      );\n      return;\n    }\n\n    clearMeasureRetry();\n\n    setVisibleCount(nextVisibleCount);\n    setIsMeasuring(false);\n  }, [\n    clearMeasureRetry,\n    container.current,\n    getCurrentPinnedValue,\n    isMeasuring,\n    measureRetryVersion,\n    measureVisibleCount,\n    menuOpen,\n  ]);\n\n  const { visibleValues, hiddenValues } = partitionVisibleValues(\n    orderedValues,\n    visibleCount,\n    pinnedValue,\n  );\n\n  return [visibleValues, hiddenValues, isMeasuring] as const;\n}\n"],"names":["getMeasuredWidth","MIN_TRUSTED_TAB_WIDTH","ownerWindow","getGapValue","isHTMLElement","useMemo","useState","useRef","useCallback","pinnedValue","calculateVisibleCount","useEffect","useIsomorphicLayoutEffect","seedWidthMap","updateWidthMap","partitionVisibleValues"],"mappings":"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"}
+{"version":3,"file":"useOverflow.js","sources":["../src/tabs/internal/overflow/useOverflow.ts"],"sourcesContent":["import {\n  type MutableRefObject,\n  type RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { ownerWindow, useIsomorphicLayoutEffect } from \"../../../utils\";\nimport type { RenderedTab } from \"../contexts/TabsContext\";\nimport { isHTMLElement } from \"../utils/domUtils\";\nimport {\n  calculateVisibleCount,\n  MIN_TRUSTED_TAB_WIDTH,\n  partitionVisibleValues,\n} from \"./overflowMath\";\nimport {\n  getGapValue,\n  getMeasuredWidth,\n  seedWidthMap,\n  updateWidthMap,\n} from \"./widthMeasurement\";\n\ninterface UseOverflowProps {\n  container: RefObject<HTMLElement | null>;\n  selected?: string;\n  tabs: RenderedTab[];\n  overflowButton: RefObject<HTMLButtonElement | null>;\n  menuOpen: boolean;\n}\n\nfunction getTabWidth(tab: RenderedTab) {\n  const width = tab.width || getMeasuredWidth(tab.root);\n  return width > MIN_TRUSTED_TAB_WIDTH ? width : null;\n}\n\nfunction getAvailableWidth(element: HTMLElement) {\n  const parent = element.parentElement;\n  if (!parent) {\n    return getMeasuredWidth(element);\n  }\n\n  const parentWidth = getMeasuredWidth(parent);\n  const parentStyles = ownerWindow(parent).getComputedStyle(parent);\n  const parentGap = getGapValue(parentStyles);\n  const siblings = Array.from(parent.children).filter(\n    (child): child is HTMLElement => {\n      if (!isHTMLElement(child) || child === element) {\n        return false;\n      }\n\n      return ownerWindow(child).getComputedStyle(child).display !== \"none\";\n    },\n  );\n\n  const siblingWidth = siblings.reduce((width, sibling) => {\n    return width + getMeasuredWidth(sibling);\n  }, 0);\n  const gapCount = siblings.length > 0 ? siblings.length : 0;\n  const availableWidth = Math.max(\n    0,\n    parentWidth - siblingWidth - gapCount * parentGap,\n  );\n  return availableWidth;\n}\n\nfunction isSelectedValueHidden(\n  selected: string | undefined,\n  hiddenValues: string[],\n) {\n  return selected !== undefined && hiddenValues.includes(selected);\n}\n\nfunction getPinnedSelectionValue(\n  selected: string | undefined,\n  selectedIsHidden: boolean,\n  pinnedSelectionRef: MutableRefObject<string | undefined>,\n) {\n  return selectedIsHidden ? selected : pinnedSelectionRef.current;\n}\n\nexport function useOverflow({\n  container,\n  overflowButton,\n  tabs,\n  selected,\n  menuOpen,\n}: UseOverflowProps) {\n  const orderedValues = useMemo(() => tabs.map((tab) => tab.value), [tabs]);\n  const measurementInputKey = useMemo(() => {\n    return tabs.map((tab) => `${tab.value}:${tab.width.toFixed(2)}`).join(\"\\0\");\n  }, [tabs]);\n  const [visibleCount, setVisibleCount] = useState(0);\n  const [isMeasuring, setIsMeasuring] = useState(true);\n  const [measureRetryVersion, setMeasureRetryVersion] = useState(0);\n  const pinnedSelectionRef = useRef(selected);\n  const previousOverflowButtonWidthRef = useRef(0);\n  const previousMeasurementInputKeyRef = useRef(measurementInputKey);\n  const previousMenuOpenRef = useRef(menuOpen);\n  const measureRetryFrameRef = useRef<number | null>(null);\n  const measureRetryCountRef = useRef(0);\n  const baseHiddenValues = orderedValues.slice(visibleCount);\n  const selectedIsHidden = isSelectedValueHidden(selected, baseHiddenValues);\n  const pinnedValue = getPinnedSelectionValue(\n    selected,\n    selectedIsHidden,\n    pinnedSelectionRef,\n  );\n  const getCurrentPinnedValue = useCallback(() => {\n    return getPinnedSelectionValue(\n      selected,\n      selectedIsHidden,\n      pinnedSelectionRef,\n    );\n  }, [selected, selectedIsHidden]);\n  const markMeasurementStale = useCallback(() => {\n    setIsMeasuring(true);\n  }, []);\n\n  const measureVisibleCount = useCallback(\n    (pinnedValue?: string) => {\n      const element = container.current;\n      if (!element) {\n        return null;\n      }\n\n      const maxWidth = getAvailableWidth(element);\n      const styles = ownerWindow(element).getComputedStyle(element);\n      const gap = getGapValue(styles);\n      const overflowWidth = overflowButton.current\n        ? overflowButton.current.offsetWidth + gap\n        : 0;\n      const measuredTabs = tabs.map((tab) => ({\n        value: tab.value,\n        width: getTabWidth(tab),\n      }));\n\n      return calculateVisibleCount({\n        gap,\n        maxWidth,\n        overflowWidth,\n        pinnedValue,\n        tabs: measuredTabs,\n      });\n    },\n    [container, overflowButton, tabs],\n  );\n  const clearMeasureRetry = useCallback(() => {\n    const element = container.current;\n    const frame = measureRetryFrameRef.current;\n\n    if (element && frame != null) {\n      ownerWindow(element).cancelAnimationFrame(frame);\n    }\n\n    measureRetryFrameRef.current = null;\n    measureRetryCountRef.current = 0;\n  }, [container]);\n\n  useEffect(() => {\n    return clearMeasureRetry;\n  }, [clearMeasureRetry]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (selected !== undefined && selectedIsHidden) {\n      pinnedSelectionRef.current = selected;\n      const nextVisibleCount = measureVisibleCount(selected);\n      if (nextVisibleCount == null) {\n        markMeasurementStale();\n        return;\n      }\n      if (nextVisibleCount !== visibleCount) {\n        setVisibleCount(nextVisibleCount);\n      }\n      if (isMeasuring) {\n        setIsMeasuring(false);\n      }\n    }\n  }, [\n    isMeasuring,\n    markMeasurementStale,\n    measureVisibleCount,\n    selected,\n    selectedIsHidden,\n    visibleCount,\n  ]);\n\n  useEffect(() => {\n    const element = container.current;\n    if (!element || menuOpen || isMeasuring) {\n      return;\n    }\n\n    const observedElements = [element];\n    const parent = element.parentElement;\n    if (parent) {\n      observedElements.push(parent);\n      for (const child of Array.from(parent.children)) {\n        if (isHTMLElement(child) && child !== element) {\n          observedElements.push(child);\n        }\n      }\n    }\n\n    const widths = seedWidthMap(observedElements);\n    const resizeObserverCtor = ownerWindow(element).ResizeObserver;\n    if (!resizeObserverCtor) {\n      return;\n    }\n\n    const resizeObserver = new resizeObserverCtor(\n      (entries: ResizeObserverEntry[]) => {\n        for (const entry of entries) {\n          if (!isHTMLElement(entry.target)) {\n            continue;\n          }\n\n          const nextWidth = entry.contentRect.width;\n          if (updateWidthMap(widths, entry.target, nextWidth)) {\n            const nextVisibleCount = measureVisibleCount(\n              getCurrentPinnedValue(),\n            );\n\n            if (nextVisibleCount != null && nextVisibleCount === visibleCount) {\n              continue;\n            }\n\n            markMeasurementStale();\n            return;\n          }\n        }\n      },\n    );\n\n    for (const observedElement of observedElements) {\n      resizeObserver.observe(observedElement);\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [\n    container,\n    getCurrentPinnedValue,\n    isMeasuring,\n    markMeasurementStale,\n    measureVisibleCount,\n    menuOpen,\n    visibleCount,\n  ]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (previousMenuOpenRef.current && !menuOpen) {\n      markMeasurementStale();\n    }\n\n    previousMenuOpenRef.current = menuOpen;\n  }, [markMeasurementStale, menuOpen]);\n\n  useIsomorphicLayoutEffect(() => {\n    const nextOverflowButtonWidth = overflowButton.current?.offsetWidth ?? 0;\n    if (previousOverflowButtonWidthRef.current === nextOverflowButtonWidth) {\n      return;\n    }\n\n    previousOverflowButtonWidthRef.current = nextOverflowButtonWidth;\n    if (visibleCount < tabs.length) {\n      markMeasurementStale();\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (previousMeasurementInputKeyRef.current !== measurementInputKey) {\n      previousMeasurementInputKeyRef.current = measurementInputKey;\n      markMeasurementStale();\n    }\n  }, [markMeasurementStale, measurementInputKey]);\n\n  useIsomorphicLayoutEffect(() => {\n    // A content-only tab width update can briefly leave a tab without a\n    // trustworthy measured width after it moves through the portal slots.\n    // Retry on the next frame instead of leaving overflow stuck measuring.\n    void measureRetryVersion;\n\n    if (!isMeasuring || menuOpen) {\n      return;\n    }\n\n    const nextVisibleCount = measureVisibleCount(getCurrentPinnedValue());\n\n    if (nextVisibleCount == null) {\n      if (measureRetryFrameRef.current != null) {\n        return;\n      }\n\n      const element = container.current;\n      if (!element || getMeasuredWidth(element) <= MIN_TRUSTED_TAB_WIDTH) {\n        measureRetryCountRef.current = 0;\n        return;\n      }\n\n      if (measureRetryCountRef.current >= 5) {\n        return;\n      }\n\n      measureRetryCountRef.current += 1;\n      measureRetryFrameRef.current = ownerWindow(element).requestAnimationFrame(\n        () => {\n          measureRetryFrameRef.current = null;\n          setMeasureRetryVersion((currentVersion) => currentVersion + 1);\n        },\n      );\n      return;\n    }\n\n    clearMeasureRetry();\n\n    setVisibleCount(nextVisibleCount);\n    setIsMeasuring(false);\n  }, [\n    clearMeasureRetry,\n    container.current,\n    getCurrentPinnedValue,\n    isMeasuring,\n    measureRetryVersion,\n    measureVisibleCount,\n    menuOpen,\n  ]);\n\n  const { visibleValues, hiddenValues } = partitionVisibleValues(\n    orderedValues,\n    visibleCount,\n    pinnedValue,\n  );\n\n  return [visibleValues, hiddenValues, isMeasuring] as const;\n}\n"],"names":["getMeasuredWidth","MIN_TRUSTED_TAB_WIDTH","ownerWindow","getGapValue","isHTMLElement","useMemo","useState","useRef","useCallback","pinnedValue","calculateVisibleCount","useEffect","useIsomorphicLayoutEffect","seedWidthMap","updateWidthMap","partitionVisibleValues"],"mappings":"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"}

package/dist-cjs/tabs/internal/overflow/useRenderedTabWidth.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRenderedTabWidth.js","sources":["../src/tabs/internal/overflow/useRenderedTabWidth.ts"],"sourcesContent":["import { type RefObject, useEffect } from \"react\";\nimport type { TabsContextValue, TabsRenderMode } from \"../contexts/TabsContext\";\nimport { getIntrinsicMeasuredWidth } from \"./widthMeasurement\";\n\nconst MIN_TRUSTED_RENDERED_TAB_WIDTH = 0.5;\n\ninterface UseRenderedTabWidthProps {\n  hostElement: HTMLDivElement | null;\n  renderMode: TabsRenderMode;\n  tabRootRef: RefObject<HTMLDivElement>;\n  targetWindow: Window | null | undefined;\n  updateRenderedTab: TabsContextValue[\"updateRenderedTab\"];\n  value: string;\n}\n\nfunction isSecondaryMeasurementContext(element: HTMLElement) {\n  return (\n    element.closest(\".saltTabOverflowList-list\") ||\n    element.closest(\".saltTabList-measureContainer\")\n  );\n}\n\nexport function useRenderedTabWidth({\n  hostElement,\n  renderMode,\n  tabRootRef,\n  targetWindow,\n  updateRenderedTab,\n  value,\n}: UseRenderedTabWidthProps) {\n  useEffect(() => {\n    if (!hostElement) {\n      return;\n    }\n\n    const element = tabRootRef.current;\n    const resizeObserverCtor = (\n      targetWindow as\n        | (Window & { ResizeObserver?: typeof ResizeObserver })\n        | undefined\n    )?.ResizeObserver;\n    const mutationObserverCtor = (\n      targetWindow as\n        | (Window & { MutationObserver?: typeof MutationObserver })\n        | undefined\n    )?.MutationObserver;\n    if (!element || !resizeObserverCtor) {\n      return;\n    }\n\n    const updateWidth = (allowSecondaryMeasurementContext = false) => {\n      if (!element.isConnected) {\n        return;\n      }\n\n      // Preserve the strip width while a tab is rendered in the overflow menu.\n      // Overflow items stretch to the menu width, and hidden measurement tabs\n      // can collapse to a different intrinsic size. Neither width is suitable\n      // for deciding whether the tab fits back in the main strip once the tab\n      // is already established. A one-time seeded width is still useful for\n      // newly mounted tabs before they have ever appeared in the main strip.\n      if (\n        !allowSecondaryMeasurementContext &&\n        isSecondaryMeasurementContext(element)\n      ) {\n        return;\n      }\n\n      const width = getIntrinsicMeasuredWidth(element);\n      if (width <= MIN_TRUSTED_RENDERED_TAB_WIDTH) {\n        return;\n      }\n\n      updateRenderedTab(value, {\n        width,\n      });\n    };\n\n    let animationFrameId: number | null = null;\n    const scheduleWidthUpdate = (allowSecondaryMeasurementContext = false) => {\n      if (!targetWindow?.requestAnimationFrame) {\n        updateWidth(allowSecondaryMeasurementContext);\n        return;\n      }\n\n      if (animationFrameId != null) {\n        targetWindow.cancelAnimationFrame(animationFrameId);\n      }\n\n      animationFrameId = targetWindow.requestAnimationFrame(() => {\n        animationFrameId = null;\n        updateWidth(allowSecondaryMeasurementContext);\n      });\n    };\n\n    if (renderMode === \"portal\") {\n      scheduleWidthUpdate(true);\n    } else {\n      updateWidth(true);\n    }\n\n    const resizeObserver = new resizeObserverCtor(() => {\n      updateWidth();\n    });\n\n    resizeObserver.observe(element);\n    const mutationObserver = mutationObserverCtor\n      ? new mutationObserverCtor(() => {\n          scheduleWidthUpdate();\n        })\n      : null;\n\n    mutationObserver?.observe(element, {\n      childList: true,\n      characterData: true,\n      subtree: true,\n    });\n\n    return () => {\n      if (animationFrameId != null && targetWindow) {\n        targetWindow.cancelAnimationFrame(animationFrameId);\n      }\n      mutationObserver?.disconnect();\n      resizeObserver.disconnect();\n    };\n  }, [\n    hostElement,\n    renderMode,\n    tabRootRef,\n    targetWindow,\n    updateRenderedTab,\n    value,\n  ]);\n}\n"],"names":["useEffect","getIntrinsicMeasuredWidth"],"mappings":"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"}
+{"version":3,"file":"useRenderedTabWidth.js","sources":["../src/tabs/internal/overflow/useRenderedTabWidth.ts"],"sourcesContent":["import { type RefObject, useEffect } from \"react\";\nimport type { TabsContextValue, TabsRenderMode } from \"../contexts/TabsContext\";\nimport { getIntrinsicMeasuredWidth } from \"./widthMeasurement\";\n\nconst MIN_TRUSTED_RENDERED_TAB_WIDTH = 0.5;\n\ninterface UseRenderedTabWidthProps {\n  hostElement: HTMLDivElement | null;\n  renderMode: TabsRenderMode;\n  tabRootRef: RefObject<HTMLDivElement | null>;\n  targetWindow: Window | null | undefined;\n  updateRenderedTab: TabsContextValue[\"updateRenderedTab\"];\n  value: string;\n}\n\nfunction isSecondaryMeasurementContext(element: HTMLElement) {\n  return (\n    element.closest(\".saltTabOverflowList-list\") ||\n    element.closest(\".saltTabList-measureContainer\")\n  );\n}\n\nexport function useRenderedTabWidth({\n  hostElement,\n  renderMode,\n  tabRootRef,\n  targetWindow,\n  updateRenderedTab,\n  value,\n}: UseRenderedTabWidthProps) {\n  useEffect(() => {\n    if (!hostElement) {\n      return;\n    }\n\n    const element = tabRootRef.current;\n    const resizeObserverCtor = (\n      targetWindow as\n        | (Window & { ResizeObserver?: typeof ResizeObserver })\n        | undefined\n    )?.ResizeObserver;\n    const mutationObserverCtor = (\n      targetWindow as\n        | (Window & { MutationObserver?: typeof MutationObserver })\n        | undefined\n    )?.MutationObserver;\n    if (!element || !resizeObserverCtor) {\n      return;\n    }\n\n    const updateWidth = (allowSecondaryMeasurementContext = false) => {\n      if (!element.isConnected) {\n        return;\n      }\n\n      // Preserve the strip width while a tab is rendered in the overflow menu.\n      // Overflow items stretch to the menu width, and hidden measurement tabs\n      // can collapse to a different intrinsic size. Neither width is suitable\n      // for deciding whether the tab fits back in the main strip once the tab\n      // is already established. A one-time seeded width is still useful for\n      // newly mounted tabs before they have ever appeared in the main strip.\n      if (\n        !allowSecondaryMeasurementContext &&\n        isSecondaryMeasurementContext(element)\n      ) {\n        return;\n      }\n\n      const width = getIntrinsicMeasuredWidth(element);\n      if (width <= MIN_TRUSTED_RENDERED_TAB_WIDTH) {\n        return;\n      }\n\n      updateRenderedTab(value, {\n        width,\n      });\n    };\n\n    let animationFrameId: number | null = null;\n    const scheduleWidthUpdate = (allowSecondaryMeasurementContext = false) => {\n      if (!targetWindow?.requestAnimationFrame) {\n        updateWidth(allowSecondaryMeasurementContext);\n        return;\n      }\n\n      if (animationFrameId != null) {\n        targetWindow.cancelAnimationFrame(animationFrameId);\n      }\n\n      animationFrameId = targetWindow.requestAnimationFrame(() => {\n        animationFrameId = null;\n        updateWidth(allowSecondaryMeasurementContext);\n      });\n    };\n\n    if (renderMode === \"portal\") {\n      scheduleWidthUpdate(true);\n    } else {\n      updateWidth(true);\n    }\n\n    const resizeObserver = new resizeObserverCtor(() => {\n      updateWidth();\n    });\n\n    resizeObserver.observe(element);\n    const mutationObserver = mutationObserverCtor\n      ? new mutationObserverCtor(() => {\n          scheduleWidthUpdate();\n        })\n      : null;\n\n    mutationObserver?.observe(element, {\n      childList: true,\n      characterData: true,\n      subtree: true,\n    });\n\n    return () => {\n      if (animationFrameId != null && targetWindow) {\n        targetWindow.cancelAnimationFrame(animationFrameId);\n      }\n      mutationObserver?.disconnect();\n      resizeObserver.disconnect();\n    };\n  }, [\n    hostElement,\n    renderMode,\n    tabRootRef,\n    targetWindow,\n    updateRenderedTab,\n    value,\n  ]);\n}\n"],"names":["useEffect","getIntrinsicMeasuredWidth"],"mappings":"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"}

package/dist-cjs/text/Code.js

@@ -5,7 +5,7 @@ var React = require('react');
 var Text = require('./Text.js');
 
 const Code = React.forwardRef(
-  function TextAction({ children, ...rest }, ref) {
+  function Code2({ children, ...rest }, ref) {
     return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "code", ref, ...rest, children });
   }
 );

package/dist-cjs/text/Code.js.map

@@ -1 +1 @@
-{"version":3,"file":"Code.js","sources":["../src/text/Code.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nexport const Code = forwardRef<HTMLSpanElement, Omit<TextProps<\"code\">, \"as\">>(\n  function TextAction({ children, ...rest }, ref) {\n    return (\n      <Text as=\"code\" ref={ref} {...rest}>\n        {children}\n      </Text>\n    );\n  },\n);\n"],"names":["forwardRef","Text"],"mappings":";;;;;;AAGO,MAAM,IAAA,GAAOA,gBAAA;AAAA,EAClB,SAAS,UAAA,CAAW,EAAE,UAAU,GAAG,IAAA,IAAQ,GAAA,EAAK;AAC9C,IAAA,sCACGC,SAAA,EAAA,EAAK,EAAA,EAAG,QAAO,GAAA,EAAW,GAAG,MAC3B,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"Code.js","sources":["../src/text/Code.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nexport const Code = forwardRef<HTMLSpanElement, Omit<TextProps<\"code\">, \"as\">>(\n  function Code({ children, ...rest }, ref) {\n    return (\n      <Text as=\"code\" ref={ref} {...rest}>\n        {children}\n      </Text>\n    );\n  },\n);\n"],"names":["forwardRef","Code","Text"],"mappings":";;;;;;AAGO,MAAM,IAAA,GAAOA,gBAAA;AAAA,EAClB,SAASC,KAAAA,CAAK,EAAE,UAAU,GAAG,IAAA,IAAQ,GAAA,EAAK;AACxC,IAAA,sCACGC,SAAA,EAAA,EAAK,EAAA,EAAG,QAAO,GAAA,EAAW,GAAG,MAC3B,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/text/Editorial.js

@@ -0,0 +1,32 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var Text = require('./Text.js');
+
+const Editorial1 = React.forwardRef(function Editorial12({ children, styleAs = "editorial1", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+const Editorial2 = React.forwardRef(function Editorial22({ children, styleAs = "editorial2", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+const Editorial3 = React.forwardRef(function Editorial32({ children, styleAs = "editorial3", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+const Editorial4 = React.forwardRef(function Editorial42({ children, styleAs = "editorial4", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+const Editorial5 = React.forwardRef(function Editorial52({ children, styleAs = "editorial5", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+const Editorial6 = React.forwardRef(function Editorial62({ children, styleAs = "editorial6", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+
+exports.Editorial1 = Editorial1;
+exports.Editorial2 = Editorial2;
+exports.Editorial3 = Editorial3;
+exports.Editorial4 = Editorial4;
+exports.Editorial5 = Editorial5;
+exports.Editorial6 = Editorial6;
+//# sourceMappingURL=Editorial.js.map

package/dist-cjs/text/Editorial.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Editorial.js","sources":["../src/text/Editorial.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nexport const Editorial1 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial1({ children, styleAs = \"editorial1\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Editorial2 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial2({ children, styleAs = \"editorial2\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Editorial3 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial3({ children, styleAs = \"editorial3\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Editorial4 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial4({ children, styleAs = \"editorial4\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Editorial5 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial5({ children, styleAs = \"editorial5\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Editorial6 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Editorial6({ children, styleAs = \"editorial6\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["forwardRef","Editorial1","jsx","Text","Editorial2","Editorial3","Editorial4","Editorial5","Editorial6"],"mappings":";;;;;;AAGO,MAAM,UAAA,GAAaA,gBAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEC,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAaH,gBAAA,CAGxB,SAASI,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEF,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAaH,gBAAA,CAGxB,SAASK,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEH,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAaH,gBAAA,CAGxB,SAASM,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEJ,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAaH,gBAAA,CAGxB,SAASO,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEL,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAaH,gBAAA,CAGxB,SAASQ,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACEN,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;;;;;;;;;"}

package/dist-cjs/text/Eyebrow.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var Text = require('./Text.js');
+
+const Eyebrow = React.forwardRef(function Eyebrow2({ children, styleAs = "eyebrow", ...rest }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { as: "span", styleAs, ref, ...rest, children });
+});
+
+exports.Eyebrow = Eyebrow;
+//# sourceMappingURL=Eyebrow.js.map

package/dist-cjs/text/Eyebrow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Eyebrow.js","sources":["../src/text/Eyebrow.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nexport const Eyebrow = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Eyebrow({ children, styleAs = \"eyebrow\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["forwardRef","Eyebrow","jsx","Text"],"mappings":";;;;;;AAGO,MAAM,OAAA,GAAUA,gBAAA,CAGrB,SAASC,QAAAA,CAAQ,EAAE,QAAA,EAAU,OAAA,GAAU,SAAA,EAAW,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AAClE,EAAA,uBACEC,cAAA,CAACC,aAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/text/Text.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltText {\n  --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n  color: var(--saltText-color, var(--text-color));\n  font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n  font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n  letter-spacing: var(--salt-text-letterSpacing);\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: var(--text-max-rows, 0);\n  overflow: hidden;\n  word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n  --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n  --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n  --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n  --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n  --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n  --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n  --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n  --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n  font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Body emphasis small */\n.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-notation-fontSize);\n  line-height: var(--salt-text-notation-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Notation emphasis strong */\n.saltText-notation.saltText strong {\n  font-weight: var(--salt-text-notation-fontWeight-strong);\n}\n\n/* Notation emphasis small */\n.saltText-notation.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-notation-fontWeight-small);\n}\n\n/* Action */\n.saltText-action.saltText {\n  font-family: var(--salt-text-action-fontFamily);\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  text-align: var(--salt-text-action-textAlign);\n  font-weight: var(--salt-text-action-fontWeight);\n}\n.saltText-action.saltText strong {\n  font-weight: var(--salt-text-action-fontWeight-strong);\n}\n.saltText-action.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-action-fontWeight-small);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n  font-family: var(--salt-text-code-fontFamily);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display1-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display1-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n}\n\n/* Display 1 emphasis strong */\n.saltText-display1.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-strong);\n}\n\n/* Display 1 emphasis small */\n.saltText-display1.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-small);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display2-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display2-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n}\n\n/* Display 2 emphasis strong */\n.saltText-display2.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-strong);\n}\n\n/* Display 2 emphasis small */\n.saltText-display2.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-small);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display3-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display3-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n}\n\n/* Display 3 emphasis strong */\n.saltText-display3.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-strong);\n}\n\n/* Display 3 emphasis small */\n.saltText-display3.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-small);\n}\n\n/* Display 4 */\n.saltText-display4.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display4-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display4-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n}\n\n/* Display 4 emphasis strong */\n.saltText-display4.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-strong);\n}\n\n/* Display 4 emphasis small */\n.saltText-display4.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display-fontWeight-small);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h1-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n  font-weight: var(--salt-text-heading-fontWeight-strong);\n}\n\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-heading-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h2-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n  font-weight: var(--salt-text-heading-fontWeight-strong);\n}\n\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-heading-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h3-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n  font-weight: var(--salt-text-heading-fontWeight-strong);\n}\n\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-heading-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h4-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n  font-weight: var(--salt-text-heading-fontWeight-strong);\n}\n\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-heading-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  line-height: var(--salt-text-label-lineHeight);\n  font-weight: var(--salt-text-label-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n  font-weight: var(--salt-text-label-fontWeight-strong);\n}\n\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-label-fontWeight-small);\n}\n";
+var css_248z = ".saltText {\n  --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n  color: var(--saltText-color, var(--text-color));\n  font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n  font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n  letter-spacing: var(--salt-text-letterSpacing);\n  --text-fontWeight-bolder: var(--salt-text-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-fontWeight-lighter);\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: var(--text-max-rows, 0);\n  overflow: hidden;\n  word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n  --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n  --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n  --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n  --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n  --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n  --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n  --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n  --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-notation-fontSize);\n  line-height: var(--salt-text-notation-lineHeight);\n  font-weight: var(--salt-text-notation-fontWeight);\n  --text-fontWeight-bolder: var(--salt-text-notation-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-notation-fontWeight-lighter);\n}\n\n/* Action */\n.saltText-action.saltText {\n  font-family: var(--salt-text-action-fontFamily);\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  text-align: var(--salt-text-action-textAlign);\n  font-weight: var(--salt-text-action-fontWeight);\n  --text-fontWeight-bolder: var(--salt-text-action-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-action-fontWeight-lighter);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n  font-family: var(--salt-text-code-fontFamily);\n  font-weight: var(--salt-text-code-fontWeight);\n  /* Code has a single weight, so lighter and bolder match the default */\n  --text-fontWeight-bolder: var(--salt-text-code-fontWeight);\n  --text-fontWeight-lighter: var(--salt-text-code-fontWeight);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display1-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display1-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-display-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-display-fontWeight-lighter);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display2-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display2-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-display-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-display-fontWeight-lighter);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display3-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display3-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-display-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-display-fontWeight-lighter);\n}\n\n/* Display 4 */\n.saltText-display4.saltText {\n  font-family: var(--salt-text-display-fontFamily);\n  font-size: var(--salt-text-display4-fontSize);\n  font-style: var(--salt-text-display-fontStyle, normal);\n  font-weight: var(--salt-text-display-fontWeight);\n  letter-spacing: var(--salt-text-display-letterSpacing, var(--salt-text-letterSpacing));\n  line-height: var(--salt-text-display4-lineHeight);\n  text-transform: var(--salt-text-display-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-display-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-display-fontWeight-lighter);\n}\n\n/* Editorial 1 */\n.saltText-editorial1.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial1-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial1-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Editorial 2 */\n.saltText-editorial2.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial2-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial2-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Editorial 3 */\n.saltText-editorial3.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial3-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial3-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Editorial 4 */\n.saltText-editorial4.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial4-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial4-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Editorial 5 */\n.saltText-editorial5.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial5-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial5-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Editorial 6 */\n.saltText-editorial6.saltText {\n  font-family: var(--salt-text-editorial-fontFamily);\n  font-size: var(--salt-text-editorial6-fontSize);\n  font-style: var(--salt-text-editorial-fontStyle, normal);\n  font-weight: var(--salt-text-editorial-fontWeight);\n  letter-spacing: var(--salt-text-editorial-letterSpacing);\n  line-height: var(--salt-text-editorial6-lineHeight);\n  text-transform: var(--salt-text-editorial-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-editorial-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-editorial-fontWeight-lighter);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h1-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h1-lineHeight);\n  --text-fontWeight-bolder: var(--salt-text-heading-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-heading-fontWeight-lighter);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h2-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h2-lineHeight);\n  --text-fontWeight-bolder: var(--salt-text-heading-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-heading-fontWeight-lighter);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h3-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h3-lineHeight);\n  --text-fontWeight-bolder: var(--salt-text-heading-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-heading-fontWeight-lighter);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n  font-family: var(--salt-text-heading-fontFamily);\n  font-size: var(--salt-text-h4-fontSize);\n  font-weight: var(--salt-text-heading-fontWeight);\n  line-height: var(--salt-text-h4-lineHeight);\n  --text-fontWeight-bolder: var(--salt-text-heading-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-heading-fontWeight-lighter);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  line-height: var(--salt-text-label-lineHeight);\n  font-weight: var(--salt-text-label-fontWeight);\n  --text-fontWeight-bolder: var(--salt-text-label-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-label-fontWeight-lighter);\n}\n\n/* Label 2 */\n.saltText-label2.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-label2-fontSize);\n  line-height: var(--salt-text-label2-lineHeight);\n  font-weight: var(--salt-text-label-fontWeight);\n  --text-fontWeight-bolder: var(--salt-text-label-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-label-fontWeight-lighter);\n}\n\n/* Body 2 */\n.saltText-body2.saltText {\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-body2-fontSize);\n  line-height: var(--salt-text-body2-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n  --text-fontWeight-bolder: var(--salt-text-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-fontWeight-lighter);\n}\n\n/* Eyebrow */\n.saltText-eyebrow.saltText {\n  font-family: var(--salt-text-eyebrow-fontFamily);\n  font-size: var(--salt-text-eyebrow-fontSize);\n  font-style: var(--salt-text-eyebrow-fontStyle, normal);\n  font-weight: var(--salt-text-eyebrow-fontWeight);\n  letter-spacing: var(--salt-text-eyebrow-letterSpacing);\n  line-height: var(--salt-text-eyebrow-lineHeight);\n  text-transform: var(--salt-text-eyebrow-textTransform, none);\n  --text-fontWeight-bolder: var(--salt-text-eyebrow-fontWeight-bolder);\n  --text-fontWeight-lighter: var(--salt-text-eyebrow-fontWeight-lighter);\n}\n\n/* Inherit the parent's text style, including its bolder and lighter weights */\n.saltText-inheritStyle.saltText {\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  line-height: inherit;\n  --text-fontWeight-bolder: inherit;\n  --text-fontWeight-lighter: inherit;\n}\n\n/* Emphasis strong */\n.saltText strong,\n.saltText b {\n  font-weight: var(--text-fontWeight-bolder, var(--salt-text-fontWeight-bolder));\n}\n\n/* Emphasis small. Deprecated, use the fontWeight prop instead */\n.saltText small {\n  font-size: inherit;\n  font-weight: var(--text-fontWeight-lighter, var(--salt-text-fontWeight-lighter));\n}\n\n/* Font weight prop. Must follow the text styles so it overrides their weights */\n.saltText.saltText-bolder {\n  font-weight: var(--text-fontWeight-bolder, var(--salt-text-fontWeight-bolder));\n}\n\n.saltText.saltText-lighter {\n  font-weight: var(--text-fontWeight-lighter, var(--salt-text-fontWeight-lighter));\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=Text.css.js.map

package/dist-cjs/text/Text.js

@@ -18,6 +18,7 @@ const Text = React.forwardRef(function Text2({
   children,
   className,
   disabled = false,
+  fontWeight,
   maxRows,
   style,
   styleAs,
@@ -33,7 +34,7 @@ const Text = React.forwardRef(function Text2({
   });
   const Component = as ?? "div";
   const textStyles = { "--text-max-rows": maxRows, ...style };
-  const color = variant ?? colorProp ?? "primary";
+  const color = variant ?? colorProp ?? (styleAs === "inherit" ? "inherit" : "primary");
   return /* @__PURE__ */ jsxRuntime.jsx(
     Component,
     {
@@ -42,7 +43,10 @@ const Text = React.forwardRef(function Text2({
         {
           [withBaseName("disabled")]: disabled,
           [withBaseName("lineClamp")]: maxRows,
-          [withBaseName(styleAs)]: styleAs,
+          [withBaseName(
+            styleAs === "inherit" ? "inheritStyle" : styleAs
+          )]: styleAs,
+          [withBaseName(fontWeight)]: fontWeight,
           [withBaseName(color)]: color !== "inherit"
         },
         className

package/dist-cjs/text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n} from \"react\";\nimport type { ValidationStatus } from \"../status-indicator\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type PolymorphicRef,\n} from \"../utils\";\nimport textCss from \"./Text.css\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"display4\"\n      | \"notation\"\n      | \"action\"\n      | \"code\";\n    /**\n     * Change text color palette\n     * @deprecated since 1.27.1. Use `color` instead.\n     */\n    variant?: \"primary\" | \"secondary\";\n    /*\n     * The color of the text. Defaults to \"primary\".\n     */\n    color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>,\n) => ReturnType<FunctionComponent>;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(function Text<\n  T extends ElementType = \"div\",\n>(\n  {\n    as,\n    children,\n    className,\n    disabled = false,\n    maxRows,\n    style,\n    styleAs,\n    variant,\n    color: colorProp,\n    ...restProps\n  }: TextProps<T>,\n  ref?: ForwardedRef<unknown>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-text\",\n    css: textCss,\n    window: targetWindow,\n  });\n\n  const Component = as ?? \"div\";\n\n  const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n  const color = variant ?? colorProp ?? \"primary\";\n\n  return (\n    <Component\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"lineClamp\")]: maxRows,\n          [withBaseName(styleAs as string)]: styleAs,\n          [withBaseName(color)]: color !== \"inherit\",\n        },\n        className,\n      )}\n      {...restProps}\n      ref={ref as PolymorphicRef<T>}\n      style={textStyles}\n    >\n      {children}\n    </Component>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Text","useWindow","useComponentCssInjection","textCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA;AAErC,MAAM,IAAA,GAAsBC,gBAAA,CAAW,SAASC,KAAAA,CAGrD;AAAA,EACE,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,OAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,EAAO,SAAA;AAAA,EACP,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,WAAA;AAAA,IACR,GAAA,EAAKC,MAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,YAAY,EAAA,IAAM,KAAA;AAExB,EAAA,MAAM,UAAA,GAAa,EAAE,iBAAA,EAAmB,OAAA,EAAS,GAAG,KAAA,EAAM;AAE1D,EAAA,MAAM,KAAA,GAAQ,WAAW,SAAA,IAAa,SAAA;AAEtC,EAAA,uBACEC,cAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,OAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,OAAiB,CAAC,GAAG,OAAA;AAAA,UACnC,CAAC,YAAA,CAAa,KAAK,CAAC,GAAG,KAAA,KAAU;AAAA,SACnC;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAA,EAAO,UAAA;AAAA,MAEN;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ElementType,\n  type ForwardedRef,\n  type FunctionComponent,\n  forwardRef,\n} from \"react\";\nimport type { ValidationStatus } from \"../status-indicator\";\nimport {\n  makePrefixer,\n  type PolymorphicComponentPropWithRef,\n  type PolymorphicRef,\n} from \"../utils\";\nimport textCss from \"./Text.css\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Adjust the font weight using the theme's weights for the current text style.\n     * This is a visual change only and isn't conveyed to assistive technologies; use `<strong>` or `<em>` to convey importance or stress.\n     */\n    fontWeight?: \"lighter\" | \"bolder\";\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style.\n     * Use `inherit` to inherit the font and color from the parent element.\n     * The `lighter` and `bolder` weights then come from the closest `Text`-based ancestor.\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"label2\"\n      | \"body2\"\n      | \"eyebrow\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"display4\"\n      | \"editorial1\"\n      | \"editorial2\"\n      | \"editorial3\"\n      | \"editorial4\"\n      | \"editorial5\"\n      | \"editorial6\"\n      | \"notation\"\n      | \"action\"\n      | \"code\"\n      | \"inherit\";\n    /**\n     * Change text color palette\n     * @deprecated since 1.27.1. Use `color` instead.\n     */\n    variant?: \"primary\" | \"secondary\";\n    /*\n     * The color of the text. Defaults to \"primary\".\n     */\n    color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>,\n) => ReturnType<FunctionComponent>;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(function Text<\n  T extends ElementType = \"div\",\n>(\n  {\n    as,\n    children,\n    className,\n    disabled = false,\n    fontWeight,\n    maxRows,\n    style,\n    styleAs,\n    variant,\n    color: colorProp,\n    ...restProps\n  }: TextProps<T>,\n  ref?: ForwardedRef<unknown>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-text\",\n    css: textCss,\n    window: targetWindow,\n  });\n\n  const Component = as ?? \"div\";\n\n  const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n  const color =\n    variant ?? colorProp ?? (styleAs === \"inherit\" ? \"inherit\" : \"primary\");\n\n  return (\n    <Component\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"lineClamp\")]: maxRows,\n          [withBaseName(\n            styleAs === \"inherit\" ? \"inheritStyle\" : (styleAs as string),\n          )]: styleAs,\n          [withBaseName(fontWeight as string)]: fontWeight,\n          [withBaseName(color)]: color !== \"inherit\",\n        },\n        className,\n      )}\n      {...restProps}\n      ref={ref as PolymorphicRef<T>}\n      style={textStyles}\n    >\n      {children}\n    </Component>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Text","useWindow","useComponentCssInjection","textCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AA6EA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA;AAErC,MAAM,IAAA,GAAsBC,gBAAA,CAAW,SAASC,KAAAA,CAGrD;AAAA,EACE,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,UAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,EAAO,SAAA;AAAA,EACP,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,WAAA;AAAA,IACR,GAAA,EAAKC,MAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,YAAY,EAAA,IAAM,KAAA;AAExB,EAAA,MAAM,UAAA,GAAa,EAAE,iBAAA,EAAmB,OAAA,EAAS,GAAG,KAAA,EAAM;AAE1D,EAAA,MAAM,KAAA,GACJ,OAAA,IAAW,SAAA,KAAc,OAAA,KAAY,YAAY,SAAA,GAAY,SAAA,CAAA;AAE/D,EAAA,uBACEC,cAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,OAAA;AAAA,UAC7B,CAAC,YAAA;AAAA,YACC,OAAA,KAAY,YAAY,cAAA,GAAkB;AAAA,WAC3C,GAAG,OAAA;AAAA,UACJ,CAAC,YAAA,CAAa,UAAoB,CAAC,GAAG,UAAA;AAAA,UACtC,CAAC,YAAA,CAAa,KAAK,CAAC,GAAG,KAAA,KAAU;AAAA,SACnC;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAA,EAAO,UAAA;AAAA,MAEN;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-cjs/toggle-button/ToggleButton.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltToggleButton {\n  --toggleButton-borderWidth: var(--salt-size-fixed-100);\n\n  align-items: center;\n  appearance: none;\n  background: var(--toggleButton-background);\n  border-color: var(--toggleButton-borderColor, transparent);\n  border-style: solid;\n  border-width: var(--toggleButton-borderWidth);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  box-sizing: border-box;\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-hover);\n  display: inline-flex;\n  gap: var(--salt-spacing-50);\n  height: var(--salt-size-base);\n  justify-content: center;\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-action-fontWeight);\n  font-family: var(--salt-text-action-fontFamily);\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  padding: 0 calc(var(--salt-spacing-100) - var(--toggleButton-borderWidth));\n  margin: 0;\n  min-width: unset;\n  position: relative;\n  text-align: var(--salt-text-action-textAlign);\n  text-decoration: none;\n  transition: none;\n  width: auto;\n  -webkit-appearance: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.saltToggleButton:focus-visible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n  background: var(--toggleButton-background-hover);\n  color: var(--toggleButton-text-color-hover);\n  border-color: var(--toggleButton-borderColor-hover);\n}\n\n@media (hover: hover) {\n  .saltToggleButton:hover {\n    background: var(--toggleButton-background-hover);\n    color: var(--toggleButton-text-color-hover);\n    border-color: var(--toggleButton-borderColor-hover);\n  }\n}\n\n.saltToggleButton:active {\n  background: var(--toggleButton-background-active);\n  color: var(--toggleButton-text-color-active);\n  border-color: var(--toggleButton-borderColor-active);\n}\n\n.saltToggleButton[aria-checked=\"true\"],\n.saltToggleButton[aria-pressed=\"true\"] {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  cursor: var(--salt-cursor-active);\n  border-color: var(--toggleButton-borderColor-selected);\n}\n\n.saltToggleButton[aria-checked=\"true\"]:hover {\n  cursor: unset;\n}\n\n.saltToggleButton[aria-pressed=\"true\"]:hover {\n  background: var(--toggleButton-background-selectedHover);\n  border-color: var(--toggleButton-borderColor-selectedHover);\n}\n\n.saltToggleButton[aria-disabled=\"true\"] {\n  background: var(--toggleButton-background);\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-disabled);\n  border-color: var(--toggleButton-borderColor);\n\n  opacity: 0.4;\n}\n\n.saltToggleButton[aria-checked=\"true\"].saltToggleButton[aria-disabled=\"true\"],\n.saltToggleButton[aria-pressed=\"true\"].saltToggleButton[aria-disabled=\"true\"] {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  border-color: var(--toggleButton-borderColor-selected);\n}\n\n.saltToggleButton.saltToggleButton-readOnly {\n  background: var(--toggleButton-background);\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-disabled);\n  border-color: var(--toggleButton-borderColor);\n\n  opacity: 0.4;\n}\n\n.saltToggleButton[aria-checked=\"true\"].saltToggleButton-readOnly,\n.saltToggleButton[aria-pressed=\"true\"].saltToggleButton-readOnly {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  border-color: var(--toggleButton-borderColor-selected);\n\n  opacity: unset;\n}\n\n.saltToggleButton-neutral.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);\n}\n\n.saltToggleButton-accented.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-accented-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-accented-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-accented-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);\n}\n\n.saltToggleButton-positive.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-positive-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-positive-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-positive-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-positive-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-positive-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-positive-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-positive-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-positive-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-positive-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);\n}\n\n.saltToggleButton-negative.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-negative-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-negative-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-negative-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-negative-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-negative-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-negative-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-negative-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-negative-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-negative-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);\n}\n\n.saltToggleButton-caution.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-caution-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-caution-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-caution-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-caution-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-caution-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-caution-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-caution-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-caution-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-caution-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);\n}\n\n.saltToggleButton-neutral.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-foreground);\n  --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-background);\n  --toggleButton-background-hover: var(--salt-actionable-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-background);\n  --toggleButton-background-selected: var(--salt-actionable-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-borderColor);\n  --toggleButton-borderColor-active: var(--salt-actionable-borderColor);\n  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);\n}\n\n.saltToggleButton-accented.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-accented-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-accented-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-accented-foreground);\n  --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-accented-background);\n  --toggleButton-background-hover: var(--salt-actionable-accented-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-accented-background);\n  --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-accented-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-accented-borderColor);\n  --toggleButton-borderColor-active: var(--salt-actionable-accented-borderColor);\n  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);\n}\n\n.saltToggleButton-positive.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-positive-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-positive-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-positive-foreground);\n  --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-positive-background);\n  --toggleButton-background-hover: var(--salt-actionable-positive-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-positive-background);\n  --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-positive-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-positive-borderColor);\n  --toggleButton-borderColor-active: var(--salt-actionable-positive-borderColor);\n  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-positive-bold-background-hover);\n}\n\n.saltToggleButton-negative.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-negative-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-negative-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-negative-foreground);\n  --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-negative-background);\n  --toggleButton-background-hover: var(--salt-actionable-negative-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-negative-background);\n  --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-negative-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-negative-borderColor);\n  --toggleButton-borderColor-active: var(--salt-actionable-negative-borderColor);\n  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);\n}\n\n.saltToggleButton-caution.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-caution-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-caution-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-caution-foreground);\n  --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);\n  --toggleButton-background: var(--salt-actionable-caution-background);\n  --toggleButton-background-hover: var(--salt-actionable-caution-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-caution-background);\n  --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-caution-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-caution-borderColor);\n  --toggleButton-borderColor-active: var(--salt-actionable-caution-borderColor);\n  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);\n}\n";
+var css_248z = ".saltToggleButton {\n  --toggleButton-borderWidth: var(--salt-size-fixed-100);\n\n  align-items: center;\n  appearance: none;\n  background: var(--toggleButton-background);\n  border-color: var(--toggleButton-borderColor, transparent);\n  border-style: solid;\n  border-width: var(--toggleButton-borderWidth);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  box-sizing: border-box;\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-hover);\n  display: inline-flex;\n  gap: var(--salt-spacing-50);\n  height: var(--salt-size-base);\n  justify-content: center;\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-action-fontWeight);\n  font-family: var(--salt-text-action-fontFamily);\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  padding: 0 calc(var(--salt-spacing-100) - var(--toggleButton-borderWidth));\n  margin: 0;\n  min-width: unset;\n  position: relative;\n  text-align: var(--salt-text-action-textAlign);\n  text-decoration: none;\n  transition: none;\n  width: auto;\n  -webkit-appearance: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.saltToggleButton:focus-visible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n  background: var(--toggleButton-background-hover);\n  color: var(--toggleButton-text-color-hover);\n  border-color: var(--toggleButton-borderColor-hover);\n}\n\n@media (hover: hover) {\n  .saltToggleButton:hover {\n    background: var(--toggleButton-background-hover);\n    color: var(--toggleButton-text-color-hover);\n    border-color: var(--toggleButton-borderColor-hover);\n  }\n}\n\n.saltToggleButton:active {\n  background: var(--toggleButton-background-active);\n  color: var(--toggleButton-text-color-active);\n  border-color: var(--toggleButton-borderColor-active);\n}\n\n.saltToggleButton[aria-checked=\"true\"],\n.saltToggleButton[aria-pressed=\"true\"] {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  cursor: var(--salt-cursor-active);\n  border-color: var(--toggleButton-borderColor-selected);\n}\n\n.saltToggleButton[aria-checked=\"true\"]:hover {\n  cursor: unset;\n}\n\n.saltToggleButton[aria-pressed=\"true\"]:hover {\n  background: var(--toggleButton-background-selectedHover);\n  color: var(--toggleButton-text-color-selectedHover);\n  border-color: var(--toggleButton-borderColor-selectedHover);\n}\n\n.saltToggleButton[aria-disabled=\"true\"] {\n  background: var(--toggleButton-background);\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-disabled);\n  border-color: var(--toggleButton-borderColor);\n\n  opacity: 0.4;\n}\n\n.saltToggleButton[aria-checked=\"true\"].saltToggleButton[aria-disabled=\"true\"],\n.saltToggleButton[aria-pressed=\"true\"].saltToggleButton[aria-disabled=\"true\"] {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  border-color: var(--toggleButton-borderColor-selected);\n}\n\n.saltToggleButton.saltToggleButton-readOnly {\n  background: var(--toggleButton-background);\n  color: var(--toggleButton-text-color);\n  cursor: var(--salt-cursor-disabled);\n  border-color: var(--toggleButton-borderColor);\n\n  opacity: 0.4;\n}\n\n.saltToggleButton[aria-checked=\"true\"].saltToggleButton-readOnly,\n.saltToggleButton[aria-pressed=\"true\"].saltToggleButton-readOnly {\n  background: var(--toggleButton-background-selected);\n  color: var(--toggleButton-text-color-selected);\n  border-color: var(--toggleButton-borderColor-selected);\n\n  opacity: unset;\n}\n\n.saltToggleButton-neutral.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);\n}\n\n.saltToggleButton-accented.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-accented-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-accented-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-accented-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-accented-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-accented-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-accented-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-accented-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-accented-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-accented-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);\n}\n\n.saltToggleButton-positive.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-positive-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-positive-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-positive-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-positive-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-positive-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-positive-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-positive-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-positive-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-positive-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-positive-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-positive-bold-background-hover);\n}\n\n.saltToggleButton-negative.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-negative-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-negative-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-negative-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-negative-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-negative-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-negative-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-negative-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-negative-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-negative-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-negative-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);\n}\n\n.saltToggleButton-caution.saltToggleButton-solid {\n  --toggleButton-text-color: var(--salt-actionable-caution-subtle-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-caution-subtle-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-caution-subtle-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-caution-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-caution-subtle-background);\n  --toggleButton-background-hover: var(--salt-actionable-caution-subtle-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-caution-subtle-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-caution-subtle-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-caution-subtle-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-caution-subtle-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);\n}\n\n.saltToggleButton-neutral.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-background);\n  --toggleButton-background-hover: var(--salt-actionable-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);\n}\n\n.saltToggleButton-accented.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-accented-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-accented-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-accented-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-accented-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-accented-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-accented-background);\n  --toggleButton-background-hover: var(--salt-actionable-accented-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-accented-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-accented-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-accented-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-accented-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-accented-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);\n}\n\n.saltToggleButton-positive.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-positive-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-positive-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-positive-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-positive-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-positive-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-positive-background);\n  --toggleButton-background-hover: var(--salt-actionable-positive-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-positive-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-positive-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-positive-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-positive-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-positive-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-positive-bold-background-hover);\n}\n\n.saltToggleButton-negative.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-negative-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-negative-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-negative-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-negative-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-negative-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-negative-background);\n  --toggleButton-background-hover: var(--salt-actionable-negative-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-negative-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-negative-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-negative-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-negative-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-negative-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);\n}\n\n.saltToggleButton-caution.saltToggleButton-bordered {\n  --toggleButton-text-color: var(--salt-actionable-caution-foreground);\n  --toggleButton-text-color-hover: var(--salt-actionable-caution-foreground-hover);\n  --toggleButton-text-color-active: var(--salt-actionable-caution-foreground-active);\n  --toggleButton-text-color-selected: var(--salt-actionable-caution-foreground-selected);\n  --toggleButton-text-color-selectedHover: var(--salt-actionable-caution-bold-foreground-hover);\n  --toggleButton-background: var(--salt-actionable-caution-background);\n  --toggleButton-background-hover: var(--salt-actionable-caution-background-hover);\n  --toggleButton-background-active: var(--salt-actionable-caution-background-active);\n  --toggleButton-background-selected: var(--salt-actionable-caution-background-selected);\n  --toggleButton-borderColor: var(--salt-actionable-caution-borderColor);\n  --toggleButton-borderColor-hover: var(--salt-actionable-caution-borderColor-hover);\n  --toggleButton-borderColor-active: var(--salt-actionable-caution-borderColor-active);\n  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);\n  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);\n  --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=ToggleButton.css.js.map

package/dist-cjs/toggle-button/ToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n  useClassNameInjection,\n  useComponentCssInjection,\n} 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  useRef,\n} from \"react\";\nimport type { ButtonAppearance, ButtonSentiment } from \"../button\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport {\n  makePrefixer,\n  useControlled,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  /**\n   * The appearance of the toggle button when `selected` is true.\n   * @default solid\n   */\n  appearance?: Extract<ButtonAppearance, \"bordered\" | \"solid\">;\n  /**\n   * Callback fired when the toggle button's selection state is changed.\n   */\n  onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * If `true`, the toggle button will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * The sentiment of the toggle button.\n   * @default neutral\n   */\n  sentiment?: ButtonSentiment;\n  /**\n   * Whether the toggle button is in a selected state.\n   */\n  selected?: boolean;\n  /**\n   * Whether the toggle button is selected by default.\n   * This will be disregarded if `selected` is already set.\n   */\n  defaultSelected?: boolean;\n  /**\n   * Value of the toggle button, to be used when in a controlled state.\n   */\n  value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n  function ToggleButton(props, ref) {\n    const { className, props: finalProps } = useClassNameInjection(\n      \"saltToggleButton\",\n      props,\n    );\n    const {\n      appearance: appearanceProp,\n      children,\n      disabled: disabledProp,\n      value,\n      onClick,\n      onFocus,\n      onChange,\n      readOnly: readOnlyProp,\n      selected: selectedProp,\n      defaultSelected,\n      sentiment: sentimentProp,\n      ...rest\n    } = finalProps;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-toggle-button\",\n      css: toggleButtonCss,\n      window: targetWindow,\n    });\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const handleRef = useForkRef(ref, buttonRef);\n\n    const toggleButtonGroup = useToggleButtonGroup();\n\n    const toggleButtonGroupSelected = toggleButtonGroup\n      ? toggleButtonGroup.isSelected(value)\n      : selectedProp;\n    const focusable = toggleButtonGroup\n      ? toggleButtonGroup?.isFocused(value)\n      : true;\n\n    const sentiment =\n      sentimentProp || toggleButtonGroup?.sentiment || \"neutral\";\n    const appearance =\n      appearanceProp || toggleButtonGroup?.appearance || \"solid\";\n    const disabled = toggleButtonGroup?.disabled || disabledProp;\n    const readOnly = toggleButtonGroup?.readOnly || readOnlyProp;\n\n    const registerButton = toggleButtonGroup?.registerButton;\n    useIsomorphicLayoutEffect(() => {\n      if (!disabled && buttonRef.current && registerButton) {\n        return registerButton(value, buttonRef.current);\n      }\n    }, [disabled, registerButton, value]);\n\n    const [selected, setSelected] = useControlled({\n      controlled: toggleButtonGroupSelected,\n      default: Boolean(defaultSelected),\n      name: \"ToggleButton\",\n      state: \"selected\",\n    });\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n      if (disabled || readOnly) {\n        return;\n      }\n      toggleButtonGroup?.select(event, value);\n      setSelected(!selected);\n      onChange?.(event);\n      onClick?.(event);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n      toggleButtonGroup?.focus(value);\n      onFocus?.(event);\n    };\n\n    const toggleButtonProps: ToggleButtonProps = {\n      \"aria-readonly\": readOnlyProp,\n      \"aria-pressed\": !toggleButtonGroup ? selected : undefined,\n      \"aria-checked\": toggleButtonGroup ? selected : undefined,\n      \"aria-disabled\": disabled,\n      role: toggleButtonGroup ? \"radio\" : undefined,\n      className: clsx(\n        withBaseName(),\n        withBaseName(sentiment),\n        withBaseName(appearance),\n        readOnly && withBaseName(\"readOnly\"),\n        className,\n      ),\n      onClick: handleClick,\n      onFocus: handleFocus,\n      tabIndex: focusable ? 0 : -1,\n      value: value,\n      type: \"button\",\n      disabled: disabled,\n      ...rest,\n    };\n\n    return (\n      <button ref={handleRef} {...toggleButtonProps}>\n        {children}\n      </button>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","ToggleButton","useClassNameInjection","useWindow","useComponentCssInjection","toggleButtonCss","useRef","useForkRef","useToggleButtonGroup","useIsomorphicLayoutEffect","useControlled","clsx"],"mappings":"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"}
+{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n  useClassNameInjection,\n  useComponentCssInjection,\n} 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  useRef,\n} from \"react\";\nimport type { ButtonAppearance, ButtonSentiment } from \"../button\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport {\n  makePrefixer,\n  useControlled,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps\n  extends Omit<ComponentPropsWithoutRef<\"button\">, \"onChange\"> {\n  /**\n   * The appearance of the toggle button when `selected` is true.\n   * @default solid\n   */\n  appearance?: Extract<ButtonAppearance, \"bordered\" | \"solid\">;\n  /**\n   * Callback fired when the toggle button's selection state is changed.\n   */\n  onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * If `true`, the toggle button will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * The sentiment of the toggle button.\n   * @default neutral\n   */\n  sentiment?: ButtonSentiment;\n  /**\n   * Whether the toggle button is in a selected state.\n   */\n  selected?: boolean;\n  /**\n   * Whether the toggle button is selected by default.\n   * This will be disregarded if `selected` is already set.\n   */\n  defaultSelected?: boolean;\n  /**\n   * Value of the toggle button, to be used when in a controlled state.\n   */\n  value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n  function ToggleButton(props, ref) {\n    const { className, props: finalProps } = useClassNameInjection(\n      \"saltToggleButton\",\n      props,\n    );\n    const {\n      appearance: appearanceProp,\n      children,\n      disabled: disabledProp,\n      value,\n      onClick,\n      onFocus,\n      onChange,\n      readOnly: readOnlyProp,\n      selected: selectedProp,\n      defaultSelected,\n      sentiment: sentimentProp,\n      ...rest\n    } = finalProps;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-toggle-button\",\n      css: toggleButtonCss,\n      window: targetWindow,\n    });\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const handleRef = useForkRef(ref, buttonRef);\n\n    const toggleButtonGroup = useToggleButtonGroup();\n\n    const toggleButtonGroupSelected = toggleButtonGroup\n      ? toggleButtonGroup.isSelected(value)\n      : selectedProp;\n    const focusable = toggleButtonGroup\n      ? toggleButtonGroup?.isFocused(value)\n      : true;\n\n    const sentiment =\n      sentimentProp || toggleButtonGroup?.sentiment || \"neutral\";\n    const appearance =\n      appearanceProp || toggleButtonGroup?.appearance || \"solid\";\n    const disabled = toggleButtonGroup?.disabled || disabledProp;\n    const readOnly = toggleButtonGroup?.readOnly || readOnlyProp;\n\n    const registerButton = toggleButtonGroup?.registerButton;\n    useIsomorphicLayoutEffect(() => {\n      if (!disabled && buttonRef.current && registerButton) {\n        return registerButton(value, buttonRef.current);\n      }\n    }, [disabled, registerButton, value]);\n\n    const [selected, setSelected] = useControlled({\n      controlled: toggleButtonGroupSelected,\n      default: Boolean(defaultSelected),\n      name: \"ToggleButton\",\n      state: \"selected\",\n    });\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n      if (disabled || readOnly) {\n        return;\n      }\n      toggleButtonGroup?.select(event, value);\n      setSelected(!selected);\n      onChange?.(event);\n      onClick?.(event);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n      toggleButtonGroup?.focus(value);\n      onFocus?.(event);\n    };\n\n    const toggleButtonProps: ComponentPropsWithoutRef<\"button\"> = {\n      \"aria-readonly\": readOnlyProp,\n      \"aria-pressed\": !toggleButtonGroup ? selected : undefined,\n      \"aria-checked\": toggleButtonGroup ? selected : undefined,\n      \"aria-disabled\": disabled,\n      role: toggleButtonGroup ? \"radio\" : undefined,\n      className: clsx(\n        withBaseName(),\n        withBaseName(sentiment),\n        withBaseName(appearance),\n        readOnly && withBaseName(\"readOnly\"),\n        className,\n      ),\n      onClick: handleClick,\n      onFocus: handleFocus,\n      tabIndex: focusable ? 0 : -1,\n      value: value,\n      type: \"button\",\n      disabled: disabled,\n      ...rest,\n    };\n\n    return (\n      <button ref={handleRef} {...toggleButtonProps}>\n        {children}\n      </button>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","ToggleButton","useClassNameInjection","useWindow","useComponentCssInjection","toggleButtonCss","useRef","useForkRef","useToggleButtonGroup","useIsomorphicLayoutEffect","useControlled","clsx"],"mappings":"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"}

package/dist-cjs/toolbar/ToolbarOverflow.js

@@ -119,6 +119,7 @@ function ToolbarOverflowItemOwner({
 }) {
   const targetWindow = window.useWindow();
   const [mountNode, setMountNode] = React.useState(null);
+  const mountNodeRef = React.useRef(null);
   const mainToolbarTabIndexMemoryRef = React.useRef(
     /* @__PURE__ */ new WeakMap()
   );
@@ -129,15 +130,18 @@ function ToolbarOverflowItemOwner({
   }
   const boundaryKey = host ? currentOverflowBoundaryKey : lastOverflowBoundaryKeyRef.current;
   useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
-    const nextMountNode = targetWindow == null ? void 0 : targetWindow.document.createElement("div");
-    if (!nextMountNode) {
+    var _a;
+    const ownerDocument = targetWindow == null ? void 0 : targetWindow.document;
+    if (!ownerDocument) {
       return;
     }
+    const nextMountNode = ((_a = mountNodeRef.current) == null ? void 0 : _a.ownerDocument) === ownerDocument ? mountNodeRef.current : ownerDocument.createElement("div");
     nextMountNode.className = withBaseName("contentHost");
+    mountNodeRef.current = nextMountNode;
     setMountNode(nextMountNode);
     return () => {
-      var _a;
-      (_a = nextMountNode.parentElement) == null ? void 0 : _a.removeChild(nextMountNode);
+      var _a2;
+      (_a2 = nextMountNode.parentElement) == null ? void 0 : _a2.removeChild(nextMountNode);
     };
   }, [targetWindow]);
   useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {