@salt-ds/core 1.72.0 → 1.73.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (289) hide show
  1. package/CHANGELOG.md +122 -0
  2. package/css/salt-core.css +265 -120
  3. package/dist-cjs/accordion/AccordionHeader.css.js +1 -1
  4. package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
  5. package/dist-cjs/breadcrumbs/Breadcrumb.js +5 -6
  6. package/dist-cjs/breadcrumbs/Breadcrumb.js.map +1 -1
  7. package/dist-cjs/button/Button.css.js +1 -1
  8. package/dist-cjs/card/CardContent.css.js +1 -1
  9. package/dist-cjs/card/hasCardSection.js +11 -3
  10. package/dist-cjs/card/hasCardSection.js.map +1 -1
  11. package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
  12. package/dist-cjs/collapsible/CollapsiblePanel.css.js +1 -1
  13. package/dist-cjs/collapsible/CollapsiblePanel.js +15 -15
  14. package/dist-cjs/collapsible/CollapsiblePanel.js.map +1 -1
  15. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  16. package/dist-cjs/dialog/DialogHeader.js +2 -0
  17. package/dist-cjs/dialog/DialogHeader.js.map +1 -1
  18. package/dist-cjs/drawer/DrawerHeader.js +2 -0
  19. package/dist-cjs/drawer/DrawerHeader.js.map +1 -1
  20. package/dist-cjs/dropdown/Dropdown.css.js +1 -1
  21. package/dist-cjs/dropdown/Dropdown.js +1 -1
  22. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  23. package/dist-cjs/form-field/FormField.js +2 -2
  24. package/dist-cjs/form-field/FormField.js.map +1 -1
  25. package/dist-cjs/form-field/FormFieldHelperText.js +2 -0
  26. package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
  27. package/dist-cjs/form-field/FormFieldLabel.css.js +1 -1
  28. package/dist-cjs/form-field/FormFieldLabel.js +2 -0
  29. package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
  30. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  31. package/dist-cjs/index.js +11 -0
  32. package/dist-cjs/index.js.map +1 -1
  33. package/dist-cjs/input/Input.css.js +1 -1
  34. package/dist-cjs/link/Link.js +2 -0
  35. package/dist-cjs/link/Link.js.map +1 -1
  36. package/dist-cjs/link/LinkAction.js +3 -2
  37. package/dist-cjs/link/LinkAction.js.map +1 -1
  38. package/dist-cjs/link-button/LinkButton.js +3 -2
  39. package/dist-cjs/link-button/LinkButton.js.map +1 -1
  40. package/dist-cjs/list-box/ListBox.js +1 -1
  41. package/dist-cjs/list-box/ListBox.js.map +1 -1
  42. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  43. package/dist-cjs/list-control/ListControlOptionContext.js.map +1 -1
  44. package/dist-cjs/mega-menu/MegaMenuGroupHeading.css.js +1 -1
  45. package/dist-cjs/mega-menu/MegaMenuListItem.css.js +1 -1
  46. package/dist-cjs/menu/MenuGroup.css.js +1 -1
  47. package/dist-cjs/multiline-input/MultilineInput.css.js +1 -1
  48. package/dist-cjs/navigation-item/NavigationItem.css.js +1 -1
  49. package/dist-cjs/number-input/NumberInput.css.js +1 -1
  50. package/dist-cjs/on-solid-button/OnSolidButton.css.js +6 -0
  51. package/dist-cjs/on-solid-button/OnSolidButton.css.js.map +1 -0
  52. package/dist-cjs/on-solid-button/OnSolidButton.js +68 -0
  53. package/dist-cjs/on-solid-button/OnSolidButton.js.map +1 -0
  54. package/dist-cjs/option/Option.css.js +1 -1
  55. package/dist-cjs/option/Option.js +7 -1
  56. package/dist-cjs/option/Option.js.map +1 -1
  57. package/dist-cjs/option/OptionGroup.css.js +1 -1
  58. package/dist-cjs/overlay/OverlayHeader.js +2 -0
  59. package/dist-cjs/overlay/OverlayHeader.js.map +1 -1
  60. package/dist-cjs/overlay/OverlayPanelCloseButton.js +1 -1
  61. package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
  62. package/dist-cjs/pagination/CompactPaginator.js +2 -0
  63. package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
  64. package/dist-cjs/pagination/GoToInput.js +2 -0
  65. package/dist-cjs/pagination/GoToInput.js.map +1 -1
  66. package/dist-cjs/pill/PillCheckIcon.js.map +1 -1
  67. package/dist-cjs/pill-input/PillInput.css.js +1 -1
  68. package/dist-cjs/progress/CircularProgress/CircularProgress.js +2 -0
  69. package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
  70. package/dist-cjs/progress/LinearProgress/LinearProgress.js +2 -0
  71. package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
  72. package/dist-cjs/salt-provider/ThemeApplicator.js +10 -6
  73. package/dist-cjs/salt-provider/ThemeApplicator.js.map +1 -1
  74. package/dist-cjs/side-panel/SidePanelTitle.js +2 -0
  75. package/dist-cjs/side-panel/SidePanelTitle.js.map +1 -1
  76. package/dist-cjs/side-panel/SidePanelTrigger.js.map +1 -1
  77. package/dist-cjs/side-panel/internal/useIsScrollable.js.map +1 -1
  78. package/dist-cjs/side-panel/useSidePanel.js +4 -9
  79. package/dist-cjs/side-panel/useSidePanel.js.map +1 -1
  80. package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js +2 -2
  81. package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  82. package/dist-cjs/slider/internal/SliderThumb.js.map +1 -1
  83. package/dist-cjs/slider/internal/SliderTooltip.js +2 -0
  84. package/dist-cjs/slider/internal/SliderTooltip.js.map +1 -1
  85. package/dist-cjs/slider/internal/SliderTrack.js +2 -0
  86. package/dist-cjs/slider/internal/SliderTrack.js.map +1 -1
  87. package/dist-cjs/slider/internal/useRangeSliderThumb.js.map +1 -1
  88. package/dist-cjs/slider/internal/useSliderThumb.js.map +1 -1
  89. package/dist-cjs/slider/internal/utils.js.map +1 -1
  90. package/dist-cjs/stepper/Stepper.js +1 -1
  91. package/dist-cjs/stepper/Stepper.js.map +1 -1
  92. package/dist-cjs/stepper/internal/StepText.css.js +1 -1
  93. package/dist-cjs/stepper/internal/StepText.js +2 -0
  94. package/dist-cjs/stepper/internal/StepText.js.map +1 -1
  95. package/dist-cjs/table/Table.css.js +1 -1
  96. package/dist-cjs/tabs/Tabs.js +1 -1
  97. package/dist-cjs/tabs/Tabs.js.map +1 -1
  98. package/dist-cjs/tabs/internal/overflow/useOverflow.js.map +1 -1
  99. package/dist-cjs/tabs/internal/overflow/useRenderedTabWidth.js.map +1 -1
  100. package/dist-cjs/text/Code.js +1 -1
  101. package/dist-cjs/text/Code.js.map +1 -1
  102. package/dist-cjs/text/Editorial.js +32 -0
  103. package/dist-cjs/text/Editorial.js.map +1 -0
  104. package/dist-cjs/text/Eyebrow.js +12 -0
  105. package/dist-cjs/text/Eyebrow.js.map +1 -0
  106. package/dist-cjs/text/Text.css.js +1 -1
  107. package/dist-cjs/text/Text.js +6 -2
  108. package/dist-cjs/text/Text.js.map +1 -1
  109. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  110. package/dist-cjs/toolbar/ToolbarOverflow.js +8 -4
  111. package/dist-cjs/toolbar/ToolbarOverflow.js.map +1 -1
  112. package/dist-cjs/toolbar/toolbarUtils.js.map +1 -1
  113. package/dist-cjs/tooltip/useAriaAnnounce.js +4 -2
  114. package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
  115. package/dist-cjs/tooltip/useTooltip.js.map +1 -1
  116. package/dist-cjs/tree/TreeContext.js.map +1 -1
  117. package/dist-cjs/utils/forkRef.js +34 -0
  118. package/dist-cjs/utils/forkRef.js.map +1 -0
  119. package/dist-cjs/utils/getRefFromChildren.js.map +1 -1
  120. package/dist-cjs/utils/marginMiddleware.js.map +1 -1
  121. package/dist-cjs/utils/setRef.js.map +1 -1
  122. package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  123. package/dist-cjs/utils/useForkRef.js +3 -6
  124. package/dist-cjs/utils/useForkRef.js.map +1 -1
  125. package/dist-cjs/utils/useResizeObserver.js.map +1 -1
  126. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
  127. package/dist-es/accordion/AccordionHeader.css.js +1 -1
  128. package/dist-es/border-layout/BorderLayout.js.map +1 -1
  129. package/dist-es/breadcrumbs/Breadcrumb.js +5 -6
  130. package/dist-es/breadcrumbs/Breadcrumb.js.map +1 -1
  131. package/dist-es/button/Button.css.js +1 -1
  132. package/dist-es/card/CardContent.css.js +1 -1
  133. package/dist-es/card/hasCardSection.js +11 -3
  134. package/dist-es/card/hasCardSection.js.map +1 -1
  135. package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
  136. package/dist-es/collapsible/CollapsiblePanel.css.js +1 -1
  137. package/dist-es/collapsible/CollapsiblePanel.js +16 -16
  138. package/dist-es/collapsible/CollapsiblePanel.js.map +1 -1
  139. package/dist-es/combo-box/ComboBox.js.map +1 -1
  140. package/dist-es/dialog/DialogHeader.js +2 -0
  141. package/dist-es/dialog/DialogHeader.js.map +1 -1
  142. package/dist-es/drawer/DrawerHeader.js +2 -0
  143. package/dist-es/drawer/DrawerHeader.js.map +1 -1
  144. package/dist-es/dropdown/Dropdown.css.js +1 -1
  145. package/dist-es/dropdown/Dropdown.js +1 -1
  146. package/dist-es/dropdown/Dropdown.js.map +1 -1
  147. package/dist-es/form-field/FormField.js +2 -2
  148. package/dist-es/form-field/FormField.js.map +1 -1
  149. package/dist-es/form-field/FormFieldHelperText.js +2 -0
  150. package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
  151. package/dist-es/form-field/FormFieldLabel.css.js +1 -1
  152. package/dist-es/form-field/FormFieldLabel.js +2 -0
  153. package/dist-es/form-field/FormFieldLabel.js.map +1 -1
  154. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  155. package/dist-es/index.js +3 -0
  156. package/dist-es/index.js.map +1 -1
  157. package/dist-es/input/Input.css.js +1 -1
  158. package/dist-es/link/Link.js +2 -0
  159. package/dist-es/link/Link.js.map +1 -1
  160. package/dist-es/link/LinkAction.js +3 -2
  161. package/dist-es/link/LinkAction.js.map +1 -1
  162. package/dist-es/link-button/LinkButton.js +3 -2
  163. package/dist-es/link-button/LinkButton.js.map +1 -1
  164. package/dist-es/list-box/ListBox.js +1 -1
  165. package/dist-es/list-box/ListBox.js.map +1 -1
  166. package/dist-es/list-control/ListControlContext.js.map +1 -1
  167. package/dist-es/list-control/ListControlOptionContext.js.map +1 -1
  168. package/dist-es/mega-menu/MegaMenuGroupHeading.css.js +1 -1
  169. package/dist-es/mega-menu/MegaMenuListItem.css.js +1 -1
  170. package/dist-es/menu/MenuGroup.css.js +1 -1
  171. package/dist-es/multiline-input/MultilineInput.css.js +1 -1
  172. package/dist-es/navigation-item/NavigationItem.css.js +1 -1
  173. package/dist-es/number-input/NumberInput.css.js +1 -1
  174. package/dist-es/on-solid-button/OnSolidButton.css.js +4 -0
  175. package/dist-es/on-solid-button/OnSolidButton.css.js.map +1 -0
  176. package/dist-es/on-solid-button/OnSolidButton.js +66 -0
  177. package/dist-es/on-solid-button/OnSolidButton.js.map +1 -0
  178. package/dist-es/option/Option.css.js +1 -1
  179. package/dist-es/option/Option.js +7 -1
  180. package/dist-es/option/Option.js.map +1 -1
  181. package/dist-es/option/OptionGroup.css.js +1 -1
  182. package/dist-es/overlay/OverlayHeader.js +2 -0
  183. package/dist-es/overlay/OverlayHeader.js.map +1 -1
  184. package/dist-es/overlay/OverlayPanelCloseButton.js +1 -1
  185. package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
  186. package/dist-es/pagination/CompactPaginator.js +2 -0
  187. package/dist-es/pagination/CompactPaginator.js.map +1 -1
  188. package/dist-es/pagination/GoToInput.js +2 -0
  189. package/dist-es/pagination/GoToInput.js.map +1 -1
  190. package/dist-es/pill/PillCheckIcon.js.map +1 -1
  191. package/dist-es/pill-input/PillInput.css.js +1 -1
  192. package/dist-es/progress/CircularProgress/CircularProgress.js +2 -0
  193. package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
  194. package/dist-es/progress/LinearProgress/LinearProgress.js +2 -0
  195. package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
  196. package/dist-es/salt-provider/ThemeApplicator.js +10 -6
  197. package/dist-es/salt-provider/ThemeApplicator.js.map +1 -1
  198. package/dist-es/side-panel/SidePanelTitle.js +2 -0
  199. package/dist-es/side-panel/SidePanelTitle.js.map +1 -1
  200. package/dist-es/side-panel/SidePanelTrigger.js.map +1 -1
  201. package/dist-es/side-panel/internal/useIsScrollable.js.map +1 -1
  202. package/dist-es/side-panel/useSidePanel.js +4 -9
  203. package/dist-es/side-panel/useSidePanel.js.map +1 -1
  204. package/dist-es/skip-link/internal/useManageFocusOnTarget.js +2 -2
  205. package/dist-es/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  206. package/dist-es/slider/internal/SliderThumb.js.map +1 -1
  207. package/dist-es/slider/internal/SliderTooltip.js +2 -0
  208. package/dist-es/slider/internal/SliderTooltip.js.map +1 -1
  209. package/dist-es/slider/internal/SliderTrack.js +2 -0
  210. package/dist-es/slider/internal/SliderTrack.js.map +1 -1
  211. package/dist-es/slider/internal/useRangeSliderThumb.js.map +1 -1
  212. package/dist-es/slider/internal/useSliderThumb.js.map +1 -1
  213. package/dist-es/slider/internal/utils.js.map +1 -1
  214. package/dist-es/stepper/Stepper.js +1 -1
  215. package/dist-es/stepper/Stepper.js.map +1 -1
  216. package/dist-es/stepper/internal/StepText.css.js +1 -1
  217. package/dist-es/stepper/internal/StepText.js +2 -0
  218. package/dist-es/stepper/internal/StepText.js.map +1 -1
  219. package/dist-es/table/Table.css.js +1 -1
  220. package/dist-es/tabs/Tabs.js +1 -1
  221. package/dist-es/tabs/Tabs.js.map +1 -1
  222. package/dist-es/tabs/internal/overflow/useOverflow.js.map +1 -1
  223. package/dist-es/tabs/internal/overflow/useRenderedTabWidth.js.map +1 -1
  224. package/dist-es/text/Code.js +1 -1
  225. package/dist-es/text/Code.js.map +1 -1
  226. package/dist-es/text/Editorial.js +25 -0
  227. package/dist-es/text/Editorial.js.map +1 -0
  228. package/dist-es/text/Eyebrow.js +10 -0
  229. package/dist-es/text/Eyebrow.js.map +1 -0
  230. package/dist-es/text/Text.css.js +1 -1
  231. package/dist-es/text/Text.js +6 -2
  232. package/dist-es/text/Text.js.map +1 -1
  233. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  234. package/dist-es/toolbar/ToolbarOverflow.js +8 -4
  235. package/dist-es/toolbar/ToolbarOverflow.js.map +1 -1
  236. package/dist-es/toolbar/toolbarUtils.js.map +1 -1
  237. package/dist-es/tooltip/useAriaAnnounce.js +4 -2
  238. package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
  239. package/dist-es/tooltip/useTooltip.js.map +1 -1
  240. package/dist-es/tree/TreeContext.js.map +1 -1
  241. package/dist-es/utils/forkRef.js +32 -0
  242. package/dist-es/utils/forkRef.js.map +1 -0
  243. package/dist-es/utils/getRefFromChildren.js.map +1 -1
  244. package/dist-es/utils/marginMiddleware.js.map +1 -1
  245. package/dist-es/utils/setRef.js.map +1 -1
  246. package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  247. package/dist-es/utils/useForkRef.js +3 -6
  248. package/dist-es/utils/useForkRef.js.map +1 -1
  249. package/dist-es/utils/useResizeObserver.js.map +1 -1
  250. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
  251. package/dist-types/checkbox/CheckboxIcon.d.ts +2 -1
  252. package/dist-types/collapsible/CollapsiblePanel.d.ts +8 -1
  253. package/dist-types/combo-box/ComboBox.d.ts +2 -2
  254. package/dist-types/dropdown/Dropdown.d.ts +2 -2
  255. package/dist-types/form-field/FormFieldHelperText.d.ts +1 -1
  256. package/dist-types/form-field/FormFieldLabel.d.ts +1 -1
  257. package/dist-types/form-field-context/FormFieldContext.d.ts +1 -1
  258. package/dist-types/index.d.ts +1 -0
  259. package/dist-types/list-box/ListBox.d.ts +2 -2
  260. package/dist-types/list-control/ListControlContext.d.ts +1 -1
  261. package/dist-types/list-control/ListControlOptionContext.d.ts +1 -1
  262. package/dist-types/on-solid-button/OnSolidButton.d.ts +12 -0
  263. package/dist-types/on-solid-button/index.d.ts +1 -0
  264. package/dist-types/pill/PillCheckIcon.d.ts +2 -1
  265. package/dist-types/registerClassNameInjection.d.ts +0 -2
  266. package/dist-types/salt-provider/SaltProvider.d.ts +1 -1
  267. package/dist-types/side-panel/internal/useIsScrollable.d.ts +1 -1
  268. package/dist-types/skip-link/internal/useManageFocusOnTarget.d.ts +1 -1
  269. package/dist-types/slider/internal/SliderThumb.d.ts +2 -2
  270. package/dist-types/slider/internal/SliderTrack.d.ts +2 -2
  271. package/dist-types/slider/internal/useRangeSliderThumb.d.ts +1 -1
  272. package/dist-types/slider/internal/useSliderThumb.d.ts +1 -1
  273. package/dist-types/slider/internal/utils.d.ts +1 -1
  274. package/dist-types/tabs/internal/overflow/useOverflow.d.ts +2 -2
  275. package/dist-types/tabs/internal/overflow/useRenderedTabWidth.d.ts +1 -1
  276. package/dist-types/text/Editorial.d.ts +7 -0
  277. package/dist-types/text/Eyebrow.d.ts +2 -0
  278. package/dist-types/text/Text.d.ts +9 -2
  279. package/dist-types/text/index.d.ts +2 -0
  280. package/dist-types/toggle-button/ToggleButton.d.ts +1 -1
  281. package/dist-types/tooltip/useTooltip.d.ts +12 -26
  282. package/dist-types/tree/TreeContext.d.ts +1 -1
  283. package/dist-types/utils/forkRef.d.ts +11 -0
  284. package/dist-types/utils/inferElementType.d.ts +1 -2
  285. package/dist-types/utils/marginMiddleware.d.ts +1 -1
  286. package/dist-types/utils/setRef.d.ts +4 -0
  287. package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +1 -5
  288. package/dist-types/utils/useResizeObserver.d.ts +1 -1
  289. package/package.json +4 -4
@@ -1 +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":["pinnedValue"],"mappings":"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"}
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 | 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":["pinnedValue"],"mappings":"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"}
@@ -1 +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":[],"mappings":"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"}
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 | 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":[],"mappings":"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"}
@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
3
3
  import { Text } from './Text.js';
4
4
 
5
5
  const Code = forwardRef(
6
- function TextAction({ children, ...rest }, ref) {
6
+ function Code2({ children, ...rest }, ref) {
7
7
  return /* @__PURE__ */ jsx(Text, { as: "code", ref, ...rest, children });
8
8
  }
9
9
  );
@@ -1 +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":[],"mappings":";;;;AAGO,MAAM,IAAA,GAAO,UAAA;AAAA,EAClB,SAAS,UAAA,CAAW,EAAE,UAAU,GAAG,IAAA,IAAQ,GAAA,EAAK;AAC9C,IAAA,2BACG,IAAA,EAAA,EAAK,EAAA,EAAG,QAAO,GAAA,EAAW,GAAG,MAC3B,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}
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 Code({ children, ...rest }, ref) {\n return (\n <Text as=\"code\" ref={ref} {...rest}>\n {children}\n </Text>\n );\n },\n);\n"],"names":["Code"],"mappings":";;;;AAGO,MAAM,IAAA,GAAO,UAAA;AAAA,EAClB,SAASA,KAAAA,CAAK,EAAE,UAAU,GAAG,IAAA,IAAQ,GAAA,EAAK;AACxC,IAAA,2BACG,IAAA,EAAA,EAAK,EAAA,EAAG,QAAO,GAAA,EAAW,GAAG,MAC3B,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}
@@ -0,0 +1,25 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { forwardRef } from 'react';
3
+ import { Text } from './Text.js';
4
+
5
+ const Editorial1 = forwardRef(function Editorial12({ children, styleAs = "editorial1", ...rest }, ref) {
6
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
7
+ });
8
+ const Editorial2 = forwardRef(function Editorial22({ children, styleAs = "editorial2", ...rest }, ref) {
9
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
10
+ });
11
+ const Editorial3 = forwardRef(function Editorial32({ children, styleAs = "editorial3", ...rest }, ref) {
12
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
13
+ });
14
+ const Editorial4 = forwardRef(function Editorial42({ children, styleAs = "editorial4", ...rest }, ref) {
15
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
16
+ });
17
+ const Editorial5 = forwardRef(function Editorial52({ children, styleAs = "editorial5", ...rest }, ref) {
18
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
19
+ });
20
+ const Editorial6 = forwardRef(function Editorial62({ children, styleAs = "editorial6", ...rest }, ref) {
21
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
22
+ });
23
+
24
+ export { Editorial1, Editorial2, Editorial3, Editorial4, Editorial5, Editorial6 };
25
+ //# sourceMappingURL=Editorial.js.map
@@ -0,0 +1 @@
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":["Editorial1","Editorial2","Editorial3","Editorial4","Editorial5","Editorial6"],"mappings":";;;;AAGO,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASA,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;AAEM,MAAM,UAAA,GAAa,UAAA,CAGxB,SAASC,WAAAA,CAAW,EAAE,QAAA,EAAU,OAAA,GAAU,YAAA,EAAc,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AACxE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;;;;"}
@@ -0,0 +1,10 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { forwardRef } from 'react';
3
+ import { Text } from './Text.js';
4
+
5
+ const Eyebrow = forwardRef(function Eyebrow2({ children, styleAs = "eyebrow", ...rest }, ref) {
6
+ return /* @__PURE__ */ jsx(Text, { as: "span", styleAs, ref, ...rest, children });
7
+ });
8
+
9
+ export { Eyebrow };
10
+ //# sourceMappingURL=Eyebrow.js.map
@@ -0,0 +1 @@
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":["Eyebrow"],"mappings":";;;;AAGO,MAAM,OAAA,GAAU,UAAA,CAGrB,SAASA,QAAAA,CAAQ,EAAE,QAAA,EAAU,OAAA,GAAU,SAAA,EAAW,GAAG,IAAA,EAAK,EAAG,GAAA,EAAK;AAClE,EAAA,uBACE,GAAA,CAAC,QAAK,EAAA,EAAG,MAAA,EAAO,SAAkB,GAAA,EAAW,GAAG,MAC7C,QAAA,EACH,CAAA;AAEJ,CAAC;;;;"}
@@ -1,4 +1,4 @@
1
- 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";
1
+ 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";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=Text.css.js.map
@@ -16,6 +16,7 @@ const Text = forwardRef(function Text2({
16
16
  children,
17
17
  className,
18
18
  disabled = false,
19
+ fontWeight,
19
20
  maxRows,
20
21
  style,
21
22
  styleAs,
@@ -31,7 +32,7 @@ const Text = forwardRef(function Text2({
31
32
  });
32
33
  const Component = as ?? "div";
33
34
  const textStyles = { "--text-max-rows": maxRows, ...style };
34
- const color = variant ?? colorProp ?? "primary";
35
+ const color = variant ?? colorProp ?? (styleAs === "inherit" ? "inherit" : "primary");
35
36
  return /* @__PURE__ */ jsx(
36
37
  Component,
37
38
  {
@@ -40,7 +41,10 @@ const Text = forwardRef(function Text2({
40
41
  {
41
42
  [withBaseName("disabled")]: disabled,
42
43
  [withBaseName("lineClamp")]: maxRows,
43
- [withBaseName(styleAs)]: styleAs,
44
+ [withBaseName(
45
+ styleAs === "inherit" ? "inheritStyle" : styleAs
46
+ )]: styleAs,
47
+ [withBaseName(fontWeight)]: fontWeight,
44
48
  [withBaseName(color)]: color !== "inherit"
45
49
  },
46
50
  className
@@ -1 +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":["Text","textCss"],"mappings":";;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA;AAErC,MAAM,IAAA,GAAsB,UAAA,CAAW,SAASA,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,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,WAAA;AAAA,IACR,GAAA,EAAKC,QAAA;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,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA;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;;;;"}
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 * 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":["Text","textCss"],"mappings":";;;;;;;;;;;;AA6EA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA;AAErC,MAAM,IAAA,GAAsB,UAAA,CAAW,SAASA,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,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,WAAA;AAAA,IACR,GAAA,EAAKC,QAAA;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,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA;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;;;;"}
@@ -1 +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":["ToggleButton","toggleButtonCss"],"mappings":"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"}
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\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":["ToggleButton","toggleButtonCss"],"mappings":"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"}
@@ -117,6 +117,7 @@ function ToolbarOverflowItemOwner({
117
117
  }) {
118
118
  const targetWindow = useWindow();
119
119
  const [mountNode, setMountNode] = useState(null);
120
+ const mountNodeRef = useRef(null);
120
121
  const mainToolbarTabIndexMemoryRef = useRef(
121
122
  /* @__PURE__ */ new WeakMap()
122
123
  );
@@ -127,15 +128,18 @@ function ToolbarOverflowItemOwner({
127
128
  }
128
129
  const boundaryKey = host ? currentOverflowBoundaryKey : lastOverflowBoundaryKeyRef.current;
129
130
  useIsomorphicLayoutEffect(() => {
130
- const nextMountNode = targetWindow == null ? void 0 : targetWindow.document.createElement("div");
131
- if (!nextMountNode) {
131
+ var _a;
132
+ const ownerDocument = targetWindow == null ? void 0 : targetWindow.document;
133
+ if (!ownerDocument) {
132
134
  return;
133
135
  }
136
+ const nextMountNode = ((_a = mountNodeRef.current) == null ? void 0 : _a.ownerDocument) === ownerDocument ? mountNodeRef.current : ownerDocument.createElement("div");
134
137
  nextMountNode.className = withBaseName("contentHost");
138
+ mountNodeRef.current = nextMountNode;
135
139
  setMountNode(nextMountNode);
136
140
  return () => {
137
- var _a;
138
- (_a = nextMountNode.parentElement) == null ? void 0 : _a.removeChild(nextMountNode);
141
+ var _a2;
142
+ (_a2 = nextMountNode.parentElement) == null ? void 0 : _a2.removeChild(nextMountNode);
139
143
  };
140
144
  }, [targetWindow]);
141
145
  useIsomorphicLayoutEffect(() => {