@salt-ds/core 1.71.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 (444) hide show
  1. package/CHANGELOG.md +204 -0
  2. package/css/salt-core.css +432 -175
  3. package/dist-cjs/accordion/AccordionHeader.css.js +1 -1
  4. package/dist-cjs/avatar/Avatar.css.js +1 -1
  5. package/dist-cjs/badge/Badge.css.js +1 -1
  6. package/dist-cjs/banner/Banner.css.js +1 -1
  7. package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
  8. package/dist-cjs/breadcrumbs/Breadcrumb.css.js +1 -1
  9. package/dist-cjs/breadcrumbs/Breadcrumb.js +5 -6
  10. package/dist-cjs/breadcrumbs/Breadcrumb.js.map +1 -1
  11. package/dist-cjs/breadcrumbs/Breadcrumbs.css.js +1 -1
  12. package/dist-cjs/button/Button.css.js +1 -1
  13. package/dist-cjs/card/CardContent.css.js +1 -1
  14. package/dist-cjs/card/hasCardSection.js +11 -3
  15. package/dist-cjs/card/hasCardSection.js.map +1 -1
  16. package/dist-cjs/checkbox/Checkbox.css.js +1 -1
  17. package/dist-cjs/checkbox/CheckboxIcon.css.js +1 -1
  18. package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
  19. package/dist-cjs/collapsible/CollapsiblePanel.css.js +1 -1
  20. package/dist-cjs/collapsible/CollapsiblePanel.js +15 -15
  21. package/dist-cjs/collapsible/CollapsiblePanel.js.map +1 -1
  22. package/dist-cjs/combo-box/ComboBox.js +18 -36
  23. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  24. package/dist-cjs/combo-box/useComboBox.js +21 -21
  25. package/dist-cjs/combo-box/useComboBox.js.map +1 -1
  26. package/dist-cjs/dialog/DialogHeader.js +2 -0
  27. package/dist-cjs/dialog/DialogHeader.js.map +1 -1
  28. package/dist-cjs/drawer/DrawerHeader.js +2 -0
  29. package/dist-cjs/drawer/DrawerHeader.js.map +1 -1
  30. package/dist-cjs/dropdown/Dropdown.css.js +1 -1
  31. package/dist-cjs/dropdown/Dropdown.js +30 -31
  32. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  33. package/dist-cjs/file-drop-zone/FileDropZone.css.js +1 -1
  34. package/dist-cjs/form-field/FormField.css.js +1 -1
  35. package/dist-cjs/form-field/FormField.js +2 -2
  36. package/dist-cjs/form-field/FormField.js.map +1 -1
  37. package/dist-cjs/form-field/FormFieldHelperText.css.js +1 -1
  38. package/dist-cjs/form-field/FormFieldHelperText.js +2 -0
  39. package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
  40. package/dist-cjs/form-field/FormFieldLabel.css.js +1 -1
  41. package/dist-cjs/form-field/FormFieldLabel.js +3 -1
  42. package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
  43. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  44. package/dist-cjs/index.js +13 -0
  45. package/dist-cjs/index.js.map +1 -1
  46. package/dist-cjs/input/Input.css.js +1 -1
  47. package/dist-cjs/interactable-card/InteractableCard.css.js +1 -1
  48. package/dist-cjs/interactable-card/InteractableCard.js +18 -7
  49. package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
  50. package/dist-cjs/interactable-card/InteractableCardGroup.js +71 -39
  51. package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
  52. package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
  53. package/dist-cjs/interactable-card/useInteractableCard.js +2 -3
  54. package/dist-cjs/interactable-card/useInteractableCard.js.map +1 -1
  55. package/dist-cjs/kbd/Kbd.css.js +1 -1
  56. package/dist-cjs/link/Link.css.js +1 -1
  57. package/dist-cjs/link/Link.js +2 -0
  58. package/dist-cjs/link/Link.js.map +1 -1
  59. package/dist-cjs/link/LinkAction.js +3 -2
  60. package/dist-cjs/link/LinkAction.js.map +1 -1
  61. package/dist-cjs/link-button/LinkButton.js +3 -2
  62. package/dist-cjs/link-button/LinkButton.js.map +1 -1
  63. package/dist-cjs/list-box/ListBox.js +20 -27
  64. package/dist-cjs/list-box/ListBox.js.map +1 -1
  65. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  66. package/dist-cjs/list-control/ListControlNavigationKeys.js +74 -0
  67. package/dist-cjs/list-control/ListControlNavigationKeys.js.map +1 -0
  68. package/dist-cjs/list-control/ListControlOptionContext.js +47 -0
  69. package/dist-cjs/list-control/ListControlOptionContext.js.map +1 -0
  70. package/dist-cjs/list-control/ListControlOptionStore.js +159 -0
  71. package/dist-cjs/list-control/ListControlOptionStore.js.map +1 -0
  72. package/dist-cjs/list-control/ListControlProvider.js +39 -0
  73. package/dist-cjs/list-control/ListControlProvider.js.map +1 -0
  74. package/dist-cjs/list-control/ListControlRegistry.js +161 -0
  75. package/dist-cjs/list-control/ListControlRegistry.js.map +1 -0
  76. package/dist-cjs/list-control/ListControlState.js +137 -109
  77. package/dist-cjs/list-control/ListControlState.js.map +1 -1
  78. package/dist-cjs/mega-menu/MegaMenuGroupHeading.css.js +1 -1
  79. package/dist-cjs/mega-menu/MegaMenuListItem.css.js +1 -1
  80. package/dist-cjs/menu/MenuGroup.css.js +1 -1
  81. package/dist-cjs/menu/MenuItem.css.js +1 -1
  82. package/dist-cjs/multiline-input/MultilineInput.css.js +1 -1
  83. package/dist-cjs/navigation-item/NavigationItem.css.js +1 -1
  84. package/dist-cjs/number-input/NumberInput.css.js +1 -1
  85. package/dist-cjs/number-input/NumberInput.js +2 -2
  86. package/dist-cjs/number-input/NumberInput.js.map +1 -1
  87. package/dist-cjs/on-solid-button/OnSolidButton.css.js +6 -0
  88. package/dist-cjs/on-solid-button/OnSolidButton.css.js.map +1 -0
  89. package/dist-cjs/on-solid-button/OnSolidButton.js +68 -0
  90. package/dist-cjs/on-solid-button/OnSolidButton.js.map +1 -0
  91. package/dist-cjs/option/Option.css.js +1 -1
  92. package/dist-cjs/option/Option.js +64 -39
  93. package/dist-cjs/option/Option.js.map +1 -1
  94. package/dist-cjs/option/OptionGroup.css.js +1 -1
  95. package/dist-cjs/overlay/Overlay.js +12 -2
  96. package/dist-cjs/overlay/Overlay.js.map +1 -1
  97. package/dist-cjs/overlay/OverlayContext.js +6 -0
  98. package/dist-cjs/overlay/OverlayContext.js.map +1 -1
  99. package/dist-cjs/overlay/OverlayFooter.css.js +6 -0
  100. package/dist-cjs/overlay/OverlayFooter.css.js.map +1 -0
  101. package/dist-cjs/overlay/OverlayFooter.js +30 -0
  102. package/dist-cjs/overlay/OverlayFooter.js.map +1 -0
  103. package/dist-cjs/overlay/OverlayHeader.css.js +1 -1
  104. package/dist-cjs/overlay/OverlayHeader.js +53 -11
  105. package/dist-cjs/overlay/OverlayHeader.js.map +1 -1
  106. package/dist-cjs/overlay/OverlayPanel.css.js +1 -1
  107. package/dist-cjs/overlay/OverlayPanel.js +20 -7
  108. package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
  109. package/dist-cjs/overlay/OverlayPanelCloseButton.js +1 -1
  110. package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
  111. package/dist-cjs/overlay/OverlayPanelContent.css.js +1 -1
  112. package/dist-cjs/overlay/OverlayPanelContent.js +11 -13
  113. package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
  114. package/dist-cjs/overlay/hasOverlaySection.js +24 -0
  115. package/dist-cjs/overlay/hasOverlaySection.js.map +1 -0
  116. package/dist-cjs/pagination/CompactPaginator.js +2 -0
  117. package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
  118. package/dist-cjs/pagination/GoToInput.js +2 -0
  119. package/dist-cjs/pagination/GoToInput.js.map +1 -1
  120. package/dist-cjs/pill/PillCheckIcon.js.map +1 -1
  121. package/dist-cjs/pill-input/PillInput.css.js +1 -1
  122. package/dist-cjs/pill-input/PillInput.js +2 -2
  123. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  124. package/dist-cjs/progress/CircularProgress/CircularProgress.js +2 -0
  125. package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
  126. package/dist-cjs/progress/LinearProgress/LinearProgress.js +2 -0
  127. package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
  128. package/dist-cjs/radio-button/RadioButton.css.js +1 -1
  129. package/dist-cjs/radio-button/RadioButtonIcon.css.js +1 -1
  130. package/dist-cjs/rating/Rating.css.js +1 -1
  131. package/dist-cjs/salt-provider/ThemeApplicator.js +10 -6
  132. package/dist-cjs/salt-provider/ThemeApplicator.js.map +1 -1
  133. package/dist-cjs/side-panel/SidePanelTitle.js +2 -0
  134. package/dist-cjs/side-panel/SidePanelTitle.js.map +1 -1
  135. package/dist-cjs/side-panel/SidePanelTrigger.js.map +1 -1
  136. package/dist-cjs/side-panel/internal/useIsScrollable.js.map +1 -1
  137. package/dist-cjs/side-panel/useSidePanel.js +4 -9
  138. package/dist-cjs/side-panel/useSidePanel.js.map +1 -1
  139. package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js +2 -2
  140. package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  141. package/dist-cjs/slider/internal/SliderThumb.js.map +1 -1
  142. package/dist-cjs/slider/internal/SliderTooltip.js +2 -0
  143. package/dist-cjs/slider/internal/SliderTooltip.js.map +1 -1
  144. package/dist-cjs/slider/internal/SliderTrack.css.js +1 -1
  145. package/dist-cjs/slider/internal/SliderTrack.js +2 -0
  146. package/dist-cjs/slider/internal/SliderTrack.js.map +1 -1
  147. package/dist-cjs/slider/internal/useRangeSliderThumb.js.map +1 -1
  148. package/dist-cjs/slider/internal/useSliderThumb.js.map +1 -1
  149. package/dist-cjs/slider/internal/utils.js.map +1 -1
  150. package/dist-cjs/stepper/Stepper.js +1 -1
  151. package/dist-cjs/stepper/Stepper.js.map +1 -1
  152. package/dist-cjs/stepper/internal/StepText.css.js +1 -1
  153. package/dist-cjs/stepper/internal/StepText.js +2 -0
  154. package/dist-cjs/stepper/internal/StepText.js.map +1 -1
  155. package/dist-cjs/switch/Switch.css.js +1 -1
  156. package/dist-cjs/table/Table.css.js +1 -1
  157. package/dist-cjs/tabs/Tabs.js +1 -1
  158. package/dist-cjs/tabs/Tabs.js.map +1 -1
  159. package/dist-cjs/tabs/internal/overflow/useOverflow.js.map +1 -1
  160. package/dist-cjs/tabs/internal/overflow/useRenderedTabWidth.js.map +1 -1
  161. package/dist-cjs/tag/Tag.css.js +1 -1
  162. package/dist-cjs/text/Code.js +1 -1
  163. package/dist-cjs/text/Code.js.map +1 -1
  164. package/dist-cjs/text/Editorial.js +32 -0
  165. package/dist-cjs/text/Editorial.js.map +1 -0
  166. package/dist-cjs/text/Eyebrow.js +12 -0
  167. package/dist-cjs/text/Eyebrow.js.map +1 -0
  168. package/dist-cjs/text/Text.css.js +1 -1
  169. package/dist-cjs/text/Text.js +6 -2
  170. package/dist-cjs/text/Text.js.map +1 -1
  171. package/dist-cjs/toast/Toast.css.js +1 -1
  172. package/dist-cjs/toggle-button/ToggleButton.js +8 -2
  173. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  174. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +71 -8
  175. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  176. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  177. package/dist-cjs/toggletip/ToggletipPanel.css.js +1 -1
  178. package/dist-cjs/toolbar/ToolbarOverflow.js +8 -4
  179. package/dist-cjs/toolbar/ToolbarOverflow.js.map +1 -1
  180. package/dist-cjs/toolbar/toolbarUtils.js.map +1 -1
  181. package/dist-cjs/tooltip/Tooltip.css.js +1 -1
  182. package/dist-cjs/tooltip/useAriaAnnounce.js +4 -2
  183. package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
  184. package/dist-cjs/tooltip/useTooltip.js.map +1 -1
  185. package/dist-cjs/tree/TreeContext.js.map +1 -1
  186. package/dist-cjs/utils/forkRef.js +34 -0
  187. package/dist-cjs/utils/forkRef.js.map +1 -0
  188. package/dist-cjs/utils/getRefFromChildren.js.map +1 -1
  189. package/dist-cjs/utils/marginMiddleware.js.map +1 -1
  190. package/dist-cjs/utils/setRef.js.map +1 -1
  191. package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  192. package/dist-cjs/utils/useForkRef.js +3 -6
  193. package/dist-cjs/utils/useForkRef.js.map +1 -1
  194. package/dist-cjs/utils/useResizeObserver.js.map +1 -1
  195. package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.css.js +1 -1
  196. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
  197. package/dist-es/accordion/AccordionHeader.css.js +1 -1
  198. package/dist-es/avatar/Avatar.css.js +1 -1
  199. package/dist-es/badge/Badge.css.js +1 -1
  200. package/dist-es/banner/Banner.css.js +1 -1
  201. package/dist-es/border-layout/BorderLayout.js.map +1 -1
  202. package/dist-es/breadcrumbs/Breadcrumb.css.js +1 -1
  203. package/dist-es/breadcrumbs/Breadcrumb.js +5 -6
  204. package/dist-es/breadcrumbs/Breadcrumb.js.map +1 -1
  205. package/dist-es/breadcrumbs/Breadcrumbs.css.js +1 -1
  206. package/dist-es/button/Button.css.js +1 -1
  207. package/dist-es/card/CardContent.css.js +1 -1
  208. package/dist-es/card/hasCardSection.js +11 -3
  209. package/dist-es/card/hasCardSection.js.map +1 -1
  210. package/dist-es/checkbox/Checkbox.css.js +1 -1
  211. package/dist-es/checkbox/CheckboxIcon.css.js +1 -1
  212. package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
  213. package/dist-es/collapsible/CollapsiblePanel.css.js +1 -1
  214. package/dist-es/collapsible/CollapsiblePanel.js +16 -16
  215. package/dist-es/collapsible/CollapsiblePanel.js.map +1 -1
  216. package/dist-es/combo-box/ComboBox.js +18 -36
  217. package/dist-es/combo-box/ComboBox.js.map +1 -1
  218. package/dist-es/combo-box/useComboBox.js +21 -21
  219. package/dist-es/combo-box/useComboBox.js.map +1 -1
  220. package/dist-es/dialog/DialogHeader.js +2 -0
  221. package/dist-es/dialog/DialogHeader.js.map +1 -1
  222. package/dist-es/drawer/DrawerHeader.js +2 -0
  223. package/dist-es/drawer/DrawerHeader.js.map +1 -1
  224. package/dist-es/dropdown/Dropdown.css.js +1 -1
  225. package/dist-es/dropdown/Dropdown.js +30 -31
  226. package/dist-es/dropdown/Dropdown.js.map +1 -1
  227. package/dist-es/file-drop-zone/FileDropZone.css.js +1 -1
  228. package/dist-es/form-field/FormField.css.js +1 -1
  229. package/dist-es/form-field/FormField.js +2 -2
  230. package/dist-es/form-field/FormField.js.map +1 -1
  231. package/dist-es/form-field/FormFieldHelperText.css.js +1 -1
  232. package/dist-es/form-field/FormFieldHelperText.js +2 -0
  233. package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
  234. package/dist-es/form-field/FormFieldLabel.css.js +1 -1
  235. package/dist-es/form-field/FormFieldLabel.js +3 -1
  236. package/dist-es/form-field/FormFieldLabel.js.map +1 -1
  237. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  238. package/dist-es/index.js +4 -0
  239. package/dist-es/index.js.map +1 -1
  240. package/dist-es/input/Input.css.js +1 -1
  241. package/dist-es/interactable-card/InteractableCard.css.js +1 -1
  242. package/dist-es/interactable-card/InteractableCard.js +18 -7
  243. package/dist-es/interactable-card/InteractableCard.js.map +1 -1
  244. package/dist-es/interactable-card/InteractableCardGroup.js +72 -40
  245. package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
  246. package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
  247. package/dist-es/interactable-card/useInteractableCard.js +2 -3
  248. package/dist-es/interactable-card/useInteractableCard.js.map +1 -1
  249. package/dist-es/kbd/Kbd.css.js +1 -1
  250. package/dist-es/link/Link.css.js +1 -1
  251. package/dist-es/link/Link.js +2 -0
  252. package/dist-es/link/Link.js.map +1 -1
  253. package/dist-es/link/LinkAction.js +3 -2
  254. package/dist-es/link/LinkAction.js.map +1 -1
  255. package/dist-es/link-button/LinkButton.js +3 -2
  256. package/dist-es/link-button/LinkButton.js.map +1 -1
  257. package/dist-es/list-box/ListBox.js +20 -27
  258. package/dist-es/list-box/ListBox.js.map +1 -1
  259. package/dist-es/list-control/ListControlContext.js.map +1 -1
  260. package/dist-es/list-control/ListControlNavigationKeys.js +69 -0
  261. package/dist-es/list-control/ListControlNavigationKeys.js.map +1 -0
  262. package/dist-es/list-control/ListControlOptionContext.js +44 -0
  263. package/dist-es/list-control/ListControlOptionContext.js.map +1 -0
  264. package/dist-es/list-control/ListControlOptionStore.js +153 -0
  265. package/dist-es/list-control/ListControlOptionStore.js.map +1 -0
  266. package/dist-es/list-control/ListControlProvider.js +37 -0
  267. package/dist-es/list-control/ListControlProvider.js.map +1 -0
  268. package/dist-es/list-control/ListControlRegistry.js +158 -0
  269. package/dist-es/list-control/ListControlRegistry.js.map +1 -0
  270. package/dist-es/list-control/ListControlState.js +137 -110
  271. package/dist-es/list-control/ListControlState.js.map +1 -1
  272. package/dist-es/mega-menu/MegaMenuGroupHeading.css.js +1 -1
  273. package/dist-es/mega-menu/MegaMenuListItem.css.js +1 -1
  274. package/dist-es/menu/MenuGroup.css.js +1 -1
  275. package/dist-es/menu/MenuItem.css.js +1 -1
  276. package/dist-es/multiline-input/MultilineInput.css.js +1 -1
  277. package/dist-es/navigation-item/NavigationItem.css.js +1 -1
  278. package/dist-es/number-input/NumberInput.css.js +1 -1
  279. package/dist-es/number-input/NumberInput.js +2 -2
  280. package/dist-es/number-input/NumberInput.js.map +1 -1
  281. package/dist-es/on-solid-button/OnSolidButton.css.js +4 -0
  282. package/dist-es/on-solid-button/OnSolidButton.css.js.map +1 -0
  283. package/dist-es/on-solid-button/OnSolidButton.js +66 -0
  284. package/dist-es/on-solid-button/OnSolidButton.js.map +1 -0
  285. package/dist-es/option/Option.css.js +1 -1
  286. package/dist-es/option/Option.js +65 -40
  287. package/dist-es/option/Option.js.map +1 -1
  288. package/dist-es/option/OptionGroup.css.js +1 -1
  289. package/dist-es/overlay/Overlay.js +13 -3
  290. package/dist-es/overlay/Overlay.js.map +1 -1
  291. package/dist-es/overlay/OverlayContext.js +6 -0
  292. package/dist-es/overlay/OverlayContext.js.map +1 -1
  293. package/dist-es/overlay/OverlayFooter.css.js +4 -0
  294. package/dist-es/overlay/OverlayFooter.css.js.map +1 -0
  295. package/dist-es/overlay/OverlayFooter.js +28 -0
  296. package/dist-es/overlay/OverlayFooter.js.map +1 -0
  297. package/dist-es/overlay/OverlayHeader.css.js +1 -1
  298. package/dist-es/overlay/OverlayHeader.js +53 -11
  299. package/dist-es/overlay/OverlayHeader.js.map +1 -1
  300. package/dist-es/overlay/OverlayPanel.css.js +1 -1
  301. package/dist-es/overlay/OverlayPanel.js +20 -7
  302. package/dist-es/overlay/OverlayPanel.js.map +1 -1
  303. package/dist-es/overlay/OverlayPanelCloseButton.js +1 -1
  304. package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
  305. package/dist-es/overlay/OverlayPanelContent.css.js +1 -1
  306. package/dist-es/overlay/OverlayPanelContent.js +11 -13
  307. package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
  308. package/dist-es/overlay/hasOverlaySection.js +22 -0
  309. package/dist-es/overlay/hasOverlaySection.js.map +1 -0
  310. package/dist-es/pagination/CompactPaginator.js +2 -0
  311. package/dist-es/pagination/CompactPaginator.js.map +1 -1
  312. package/dist-es/pagination/GoToInput.js +2 -0
  313. package/dist-es/pagination/GoToInput.js.map +1 -1
  314. package/dist-es/pill/PillCheckIcon.js.map +1 -1
  315. package/dist-es/pill-input/PillInput.css.js +1 -1
  316. package/dist-es/pill-input/PillInput.js +2 -2
  317. package/dist-es/pill-input/PillInput.js.map +1 -1
  318. package/dist-es/progress/CircularProgress/CircularProgress.js +2 -0
  319. package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
  320. package/dist-es/progress/LinearProgress/LinearProgress.js +2 -0
  321. package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
  322. package/dist-es/radio-button/RadioButton.css.js +1 -1
  323. package/dist-es/radio-button/RadioButtonIcon.css.js +1 -1
  324. package/dist-es/rating/Rating.css.js +1 -1
  325. package/dist-es/salt-provider/ThemeApplicator.js +10 -6
  326. package/dist-es/salt-provider/ThemeApplicator.js.map +1 -1
  327. package/dist-es/side-panel/SidePanelTitle.js +2 -0
  328. package/dist-es/side-panel/SidePanelTitle.js.map +1 -1
  329. package/dist-es/side-panel/SidePanelTrigger.js.map +1 -1
  330. package/dist-es/side-panel/internal/useIsScrollable.js.map +1 -1
  331. package/dist-es/side-panel/useSidePanel.js +4 -9
  332. package/dist-es/side-panel/useSidePanel.js.map +1 -1
  333. package/dist-es/skip-link/internal/useManageFocusOnTarget.js +2 -2
  334. package/dist-es/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  335. package/dist-es/slider/internal/SliderThumb.js.map +1 -1
  336. package/dist-es/slider/internal/SliderTooltip.js +2 -0
  337. package/dist-es/slider/internal/SliderTooltip.js.map +1 -1
  338. package/dist-es/slider/internal/SliderTrack.css.js +1 -1
  339. package/dist-es/slider/internal/SliderTrack.js +2 -0
  340. package/dist-es/slider/internal/SliderTrack.js.map +1 -1
  341. package/dist-es/slider/internal/useRangeSliderThumb.js.map +1 -1
  342. package/dist-es/slider/internal/useSliderThumb.js.map +1 -1
  343. package/dist-es/slider/internal/utils.js.map +1 -1
  344. package/dist-es/stepper/Stepper.js +1 -1
  345. package/dist-es/stepper/Stepper.js.map +1 -1
  346. package/dist-es/stepper/internal/StepText.css.js +1 -1
  347. package/dist-es/stepper/internal/StepText.js +2 -0
  348. package/dist-es/stepper/internal/StepText.js.map +1 -1
  349. package/dist-es/switch/Switch.css.js +1 -1
  350. package/dist-es/table/Table.css.js +1 -1
  351. package/dist-es/tabs/Tabs.js +1 -1
  352. package/dist-es/tabs/Tabs.js.map +1 -1
  353. package/dist-es/tabs/internal/overflow/useOverflow.js.map +1 -1
  354. package/dist-es/tabs/internal/overflow/useRenderedTabWidth.js.map +1 -1
  355. package/dist-es/tag/Tag.css.js +1 -1
  356. package/dist-es/text/Code.js +1 -1
  357. package/dist-es/text/Code.js.map +1 -1
  358. package/dist-es/text/Editorial.js +25 -0
  359. package/dist-es/text/Editorial.js.map +1 -0
  360. package/dist-es/text/Eyebrow.js +10 -0
  361. package/dist-es/text/Eyebrow.js.map +1 -0
  362. package/dist-es/text/Text.css.js +1 -1
  363. package/dist-es/text/Text.js +6 -2
  364. package/dist-es/text/Text.js.map +1 -1
  365. package/dist-es/toast/Toast.css.js +1 -1
  366. package/dist-es/toggle-button/ToggleButton.js +8 -2
  367. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  368. package/dist-es/toggle-button-group/ToggleButtonGroup.js +71 -8
  369. package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  370. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  371. package/dist-es/toggletip/ToggletipPanel.css.js +1 -1
  372. package/dist-es/toolbar/ToolbarOverflow.js +8 -4
  373. package/dist-es/toolbar/ToolbarOverflow.js.map +1 -1
  374. package/dist-es/toolbar/toolbarUtils.js.map +1 -1
  375. package/dist-es/tooltip/Tooltip.css.js +1 -1
  376. package/dist-es/tooltip/useAriaAnnounce.js +4 -2
  377. package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
  378. package/dist-es/tooltip/useTooltip.js.map +1 -1
  379. package/dist-es/tree/TreeContext.js.map +1 -1
  380. package/dist-es/utils/forkRef.js +32 -0
  381. package/dist-es/utils/forkRef.js.map +1 -0
  382. package/dist-es/utils/getRefFromChildren.js.map +1 -1
  383. package/dist-es/utils/marginMiddleware.js.map +1 -1
  384. package/dist-es/utils/setRef.js.map +1 -1
  385. package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  386. package/dist-es/utils/useForkRef.js +3 -6
  387. package/dist-es/utils/useForkRef.js.map +1 -1
  388. package/dist-es/utils/useResizeObserver.js.map +1 -1
  389. package/dist-es/vertical-navigation/VerticalNavigationItemContent.css.js +1 -1
  390. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js +1 -1
  391. package/dist-types/checkbox/CheckboxIcon.d.ts +2 -1
  392. package/dist-types/collapsible/CollapsiblePanel.d.ts +8 -1
  393. package/dist-types/combo-box/ComboBox.d.ts +2 -2
  394. package/dist-types/combo-box/useComboBox.d.ts +3 -6
  395. package/dist-types/dropdown/Dropdown.d.ts +2 -2
  396. package/dist-types/form-field/FormFieldHelperText.d.ts +1 -1
  397. package/dist-types/form-field/FormFieldLabel.d.ts +1 -1
  398. package/dist-types/form-field-context/FormFieldContext.d.ts +1 -1
  399. package/dist-types/index.d.ts +1 -0
  400. package/dist-types/interactable-card/InteractableCardGroupContext.d.ts +2 -0
  401. package/dist-types/interactable-card/useInteractableCard.d.ts +1 -2
  402. package/dist-types/list-box/ListBox.d.ts +2 -2
  403. package/dist-types/list-control/ListControlContext.d.ts +1 -1
  404. package/dist-types/list-control/ListControlNavigationKeys.d.ts +30 -0
  405. package/dist-types/list-control/ListControlOptionContext.d.ts +18 -0
  406. package/dist-types/list-control/ListControlOptionStore.d.ts +17 -0
  407. package/dist-types/list-control/ListControlProvider.d.ts +11 -0
  408. package/dist-types/list-control/ListControlRegistry.d.ts +22 -0
  409. package/dist-types/list-control/ListControlState.d.ts +6 -6
  410. package/dist-types/on-solid-button/OnSolidButton.d.ts +12 -0
  411. package/dist-types/on-solid-button/index.d.ts +1 -0
  412. package/dist-types/option/Option.d.ts +3 -1
  413. package/dist-types/overlay/Overlay.d.ts +2 -1
  414. package/dist-types/overlay/OverlayContext.d.ts +4 -0
  415. package/dist-types/overlay/OverlayFooter.d.ts +4 -0
  416. package/dist-types/overlay/hasOverlaySection.d.ts +2 -0
  417. package/dist-types/overlay/index.d.ts +1 -0
  418. package/dist-types/pill/PillCheckIcon.d.ts +2 -1
  419. package/dist-types/registerClassNameInjection.d.ts +0 -2
  420. package/dist-types/salt-provider/SaltProvider.d.ts +1 -1
  421. package/dist-types/side-panel/internal/useIsScrollable.d.ts +1 -1
  422. package/dist-types/skip-link/internal/useManageFocusOnTarget.d.ts +1 -1
  423. package/dist-types/slider/internal/SliderThumb.d.ts +2 -2
  424. package/dist-types/slider/internal/SliderTrack.d.ts +2 -2
  425. package/dist-types/slider/internal/useRangeSliderThumb.d.ts +1 -1
  426. package/dist-types/slider/internal/useSliderThumb.d.ts +1 -1
  427. package/dist-types/slider/internal/utils.d.ts +1 -1
  428. package/dist-types/tabs/internal/overflow/useOverflow.d.ts +2 -2
  429. package/dist-types/tabs/internal/overflow/useRenderedTabWidth.d.ts +1 -1
  430. package/dist-types/text/Editorial.d.ts +7 -0
  431. package/dist-types/text/Eyebrow.d.ts +2 -0
  432. package/dist-types/text/Text.d.ts +9 -2
  433. package/dist-types/text/index.d.ts +2 -0
  434. package/dist-types/toggle-button/ToggleButton.d.ts +1 -1
  435. package/dist-types/toggle-button-group/ToggleButtonGroupContext.d.ts +2 -1
  436. package/dist-types/tooltip/useTooltip.d.ts +12 -26
  437. package/dist-types/tree/TreeContext.d.ts +1 -1
  438. package/dist-types/utils/forkRef.d.ts +11 -0
  439. package/dist-types/utils/inferElementType.d.ts +1 -2
  440. package/dist-types/utils/marginMiddleware.d.ts +1 -1
  441. package/dist-types/utils/setRef.d.ts +4 -0
  442. package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +1 -5
  443. package/dist-types/utils/useResizeObserver.d.ts +1 -1
  444. package/package.json +5 -5
@@ -1 +1 @@
1
- {"version":3,"file":"SliderThumb.js","sources":["../src/slider/internal/SliderThumb.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n type RefObject,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { makePrefixer, useId } from \"../../utils\";\nimport sliderThumbCss from \"./SliderThumb.css\";\nimport { SliderTooltip } from \"./SliderTooltip\";\n\nconst withBaseName = makePrefixer(\"saltSliderThumb\");\n\ninterface SliderThumbProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"onChange\" | \"defaultValue\" | \"min\" | \"max\"\n > {\n accessibleMaxText?: string;\n accessibleMinText?: string;\n disabled: boolean;\n format?: (value: number) => number | string;\n handleInputChange: (event: ChangeEvent<HTMLInputElement>) => void;\n handleKeydownOnThumb: (event: React.KeyboardEvent) => void;\n handlePointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n index?: number;\n inputRef?: RefObject<HTMLInputElement>;\n isFocusVisible: boolean;\n max: number;\n maxLabel?: string;\n min: number;\n minLabel?: string;\n offsetPercentage?: string;\n restrictToMarks?: boolean;\n showTooltip?: boolean;\n sliderValue: [number, number] | number;\n step: number;\n stepMultiplier: number;\n trackDragging: boolean;\n}\n\nexport const SliderThumb = ({\n \"aria-label\": ariaLabel,\n \"aria-valuetext\": ariaValueText,\n \"aria-labelledby\": ariaLabelledBy,\n accessibleMaxText,\n accessibleMinText,\n disabled,\n format,\n handleInputChange,\n handleKeydownOnThumb,\n handlePointerDown,\n index = 0,\n inputRef,\n isFocusVisible,\n max,\n maxLabel,\n min,\n minLabel,\n offsetPercentage,\n restrictToMarks,\n showTooltip,\n sliderValue,\n step,\n stepMultiplier,\n trackDragging,\n ...rest\n}: SliderThumbProps) => {\n {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-thumb\",\n css: sliderThumbCss,\n window: targetWindow,\n });\n\n const [isTooltipVisible, setIsTooltipVisible] = useState(false);\n const id = useId();\n const accessibleTextId = `saltSlider-${id}-${index}`;\n const value = Array.isArray(sliderValue) ? sliderValue[index] : sliderValue;\n const formattedValue = format ? format(value) : value;\n\n const handleKeyDown = useCallback((event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n setIsTooltipVisible(false);\n }\n }, []);\n\n useEffect(() => {\n if (showTooltip && isTooltipVisible) {\n targetWindow?.addEventListener(\"keydown\", handleKeyDown);\n }\n return () => targetWindow?.removeEventListener(\"keydown\", handleKeyDown);\n }, [handleKeyDown, isTooltipVisible, showTooltip, targetWindow]);\n\n const handlePointerEnter = () => setIsTooltipVisible(true);\n\n const handlePointerLeave = () => {\n // Delay hiding the tooltip to enable tooltip\n // visibility on hover\n setTimeout(() => {\n setIsTooltipVisible(false);\n }, 300);\n };\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"focusVisible\")]: isFocusVisible,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"dragging\")]: trackDragging,\n [withBaseName(\"secondThumb\")]: index === 1,\n })}\n data-testid=\"sliderThumb\"\n onPointerDown={handlePointerDown}\n style={{ left: offsetPercentage }}\n {...(showTooltip && {\n onPointerEnter: handlePointerEnter,\n onPointerLeave: handlePointerLeave,\n })}\n >\n {showTooltip && (\n <SliderTooltip\n value={formattedValue}\n open={\n (isTooltipVisible || trackDragging || isFocusVisible) && !disabled\n }\n />\n )}\n <input\n disabled={disabled}\n type=\"range\"\n ref={inputRef}\n className={withBaseName(\"input\")}\n value={value}\n onChange={handleInputChange}\n onKeyDown={handleKeydownOnThumb}\n aria-labelledby={ariaLabelledBy}\n aria-valuenow={value}\n aria-valuetext={ariaValueText || format?.(value).toString()}\n aria-label={ariaLabel}\n aria-describedby={accessibleTextId}\n min={min}\n max={max}\n step={step}\n {...rest}\n />\n {/* Accessible text */}\n <span\n aria-hidden=\"true\"\n id={accessibleTextId}\n className={withBaseName(\"accessibleText\")}\n >\n {Array.isArray(sliderValue) &&\n `${index === 0 ? \"leading\" : \"trailing\"}, ${format?.(sliderValue[0]) || sliderValue[0]} to ${format?.(sliderValue[1]) || sliderValue[1]}, `}\n range{\" \"}\n {accessibleMinText\n ? `${accessibleMinText} ${min}, `\n : `minimum ${format?.(min) || min}, `}\n {accessibleMaxText\n ? `${accessibleMaxText} ${max} `\n : `maximum ${format?.(max) || max}`}\n {restrictToMarks\n ? \", custom increments\"\n : step !== 1 && `, increments of ${step}`}\n </span>\n </div>\n );\n }\n};\n"],"names":["sliderThumbCss"],"mappings":"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"}
1
+ {"version":3,"file":"SliderThumb.js","sources":["../src/slider/internal/SliderThumb.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n type Ref,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { makePrefixer, useId } from \"../../utils\";\nimport sliderThumbCss from \"./SliderThumb.css\";\nimport { SliderTooltip } from \"./SliderTooltip\";\n\nconst withBaseName = makePrefixer(\"saltSliderThumb\");\n\ninterface SliderThumbProps\n extends Omit<\n ComponentPropsWithoutRef<\"input\">,\n \"onChange\" | \"defaultValue\" | \"min\" | \"max\"\n > {\n accessibleMaxText?: string;\n accessibleMinText?: string;\n disabled: boolean;\n format?: (value: number) => number | string;\n handleInputChange: (event: ChangeEvent<HTMLInputElement>) => void;\n handleKeydownOnThumb: (event: React.KeyboardEvent) => void;\n handlePointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n index?: number;\n inputRef?: Ref<HTMLInputElement>;\n isFocusVisible: boolean;\n max: number;\n maxLabel?: string;\n min: number;\n minLabel?: string;\n offsetPercentage?: string;\n restrictToMarks?: boolean;\n showTooltip?: boolean;\n sliderValue: [number, number] | number;\n step: number;\n stepMultiplier: number;\n trackDragging: boolean;\n}\n\nexport const SliderThumb = ({\n \"aria-label\": ariaLabel,\n \"aria-valuetext\": ariaValueText,\n \"aria-labelledby\": ariaLabelledBy,\n accessibleMaxText,\n accessibleMinText,\n disabled,\n format,\n handleInputChange,\n handleKeydownOnThumb,\n handlePointerDown,\n index = 0,\n inputRef,\n isFocusVisible,\n max,\n maxLabel,\n min,\n minLabel,\n offsetPercentage,\n restrictToMarks,\n showTooltip,\n sliderValue,\n step,\n stepMultiplier,\n trackDragging,\n ...rest\n}: SliderThumbProps) => {\n {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-thumb\",\n css: sliderThumbCss,\n window: targetWindow,\n });\n\n const [isTooltipVisible, setIsTooltipVisible] = useState(false);\n const id = useId();\n const accessibleTextId = `saltSlider-${id}-${index}`;\n const value = Array.isArray(sliderValue) ? sliderValue[index] : sliderValue;\n const formattedValue = format ? format(value) : value;\n\n const handleKeyDown = useCallback((event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n setIsTooltipVisible(false);\n }\n }, []);\n\n useEffect(() => {\n if (showTooltip && isTooltipVisible) {\n targetWindow?.addEventListener(\"keydown\", handleKeyDown);\n }\n return () => targetWindow?.removeEventListener(\"keydown\", handleKeyDown);\n }, [handleKeyDown, isTooltipVisible, showTooltip, targetWindow]);\n\n const handlePointerEnter = () => setIsTooltipVisible(true);\n\n const handlePointerLeave = () => {\n // Delay hiding the tooltip to enable tooltip\n // visibility on hover\n setTimeout(() => {\n setIsTooltipVisible(false);\n }, 300);\n };\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"focusVisible\")]: isFocusVisible,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"dragging\")]: trackDragging,\n [withBaseName(\"secondThumb\")]: index === 1,\n })}\n data-testid=\"sliderThumb\"\n onPointerDown={handlePointerDown}\n style={{ left: offsetPercentage }}\n {...(showTooltip && {\n onPointerEnter: handlePointerEnter,\n onPointerLeave: handlePointerLeave,\n })}\n >\n {showTooltip && (\n <SliderTooltip\n value={formattedValue}\n open={\n (isTooltipVisible || trackDragging || isFocusVisible) && !disabled\n }\n />\n )}\n <input\n disabled={disabled}\n type=\"range\"\n ref={inputRef}\n className={withBaseName(\"input\")}\n value={value}\n onChange={handleInputChange}\n onKeyDown={handleKeydownOnThumb}\n aria-labelledby={ariaLabelledBy}\n aria-valuenow={value}\n aria-valuetext={ariaValueText || format?.(value).toString()}\n aria-label={ariaLabel}\n aria-describedby={accessibleTextId}\n min={min}\n max={max}\n step={step}\n {...rest}\n />\n {/* Accessible text */}\n <span\n aria-hidden=\"true\"\n id={accessibleTextId}\n className={withBaseName(\"accessibleText\")}\n >\n {Array.isArray(sliderValue) &&\n `${index === 0 ? \"leading\" : \"trailing\"}, ${format?.(sliderValue[0]) || sliderValue[0]} to ${format?.(sliderValue[1]) || sliderValue[1]}, `}\n range{\" \"}\n {accessibleMinText\n ? `${accessibleMinText} ${min}, `\n : `minimum ${format?.(min) || min}, `}\n {accessibleMaxText\n ? `${accessibleMaxText} ${max} `\n : `maximum ${format?.(max) || max}`}\n {restrictToMarks\n ? \", custom increments\"\n : step !== 1 && `, increments of ${step}`}\n </span>\n </div>\n );\n }\n};\n"],"names":["sliderThumbCss"],"mappings":"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"}
@@ -4,6 +4,8 @@ import { useWindow } from '@salt-ds/window';
4
4
  import { clsx } from 'clsx';
5
5
  import '../../text/Code.js';
6
6
  import '../../text/Display.js';
7
+ import '../../text/Editorial.js';
8
+ import '../../text/Eyebrow.js';
7
9
  import '../../text/Headings.js';
8
10
  import '../../text/Label.js';
9
11
  import { Text } from '../../text/Text.js';
@@ -1 +1 @@
1
- {"version":3,"file":"SliderTooltip.js","sources":["../src/slider/internal/SliderTooltip.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTooltipCss from \"./SliderTooltip.css\";\n\nconst withBaseName = makePrefixer(\"saltSliderTooltip\");\n\ninterface SliderTooltipProps {\n value: number | string;\n open?: boolean;\n}\n\nexport const SliderTooltip = ({ value, open }: SliderTooltipProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-tooltip\",\n css: sliderTooltipCss,\n window: targetWindow,\n });\n\n return (\n <div\n aria-hidden\n className={clsx(withBaseName(), {\n [withBaseName(\"visible\")]: open,\n })}\n data-testid=\"sliderTooltip\"\n >\n <svg\n className={withBaseName(\"arrow\")}\n aria-hidden=\"true\"\n viewBox=\"0 1 14 14\"\n >\n <path\n d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n stroke=\" var(--salt-container-primary-background)\"\n />\n <path\n d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n stroke=\"var(--salt-container-bold-borderColor)\"\n />\n </svg>\n <Text className={withBaseName(\"text\")}>{value}</Text>\n </div>\n );\n};\n"],"names":["sliderTooltipCss"],"mappings":";;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAO9C,MAAM,aAAA,GAAgB,CAAC,EAAE,KAAA,EAAO,MAAK,KAA0B;AACpE,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG;AAAA,QAC9B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,OAC5B,CAAA;AAAA,MACD,aAAA,EAAY,eAAA;AAAA,MAEZ,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAC/B,aAAA,EAAY,MAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YAER,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA,eACT;AAAA,8BACA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,SACF;AAAA,4BACC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAChD;AAEJ;;;;"}
1
+ {"version":3,"file":"SliderTooltip.js","sources":["../src/slider/internal/SliderTooltip.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTooltipCss from \"./SliderTooltip.css\";\n\nconst withBaseName = makePrefixer(\"saltSliderTooltip\");\n\ninterface SliderTooltipProps {\n value: number | string;\n open?: boolean;\n}\n\nexport const SliderTooltip = ({ value, open }: SliderTooltipProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-tooltip\",\n css: sliderTooltipCss,\n window: targetWindow,\n });\n\n return (\n <div\n aria-hidden\n className={clsx(withBaseName(), {\n [withBaseName(\"visible\")]: open,\n })}\n data-testid=\"sliderTooltip\"\n >\n <svg\n className={withBaseName(\"arrow\")}\n aria-hidden=\"true\"\n viewBox=\"0 1 14 14\"\n >\n <path\n d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n stroke=\" var(--salt-container-primary-background)\"\n />\n <path\n d=\"M0,0 H14 L7,7 Q7,7 7,7 Z\"\n stroke=\"var(--salt-container-bold-borderColor)\"\n />\n </svg>\n <Text className={withBaseName(\"text\")}>{value}</Text>\n </div>\n );\n};\n"],"names":["sliderTooltipCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAO9C,MAAM,aAAA,GAAgB,CAAC,EAAE,KAAA,EAAO,MAAK,KAA0B;AACpE,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG;AAAA,QAC9B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,OAC5B,CAAA;AAAA,MACD,aAAA,EAAY,eAAA;AAAA,MAEZ,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAC/B,aAAA,EAAY,MAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YAER,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA,eACT;AAAA,8BACA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,CAAA,EAAE,0BAAA;AAAA,kBACF,MAAA,EAAO;AAAA;AAAA;AACT;AAAA;AAAA,SACF;AAAA,4BACC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GAChD;AAEJ;;;;"}
@@ -1,4 +1,4 @@
1
- var css_248z = ".saltSliderTrack {\n --slider-track-background: var(--salt-sentiment-neutral-track);\n --slider-track-fill: var(--salt-sentiment-accent-borderColor);\n --slider-progressPercentage: 0%;\n --slider-tick-height: calc((var(--salt-size-selectable) - var(--salt-size-bar)) / 2);\n /* For range */\n --slider-progressPercentageStart: 0%;\n --slider-progressPercentageEnd: 0%;\n\n display: flex;\n touch-action: none;\n width: 100%;\n}\n\n.saltSliderTrack.saltSliderTrack-withMarks {\n /* To wrap the marks within the boundary box */\n margin-bottom: calc(var(--salt-size-base) / 2);\n}\n\n.saltSliderTrack-disabled {\n opacity: 0.4;\n}\n\n.saltSliderTrack-container {\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: var(--salt-spacing-100);\n width: 100%;\n}\n\n.saltSliderTrack-wrapper {\n align-items: center;\n cursor: var(--salt-cursor-hover);\n display: flex;\n flex: 1;\n height: var(--salt-size-selectable);\n position: relative;\n width: 100%;\n}\n\n.saltSliderTrack-disabled,\n.saltSliderTrack-disabled .saltSliderTrack-wrapper {\n cursor: var(--salt-cursor-disabled);\n}\n\n.saltSliderTrack-disabled .saltSliderTrack-wrapper {\n pointer-events: none;\n}\n\n.saltSliderTrack-rail {\n display: flex;\n flex: 100%;\n height: var(--salt-size-bar);\n justify-content: space-between;\n position: relative;\n}\n\n.saltSliderTrack-rail::before,\n.saltSliderTrack-rail::after {\n content: \"\";\n display: block;\n height: 100%;\n}\n\n.saltSliderTrack-rail::before {\n background: var(--slider-track-fill);\n border-top-left-radius: var(--salt-palette-corner-weaker);\n border-bottom-left-radius: var(--salt-palette-corner-weaker);\n width: calc(var(--slider-progressPercentage) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-hasMinTick.saltSliderTrack-rail::before {\n border-bottom-left-radius: unset;\n}\n\n.saltSliderTrack-rail::after {\n background: var(--slider-track-background);\n border-top-right-radius: var(--salt-palette-corner-weaker);\n border-bottom-right-radius: var(--salt-palette-corner-weaker);\n width: calc(100% - var(--slider-progressPercentage) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-hasMaxTick.saltSliderTrack-rail::after {\n border-bottom-right-radius: unset;\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail::before {\n background: var(--slider-track-background);\n width: calc(var(--slider-progressPercentageStart) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail::after {\n background: var(--slider-track-background);\n width: calc(100% - var(--slider-progressPercentageEnd) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail .saltSliderTrack-fill {\n background: var(--slider-track-fill);\n height: 100%;\n left: calc(var(--slider-progressPercentageStart) + var(--salt-spacing-fixed-300));\n position: absolute;\n width: calc(var(--slider-progressPercentageEnd) - var(--slider-progressPercentageStart) - var(--salt-size-fixed-600));\n}\n\n.saltSliderTrack-minLabel,\n.saltSliderTrack-maxLabel {\n user-select: none;\n}\n\n.saltSliderTrack-dragging,\n.saltSliderTrack-dragging .saltSliderTrack-wrapper {\n cursor: var(--salt-cursor-grab-active);\n}\n\n.saltSliderTrack-ticks {\n top: calc(var(--salt-size-bar) + var(--slider-tick-height));\n position: absolute;\n width: 100%;\n}\n\n.saltSliderTrack-tick {\n background: var(--slider-track-background);\n height: var(--slider-tick-height);\n position: absolute;\n transform: translate(-50%);\n width: var(--salt-size-fixed-200);\n}\n\n.saltSliderTrack-withTicks .saltSliderTrack-tickHidden {\n visibility: hidden;\n}\n\n.saltSliderTrack-tickSelected {\n background: var(--slider-track-fill);\n}\n\n.saltSliderTrack-tick:first-of-type {\n transform: unset;\n}\n\n.saltSliderTrack-tick:last-of-type {\n transform: translateX(-100%);\n}\n\n.saltSliderTrack-marks {\n position: absolute;\n user-select: none;\n width: 100%;\n}\n\n.saltSliderTrack-markLabel {\n color: var(--salt-content-secondary-foreground);\n font-family: var(--salt-text-label-fontFamily);\n font-weight: var(--salt-text-label-fontWeight);\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n overflow: hidden;\n position: absolute;\n text-overflow: ellipsis;\n transform: translateX(-50%);\n top: calc(var(--slider-tick-height) + var(--salt-spacing-50));\n white-space: nowrap;\n}\n\n.saltSliderTrack-constrainLabelPosition .saltSliderTrack-markLabel:first-of-type {\n transform: translateX(0%);\n}\n\n.saltSliderTrack-constrainLabelPosition .saltSliderTrack-markLabel:last-of-type {\n transform: translateX(-100%);\n}\n\n/* Styles applied when slider and range slider are inside a form field */\n\n.saltFormField .saltSliderTrack.saltSliderTrack-withMark {\n margin-bottom: 0;\n}\n\n.saltFormField .saltSliderTrack-container {\n --saltFormField-label-width: 10%;\n\n height: var(--salt-size-base);\n}\n\n.saltFormField .saltSliderTrack-markLabel {\n top: calc((var(--salt-size-base) - var(--salt-size-bar)) / 2);\n}\n";
1
+ var css_248z = ".saltSliderTrack {\n --slider-track-background: var(--salt-sentiment-neutral-track);\n --slider-track-fill: var(--salt-sentiment-accent-borderColor);\n --slider-progressPercentage: 0%;\n --slider-tick-height: calc((var(--salt-size-selectable) - var(--salt-size-bar)) / 2);\n /* For range */\n --slider-progressPercentageStart: 0%;\n --slider-progressPercentageEnd: 0%;\n\n display: flex;\n touch-action: none;\n width: 100%;\n}\n\n.saltSliderTrack.saltSliderTrack-withMarks {\n /* To wrap the marks within the boundary box */\n margin-bottom: calc(var(--salt-size-base) / 2);\n}\n\n.saltSliderTrack-disabled {\n opacity: 0.4;\n}\n\n.saltSliderTrack-container {\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: var(--salt-spacing-100);\n width: 100%;\n}\n\n.saltSliderTrack-wrapper {\n align-items: center;\n cursor: var(--salt-cursor-hover);\n display: flex;\n flex: 1;\n height: var(--salt-size-selectable);\n position: relative;\n width: 100%;\n}\n\n.saltSliderTrack-disabled,\n.saltSliderTrack-disabled .saltSliderTrack-wrapper {\n cursor: var(--salt-cursor-disabled);\n}\n\n.saltSliderTrack-disabled .saltSliderTrack-wrapper {\n pointer-events: none;\n}\n\n.saltSliderTrack-rail {\n display: flex;\n flex: 100%;\n height: var(--salt-size-bar);\n justify-content: space-between;\n position: relative;\n}\n\n.saltSliderTrack-rail::before,\n.saltSliderTrack-rail::after {\n content: \"\";\n display: block;\n height: 100%;\n}\n\n.saltSliderTrack-rail::before {\n background: var(--slider-track-fill);\n border-top-left-radius: var(--salt-palette-corner-weaker);\n border-bottom-left-radius: var(--salt-palette-corner-weaker);\n width: calc(var(--slider-progressPercentage) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-hasMinTick.saltSliderTrack-rail::before {\n border-bottom-left-radius: unset;\n}\n\n.saltSliderTrack-rail::after {\n background: var(--slider-track-background);\n border-top-right-radius: var(--salt-palette-corner-weaker);\n border-bottom-right-radius: var(--salt-palette-corner-weaker);\n width: calc(100% - var(--slider-progressPercentage) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-hasMaxTick.saltSliderTrack-rail::after {\n border-bottom-right-radius: unset;\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail::before {\n background: var(--slider-track-background);\n width: calc(var(--slider-progressPercentageStart) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail::after {\n background: var(--slider-track-background);\n width: calc(100% - var(--slider-progressPercentageEnd) - var(--salt-spacing-fixed-300));\n}\n\n.saltSliderTrack-range .saltSliderTrack-rail .saltSliderTrack-fill {\n background: var(--slider-track-fill);\n height: 100%;\n left: calc(var(--slider-progressPercentageStart) + var(--salt-spacing-fixed-300));\n position: absolute;\n width: calc(var(--slider-progressPercentageEnd) - var(--slider-progressPercentageStart) - var(--salt-size-fixed-600));\n}\n\n.saltSliderTrack-minLabel,\n.saltSliderTrack-maxLabel {\n user-select: none;\n}\n\n.saltSliderTrack-dragging,\n.saltSliderTrack-dragging .saltSliderTrack-wrapper {\n cursor: var(--salt-cursor-grab-active);\n}\n\n.saltSliderTrack-ticks {\n top: calc(var(--salt-size-bar) + var(--slider-tick-height));\n position: absolute;\n width: 100%;\n}\n\n.saltSliderTrack-tick {\n background: var(--slider-track-background);\n height: var(--slider-tick-height);\n position: absolute;\n transform: translate(-50%);\n width: var(--salt-size-fixed-200);\n}\n\n.saltSliderTrack-withTicks .saltSliderTrack-tickHidden {\n visibility: hidden;\n}\n\n.saltSliderTrack-tickSelected {\n background: var(--slider-track-fill);\n}\n\n.saltSliderTrack-tick:first-of-type {\n transform: unset;\n}\n\n.saltSliderTrack-tick:last-of-type {\n transform: translateX(-100%);\n}\n\n.saltSliderTrack-marks {\n position: absolute;\n user-select: none;\n width: 100%;\n}\n\n.saltSliderTrack-markLabel {\n color: var(--salt-content-secondary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-label-fontWeight);\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n overflow: hidden;\n position: absolute;\n text-overflow: ellipsis;\n transform: translateX(-50%);\n top: calc(var(--slider-tick-height) + var(--salt-spacing-50));\n white-space: nowrap;\n}\n\n.saltSliderTrack-constrainLabelPosition .saltSliderTrack-markLabel:first-of-type {\n transform: translateX(0%);\n}\n\n.saltSliderTrack-constrainLabelPosition .saltSliderTrack-markLabel:last-of-type {\n transform: translateX(-100%);\n}\n\n/* Styles applied when slider and range slider are inside a form field */\n\n.saltFormField .saltSliderTrack.saltSliderTrack-withMark {\n margin-bottom: 0;\n}\n\n.saltFormField .saltSliderTrack-container {\n --saltFormField-label-width: 10%;\n\n height: var(--salt-size-base);\n}\n\n.saltFormField .saltSliderTrack-markLabel {\n top: calc((var(--salt-size-base) - var(--salt-size-bar)) / 2);\n}\n";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=SliderTrack.css.js.map
@@ -5,6 +5,8 @@ import { clsx } from 'clsx';
5
5
  import { forwardRef } from 'react';
6
6
  import '../../text/Code.js';
7
7
  import '../../text/Display.js';
8
+ import '../../text/Editorial.js';
9
+ import '../../text/Eyebrow.js';
8
10
  import '../../text/Headings.js';
9
11
  import '../../text/Label.js';
10
12
  import { Text } from '../../text/Text.js';
@@ -1 +1 @@
1
- {"version":3,"file":"SliderTrack.js","sources":["../src/slider/internal/SliderTrack.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type RefObject } from \"react\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTrackCss from \"./SliderTrack.css\";\nimport { calculateMarkPosition, calculatePercentage } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltSliderTrack\");\n\ninterface SliderTrackProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n children: React.ReactNode;\n constrainLabelPosition?: boolean;\n disabled: boolean;\n showTicks?: boolean;\n format?: (value: number) => string | number;\n handlePointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n isDragging: boolean;\n isRange?: boolean;\n marks?: { label: string; value: number }[];\n max: number;\n maxLabel?: number | string;\n min: number;\n minLabel?: number | string;\n progressPercentage?: number;\n progressPercentageRange?: [number, number];\n sliderRef: RefObject<HTMLDivElement>;\n}\n\nexport const SliderTrack = forwardRef<HTMLDivElement, SliderTrackProps>(\n function SliderTrack(\n {\n children,\n className,\n constrainLabelPosition = false,\n disabled,\n showTicks,\n format,\n handlePointerDown,\n isDragging,\n isRange = false,\n marks,\n max,\n maxLabel,\n min,\n minLabel,\n progressPercentage = 0,\n progressPercentageRange = [0, 0],\n sliderRef,\n ...rest\n },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-track\",\n css: sliderTrackCss,\n window: targetWindow,\n });\n\n const checkIsMarkSelected = (value: number) => {\n const markPercentage = calculatePercentage(value, max, min);\n if (isRange) {\n return (\n markPercentage > progressPercentageRange[0] &&\n markPercentage < progressPercentageRange[1]\n );\n }\n return markPercentage < progressPercentage;\n };\n\n const checkIsMarkOverlapped = (value: number) => {\n const markPercentage = calculatePercentage(value, max, min);\n if (isRange) {\n return (\n markPercentage === progressPercentageRange[0] ||\n markPercentage === progressPercentageRange[1]\n );\n }\n return markPercentage === progressPercentage;\n };\n\n const hasMinTick = () => {\n return marks?.some((mark) => mark.value === min) || false;\n };\n\n const hasMaxTick = () => {\n return marks?.some((mark) => mark.value === max) || false;\n };\n\n return (\n <div\n className={clsx(withBaseName(), className, {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"dragging\")]: isDragging,\n [withBaseName(\"range\")]: isRange,\n [withBaseName(\"withMarks\")]: marks,\n [withBaseName(\"constrainLabelPosition\")]: constrainLabelPosition,\n [withBaseName(\"withTicks\")]: showTicks,\n })}\n data-testid=\"sliderTrack\"\n ref={ref}\n {...rest}\n >\n <div className={clsx(withBaseName(\"container\"))}>\n {minLabel && (\n <Text\n aria-hidden\n className={withBaseName(\"minLabel\")}\n color=\"secondary\"\n styleAs=\"label\"\n >\n {minLabel || format?.(min)}\n </Text>\n )}\n {/* Slider Track */}\n <div\n onPointerDown={handlePointerDown}\n className={withBaseName(\"wrapper\")}\n >\n <div\n className={clsx(withBaseName(\"rail\"), {\n [withBaseName(\"hasMinTick\")]: hasMinTick() && showTicks,\n [withBaseName(\"hasMaxTick\")]: hasMaxTick() && showTicks,\n })}\n ref={sliderRef}\n style={\n {\n ...(progressPercentage !== undefined && {\n \"--slider-progressPercentage\": `${progressPercentage}%`,\n }),\n ...(progressPercentageRange?.[0] !== undefined && {\n \"--slider-progressPercentageStart\": `${progressPercentageRange[0]}%`,\n }),\n ...(progressPercentageRange?.[1] !== undefined && {\n \"--slider-progressPercentageEnd\": `${progressPercentageRange[1]}%`,\n }),\n } as React.CSSProperties\n }\n >\n {isRange && <div className={clsx(withBaseName(\"fill\"))} />}\n {children}\n </div>\n {/* Ticks */}\n {marks && showTicks && (\n <div className={withBaseName(\"ticks\")}>\n {marks.map(({ value }) => (\n <span\n key={`${value}-tick`}\n style={{\n left: `${calculateMarkPosition(value, max, min)}%`,\n }}\n className={clsx(\n withBaseName(\"tick\"),\n {\n [withBaseName(\"tickSelected\")]:\n checkIsMarkSelected(value),\n },\n {\n [withBaseName(\"tickHidden\")]:\n checkIsMarkOverlapped(value),\n },\n )}\n />\n ))}\n </div>\n )}\n {/* Marks */}\n {marks && (\n <div className={withBaseName(\"marks\")}>\n {marks.map(({ label, value }) => (\n <span\n data-testid=\"mark\"\n key={`${value}-mark`}\n className={withBaseName(\"markLabel\")}\n style={{\n left: `${calculateMarkPosition(value, max, min)}%`,\n }}\n >\n {label}\n </span>\n ))}\n </div>\n )}\n </div>\n {maxLabel && (\n <Text\n aria-hidden\n className={withBaseName(\"maxLabel\")}\n color=\"secondary\"\n styleAs=\"label\"\n >\n {maxLabel || format?.(max)}\n </Text>\n )}\n </div>\n </div>\n );\n },\n);\n"],"names":["SliderTrack","sliderTrackCss"],"mappings":"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"}
1
+ {"version":3,"file":"SliderTrack.js","sources":["../src/slider/internal/SliderTrack.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type Ref } from \"react\";\nimport { Text } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport sliderTrackCss from \"./SliderTrack.css\";\nimport { calculateMarkPosition, calculatePercentage } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltSliderTrack\");\n\ninterface SliderTrackProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n children: React.ReactNode;\n constrainLabelPosition?: boolean;\n disabled: boolean;\n showTicks?: boolean;\n format?: (value: number) => string | number;\n handlePointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n isDragging: boolean;\n isRange?: boolean;\n marks?: { label: string; value: number }[];\n max: number;\n maxLabel?: number | string;\n min: number;\n minLabel?: number | string;\n progressPercentage?: number;\n progressPercentageRange?: [number, number];\n sliderRef: Ref<HTMLDivElement>;\n}\n\nexport const SliderTrack = forwardRef<HTMLDivElement, SliderTrackProps>(\n function SliderTrack(\n {\n children,\n className,\n constrainLabelPosition = false,\n disabled,\n showTicks,\n format,\n handlePointerDown,\n isDragging,\n isRange = false,\n marks,\n max,\n maxLabel,\n min,\n minLabel,\n progressPercentage = 0,\n progressPercentageRange = [0, 0],\n sliderRef,\n ...rest\n },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-slider-track\",\n css: sliderTrackCss,\n window: targetWindow,\n });\n\n const checkIsMarkSelected = (value: number) => {\n const markPercentage = calculatePercentage(value, max, min);\n if (isRange) {\n return (\n markPercentage > progressPercentageRange[0] &&\n markPercentage < progressPercentageRange[1]\n );\n }\n return markPercentage < progressPercentage;\n };\n\n const checkIsMarkOverlapped = (value: number) => {\n const markPercentage = calculatePercentage(value, max, min);\n if (isRange) {\n return (\n markPercentage === progressPercentageRange[0] ||\n markPercentage === progressPercentageRange[1]\n );\n }\n return markPercentage === progressPercentage;\n };\n\n const hasMinTick = () => {\n return marks?.some((mark) => mark.value === min) || false;\n };\n\n const hasMaxTick = () => {\n return marks?.some((mark) => mark.value === max) || false;\n };\n\n return (\n <div\n className={clsx(withBaseName(), className, {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"dragging\")]: isDragging,\n [withBaseName(\"range\")]: isRange,\n [withBaseName(\"withMarks\")]: marks,\n [withBaseName(\"constrainLabelPosition\")]: constrainLabelPosition,\n [withBaseName(\"withTicks\")]: showTicks,\n })}\n data-testid=\"sliderTrack\"\n ref={ref}\n {...rest}\n >\n <div className={clsx(withBaseName(\"container\"))}>\n {minLabel && (\n <Text\n aria-hidden\n className={withBaseName(\"minLabel\")}\n color=\"secondary\"\n styleAs=\"label\"\n >\n {minLabel || format?.(min)}\n </Text>\n )}\n {/* Slider Track */}\n <div\n onPointerDown={handlePointerDown}\n className={withBaseName(\"wrapper\")}\n >\n <div\n className={clsx(withBaseName(\"rail\"), {\n [withBaseName(\"hasMinTick\")]: hasMinTick() && showTicks,\n [withBaseName(\"hasMaxTick\")]: hasMaxTick() && showTicks,\n })}\n ref={sliderRef}\n style={\n {\n ...(progressPercentage !== undefined && {\n \"--slider-progressPercentage\": `${progressPercentage}%`,\n }),\n ...(progressPercentageRange?.[0] !== undefined && {\n \"--slider-progressPercentageStart\": `${progressPercentageRange[0]}%`,\n }),\n ...(progressPercentageRange?.[1] !== undefined && {\n \"--slider-progressPercentageEnd\": `${progressPercentageRange[1]}%`,\n }),\n } as React.CSSProperties\n }\n >\n {isRange && <div className={clsx(withBaseName(\"fill\"))} />}\n {children}\n </div>\n {/* Ticks */}\n {marks && showTicks && (\n <div className={withBaseName(\"ticks\")}>\n {marks.map(({ value }) => (\n <span\n key={`${value}-tick`}\n style={{\n left: `${calculateMarkPosition(value, max, min)}%`,\n }}\n className={clsx(\n withBaseName(\"tick\"),\n {\n [withBaseName(\"tickSelected\")]:\n checkIsMarkSelected(value),\n },\n {\n [withBaseName(\"tickHidden\")]:\n checkIsMarkOverlapped(value),\n },\n )}\n />\n ))}\n </div>\n )}\n {/* Marks */}\n {marks && (\n <div className={withBaseName(\"marks\")}>\n {marks.map(({ label, value }) => (\n <span\n data-testid=\"mark\"\n key={`${value}-mark`}\n className={withBaseName(\"markLabel\")}\n style={{\n left: `${calculateMarkPosition(value, max, min)}%`,\n }}\n >\n {label}\n </span>\n ))}\n </div>\n )}\n </div>\n {maxLabel && (\n <Text\n aria-hidden\n className={withBaseName(\"maxLabel\")}\n color=\"secondary\"\n styleAs=\"label\"\n >\n {maxLabel || format?.(max)}\n </Text>\n )}\n </div>\n </div>\n );\n },\n);\n"],"names":["SliderTrack","sliderTrackCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA;AAsB5C,MAAM,WAAA,GAAc,UAAA;AAAA,EACzB,SAASA,YAAAA,CACP;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,sBAAA,GAAyB,KAAA;AAAA,IACzB,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,iBAAA;AAAA,IACA,UAAA;AAAA,IACA,OAAA,GAAU,KAAA;AAAA,IACV,KAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA;AAAA,IACA,kBAAA,GAAqB,CAAA;AAAA,IACrB,uBAAA,GAA0B,CAAC,CAAA,EAAG,CAAC,CAAA;AAAA,IAC/B,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,mBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,mBAAA,GAAsB,CAAC,KAAA,KAAkB;AAC7C,MAAA,MAAM,cAAA,GAAiB,mBAAA,CAAoB,KAAA,EAAO,GAAA,EAAK,GAAG,CAAA;AAC1D,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,OACE,iBAAiB,uBAAA,CAAwB,CAAC,CAAA,IAC1C,cAAA,GAAiB,wBAAwB,CAAC,CAAA;AAAA,MAE9C;AACA,MAAA,OAAO,cAAA,GAAiB,kBAAA;AAAA,IAC1B,CAAA;AAEA,IAAA,MAAM,qBAAA,GAAwB,CAAC,KAAA,KAAkB;AAC/C,MAAA,MAAM,cAAA,GAAiB,mBAAA,CAAoB,KAAA,EAAO,GAAA,EAAK,GAAG,CAAA;AAC1D,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,OACE,mBAAmB,uBAAA,CAAwB,CAAC,CAAA,IAC5C,cAAA,KAAmB,wBAAwB,CAAC,CAAA;AAAA,MAEhD;AACA,MAAA,OAAO,cAAA,KAAmB,kBAAA;AAAA,IAC5B,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAA,OAAA,CAAO,+BAAO,IAAA,CAAK,CAAC,IAAA,KAAS,IAAA,CAAK,UAAU,GAAA,CAAA,KAAQ,KAAA;AAAA,IACtD,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAA,OAAA,CAAO,+BAAO,IAAA,CAAK,CAAC,IAAA,KAAS,IAAA,CAAK,UAAU,GAAA,CAAA,KAAQ,KAAA;AAAA,IACtD,CAAA;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAA,EAAW;AAAA,UACzC,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,UAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG,OAAA;AAAA,UACzB,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,KAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,wBAAwB,CAAC,GAAG,sBAAA;AAAA,UAC1C,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC9B,CAAA;AAAA,QACD,aAAA,EAAY,aAAA;AAAA,QACZ,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,+BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,KAAK,YAAA,CAAa,WAAW,CAAC,CAAA,EAC3C,QAAA,EAAA;AAAA,UAAA,QAAA,oBACC,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAW,IAAA;AAAA,cACX,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,cAClC,KAAA,EAAM,WAAA;AAAA,cACN,OAAA,EAAQ,OAAA;AAAA,cAEP,uBAAY,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,GAAA,CAAA;AAAA;AAAA,WACxB;AAAA,0BAGF,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAe,iBAAA;AAAA,cACf,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,cAEjC,QAAA,EAAA;AAAA,gCAAA,IAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,IAAA,CAAK,YAAA,CAAa,MAAM,CAAA,EAAG;AAAA,sBACpC,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG,YAAW,IAAK,SAAA;AAAA,sBAC9C,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG,YAAW,IAAK;AAAA,qBAC/C,CAAA;AAAA,oBACD,GAAA,EAAK,SAAA;AAAA,oBACL,KAAA,EACE;AAAA,sBACE,GAAI,uBAAuB,MAAA,IAAa;AAAA,wBACtC,6BAAA,EAA+B,GAAG,kBAAkB,CAAA,CAAA;AAAA,uBACtD;AAAA,sBACA,GAAA,CAAI,uBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,uBAAA,CAA0B,CAAA,CAAA,MAAO,MAAA,IAAa;AAAA,wBAChD,kCAAA,EAAoC,CAAA,EAAG,uBAAA,CAAwB,CAAC,CAAC,CAAA,CAAA;AAAA,uBACnE;AAAA,sBACA,GAAA,CAAI,uBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,uBAAA,CAA0B,CAAA,CAAA,MAAO,MAAA,IAAa;AAAA,wBAChD,gCAAA,EAAkC,CAAA,EAAG,uBAAA,CAAwB,CAAC,CAAC,CAAA,CAAA;AAAA;AACjE,qBACF;AAAA,oBAGD,QAAA,EAAA;AAAA,sBAAA,OAAA,wBAAY,KAAA,EAAA,EAAI,SAAA,EAAW,KAAK,YAAA,CAAa,MAAM,CAAC,CAAA,EAAG,CAAA;AAAA,sBACvD;AAAA;AAAA;AAAA,iBACH;AAAA,gBAEC,KAAA,IAAS,SAAA,oBACR,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,CAAA,EACjC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,EAAE,OAAM,qBAClB,GAAA;AAAA,kBAAC,MAAA;AAAA,kBAAA;AAAA,oBAEC,KAAA,EAAO;AAAA,sBACL,MAAM,CAAA,EAAG,qBAAA,CAAsB,KAAA,EAAO,GAAA,EAAK,GAAG,CAAC,CAAA,CAAA;AAAA,qBACjD;AAAA,oBACA,SAAA,EAAW,IAAA;AAAA,sBACT,aAAa,MAAM,CAAA;AAAA,sBACnB;AAAA,wBACE,CAAC,YAAA,CAAa,cAAc,CAAC,GAC3B,oBAAoB,KAAK;AAAA,uBAC7B;AAAA,sBACA;AAAA,wBACE,CAAC,YAAA,CAAa,YAAY,CAAC,GACzB,sBAAsB,KAAK;AAAA;AAC/B;AACF,mBAAA;AAAA,kBAdK,GAAG,KAAK,CAAA,KAAA;AAAA,iBAgBhB,CAAA,EACH,CAAA;AAAA,gBAGD,KAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,CAAA,EACjC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,EAAE,KAAA,EAAO,OAAM,qBACzB,GAAA;AAAA,kBAAC,MAAA;AAAA,kBAAA;AAAA,oBACC,aAAA,EAAY,MAAA;AAAA,oBAEZ,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,oBACnC,KAAA,EAAO;AAAA,sBACL,MAAM,CAAA,EAAG,qBAAA,CAAsB,KAAA,EAAO,GAAA,EAAK,GAAG,CAAC,CAAA,CAAA;AAAA,qBACjD;AAAA,oBAEC,QAAA,EAAA;AAAA,mBAAA;AAAA,kBANI,GAAG,KAAK,CAAA,KAAA;AAAA,iBAQhB,CAAA,EACH;AAAA;AAAA;AAAA,WAEJ;AAAA,UACC,QAAA,oBACC,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAW,IAAA;AAAA,cACX,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,cAClC,KAAA,EAAM,WAAA;AAAA,cACN,OAAA,EAAQ,OAAA;AAAA,cAEP,uBAAY,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,GAAA,CAAA;AAAA;AAAA;AACxB,SAAA,EAEJ;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"useRangeSliderThumb.js","sources":["../src/slider/internal/useRangeSliderThumb.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEvent,\n type Dispatch,\n type RefObject,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { SliderProps } from \"../Slider\";\nimport { getClickedPosition, getKeyboardValue } from \"./utils\";\n\ntype UseRangeSliderThumbProps = Pick<SliderProps, \"min\" | \"max\" | \"step\"> & {\n decimalPlaces: number;\n handleInputChange: (\n event: ChangeEvent<HTMLInputElement>,\n thumbIndex: number,\n ) => void;\n inputRefs: RefObject<HTMLInputElement>[];\n marks?: { label: string; value: number }[];\n onChange?: (event: Event, value: [number, number]) => void;\n onChangeEnd?: (event: Event, value: [number, number]) => void;\n restrictToMarks?: boolean;\n setValue: Dispatch<SetStateAction<[number, number]>>;\n stepMultiplier: number;\n value: [number, number];\n};\n\nexport const useRangeSliderThumb = ({\n decimalPlaces,\n handleInputChange,\n inputRefs,\n marks,\n min = 0,\n max = 10,\n step = 1,\n onChange,\n onChangeEnd,\n restrictToMarks,\n setValue,\n stepMultiplier,\n value,\n}: UseRangeSliderThumbProps) => {\n const [isDragging, setIsDragging] = useState(false);\n const [isFocusVisible, setIsFocusVisible] = useState(false);\n const [thumbIndexState, setIsThumbIndex] = useState<number>(0);\n const lastValueRef = useRef<[number, number]>(value);\n const sliderRef = useRef<HTMLDivElement>(null);\n const targetWindow = useWindow();\n\n const preventThumbOverlap = useCallback(\n (currentValue: number, value: [number, number], thumbIndex: number) => {\n const values = [...value] as [number, number];\n if (thumbIndex === 0 && currentValue >= values[1]) {\n values[0] = values[1];\n } else if (thumbIndex === 1 && currentValue <= values[0]) {\n values[1] = values[0];\n } else {\n values[thumbIndex] = currentValue;\n }\n return values;\n },\n [],\n );\n\n const handlePointerMove = useCallback(\n (event: PointerEvent) => {\n if (!sliderRef.current) return;\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined) return;\n const newValues = preventThumbOverlap(\n newValue,\n value as [number, number],\n thumbIndexState,\n );\n\n if (\n newValues[0] !== lastValueRef.current[0] ||\n newValues[1] !== lastValueRef.current[1]\n ) {\n lastValueRef.current = newValues;\n setValue(newValues);\n onChange?.(event, newValues);\n }\n },\n [\n decimalPlaces,\n marks,\n max,\n min,\n step,\n preventThumbOverlap,\n restrictToMarks,\n value,\n thumbIndexState,\n setValue,\n onChange,\n ],\n );\n\n const handleDragEnd = useCallback(\n (event: Event) => {\n setIsDragging(false);\n setIsFocusVisible(false);\n onChangeEnd?.(event, lastValueRef.current);\n },\n [onChangeEnd],\n );\n\n useEffect(() => {\n if (isDragging) {\n targetWindow?.addEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.addEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.addEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.addEventListener(\"blur\", handleDragEnd);\n targetWindow?.addEventListener(\"contextmenu\", handleDragEnd);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n }\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n };\n }, [isDragging, targetWindow, handlePointerMove, handleDragEnd]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>, thumbIndex: number) => {\n event.preventDefault();\n // To prevent the pointerdown event from bubbling up to the slider track\n // and triggering its pointerdown event\n event.stopPropagation();\n\n inputRefs[thumbIndex].current?.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n if (thumbIndex !== undefined) {\n setIsThumbIndex(thumbIndex);\n }\n },\n [inputRefs],\n );\n\n const handlePointerDownOnTrack = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n setIsDragging(true);\n\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n let closestThumbIndex = 0;\n\n if (newValue === undefined) return;\n const newValues = [...value] as [number, number];\n // Find nearest thumb\n const distanceToThumb0 = Math.abs(newValue - newValues[0]);\n const distanceToThumb1 = Math.abs(newValue - newValues[1]);\n if (distanceToThumb0 > distanceToThumb1) {\n // Move the second thumb\n newValues[1] = newValue;\n closestThumbIndex = 1;\n } else if (distanceToThumb0 < distanceToThumb1) {\n // Move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n } else {\n // If distances are equal, determine based on the click position\n if (newValue < newValues[0]) {\n // Clicked position is before both thumbs, move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n } else if (newValue > newValues[1]) {\n // Clicked position is after both thumbs, move the second thumb\n newValues[1] = newValue;\n closestThumbIndex = 1;\n } else {\n // Clicked position is between the thumbs, move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n }\n }\n setIsThumbIndex(closestThumbIndex);\n inputRefs[closestThumbIndex].current?.focus();\n setIsFocusVisible(false);\n\n if (\n newValues[0] !== lastValueRef.current[0] ||\n newValues[1] !== lastValueRef.current[1]\n ) {\n lastValueRef.current = newValues;\n setValue(newValues);\n onChange?.(event.nativeEvent, newValues);\n }\n },\n [\n decimalPlaces,\n marks,\n value,\n max,\n min,\n inputRefs,\n onChange,\n restrictToMarks,\n setValue,\n step,\n ],\n );\n\n const handleKeydownOnThumb = useCallback(\n (event: React.KeyboardEvent, thumbIndex: number) => {\n const newValue = getKeyboardValue(\n event,\n value[thumbIndex],\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n );\n if (\n newValue === undefined ||\n newValue === lastValueRef.current[thumbIndex]\n ) {\n return;\n }\n setIsFocusVisible(true);\n lastValueRef.current[thumbIndex] = newValue;\n handleInputChange(\n {\n target: { value: newValue.toString() },\n } as ChangeEvent<HTMLInputElement>,\n thumbIndex,\n );\n },\n [\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n handleInputChange,\n ],\n );\n\n const handleFocus = (thumbIndex: number) => {\n setIsThumbIndex(thumbIndex);\n setIsFocusVisible(true);\n };\n\n const handleBlur = (thumbIndex: number) => {\n setIsThumbIndex(thumbIndex);\n setIsFocusVisible(false);\n };\n\n return {\n handleBlur,\n handleFocus,\n handleKeydownOnThumb,\n handlePointerDownOnThumb,\n handlePointerDownOnTrack,\n isDragging,\n isFocusVisible,\n preventThumbOverlap,\n sliderRef,\n thumbIndexState,\n };\n};\n"],"names":["value"],"mappings":"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"}
1
+ {"version":3,"file":"useRangeSliderThumb.js","sources":["../src/slider/internal/useRangeSliderThumb.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEvent,\n type Dispatch,\n type RefObject,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { SliderProps } from \"../Slider\";\nimport { getClickedPosition, getKeyboardValue } from \"./utils\";\n\ntype UseRangeSliderThumbProps = Pick<SliderProps, \"min\" | \"max\" | \"step\"> & {\n decimalPlaces: number;\n handleInputChange: (\n event: ChangeEvent<HTMLInputElement>,\n thumbIndex: number,\n ) => void;\n inputRefs: RefObject<HTMLInputElement | null>[];\n marks?: { label: string; value: number }[];\n onChange?: (event: Event, value: [number, number]) => void;\n onChangeEnd?: (event: Event, value: [number, number]) => void;\n restrictToMarks?: boolean;\n setValue: Dispatch<SetStateAction<[number, number]>>;\n stepMultiplier: number;\n value: [number, number];\n};\n\nexport const useRangeSliderThumb = ({\n decimalPlaces,\n handleInputChange,\n inputRefs,\n marks,\n min = 0,\n max = 10,\n step = 1,\n onChange,\n onChangeEnd,\n restrictToMarks,\n setValue,\n stepMultiplier,\n value,\n}: UseRangeSliderThumbProps) => {\n const [isDragging, setIsDragging] = useState(false);\n const [isFocusVisible, setIsFocusVisible] = useState(false);\n const [thumbIndexState, setIsThumbIndex] = useState<number>(0);\n const lastValueRef = useRef<[number, number]>(value);\n const sliderRef = useRef<HTMLDivElement>(null);\n const targetWindow = useWindow();\n\n const preventThumbOverlap = useCallback(\n (currentValue: number, value: [number, number], thumbIndex: number) => {\n const values = [...value] as [number, number];\n if (thumbIndex === 0 && currentValue >= values[1]) {\n values[0] = values[1];\n } else if (thumbIndex === 1 && currentValue <= values[0]) {\n values[1] = values[0];\n } else {\n values[thumbIndex] = currentValue;\n }\n return values;\n },\n [],\n );\n\n const handlePointerMove = useCallback(\n (event: PointerEvent) => {\n if (!sliderRef.current) return;\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined) return;\n const newValues = preventThumbOverlap(\n newValue,\n value as [number, number],\n thumbIndexState,\n );\n\n if (\n newValues[0] !== lastValueRef.current[0] ||\n newValues[1] !== lastValueRef.current[1]\n ) {\n lastValueRef.current = newValues;\n setValue(newValues);\n onChange?.(event, newValues);\n }\n },\n [\n decimalPlaces,\n marks,\n max,\n min,\n step,\n preventThumbOverlap,\n restrictToMarks,\n value,\n thumbIndexState,\n setValue,\n onChange,\n ],\n );\n\n const handleDragEnd = useCallback(\n (event: Event) => {\n setIsDragging(false);\n setIsFocusVisible(false);\n onChangeEnd?.(event, lastValueRef.current);\n },\n [onChangeEnd],\n );\n\n useEffect(() => {\n if (isDragging) {\n targetWindow?.addEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.addEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.addEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.addEventListener(\"blur\", handleDragEnd);\n targetWindow?.addEventListener(\"contextmenu\", handleDragEnd);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n }\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n };\n }, [isDragging, targetWindow, handlePointerMove, handleDragEnd]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>, thumbIndex: number) => {\n event.preventDefault();\n // To prevent the pointerdown event from bubbling up to the slider track\n // and triggering its pointerdown event\n event.stopPropagation();\n\n inputRefs[thumbIndex].current?.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n if (thumbIndex !== undefined) {\n setIsThumbIndex(thumbIndex);\n }\n },\n [inputRefs],\n );\n\n const handlePointerDownOnTrack = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n setIsDragging(true);\n\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n let closestThumbIndex = 0;\n\n if (newValue === undefined) return;\n const newValues = [...value] as [number, number];\n // Find nearest thumb\n const distanceToThumb0 = Math.abs(newValue - newValues[0]);\n const distanceToThumb1 = Math.abs(newValue - newValues[1]);\n if (distanceToThumb0 > distanceToThumb1) {\n // Move the second thumb\n newValues[1] = newValue;\n closestThumbIndex = 1;\n } else if (distanceToThumb0 < distanceToThumb1) {\n // Move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n } else {\n // If distances are equal, determine based on the click position\n if (newValue < newValues[0]) {\n // Clicked position is before both thumbs, move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n } else if (newValue > newValues[1]) {\n // Clicked position is after both thumbs, move the second thumb\n newValues[1] = newValue;\n closestThumbIndex = 1;\n } else {\n // Clicked position is between the thumbs, move the first thumb\n newValues[0] = newValue;\n closestThumbIndex = 0;\n }\n }\n setIsThumbIndex(closestThumbIndex);\n inputRefs[closestThumbIndex].current?.focus();\n setIsFocusVisible(false);\n\n if (\n newValues[0] !== lastValueRef.current[0] ||\n newValues[1] !== lastValueRef.current[1]\n ) {\n lastValueRef.current = newValues;\n setValue(newValues);\n onChange?.(event.nativeEvent, newValues);\n }\n },\n [\n decimalPlaces,\n marks,\n value,\n max,\n min,\n inputRefs,\n onChange,\n restrictToMarks,\n setValue,\n step,\n ],\n );\n\n const handleKeydownOnThumb = useCallback(\n (event: React.KeyboardEvent, thumbIndex: number) => {\n const newValue = getKeyboardValue(\n event,\n value[thumbIndex],\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n );\n if (\n newValue === undefined ||\n newValue === lastValueRef.current[thumbIndex]\n ) {\n return;\n }\n setIsFocusVisible(true);\n lastValueRef.current[thumbIndex] = newValue;\n handleInputChange(\n {\n target: { value: newValue.toString() },\n } as ChangeEvent<HTMLInputElement>,\n thumbIndex,\n );\n },\n [\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n handleInputChange,\n ],\n );\n\n const handleFocus = (thumbIndex: number) => {\n setIsThumbIndex(thumbIndex);\n setIsFocusVisible(true);\n };\n\n const handleBlur = (thumbIndex: number) => {\n setIsThumbIndex(thumbIndex);\n setIsFocusVisible(false);\n };\n\n return {\n handleBlur,\n handleFocus,\n handleKeydownOnThumb,\n handlePointerDownOnThumb,\n handlePointerDownOnTrack,\n isDragging,\n isFocusVisible,\n preventThumbOverlap,\n sliderRef,\n thumbIndexState,\n };\n};\n"],"names":["value"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"useSliderThumb.js","sources":["../src/slider/internal/useSliderThumb.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEvent,\n type Dispatch,\n type RefObject,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { SliderProps } from \"../Slider\";\nimport { getClickedPosition, getKeyboardValue } from \"./utils\";\n\ntype UseSliderThumbProps = Pick<SliderProps, \"min\" | \"max\" | \"step\"> & {\n decimalPlaces: number;\n handleInputChange: (event: ChangeEvent<HTMLInputElement>) => void;\n inputRef: RefObject<HTMLInputElement>;\n marks?: { label: string; value: number }[];\n onChange?: (event: Event, value: number) => void;\n onChangeEnd?: (event: Event, value: number) => void;\n restrictToMarks?: boolean;\n setValue: Dispatch<SetStateAction<number>>;\n stepMultiplier: number;\n value: number;\n};\n\nexport const useSliderThumb = ({\n decimalPlaces,\n handleInputChange,\n inputRef,\n marks,\n min = 0,\n max = 10,\n step = 1,\n onChange,\n onChangeEnd,\n restrictToMarks,\n setValue,\n stepMultiplier,\n value,\n}: UseSliderThumbProps) => {\n const [isDragging, setIsDragging] = useState(false);\n const [isFocusVisible, setIsFocusVisible] = useState(false);\n const lastValueRef = useRef<number>(value);\n const sliderRef = useRef<HTMLDivElement>(null);\n const targetWindow = useWindow();\n\n const handlePointerMove = useCallback(\n (event: PointerEvent) => {\n if (!sliderRef.current) return;\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n lastValueRef.current = newValue;\n setValue(newValue);\n onChange?.(event, newValue);\n },\n [decimalPlaces, marks, max, min, onChange, setValue, restrictToMarks, step],\n );\n\n const handleDragEnd = useCallback(\n (event: Event) => {\n setIsDragging(false);\n setIsFocusVisible(false);\n onChangeEnd?.(event, lastValueRef.current);\n },\n [onChangeEnd],\n );\n\n useEffect(() => {\n if (isDragging) {\n targetWindow?.addEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.addEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.addEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.addEventListener(\"blur\", handleDragEnd);\n targetWindow?.addEventListener(\"contextmenu\", handleDragEnd);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n }\n\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n };\n }, [isDragging, targetWindow, handlePointerMove, handleDragEnd]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n if (inputRef.current) inputRef.current.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n },\n [inputRef],\n );\n\n const handlePointerDownOnTrack = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n if (inputRef.current) inputRef.current.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n lastValueRef.current = newValue;\n setValue(newValue);\n onChange?.(event.nativeEvent, newValue);\n },\n [\n decimalPlaces,\n inputRef,\n marks,\n max,\n min,\n onChange,\n restrictToMarks,\n setValue,\n step,\n ],\n );\n\n const handleKeydownOnThumb = useCallback(\n (event: React.KeyboardEvent) => {\n const newValue = getKeyboardValue(\n event,\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n setIsFocusVisible(true);\n lastValueRef.current = newValue;\n handleInputChange({\n target: { value: newValue.toString() },\n } as ChangeEvent<HTMLInputElement>);\n },\n [\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n handleInputChange,\n ],\n );\n\n const handleFocus = () => setIsFocusVisible(true);\n const handleBlur = () => setIsFocusVisible(false);\n\n return {\n handleBlur,\n handleFocus,\n handleKeydownOnThumb,\n handlePointerDownOnThumb,\n handlePointerDownOnTrack,\n isDragging,\n isFocusVisible,\n sliderRef,\n };\n};\n"],"names":[],"mappings":";;;;AA2BO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,aAAA;AAAA,EACA,iBAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,GAAA,GAAM,CAAA;AAAA,EACN,GAAA,GAAM,EAAA;AAAA,EACN,IAAA,GAAO,CAAA;AAAA,EACP,QAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA;AAAA,EACA,QAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA,KAA2B;AACzB,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA;AAClD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAAS,KAAK,CAAA;AAC1D,EAAA,MAAM,YAAA,GAAe,OAAe,KAAK,CAAA;AACzC,EAAA,MAAM,SAAA,GAAY,OAAuB,IAAI,CAAA;AAC7C,EAAA,MAAM,eAAe,SAAA,EAAU;AAE/B,EAAA,MAAM,iBAAA,GAAoB,WAAA;AAAA,IACxB,CAAC,KAAA,KAAwB;AACvB,MAAA,IAAI,CAAC,UAAU,OAAA,EAAS;AACxB,MAAA,MAAM,QAAA,GAAW,kBAAA;AAAA,QACf,SAAA;AAAA,QACA,KAAA,CAAM,OAAA;AAAA,QACN,GAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,aAAA;AAAA,QACA,KAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,QAAA,KAAa,MAAA,IAAa,YAAA,CAAa,OAAA,KAAY,QAAA,EAAU;AAC/D,QAAA;AAAA,MACF;AACA,MAAA,YAAA,CAAa,OAAA,GAAU,QAAA;AACvB,MAAA,QAAA,CAAS,QAAQ,CAAA;AACjB,MAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,EAAO,QAAA,CAAA;AAAA,IACpB,CAAA;AAAA,IACA,CAAC,eAAe,KAAA,EAAO,GAAA,EAAK,KAAK,QAAA,EAAU,QAAA,EAAU,iBAAiB,IAAI;AAAA,GAC5E;AAEA,EAAA,MAAM,aAAA,GAAgB,WAAA;AAAA,IACpB,CAAC,KAAA,KAAiB;AAChB,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAA,iBAAA,CAAkB,KAAK,CAAA;AACvB,MAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,OAAO,YAAA,CAAa,OAAA,CAAA;AAAA,IACpC,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,UAAA,EAAY;AACd,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,iBAAiB,aAAA,EAAe,iBAAA,CAAA;AAC9C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,iBAAiB,WAAA,EAAa,aAAA,CAAA;AAC5C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,iBAAiB,eAAA,EAAiB,aAAA,CAAA;AAChD,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,iBAAiB,MAAA,EAAQ,aAAA,CAAA;AACvC,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,iBAAiB,aAAA,EAAe,aAAA,CAAA;AAAA,IAChD,CAAA,MAAO;AACL,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,aAAA,EAAe,iBAAA,CAAA;AACjD,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,WAAA,EAAa,aAAA,CAAA;AAC/C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,eAAA,EAAiB,aAAA,CAAA;AACnD,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,MAAA,EAAQ,aAAA,CAAA;AAC1C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,aAAA,EAAe,aAAA,CAAA;AAAA,IACnD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,aAAA,EAAe,iBAAA,CAAA;AACjD,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,WAAA,EAAa,aAAA,CAAA;AAC/C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,eAAA,EAAiB,aAAA,CAAA;AACnD,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,MAAA,EAAQ,aAAA,CAAA;AAC1C,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAc,oBAAoB,aAAA,EAAe,aAAA,CAAA;AAAA,IACnD,CAAA;AAAA,EACF,GAAG,CAAC,UAAA,EAAY,YAAA,EAAc,iBAAA,EAAmB,aAAa,CAAC,CAAA;AAE/D,EAAA,MAAM,wBAAA,GAA2B,WAAA;AAAA,IAC/B,CAAC,KAAA,KAA8C;AAC7C,MAAA,KAAA,CAAM,cAAA,EAAe;AACrB,MAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,MAAA,IAAI,QAAA,CAAS,OAAA,EAAS,QAAA,CAAS,OAAA,CAAQ,KAAA,EAAM;AAC7C,MAAA,aAAA,CAAc,IAAI,CAAA;AAClB,MAAA,iBAAA,CAAkB,KAAK,CAAA;AAAA,IACzB,CAAA;AAAA,IACA,CAAC,QAAQ;AAAA,GACX;AAEA,EAAA,MAAM,wBAAA,GAA2B,WAAA;AAAA,IAC/B,CAAC,KAAA,KAA8C;AAC7C,MAAA,KAAA,CAAM,cAAA,EAAe;AACrB,MAAA,IAAI,QAAA,CAAS,OAAA,EAAS,QAAA,CAAS,OAAA,CAAQ,KAAA,EAAM;AAC7C,MAAA,aAAA,CAAc,IAAI,CAAA;AAClB,MAAA,iBAAA,CAAkB,KAAK,CAAA;AACvB,MAAA,MAAM,QAAA,GAAW,kBAAA;AAAA,QACf,SAAA;AAAA,QACA,KAAA,CAAM,OAAA;AAAA,QACN,GAAA;AAAA,QACA,GAAA;AAAA,QACA,IAAA;AAAA,QACA,aAAA;AAAA,QACA,KAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,QAAA,KAAa,MAAA,IAAa,YAAA,CAAa,OAAA,KAAY,QAAA,EAAU;AAC/D,QAAA;AAAA,MACF;AACA,MAAA,YAAA,CAAa,OAAA,GAAU,QAAA;AACvB,MAAA,QAAA,CAAS,QAAQ,CAAA;AACjB,MAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,MAAM,WAAA,EAAa,QAAA,CAAA;AAAA,IAChC,CAAA;AAAA,IACA;AAAA,MACE,aAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,QAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,oBAAA,GAAuB,WAAA;AAAA,IAC3B,CAAC,KAAA,KAA+B;AAC9B,MAAA,MAAM,QAAA,GAAW,gBAAA;AAAA,QACf,KAAA;AAAA,QACA,KAAA;AAAA,QACA,IAAA;AAAA,QACA,cAAA;AAAA,QACA,GAAA;AAAA,QACA,GAAA;AAAA,QACA,eAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,QAAA,KAAa,MAAA,IAAa,YAAA,CAAa,OAAA,KAAY,QAAA,EAAU;AAC/D,QAAA;AAAA,MACF;AACA,MAAA,iBAAA,CAAkB,IAAI,CAAA;AACtB,MAAA,YAAA,CAAa,OAAA,GAAU,QAAA;AACvB,MAAA,iBAAA,CAAkB;AAAA,QAChB,MAAA,EAAQ,EAAE,KAAA,EAAO,QAAA,CAAS,UAAS;AAAE,OACL,CAAA;AAAA,IACpC,CAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,IAAA;AAAA,MACA,cAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,eAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,WAAA,GAAc,MAAM,iBAAA,CAAkB,IAAI,CAAA;AAChD,EAAA,MAAM,UAAA,GAAa,MAAM,iBAAA,CAAkB,KAAK,CAAA;AAEhD,EAAA,OAAO;AAAA,IACL,UAAA;AAAA,IACA,WAAA;AAAA,IACA,oBAAA;AAAA,IACA,wBAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
1
+ {"version":3,"file":"useSliderThumb.js","sources":["../src/slider/internal/useSliderThumb.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEvent,\n type Dispatch,\n type RefObject,\n type SetStateAction,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { SliderProps } from \"../Slider\";\nimport { getClickedPosition, getKeyboardValue } from \"./utils\";\n\ntype UseSliderThumbProps = Pick<SliderProps, \"min\" | \"max\" | \"step\"> & {\n decimalPlaces: number;\n handleInputChange: (event: ChangeEvent<HTMLInputElement>) => void;\n inputRef: RefObject<HTMLInputElement | null>;\n marks?: { label: string; value: number }[];\n onChange?: (event: Event, value: number) => void;\n onChangeEnd?: (event: Event, value: number) => void;\n restrictToMarks?: boolean;\n setValue: Dispatch<SetStateAction<number>>;\n stepMultiplier: number;\n value: number;\n};\n\nexport const useSliderThumb = ({\n decimalPlaces,\n handleInputChange,\n inputRef,\n marks,\n min = 0,\n max = 10,\n step = 1,\n onChange,\n onChangeEnd,\n restrictToMarks,\n setValue,\n stepMultiplier,\n value,\n}: UseSliderThumbProps) => {\n const [isDragging, setIsDragging] = useState(false);\n const [isFocusVisible, setIsFocusVisible] = useState(false);\n const lastValueRef = useRef<number>(value);\n const sliderRef = useRef<HTMLDivElement>(null);\n const targetWindow = useWindow();\n\n const handlePointerMove = useCallback(\n (event: PointerEvent) => {\n if (!sliderRef.current) return;\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n lastValueRef.current = newValue;\n setValue(newValue);\n onChange?.(event, newValue);\n },\n [decimalPlaces, marks, max, min, onChange, setValue, restrictToMarks, step],\n );\n\n const handleDragEnd = useCallback(\n (event: Event) => {\n setIsDragging(false);\n setIsFocusVisible(false);\n onChangeEnd?.(event, lastValueRef.current);\n },\n [onChangeEnd],\n );\n\n useEffect(() => {\n if (isDragging) {\n targetWindow?.addEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.addEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.addEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.addEventListener(\"blur\", handleDragEnd);\n targetWindow?.addEventListener(\"contextmenu\", handleDragEnd);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n }\n\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handleDragEnd);\n targetWindow?.removeEventListener(\"pointercancel\", handleDragEnd);\n targetWindow?.removeEventListener(\"blur\", handleDragEnd);\n targetWindow?.removeEventListener(\"contextmenu\", handleDragEnd);\n };\n }, [isDragging, targetWindow, handlePointerMove, handleDragEnd]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n if (inputRef.current) inputRef.current.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n },\n [inputRef],\n );\n\n const handlePointerDownOnTrack = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n event.preventDefault();\n if (inputRef.current) inputRef.current.focus();\n setIsDragging(true);\n setIsFocusVisible(false);\n const newValue = getClickedPosition(\n sliderRef,\n event.clientX,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n lastValueRef.current = newValue;\n setValue(newValue);\n onChange?.(event.nativeEvent, newValue);\n },\n [\n decimalPlaces,\n inputRef,\n marks,\n max,\n min,\n onChange,\n restrictToMarks,\n setValue,\n step,\n ],\n );\n\n const handleKeydownOnThumb = useCallback(\n (event: React.KeyboardEvent) => {\n const newValue = getKeyboardValue(\n event,\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n );\n if (newValue === undefined || lastValueRef.current === newValue) {\n return;\n }\n setIsFocusVisible(true);\n lastValueRef.current = newValue;\n handleInputChange({\n target: { value: newValue.toString() },\n } as ChangeEvent<HTMLInputElement>);\n },\n [\n value,\n step,\n stepMultiplier,\n max,\n min,\n restrictToMarks,\n marks,\n handleInputChange,\n ],\n );\n\n const handleFocus = () => setIsFocusVisible(true);\n const handleBlur = () => setIsFocusVisible(false);\n\n return {\n handleBlur,\n handleFocus,\n handleKeydownOnThumb,\n handlePointerDownOnThumb,\n handlePointerDownOnTrack,\n isDragging,\n isFocusVisible,\n sliderRef,\n };\n};\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/slider/internal/utils.ts"],"sourcesContent":["import type { RefObject } from \"react\";\n\nexport const toFloat = (value: number | string) =>\n typeof value === \"string\" ? Number.parseFloat(value) : value;\n\nexport const calculateMarkPosition = (\n value: number | string,\n max: number,\n min: number,\n) => {\n if (min === max) {\n return 0;\n }\n const clampedValue = Number.isNaN(toFloat(value))\n ? min\n : Math.min(Math.max(toFloat(value), min), max);\n const markPosition = ((clampedValue - min) / (max - min)) * 100;\n return Math.round(markPosition * 100) / 100;\n};\n\nexport const calculatePercentage = (value: number, max: number, min: number) =>\n ((value - min) / (max - min)) * 100;\n\nexport const clamp = (\n value: number,\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { value: number; label: string }[],\n restrictToMarks?: boolean,\n) => {\n if (Number.isNaN(value)) {\n return min;\n }\n // Clamp the value between min and max\n const clampedValue = Math.min(Math.max(value, min), max);\n if (restrictToMarks && marks) {\n // Find the closest mark value\n let closestMark = marks[0].value;\n let smallestDifference = Math.abs(clampedValue - closestMark);\n for (let i = 1; i < marks.length; i++) {\n const currentDifference = Math.abs(clampedValue - marks[i].value);\n if (currentDifference < smallestDifference) {\n smallestDifference = currentDifference;\n closestMark = marks[i].value;\n }\n }\n return closestMark;\n }\n // Round to the nearest multiple of the step\n let roundedValue = Math.round(clampedValue / step) * step;\n // Ensure the rounded value does not exceed max or min\n if (roundedValue > max) {\n roundedValue = max;\n } else if (roundedValue < min) {\n roundedValue = min;\n }\n return Number.parseFloat(roundedValue.toFixed(decimalPlaces));\n};\n\nexport const clampRange = (\n range: [number, number],\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { value: number; label: string }[],\n restrictToMarks?: boolean,\n) => {\n let [start, end] = range;\n\n if (Number.isNaN(start)) {\n start = min;\n }\n if (Number.isNaN(end)) {\n end = max;\n }\n if (start > end) {\n [start, end] = [end, start];\n }\n start = clamp(start, max, min, step, decimalPlaces, marks, restrictToMarks);\n end = clamp(end, max, min, step, decimalPlaces, marks, restrictToMarks);\n return [start, end] as [number, number];\n};\n\nexport const getClickedPosition = (\n sliderRef: RefObject<HTMLDivElement>,\n clientX: number,\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { label: string; value: number }[],\n restrictToMarks?: boolean,\n) => {\n if (!sliderRef.current) return;\n\n const sliderRect = sliderRef.current.getBoundingClientRect();\n const rawValue =\n ((clientX - sliderRect.left) / sliderRect.width) * (max - min) + min;\n const steppedValue = Math.round(rawValue / step) * step;\n return clamp(\n steppedValue,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n};\n\nexport const getKeyboardValue = (\n event: React.KeyboardEvent,\n value: number,\n step: number,\n stepMultiplier: number,\n max: number,\n min: number,\n restrictToMarks?: boolean,\n marks?: { label: string; value: number }[],\n) => {\n let newValue = value;\n\n if (restrictToMarks && marks && marks.length >= 1) {\n const currentIndex = marks.findIndex((mark) => mark.value === value);\n\n switch (event.key) {\n case \"ArrowUp\":\n case \"ArrowRight\":\n case \"PageUp\":\n if (currentIndex < marks.length - 1) {\n newValue = marks[currentIndex + 1].value;\n }\n break;\n case \"ArrowDown\":\n case \"ArrowLeft\":\n case \"PageDown\":\n if (currentIndex > 0) {\n newValue = marks[currentIndex - 1].value;\n }\n break;\n default:\n return newValue;\n }\n } else {\n switch (event.key) {\n case \"ArrowUp\":\n case \"ArrowRight\":\n newValue = Math.min(value + step, max);\n break;\n case \"ArrowDown\":\n case \"ArrowLeft\":\n newValue = Math.max(value - step, min);\n break;\n case \"Home\":\n newValue = min;\n break;\n case \"End\":\n newValue = max;\n break;\n case \"PageUp\":\n newValue = Math.min(value + step * stepMultiplier, max);\n break;\n case \"PageDown\":\n newValue = Math.max(value - step * stepMultiplier, min);\n break;\n default:\n return newValue;\n }\n }\n\n event.preventDefault();\n return newValue;\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sources":["../src/slider/internal/utils.ts"],"sourcesContent":["import type { RefObject } from \"react\";\n\nexport const toFloat = (value: number | string) =>\n typeof value === \"string\" ? Number.parseFloat(value) : value;\n\nexport const calculateMarkPosition = (\n value: number | string,\n max: number,\n min: number,\n) => {\n if (min === max) {\n return 0;\n }\n const clampedValue = Number.isNaN(toFloat(value))\n ? min\n : Math.min(Math.max(toFloat(value), min), max);\n const markPosition = ((clampedValue - min) / (max - min)) * 100;\n return Math.round(markPosition * 100) / 100;\n};\n\nexport const calculatePercentage = (value: number, max: number, min: number) =>\n ((value - min) / (max - min)) * 100;\n\nexport const clamp = (\n value: number,\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { value: number; label: string }[],\n restrictToMarks?: boolean,\n) => {\n if (Number.isNaN(value)) {\n return min;\n }\n // Clamp the value between min and max\n const clampedValue = Math.min(Math.max(value, min), max);\n if (restrictToMarks && marks) {\n // Find the closest mark value\n let closestMark = marks[0].value;\n let smallestDifference = Math.abs(clampedValue - closestMark);\n for (let i = 1; i < marks.length; i++) {\n const currentDifference = Math.abs(clampedValue - marks[i].value);\n if (currentDifference < smallestDifference) {\n smallestDifference = currentDifference;\n closestMark = marks[i].value;\n }\n }\n return closestMark;\n }\n // Round to the nearest multiple of the step\n let roundedValue = Math.round(clampedValue / step) * step;\n // Ensure the rounded value does not exceed max or min\n if (roundedValue > max) {\n roundedValue = max;\n } else if (roundedValue < min) {\n roundedValue = min;\n }\n return Number.parseFloat(roundedValue.toFixed(decimalPlaces));\n};\n\nexport const clampRange = (\n range: [number, number],\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { value: number; label: string }[],\n restrictToMarks?: boolean,\n) => {\n let [start, end] = range;\n\n if (Number.isNaN(start)) {\n start = min;\n }\n if (Number.isNaN(end)) {\n end = max;\n }\n if (start > end) {\n [start, end] = [end, start];\n }\n start = clamp(start, max, min, step, decimalPlaces, marks, restrictToMarks);\n end = clamp(end, max, min, step, decimalPlaces, marks, restrictToMarks);\n return [start, end] as [number, number];\n};\n\nexport const getClickedPosition = (\n sliderRef: RefObject<HTMLDivElement | null>,\n clientX: number,\n max: number,\n min: number,\n step: number,\n decimalPlaces: number,\n marks?: { label: string; value: number }[],\n restrictToMarks?: boolean,\n) => {\n if (!sliderRef.current) return;\n\n const sliderRect = sliderRef.current.getBoundingClientRect();\n const rawValue =\n ((clientX - sliderRect.left) / sliderRect.width) * (max - min) + min;\n const steppedValue = Math.round(rawValue / step) * step;\n return clamp(\n steppedValue,\n max,\n min,\n step,\n decimalPlaces,\n marks,\n restrictToMarks,\n );\n};\n\nexport const getKeyboardValue = (\n event: React.KeyboardEvent,\n value: number,\n step: number,\n stepMultiplier: number,\n max: number,\n min: number,\n restrictToMarks?: boolean,\n marks?: { label: string; value: number }[],\n) => {\n let newValue = value;\n\n if (restrictToMarks && marks && marks.length >= 1) {\n const currentIndex = marks.findIndex((mark) => mark.value === value);\n\n switch (event.key) {\n case \"ArrowUp\":\n case \"ArrowRight\":\n case \"PageUp\":\n if (currentIndex < marks.length - 1) {\n newValue = marks[currentIndex + 1].value;\n }\n break;\n case \"ArrowDown\":\n case \"ArrowLeft\":\n case \"PageDown\":\n if (currentIndex > 0) {\n newValue = marks[currentIndex - 1].value;\n }\n break;\n default:\n return newValue;\n }\n } else {\n switch (event.key) {\n case \"ArrowUp\":\n case \"ArrowRight\":\n newValue = Math.min(value + step, max);\n break;\n case \"ArrowDown\":\n case \"ArrowLeft\":\n newValue = Math.max(value - step, min);\n break;\n case \"Home\":\n newValue = min;\n break;\n case \"End\":\n newValue = max;\n break;\n case \"PageUp\":\n newValue = Math.min(value + step * stepMultiplier, max);\n break;\n case \"PageDown\":\n newValue = Math.max(value - step * stepMultiplier, min);\n break;\n default:\n return newValue;\n }\n }\n\n event.preventDefault();\n return newValue;\n};\n"],"names":[],"mappings":"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"}
@@ -18,7 +18,7 @@ const Stepper = forwardRef(
18
18
  const orientationContext = useContext(StepperOrientationContext);
19
19
  const orientation = orientationProp || orientationContext;
20
20
  useComponentCssInjection({
21
- testId: "salt-Stepper",
21
+ testId: "salt-stepper",
22
22
  css: css_248z,
23
23
  window: targetWindow
24
24
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Stepper.js","sources":["../src/stepper/Stepper.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useContext } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport {\n StepperOrientationContext,\n StepperProvider,\n} from \"./internal/StepperProvider\";\nimport StepperCSS from \"./Stepper.css\";\n\nconst withBaseName = makePrefixer(\"saltStepper\");\n\nexport type StepperOrientation = \"horizontal\" | \"vertical\";\n\nexport interface StepperProps extends ComponentPropsWithoutRef<\"ol\"> {\n /**\n * The orientation of the stepper: defaults to horizontal.\n */\n orientation?: StepperOrientation;\n}\n\nexport const Stepper = forwardRef<HTMLOListElement, StepperProps>(\n function Stepper(\n { orientation: orientationProp, children, className, ...props },\n ref,\n ) {\n const targetWindow = useWindow();\n const orientationContext = useContext(StepperOrientationContext);\n const orientation = orientationProp || orientationContext;\n\n useComponentCssInjection({\n testId: \"salt-Stepper\",\n css: StepperCSS,\n window: targetWindow,\n });\n\n return (\n <StepperProvider orientation={orientation}>\n <ol\n className={clsx(withBaseName(), withBaseName(orientation), className)}\n ref={ref}\n {...props}\n >\n {children}\n </ol>\n </StepperProvider>\n );\n },\n);\n"],"names":["Stepper","StepperCSS"],"mappings":";;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA;AAWxC,MAAM,OAAA,GAAU,UAAA;AAAA,EACrB,SAASA,QAAAA,CACP,EAAE,WAAA,EAAa,eAAA,EAAiB,UAAU,SAAA,EAAW,GAAG,KAAA,EAAM,EAC9D,GAAA,EACA;AACA,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,MAAM,kBAAA,GAAqB,WAAW,yBAAyB,CAAA;AAC/D,IAAA,MAAM,cAAc,eAAA,IAAmB,kBAAA;AAEvC,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,mBAAgB,WAAA,EACf,QAAA,kBAAA,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,WAAW,GAAG,SAAS,CAAA;AAAA,QACpE,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH,EACF,CAAA;AAAA,EAEJ;AACF;;;;"}
1
+ {"version":3,"file":"Stepper.js","sources":["../src/stepper/Stepper.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useContext } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport {\n StepperOrientationContext,\n StepperProvider,\n} from \"./internal/StepperProvider\";\nimport StepperCSS from \"./Stepper.css\";\n\nconst withBaseName = makePrefixer(\"saltStepper\");\n\nexport type StepperOrientation = \"horizontal\" | \"vertical\";\n\nexport interface StepperProps extends ComponentPropsWithoutRef<\"ol\"> {\n /**\n * The orientation of the stepper: defaults to horizontal.\n */\n orientation?: StepperOrientation;\n}\n\nexport const Stepper = forwardRef<HTMLOListElement, StepperProps>(\n function Stepper(\n { orientation: orientationProp, children, className, ...props },\n ref,\n ) {\n const targetWindow = useWindow();\n const orientationContext = useContext(StepperOrientationContext);\n const orientation = orientationProp || orientationContext;\n\n useComponentCssInjection({\n testId: \"salt-stepper\",\n css: StepperCSS,\n window: targetWindow,\n });\n\n return (\n <StepperProvider orientation={orientation}>\n <ol\n className={clsx(withBaseName(), withBaseName(orientation), className)}\n ref={ref}\n {...props}\n >\n {children}\n </ol>\n </StepperProvider>\n );\n },\n);\n"],"names":["Stepper","StepperCSS"],"mappings":";;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA;AAWxC,MAAM,OAAA,GAAU,UAAA;AAAA,EACrB,SAASA,QAAAA,CACP,EAAE,WAAA,EAAa,eAAA,EAAiB,UAAU,SAAA,EAAW,GAAG,KAAA,EAAM,EAC9D,GAAA,EACA;AACA,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,MAAM,kBAAA,GAAqB,WAAW,yBAAyB,CAAA;AAC/D,IAAA,MAAM,cAAc,eAAA,IAAmB,kBAAA;AAEvC,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,mBAAgB,WAAA,EACf,QAAA,kBAAA,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,WAAW,GAAG,SAAS,CAAA;AAAA,QACpE,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH,EACF,CAAA;AAAA,EAEJ;AACF;;;;"}
@@ -1,4 +1,4 @@
1
- var css_248z = ".saltStepText-label {\n grid-area: label;\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n font-family: var(--salt-text-fontFamily);\n color: var(--salt-content-primary-foreground);\n font-weight: var(--salt-text-fontWeight);\n}\n\n.saltStepper-horizontal .saltStepText-label {\n margin-top: var(--salt-spacing-50);\n}\n\n.saltStepper-vertical .saltStepText-label {\n padding-top: calc((var(--salt-size-base) - var(--salt-text-label-lineHeight)) / 2);\n padding-bottom: calc((var(--salt-size-base) - var(--salt-text-label-lineHeight)) / 2);\n padding-left: calc(var(--step-depth) * var(--salt-spacing-100));\n}\n\n.saltStep-depth-0 > .saltText.saltStepText-label {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\n.saltStepText-description {\n grid-area: description;\n color: var(--salt-content-secondary-foreground);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-strong);\n font-family: var(--salt-text-label-fontFamily);\n line-height: var(--salt-text-label-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n}\n\n.saltStepper-vertical .saltStepText-description {\n padding-bottom: var(--salt-spacing-300);\n padding-left: calc(var(--step-depth) * var(--salt-spacing-100));\n}\n\n.saltStep-status-warning > .saltStepText-description {\n color: var(--salt-status-warning-foreground-informative);\n}\n\n.saltStep-status-error > .saltStepText-description {\n color: var(--salt-status-error-foreground-informative);\n}\n";
1
+ var css_248z = ".saltStepText-label {\n grid-area: label;\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n font-family: var(--salt-text-fontFamily);\n color: var(--salt-content-primary-foreground);\n font-weight: var(--salt-text-fontWeight);\n}\n\n.saltStepper-horizontal .saltStepText-label {\n margin-top: var(--salt-spacing-50);\n}\n\n.saltStepper-vertical .saltStepText-label {\n padding-top: calc((var(--salt-size-base) - var(--salt-text-label-lineHeight)) / 2);\n padding-bottom: calc((var(--salt-size-base) - var(--salt-text-label-lineHeight)) / 2);\n padding-left: calc(var(--step-depth) * var(--salt-spacing-100));\n}\n\n.saltStep-depth-0 > .saltText.saltStepText-label {\n font-weight: var(--salt-text-fontWeight-bolder);\n}\n\n.saltStepText-description {\n grid-area: description;\n color: var(--salt-content-secondary-foreground);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-bolder);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-label-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n}\n\n.saltStepper-vertical .saltStepText-description {\n padding-bottom: var(--salt-spacing-300);\n padding-left: calc(var(--step-depth) * var(--salt-spacing-100));\n}\n\n.saltStep-status-warning > .saltStepText-description {\n color: var(--salt-status-warning-foreground-informative);\n}\n\n.saltStep-status-error > .saltStepText-description {\n color: var(--salt-status-error-foreground-informative);\n}\n";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=StepText.css.js.map
@@ -4,6 +4,8 @@ import { useWindow } from '@salt-ds/window';
4
4
  import { clsx } from 'clsx';
5
5
  import '../../text/Code.js';
6
6
  import '../../text/Display.js';
7
+ import '../../text/Editorial.js';
8
+ import '../../text/Eyebrow.js';
7
9
  import '../../text/Headings.js';
8
10
  import '../../text/Label.js';
9
11
  import { Text } from '../../text/Text.js';
@@ -1 +1 @@
1
- {"version":3,"file":"StepText.js","sources":["../src/stepper/internal/StepText.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\n\nimport { Text, type TextProps } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport stepTextCSS from \"./StepText.css\";\n\nexport interface StepTextProps extends TextProps<\"div\"> {\n purpose: \"label\" | \"description\";\n}\n\nconst withBaseName = makePrefixer(\"saltStepText\");\n\nexport function StepText({\n id,\n purpose,\n className,\n styleAs = \"label\",\n children,\n ...props\n}: StepTextProps) {\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-text\",\n css: stepTextCSS,\n window: targetWindow,\n });\n\n return (\n <Text\n id={id}\n className={clsx(withBaseName(), withBaseName(purpose), className)}\n {...props}\n >\n {children}\n </Text>\n );\n}\n"],"names":["stepTextCSS"],"mappings":";;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAEzC,SAAS,QAAA,CAAS;AAAA,EACvB,EAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA,GAAU,OAAA;AAAA,EACV,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,eAAe,SAAA,EAAU;AAE/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,gBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,OAAO,GAAG,SAAS,CAAA;AAAA,MAC/D,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;;;;"}
1
+ {"version":3,"file":"StepText.js","sources":["../src/stepper/internal/StepText.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\n\nimport { Text, type TextProps } from \"../../text\";\nimport { makePrefixer } from \"../../utils\";\nimport stepTextCSS from \"./StepText.css\";\n\nexport interface StepTextProps extends TextProps<\"div\"> {\n purpose: \"label\" | \"description\";\n}\n\nconst withBaseName = makePrefixer(\"saltStepText\");\n\nexport function StepText({\n id,\n purpose,\n className,\n styleAs = \"label\",\n children,\n ...props\n}: StepTextProps) {\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-text\",\n css: stepTextCSS,\n window: targetWindow,\n });\n\n return (\n <Text\n id={id}\n className={clsx(withBaseName(), withBaseName(purpose), className)}\n {...props}\n >\n {children}\n </Text>\n );\n}\n"],"names":["stepTextCSS"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAEzC,SAAS,QAAA,CAAS;AAAA,EACvB,EAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA,GAAU,OAAA;AAAA,EACV,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,eAAe,SAAA,EAAU;AAE/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,gBAAA;AAAA,IACR,GAAA,EAAKA,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,OAAO,GAAG,SAAS,CAAA;AAAA,MAC/D,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;;;;"}
@@ -1,4 +1,4 @@
1
- var css_248z = ".saltSwitch {\n display: flex;\n width: fit-content;\n gap: var(--salt-spacing-100);\n position: relative;\n cursor: var(--salt-cursor-hover);\n color: var(--salt-content-primary-foreground);\n\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n}\n\n.saltSwitch-disabled {\n color: var(--salt-content-primary-foreground);\n\n cursor: var(--salt-cursor-disabled);\n opacity: 0.4;\n}\n\n.saltSwitch-track {\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor);\n --saltIcon-size: 100%;\n border-radius: var(--salt-palette-corner-weak, 0);\n display: flex;\n flex-shrink: 0;\n height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n width: calc((var(--salt-size-selectable) + var(--salt-spacing-25) + var(--salt-size-fixed-100)) * 2);\n align-items: center;\n color: var(--salt-selectable-foreground);\n background: var(--salt-container-primary-background);\n box-sizing: border-box;\n}\n\n.saltSwitch-label {\n padding-top: var(--salt-spacing-25);\n}\n\n/* Styles applied to the icon component if focused */\n.saltSwitch-input:focus-visible + .saltSwitch-track {\n outline-offset: var(--salt-focused-outlineOffset);\n outline: var(--salt-focused-outline);\n border-color: var(--salt-selectable-borderColor-hover);\n color: var(--salt-selectable-foreground-hover);\n}\n\n.saltSwitch:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-hover);\n color: var(--salt-selectable-foreground-hover);\n}\n\n.saltSwitch-checked .saltSwitch-track,\n.saltSwitch-checked:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selected);\n color: var(--salt-selectable-foreground-selected);\n}\n\n.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor);\n color: var(--salt-selectable-foreground);\n background: var(--salt-container-primary-background);\n}\n\n.saltSwitch-checked.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-checked.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selected);\n color: var(--salt-selectable-foreground-selected);\n}\n\n.saltSwitch-thumb {\n display: flex;\n aspect-ratio: 1;\n height: var(--salt-size-selectable);\n background: currentColor;\n margin: var(--salt-spacing-25);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor);\n box-sizing: border-box;\n border-radius: var(--salt-palette-corner-weaker, 0);\n}\n\n.saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb,\n.saltSwitch:hover .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-hover);\n transition: transform var(--salt-duration-perceptible) ease-in-out;\n}\n\n.saltSwitch-checked .saltSwitch-thumb,\n.saltSwitch-checked:hover .saltSwitch-thumb {\n background: transparent;\n border-color: var(--salt-selectable-borderColor-selected);\n transform: translateX(100%);\n}\n\n.saltSwitch-disabled .saltSwitch-thumb,\n.saltSwitch-disabled:hover .saltSwitch-thumb {\n border: 0;\n}\n\n/* Styles applied to input element */\n.saltSwitch-input {\n cursor: inherit;\n left: 0;\n margin: 0;\n opacity: 0;\n padding: 0;\n position: absolute;\n top: 0;\n z-index: var(--salt-zIndex-default);\n height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n width: calc((var(--salt-size-selectable) + var(--salt-spacing-25) + var(--salt-size-fixed-100)) * 2);\n}\n\n.saltSwitch-readOnly {\n cursor: var(--salt-cursor-text);\n}\n\n.saltSwitch-readOnly .saltSwitch-track,\n.saltSwitch-readOnly:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-readonly);\n color: var(--salt-content-primary-foreground);\n}\n\n.saltSwitch-readOnly:hover .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-readonly);\n}\n\n.saltSwitch-readOnly .saltSwitch-thumb,\n.saltSwitch-readOnly.saltSwitch-checked .saltSwitch-thumb {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);\n}\n\n.saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track,\n.saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-readonly);\n color: var(--salt-content-primary-foreground);\n}\n\n@media (prefers-reduced-motion) {\n .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb,\n .saltSwitch:hover .saltSwitch-thumb {\n transition: none;\n }\n}\n\n.salt-density-high .saltSwitch-thumb {\n border: 0;\n}\n\n.salt-density-high .saltSwitch-readOnly .saltSwitch-thumb {\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);\n}\n\n/* Styles applied when switch is inside a form field with label left or right, ensuring alignment with base / input height */\n.saltFormField-labelRight .saltSwitch,\n.saltFormField-labelLeft .saltSwitch {\n padding-top: var(--salt-spacing-50);\n padding-bottom: var(--salt-spacing-50);\n}\n";
1
+ var css_248z = ".saltSwitch {\n display: flex;\n width: fit-content;\n gap: var(--salt-spacing-100);\n position: relative;\n cursor: var(--salt-cursor-hover);\n color: var(--salt-content-primary-foreground);\n\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n}\n\n.saltSwitch-disabled {\n color: var(--salt-content-primary-foreground);\n\n cursor: var(--salt-cursor-disabled);\n opacity: 0.4;\n}\n\n.saltSwitch-track {\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor);\n --saltIcon-size: 100%;\n border-radius: var(--salt-palette-corner-weak, 0);\n display: flex;\n flex-shrink: 0;\n height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n width: calc((var(--salt-size-selectable) + var(--salt-spacing-25) + var(--salt-size-fixed-100)) * 2);\n align-items: center;\n color: var(--salt-selectable-foreground);\n background: var(--salt-container-primary-background);\n box-sizing: border-box;\n}\n\n.saltSwitch-label {\n padding-top: var(--salt-spacing-25);\n}\n\n/* Styles applied to the icon component if focused */\n.saltSwitch-input:focus-visible + .saltSwitch-track {\n outline-offset: var(--salt-focused-outlineOffset);\n outline: var(--salt-focused-outline);\n border-color: var(--salt-selectable-borderColor-hover);\n color: var(--salt-selectable-foreground-hover);\n}\n\n.saltSwitch:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-hover);\n color: var(--salt-selectable-foreground-hover);\n}\n\n.saltSwitch-checked .saltSwitch-track,\n.saltSwitch-checked:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selected);\n color: var(--salt-selectable-foreground-selected);\n}\n\n.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor);\n color: var(--salt-selectable-foreground);\n background: var(--salt-container-primary-background);\n}\n\n.saltSwitch-checked.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-checked.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selected);\n color: var(--salt-selectable-foreground-selected);\n}\n\n.saltSwitch-thumb {\n display: flex;\n aspect-ratio: 1;\n height: var(--salt-size-selectable);\n background: currentColor;\n margin: var(--salt-spacing-25);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor);\n box-sizing: border-box;\n border-radius: var(--salt-palette-corner-weaker, 0);\n}\n\n.saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb,\n.saltSwitch:hover .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-hover);\n transition: transform var(--salt-duration-perceptible) ease-in-out;\n}\n\n.saltSwitch-checked .saltSwitch-thumb,\n.saltSwitch-checked:hover .saltSwitch-thumb {\n background: transparent;\n border-color: var(--salt-selectable-borderColor-selected);\n transform: translateX(100%);\n}\n\n.saltSwitch-disabled .saltSwitch-thumb,\n.saltSwitch-disabled:hover .saltSwitch-thumb {\n border: 0;\n}\n\n/* Styles applied to input element */\n.saltSwitch-input {\n cursor: inherit;\n left: 0;\n margin: 0;\n opacity: 0;\n padding: 0;\n position: absolute;\n top: 0;\n z-index: var(--salt-zIndex-default);\n height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n width: calc((var(--salt-size-selectable) + var(--salt-spacing-25) + var(--salt-size-fixed-100)) * 2);\n}\n\n.saltSwitch-readOnly {\n cursor: var(--salt-cursor-text);\n}\n\n.saltSwitch-readOnly .saltSwitch-track,\n.saltSwitch-readOnly:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-readonly);\n color: var(--salt-content-primary-foreground);\n}\n\n.saltSwitch-readOnly:hover .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-readonly);\n}\n\n.saltSwitch-readOnly .saltSwitch-thumb,\n.saltSwitch-readOnly.saltSwitch-checked .saltSwitch-thumb {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);\n}\n\n.saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track,\n.saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb {\n border-color: var(--salt-selectable-borderColor-readonly);\n color: var(--salt-content-primary-foreground);\n}\n\n@media (prefers-reduced-motion) {\n .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb,\n .saltSwitch:hover .saltSwitch-thumb {\n transition: none;\n }\n}\n\n.salt-density-high .saltSwitch-thumb {\n border: 0;\n}\n\n.salt-density-high .saltSwitch-readOnly .saltSwitch-thumb {\n border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);\n}\n\n/* Styles applied when switch is inside a form field with label left or right, ensuring alignment with base / input height */\n.saltFormField-labelRight .saltSwitch,\n.saltFormField-labelLeft .saltSwitch {\n padding-top: var(--salt-spacing-50);\n padding-bottom: var(--salt-spacing-50);\n}\n";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=Switch.css.js.map
@@ -1,4 +1,4 @@
1
- var css_248z = "/* Table: Main css class */\n.saltTable {\n --table-header-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n --table-footer-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n --table-row-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n}\n\n.saltTable-primary {\n --table-background: var(--salt-container-primary-background);\n}\n\n.saltTable-secondary {\n --table-background: var(--salt-container-secondary-background);\n}\n\n.saltTable-tertiary {\n --table-background: var(--salt-container-tertiary-background);\n}\n\n.saltTable-divider-primary {\n --table-divider-color: var(--salt-separable-primary-borderColor);\n}\n\n.saltTable-divider-secondary {\n --table-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\n.saltTable-divider-tertiary {\n --table-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\n/* Zebra styling */\ntable.saltTable-zebra-tertiary tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable-primary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable-secondary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-primary-background);\n}\n\ntable.saltTable-tertiary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-primary-background);\n}\n\ntable.saltTable {\n border-spacing: 0;\n border-radius: var(--salt-palette-corner, 0);\n border-collapse: collapse;\n color: var(--salt-content-primary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n width: 100%;\n}\n\n/* TR */\ntable.saltTable tr {\n background: var(--table-background);\n}\n\ntable.saltTable tbody tr {\n height: var(--table-row-height);\n min-height: var(--table-row-height);\n}\n\ntable.saltTable tbody tr:not(:last-child) {\n border-bottom: var(--salt-borderStyle-solid) var(--table-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable.saltTable-divider-none tbody tr {\n --table-divider-color: transparent;\n}\n\n/* THead */\ntable.saltTable thead {\n border-start-start-radius: var(--salt-palette-corner);\n border-start-end-radius: var(--salt-palette-corner);\n color: var(--salt-content-secondary-foreground);\n height: var(--table-header-height);\n min-height: var(--table-header-height);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-strong);\n line-height: var(--salt-text-label-lineHeight);\n}\n\ntable.saltTable thead.saltTable-thead-sticky {\n position: sticky;\n top: 0;\n}\n\ntable.saltTable thead.saltTable-thead-primary tr {\n background: var(--salt-container-primary-background);\n}\n\ntable.saltTable thead.saltTable-thead-secondary tr {\n background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable thead.saltTable-thead-tertiary tr {\n background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable thead.saltTable-thead tr {\n border-bottom: var(--salt-borderStyle-solid) var(--table-header-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable thead.saltTable-thead-divider-primary {\n --table-header-divider-color: var(--salt-separable-primary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-secondary {\n --table-header-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-tertiary {\n --table-header-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-none {\n --table-header-divider-color: transparent;\n}\n\n/* TFoot */\ntable.saltTable tfoot {\n border-end-start-radius: var(--salt-palette-corner);\n border-end-end-radius: var(--salt-palette-corner);\n color: var(--salt-content-primary-foreground);\n height: var(--table-footer-height);\n min-height: var(--table-footer-height);\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-sticky {\n position: sticky;\n bottom: 0;\n}\n\ntable.saltTable tfoot.saltTable-tfoot tr {\n border-top: var(--salt-borderStyle-solid) var(--table-footer-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-primary tr {\n background: var(--salt-container-primary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-secondary tr {\n background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-tertiary tr {\n background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-primary tr {\n --table-footer-divider-color: var(--salt-separable-primary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-secondary tr {\n --table-footer-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-tertiary tr {\n --table-footer-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-none tr {\n --table-footer-divider-color: transparent;\n}\n\n/* TH */\ntable.saltTable th {\n padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);\n padding-top: calc(var(--salt-spacing-75) + var(--salt-spacing-50) + var(--salt-size-fixed-100));\n position: relative;\n text-align: start;\n vertical-align: top;\n font-weight: inherit;\n}\n\ntable.saltTable th.saltTable-th-align-left {\n text-align: start;\n}\n\ntable.saltTable th.saltTable-th-align-right {\n text-align: end;\n}\n\ntable.saltTable tbody th[scope=\"row\"] {\n font-weight: var(--salt-text-fontWeight-strong);\n line-height: var(--salt-text-lineHeight);\n}\n\ntable.saltTable th + th::before {\n background: var(--salt-separable-tertiary-borderColor);\n content: \"\";\n position: absolute;\n z-index: 1;\n display: block;\n width: var(--salt-size-fixed-100);\n height: calc(100% - var(--salt-spacing-200));\n left: 0;\n top: var(--salt-spacing-100);\n}\n\n/* TD */\ntable.saltTable td {\n height: 100%;\n vertical-align: top;\n padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);\n}\n\ntable.saltTable td.saltTable-td-align-left {\n text-align: start;\n}\n\ntable.saltTable td.saltTable-td-align-right {\n text-align: end;\n}\n\n.saltTable-container {\n width: 100%;\n overflow: auto;\n}\n";
1
+ var css_248z = "/* Table: Main css class */\n.saltTable {\n --table-header-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n --table-footer-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n --table-row-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));\n}\n\n.saltTable-primary {\n --table-background: var(--salt-container-primary-background);\n}\n\n.saltTable-secondary {\n --table-background: var(--salt-container-secondary-background);\n}\n\n.saltTable-tertiary {\n --table-background: var(--salt-container-tertiary-background);\n}\n\n.saltTable-divider-primary {\n --table-divider-color: var(--salt-separable-primary-borderColor);\n}\n\n.saltTable-divider-secondary {\n --table-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\n.saltTable-divider-tertiary {\n --table-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\n/* Zebra styling */\ntable.saltTable-zebra-tertiary tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable-primary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable-secondary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-primary-background);\n}\n\ntable.saltTable-tertiary.saltTable-zebra tbody tr:nth-of-type(odd) {\n --table-background: var(--salt-container-primary-background);\n}\n\ntable.saltTable {\n border-spacing: 0;\n border-radius: var(--salt-palette-corner, 0);\n border-collapse: collapse;\n color: var(--salt-content-primary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n width: 100%;\n}\n\n/* TR */\ntable.saltTable tr {\n background: var(--table-background);\n}\n\ntable.saltTable tbody tr {\n height: var(--table-row-height);\n min-height: var(--table-row-height);\n}\n\ntable.saltTable tbody tr:not(:last-child) {\n border-bottom: var(--salt-borderStyle-solid) var(--table-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable.saltTable-divider-none tbody tr {\n --table-divider-color: transparent;\n}\n\n/* THead */\ntable.saltTable thead {\n border-start-start-radius: var(--salt-palette-corner);\n border-start-end-radius: var(--salt-palette-corner);\n color: var(--salt-content-secondary-foreground);\n height: var(--table-header-height);\n min-height: var(--table-header-height);\n font-size: var(--salt-text-label-fontSize);\n font-weight: var(--salt-text-label-fontWeight-bolder);\n line-height: var(--salt-text-label-lineHeight);\n}\n\ntable.saltTable thead.saltTable-thead-sticky {\n position: sticky;\n top: 0;\n}\n\ntable.saltTable thead.saltTable-thead-primary tr {\n background: var(--salt-container-primary-background);\n}\n\ntable.saltTable thead.saltTable-thead-secondary tr {\n background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable thead.saltTable-thead-tertiary tr {\n background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable thead.saltTable-thead tr {\n border-bottom: var(--salt-borderStyle-solid) var(--table-header-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable thead.saltTable-thead-divider-primary {\n --table-header-divider-color: var(--salt-separable-primary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-secondary {\n --table-header-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-tertiary {\n --table-header-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\ntable.saltTable thead.saltTable-thead-divider-none {\n --table-header-divider-color: transparent;\n}\n\n/* TFoot */\ntable.saltTable tfoot {\n border-end-start-radius: var(--salt-palette-corner);\n border-end-end-radius: var(--salt-palette-corner);\n color: var(--salt-content-primary-foreground);\n height: var(--table-footer-height);\n min-height: var(--table-footer-height);\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n font-weight: var(--salt-text-fontWeight-bolder);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-sticky {\n position: sticky;\n bottom: 0;\n}\n\ntable.saltTable tfoot.saltTable-tfoot tr {\n border-top: var(--salt-borderStyle-solid) var(--table-footer-divider-color) var(--salt-size-fixed-100);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-primary tr {\n background: var(--salt-container-primary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-secondary tr {\n background: var(--salt-container-secondary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-tertiary tr {\n background: var(--salt-container-tertiary-background);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-primary tr {\n --table-footer-divider-color: var(--salt-separable-primary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-secondary tr {\n --table-footer-divider-color: var(--salt-separable-secondary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-tertiary tr {\n --table-footer-divider-color: var(--salt-separable-tertiary-borderColor);\n}\n\ntable.saltTable tfoot.saltTable-tfoot-divider-none tr {\n --table-footer-divider-color: transparent;\n}\n\n/* TH */\ntable.saltTable th {\n padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);\n padding-top: calc(var(--salt-spacing-75) + var(--salt-spacing-50) + var(--salt-size-fixed-100));\n position: relative;\n text-align: start;\n vertical-align: top;\n font-weight: inherit;\n}\n\ntable.saltTable th.saltTable-th-align-left {\n text-align: start;\n}\n\ntable.saltTable th.saltTable-th-align-right {\n text-align: end;\n}\n\ntable.saltTable tbody th[scope=\"row\"] {\n font-weight: var(--salt-text-fontWeight-bolder);\n line-height: var(--salt-text-lineHeight);\n}\n\ntable.saltTable th + th::before {\n background: var(--salt-separable-tertiary-borderColor);\n content: \"\";\n position: absolute;\n z-index: 1;\n display: block;\n width: var(--salt-size-fixed-100);\n height: calc(100% - var(--salt-spacing-200));\n left: 0;\n top: var(--salt-spacing-100);\n}\n\n/* TD */\ntable.saltTable td {\n height: 100%;\n vertical-align: top;\n padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);\n}\n\ntable.saltTable td.saltTable-td-align-left {\n text-align: start;\n}\n\ntable.saltTable td.saltTable-td-align-right {\n text-align: end;\n}\n\n.saltTable-container {\n width: 100%;\n overflow: auto;\n}\n";
2
2
 
3
3
  export { css_248z as default };
4
4
  //# sourceMappingURL=Table.css.js.map
@@ -72,7 +72,7 @@ const Tabs = forwardRef(
72
72
  removalVersion,
73
73
  getRemovedItems
74
74
  } = useCollection({ targetWindow, wrap: true });
75
- const activeTab = useRef();
75
+ const activeTab = useRef(void 0);
76
76
  const [menuOpen, setMenuOpen] = useState(false);
77
77
  const [selected, setSelectedState] = useControlled({
78
78
  controlled: value,
@@ -1 +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":["Tabs","tabsCss","value"],"mappings":"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"}
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\"> | 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":["Tabs","tabsCss","value"],"mappings":"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"}