@salt-ds/core 1.47.5 → 1.49.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 (510) hide show
  1. package/CHANGELOG.md +59 -0
  2. package/css/salt-core.css +178 -4
  3. package/dist-cjs/accordion/Accordion.js.map +1 -1
  4. package/dist-cjs/accordion/AccordionContext.js.map +1 -1
  5. package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
  6. package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
  7. package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
  8. package/dist-cjs/aria-announcer/AriaAnnounce.js.map +1 -1
  9. package/dist-cjs/aria-announcer/AriaAnnouncerContext.js.map +1 -1
  10. package/dist-cjs/aria-announcer/AriaAnnouncerProvider.js.map +1 -1
  11. package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
  12. package/dist-cjs/avatar/Avatar.js.map +1 -1
  13. package/dist-cjs/avatar/useAvatarImage.js +46 -18
  14. package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
  15. package/dist-cjs/avatar/useIsHydrated.js +18 -0
  16. package/dist-cjs/avatar/useIsHydrated.js.map +1 -0
  17. package/dist-cjs/badge/Badge.js.map +1 -1
  18. package/dist-cjs/banner/Banner.css.js +1 -1
  19. package/dist-cjs/banner/Banner.js.map +1 -1
  20. package/dist-cjs/banner/BannerActions.js.map +1 -1
  21. package/dist-cjs/banner/BannerContent.js.map +1 -1
  22. package/dist-cjs/border-item/BorderItem.js.map +1 -1
  23. package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
  24. package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -1
  25. package/dist-cjs/breakpoints/Breakpoints.js.map +1 -1
  26. package/dist-cjs/button/Button.js.map +1 -1
  27. package/dist-cjs/button/useButton.js.map +1 -1
  28. package/dist-cjs/card/Card.js.map +1 -1
  29. package/dist-cjs/checkbox/Checkbox.css.js +1 -1
  30. package/dist-cjs/checkbox/Checkbox.js.map +1 -1
  31. package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
  32. package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
  33. package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  34. package/dist-cjs/checkbox/internal/useCheckboxGroup.js.map +1 -1
  35. package/dist-cjs/collapsible/Collapsible.js +52 -0
  36. package/dist-cjs/collapsible/Collapsible.js.map +1 -0
  37. package/dist-cjs/collapsible/CollapsibleContext.js +29 -0
  38. package/dist-cjs/collapsible/CollapsibleContext.js.map +1 -0
  39. package/dist-cjs/collapsible/CollapsiblePanel.css.js +6 -0
  40. package/dist-cjs/collapsible/CollapsiblePanel.css.js.map +1 -0
  41. package/dist-cjs/collapsible/CollapsiblePanel.js +47 -0
  42. package/dist-cjs/collapsible/CollapsiblePanel.js.map +1 -0
  43. package/dist-cjs/collapsible/CollapsibleTrigger.js +40 -0
  44. package/dist-cjs/collapsible/CollapsibleTrigger.js.map +1 -0
  45. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  46. package/dist-cjs/combo-box/useComboBox.js.map +1 -1
  47. package/dist-cjs/dialog/Dialog.js.map +1 -1
  48. package/dist-cjs/dialog/DialogActions.js.map +1 -1
  49. package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
  50. package/dist-cjs/dialog/DialogContent.css.js +1 -1
  51. package/dist-cjs/dialog/DialogContent.js.map +1 -1
  52. package/dist-cjs/dialog/DialogContext.js.map +1 -1
  53. package/dist-cjs/dialog/DialogHeader.js.map +1 -1
  54. package/dist-cjs/divider/Divider.js.map +1 -1
  55. package/dist-cjs/drawer/Drawer.js.map +1 -1
  56. package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
  57. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  58. package/dist-cjs/file-drop-zone/FileDropZone.css.js +1 -1
  59. package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
  60. package/dist-cjs/file-drop-zone/FileDropZoneIcon.js.map +1 -1
  61. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +1 -1
  62. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  63. package/dist-cjs/file-drop-zone/internal/utils.js.map +1 -1
  64. package/dist-cjs/flex-item/FlexItem.js.map +1 -1
  65. package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
  66. package/dist-cjs/flex-layout/parseSpacing.js.map +1 -1
  67. package/dist-cjs/flow-layout/FlowLayout.js.map +1 -1
  68. package/dist-cjs/form-field/FormField.js.map +1 -1
  69. package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
  70. package/dist-cjs/form-field/FormFieldLabel.css.js +1 -1
  71. package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
  72. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  73. package/dist-cjs/form-field-context/useFormFieldProps.js.map +1 -1
  74. package/dist-cjs/grid-item/GridItem.js.map +1 -1
  75. package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
  76. package/dist-cjs/index.js +21 -0
  77. package/dist-cjs/index.js.map +1 -1
  78. package/dist-cjs/input/Input.js.map +1 -1
  79. package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
  80. package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
  81. package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
  82. package/dist-cjs/interactable-card/useInteractableCard.js.map +1 -1
  83. package/dist-cjs/link/Link.js.map +1 -1
  84. package/dist-cjs/link/LinkAction.js.map +1 -1
  85. package/dist-cjs/link-card/LinkCard.js.map +1 -1
  86. package/dist-cjs/list-box/ListBox.js.map +1 -1
  87. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  88. package/dist-cjs/list-control/ListControlState.js.map +1 -1
  89. package/dist-cjs/menu/Menu.js.map +1 -1
  90. package/dist-cjs/menu/MenuBase.js.map +1 -1
  91. package/dist-cjs/menu/MenuContext.js.map +1 -1
  92. package/dist-cjs/menu/MenuGroup.js.map +1 -1
  93. package/dist-cjs/menu/MenuItem.js.map +1 -1
  94. package/dist-cjs/menu/MenuPanel.js.map +1 -1
  95. package/dist-cjs/menu/MenuPanelBase.js.map +1 -1
  96. package/dist-cjs/menu/MenuPanelContext.js.map +1 -1
  97. package/dist-cjs/menu/MenuTrigger.js.map +1 -1
  98. package/dist-cjs/menu/MenuTriggerContext.js.map +1 -1
  99. package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
  100. package/dist-cjs/navigation-item/ExpansionIcon.js.map +1 -1
  101. package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
  102. package/dist-cjs/navigation-item/NavigationItemAction.js.map +1 -1
  103. package/dist-cjs/option/Option.js.map +1 -1
  104. package/dist-cjs/option/OptionGroup.js.map +1 -1
  105. package/dist-cjs/option/OptionList.js.map +1 -1
  106. package/dist-cjs/option/OptionListBase.js.map +1 -1
  107. package/dist-cjs/overlay/Overlay.js.map +1 -1
  108. package/dist-cjs/overlay/OverlayContext.js.map +1 -1
  109. package/dist-cjs/overlay/OverlayHeader.js.map +1 -1
  110. package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
  111. package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
  112. package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
  113. package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
  114. package/dist-cjs/pagination/CompactInput.js.map +1 -1
  115. package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
  116. package/dist-cjs/pagination/GoToInput.js.map +1 -1
  117. package/dist-cjs/pagination/PageButton.js.map +1 -1
  118. package/dist-cjs/pagination/PageRanges.js.map +1 -1
  119. package/dist-cjs/pagination/Pagination.js.map +1 -1
  120. package/dist-cjs/pagination/PaginationContext.js.map +1 -1
  121. package/dist-cjs/pagination/Paginator.js.map +1 -1
  122. package/dist-cjs/pagination/usePagination.js.map +1 -1
  123. package/dist-cjs/pagination/usePaginationContext.js.map +1 -1
  124. package/dist-cjs/panel/Panel.js.map +1 -1
  125. package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
  126. package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
  127. package/dist-cjs/pill/Pill.js.map +1 -1
  128. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  129. package/dist-cjs/pill-input/useTruncatePills.js.map +1 -1
  130. package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
  131. package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
  132. package/dist-cjs/radio-button/RadioButton.css.js +1 -1
  133. package/dist-cjs/radio-button/RadioButton.js.map +1 -1
  134. package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
  135. package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
  136. package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
  137. package/dist-cjs/radio-button/internal/useRadioGroup.js.map +1 -1
  138. package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
  139. package/dist-cjs/scrim/Scrim.js.map +1 -1
  140. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
  141. package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
  142. package/dist-cjs/skip-link/SkipLink.js.map +1 -1
  143. package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  144. package/dist-cjs/slider/RangeSlider.js.map +1 -1
  145. package/dist-cjs/slider/Slider.js.map +1 -1
  146. package/dist-cjs/slider/internal/SliderThumb.js.map +1 -1
  147. package/dist-cjs/slider/internal/SliderTooltip.js.map +1 -1
  148. package/dist-cjs/slider/internal/SliderTrack.js.map +1 -1
  149. package/dist-cjs/slider/internal/useRangeSliderThumb.js.map +1 -1
  150. package/dist-cjs/slider/internal/useSliderThumb.js.map +1 -1
  151. package/dist-cjs/slider/internal/utils.js.map +1 -1
  152. package/dist-cjs/spinner/Spinner.js.map +1 -1
  153. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  154. package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
  155. package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
  156. package/dist-cjs/status-adornment/ErrorAdornment.js.map +1 -1
  157. package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
  158. package/dist-cjs/status-adornment/SuccessAdornment.js.map +1 -1
  159. package/dist-cjs/status-adornment/WarningAdornment.js.map +1 -1
  160. package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
  161. package/dist-cjs/status-indicator/ValidationStatus.js.map +1 -1
  162. package/dist-cjs/stepper/Step.js.map +1 -1
  163. package/dist-cjs/stepper/Stepper.js.map +1 -1
  164. package/dist-cjs/stepper/internal/StepConnector.js.map +1 -1
  165. package/dist-cjs/stepper/internal/StepExpandTrigger.js.map +1 -1
  166. package/dist-cjs/stepper/internal/StepIcon.js.map +1 -1
  167. package/dist-cjs/stepper/internal/StepScreenReaderOnly.js.map +1 -1
  168. package/dist-cjs/stepper/internal/StepText.js.map +1 -1
  169. package/dist-cjs/stepper/internal/StepperProvider.js.map +1 -1
  170. package/dist-cjs/switch/Switch.css.js +1 -1
  171. package/dist-cjs/switch/Switch.js.map +1 -1
  172. package/dist-cjs/tag/Tag.js.map +1 -1
  173. package/dist-cjs/text/Code.js.map +1 -1
  174. package/dist-cjs/text/Display.js.map +1 -1
  175. package/dist-cjs/text/Headings.js.map +1 -1
  176. package/dist-cjs/text/Label.js.map +1 -1
  177. package/dist-cjs/text/Text.js.map +1 -1
  178. package/dist-cjs/text/TextAction.js.map +1 -1
  179. package/dist-cjs/text/TextNotation.js.map +1 -1
  180. package/dist-cjs/theme/Accent.js.map +1 -1
  181. package/dist-cjs/theme/ActionFont.js.map +1 -1
  182. package/dist-cjs/theme/Corner.js.map +1 -1
  183. package/dist-cjs/theme/Density.js.map +1 -1
  184. package/dist-cjs/theme/HeadingFont.js.map +1 -1
  185. package/dist-cjs/theme/Mode.js.map +1 -1
  186. package/dist-cjs/theme/Theme.js.map +1 -1
  187. package/dist-cjs/toast/Toast.js.map +1 -1
  188. package/dist-cjs/toast/ToastContent.js.map +1 -1
  189. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  190. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  191. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  192. package/dist-cjs/tooltip/Tooltip.js.map +1 -1
  193. package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
  194. package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
  195. package/dist-cjs/tooltip/useTooltip.js.map +1 -1
  196. package/dist-cjs/utils/capitalize.js.map +1 -1
  197. package/dist-cjs/utils/createChainedFunction.js.map +1 -1
  198. package/dist-cjs/utils/createContext.js.map +1 -1
  199. package/dist-cjs/utils/debounce.js.map +1 -1
  200. package/dist-cjs/utils/getRefFromChildren.js.map +1 -1
  201. package/dist-cjs/utils/makePrefixer.js.map +1 -1
  202. package/dist-cjs/utils/marginMiddleware.js.map +1 -1
  203. package/dist-cjs/utils/mergeProps.js.map +1 -1
  204. package/dist-cjs/utils/ownerDocument.js.map +1 -1
  205. package/dist-cjs/utils/ownerWindow.js.map +1 -1
  206. package/dist-cjs/utils/renderProps.js.map +1 -1
  207. package/dist-cjs/utils/setRef.js.map +1 -1
  208. package/dist-cjs/utils/useControlled.js.map +1 -1
  209. package/dist-cjs/utils/useEventCallback.js.map +1 -1
  210. package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  211. package/dist-cjs/utils/useForkRef.js.map +1 -1
  212. package/dist-cjs/utils/useId.js.map +1 -1
  213. package/dist-cjs/utils/useIsFocusVisible.js.map +1 -1
  214. package/dist-cjs/utils/useIsomorphicLayoutEffect.js.map +1 -1
  215. package/dist-cjs/utils/usePreventScroll.js.map +1 -1
  216. package/dist-cjs/utils/usePrevious.js.map +1 -1
  217. package/dist-cjs/utils/useResizeObserver.js.map +1 -1
  218. package/dist-cjs/utils/useResponsiveProp.js.map +1 -1
  219. package/dist-cjs/utils/useValueEffect.js.map +1 -1
  220. package/dist-cjs/vertical-navigation/SubMenuContext.js +39 -0
  221. package/dist-cjs/vertical-navigation/SubMenuContext.js.map +1 -0
  222. package/dist-cjs/vertical-navigation/VerticalNavigation.css.js +6 -0
  223. package/dist-cjs/vertical-navigation/VerticalNavigation.css.js.map +1 -0
  224. package/dist-cjs/vertical-navigation/VerticalNavigation.js +38 -0
  225. package/dist-cjs/vertical-navigation/VerticalNavigation.js.map +1 -0
  226. package/dist-cjs/vertical-navigation/VerticalNavigationItem.js +53 -0
  227. package/dist-cjs/vertical-navigation/VerticalNavigationItem.js.map +1 -0
  228. package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.css.js +6 -0
  229. package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.css.js.map +1 -0
  230. package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.js +88 -0
  231. package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.js.map +1 -0
  232. package/dist-cjs/vertical-navigation/VerticalNavigationItemExpansionIcon.js +35 -0
  233. package/dist-cjs/vertical-navigation/VerticalNavigationItemExpansionIcon.js.map +1 -0
  234. package/dist-cjs/vertical-navigation/VerticalNavigationItemLabel.css.js +6 -0
  235. package/dist-cjs/vertical-navigation/VerticalNavigationItemLabel.css.js.map +1 -0
  236. package/dist-cjs/vertical-navigation/VerticalNavigationItemLabel.js +28 -0
  237. package/dist-cjs/vertical-navigation/VerticalNavigationItemLabel.js.map +1 -0
  238. package/dist-cjs/vertical-navigation/VerticalNavigationItemTrigger.css.js +6 -0
  239. package/dist-cjs/vertical-navigation/VerticalNavigationItemTrigger.css.js.map +1 -0
  240. package/dist-cjs/vertical-navigation/VerticalNavigationItemTrigger.js +74 -0
  241. package/dist-cjs/vertical-navigation/VerticalNavigationItemTrigger.js.map +1 -0
  242. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.css.js +6 -0
  243. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.css.js.map +1 -0
  244. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.js +39 -0
  245. package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.js.map +1 -0
  246. package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
  247. package/dist-es/accordion/Accordion.js.map +1 -1
  248. package/dist-es/accordion/AccordionContext.js.map +1 -1
  249. package/dist-es/accordion/AccordionGroup.js.map +1 -1
  250. package/dist-es/accordion/AccordionHeader.js.map +1 -1
  251. package/dist-es/accordion/AccordionPanel.js.map +1 -1
  252. package/dist-es/aria-announcer/AriaAnnounce.js.map +1 -1
  253. package/dist-es/aria-announcer/AriaAnnouncerContext.js.map +1 -1
  254. package/dist-es/aria-announcer/AriaAnnouncerProvider.js.map +1 -1
  255. package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
  256. package/dist-es/avatar/Avatar.js.map +1 -1
  257. package/dist-es/avatar/useAvatarImage.js +47 -19
  258. package/dist-es/avatar/useAvatarImage.js.map +1 -1
  259. package/dist-es/avatar/useIsHydrated.js +16 -0
  260. package/dist-es/avatar/useIsHydrated.js.map +1 -0
  261. package/dist-es/badge/Badge.js.map +1 -1
  262. package/dist-es/banner/Banner.css.js +1 -1
  263. package/dist-es/banner/Banner.js.map +1 -1
  264. package/dist-es/banner/BannerActions.js.map +1 -1
  265. package/dist-es/banner/BannerContent.js.map +1 -1
  266. package/dist-es/border-item/BorderItem.js.map +1 -1
  267. package/dist-es/border-layout/BorderLayout.js.map +1 -1
  268. package/dist-es/breakpoints/BreakpointProvider.js.map +1 -1
  269. package/dist-es/breakpoints/Breakpoints.js.map +1 -1
  270. package/dist-es/button/Button.js.map +1 -1
  271. package/dist-es/button/useButton.js.map +1 -1
  272. package/dist-es/card/Card.js.map +1 -1
  273. package/dist-es/checkbox/Checkbox.css.js +1 -1
  274. package/dist-es/checkbox/Checkbox.js.map +1 -1
  275. package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
  276. package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
  277. package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  278. package/dist-es/checkbox/internal/useCheckboxGroup.js.map +1 -1
  279. package/dist-es/collapsible/Collapsible.js +50 -0
  280. package/dist-es/collapsible/Collapsible.js.map +1 -0
  281. package/dist-es/collapsible/CollapsibleContext.js +26 -0
  282. package/dist-es/collapsible/CollapsibleContext.js.map +1 -0
  283. package/dist-es/collapsible/CollapsiblePanel.css.js +4 -0
  284. package/dist-es/collapsible/CollapsiblePanel.css.js.map +1 -0
  285. package/dist-es/collapsible/CollapsiblePanel.js +45 -0
  286. package/dist-es/collapsible/CollapsiblePanel.js.map +1 -0
  287. package/dist-es/collapsible/CollapsibleTrigger.js +38 -0
  288. package/dist-es/collapsible/CollapsibleTrigger.js.map +1 -0
  289. package/dist-es/combo-box/ComboBox.js.map +1 -1
  290. package/dist-es/combo-box/useComboBox.js.map +1 -1
  291. package/dist-es/dialog/Dialog.js.map +1 -1
  292. package/dist-es/dialog/DialogActions.js.map +1 -1
  293. package/dist-es/dialog/DialogCloseButton.js.map +1 -1
  294. package/dist-es/dialog/DialogContent.css.js +1 -1
  295. package/dist-es/dialog/DialogContent.js.map +1 -1
  296. package/dist-es/dialog/DialogContext.js.map +1 -1
  297. package/dist-es/dialog/DialogHeader.js.map +1 -1
  298. package/dist-es/divider/Divider.js.map +1 -1
  299. package/dist-es/drawer/Drawer.js.map +1 -1
  300. package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
  301. package/dist-es/dropdown/Dropdown.js.map +1 -1
  302. package/dist-es/file-drop-zone/FileDropZone.css.js +1 -1
  303. package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
  304. package/dist-es/file-drop-zone/FileDropZoneIcon.js.map +1 -1
  305. package/dist-es/file-drop-zone/FileDropZoneTrigger.js +1 -1
  306. package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  307. package/dist-es/file-drop-zone/internal/utils.js.map +1 -1
  308. package/dist-es/flex-item/FlexItem.js.map +1 -1
  309. package/dist-es/flex-layout/FlexLayout.js.map +1 -1
  310. package/dist-es/flex-layout/parseSpacing.js.map +1 -1
  311. package/dist-es/flow-layout/FlowLayout.js.map +1 -1
  312. package/dist-es/form-field/FormField.js.map +1 -1
  313. package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
  314. package/dist-es/form-field/FormFieldLabel.css.js +1 -1
  315. package/dist-es/form-field/FormFieldLabel.js.map +1 -1
  316. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  317. package/dist-es/form-field-context/useFormFieldProps.js.map +1 -1
  318. package/dist-es/grid-item/GridItem.js.map +1 -1
  319. package/dist-es/grid-layout/GridLayout.js.map +1 -1
  320. package/dist-es/index.js +10 -0
  321. package/dist-es/index.js.map +1 -1
  322. package/dist-es/input/Input.js.map +1 -1
  323. package/dist-es/interactable-card/InteractableCard.js.map +1 -1
  324. package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
  325. package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
  326. package/dist-es/interactable-card/useInteractableCard.js.map +1 -1
  327. package/dist-es/link/Link.js.map +1 -1
  328. package/dist-es/link/LinkAction.js.map +1 -1
  329. package/dist-es/link-card/LinkCard.js.map +1 -1
  330. package/dist-es/list-box/ListBox.js.map +1 -1
  331. package/dist-es/list-control/ListControlContext.js.map +1 -1
  332. package/dist-es/list-control/ListControlState.js.map +1 -1
  333. package/dist-es/menu/Menu.js.map +1 -1
  334. package/dist-es/menu/MenuBase.js.map +1 -1
  335. package/dist-es/menu/MenuContext.js.map +1 -1
  336. package/dist-es/menu/MenuGroup.js.map +1 -1
  337. package/dist-es/menu/MenuItem.js.map +1 -1
  338. package/dist-es/menu/MenuPanel.js.map +1 -1
  339. package/dist-es/menu/MenuPanelBase.js.map +1 -1
  340. package/dist-es/menu/MenuPanelContext.js.map +1 -1
  341. package/dist-es/menu/MenuTrigger.js.map +1 -1
  342. package/dist-es/menu/MenuTriggerContext.js.map +1 -1
  343. package/dist-es/multiline-input/MultilineInput.js.map +1 -1
  344. package/dist-es/navigation-item/ExpansionIcon.js.map +1 -1
  345. package/dist-es/navigation-item/NavigationItem.js.map +1 -1
  346. package/dist-es/navigation-item/NavigationItemAction.js.map +1 -1
  347. package/dist-es/option/Option.js.map +1 -1
  348. package/dist-es/option/OptionGroup.js.map +1 -1
  349. package/dist-es/option/OptionList.js.map +1 -1
  350. package/dist-es/option/OptionListBase.js.map +1 -1
  351. package/dist-es/overlay/Overlay.js.map +1 -1
  352. package/dist-es/overlay/OverlayContext.js.map +1 -1
  353. package/dist-es/overlay/OverlayHeader.js.map +1 -1
  354. package/dist-es/overlay/OverlayPanel.js.map +1 -1
  355. package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
  356. package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
  357. package/dist-es/overlay/OverlayTrigger.js.map +1 -1
  358. package/dist-es/pagination/CompactInput.js.map +1 -1
  359. package/dist-es/pagination/CompactPaginator.js.map +1 -1
  360. package/dist-es/pagination/GoToInput.js.map +1 -1
  361. package/dist-es/pagination/PageButton.js.map +1 -1
  362. package/dist-es/pagination/PageRanges.js.map +1 -1
  363. package/dist-es/pagination/Pagination.js.map +1 -1
  364. package/dist-es/pagination/PaginationContext.js.map +1 -1
  365. package/dist-es/pagination/Paginator.js.map +1 -1
  366. package/dist-es/pagination/usePagination.js.map +1 -1
  367. package/dist-es/pagination/usePaginationContext.js.map +1 -1
  368. package/dist-es/panel/Panel.js.map +1 -1
  369. package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
  370. package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
  371. package/dist-es/pill/Pill.js.map +1 -1
  372. package/dist-es/pill-input/PillInput.js.map +1 -1
  373. package/dist-es/pill-input/useTruncatePills.js.map +1 -1
  374. package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
  375. package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
  376. package/dist-es/radio-button/RadioButton.css.js +1 -1
  377. package/dist-es/radio-button/RadioButton.js.map +1 -1
  378. package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
  379. package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
  380. package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
  381. package/dist-es/radio-button/internal/useRadioGroup.js.map +1 -1
  382. package/dist-es/salt-provider/SaltProvider.js.map +1 -1
  383. package/dist-es/scrim/Scrim.js.map +1 -1
  384. package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
  385. package/dist-es/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
  386. package/dist-es/skip-link/SkipLink.js.map +1 -1
  387. package/dist-es/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
  388. package/dist-es/slider/RangeSlider.js.map +1 -1
  389. package/dist-es/slider/Slider.js.map +1 -1
  390. package/dist-es/slider/internal/SliderThumb.js.map +1 -1
  391. package/dist-es/slider/internal/SliderTooltip.js.map +1 -1
  392. package/dist-es/slider/internal/SliderTrack.js.map +1 -1
  393. package/dist-es/slider/internal/useRangeSliderThumb.js.map +1 -1
  394. package/dist-es/slider/internal/useSliderThumb.js.map +1 -1
  395. package/dist-es/slider/internal/utils.js.map +1 -1
  396. package/dist-es/spinner/Spinner.js.map +1 -1
  397. package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  398. package/dist-es/split-layout/SplitLayout.js.map +1 -1
  399. package/dist-es/stack-layout/StackLayout.js.map +1 -1
  400. package/dist-es/status-adornment/ErrorAdornment.js.map +1 -1
  401. package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
  402. package/dist-es/status-adornment/SuccessAdornment.js.map +1 -1
  403. package/dist-es/status-adornment/WarningAdornment.js.map +1 -1
  404. package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
  405. package/dist-es/status-indicator/ValidationStatus.js.map +1 -1
  406. package/dist-es/stepper/Step.js.map +1 -1
  407. package/dist-es/stepper/Stepper.js.map +1 -1
  408. package/dist-es/stepper/internal/StepConnector.js.map +1 -1
  409. package/dist-es/stepper/internal/StepExpandTrigger.js.map +1 -1
  410. package/dist-es/stepper/internal/StepIcon.js.map +1 -1
  411. package/dist-es/stepper/internal/StepScreenReaderOnly.js.map +1 -1
  412. package/dist-es/stepper/internal/StepText.js.map +1 -1
  413. package/dist-es/stepper/internal/StepperProvider.js.map +1 -1
  414. package/dist-es/switch/Switch.css.js +1 -1
  415. package/dist-es/switch/Switch.js.map +1 -1
  416. package/dist-es/tag/Tag.js.map +1 -1
  417. package/dist-es/text/Code.js.map +1 -1
  418. package/dist-es/text/Display.js.map +1 -1
  419. package/dist-es/text/Headings.js.map +1 -1
  420. package/dist-es/text/Label.js.map +1 -1
  421. package/dist-es/text/Text.js.map +1 -1
  422. package/dist-es/text/TextAction.js.map +1 -1
  423. package/dist-es/text/TextNotation.js.map +1 -1
  424. package/dist-es/theme/Accent.js.map +1 -1
  425. package/dist-es/theme/ActionFont.js.map +1 -1
  426. package/dist-es/theme/Corner.js.map +1 -1
  427. package/dist-es/theme/Density.js.map +1 -1
  428. package/dist-es/theme/HeadingFont.js.map +1 -1
  429. package/dist-es/theme/Mode.js.map +1 -1
  430. package/dist-es/theme/Theme.js.map +1 -1
  431. package/dist-es/toast/Toast.js.map +1 -1
  432. package/dist-es/toast/ToastContent.js.map +1 -1
  433. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  434. package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  435. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  436. package/dist-es/tooltip/Tooltip.js.map +1 -1
  437. package/dist-es/tooltip/TooltipBase.js.map +1 -1
  438. package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
  439. package/dist-es/tooltip/useTooltip.js.map +1 -1
  440. package/dist-es/utils/capitalize.js.map +1 -1
  441. package/dist-es/utils/createChainedFunction.js.map +1 -1
  442. package/dist-es/utils/createContext.js.map +1 -1
  443. package/dist-es/utils/debounce.js.map +1 -1
  444. package/dist-es/utils/getRefFromChildren.js.map +1 -1
  445. package/dist-es/utils/makePrefixer.js.map +1 -1
  446. package/dist-es/utils/marginMiddleware.js.map +1 -1
  447. package/dist-es/utils/mergeProps.js.map +1 -1
  448. package/dist-es/utils/ownerDocument.js.map +1 -1
  449. package/dist-es/utils/ownerWindow.js.map +1 -1
  450. package/dist-es/utils/renderProps.js.map +1 -1
  451. package/dist-es/utils/setRef.js.map +1 -1
  452. package/dist-es/utils/useControlled.js.map +1 -1
  453. package/dist-es/utils/useEventCallback.js.map +1 -1
  454. package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  455. package/dist-es/utils/useForkRef.js.map +1 -1
  456. package/dist-es/utils/useId.js.map +1 -1
  457. package/dist-es/utils/useIsFocusVisible.js.map +1 -1
  458. package/dist-es/utils/useIsomorphicLayoutEffect.js.map +1 -1
  459. package/dist-es/utils/usePreventScroll.js.map +1 -1
  460. package/dist-es/utils/usePrevious.js.map +1 -1
  461. package/dist-es/utils/useResizeObserver.js.map +1 -1
  462. package/dist-es/utils/useResponsiveProp.js.map +1 -1
  463. package/dist-es/utils/useValueEffect.js.map +1 -1
  464. package/dist-es/vertical-navigation/SubMenuContext.js +35 -0
  465. package/dist-es/vertical-navigation/SubMenuContext.js.map +1 -0
  466. package/dist-es/vertical-navigation/VerticalNavigation.css.js +4 -0
  467. package/dist-es/vertical-navigation/VerticalNavigation.css.js.map +1 -0
  468. package/dist-es/vertical-navigation/VerticalNavigation.js +36 -0
  469. package/dist-es/vertical-navigation/VerticalNavigation.js.map +1 -0
  470. package/dist-es/vertical-navigation/VerticalNavigationItem.js +50 -0
  471. package/dist-es/vertical-navigation/VerticalNavigationItem.js.map +1 -0
  472. package/dist-es/vertical-navigation/VerticalNavigationItemContent.css.js +4 -0
  473. package/dist-es/vertical-navigation/VerticalNavigationItemContent.css.js.map +1 -0
  474. package/dist-es/vertical-navigation/VerticalNavigationItemContent.js +86 -0
  475. package/dist-es/vertical-navigation/VerticalNavigationItemContent.js.map +1 -0
  476. package/dist-es/vertical-navigation/VerticalNavigationItemExpansionIcon.js +33 -0
  477. package/dist-es/vertical-navigation/VerticalNavigationItemExpansionIcon.js.map +1 -0
  478. package/dist-es/vertical-navigation/VerticalNavigationItemLabel.css.js +4 -0
  479. package/dist-es/vertical-navigation/VerticalNavigationItemLabel.css.js.map +1 -0
  480. package/dist-es/vertical-navigation/VerticalNavigationItemLabel.js +26 -0
  481. package/dist-es/vertical-navigation/VerticalNavigationItemLabel.js.map +1 -0
  482. package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.css.js +4 -0
  483. package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.css.js.map +1 -0
  484. package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js +72 -0
  485. package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js.map +1 -0
  486. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js +4 -0
  487. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.css.js.map +1 -0
  488. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.js +37 -0
  489. package/dist-es/vertical-navigation/VerticalNavigationSubMenu.js.map +1 -0
  490. package/dist-es/viewport/ViewportProvider.js.map +1 -1
  491. package/dist-types/avatar/useAvatarImage.d.ts +3 -1
  492. package/dist-types/avatar/useIsHydrated.d.ts +1 -0
  493. package/dist-types/collapsible/Collapsible.d.ts +16 -0
  494. package/dist-types/collapsible/CollapsibleContext.d.ts +9 -0
  495. package/dist-types/collapsible/CollapsiblePanel.d.ts +4 -0
  496. package/dist-types/collapsible/CollapsibleTrigger.d.ts +5 -0
  497. package/dist-types/collapsible/index.d.ts +3 -0
  498. package/dist-types/file-drop-zone/FileDropZone.d.ts +1 -1
  499. package/dist-types/flex-layout/FlexLayout.d.ts +1 -1
  500. package/dist-types/index.d.ts +2 -0
  501. package/dist-types/vertical-navigation/SubMenuContext.d.ts +14 -0
  502. package/dist-types/vertical-navigation/VerticalNavigation.d.ts +8 -0
  503. package/dist-types/vertical-navigation/VerticalNavigationItem.d.ts +12 -0
  504. package/dist-types/vertical-navigation/VerticalNavigationItemContent.d.ts +4 -0
  505. package/dist-types/vertical-navigation/VerticalNavigationItemExpansionIcon.d.ts +2 -0
  506. package/dist-types/vertical-navigation/VerticalNavigationItemLabel.d.ts +4 -0
  507. package/dist-types/vertical-navigation/VerticalNavigationItemTrigger.d.ts +6 -0
  508. package/dist-types/vertical-navigation/VerticalNavigationSubMenu.d.ts +4 -0
  509. package/dist-types/vertical-navigation/index.d.ts +7 -0
  510. package/package.json +3 -2
@@ -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 handlePointerUp = useCallback(\n (event: PointerEvent) => {\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\", handlePointerUp);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handlePointerUp);\n }\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handlePointerUp);\n };\n }, [handlePointerMove, handlePointerUp, isDragging, targetWindow]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\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 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\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":["useState","useRef","useWindow","useCallback","getClickedPosition","useEffect","getKeyboardValue"],"mappings":"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"}
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 handlePointerUp = useCallback(\n (event: PointerEvent) => {\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\", handlePointerUp);\n } else {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handlePointerUp);\n }\n return () => {\n targetWindow?.removeEventListener(\"pointermove\", handlePointerMove);\n targetWindow?.removeEventListener(\"pointerup\", handlePointerUp);\n };\n }, [handlePointerMove, handlePointerUp, isDragging, targetWindow]);\n\n const handlePointerDownOnThumb = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\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 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\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":["useState","useRef","useWindow","useCallback","getClickedPosition","useEffect","getKeyboardValue"],"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>,\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 +1 @@
1
- {"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useDensity } from \"../salt-provider\";\nimport { makePrefixer, useId } from \"../utils\";\nimport spinnerCss from \"./Spinner.css\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n \"default\",\n \"large\",\n \"small\",\n \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n className,\n size = \"medium\",\n id: idProp,\n ...rest\n },\n ref,\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n const density = useDensity();\n size = handleSize(size);\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = Date.now();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (Date.now() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`,\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role=\"img\"\n {...rest}\n >\n <SpinnerSVG size={size} density={density} id={id} />\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Spinner","useId","useWindow","useComponentCssInjection","spinnerCss","useAriaAnnouncer","useDensity","useEffect","jsx","clsx","SpinnerSVG"],"mappings":";;;;;;;;;;;;;;;;;AAiBO,MAAM,iBAAoB,GAAA;AAAA,EAC/B,SAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF;AAMA,MAAM,UAAa,GAAA,CAAC,IAClB,KAAA,IAAA,KAAS,YAAY,QAAW,GAAA,IAAA;AAElC,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAqCxC,MAAM,OAAU,GAAAC,gBAAA;AAAA,EACrB,SAASC,QACP,CAAA;AAAA,IACE,cAAc,SAAY,GAAA,SAAA;AAAA,IAC1B,iBAAoB,GAAA,GAAA;AAAA,IACpB,gBAAmB,GAAA,GAAA;AAAA,IACnB,sBAAA,GAAyB,YAAY,SAAS,CAAA,CAAA;AAAA,IAC9C,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAO,GAAA,QAAA;AAAA,IACP,EAAI,EAAA,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,cAAA;AAAA,MACR,GAAK,EAAAC,SAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIC,iCAAiB,EAAA;AAEtC,IAAA,MAAM,UAAUC,uBAAW,EAAA;AAC3B,IAAA,IAAA,GAAO,WAAW,IAAI,CAAA;AAEtB,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,gBAAkB,EAAA;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA;AAElB,MAAM,MAAA,SAAA,GAAY,KAAK,GAAI,EAAA;AAE3B,MAAA,MAAM,QACJ,GAAA,iBAAA,GAAoB,CACpB,IAAA,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAK,CAAA,GAAA,EAAQ,GAAA,SAAA,GAAY,gBAAkB,EAAA;AAE7C,UAAA,QAAA;AAAA,YACE,GAAG,SAAS,CAAA,mDAAA;AAAA,WACd;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,UAAA;AAAA;AAEF,QAAA,QAAA,CAAS,SAAS,CAAA;AAAA,SACjB,iBAAiB,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAA,IAAI,gBAAkB,EAAA;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,QAAA,IAAI,sBAAwB,EAAA;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA;AAAA;AACjC,OACF;AAAA,KACC,EAAA;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IACE,uBAAAC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAY,EAAA,SAAA;AAAA,QACZ,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,IAAI,GAAG,SAAS,CAAA;AAAA,QAC7D,GAAA;AAAA,QACA,IAAK,EAAA,KAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEJ,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA,EAAW,IAAY,EAAA,OAAA,EAAkB,EAAQ,EAAA;AAAA;AAAA,KACpD;AAAA;AAGN;;;;;"}
1
+ {"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useDensity } from \"../salt-provider\";\nimport { makePrefixer, useId } from \"../utils\";\nimport spinnerCss from \"./Spinner.css\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n \"default\",\n \"large\",\n \"small\",\n \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n className,\n size = \"medium\",\n id: idProp,\n ...rest\n },\n ref,\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n const density = useDensity();\n size = handleSize(size);\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = Date.now();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (Date.now() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`,\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role=\"img\"\n {...rest}\n >\n <SpinnerSVG size={size} density={density} id={id} />\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Spinner","useId","useWindow","useComponentCssInjection","spinnerCss","useAriaAnnouncer","useDensity","useEffect","jsx","clsx","SpinnerSVG"],"mappings":";;;;;;;;;;;;;;;;;AAiBO,MAAM,iBAAA,GAAoB;AAAA,EAC/B,SAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF;AAMA,MAAM,UAAA,GAAa,CAAC,IAAA,KAClB,IAAA,KAAS,YAAY,QAAA,GAAW,IAAA;AAElC,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAqCxC,MAAM,OAAA,GAAUC,gBAAA;AAAA,EACrB,SAASC,QAAAA,CACP;AAAA,IACE,cAAc,SAAA,GAAY,SAAA;AAAA,IAC1B,iBAAA,GAAoB,GAAA;AAAA,IACpB,gBAAA,GAAmB,GAAA;AAAA,IACnB,sBAAA,GAAyB,YAAY,SAAS,CAAA,CAAA;AAAA,IAC9C,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA,GAAO,QAAA;AAAA,IACP,EAAA,EAAI,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,SAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAS,GAAIC,iCAAA,EAAiB;AAEtC,IAAA,MAAM,UAAUC,uBAAA,EAAW;AAC3B,IAAA,IAAA,GAAO,WAAW,IAAI,CAAA;AAEtB,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,gBAAA,EAAkB;AAEtB,MAAA,QAAA,CAAS,SAAS,CAAA;AAElB,MAAA,MAAM,SAAA,GAAY,KAAK,GAAA,EAAI;AAE3B,MAAA,MAAM,QAAA,GACJ,iBAAA,GAAoB,CAAA,IACpB,WAAA,CAAY,MAAM;AAChB,QAAA,IAAI,IAAA,CAAK,GAAA,EAAI,GAAI,SAAA,GAAY,gBAAA,EAAkB;AAE7C,UAAA,QAAA;AAAA,YACE,GAAG,SAAS,CAAA,mDAAA;AAAA,WACd;AACA,UAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,UAAA;AAAA,QACF;AACA,QAAA,QAAA,CAAS,SAAS,CAAA;AAAA,MACpB,GAAG,iBAAiB,CAAA;AAEtB,MAAA,OAAO,MAAM;AACX,QAAA,IAAI,gBAAA,EAAkB;AAEtB,QAAA,QAAA,IAAY,cAAc,QAAQ,CAAA;AAClC,QAAA,IAAI,sBAAA,EAAwB;AAC1B,UAAA,QAAA,CAAS,sBAAsB,CAAA;AAAA,QACjC;AAAA,MACF,CAAA;AAAA,IACF,CAAA,EAAG;AAAA,MACD,QAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,SAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,SAAA;AAAA,QACZ,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,IAAI,GAAG,SAAS,CAAA;AAAA,QAC7D,GAAA;AAAA,QACA,IAAA,EAAK,KAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAAD,cAAA,CAACE,qBAAA,EAAA,EAAW,IAAA,EAAY,OAAA,EAAkB,EAAA,EAAQ;AAAA;AAAA,KACpD;AAAA,EAEJ;AACF;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import type { SVGAttributes } from \"react\";\nimport type { Density } from \"../../theme\";\nimport { makePrefixer } from \"../../utils\";\nimport type { SpinnerSVGSize } from \"../Spinner\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n size: SpinnerSVGSize;\n density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n small: {\n high: { width: 12, strokeWidth: 2 },\n medium: { width: 12, strokeWidth: 2 },\n low: { width: 14, strokeWidth: 2 },\n touch: { width: 16, strokeWidth: 2 },\n },\n medium: {\n high: { width: 20, strokeWidth: 2 },\n medium: { width: 28, strokeWidth: 4 },\n low: { width: 36, strokeWidth: 6 },\n touch: { width: 44, strokeWidth: 8 },\n },\n large: {\n high: { width: 40, strokeWidth: 2 },\n medium: { width: 56, strokeWidth: 4 },\n low: { width: 72, strokeWidth: 6 },\n touch: { width: 88, strokeWidth: 8 },\n },\n};\n\nexport const SpinnerSVG = ({\n id = \"svg-spinner\",\n rest,\n size,\n density,\n}: SpinnerProps) => {\n const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n const radius = (width - strokeWidth) / 2;\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox={`0 0 ${width} ${width}`}\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"15%\"\n stopOpacity=\"1\"\n />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\">\n {/* \n This first path draws the top half of the circle without a gradient. \n It starts from the right end, moves in a circular arc, and ends at the left end.\n */}\n <path\n d={`M${width - strokeWidth / 2},${\n width / 2\n } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n {/* \n This second path draws the left half of the circle with a gradient that transitions \n from opaque on the left to transparent on the right.\n It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n */}\n <path\n d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n width - strokeWidth\n }`}\n stroke={`url(#${id}-1)`}\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n </g>\n </svg>\n );\n};\n"],"names":["makePrefixer","jsxs","jsx"],"mappings":"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"}
1
+ {"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import type { SVGAttributes } from \"react\";\nimport type { Density } from \"../../theme\";\nimport { makePrefixer } from \"../../utils\";\nimport type { SpinnerSVGSize } from \"../Spinner\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n size: SpinnerSVGSize;\n density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n small: {\n high: { width: 12, strokeWidth: 2 },\n medium: { width: 12, strokeWidth: 2 },\n low: { width: 14, strokeWidth: 2 },\n touch: { width: 16, strokeWidth: 2 },\n },\n medium: {\n high: { width: 20, strokeWidth: 2 },\n medium: { width: 28, strokeWidth: 4 },\n low: { width: 36, strokeWidth: 6 },\n touch: { width: 44, strokeWidth: 8 },\n },\n large: {\n high: { width: 40, strokeWidth: 2 },\n medium: { width: 56, strokeWidth: 4 },\n low: { width: 72, strokeWidth: 6 },\n touch: { width: 88, strokeWidth: 8 },\n },\n};\n\nexport const SpinnerSVG = ({\n id = \"svg-spinner\",\n rest,\n size,\n density,\n}: SpinnerProps) => {\n const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n const radius = (width - strokeWidth) / 2;\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox={`0 0 ${width} ${width}`}\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"15%\"\n stopOpacity=\"1\"\n />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\">\n {/* \n This first path draws the top half of the circle without a gradient. \n It starts from the right end, moves in a circular arc, and ends at the left end.\n */}\n <path\n d={`M${width - strokeWidth / 2},${\n width / 2\n } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n {/* \n This second path draws the left half of the circle with a gradient that transitions \n from opaque on the left to transparent on the right.\n It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n */}\n <path\n d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n width - strokeWidth\n }`}\n stroke={`url(#${id}-1)`}\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n </g>\n </svg>\n );\n};\n"],"names":["makePrefixer","jsxs","jsx"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ElementType,\n type ForwardedRef,\n type FunctionComponent,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { FlexLayout, type FlexLayoutProps } from \"../flex-layout\";\nimport { makePrefixer, type PolymorphicComponentPropWithRef } from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: FlexLayoutProps<ElementType>[\"direction\"];\n /**\n * End component to be rendered.\n */\n endItem?: ReactNode;\n /**\n * Controls the space between left and right items.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Start component to be rendered.\n */\n startItem?: ReactNode;\n /**\n * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n */\n margin?: FlexLayoutProps<ElementType>[\"margin\"];\n /**\n * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n */\n padding?: FlexLayoutProps<ElementType>[\"padding\"];\n }\n >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n props: SplitLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n function SplitLayout<T extends ElementType = \"div\">(\n { as, endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n ref?: ForwardedRef<unknown>,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-split-layout\",\n css: splitLayoutCss,\n window: targetWindow,\n });\n\n const justify = endItem && !startItem ? \"end\" : \"space-between\";\n return (\n <FlexLayout\n as={as as ElementType}\n className={clsx(withBaseName(), className)}\n ref={ref}\n justify={justify}\n {...rest}\n >\n {startItem}\n {endItem}\n </FlexLayout>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","SplitLayout","useWindow","useComponentCssInjection","splitLayoutCss","jsxs","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA;AAyC5C,MAAM,WAAoC,GAAAC,gBAAA;AAAA,EAC/C,SAASC,YACP,CAAA,EAAE,EAAI,EAAA,OAAA,EAAS,WAAW,SAAW,EAAA,GAAG,IAAK,EAAA,EAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAC,aAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,OAAU,GAAA,OAAA,IAAW,CAAC,SAAA,GAAY,KAAQ,GAAA,eAAA;AAChD,IACE,uBAAAC,eAAA;AAAA,MAACC,qBAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACA,OAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,UACA;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
1
+ {"version":3,"file":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ElementType,\n type ForwardedRef,\n type FunctionComponent,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { FlexLayout, type FlexLayoutProps } from \"../flex-layout\";\nimport { makePrefixer, type PolymorphicComponentPropWithRef } from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: FlexLayoutProps<ElementType>[\"direction\"];\n /**\n * End component to be rendered.\n */\n endItem?: ReactNode;\n /**\n * Controls the space between left and right items.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Start component to be rendered.\n */\n startItem?: ReactNode;\n /**\n * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n */\n margin?: FlexLayoutProps<ElementType>[\"margin\"];\n /**\n * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n */\n padding?: FlexLayoutProps<ElementType>[\"padding\"];\n }\n >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n props: SplitLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n function SplitLayout<T extends ElementType = \"div\">(\n { as, endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n ref?: ForwardedRef<unknown>,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-split-layout\",\n css: splitLayoutCss,\n window: targetWindow,\n });\n\n const justify = endItem && !startItem ? \"end\" : \"space-between\";\n return (\n <FlexLayout\n as={as as ElementType}\n className={clsx(withBaseName(), className)}\n ref={ref}\n justify={justify}\n {...rest}\n >\n {startItem}\n {endItem}\n </FlexLayout>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","SplitLayout","useWindow","useComponentCssInjection","splitLayoutCss","jsxs","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA;AAyC5C,MAAM,WAAA,GAAoCC,gBAAA;AAAA,EAC/C,SAASC,YAAAA,CACP,EAAE,EAAA,EAAI,OAAA,EAAS,WAAW,SAAA,EAAW,GAAG,IAAA,EAAK,EAC7C,GAAA,EACA;AACA,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,mBAAA;AAAA,MACR,GAAA,EAAKC,aAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,OAAA,GAAU,OAAA,IAAW,CAAC,SAAA,GAAY,KAAA,GAAQ,eAAA;AAChD,IAAA,uBACEC,eAAA;AAAA,MAACC,qBAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACA,OAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,UACA;AAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ElementType,\n type ForwardedRef,\n type FunctionComponent,\n forwardRef,\n} from \"react\";\nimport { useBreakpoint } from \"../breakpoints\";\nimport {\n FlexLayout,\n type FlexLayoutProps,\n type LayoutDirection,\n type LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n makePrefixer,\n type PolymorphicComponentPropWithRef,\n type ResponsiveProp,\n resolveResponsiveValue,\n} from \"../utils\";\nimport stackLayoutCss from \"./StackLayout.css\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Adds a separator between elements, default is false.\n */\n separators?: LayoutSeparator | boolean;\n /**\n * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n */\n margin?: FlexLayoutProps<ElementType>[\"margin\"];\n /**\n * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n */\n padding?: FlexLayoutProps<ElementType>[\"padding\"];\n }\n >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n props: StackLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nfunction parseSpacing(value: number | string | undefined) {\n if (value === undefined || typeof value === \"string\") {\n return value;\n }\n\n return `calc(var(--salt-spacing-100) * ${value})`;\n}\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n function StackLayout<T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n direction = \"column\",\n gap = 3,\n separators,\n style,\n ...rest\n }: StackLayoutProps<T>,\n ref?: ForwardedRef<unknown>,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-stack-layout\",\n css: stackLayoutCss,\n window: targetWindow,\n });\n\n const { matchedBreakpoints } = useBreakpoint();\n\n const flexGap = resolveResponsiveValue(gap, matchedBreakpoints);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = resolveResponsiveValue(direction, matchedBreakpoints);\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap\": parseSpacing(flexGap),\n };\n return (\n <FlexLayout\n as={as as ElementType}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(flexDirection ?? \"\")]: flexDirection,\n [withBaseName(\"separator\")]: !!separatorAlignment,\n [separatorAlignment\n ? withBaseName(`separator-${separatorAlignment}`)\n : \"\"]: separatorAlignment,\n },\n className,\n )}\n ref={ref}\n direction={direction}\n style={stackLayoutStyles}\n wrap={false}\n gap={flexGap}\n {...rest}\n >\n {children}\n </FlexLayout>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","StackLayout","useWindow","useComponentCssInjection","stackLayoutCss","useBreakpoint","resolveResponsiveValue","jsx","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA;AAqCnD,SAAS,aAAa,KAAoC,EAAA;AACxD,EAAA,IAAI,KAAU,KAAA,MAAA,IAAa,OAAO,KAAA,KAAU,QAAU,EAAA;AACpD,IAAO,OAAA,KAAA;AAAA;AAGT,EAAA,OAAO,kCAAkC,KAAK,CAAA,CAAA,CAAA;AAChD;AAEO,MAAM,WAAoC,GAAAC,gBAAA;AAAA,EAC/C,SAASC,YACP,CAAA;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,IACZ,GAAM,GAAA,CAAA;AAAA,IACN,UAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAC,aAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA,EAAE,kBAAmB,EAAA,GAAIC,gCAAc,EAAA;AAE7C,IAAM,MAAA,OAAA,GAAUC,wCAAuB,CAAA,GAAA,EAAK,kBAAkB,CAAA;AAC9D,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA;AAC5D,IAAM,MAAA,aAAA,GAAgBA,wCAAuB,CAAA,SAAA,EAAW,kBAAkB,CAAA;AAC1E,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,mBAAA,EAAqB,aAAa,OAAO;AAAA,KAC3C;AACA,IACE,uBAAAC,cAAA;AAAA,MAACC,qBAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAW,EAAAC,SAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,aAAiB,IAAA,EAAE,CAAC,GAAG,aAAA;AAAA,YACrC,CAAC,YAAa,CAAA,WAAW,CAAC,GAAG,CAAC,CAAC,kBAAA;AAAA,YAC/B,CAAC,qBACG,YAAa,CAAA,CAAA,UAAA,EAAa,kBAAkB,CAAE,CAAA,CAAA,GAC9C,EAAE,GAAG;AAAA,WACX;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACA,SAAA;AAAA,QACA,KAAO,EAAA,iBAAA;AAAA,QACP,IAAM,EAAA,KAAA;AAAA,QACN,GAAK,EAAA,OAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
1
+ {"version":3,"file":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ElementType,\n type ForwardedRef,\n type FunctionComponent,\n forwardRef,\n} from \"react\";\nimport { useBreakpoint } from \"../breakpoints\";\nimport {\n FlexLayout,\n type FlexLayoutProps,\n type LayoutDirection,\n type LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n makePrefixer,\n type PolymorphicComponentPropWithRef,\n type ResponsiveProp,\n resolveResponsiveValue,\n} from \"../utils\";\nimport stackLayoutCss from \"./StackLayout.css\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Adds a separator between elements, default is false.\n */\n separators?: LayoutSeparator | boolean;\n /**\n * Defines the margin around the component. It can be specified as a number (which acts as a multiplier) or a string representing the margin value. Default is `0`.\n */\n margin?: FlexLayoutProps<ElementType>[\"margin\"];\n /**\n * Defines the padding within the component. It can be specified as a number (which acts as a multiplier) or a string representing the padding value. Default is `0`.\n */\n padding?: FlexLayoutProps<ElementType>[\"padding\"];\n }\n >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n props: StackLayoutProps<T>,\n) => ReturnType<FunctionComponent>;\n\nfunction parseSpacing(value: number | string | undefined) {\n if (value === undefined || typeof value === \"string\") {\n return value;\n }\n\n return `calc(var(--salt-spacing-100) * ${value})`;\n}\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n function StackLayout<T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n direction = \"column\",\n gap = 3,\n separators,\n style,\n ...rest\n }: StackLayoutProps<T>,\n ref?: ForwardedRef<unknown>,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-stack-layout\",\n css: stackLayoutCss,\n window: targetWindow,\n });\n\n const { matchedBreakpoints } = useBreakpoint();\n\n const flexGap = resolveResponsiveValue(gap, matchedBreakpoints);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = resolveResponsiveValue(direction, matchedBreakpoints);\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap\": parseSpacing(flexGap),\n };\n return (\n <FlexLayout\n as={as as ElementType}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(flexDirection ?? \"\")]: flexDirection,\n [withBaseName(\"separator\")]: !!separatorAlignment,\n [separatorAlignment\n ? withBaseName(`separator-${separatorAlignment}`)\n : \"\"]: separatorAlignment,\n },\n className,\n )}\n ref={ref}\n direction={direction}\n style={stackLayoutStyles}\n wrap={false}\n gap={flexGap}\n {...rest}\n >\n {children}\n </FlexLayout>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","StackLayout","useWindow","useComponentCssInjection","stackLayoutCss","useBreakpoint","resolveResponsiveValue","jsx","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA;AAqCnD,SAAS,aAAa,KAAA,EAAoC;AACxD,EAAA,IAAI,KAAA,KAAU,MAAA,IAAa,OAAO,KAAA,KAAU,QAAA,EAAU;AACpD,IAAA,OAAO,KAAA;AAAA,EACT;AAEA,EAAA,OAAO,kCAAkC,KAAK,CAAA,CAAA,CAAA;AAChD;AAEO,MAAM,WAAA,GAAoCC,gBAAA;AAAA,EAC/C,SAASC,YAAAA,CACP;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA,GAAY,QAAA;AAAA,IACZ,GAAA,GAAM,CAAA;AAAA,IACN,UAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,mBAAA;AAAA,MACR,GAAA,EAAKC,aAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,kBAAA,EAAmB,GAAIC,gCAAA,EAAc;AAE7C,IAAA,MAAM,OAAA,GAAUC,wCAAA,CAAuB,GAAA,EAAK,kBAAkB,CAAA;AAC9D,IAAA,MAAM,kBAAA,GAAqB,UAAA,KAAe,IAAA,GAAO,QAAA,GAAW,UAAA;AAC5D,IAAA,MAAM,aAAA,GAAgBA,wCAAA,CAAuB,SAAA,EAAW,kBAAkB,CAAA;AAC1E,IAAA,MAAM,iBAAA,GAAoB;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,mBAAA,EAAqB,aAAa,OAAO;AAAA,KAC3C;AACA,IAAA,uBACEC,cAAA;AAAA,MAACC,qBAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,SAAA,EAAWC,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,aAAA,IAAiB,EAAE,CAAC,GAAG,aAAA;AAAA,YACrC,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,CAAC,CAAC,kBAAA;AAAA,YAC/B,CAAC,qBACG,YAAA,CAAa,CAAA,UAAA,EAAa,kBAAkB,CAAA,CAAE,CAAA,GAC9C,EAAE,GAAG;AAAA,WACX;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACA,SAAA;AAAA,QACA,KAAA,EAAO,iBAAA;AAAA,QACP,IAAA,EAAM,KAAA;AAAA,QACN,GAAA,EAAK,OAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"ErrorAdornment.js","sources":["../src/status-adornment/ErrorAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type ErrorAdornmentIconProps = IconProps;\n\nexport const ErrorAdornmentIcon = forwardRef<\n SVGSVGElement,\n ErrorAdornmentIconProps\n>(function ErrorAdornmentIcon(\n { children, className, ...rest }: ErrorAdornmentIconProps,\n ref,\n) {\n return (\n <svg className={className} {...rest} role=\"img\" ref={ref} viewBox=\"0 0 8 8\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M4 8C6.20914 8 8 6.20914 8 4C8 1.79086 6.20914 0 4 0C1.79086 0 0 1.79086 0 4C0 6.20914 1.79086 8 4 8Z\"\n />\n </svg>\n );\n});\n"],"names":["forwardRef","ErrorAdornmentIcon","jsx"],"mappings":";;;;;AAKa,MAAA,kBAAA,GAAqBA,gBAGhC,CAAA,SAASC,mBACT,CAAA,EAAE,UAAU,SAAW,EAAA,GAAG,IAAK,EAAA,EAC/B,GACA,EAAA;AACA,EACE,uBAAAC,cAAA,CAAC,SAAI,SAAuB,EAAA,GAAG,MAAM,IAAK,EAAA,KAAA,EAAM,GAAU,EAAA,OAAA,EAAQ,SAChE,EAAA,QAAA,kBAAAA,cAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,QAAS,EAAA,SAAA;AAAA,MACT,QAAS,EAAA,SAAA;AAAA,MACT,CAAE,EAAA;AAAA;AAAA,GAEN,EAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"ErrorAdornment.js","sources":["../src/status-adornment/ErrorAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type ErrorAdornmentIconProps = IconProps;\n\nexport const ErrorAdornmentIcon = forwardRef<\n SVGSVGElement,\n ErrorAdornmentIconProps\n>(function ErrorAdornmentIcon(\n { children, className, ...rest }: ErrorAdornmentIconProps,\n ref,\n) {\n return (\n <svg className={className} {...rest} role=\"img\" ref={ref} viewBox=\"0 0 8 8\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M4 8C6.20914 8 8 6.20914 8 4C8 1.79086 6.20914 0 4 0C1.79086 0 0 1.79086 0 4C0 6.20914 1.79086 8 4 8Z\"\n />\n </svg>\n );\n});\n"],"names":["forwardRef","ErrorAdornmentIcon","jsx"],"mappings":";;;;;AAKO,MAAM,kBAAA,GAAqBA,gBAAA,CAGhC,SAASC,mBAAAA,CACT,EAAE,UAAU,SAAA,EAAW,GAAG,IAAA,EAAK,EAC/B,GAAA,EACA;AACA,EAAA,uBACEC,cAAA,CAAC,SAAI,SAAA,EAAuB,GAAG,MAAM,IAAA,EAAK,KAAA,EAAM,GAAA,EAAU,OAAA,EAAQ,SAAA,EAChE,QAAA,kBAAAA,cAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAS,SAAA;AAAA,MACT,QAAA,EAAS,SAAA;AAAA,MACT,CAAA,EAAE;AAAA;AAAA,GACJ,EACF,CAAA;AAEJ,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport type { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport statusAdornmentCss from \"./StatusAdornment.css\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nconst icons = {\n error: ErrorAdornmentIcon,\n warning: WarningAdornmentIcon,\n success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n /**\n * Status adornment to be displayed.\n */\n status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n error: \"error\",\n warning: \"warning\",\n success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n function StatusAdornment({ className, status, ...restProps }, ref) {\n const AdornmentComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-adornment\",\n css: statusAdornmentCss,\n window: targetWindow,\n });\n\n return (\n <AdornmentComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n },\n);\n"],"names":["ErrorAdornmentIcon","WarningAdornmentIcon","SuccessAdornmentIcon","makePrefixer","forwardRef","StatusAdornment","useWindow","useComponentCssInjection","statusAdornmentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;AAYA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAAA,iCAAA;AAAA,EACP,OAAS,EAAAC,qCAAA;AAAA,EACT,OAAS,EAAAC;AACX,CAAA;AAWA,MAAM,oBAAkE,GAAA;AAAA,EACtE,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA;AACX,CAAA;AAEA,MAAM,YAAA,GAAeC,0BAAa,qBAAqB,CAAA;AAEhD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,iBAAgB,EAAE,SAAA,EAAW,QAAQ,GAAG,SAAA,IAAa,GAAK,EAAA;AACjE,IAAM,MAAA,kBAAA,GAAqB,MAAM,MAAM,CAAA;AACvC,IAAM,MAAA,SAAA,GAAY,qBAAqB,MAAM,CAAA;AAE7C,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,iBAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAAC,cAAA;AAAA,MAAC,kBAAA;AAAA,MAAA;AAAA,QACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,QAC/D,YAAY,EAAA,SAAA;AAAA,QACX,GAAG,SAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
1
+ {"version":3,"file":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport type { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport statusAdornmentCss from \"./StatusAdornment.css\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nconst icons = {\n error: ErrorAdornmentIcon,\n warning: WarningAdornmentIcon,\n success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n /**\n * Status adornment to be displayed.\n */\n status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n error: \"error\",\n warning: \"warning\",\n success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n function StatusAdornment({ className, status, ...restProps }, ref) {\n const AdornmentComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-adornment\",\n css: statusAdornmentCss,\n window: targetWindow,\n });\n\n return (\n <AdornmentComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n },\n);\n"],"names":["ErrorAdornmentIcon","WarningAdornmentIcon","SuccessAdornmentIcon","makePrefixer","forwardRef","StatusAdornment","useWindow","useComponentCssInjection","statusAdornmentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;AAYA,MAAM,KAAA,GAAQ;AAAA,EACZ,KAAA,EAAOA,iCAAA;AAAA,EACP,OAAA,EAASC,qCAAA;AAAA,EACT,OAAA,EAASC;AACX,CAAA;AAWA,MAAM,oBAAA,GAAkE;AAAA,EACtE,KAAA,EAAO,OAAA;AAAA,EACP,OAAA,EAAS,SAAA;AAAA,EACT,OAAA,EAAS;AACX,CAAA;AAEA,MAAM,YAAA,GAAeC,0BAAa,qBAAqB,CAAA;AAEhD,MAAM,eAAA,GAAkBC,gBAAA;AAAA,EAC7B,SAASC,iBAAgB,EAAE,SAAA,EAAW,QAAQ,GAAG,SAAA,IAAa,GAAA,EAAK;AACjE,IAAA,MAAM,kBAAA,GAAqB,MAAM,MAAM,CAAA;AACvC,IAAA,MAAM,SAAA,GAAY,qBAAqB,MAAM,CAAA;AAE7C,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,uBAAA;AAAA,MACR,GAAA,EAAKC,iBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,kBAAA;AAAA,MAAA;AAAA,QACC,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,MAAM,GAAG,SAAS,CAAA;AAAA,QAC/D,YAAA,EAAY,SAAA;AAAA,QACX,GAAG,SAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"SuccessAdornment.js","sources":["../src/status-adornment/SuccessAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type SuccessAdornmentIconProps = IconProps;\n\nexport const SuccessAdornmentIcon = forwardRef<\n SVGSVGElement,\n SuccessAdornmentIconProps\n>(function SuccessAdornmentIcon(\n { children, className, ...rest }: SuccessAdornmentIconProps,\n ref,\n) {\n return (\n <svg\n className={className}\n {...rest}\n role=\"img\"\n viewBox=\"0 0 10 8\"\n ref={ref}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M2.92089 5.95735L8.96399 0L10 1.02133L2.92088 8L0 5.1205L1.03602 4.09918L2.92089 5.95735Z\"\n />\n </svg>\n );\n});\n"],"names":["forwardRef","SuccessAdornmentIcon","jsx"],"mappings":";;;;;AAKa,MAAA,oBAAA,GAAuBA,gBAGlC,CAAA,SAASC,qBACT,CAAA,EAAE,UAAU,SAAW,EAAA,GAAG,IAAK,EAAA,EAC/B,GACA,EAAA;AACA,EACE,uBAAAC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,IAAK,EAAA,KAAA;AAAA,MACL,OAAQ,EAAA,UAAA;AAAA,MACR,GAAA;AAAA,MAEA,QAAA,kBAAAA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,QAAS,EAAA,SAAA;AAAA,UACT,QAAS,EAAA,SAAA;AAAA,UACT,CAAE,EAAA;AAAA;AAAA;AACJ;AAAA,GACF;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"SuccessAdornment.js","sources":["../src/status-adornment/SuccessAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type SuccessAdornmentIconProps = IconProps;\n\nexport const SuccessAdornmentIcon = forwardRef<\n SVGSVGElement,\n SuccessAdornmentIconProps\n>(function SuccessAdornmentIcon(\n { children, className, ...rest }: SuccessAdornmentIconProps,\n ref,\n) {\n return (\n <svg\n className={className}\n {...rest}\n role=\"img\"\n viewBox=\"0 0 10 8\"\n ref={ref}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M2.92089 5.95735L8.96399 0L10 1.02133L2.92088 8L0 5.1205L1.03602 4.09918L2.92089 5.95735Z\"\n />\n </svg>\n );\n});\n"],"names":["forwardRef","SuccessAdornmentIcon","jsx"],"mappings":";;;;;AAKO,MAAM,oBAAA,GAAuBA,gBAAA,CAGlC,SAASC,qBAAAA,CACT,EAAE,UAAU,SAAA,EAAW,GAAG,IAAA,EAAK,EAC/B,GAAA,EACA;AACA,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,IAAA,EAAK,KAAA;AAAA,MACL,OAAA,EAAQ,UAAA;AAAA,MACR,GAAA;AAAA,MAEA,QAAA,kBAAAA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,QAAA,EAAS,SAAA;AAAA,UACT,QAAA,EAAS,SAAA;AAAA,UACT,CAAA,EAAE;AAAA;AAAA;AACJ;AAAA,GACF;AAEJ,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WarningAdornment.js","sources":["../src/status-adornment/WarningAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type WarningAdornmentIconProps = IconProps;\n\nexport const WarningAdornmentIcon = forwardRef<\n SVGSVGElement,\n WarningAdornmentIconProps\n>(function WarningAdornmentIcon(\n { children, className, ...rest }: WarningAdornmentIconProps,\n ref,\n) {\n return (\n <svg className={className} {...rest} role=\"img\" viewBox=\"0 0 9 8\" ref={ref}>\n <path d=\"M0 8L4.5 0L9 8H0Z\" />\n </svg>\n );\n});\n"],"names":["forwardRef","WarningAdornmentIcon","jsx"],"mappings":";;;;;AAKa,MAAA,oBAAA,GAAuBA,gBAGlC,CAAA,SAASC,qBACT,CAAA,EAAE,UAAU,SAAW,EAAA,GAAG,IAAK,EAAA,EAC/B,GACA,EAAA;AACA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA,EAAI,SAAuB,EAAA,GAAG,MAAM,IAAK,EAAA,KAAA,EAAM,OAAQ,EAAA,SAAA,EAAU,GAChE,EAAA,QAAA,kBAAAA,cAAA,CAAC,MAAK,EAAA,EAAA,CAAA,EAAE,qBAAoB,CAC9B,EAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"WarningAdornment.js","sources":["../src/status-adornment/WarningAdornment.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { forwardRef } from \"react\";\n\nexport type WarningAdornmentIconProps = IconProps;\n\nexport const WarningAdornmentIcon = forwardRef<\n SVGSVGElement,\n WarningAdornmentIconProps\n>(function WarningAdornmentIcon(\n { children, className, ...rest }: WarningAdornmentIconProps,\n ref,\n) {\n return (\n <svg className={className} {...rest} role=\"img\" viewBox=\"0 0 9 8\" ref={ref}>\n <path d=\"M0 8L4.5 0L9 8H0Z\" />\n </svg>\n );\n});\n"],"names":["forwardRef","WarningAdornmentIcon","jsx"],"mappings":";;;;;AAKO,MAAM,oBAAA,GAAuBA,gBAAA,CAGlC,SAASC,qBAAAA,CACT,EAAE,UAAU,SAAA,EAAW,GAAG,IAAA,EAAK,EAC/B,GAAA,EACA;AACA,EAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAuB,GAAG,MAAM,IAAA,EAAK,KAAA,EAAM,OAAA,EAAQ,SAAA,EAAU,GAAA,EAChE,QAAA,kBAAAA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,qBAAoB,CAAA,EAC9B,CAAA;AAEJ,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import { DEFAULT_ICON_SIZE, type IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport type { ValidationStatus } from \"./ValidationStatus\";\n\nexport interface StatusIndicatorProps extends IconProps {\n /**\n * Status indicator to be displayed.\n */\n status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n error: \"error\",\n success: \"success\",\n warning: \"warning\",\n info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n function StatusIndicator(\n { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-indicator\",\n css: statusIndicatorCss,\n window: targetWindow,\n });\n\n const { ErrorIcon, WarningIcon, SuccessIcon, InfoIcon } = useIcon();\n\n const iconMap = {\n error: ErrorIcon,\n success: SuccessIcon,\n warning: WarningIcon,\n info: InfoIcon,\n };\n\n const IconComponent = iconMap[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n if (IconComponent === undefined) {\n return null;\n }\n\n return (\n <IconComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n size={size}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","StatusIndicator","DEFAULT_ICON_SIZE","useWindow","useComponentCssInjection","statusIndicatorCss","useIcon","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,oBAAyD,GAAA;AAAA,EAC7D,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA;AACR,CAAA;AAEA,MAAM,YAAA,GAAeA,0BAAa,qBAAqB,CAAA;AAEhD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,gBACP,CAAA,EAAE,SAAW,EAAA,MAAA,EAAQ,OAAOC,uBAAmB,EAAA,GAAG,SAAU,EAAA,EAC5D,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,iBAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,SAAW,EAAA,WAAA,EAAa,WAAa,EAAA,QAAA,KAAaC,4BAAQ,EAAA;AAElE,IAAA,MAAM,OAAU,GAAA;AAAA,MACd,KAAO,EAAA,SAAA;AAAA,MACP,OAAS,EAAA,WAAA;AAAA,MACT,OAAS,EAAA,WAAA;AAAA,MACT,IAAM,EAAA;AAAA,KACR;AAEA,IAAM,MAAA,aAAA,GAAgB,QAAQ,MAAM,CAAA;AACpC,IAAM,MAAA,SAAA,GAAY,qBAAqB,MAAM,CAAA;AAE7C,IAAA,IAAI,kBAAkB,MAAW,EAAA;AAC/B,MAAO,OAAA,IAAA;AAAA;AAGT,IACE,uBAAAC,cAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,QAC/D,IAAA;AAAA,QACA,YAAY,EAAA,SAAA;AAAA,QACX,GAAG,SAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
1
+ {"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import { DEFAULT_ICON_SIZE, type IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport type { ValidationStatus } from \"./ValidationStatus\";\n\nexport interface StatusIndicatorProps extends IconProps {\n /**\n * Status indicator to be displayed.\n */\n status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n error: \"error\",\n success: \"success\",\n warning: \"warning\",\n info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n function StatusIndicator(\n { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-indicator\",\n css: statusIndicatorCss,\n window: targetWindow,\n });\n\n const { ErrorIcon, WarningIcon, SuccessIcon, InfoIcon } = useIcon();\n\n const iconMap = {\n error: ErrorIcon,\n success: SuccessIcon,\n warning: WarningIcon,\n info: InfoIcon,\n };\n\n const IconComponent = iconMap[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n if (IconComponent === undefined) {\n return null;\n }\n\n return (\n <IconComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n size={size}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","StatusIndicator","DEFAULT_ICON_SIZE","useWindow","useComponentCssInjection","statusIndicatorCss","useIcon","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,oBAAA,GAAyD;AAAA,EAC7D,KAAA,EAAO,OAAA;AAAA,EACP,OAAA,EAAS,SAAA;AAAA,EACT,OAAA,EAAS,SAAA;AAAA,EACT,IAAA,EAAM;AACR,CAAA;AAEA,MAAM,YAAA,GAAeA,0BAAa,qBAAqB,CAAA;AAEhD,MAAM,eAAA,GAAkBC,gBAAA;AAAA,EAC7B,SAASC,gBAAAA,CACP,EAAE,SAAA,EAAW,MAAA,EAAQ,OAAOC,uBAAA,EAAmB,GAAG,SAAA,EAAU,EAC5D,GAAA,EACA;AACA,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,uBAAA;AAAA,MACR,GAAA,EAAKC,iBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,WAAA,EAAa,WAAA,EAAa,QAAA,KAAaC,4BAAA,EAAQ;AAElE,IAAA,MAAM,OAAA,GAAU;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,OAAA,EAAS,WAAA;AAAA,MACT,OAAA,EAAS,WAAA;AAAA,MACT,IAAA,EAAM;AAAA,KACR;AAEA,IAAA,MAAM,aAAA,GAAgB,QAAQ,MAAM,CAAA;AACpC,IAAA,MAAM,SAAA,GAAY,qBAAqB,MAAM,CAAA;AAE7C,IAAA,IAAI,kBAAkB,MAAA,EAAW;AAC/B,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACEC,cAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,MAAM,GAAG,SAAS,CAAA;AAAA,QAC/D,IAAA;AAAA,QACA,YAAA,EAAY,SAAA;AAAA,QACX,GAAG,SAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"ValidationStatus.js","sources":["../src/status-indicator/ValidationStatus.ts"],"sourcesContent":["export const VALIDATION_NAMED_STATUS = [\n \"error\",\n \"warning\",\n \"success\",\n \"info\",\n] as const;\n\nexport type ValidationStatus = (typeof VALIDATION_NAMED_STATUS)[number];\n"],"names":[],"mappings":";;AAAO,MAAM,uBAA0B,GAAA;AAAA,EACrC,OAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF;;;;"}
1
+ {"version":3,"file":"ValidationStatus.js","sources":["../src/status-indicator/ValidationStatus.ts"],"sourcesContent":["export const VALIDATION_NAMED_STATUS = [\n \"error\",\n \"warning\",\n \"success\",\n \"info\",\n] as const;\n\nexport type ValidationStatus = (typeof VALIDATION_NAMED_STATUS)[number];\n"],"names":[],"mappings":";;AAAO,MAAM,uBAAA,GAA0B;AAAA,EACrC,OAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Step.js","sources":["../src/stepper/Step.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n forwardRef,\n type ReactNode,\n useContext,\n useEffect,\n} from \"react\";\nimport type { ButtonProps } from \"../button\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport { StepConnector } from \"./internal/StepConnector\";\nimport { StepExpandTrigger } from \"./internal/StepExpandTrigger\";\nimport { StepIcon } from \"./internal/StepIcon\";\nimport {\n StepDepthContext,\n StepperOrientationContext,\n} from \"./internal/StepperProvider\";\nimport { StepScreenReaderOnly } from \"./internal/StepScreenReaderOnly\";\nimport { StepText } from \"./internal/StepText\";\nimport stepCSS from \"./Step.css\";\nimport { Stepper } from \"./Stepper\";\n\nexport interface StepProps\n extends Omit<ComponentPropsWithoutRef<\"li\">, \"onToggle\"> {\n /**\n * The label of the step\n */\n label?: ReactNode;\n /**\n * Description text is displayed just below the label\n **/\n description?: ReactNode;\n /**\n * Optional string to determine the status of the step.\n */\n status?: StepStatus;\n /**\n * The stage of the step\n */\n stage?: StepStage;\n /**\n * Whether the step item is expanded.\n */\n expanded?: boolean;\n /**\n * Initial expanded state of the step.\n */\n defaultExpanded?: boolean;\n /**\n * Callback fired when the step is toggled.\n */\n onToggle?: ButtonProps[\"onClick\"];\n}\n\nexport type StepId = string;\n\nexport type StepStatus = \"warning\" | \"error\";\n\nexport type StepStage =\n | \"pending\"\n | \"locked\"\n | \"completed\"\n | \"inprogress\"\n | \"active\";\n\nexport type StepDepth = number;\n\nexport interface StepProps\n extends Omit<ComponentPropsWithoutRef<\"li\">, \"onToggle\"> {\n label?: ReactNode;\n description?: ReactNode;\n status?: StepStatus;\n stage?: StepStage;\n expanded?: boolean;\n defaultExpanded?: boolean;\n onToggle?: ButtonProps[\"onClick\"];\n}\n\nconst withBaseName = makePrefixer(\"saltStep\");\n\nexport const Step = forwardRef<HTMLLIElement, StepProps>(function Step(\n {\n id: idProp,\n label,\n description,\n status,\n stage = \"pending\",\n expanded: expandedProp,\n defaultExpanded,\n onToggle,\n className,\n style,\n children,\n ...rest\n },\n ref,\n) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n const depth = useContext(StepDepthContext);\n const orientation = useContext(StepperOrientationContext);\n\n const hasNestedSteps = !!children;\n\n const [expanded, setExpanded] = useControlled({\n name: \"Step\",\n state: \"expanded\",\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n });\n\n useComponentCssInjection({\n testId: \"salt-step\",\n css: stepCSS,\n window: targetWindow,\n });\n\n useEffect(() => {\n if (process.env.NODE_ENV !== \"production\") {\n if (depth === -1) {\n console.warn(\"<Step /> should be used within a <Stepper /> component!\");\n }\n if (depth > 2) {\n console.warn(\"<Step /> should not be nested more than 2 levels deep!\");\n }\n if (orientation === \"horizontal\" && hasNestedSteps) {\n console.warn(\n \"<Stepper /> does not support nested steps in horizontal orientation!\",\n );\n }\n }\n }, [depth, orientation, hasNestedSteps]);\n\n const ariaCurrent = stage === \"active\" ? \"step\" : undefined;\n const iconSizeMultiplier = depth === 0 ? 1.5 : 1;\n const stageText = stage === \"inprogress\" ? \"in progress\" : stage;\n const state = status || stageText;\n\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n const expandTriggerId = `${id}-expand-trigger`;\n const nestedStepperId = `${id}-nested-stepper`;\n\n const screenReaderOnly = {\n stateId: `${id}-sr-only-state`,\n stateText: state !== \"active\" ? state : \"\",\n substepsId: `${id}-sr-only-substeps`,\n substepsText: \"substeps\",\n toggleSubstepsId: `${id}-sr-only-toggle-substeps`,\n toggleSubstepsText: \"toggle substeps\",\n };\n\n return (\n <li\n id={id}\n aria-current={ariaCurrent}\n className={clsx(\n withBaseName(),\n withBaseName(`stage-${stage}`),\n withBaseName(`depth-${depth}`),\n status && withBaseName(`status-${status}`),\n !hasNestedSteps && withBaseName(\"terminal\"),\n hasNestedSteps && expanded && withBaseName(\"expanded\"),\n hasNestedSteps && !expanded && withBaseName(\"collapsed\"),\n className,\n )}\n style={\n {\n \"--saltStep-depth\": depth,\n ...style,\n } as CSSProperties\n }\n {...rest}\n ref={ref}\n >\n <StepScreenReaderOnly>\n {`${label} ${description !== undefined ? description : \"\"} ${screenReaderOnly.stateText}`}\n </StepScreenReaderOnly>\n {hasNestedSteps && (\n <>\n <StepScreenReaderOnly\n id={screenReaderOnly.toggleSubstepsId}\n aria-hidden\n >\n {screenReaderOnly.toggleSubstepsText}\n </StepScreenReaderOnly>\n <StepScreenReaderOnly id={screenReaderOnly.substepsId} aria-hidden>\n {screenReaderOnly.substepsText}\n </StepScreenReaderOnly>\n <StepScreenReaderOnly id={screenReaderOnly.stateId} aria-hidden>\n {screenReaderOnly.stateText}\n </StepScreenReaderOnly>\n </>\n )}\n <StepConnector />\n <StepIcon\n stage={stage}\n status={status}\n sizeMultiplier={iconSizeMultiplier}\n aria-hidden\n />\n {label && (\n <StepText id={labelId} purpose=\"label\" aria-hidden>\n {label}\n </StepText>\n )}\n {description && (\n <StepText id={descriptionId} purpose=\"description\" aria-hidden>\n {description}\n </StepText>\n )}\n {hasNestedSteps && orientation === \"vertical\" && (\n <StepExpandTrigger\n id={expandTriggerId}\n aria-expanded={expanded}\n aria-controls={nestedStepperId}\n aria-labelledby={[\n labelId,\n descriptionId,\n screenReaderOnly.stateId,\n screenReaderOnly.toggleSubstepsId,\n ].join(\" \")}\n expanded={expanded}\n onClick={(event) => {\n onToggle?.(event);\n setExpanded(!expanded);\n }}\n />\n )}\n {hasNestedSteps && orientation === \"vertical\" && (\n <Stepper\n id={nestedStepperId}\n aria-labelledby={[labelId, screenReaderOnly.substepsId].join(\" \")}\n aria-hidden={!expanded}\n hidden={!expanded}\n >\n {children}\n </Stepper>\n )}\n </li>\n );\n});\n"],"names":["makePrefixer","forwardRef","Step","useId","useWindow","useContext","StepDepthContext","StepperOrientationContext","useControlled","useComponentCssInjection","stepCSS","useEffect","jsxs","clsx","jsx","StepScreenReaderOnly","Fragment","StepConnector","StepIcon","StepText","StepExpandTrigger","Stepper"],"mappings":"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"}
1
+ {"version":3,"file":"Step.js","sources":["../src/stepper/Step.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n forwardRef,\n type ReactNode,\n useContext,\n useEffect,\n} from \"react\";\nimport type { ButtonProps } from \"../button\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport { StepConnector } from \"./internal/StepConnector\";\nimport { StepExpandTrigger } from \"./internal/StepExpandTrigger\";\nimport { StepIcon } from \"./internal/StepIcon\";\nimport {\n StepDepthContext,\n StepperOrientationContext,\n} from \"./internal/StepperProvider\";\nimport { StepScreenReaderOnly } from \"./internal/StepScreenReaderOnly\";\nimport { StepText } from \"./internal/StepText\";\nimport stepCSS from \"./Step.css\";\nimport { Stepper } from \"./Stepper\";\n\nexport interface StepProps\n extends Omit<ComponentPropsWithoutRef<\"li\">, \"onToggle\"> {\n /**\n * The label of the step\n */\n label?: ReactNode;\n /**\n * Description text is displayed just below the label\n **/\n description?: ReactNode;\n /**\n * Optional string to determine the status of the step.\n */\n status?: StepStatus;\n /**\n * The stage of the step\n */\n stage?: StepStage;\n /**\n * Whether the step item is expanded.\n */\n expanded?: boolean;\n /**\n * Initial expanded state of the step.\n */\n defaultExpanded?: boolean;\n /**\n * Callback fired when the step is toggled.\n */\n onToggle?: ButtonProps[\"onClick\"];\n}\n\nexport type StepId = string;\n\nexport type StepStatus = \"warning\" | \"error\";\n\nexport type StepStage =\n | \"pending\"\n | \"locked\"\n | \"completed\"\n | \"inprogress\"\n | \"active\";\n\nexport type StepDepth = number;\n\nexport interface StepProps\n extends Omit<ComponentPropsWithoutRef<\"li\">, \"onToggle\"> {\n label?: ReactNode;\n description?: ReactNode;\n status?: StepStatus;\n stage?: StepStage;\n expanded?: boolean;\n defaultExpanded?: boolean;\n onToggle?: ButtonProps[\"onClick\"];\n}\n\nconst withBaseName = makePrefixer(\"saltStep\");\n\nexport const Step = forwardRef<HTMLLIElement, StepProps>(function Step(\n {\n id: idProp,\n label,\n description,\n status,\n stage = \"pending\",\n expanded: expandedProp,\n defaultExpanded,\n onToggle,\n className,\n style,\n children,\n ...rest\n },\n ref,\n) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n const depth = useContext(StepDepthContext);\n const orientation = useContext(StepperOrientationContext);\n\n const hasNestedSteps = !!children;\n\n const [expanded, setExpanded] = useControlled({\n name: \"Step\",\n state: \"expanded\",\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n });\n\n useComponentCssInjection({\n testId: \"salt-step\",\n css: stepCSS,\n window: targetWindow,\n });\n\n useEffect(() => {\n if (process.env.NODE_ENV !== \"production\") {\n if (depth === -1) {\n console.warn(\"<Step /> should be used within a <Stepper /> component!\");\n }\n if (depth > 2) {\n console.warn(\"<Step /> should not be nested more than 2 levels deep!\");\n }\n if (orientation === \"horizontal\" && hasNestedSteps) {\n console.warn(\n \"<Stepper /> does not support nested steps in horizontal orientation!\",\n );\n }\n }\n }, [depth, orientation, hasNestedSteps]);\n\n const ariaCurrent = stage === \"active\" ? \"step\" : undefined;\n const iconSizeMultiplier = depth === 0 ? 1.5 : 1;\n const stageText = stage === \"inprogress\" ? \"in progress\" : stage;\n const state = status || stageText;\n\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n const expandTriggerId = `${id}-expand-trigger`;\n const nestedStepperId = `${id}-nested-stepper`;\n\n const screenReaderOnly = {\n stateId: `${id}-sr-only-state`,\n stateText: state !== \"active\" ? state : \"\",\n substepsId: `${id}-sr-only-substeps`,\n substepsText: \"substeps\",\n toggleSubstepsId: `${id}-sr-only-toggle-substeps`,\n toggleSubstepsText: \"toggle substeps\",\n };\n\n return (\n <li\n id={id}\n aria-current={ariaCurrent}\n className={clsx(\n withBaseName(),\n withBaseName(`stage-${stage}`),\n withBaseName(`depth-${depth}`),\n status && withBaseName(`status-${status}`),\n !hasNestedSteps && withBaseName(\"terminal\"),\n hasNestedSteps && expanded && withBaseName(\"expanded\"),\n hasNestedSteps && !expanded && withBaseName(\"collapsed\"),\n className,\n )}\n style={\n {\n \"--saltStep-depth\": depth,\n ...style,\n } as CSSProperties\n }\n {...rest}\n ref={ref}\n >\n <StepScreenReaderOnly>\n {`${label} ${description !== undefined ? description : \"\"} ${screenReaderOnly.stateText}`}\n </StepScreenReaderOnly>\n {hasNestedSteps && (\n <>\n <StepScreenReaderOnly\n id={screenReaderOnly.toggleSubstepsId}\n aria-hidden\n >\n {screenReaderOnly.toggleSubstepsText}\n </StepScreenReaderOnly>\n <StepScreenReaderOnly id={screenReaderOnly.substepsId} aria-hidden>\n {screenReaderOnly.substepsText}\n </StepScreenReaderOnly>\n <StepScreenReaderOnly id={screenReaderOnly.stateId} aria-hidden>\n {screenReaderOnly.stateText}\n </StepScreenReaderOnly>\n </>\n )}\n <StepConnector />\n <StepIcon\n stage={stage}\n status={status}\n sizeMultiplier={iconSizeMultiplier}\n aria-hidden\n />\n {label && (\n <StepText id={labelId} purpose=\"label\" aria-hidden>\n {label}\n </StepText>\n )}\n {description && (\n <StepText id={descriptionId} purpose=\"description\" aria-hidden>\n {description}\n </StepText>\n )}\n {hasNestedSteps && orientation === \"vertical\" && (\n <StepExpandTrigger\n id={expandTriggerId}\n aria-expanded={expanded}\n aria-controls={nestedStepperId}\n aria-labelledby={[\n labelId,\n descriptionId,\n screenReaderOnly.stateId,\n screenReaderOnly.toggleSubstepsId,\n ].join(\" \")}\n expanded={expanded}\n onClick={(event) => {\n onToggle?.(event);\n setExpanded(!expanded);\n }}\n />\n )}\n {hasNestedSteps && orientation === \"vertical\" && (\n <Stepper\n id={nestedStepperId}\n aria-labelledby={[labelId, screenReaderOnly.substepsId].join(\" \")}\n aria-hidden={!expanded}\n hidden={!expanded}\n >\n {children}\n </Stepper>\n )}\n </li>\n );\n});\n"],"names":["makePrefixer","forwardRef","Step","useId","useWindow","useContext","StepDepthContext","StepperOrientationContext","useControlled","useComponentCssInjection","stepCSS","useEffect","jsxs","clsx","jsx","StepScreenReaderOnly","Fragment","StepConnector","StepIcon","StepText","StepExpandTrigger","Stepper"],"mappings":"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"}
@@ -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":["makePrefixer","forwardRef","Stepper","useWindow","useContext","StepperOrientationContext","useComponentCssInjection","StepperCSS","jsx","StepperProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAWxC,MAAM,OAAU,GAAAC,gBAAA;AAAA,EACrB,SAASC,QACP,CAAA,EAAE,WAAa,EAAA,eAAA,EAAiB,UAAU,SAAW,EAAA,GAAG,KAAM,EAAA,EAC9D,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAM,MAAA,kBAAA,GAAqBC,iBAAWC,yCAAyB,CAAA;AAC/D,IAAA,MAAM,cAAc,eAAmB,IAAA,kBAAA;AAEvC,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,cAAA;AAAA,MACR,GAAK,EAAAC,SAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IACE,uBAAAC,cAAA,CAACC,mCAAgB,WACf,EAAA,QAAA,kBAAAD,cAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAWE,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,WAAW,GAAG,SAAS,CAAA;AAAA,QACpE,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KAEL,EAAA,CAAA;AAAA;AAGN;;;;"}
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":["makePrefixer","forwardRef","Stepper","useWindow","useContext","StepperOrientationContext","useComponentCssInjection","StepperCSS","jsx","StepperProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA;AAWxC,MAAM,OAAA,GAAUC,gBAAA;AAAA,EACrB,SAASC,QAAAA,CACP,EAAE,WAAA,EAAa,eAAA,EAAiB,UAAU,SAAA,EAAW,GAAG,KAAA,EAAM,EAC9D,GAAA,EACA;AACA,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAA,MAAM,kBAAA,GAAqBC,iBAAWC,yCAAyB,CAAA;AAC/D,IAAA,MAAM,cAAc,eAAA,IAAmB,kBAAA;AAEvC,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,SAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAACC,mCAAgB,WAAA,EACf,QAAA,kBAAAD,cAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAWE,SAAA,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 +1 @@
1
- {"version":3,"file":"StepConnector.js","sources":["../src/stepper/internal/StepConnector.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../../utils\";\n\nimport stepConnectorCSS from \"./StepConnector.css\";\n\nconst withBaseName = makePrefixer(\"saltStepConnector\");\n\nexport function StepConnector() {\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-connector\",\n css: stepConnectorCSS,\n window: targetWindow,\n });\n\n return <div aria-hidden className={withBaseName()} />;\n}\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","stepConnectorCSS"],"mappings":";;;;;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA;AAE9C,SAAS,aAAgB,GAAA;AAC9B,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAE/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,sCAAQ,KAAI,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA,SAAA,EAAW,cAAgB,EAAA,CAAA;AACrD;;;;"}
1
+ {"version":3,"file":"StepConnector.js","sources":["../src/stepper/internal/StepConnector.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../../utils\";\n\nimport stepConnectorCSS from \"./StepConnector.css\";\n\nconst withBaseName = makePrefixer(\"saltStepConnector\");\n\nexport function StepConnector() {\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-connector\",\n css: stepConnectorCSS,\n window: targetWindow,\n });\n\n return <div aria-hidden className={withBaseName()} />;\n}\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","stepConnectorCSS"],"mappings":";;;;;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA;AAE9C,SAAS,aAAA,GAAgB;AAC9B,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAE/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qBAAA;AAAA,IACR,GAAA,EAAKC,eAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,sCAAQ,KAAA,EAAA,EAAI,aAAA,EAAW,IAAA,EAAC,SAAA,EAAW,cAAa,EAAG,CAAA;AACrD;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepExpandTrigger.js","sources":["../src/stepper/internal/StepExpandTrigger.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Button, type ButtonProps } from \"../../button\";\nimport { useIcon } from \"../../semantic-icon-provider\";\nimport { makePrefixer } from \"../../utils\";\n\nimport stepExpandTriggerCSS from \"./StepExpandTrigger.css\";\n\nexport interface StepExpandTriggerProps extends ButtonProps {\n expanded: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltStepExpandTrigger\");\n\nexport function StepExpandTrigger({\n id,\n expanded,\n className,\n ...props\n}: StepExpandTriggerProps) {\n const { CollapseIcon, ExpandIcon } = useIcon();\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-expand-trigger\",\n css: stepExpandTriggerCSS,\n window: targetWindow,\n });\n\n return (\n <Button\n id={id}\n sentiment=\"neutral\"\n appearance=\"transparent\"\n className={clsx(withBaseName(), className)}\n {...props}\n >\n {expanded ? <CollapseIcon aria-hidden /> : <ExpandIcon aria-hidden />}\n </Button>\n );\n}\n"],"names":["makePrefixer","useIcon","useWindow","useComponentCssInjection","stepExpandTriggerCSS","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA;AAElD,SAAS,iBAAkB,CAAA;AAAA,EAChC,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAA2B,EAAA;AACzB,EAAA,MAAM,EAAE,YAAA,EAAc,UAAW,EAAA,GAAIC,4BAAQ,EAAA;AAC7C,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAE/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAACC,aAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,SAAU,EAAA,SAAA;AAAA,MACV,UAAW,EAAA,aAAA;AAAA,MACX,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACxC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA,QAAA,kCAAY,YAAa,EAAA,EAAA,aAAA,EAAW,MAAC,CAAK,mBAAAF,cAAA,CAAC,UAAW,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA;AAAA;AAAA,GACrE;AAEJ;;;;"}
1
+ {"version":3,"file":"StepExpandTrigger.js","sources":["../src/stepper/internal/StepExpandTrigger.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { Button, type ButtonProps } from \"../../button\";\nimport { useIcon } from \"../../semantic-icon-provider\";\nimport { makePrefixer } from \"../../utils\";\n\nimport stepExpandTriggerCSS from \"./StepExpandTrigger.css\";\n\nexport interface StepExpandTriggerProps extends ButtonProps {\n expanded: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltStepExpandTrigger\");\n\nexport function StepExpandTrigger({\n id,\n expanded,\n className,\n ...props\n}: StepExpandTriggerProps) {\n const { CollapseIcon, ExpandIcon } = useIcon();\n const targetWindow = useWindow();\n\n useComponentCssInjection({\n testId: \"salt-step-expand-trigger\",\n css: stepExpandTriggerCSS,\n window: targetWindow,\n });\n\n return (\n <Button\n id={id}\n sentiment=\"neutral\"\n appearance=\"transparent\"\n className={clsx(withBaseName(), className)}\n {...props}\n >\n {expanded ? <CollapseIcon aria-hidden /> : <ExpandIcon aria-hidden />}\n </Button>\n );\n}\n"],"names":["makePrefixer","useIcon","useWindow","useComponentCssInjection","stepExpandTriggerCSS","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA;AAElD,SAAS,iBAAA,CAAkB;AAAA,EAChC,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA2B;AACzB,EAAA,MAAM,EAAE,YAAA,EAAc,UAAA,EAAW,GAAIC,4BAAA,EAAQ;AAC7C,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAE/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,0BAAA;AAAA,IACR,GAAA,EAAKC,mBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACEC,cAAA;AAAA,IAACC,aAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,SAAA,EAAU,SAAA;AAAA,MACV,UAAA,EAAW,aAAA;AAAA,MACX,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACxC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA,QAAA,kCAAY,YAAA,EAAA,EAAa,aAAA,EAAW,MAAC,CAAA,mBAAKF,cAAA,CAAC,UAAA,EAAA,EAAW,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA,GACrE;AAEJ;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepIcon.js","sources":["../src/stepper/internal/StepIcon.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { useIcon } from \"../../semantic-icon-provider\";\nimport { makePrefixer } from \"../../utils\";\nimport type { StepStage, StepStatus } from \"../Step\";\nimport stepIconCSS from \"./StepIcon.css\";\n\nexport interface StepIconProps extends IconProps {\n stage: StepStage;\n status?: StepStatus;\n sizeMultiplier?: IconProps[\"size\"];\n}\n\nconst withBaseName = makePrefixer(\"saltStepIcon\");\n\nexport function StepIcon({\n status,\n stage,\n size,\n sizeMultiplier = size || 1.5,\n className,\n ...props\n}: StepIconProps) {\n const targetWindow = useWindow();\n const IconComponent = useStepIcon({ stage, status });\n\n useComponentCssInjection({\n testId: \"salt-step-icon\",\n css: stepIconCSS,\n window: targetWindow,\n });\n\n return (\n <IconComponent\n size={sizeMultiplier}\n className={clsx(withBaseName(), className)}\n {...props}\n />\n );\n}\n\nfunction useStepIcon({\n stage,\n status,\n}: Pick<StepIconProps, \"stage\" | \"status\">) {\n const icons = useIcon();\n\n const stateToIcon = useMemo(\n () => ({\n error: icons.ErrorIcon,\n warning: icons.WarningIcon,\n active: icons.ActiveIcon,\n completed: icons.CompletedIcon,\n pending: icons.PendingIcon,\n inprogress: icons.InProgressIcon,\n locked: icons.LockedIcon,\n }),\n [icons],\n );\n\n return stateToIcon[status || stage];\n}\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","stepIconCSS","jsx","clsx","useIcon","useMemo"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA;AAEzC,SAAS,QAAS,CAAA;AAAA,EACvB,MAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,iBAAiB,IAAQ,IAAA,GAAA;AAAA,EACzB,SAAA;AAAA,EACA,GAAG;AACL,CAAkB,EAAA;AAChB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAA,MAAM,aAAgB,GAAA,WAAA,CAAY,EAAE,KAAA,EAAO,QAAQ,CAAA;AAEnD,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,UAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,IAAM,EAAA,cAAA;AAAA,MACN,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACxC,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,SAAS,WAAY,CAAA;AAAA,EACnB,KAAA;AAAA,EACA;AACF,CAA4C,EAAA;AAC1C,EAAA,MAAM,QAAQC,4BAAQ,EAAA;AAEtB,EAAA,MAAM,WAAc,GAAAC,aAAA;AAAA,IAClB,OAAO;AAAA,MACL,OAAO,KAAM,CAAA,SAAA;AAAA,MACb,SAAS,KAAM,CAAA,WAAA;AAAA,MACf,QAAQ,KAAM,CAAA,UAAA;AAAA,MACd,WAAW,KAAM,CAAA,aAAA;AAAA,MACjB,SAAS,KAAM,CAAA,WAAA;AAAA,MACf,YAAY,KAAM,CAAA,cAAA;AAAA,MAClB,QAAQ,KAAM,CAAA;AAAA,KAChB,CAAA;AAAA,IACA,CAAC,KAAK;AAAA,GACR;AAEA,EAAO,OAAA,WAAA,CAAY,UAAU,KAAK,CAAA;AACpC;;;;"}
1
+ {"version":3,"file":"StepIcon.js","sources":["../src/stepper/internal/StepIcon.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { useIcon } from \"../../semantic-icon-provider\";\nimport { makePrefixer } from \"../../utils\";\nimport type { StepStage, StepStatus } from \"../Step\";\nimport stepIconCSS from \"./StepIcon.css\";\n\nexport interface StepIconProps extends IconProps {\n stage: StepStage;\n status?: StepStatus;\n sizeMultiplier?: IconProps[\"size\"];\n}\n\nconst withBaseName = makePrefixer(\"saltStepIcon\");\n\nexport function StepIcon({\n status,\n stage,\n size,\n sizeMultiplier = size || 1.5,\n className,\n ...props\n}: StepIconProps) {\n const targetWindow = useWindow();\n const IconComponent = useStepIcon({ stage, status });\n\n useComponentCssInjection({\n testId: \"salt-step-icon\",\n css: stepIconCSS,\n window: targetWindow,\n });\n\n return (\n <IconComponent\n size={sizeMultiplier}\n className={clsx(withBaseName(), className)}\n {...props}\n />\n );\n}\n\nfunction useStepIcon({\n stage,\n status,\n}: Pick<StepIconProps, \"stage\" | \"status\">) {\n const icons = useIcon();\n\n const stateToIcon = useMemo(\n () => ({\n error: icons.ErrorIcon,\n warning: icons.WarningIcon,\n active: icons.ActiveIcon,\n completed: icons.CompletedIcon,\n pending: icons.PendingIcon,\n inprogress: icons.InProgressIcon,\n locked: icons.LockedIcon,\n }),\n [icons],\n );\n\n return stateToIcon[status || stage];\n}\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","stepIconCSS","jsx","clsx","useIcon","useMemo"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA;AAEzC,SAAS,QAAA,CAAS;AAAA,EACvB,MAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,iBAAiB,IAAA,IAAQ,GAAA;AAAA,EACzB,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAA,MAAM,aAAA,GAAgB,WAAA,CAAY,EAAE,KAAA,EAAO,QAAQ,CAAA;AAEnD,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,gBAAA;AAAA,IACR,GAAA,EAAKC,UAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACEC,cAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAM,cAAA;AAAA,MACN,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACxC,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,SAAS,WAAA,CAAY;AAAA,EACnB,KAAA;AAAA,EACA;AACF,CAAA,EAA4C;AAC1C,EAAA,MAAM,QAAQC,4BAAA,EAAQ;AAEtB,EAAA,MAAM,WAAA,GAAcC,aAAA;AAAA,IAClB,OAAO;AAAA,MACL,OAAO,KAAA,CAAM,SAAA;AAAA,MACb,SAAS,KAAA,CAAM,WAAA;AAAA,MACf,QAAQ,KAAA,CAAM,UAAA;AAAA,MACd,WAAW,KAAA,CAAM,aAAA;AAAA,MACjB,SAAS,KAAA,CAAM,WAAA;AAAA,MACf,YAAY,KAAA,CAAM,cAAA;AAAA,MAClB,QAAQ,KAAA,CAAM;AAAA,KAChB,CAAA;AAAA,IACA,CAAC,KAAK;AAAA,GACR;AAEA,EAAA,OAAO,WAAA,CAAY,UAAU,KAAK,CAAA;AACpC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepScreenReaderOnly.js","sources":["../src/stepper/internal/StepScreenReaderOnly.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nexport interface StepScreenReaderOnlyProps\n extends ComponentPropsWithoutRef<\"div\"> {\n children?: ReactNode;\n}\n\nexport function StepScreenReaderOnly({\n children,\n ...props\n}: StepScreenReaderOnlyProps) {\n return (\n <div className=\"salt-visuallyHidden\" {...props}>\n {children}\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAOO,SAAS,oBAAqB,CAAA;AAAA,EACnC,QAAA;AAAA,EACA,GAAG;AACL,CAA8B,EAAA;AAC5B,EAAA,sCACG,KAAI,EAAA,EAAA,SAAA,EAAU,qBAAuB,EAAA,GAAG,OACtC,QACH,EAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"StepScreenReaderOnly.js","sources":["../src/stepper/internal/StepScreenReaderOnly.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nexport interface StepScreenReaderOnlyProps\n extends ComponentPropsWithoutRef<\"div\"> {\n children?: ReactNode;\n}\n\nexport function StepScreenReaderOnly({\n children,\n ...props\n}: StepScreenReaderOnlyProps) {\n return (\n <div className=\"salt-visuallyHidden\" {...props}>\n {children}\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAOO,SAAS,oBAAA,CAAqB;AAAA,EACnC,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA8B;AAC5B,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EAAuB,GAAG,OACtC,QAAA,EACH,CAAA;AAEJ;;;;"}
@@ -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":["makePrefixer","useWindow","useComponentCssInjection","stepTextCSS","jsx","Text","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA;AAEzC,SAAS,QAAS,CAAA;AAAA,EACvB,EAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAU,GAAA,OAAA;AAAA,EACV,QAAA;AAAA,EACA,GAAG;AACL,CAAkB,EAAA;AAChB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAE/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,UAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAWC,SAAK,CAAA,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":["makePrefixer","useWindow","useComponentCssInjection","stepTextCSS","jsx","Text","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,0BAAa,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,eAAeC,gBAAA,EAAU;AAE/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,gBAAA;AAAA,IACR,GAAA,EAAKC,UAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACEC,cAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAWC,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,OAAO,GAAG,SAAS,CAAA;AAAA,MAC/D,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepperProvider.js","sources":["../src/stepper/internal/StepperProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext } from \"react\";\n\nimport type { StepDepth } from \"../Step\";\nimport type { StepperOrientation } from \"../Stepper\";\n\nexport const StepperOrientationContext =\n createContext<StepperOrientation>(\"horizontal\");\nexport const StepDepthContext = createContext<StepDepth>(-1);\n\nexport interface StepperProviderProps {\n orientation: StepperOrientation;\n children: ReactNode;\n}\n\nexport function StepperProvider({\n orientation: orientationProp,\n children,\n}: StepperProviderProps) {\n const depth = useContext(StepDepthContext);\n\n return (\n <StepperOrientationContext.Provider value={orientationProp}>\n <StepDepthContext.Provider value={depth + 1}>\n {children}\n </StepDepthContext.Provider>\n </StepperOrientationContext.Provider>\n );\n}\n"],"names":["createContext","useContext","jsx"],"mappings":";;;;;AAKa,MAAA,yBAAA,GACXA,oBAAkC,YAAY;AACnC,MAAA,gBAAA,GAAmBA,oBAAyB,EAAE;AAOpD,SAAS,eAAgB,CAAA;AAAA,EAC9B,WAAa,EAAA,eAAA;AAAA,EACb;AACF,CAAyB,EAAA;AACvB,EAAM,MAAA,KAAA,GAAQC,iBAAW,gBAAgB,CAAA;AAEzC,EAAA,uBACGC,cAAA,CAAA,yBAAA,CAA0B,QAA1B,EAAA,EAAmC,OAAO,eACzC,EAAA,QAAA,kBAAAA,cAAA,CAAC,gBAAiB,CAAA,QAAA,EAAjB,EAA0B,KAAA,EAAO,KAAQ,GAAA,CAAA,EACvC,UACH,CACF,EAAA,CAAA;AAEJ;;;;;;"}
1
+ {"version":3,"file":"StepperProvider.js","sources":["../src/stepper/internal/StepperProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext } from \"react\";\n\nimport type { StepDepth } from \"../Step\";\nimport type { StepperOrientation } from \"../Stepper\";\n\nexport const StepperOrientationContext =\n createContext<StepperOrientation>(\"horizontal\");\nexport const StepDepthContext = createContext<StepDepth>(-1);\n\nexport interface StepperProviderProps {\n orientation: StepperOrientation;\n children: ReactNode;\n}\n\nexport function StepperProvider({\n orientation: orientationProp,\n children,\n}: StepperProviderProps) {\n const depth = useContext(StepDepthContext);\n\n return (\n <StepperOrientationContext.Provider value={orientationProp}>\n <StepDepthContext.Provider value={depth + 1}>\n {children}\n </StepDepthContext.Provider>\n </StepperOrientationContext.Provider>\n );\n}\n"],"names":["createContext","useContext","jsx"],"mappings":";;;;;AAKO,MAAM,yBAAA,GACXA,oBAAkC,YAAY;AACzC,MAAM,gBAAA,GAAmBA,oBAAyB,EAAE;AAOpD,SAAS,eAAA,CAAgB;AAAA,EAC9B,WAAA,EAAa,eAAA;AAAA,EACb;AACF,CAAA,EAAyB;AACvB,EAAA,MAAM,KAAA,GAAQC,iBAAW,gBAAgB,CAAA;AAEzC,EAAA,uBACEC,cAAA,CAAC,yBAAA,CAA0B,QAAA,EAA1B,EAAmC,OAAO,eAAA,EACzC,QAAA,kBAAAA,cAAA,CAAC,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,KAAA,GAAQ,CAAA,EACvC,UACH,CAAA,EACF,CAAA;AAEJ;;;;;;"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = ".saltSwitch {\n display: flex;\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-disabled);\n cursor: var(--salt-cursor-disabled);\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-disabled);\n color: var(--salt-selectable-foreground-disabled);\n background: var(--salt-container-primary-background-disabled);\n}\n\n.saltSwitch-checked.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-checked.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selectedDisabled);\n color: var(--salt-selectable-foreground-selectedDisabled);\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@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/* 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";
3
+ 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-disabled);\n cursor: var(--salt-cursor-disabled);\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-disabled);\n color: var(--salt-selectable-foreground-disabled);\n background: var(--salt-container-primary-background-disabled);\n}\n\n.saltSwitch-checked.saltSwitch-disabled .saltSwitch-track,\n.saltSwitch-checked.saltSwitch-disabled:hover .saltSwitch-track {\n border-color: var(--salt-selectable-borderColor-selectedDisabled);\n color: var(--salt-selectable-foreground-selectedDisabled);\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@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/* 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";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=Switch.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { CheckmarkSolidIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport type { DataAttributes } from \"../types\";\nimport { makePrefixer, useControlled } from \"../utils\";\n\nimport switchCss from \"./Switch.css\";\n\nexport interface SwitchProps\n extends Omit<\n ComponentPropsWithoutRef<\"label\">,\n \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n > {\n /**\n * If `true`, the switch will be checked.\n */\n checked?: boolean;\n /**\n * Whether the switch component is checked by default\n * This will be disregarded if checked is already set.\n */\n defaultChecked?: boolean;\n /**\n * If `true`, the switch will be disabled.\n */\n disabled?: boolean;\n /**\n * Properties applied to the input element.\n */\n inputProps?: Partial<ComponentPropsWithoutRef<\"input\">> & DataAttributes;\n /**\n * The label to be shown next to the switch.\n */\n label?: ReactNode;\n /**\n * The name applied to the input.\n */\n name?: string;\n /**\n * Callback when switch loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback when checked state is changed.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Callback when switch gains focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * The value of the switch.\n */\n value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(\n function Switch(props, ref) {\n const {\n checked: checkedProp,\n className,\n defaultChecked,\n disabled: disabledProp,\n inputProps = {},\n label,\n name,\n onBlur,\n onChange,\n onFocus,\n value,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-switch\",\n css: switchCss,\n window: targetWindow,\n });\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n className: inputClassName,\n onChange: inputOnChange,\n ...restInputProps\n } = inputProps;\n\n const [checked, setChecked] = useControlled({\n controlled: checkedProp,\n default: Boolean(defaultChecked),\n name: \"Switch\",\n state: \"checked\",\n });\n\n const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n // Workaround for https://github.com/facebook/react/issues/9023\n if (event.nativeEvent.defaultPrevented) {\n return;\n }\n\n const value = event.target.checked;\n setChecked(value);\n onChange?.(event);\n inputOnChange?.(event);\n };\n\n return (\n <label\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"checked\")]: checked,\n },\n className,\n )}\n ref={ref}\n {...rest}\n >\n <input\n aria-describedby={clsx(\n formFieldA11yProps?.[\"aria-describedby\"],\n inputDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldA11yProps?.[\"aria-labelledby\"],\n inputLabelledBy,\n )}\n name={name}\n value={value}\n checked={checked}\n className={clsx(withBaseName(\"input\"), inputClassName)}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onBlur={onBlur}\n onChange={handleChange}\n onFocus={onFocus}\n type=\"checkbox\"\n // biome-ignore lint/a11y/useAriaPropsForRole: aria-checked is not needed when input and checked is used.\n role=\"switch\"\n {...restInputProps}\n />\n <span className={withBaseName(\"track\")}>\n <span className={withBaseName(\"thumb\")}>\n {checked && (\n <CheckmarkSolidIcon\n aria-hidden\n className={withBaseName(\"icon\")}\n />\n )}\n </span>\n </span>\n {label && <span className={withBaseName(\"label\")}>{label}</span>}\n </label>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Switch","useWindow","useComponentCssInjection","switchCss","useControlled","useFormFieldProps","value","jsxs","clsx","jsx","CheckmarkSolidIcon"],"mappings":";;;;;;;;;;;;;;;;;;AAiEA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA;AAEvC,MAAM,MAAS,GAAAC,gBAAA;AAAA,EACpB,SAASC,OAAO,CAAA,KAAA,EAAO,GAAK,EAAA;AAC1B,IAAM,MAAA;AAAA,MACJ,OAAS,EAAA,WAAA;AAAA,MACT,SAAA;AAAA,MACA,cAAA;AAAA,MACA,QAAU,EAAA,YAAA;AAAA,MACV,aAAa,EAAC;AAAA,MACd,KAAA;AAAA,MACA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAM,MAAA;AAAA,MACJ,kBAAoB,EAAA,gBAAA;AAAA,MACpB,iBAAmB,EAAA,eAAA;AAAA,MACnB,SAAW,EAAA,cAAA;AAAA,MACX,QAAU,EAAA,aAAA;AAAA,MACV,GAAG;AAAA,KACD,GAAA,UAAA;AAEJ,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIC,2BAAc,CAAA;AAAA,MAC1C,UAAY,EAAA,WAAA;AAAA,MACZ,OAAA,EAAS,QAAQ,cAAc,CAAA;AAAA,MAC/B,IAAM,EAAA,QAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AAED,IAAA,MAAM,EAAE,SAAW,EAAA,kBAAA,EAAoB,QAAU,EAAA,iBAAA,KAC/CC,mCAAkB,EAAA;AAEpB,IAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA;AAEtC,IAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AAEpE,MAAI,IAAA,KAAA,CAAM,YAAY,gBAAkB,EAAA;AACtC,QAAA;AAAA;AAGF,MAAMC,MAAAA,MAAAA,GAAQ,MAAM,MAAO,CAAA,OAAA;AAC3B,MAAA,UAAA,CAAWA,MAAK,CAAA;AAChB,MAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AACX,MAAgB,aAAA,IAAA,IAAA,GAAA,MAAA,GAAA,aAAA,CAAA,KAAA,CAAA;AAAA,KAClB;AAEA,IACE,uBAAAC,eAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAAC,SAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,WAC7B;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAAC,cAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,kBAAkB,EAAAD,SAAA;AAAA,gBAChB,kBAAqB,IAAA,IAAA,GAAA,MAAA,GAAA,kBAAA,CAAA,kBAAA,CAAA;AAAA,gBACrB;AAAA,eACF;AAAA,cACA,iBAAiB,EAAAA,SAAA;AAAA,gBACf,kBAAqB,IAAA,IAAA,GAAA,MAAA,GAAA,kBAAA,CAAA,iBAAA,CAAA;AAAA,gBACrB;AAAA,eACF;AAAA,cACA,IAAA;AAAA,cACA,KAAA;AAAA,cACA,OAAA;AAAA,cACA,SAAW,EAAAA,SAAA,CAAK,YAAa,CAAA,OAAO,GAAG,cAAc,CAAA;AAAA,cACrD,cAAA;AAAA,cACA,QAAA;AAAA,cACA,MAAA;AAAA,cACA,QAAU,EAAA,YAAA;AAAA,cACV,OAAA;AAAA,cACA,IAAK,EAAA,UAAA;AAAA,cAEL,IAAK,EAAA,QAAA;AAAA,cACJ,GAAG;AAAA;AAAA,WACN;AAAA,0BACCC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,YAAA,CAAa,OAAO,CAAA,EACnC,QAAC,kBAAAA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,YAAA,CAAa,OAAO,CAAA,EAClC,QACC,EAAA,OAAA,oBAAAA,cAAA;AAAA,YAACC,wBAAA;AAAA,YAAA;AAAA,cACC,aAAW,EAAA,IAAA;AAAA,cACX,SAAA,EAAW,aAAa,MAAM;AAAA;AAAA,aAGpC,CACF,EAAA,CAAA;AAAA,UACC,yBAAUD,cAAA,CAAA,MAAA,EAAA,EAAK,WAAW,YAAa,CAAA,OAAO,GAAI,QAAM,EAAA,KAAA,EAAA;AAAA;AAAA;AAAA,KAC3D;AAAA;AAGN;;;;"}
1
+ {"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { CheckmarkSolidIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport type { DataAttributes } from \"../types\";\nimport { makePrefixer, useControlled } from \"../utils\";\n\nimport switchCss from \"./Switch.css\";\n\nexport interface SwitchProps\n extends Omit<\n ComponentPropsWithoutRef<\"label\">,\n \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n > {\n /**\n * If `true`, the switch will be checked.\n */\n checked?: boolean;\n /**\n * Whether the switch component is checked by default\n * This will be disregarded if checked is already set.\n */\n defaultChecked?: boolean;\n /**\n * If `true`, the switch will be disabled.\n */\n disabled?: boolean;\n /**\n * Properties applied to the input element.\n */\n inputProps?: Partial<ComponentPropsWithoutRef<\"input\">> & DataAttributes;\n /**\n * The label to be shown next to the switch.\n */\n label?: ReactNode;\n /**\n * The name applied to the input.\n */\n name?: string;\n /**\n * Callback when switch loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback when checked state is changed.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Callback when switch gains focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * The value of the switch.\n */\n value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(\n function Switch(props, ref) {\n const {\n checked: checkedProp,\n className,\n defaultChecked,\n disabled: disabledProp,\n inputProps = {},\n label,\n name,\n onBlur,\n onChange,\n onFocus,\n value,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-switch\",\n css: switchCss,\n window: targetWindow,\n });\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n className: inputClassName,\n onChange: inputOnChange,\n ...restInputProps\n } = inputProps;\n\n const [checked, setChecked] = useControlled({\n controlled: checkedProp,\n default: Boolean(defaultChecked),\n name: \"Switch\",\n state: \"checked\",\n });\n\n const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n // Workaround for https://github.com/facebook/react/issues/9023\n if (event.nativeEvent.defaultPrevented) {\n return;\n }\n\n const value = event.target.checked;\n setChecked(value);\n onChange?.(event);\n inputOnChange?.(event);\n };\n\n return (\n <label\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"checked\")]: checked,\n },\n className,\n )}\n ref={ref}\n {...rest}\n >\n <input\n aria-describedby={clsx(\n formFieldA11yProps?.[\"aria-describedby\"],\n inputDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldA11yProps?.[\"aria-labelledby\"],\n inputLabelledBy,\n )}\n name={name}\n value={value}\n checked={checked}\n className={clsx(withBaseName(\"input\"), inputClassName)}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onBlur={onBlur}\n onChange={handleChange}\n onFocus={onFocus}\n type=\"checkbox\"\n // biome-ignore lint/a11y/useAriaPropsForRole: aria-checked is not needed when input and checked is used.\n role=\"switch\"\n {...restInputProps}\n />\n <span className={withBaseName(\"track\")}>\n <span className={withBaseName(\"thumb\")}>\n {checked && (\n <CheckmarkSolidIcon\n aria-hidden\n className={withBaseName(\"icon\")}\n />\n )}\n </span>\n </span>\n {label && <span className={withBaseName(\"label\")}>{label}</span>}\n </label>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Switch","useWindow","useComponentCssInjection","switchCss","useControlled","useFormFieldProps","value","jsxs","clsx","jsx","CheckmarkSolidIcon"],"mappings":"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"}