@salt-ds/core 1.29.0 → 1.30.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 (500) hide show
  1. package/css/salt-core.css +250 -24
  2. package/dist-cjs/accordion/Accordion.js +3 -0
  3. package/dist-cjs/accordion/Accordion.js.map +1 -1
  4. package/dist-cjs/accordion/AccordionContext.js +3 -0
  5. package/dist-cjs/accordion/AccordionContext.js.map +1 -1
  6. package/dist-cjs/accordion/AccordionGroup.js +3 -0
  7. package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
  8. package/dist-cjs/accordion/AccordionHeader.js +3 -0
  9. package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
  10. package/dist-cjs/accordion/AccordionPanel.js +3 -0
  11. package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
  12. package/dist-cjs/aria-announcer/useAriaAnnouncer.js +3 -0
  13. package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
  14. package/dist-cjs/avatar/Avatar.js +3 -0
  15. package/dist-cjs/avatar/Avatar.js.map +1 -1
  16. package/dist-cjs/avatar/useAvatarImage.js +3 -0
  17. package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
  18. package/dist-cjs/badge/Badge.js +3 -0
  19. package/dist-cjs/badge/Badge.js.map +1 -1
  20. package/dist-cjs/banner/Banner.js +3 -0
  21. package/dist-cjs/banner/Banner.js.map +1 -1
  22. package/dist-cjs/banner/BannerActions.js +3 -0
  23. package/dist-cjs/banner/BannerActions.js.map +1 -1
  24. package/dist-cjs/banner/BannerContent.js +3 -0
  25. package/dist-cjs/banner/BannerContent.js.map +1 -1
  26. package/dist-cjs/border-item/BorderItem.js +3 -0
  27. package/dist-cjs/border-item/BorderItem.js.map +1 -1
  28. package/dist-cjs/border-layout/BorderLayout.js +3 -0
  29. package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
  30. package/dist-cjs/breakpoints/BreakpointProvider.js +3 -0
  31. package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -1
  32. package/dist-cjs/button/Button.css.js +1 -1
  33. package/dist-cjs/button/Button.js +3 -0
  34. package/dist-cjs/button/Button.js.map +1 -1
  35. package/dist-cjs/card/Card.js +3 -0
  36. package/dist-cjs/card/Card.js.map +1 -1
  37. package/dist-cjs/checkbox/Checkbox.js +3 -0
  38. package/dist-cjs/checkbox/Checkbox.js.map +1 -1
  39. package/dist-cjs/checkbox/CheckboxGroup.js +3 -0
  40. package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
  41. package/dist-cjs/checkbox/CheckboxIcon.js +3 -0
  42. package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
  43. package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +3 -0
  44. package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  45. package/dist-cjs/combo-box/ComboBox.js +28 -20
  46. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  47. package/dist-cjs/combo-box/useComboBox.js +5 -2
  48. package/dist-cjs/combo-box/useComboBox.js.map +1 -1
  49. package/dist-cjs/dialog/Dialog.js +3 -0
  50. package/dist-cjs/dialog/Dialog.js.map +1 -1
  51. package/dist-cjs/dialog/DialogActions.js +3 -0
  52. package/dist-cjs/dialog/DialogActions.js.map +1 -1
  53. package/dist-cjs/dialog/DialogCloseButton.js +3 -0
  54. package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
  55. package/dist-cjs/dialog/DialogContent.js +3 -0
  56. package/dist-cjs/dialog/DialogContent.js.map +1 -1
  57. package/dist-cjs/dialog/DialogHeader.js +3 -0
  58. package/dist-cjs/dialog/DialogHeader.js.map +1 -1
  59. package/dist-cjs/divider/Divider.css.js +6 -0
  60. package/dist-cjs/divider/Divider.css.js.map +1 -0
  61. package/dist-cjs/divider/Divider.js +143 -0
  62. package/dist-cjs/divider/Divider.js.map +1 -0
  63. package/dist-cjs/drawer/Drawer.js +3 -0
  64. package/dist-cjs/drawer/Drawer.js.map +1 -1
  65. package/dist-cjs/drawer/DrawerCloseButton.js +3 -0
  66. package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
  67. package/dist-cjs/dropdown/Dropdown.css.js +1 -1
  68. package/dist-cjs/dropdown/Dropdown.js +23 -17
  69. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  70. package/dist-cjs/file-drop-zone/FileDropZone.js +3 -0
  71. package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
  72. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +3 -0
  73. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  74. package/dist-cjs/flex-item/FlexItem.js +3 -0
  75. package/dist-cjs/flex-item/FlexItem.js.map +1 -1
  76. package/dist-cjs/flex-layout/FlexLayout.js +3 -0
  77. package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
  78. package/dist-cjs/form-field/FormField.js +3 -0
  79. package/dist-cjs/form-field/FormField.js.map +1 -1
  80. package/dist-cjs/form-field/FormFieldHelperText.js +3 -0
  81. package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
  82. package/dist-cjs/form-field/FormFieldLabel.js +3 -0
  83. package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
  84. package/dist-cjs/form-field-context/FormFieldContext.js +3 -0
  85. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  86. package/dist-cjs/grid-item/GridItem.js +3 -0
  87. package/dist-cjs/grid-item/GridItem.js.map +1 -1
  88. package/dist-cjs/grid-layout/GridLayout.js +3 -0
  89. package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
  90. package/dist-cjs/index.js +8 -0
  91. package/dist-cjs/index.js.map +1 -1
  92. package/dist-cjs/input/Input.js +3 -0
  93. package/dist-cjs/input/Input.js.map +1 -1
  94. package/dist-cjs/interactable-card/InteractableCard.js +3 -0
  95. package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
  96. package/dist-cjs/interactable-card/InteractableCardGroup.js +3 -0
  97. package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
  98. package/dist-cjs/interactable-card/InteractableCardGroupContext.js +3 -0
  99. package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
  100. package/dist-cjs/link/Link.js +3 -0
  101. package/dist-cjs/link/Link.js.map +1 -1
  102. package/dist-cjs/link-card/LinkCard.js +3 -0
  103. package/dist-cjs/link-card/LinkCard.js.map +1 -1
  104. package/dist-cjs/list-box/ListBox.css.js +6 -0
  105. package/dist-cjs/list-box/ListBox.css.js.map +1 -0
  106. package/dist-cjs/list-box/ListBox.js +295 -0
  107. package/dist-cjs/list-box/ListBox.js.map +1 -0
  108. package/dist-cjs/list-control/ListControlContext.js +5 -1
  109. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  110. package/dist-cjs/list-control/ListControlState.js +78 -11
  111. package/dist-cjs/list-control/ListControlState.js.map +1 -1
  112. package/dist-cjs/menu/MenuBase.js +3 -0
  113. package/dist-cjs/menu/MenuBase.js.map +1 -1
  114. package/dist-cjs/menu/MenuContext.js +3 -0
  115. package/dist-cjs/menu/MenuContext.js.map +1 -1
  116. package/dist-cjs/menu/MenuGroup.css.js +1 -1
  117. package/dist-cjs/menu/MenuGroup.js +3 -0
  118. package/dist-cjs/menu/MenuGroup.js.map +1 -1
  119. package/dist-cjs/menu/MenuItem.css.js +1 -1
  120. package/dist-cjs/menu/MenuItem.js +3 -0
  121. package/dist-cjs/menu/MenuItem.js.map +1 -1
  122. package/dist-cjs/menu/MenuPanel.js +3 -0
  123. package/dist-cjs/menu/MenuPanel.js.map +1 -1
  124. package/dist-cjs/menu/MenuPanelContext.js +3 -0
  125. package/dist-cjs/menu/MenuPanelContext.js.map +1 -1
  126. package/dist-cjs/menu/MenuTrigger.js +3 -0
  127. package/dist-cjs/menu/MenuTrigger.js.map +1 -1
  128. package/dist-cjs/menu/MenuTriggerContext.js +3 -0
  129. package/dist-cjs/menu/MenuTriggerContext.js.map +1 -1
  130. package/dist-cjs/multiline-input/MultilineInput.js +3 -0
  131. package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
  132. package/dist-cjs/navigation-item/NavigationItem.js +3 -0
  133. package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
  134. package/dist-cjs/option/Option.css.js +1 -1
  135. package/dist-cjs/option/Option.js +7 -2
  136. package/dist-cjs/option/Option.js.map +1 -1
  137. package/dist-cjs/option/OptionGroup.css.js +1 -1
  138. package/dist-cjs/option/OptionGroup.js +3 -0
  139. package/dist-cjs/option/OptionGroup.js.map +1 -1
  140. package/dist-cjs/option/OptionList.js +3 -0
  141. package/dist-cjs/option/OptionList.js.map +1 -1
  142. package/dist-cjs/option/OptionListBase.js +3 -0
  143. package/dist-cjs/option/OptionListBase.js.map +1 -1
  144. package/dist-cjs/overlay/Overlay.js +3 -0
  145. package/dist-cjs/overlay/Overlay.js.map +1 -1
  146. package/dist-cjs/overlay/OverlayContext.js +3 -0
  147. package/dist-cjs/overlay/OverlayContext.js.map +1 -1
  148. package/dist-cjs/overlay/OverlayPanel.js +3 -0
  149. package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
  150. package/dist-cjs/overlay/OverlayPanelCloseButton.js +3 -0
  151. package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
  152. package/dist-cjs/overlay/OverlayPanelContent.js +3 -0
  153. package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
  154. package/dist-cjs/overlay/OverlayTrigger.js +3 -0
  155. package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
  156. package/dist-cjs/pagination/CompactInput.js +3 -0
  157. package/dist-cjs/pagination/CompactInput.js.map +1 -1
  158. package/dist-cjs/pagination/CompactPaginator.js +3 -0
  159. package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
  160. package/dist-cjs/pagination/GoToInput.js +3 -0
  161. package/dist-cjs/pagination/GoToInput.js.map +1 -1
  162. package/dist-cjs/pagination/PageButton.js +3 -0
  163. package/dist-cjs/pagination/PageButton.js.map +1 -1
  164. package/dist-cjs/pagination/PageRanges.js +3 -0
  165. package/dist-cjs/pagination/PageRanges.js.map +1 -1
  166. package/dist-cjs/pagination/Pagination.js +3 -0
  167. package/dist-cjs/pagination/Pagination.js.map +1 -1
  168. package/dist-cjs/pagination/Paginator.js +3 -0
  169. package/dist-cjs/pagination/Paginator.js.map +1 -1
  170. package/dist-cjs/panel/Panel.js +3 -0
  171. package/dist-cjs/panel/Panel.js.map +1 -1
  172. package/dist-cjs/parent-child-layout/ParentChildLayout.js +3 -0
  173. package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
  174. package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js +3 -0
  175. package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
  176. package/dist-cjs/pill/Pill.js +3 -0
  177. package/dist-cjs/pill/Pill.js.map +1 -1
  178. package/dist-cjs/pill-input/PillInput.js +3 -0
  179. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  180. package/dist-cjs/progress/CircularProgress/CircularProgress.js +3 -0
  181. package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
  182. package/dist-cjs/progress/LinearProgress/LinearProgress.js +3 -0
  183. package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
  184. package/dist-cjs/radio-button/RadioButton.js +3 -0
  185. package/dist-cjs/radio-button/RadioButton.js.map +1 -1
  186. package/dist-cjs/radio-button/RadioButtonGroup.js +3 -0
  187. package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
  188. package/dist-cjs/radio-button/RadioButtonIcon.js +3 -0
  189. package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
  190. package/dist-cjs/radio-button/internal/RadioGroupContext.js +3 -0
  191. package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
  192. package/dist-cjs/salt-provider/SaltProvider.js +34 -10
  193. package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
  194. package/dist-cjs/scrim/Scrim.js +3 -0
  195. package/dist-cjs/scrim/Scrim.js.map +1 -1
  196. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js +3 -0
  197. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
  198. package/dist-cjs/spinner/Spinner.js +3 -0
  199. package/dist-cjs/spinner/Spinner.js.map +1 -1
  200. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +3 -0
  201. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  202. package/dist-cjs/split-layout/SplitLayout.js +3 -0
  203. package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
  204. package/dist-cjs/stack-layout/StackLayout.js +3 -0
  205. package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
  206. package/dist-cjs/status-adornment/StatusAdornment.js +3 -0
  207. package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
  208. package/dist-cjs/status-indicator/StatusIndicator.js +3 -0
  209. package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
  210. package/dist-cjs/switch/Switch.js +3 -0
  211. package/dist-cjs/switch/Switch.js.map +1 -1
  212. package/dist-cjs/tag/Tag.css.js +6 -0
  213. package/dist-cjs/tag/Tag.css.js.map +1 -0
  214. package/dist-cjs/tag/Tag.js +137 -0
  215. package/dist-cjs/tag/Tag.js.map +1 -0
  216. package/dist-cjs/text/Text.css.js +1 -1
  217. package/dist-cjs/text/Text.js +3 -0
  218. package/dist-cjs/text/Text.js.map +1 -1
  219. package/dist-cjs/theme/ActionFont.js +8 -0
  220. package/dist-cjs/theme/ActionFont.js.map +1 -0
  221. package/dist-cjs/toast/Toast.js +3 -0
  222. package/dist-cjs/toast/Toast.js.map +1 -1
  223. package/dist-cjs/toast/ToastContent.js +3 -0
  224. package/dist-cjs/toast/ToastContent.js.map +1 -1
  225. package/dist-cjs/toggle-button/ToggleButton.css.js +1 -1
  226. package/dist-cjs/toggle-button/ToggleButton.js +3 -0
  227. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  228. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +3 -0
  229. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  230. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +3 -0
  231. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  232. package/dist-cjs/tooltip/Tooltip.js +3 -0
  233. package/dist-cjs/tooltip/Tooltip.js.map +1 -1
  234. package/dist-cjs/tooltip/TooltipBase.js +3 -0
  235. package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
  236. package/dist-cjs/tooltip/useAriaAnnounce.js +3 -0
  237. package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
  238. package/dist-cjs/tooltip/useTooltip.js +3 -0
  239. package/dist-cjs/tooltip/useTooltip.js.map +1 -1
  240. package/dist-cjs/utils/useValueEffect.js +3 -0
  241. package/dist-cjs/utils/useValueEffect.js.map +1 -1
  242. package/dist-cjs/viewport/ViewportProvider.js +3 -0
  243. package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
  244. package/dist-es/accordion/Accordion.js +3 -0
  245. package/dist-es/accordion/Accordion.js.map +1 -1
  246. package/dist-es/accordion/AccordionContext.js +3 -0
  247. package/dist-es/accordion/AccordionContext.js.map +1 -1
  248. package/dist-es/accordion/AccordionGroup.js +3 -0
  249. package/dist-es/accordion/AccordionGroup.js.map +1 -1
  250. package/dist-es/accordion/AccordionHeader.js +3 -0
  251. package/dist-es/accordion/AccordionHeader.js.map +1 -1
  252. package/dist-es/accordion/AccordionPanel.js +3 -0
  253. package/dist-es/accordion/AccordionPanel.js.map +1 -1
  254. package/dist-es/aria-announcer/useAriaAnnouncer.js +3 -0
  255. package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
  256. package/dist-es/avatar/Avatar.js +3 -0
  257. package/dist-es/avatar/Avatar.js.map +1 -1
  258. package/dist-es/avatar/useAvatarImage.js +3 -0
  259. package/dist-es/avatar/useAvatarImage.js.map +1 -1
  260. package/dist-es/badge/Badge.js +3 -0
  261. package/dist-es/badge/Badge.js.map +1 -1
  262. package/dist-es/banner/Banner.js +3 -0
  263. package/dist-es/banner/Banner.js.map +1 -1
  264. package/dist-es/banner/BannerActions.js +3 -0
  265. package/dist-es/banner/BannerActions.js.map +1 -1
  266. package/dist-es/banner/BannerContent.js +3 -0
  267. package/dist-es/banner/BannerContent.js.map +1 -1
  268. package/dist-es/border-item/BorderItem.js +3 -0
  269. package/dist-es/border-item/BorderItem.js.map +1 -1
  270. package/dist-es/border-layout/BorderLayout.js +3 -0
  271. package/dist-es/border-layout/BorderLayout.js.map +1 -1
  272. package/dist-es/breakpoints/BreakpointProvider.js +3 -0
  273. package/dist-es/breakpoints/BreakpointProvider.js.map +1 -1
  274. package/dist-es/button/Button.css.js +1 -1
  275. package/dist-es/button/Button.js +3 -0
  276. package/dist-es/button/Button.js.map +1 -1
  277. package/dist-es/card/Card.js +3 -0
  278. package/dist-es/card/Card.js.map +1 -1
  279. package/dist-es/checkbox/Checkbox.js +3 -0
  280. package/dist-es/checkbox/Checkbox.js.map +1 -1
  281. package/dist-es/checkbox/CheckboxGroup.js +3 -0
  282. package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
  283. package/dist-es/checkbox/CheckboxIcon.js +3 -0
  284. package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
  285. package/dist-es/checkbox/internal/CheckboxGroupContext.js +3 -0
  286. package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  287. package/dist-es/combo-box/ComboBox.js +28 -20
  288. package/dist-es/combo-box/ComboBox.js.map +1 -1
  289. package/dist-es/combo-box/useComboBox.js +5 -2
  290. package/dist-es/combo-box/useComboBox.js.map +1 -1
  291. package/dist-es/dialog/Dialog.js +3 -0
  292. package/dist-es/dialog/Dialog.js.map +1 -1
  293. package/dist-es/dialog/DialogActions.js +3 -0
  294. package/dist-es/dialog/DialogActions.js.map +1 -1
  295. package/dist-es/dialog/DialogCloseButton.js +3 -0
  296. package/dist-es/dialog/DialogCloseButton.js.map +1 -1
  297. package/dist-es/dialog/DialogContent.js +3 -0
  298. package/dist-es/dialog/DialogContent.js.map +1 -1
  299. package/dist-es/dialog/DialogHeader.js +3 -0
  300. package/dist-es/dialog/DialogHeader.js.map +1 -1
  301. package/dist-es/divider/Divider.css.js +4 -0
  302. package/dist-es/divider/Divider.css.js.map +1 -0
  303. package/dist-es/divider/Divider.js +139 -0
  304. package/dist-es/divider/Divider.js.map +1 -0
  305. package/dist-es/drawer/Drawer.js +3 -0
  306. package/dist-es/drawer/Drawer.js.map +1 -1
  307. package/dist-es/drawer/DrawerCloseButton.js +3 -0
  308. package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
  309. package/dist-es/dropdown/Dropdown.css.js +1 -1
  310. package/dist-es/dropdown/Dropdown.js +24 -18
  311. package/dist-es/dropdown/Dropdown.js.map +1 -1
  312. package/dist-es/file-drop-zone/FileDropZone.js +3 -0
  313. package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
  314. package/dist-es/file-drop-zone/FileDropZoneTrigger.js +3 -0
  315. package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  316. package/dist-es/flex-item/FlexItem.js +3 -0
  317. package/dist-es/flex-item/FlexItem.js.map +1 -1
  318. package/dist-es/flex-layout/FlexLayout.js +3 -0
  319. package/dist-es/flex-layout/FlexLayout.js.map +1 -1
  320. package/dist-es/form-field/FormField.js +3 -0
  321. package/dist-es/form-field/FormField.js.map +1 -1
  322. package/dist-es/form-field/FormFieldHelperText.js +3 -0
  323. package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
  324. package/dist-es/form-field/FormFieldLabel.js +3 -0
  325. package/dist-es/form-field/FormFieldLabel.js.map +1 -1
  326. package/dist-es/form-field-context/FormFieldContext.js +3 -0
  327. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  328. package/dist-es/grid-item/GridItem.js +3 -0
  329. package/dist-es/grid-item/GridItem.js.map +1 -1
  330. package/dist-es/grid-layout/GridLayout.js +3 -0
  331. package/dist-es/grid-layout/GridLayout.js.map +1 -1
  332. package/dist-es/index.js +4 -0
  333. package/dist-es/index.js.map +1 -1
  334. package/dist-es/input/Input.js +3 -0
  335. package/dist-es/input/Input.js.map +1 -1
  336. package/dist-es/interactable-card/InteractableCard.js +3 -0
  337. package/dist-es/interactable-card/InteractableCard.js.map +1 -1
  338. package/dist-es/interactable-card/InteractableCardGroup.js +3 -0
  339. package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
  340. package/dist-es/interactable-card/InteractableCardGroupContext.js +3 -0
  341. package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
  342. package/dist-es/link/Link.js +3 -0
  343. package/dist-es/link/Link.js.map +1 -1
  344. package/dist-es/link-card/LinkCard.js +3 -0
  345. package/dist-es/link-card/LinkCard.js.map +1 -1
  346. package/dist-es/list-box/ListBox.css.js +4 -0
  347. package/dist-es/list-box/ListBox.css.js.map +1 -0
  348. package/dist-es/list-box/ListBox.js +291 -0
  349. package/dist-es/list-box/ListBox.js.map +1 -0
  350. package/dist-es/list-control/ListControlContext.js +5 -1
  351. package/dist-es/list-control/ListControlContext.js.map +1 -1
  352. package/dist-es/list-control/ListControlState.js +79 -12
  353. package/dist-es/list-control/ListControlState.js.map +1 -1
  354. package/dist-es/menu/MenuBase.js +3 -0
  355. package/dist-es/menu/MenuBase.js.map +1 -1
  356. package/dist-es/menu/MenuContext.js +3 -0
  357. package/dist-es/menu/MenuContext.js.map +1 -1
  358. package/dist-es/menu/MenuGroup.css.js +1 -1
  359. package/dist-es/menu/MenuGroup.js +3 -0
  360. package/dist-es/menu/MenuGroup.js.map +1 -1
  361. package/dist-es/menu/MenuItem.css.js +1 -1
  362. package/dist-es/menu/MenuItem.js +3 -0
  363. package/dist-es/menu/MenuItem.js.map +1 -1
  364. package/dist-es/menu/MenuPanel.js +3 -0
  365. package/dist-es/menu/MenuPanel.js.map +1 -1
  366. package/dist-es/menu/MenuPanelContext.js +3 -0
  367. package/dist-es/menu/MenuPanelContext.js.map +1 -1
  368. package/dist-es/menu/MenuTrigger.js +3 -0
  369. package/dist-es/menu/MenuTrigger.js.map +1 -1
  370. package/dist-es/menu/MenuTriggerContext.js +3 -0
  371. package/dist-es/menu/MenuTriggerContext.js.map +1 -1
  372. package/dist-es/multiline-input/MultilineInput.js +3 -0
  373. package/dist-es/multiline-input/MultilineInput.js.map +1 -1
  374. package/dist-es/navigation-item/NavigationItem.js +3 -0
  375. package/dist-es/navigation-item/NavigationItem.js.map +1 -1
  376. package/dist-es/option/Option.css.js +1 -1
  377. package/dist-es/option/Option.js +7 -2
  378. package/dist-es/option/Option.js.map +1 -1
  379. package/dist-es/option/OptionGroup.css.js +1 -1
  380. package/dist-es/option/OptionGroup.js +3 -0
  381. package/dist-es/option/OptionGroup.js.map +1 -1
  382. package/dist-es/option/OptionList.js +3 -0
  383. package/dist-es/option/OptionList.js.map +1 -1
  384. package/dist-es/option/OptionListBase.js +3 -0
  385. package/dist-es/option/OptionListBase.js.map +1 -1
  386. package/dist-es/overlay/Overlay.js +3 -0
  387. package/dist-es/overlay/Overlay.js.map +1 -1
  388. package/dist-es/overlay/OverlayContext.js +3 -0
  389. package/dist-es/overlay/OverlayContext.js.map +1 -1
  390. package/dist-es/overlay/OverlayPanel.js +3 -0
  391. package/dist-es/overlay/OverlayPanel.js.map +1 -1
  392. package/dist-es/overlay/OverlayPanelCloseButton.js +3 -0
  393. package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
  394. package/dist-es/overlay/OverlayPanelContent.js +3 -0
  395. package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
  396. package/dist-es/overlay/OverlayTrigger.js +3 -0
  397. package/dist-es/overlay/OverlayTrigger.js.map +1 -1
  398. package/dist-es/pagination/CompactInput.js +3 -0
  399. package/dist-es/pagination/CompactInput.js.map +1 -1
  400. package/dist-es/pagination/CompactPaginator.js +3 -0
  401. package/dist-es/pagination/CompactPaginator.js.map +1 -1
  402. package/dist-es/pagination/GoToInput.js +3 -0
  403. package/dist-es/pagination/GoToInput.js.map +1 -1
  404. package/dist-es/pagination/PageButton.js +3 -0
  405. package/dist-es/pagination/PageButton.js.map +1 -1
  406. package/dist-es/pagination/PageRanges.js +3 -0
  407. package/dist-es/pagination/PageRanges.js.map +1 -1
  408. package/dist-es/pagination/Pagination.js +3 -0
  409. package/dist-es/pagination/Pagination.js.map +1 -1
  410. package/dist-es/pagination/Paginator.js +3 -0
  411. package/dist-es/pagination/Paginator.js.map +1 -1
  412. package/dist-es/panel/Panel.js +3 -0
  413. package/dist-es/panel/Panel.js.map +1 -1
  414. package/dist-es/parent-child-layout/ParentChildLayout.js +3 -0
  415. package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
  416. package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js +3 -0
  417. package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
  418. package/dist-es/pill/Pill.js +3 -0
  419. package/dist-es/pill/Pill.js.map +1 -1
  420. package/dist-es/pill-input/PillInput.js +3 -0
  421. package/dist-es/pill-input/PillInput.js.map +1 -1
  422. package/dist-es/progress/CircularProgress/CircularProgress.js +3 -0
  423. package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
  424. package/dist-es/progress/LinearProgress/LinearProgress.js +3 -0
  425. package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
  426. package/dist-es/radio-button/RadioButton.js +3 -0
  427. package/dist-es/radio-button/RadioButton.js.map +1 -1
  428. package/dist-es/radio-button/RadioButtonGroup.js +3 -0
  429. package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
  430. package/dist-es/radio-button/RadioButtonIcon.js +3 -0
  431. package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
  432. package/dist-es/radio-button/internal/RadioGroupContext.js +3 -0
  433. package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
  434. package/dist-es/salt-provider/SaltProvider.js +34 -10
  435. package/dist-es/salt-provider/SaltProvider.js.map +1 -1
  436. package/dist-es/scrim/Scrim.js +3 -0
  437. package/dist-es/scrim/Scrim.js.map +1 -1
  438. package/dist-es/segmented-button-group/SegmentedButtonGroup.js +3 -0
  439. package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
  440. package/dist-es/spinner/Spinner.js +3 -0
  441. package/dist-es/spinner/Spinner.js.map +1 -1
  442. package/dist-es/spinner/svgSpinners/SpinnerSVG.js +3 -0
  443. package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  444. package/dist-es/split-layout/SplitLayout.js +3 -0
  445. package/dist-es/split-layout/SplitLayout.js.map +1 -1
  446. package/dist-es/stack-layout/StackLayout.js +3 -0
  447. package/dist-es/stack-layout/StackLayout.js.map +1 -1
  448. package/dist-es/status-adornment/StatusAdornment.js +3 -0
  449. package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
  450. package/dist-es/status-indicator/StatusIndicator.js +3 -0
  451. package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
  452. package/dist-es/switch/Switch.js +3 -0
  453. package/dist-es/switch/Switch.js.map +1 -1
  454. package/dist-es/tag/Tag.css.js +4 -0
  455. package/dist-es/tag/Tag.css.js.map +1 -0
  456. package/dist-es/tag/Tag.js +133 -0
  457. package/dist-es/tag/Tag.js.map +1 -0
  458. package/dist-es/text/Text.css.js +1 -1
  459. package/dist-es/text/Text.js +3 -0
  460. package/dist-es/text/Text.js.map +1 -1
  461. package/dist-es/theme/ActionFont.js +4 -0
  462. package/dist-es/theme/ActionFont.js.map +1 -0
  463. package/dist-es/toast/Toast.js +3 -0
  464. package/dist-es/toast/Toast.js.map +1 -1
  465. package/dist-es/toast/ToastContent.js +3 -0
  466. package/dist-es/toast/ToastContent.js.map +1 -1
  467. package/dist-es/toggle-button/ToggleButton.css.js +1 -1
  468. package/dist-es/toggle-button/ToggleButton.js +3 -0
  469. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  470. package/dist-es/toggle-button-group/ToggleButtonGroup.js +3 -0
  471. package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  472. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +3 -0
  473. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  474. package/dist-es/tooltip/Tooltip.js +3 -0
  475. package/dist-es/tooltip/Tooltip.js.map +1 -1
  476. package/dist-es/tooltip/TooltipBase.js +3 -0
  477. package/dist-es/tooltip/TooltipBase.js.map +1 -1
  478. package/dist-es/tooltip/useAriaAnnounce.js +3 -0
  479. package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
  480. package/dist-es/tooltip/useTooltip.js +3 -0
  481. package/dist-es/tooltip/useTooltip.js.map +1 -1
  482. package/dist-es/utils/useValueEffect.js +3 -0
  483. package/dist-es/utils/useValueEffect.js.map +1 -1
  484. package/dist-es/viewport/ViewportProvider.js +3 -0
  485. package/dist-es/viewport/ViewportProvider.js.map +1 -1
  486. package/dist-types/combo-box/ComboBox.d.ts +8 -0
  487. package/dist-types/combo-box/useComboBox.d.ts +33 -2
  488. package/dist-types/divider/Divider.d.ts +12 -0
  489. package/dist-types/divider/index.d.ts +1 -0
  490. package/dist-types/index.d.ts +4 -1
  491. package/dist-types/list-box/ListBox.d.ts +40 -0
  492. package/dist-types/list-box/index.d.ts +1 -0
  493. package/dist-types/list-control/ListControlContext.d.ts +1 -0
  494. package/dist-types/list-control/ListControlState.d.ts +33 -2
  495. package/dist-types/salt-provider/SaltProvider.d.ts +3 -1
  496. package/dist-types/tag/Tag.d.ts +16 -0
  497. package/dist-types/tag/index.d.ts +1 -0
  498. package/dist-types/theme/ActionFont.d.ts +2 -0
  499. package/dist-types/theme/index.d.ts +1 -0
  500. package/package.json +2 -2
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { UserSolidIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, ReactNode } from \"react\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * The name that Avatar represents.\n */\n name?: string;\n /**\n * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n * If a function is not passed or returns undefined, Avatar will default to Icon.\n */\n nameToInitials?: NameToInitials;\n /**\n * Image src of Avatar.\n */\n src?: string;\n /**\n * Multiplier for the base avatar.\n */\n size?: number;\n /**\n * Icon to be used as a default item. Defaults to `UserIcon`\n */\n fallbackIcon?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n name\n ?.split(\" \")\n .slice(0, 2)\n .map((n) => n[0])\n .join(\"\")\n .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n {\n className,\n children: childrenProp,\n name,\n nameToInitials = defaultNameToInitials,\n src,\n size = DEFAULT_AVATAR_SIZE,\n style: styleProp,\n fallbackIcon = <UserSolidIcon aria-label=\"User Avatar\" />,\n ...rest\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-avatar\",\n css: avatarCss,\n window: targetWindow,\n });\n\n let children;\n\n const style = {\n ...styleProp,\n \"--saltAvatar-size-multiplier\": `${size}`,\n };\n\n const status = useAvatarImage({ src });\n const hasImgNotFailing = status === \"loaded\";\n if (hasImgNotFailing) {\n children = <img alt={name} src={src} />;\n } else if (childrenProp != null) {\n children = childrenProp;\n }\n\n const avatarInitials = nameToInitials(name);\n\n const initialsProps = avatarInitials\n ? {\n role: \"img\",\n \"aria-label\": name,\n }\n : {};\n\n return (\n <div\n ref={ref}\n style={style}\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withImage\")]: hasImgNotFailing },\n className\n )}\n {...initialsProps}\n {...rest}\n >\n {children || avatarInitials || fallbackIcon}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Avatar","jsx","UserSolidIcon","useWindow","useComponentCssInjection","avatarCss","useAvatarImage","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAC9C,MAAM,mBAAsB,GAAA,CAAA,CAAA;AAE5B,MAAM,qBAAwB,GAAA,CAAC,IAC7B,KAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CACI,MAAM,GACP,CAAA,CAAA,KAAA,CAAM,CAAG,EAAA,CAAA,CAAA,CACT,IAAI,CAAC,CAAA,KAAM,CAAE,CAAA,CAAA,CAAA,CAAA,CACb,KAAK,EACL,CAAA,CAAA,WAAA,EAAA,CAAA;AAEQ,MAAA,MAAA,GAASC,gBAAwC,CAAA,SAASC,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,cAAiB,GAAA,qBAAA;AAAA,EACjB,GAAA;AAAA,EACA,IAAO,GAAA,mBAAA;AAAA,EACP,KAAO,EAAA,SAAA;AAAA,EACP,+BAAgBC,cAAA,CAAAC,mBAAA,EAAA;AAAA,IAAc,YAAW,EAAA,aAAA;AAAA,GAAc,CAAA;AAAA,EACpD,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,QAAA,CAAA;AAEJ,EAAA,MAAM,KAAQ,GAAA;AAAA,IACZ,GAAG,SAAA;AAAA,IACH,gCAAgC,CAAG,EAAA,IAAA,CAAA,CAAA;AAAA,GACrC,CAAA;AAEA,EAAA,MAAM,MAAS,GAAAC,6BAAA,CAAe,EAAE,GAAA,EAAK,CAAA,CAAA;AACrC,EAAA,MAAM,mBAAmB,MAAW,KAAA,QAAA,CAAA;AACpC,EAAA,IAAI,gBAAkB,EAAA;AACpB,IAAA,QAAA,mBAAYL,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,GAAK,EAAA,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GACvC,MAAA,IAAW,gBAAgB,IAAM,EAAA;AAC/B,IAAW,QAAA,GAAA,YAAA,CAAA;AAAA,GACb;AAEA,EAAM,MAAA,cAAA,GAAiB,eAAe,IAAI,CAAA,CAAA;AAE1C,EAAA,MAAM,gBAAgB,cAClB,GAAA;AAAA,IACE,IAAM,EAAA,KAAA;AAAA,IACN,YAAc,EAAA,IAAA;AAAA,MAEhB,EAAC,CAAA;AAEL,EAAA,uBACGA,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,KAAA;AAAA,IACA,SAAW,EAAAM,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,WAAW,IAAI,gBAAiB,EAAA;AAAA,MAChD,SAAA;AAAA,KACF;AAAA,IACC,GAAG,aAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,sBAAY,cAAkB,IAAA,YAAA;AAAA,GACjC,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { UserSolidIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, ReactNode } from \"react\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * The name that Avatar represents.\n */\n name?: string;\n /**\n * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n * If a function is not passed or returns undefined, Avatar will default to Icon.\n */\n nameToInitials?: NameToInitials;\n /**\n * Image src of Avatar.\n */\n src?: string;\n /**\n * Multiplier for the base avatar.\n */\n size?: number;\n /**\n * Icon to be used as a default item. Defaults to `UserIcon`\n */\n fallbackIcon?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n name\n ?.split(\" \")\n .slice(0, 2)\n .map((n) => n[0])\n .join(\"\")\n .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n {\n className,\n children: childrenProp,\n name,\n nameToInitials = defaultNameToInitials,\n src,\n size = DEFAULT_AVATAR_SIZE,\n style: styleProp,\n fallbackIcon = <UserSolidIcon aria-label=\"User Avatar\" />,\n ...rest\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-avatar\",\n css: avatarCss,\n window: targetWindow,\n });\n\n let children;\n\n const style = {\n ...styleProp,\n \"--saltAvatar-size-multiplier\": `${size}`,\n };\n\n const status = useAvatarImage({ src });\n const hasImgNotFailing = status === \"loaded\";\n if (hasImgNotFailing) {\n children = <img alt={name} src={src} />;\n } else if (childrenProp != null) {\n children = childrenProp;\n }\n\n const avatarInitials = nameToInitials(name);\n\n const initialsProps = avatarInitials\n ? {\n role: \"img\",\n \"aria-label\": name,\n }\n : {};\n\n return (\n <div\n ref={ref}\n style={style}\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withImage\")]: hasImgNotFailing },\n className\n )}\n {...initialsProps}\n {...rest}\n >\n {children || avatarInitials || fallbackIcon}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Avatar","jsx","UserSolidIcon","useWindow","useComponentCssInjection","avatarCss","useAvatarImage","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAC9C,MAAM,mBAAsB,GAAA,CAAA,CAAA;AAE5B,MAAM,qBAAwB,GAAA,CAAC,IAC7B,KAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CACI,MAAM,GACP,CAAA,CAAA,KAAA,CAAM,CAAG,EAAA,CAAA,CAAA,CACT,IAAI,CAAC,CAAA,KAAM,CAAE,CAAA,CAAA,CAAA,CAAA,CACb,KAAK,EACL,CAAA,CAAA,WAAA,EAAA,CAAA;AAEQ,MAAA,MAAA,GAASC,gBAAwC,CAAA,SAASC,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,cAAiB,GAAA,qBAAA;AAAA,EACjB,GAAA;AAAA,EACA,IAAO,GAAA,mBAAA;AAAA,EACP,KAAO,EAAA,SAAA;AAAA,EACP,+BAAgBC,cAAA,CAAAC,mBAAA,EAAA;AAAA,IAAc,YAAW,EAAA,aAAA;AAAA,GAAc,CAAA;AAAA,EACpD,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,QAAA,CAAA;AAEJ,EAAA,MAAM,KAAQ,GAAA;AAAA,IACZ,GAAG,SAAA;AAAA,IACH,gCAAgC,CAAG,EAAA,IAAA,CAAA,CAAA;AAAA,GACrC,CAAA;AAEA,EAAA,MAAM,MAAS,GAAAC,6BAAA,CAAe,EAAE,GAAA,EAAK,CAAA,CAAA;AACrC,EAAA,MAAM,mBAAmB,MAAW,KAAA,QAAA,CAAA;AACpC,EAAA,IAAI,gBAAkB,EAAA;AACpB,IAAA,QAAA,mBAAYL,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,GAAK,EAAA,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GACvC,MAAA,IAAW,gBAAgB,IAAM,EAAA;AAC/B,IAAW,QAAA,GAAA,YAAA,CAAA;AAAA,GACb;AAEA,EAAM,MAAA,cAAA,GAAiB,eAAe,IAAI,CAAA,CAAA;AAE1C,EAAA,MAAM,gBAAgB,cAClB,GAAA;AAAA,IACE,IAAM,EAAA,KAAA;AAAA,IACN,YAAc,EAAA,IAAA;AAAA,MAEhB,EAAC,CAAA;AAEL,EAAA,uBACGA,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,KAAA;AAAA,IACA,SAAW,EAAAM,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,WAAW,IAAI,gBAAiB,EAAA;AAAA,MAChD,SAAA;AAAA,KACF;AAAA,IACC,GAAG,aAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,sBAAY,cAAkB,IAAA,YAAA;AAAA,GACjC,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"useAvatarImage.js","sources":["../src/avatar/useAvatarImage.ts"],"sourcesContent":["import { ImgHTMLAttributes, useEffect, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nexport function useAvatarImage({ src }: ImgHTMLAttributes<HTMLImageElement>) {\n const [status, setStatus] = useState<\n \"pending\" | \"loading\" | \"loaded\" | \"error\"\n >(\"loading\");\n\n useEffect(() => {\n setStatus(src ? \"loading\" : \"pending\");\n }, [src]);\n\n useIsomorphicLayoutEffect(() => {\n if (!src) {\n return;\n }\n\n let active = true;\n const image = new Image();\n image.src = src;\n const onLoad = () => active && setStatus(\"loaded\");\n const onError = () => active && setStatus(\"error\");\n\n image.addEventListener(\"load\", onLoad, { once: true });\n image.addEventListener(\"error\", onError, { once: true });\n\n return () => {\n image.removeEventListener(\"load\", onLoad);\n image.removeEventListener(\"load\", onError);\n active = false;\n };\n }, [src]);\n\n return status;\n}\n"],"names":["useState","useEffect","useIsomorphicLayoutEffect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGgB,SAAA,cAAA,CAAe,EAAE,GAAA,EAA4C,EAAA;AAC3E,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,eAE1B,SAAS,CAAA,CAAA;AAEX,EAAAC,eAAA,CAAU,MAAM;AACd,IAAU,SAAA,CAAA,GAAA,GAAM,YAAY,SAAS,CAAA,CAAA;AAAA,GACvC,EAAG,CAAC,GAAG,CAAC,CAAA,CAAA;AAER,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,GAAK,EAAA;AACR,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,IAAI,MAAS,GAAA,IAAA,CAAA;AACb,IAAM,MAAA,KAAA,GAAQ,IAAI,KAAM,EAAA,CAAA;AACxB,IAAA,KAAA,CAAM,GAAM,GAAA,GAAA,CAAA;AACZ,IAAA,MAAM,MAAS,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,QAAQ,CAAA,CAAA;AACjD,IAAA,MAAM,OAAU,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAEjD,IAAA,KAAA,CAAM,iBAAiB,MAAQ,EAAA,MAAA,EAAQ,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AACrD,IAAA,KAAA,CAAM,iBAAiB,OAAS,EAAA,OAAA,EAAS,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AAEvD,IAAA,OAAO,MAAM;AACX,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,MAAM,CAAA,CAAA;AACxC,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,OAAO,CAAA,CAAA;AACzC,MAAS,MAAA,GAAA,KAAA,CAAA;AAAA,KACX,CAAA;AAAA,GACF,EAAG,CAAC,GAAG,CAAC,CAAA,CAAA;AAER,EAAO,OAAA,MAAA,CAAA;AACT;;;;"}
1
+ {"version":3,"file":"useAvatarImage.js","sources":["../src/avatar/useAvatarImage.ts"],"sourcesContent":["import { ImgHTMLAttributes, useEffect, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nexport function useAvatarImage({ src }: ImgHTMLAttributes<HTMLImageElement>) {\n const [status, setStatus] = useState<\n \"pending\" | \"loading\" | \"loaded\" | \"error\"\n >(\"loading\");\n\n useEffect(() => {\n setStatus(src ? \"loading\" : \"pending\");\n }, [src]);\n\n useIsomorphicLayoutEffect(() => {\n if (!src) {\n return;\n }\n\n let active = true;\n const image = new Image();\n image.src = src;\n const onLoad = () => active && setStatus(\"loaded\");\n const onError = () => active && setStatus(\"error\");\n\n image.addEventListener(\"load\", onLoad, { once: true });\n image.addEventListener(\"error\", onError, { once: true });\n\n return () => {\n image.removeEventListener(\"load\", onLoad);\n image.removeEventListener(\"load\", onError);\n active = false;\n };\n }, [src]);\n\n return status;\n}\n"],"names":["useState","useEffect","useIsomorphicLayoutEffect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGgB,SAAA,cAAA,CAAe,EAAE,GAAA,EAA4C,EAAA;AAC3E,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,eAE1B,SAAS,CAAA,CAAA;AAEX,EAAAC,eAAA,CAAU,MAAM;AACd,IAAU,SAAA,CAAA,GAAA,GAAM,YAAY,SAAS,CAAA,CAAA;AAAA,GACvC,EAAG,CAAC,GAAG,CAAC,CAAA,CAAA;AAER,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,GAAK,EAAA;AACR,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,IAAI,MAAS,GAAA,IAAA,CAAA;AACb,IAAM,MAAA,KAAA,GAAQ,IAAI,KAAM,EAAA,CAAA;AACxB,IAAA,KAAA,CAAM,GAAM,GAAA,GAAA,CAAA;AACZ,IAAA,MAAM,MAAS,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,QAAQ,CAAA,CAAA;AACjD,IAAA,MAAM,OAAU,GAAA,MAAM,MAAU,IAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAEjD,IAAA,KAAA,CAAM,iBAAiB,MAAQ,EAAA,MAAA,EAAQ,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AACrD,IAAA,KAAA,CAAM,iBAAiB,OAAS,EAAA,OAAA,EAAS,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AAEvD,IAAA,OAAO,MAAM;AACX,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,MAAM,CAAA,CAAA;AACxC,MAAM,KAAA,CAAA,mBAAA,CAAoB,QAAQ,OAAO,CAAA,CAAA;AACzC,MAAS,MAAA,GAAA,KAAA,CAAA;AAAA,KACX,CAAA;AAAA,GACF,EAAG,CAAC,GAAG,CAAC,CAAA,CAAA;AAER,EAAO,OAAA,MAAA,CAAA;AACT;;;;"}
@@ -36,6 +36,7 @@ require('../dialog/DialogActions.js');
36
36
  require('../dialog/DialogContent.js');
37
37
  require('../dialog/DialogContext.js');
38
38
  require('../dialog/DialogCloseButton.js');
39
+ require('../divider/Divider.js');
39
40
  require('../drawer/Drawer.js');
40
41
  require('../drawer/DrawerCloseButton.js');
41
42
  require('../dropdown/Dropdown.js');
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
63
64
  require('../interactable-card/InteractableCardGroupContext.js');
64
65
  require('../link/Link.js');
65
66
  require('../link-card/LinkCard.js');
67
+ require('../list-box/ListBox.js');
66
68
  require('../list-control/ListControlContext.js');
67
69
  require('../menu/MenuContext.js');
68
70
  require('@floating-ui/react');
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
100
102
  require('../toast/ToastContent.js');
101
103
  require('../split-layout/SplitLayout.js');
102
104
  require('../switch/Switch.js');
105
+ require('../tag/Tag.js');
103
106
  require('../toggle-button/ToggleButton.js');
104
107
  require('../toggle-button-group/ToggleButtonGroup.js');
105
108
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"Badge.js","sources":["../src/badge/Badge.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, ReactNode } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport badgeCss from \"./Badge.css\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * The number to display on the badge\n */\n value: number | string;\n /**\n * If a child is provided the Badge will render top right. By defualt renders inline.\n */\n children?: ReactNode;\n /**\n * The max number to display on the badge.\n */\n max?: number;\n}\nconst withBaseName = makePrefixer(\"saltBadge\");\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge(\n { value, max = 999, className, children, ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-badge\",\n css: badgeCss,\n window: targetWindow,\n });\n\n const valueText =\n typeof value === \"number\" && value > max ? `${max}+` : value;\n\n return (\n <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n {children}\n <span\n className={clsx(withBaseName(\"badge\"), {\n [withBaseName(\"topRight\")]: children,\n })}\n >\n {valueText}\n </span>\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","Badge","useWindow","useComponentCssInjection","badgeCss","jsxs","clsx","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEtC,MAAM,KAAQ,GAAAC,gBAAA,CAAwC,SAASC,MAAAA,CACpE,EAAE,KAAA,EAAO,GAAM,GAAA,GAAA,EAAK,SAAW,EAAA,QAAA,EAAA,GAAa,IAAK,EAAA,EACjD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,YACJ,OAAO,KAAA,KAAU,YAAY,KAAQ,GAAA,GAAA,GAAM,GAAG,GAAS,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA;AAEzD,EAAA,uBACGC,eAAA,CAAA,MAAA,EAAA;AAAA,IAAK,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAG,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7D,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACAC,cAAA,CAAA,MAAA,EAAA;AAAA,QACC,SAAW,EAAAD,SAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,UACrC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,SAC7B,CAAA;AAAA,QAEA,QAAA,EAAA,SAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"Badge.js","sources":["../src/badge/Badge.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, ReactNode } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport badgeCss from \"./Badge.css\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * The number to display on the badge\n */\n value: number | string;\n /**\n * If a child is provided the Badge will render top right. By defualt renders inline.\n */\n children?: ReactNode;\n /**\n * The max number to display on the badge.\n */\n max?: number;\n}\nconst withBaseName = makePrefixer(\"saltBadge\");\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge(\n { value, max = 999, className, children, ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-badge\",\n css: badgeCss,\n window: targetWindow,\n });\n\n const valueText =\n typeof value === \"number\" && value > max ? `${max}+` : value;\n\n return (\n <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n {children}\n <span\n className={clsx(withBaseName(\"badge\"), {\n [withBaseName(\"topRight\")]: children,\n })}\n >\n {valueText}\n </span>\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","Badge","useWindow","useComponentCssInjection","badgeCss","jsxs","clsx","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEtC,MAAM,KAAQ,GAAAC,gBAAA,CAAwC,SAASC,MAAAA,CACpE,EAAE,KAAA,EAAO,GAAM,GAAA,GAAA,EAAK,SAAW,EAAA,QAAA,EAAA,GAAa,IAAK,EAAA,EACjD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,YACJ,OAAO,KAAA,KAAU,YAAY,KAAQ,GAAA,GAAA,GAAM,GAAG,GAAS,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA;AAEzD,EAAA,uBACGC,eAAA,CAAA,MAAA,EAAA;AAAA,IAAK,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAG,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7D,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACAC,cAAA,CAAA,MAAA,EAAA;AAAA,QACC,SAAW,EAAAD,SAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,UACrC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,SAC7B,CAAA;AAAA,QAEA,QAAA,EAAA,SAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -36,6 +36,7 @@ require('../dialog/DialogActions.js');
36
36
  require('../dialog/DialogContent.js');
37
37
  require('../dialog/DialogContext.js');
38
38
  require('../dialog/DialogCloseButton.js');
39
+ require('../divider/Divider.js');
39
40
  require('../drawer/Drawer.js');
40
41
  require('../drawer/DrawerCloseButton.js');
41
42
  require('../dropdown/Dropdown.js');
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
63
64
  require('../interactable-card/InteractableCardGroupContext.js');
64
65
  require('../link/Link.js');
65
66
  require('../link-card/LinkCard.js');
67
+ require('../list-box/ListBox.js');
66
68
  require('../list-control/ListControlContext.js');
67
69
  require('../menu/MenuContext.js');
68
70
  require('@floating-ui/react');
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
100
102
  require('../toast/ToastContent.js');
101
103
  require('../split-layout/SplitLayout.js');
102
104
  require('../switch/Switch.js');
105
+ require('../tag/Tag.js');
103
106
  require('../toggle-button/ToggleButton.js');
104
107
  require('../toggle-button-group/ToggleButtonGroup.js');
105
108
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"Banner.js","sources":["../src/banner/Banner.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { clsx } from \"clsx\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport bannerCss from \"./Banner.css\";\n\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Emphasize the styling by applying a background color: defaults to false\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * A string to determine the current state of the Banner\n */\n status?: ValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltBanner\");\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n { children, className, variant = \"primary\", status = \"info\", ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner\",\n css: bannerCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(status),\n withBaseName(variant),\n className\n )}\n ref={ref}\n {...rest}\n aria-live=\"polite\"\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Banner","useWindow","useComponentCssInjection","bannerCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,MAAS,GAAAC,gBAAA,CAAwC,SAASC,OAAAA,CACrE,EAAE,QAAA,EAAU,SAAW,EAAA,OAAA,GAAU,SAAW,EAAA,MAAA,GAAS,MAAW,EAAA,GAAA,IAAA,IAChE,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,MAAM,CAAA;AAAA,MACnB,aAAa,OAAO,CAAA;AAAA,MACpB,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IACJ,WAAU,EAAA,QAAA;AAAA,IAEV,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,+BAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"Banner.js","sources":["../src/banner/Banner.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { clsx } from \"clsx\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport bannerCss from \"./Banner.css\";\n\nexport interface BannerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Emphasize the styling by applying a background color: defaults to false\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * A string to determine the current state of the Banner\n */\n status?: ValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltBanner\");\n\nexport const Banner = forwardRef<HTMLDivElement, BannerProps>(function Banner(\n { children, className, variant = \"primary\", status = \"info\", ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner\",\n css: bannerCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(status),\n withBaseName(variant),\n className\n )}\n ref={ref}\n {...rest}\n aria-live=\"polite\"\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Banner","useWindow","useComponentCssInjection","bannerCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,MAAS,GAAAC,gBAAA,CAAwC,SAASC,OAAAA,CACrE,EAAE,QAAA,EAAU,SAAW,EAAA,OAAA,GAAU,SAAW,EAAA,MAAA,GAAS,MAAW,EAAA,GAAA,IAAA,IAChE,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,MAAM,CAAA;AAAA,MACnB,aAAa,OAAO,CAAA;AAAA,MACpB,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IACJ,WAAU,EAAA,QAAA;AAAA,IAEV,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,+BAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -36,6 +36,7 @@ require('../dialog/DialogActions.js');
36
36
  require('../dialog/DialogContent.js');
37
37
  require('../dialog/DialogContext.js');
38
38
  require('../dialog/DialogCloseButton.js');
39
+ require('../divider/Divider.js');
39
40
  require('../drawer/Drawer.js');
40
41
  require('../drawer/DrawerCloseButton.js');
41
42
  require('../dropdown/Dropdown.js');
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
63
64
  require('../interactable-card/InteractableCardGroupContext.js');
64
65
  require('../link/Link.js');
65
66
  require('../link-card/LinkCard.js');
67
+ require('../list-box/ListBox.js');
66
68
  require('../list-control/ListControlContext.js');
67
69
  require('../menu/MenuContext.js');
68
70
  require('@floating-ui/react');
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
100
102
  require('../toast/ToastContent.js');
101
103
  require('../split-layout/SplitLayout.js');
102
104
  require('../switch/Switch.js');
105
+ require('../tag/Tag.js');
103
106
  require('../toggle-button/ToggleButton.js');
104
107
  require('../toggle-button-group/ToggleButtonGroup.js');
105
108
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"BannerActions.js","sources":["../src/banner/BannerActions.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerActionsCss from \"./BannerActions.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst withBaseName = makePrefixer(\"saltBannerActions\");\n\ninterface BannerActionsProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of BannerActions\n */\n children: ReactNode;\n}\n\nexport const BannerActions = forwardRef<HTMLDivElement, BannerActionsProps>(\n function BannerActions(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner-actions\",\n css: bannerActionsCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","BannerActions","useWindow","useComponentCssInjection","bannerActionsCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA,CAAA;AAS9C,MAAM,aAAgB,GAAAC,gBAAA;AAAA,EAC3B,SAASC,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,eAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}
1
+ {"version":3,"file":"BannerActions.js","sources":["../src/banner/BannerActions.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerActionsCss from \"./BannerActions.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst withBaseName = makePrefixer(\"saltBannerActions\");\n\ninterface BannerActionsProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of BannerActions\n */\n children: ReactNode;\n}\n\nexport const BannerActions = forwardRef<HTMLDivElement, BannerActionsProps>(\n function BannerActions(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner-actions\",\n css: bannerActionsCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","BannerActions","useWindow","useComponentCssInjection","bannerActionsCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA,CAAA;AAS9C,MAAM,aAAgB,GAAAC,gBAAA;AAAA,EAC3B,SAASC,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,eAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}
@@ -36,6 +36,7 @@ require('../dialog/DialogActions.js');
36
36
  require('../dialog/DialogContent.js');
37
37
  require('../dialog/DialogContext.js');
38
38
  require('../dialog/DialogCloseButton.js');
39
+ require('../divider/Divider.js');
39
40
  require('../drawer/Drawer.js');
40
41
  require('../drawer/DrawerCloseButton.js');
41
42
  require('../dropdown/Dropdown.js');
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
63
64
  require('../interactable-card/InteractableCardGroupContext.js');
64
65
  require('../link/Link.js');
65
66
  require('../link-card/LinkCard.js');
67
+ require('../list-box/ListBox.js');
66
68
  require('../list-control/ListControlContext.js');
67
69
  require('../menu/MenuContext.js');
68
70
  require('@floating-ui/react');
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
100
102
  require('../toast/ToastContent.js');
101
103
  require('../split-layout/SplitLayout.js');
102
104
  require('../switch/Switch.js');
105
+ require('../tag/Tag.js');
103
106
  require('../toggle-button/ToggleButton.js');
104
107
  require('../toggle-button-group/ToggleButtonGroup.js');
105
108
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"BannerContent.js","sources":["../src/banner/BannerContent.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerContentCss from \"./BannerContent.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst withBaseName = makePrefixer(\"saltBannerContent\");\n\ninterface BannerContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of BannerContent\n */\n children: ReactNode;\n}\n\nexport const BannerContent = forwardRef<HTMLDivElement, BannerContentProps>(\n function BannerContent(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner-content\",\n css: bannerContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","BannerContent","useWindow","useComponentCssInjection","bannerContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA,CAAA;AAS9C,MAAM,aAAgB,GAAAC,gBAAA;AAAA,EAC3B,SAASC,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,eAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}
1
+ {"version":3,"file":"BannerContent.js","sources":["../src/banner/BannerContent.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\n\nimport bannerContentCss from \"./BannerContent.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nconst withBaseName = makePrefixer(\"saltBannerContent\");\n\ninterface BannerContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of BannerContent\n */\n children: ReactNode;\n}\n\nexport const BannerContent = forwardRef<HTMLDivElement, BannerContentProps>(\n function BannerContent(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-banner-content\",\n css: bannerContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref} />\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","BannerContent","useWindow","useComponentCssInjection","bannerContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA,CAAA;AAS9C,MAAM,aAAgB,GAAAC,gBAAA;AAAA,EAC3B,SAASC,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,eAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,IAAA;AAAA,MAAM,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}
@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
38
38
  require('../dialog/DialogContent.js');
39
39
  require('../dialog/DialogContext.js');
40
40
  require('../dialog/DialogCloseButton.js');
41
+ require('../divider/Divider.js');
41
42
  require('../drawer/Drawer.js');
42
43
  require('../drawer/DrawerCloseButton.js');
43
44
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"BorderItem.js","sources":["../src/border-item/BorderItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { GridItem, GridItemProps } from \"../grid-item\";\nimport borderItemCss from \"./BorderItem.css\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const BORDER_POSITION = [\n \"north\",\n \"west\",\n \"center\",\n \"east\",\n \"south\",\n] as const;\n\nexport type BorderPosition = (typeof BORDER_POSITION)[number];\n\nexport type BorderItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridItemProps<T>[\"horizontalAlignment\"];\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridItemProps<T>[\"verticalAlignment\"];\n /**\n * Position in the Border Layout\n */\n position: BorderPosition;\n /**\n * Defines if the item should stick to the edges of its container. Defaults to \"false\"\n */\n sticky?: boolean;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderItem\");\n\ntype BorderItemComponent = <T extends ElementType = \"div\">(\n props: BorderItemProps<T>\n) => ReactElement | null;\n\nexport const BorderItem: BorderItemComponent = forwardRef(\n <T extends ElementType>(\n {\n children,\n className,\n position,\n sticky = false,\n style,\n ...rest\n }: BorderItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-border-item\",\n css: borderItemCss,\n window: targetWindow,\n });\n\n const gridItemStyles = {\n ...style,\n \"--gridItem-gridArea\": position,\n };\n\n return (\n <GridItem\n ref={ref}\n className={clsx(\n withBaseName(),\n \"saltGridItem-area\",\n {\n [withBaseName(\"sticky\")]: sticky,\n },\n className\n )}\n style={gridItemStyles}\n {...rest}\n >\n {children}\n </GridItem>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","borderItemCss","jsx","GridItem","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,eAAkB,GAAA;AAAA,EAC7B,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AACF,EAAA;AA2BA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAM3C,MAAM,UAAkC,GAAAC,gBAAA;AAAA,EAC7C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAS,GAAA,KAAA;AAAA,IACT,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,cAAiB,GAAA;AAAA,MACrB,GAAG,KAAA;AAAA,MACH,qBAAuB,EAAA,QAAA;AAAA,KACzB,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,iBAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,mBAAA;AAAA,QACA;AAAA,UACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,KAAO,EAAA,cAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
1
+ {"version":3,"file":"BorderItem.js","sources":["../src/border-item/BorderItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { GridItem, GridItemProps } from \"../grid-item\";\nimport borderItemCss from \"./BorderItem.css\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const BORDER_POSITION = [\n \"north\",\n \"west\",\n \"center\",\n \"east\",\n \"south\",\n] as const;\n\nexport type BorderPosition = (typeof BORDER_POSITION)[number];\n\nexport type BorderItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridItemProps<T>[\"horizontalAlignment\"];\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridItemProps<T>[\"verticalAlignment\"];\n /**\n * Position in the Border Layout\n */\n position: BorderPosition;\n /**\n * Defines if the item should stick to the edges of its container. Defaults to \"false\"\n */\n sticky?: boolean;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderItem\");\n\ntype BorderItemComponent = <T extends ElementType = \"div\">(\n props: BorderItemProps<T>\n) => ReactElement | null;\n\nexport const BorderItem: BorderItemComponent = forwardRef(\n <T extends ElementType>(\n {\n children,\n className,\n position,\n sticky = false,\n style,\n ...rest\n }: BorderItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-border-item\",\n css: borderItemCss,\n window: targetWindow,\n });\n\n const gridItemStyles = {\n ...style,\n \"--gridItem-gridArea\": position,\n };\n\n return (\n <GridItem\n ref={ref}\n className={clsx(\n withBaseName(),\n \"saltGridItem-area\",\n {\n [withBaseName(\"sticky\")]: sticky,\n },\n className\n )}\n style={gridItemStyles}\n {...rest}\n >\n {children}\n </GridItem>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","borderItemCss","jsx","GridItem","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,eAAkB,GAAA;AAAA,EAC7B,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AACF,EAAA;AA2BA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAM3C,MAAM,UAAkC,GAAAC,gBAAA;AAAA,EAC7C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAS,GAAA,KAAA;AAAA,IACT,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,cAAiB,GAAA;AAAA,MACrB,GAAG,KAAA;AAAA,MACH,qBAAuB,EAAA,QAAA;AAAA,KACzB,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,iBAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,mBAAA;AAAA,QACA;AAAA,UACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,KAAO,EAAA,cAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
63
64
  require('../interactable-card/InteractableCardGroupContext.js');
64
65
  require('../link/Link.js');
65
66
  require('../link-card/LinkCard.js');
67
+ require('../list-box/ListBox.js');
66
68
  require('../list-control/ListControlContext.js');
67
69
  require('../menu/MenuContext.js');
68
70
  require('@floating-ui/react');
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
100
102
  require('../toast/ToastContent.js');
101
103
  require('../split-layout/SplitLayout.js');
102
104
  require('../switch/Switch.js');
105
+ require('../tag/Tag.js');
103
106
  require('../toggle-button/ToggleButton.js');
104
107
  require('../toggle-button-group/ToggleButtonGroup.js');
105
108
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"BorderLayout.js","sources":["../src/border-layout/BorderLayout.tsx"],"sourcesContent":["import {\n Children,\n forwardRef,\n ReactElement,\n useEffect,\n ElementType,\n} from \"react\";\nimport { clsx } from \"clsx\";\n\nimport { GridLayout, GridLayoutProps } from \"../grid-layout\";\nimport {\n makePrefixer,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport { BorderItemProps } from \"../border-item\";\n\nexport type BorderLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 0\n */\n gap?: GridLayoutProps<T>[\"gap\"];\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 0\n */\n columnGap?: GridLayoutProps<T>[\"columnGap\"];\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 0\n */\n rowGap?: GridLayoutProps<T>[\"rowGap\"];\n /**\n * Border item components to be rendered.\n */\n children: ReactElement<BorderItemProps<T>>[];\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderLayout\");\n\nconst numberOfColumns = 3;\n\ntype BorderLayoutComponent = <T extends ElementType = \"div\">(\n props: BorderLayoutProps<T>\n) => ReactElement | null;\n\nexport const BorderLayout: BorderLayoutComponent = forwardRef(\n <T extends ElementType>(\n { children, className, gap, style, ...rest }: BorderLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const borderAreas = Children.map(\n children,\n (child: ReactElement<BorderItemProps<T>>) => child.props.position\n );\n\n const topSection = borderAreas.includes(\"north\")\n ? \"north \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const leftSection = borderAreas.includes(\"west\") ? \"west\" : \"center\";\n\n const rightSection = borderAreas.includes(\"east\") ? \"east\" : \"center\";\n\n const midSection = `${leftSection} center ${rightSection}`;\n\n const bottomSection = borderAreas.includes(\"south\")\n ? \"south \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const gridTemplateAreas = `\"${topSection}\" \"${midSection}\" \"${bottomSection}\"`;\n\n const hasMainSection = borderAreas.includes(\"center\");\n\n useEffect(() => {\n if (process.env.NODE_ENV !== \"production\") {\n if (!hasMainSection) {\n console.warn(\n \"No main section has been found. A main section should be provided.\"\n );\n }\n }\n }, [hasMainSection]);\n\n const borderLayoutStyles = {\n ...style,\n \"--gridLayout-gridTemplate\": gridTemplateAreas,\n };\n\n return (\n <GridLayout\n className={clsx(withBaseName(), className, \"saltGridLayout-area\")}\n columns={numberOfColumns}\n gap={gap || 0}\n style={borderLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </GridLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Children","useEffect","jsx","GridLayout","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAEpD,MAAM,eAAkB,GAAA,CAAA,CAAA;AAMjB,MAAM,YAAsC,GAAAC,gBAAA;AAAA,EACjD,CACE,EAAE,QAAU,EAAA,SAAA,EAAW,KAAK,KAAU,EAAA,GAAA,IAAA,IACtC,GACG,KAAA;AACH,IAAA,MAAM,cAAcC,cAAS,CAAA,GAAA;AAAA,MAC3B,QAAA;AAAA,MACA,CAAC,KAA4C,KAAA,KAAA,CAAM,KAAM,CAAA,QAAA;AAAA,KAC3D,CAAA;AAEA,IAAM,MAAA,UAAA,GAAa,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC3C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAA,MAAM,WAAc,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE5D,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE7D,IAAM,MAAA,UAAA,GAAa,GAAG,WAAsB,CAAA,QAAA,EAAA,YAAA,CAAA,CAAA,CAAA;AAE5C,IAAM,MAAA,aAAA,GAAgB,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC9C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAM,MAAA,iBAAA,GAAoB,CAAI,CAAA,EAAA,UAAA,CAAA,GAAA,EAAgB,UAAgB,CAAA,GAAA,EAAA,aAAA,CAAA,CAAA,CAAA,CAAA;AAE9D,IAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,QAAA,CAAS,QAAQ,CAAA,CAAA;AAEpD,IAAAC,eAAA,CAAU,MAAM;AACd,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,UAAQ,OAAA,CAAA,IAAA;AAAA,YACN,oEAAA;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,EAAG,CAAC,cAAc,CAAC,CAAA,CAAA;AAEnB,IAAA,MAAM,kBAAqB,GAAA;AAAA,MACzB,GAAG,KAAA;AAAA,MACH,2BAA6B,EAAA,iBAAA;AAAA,KAC/B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,WAAW,qBAAqB,CAAA;AAAA,MAChE,OAAS,EAAA,eAAA;AAAA,MACT,KAAK,GAAO,IAAA,CAAA;AAAA,MACZ,KAAO,EAAA,kBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"BorderLayout.js","sources":["../src/border-layout/BorderLayout.tsx"],"sourcesContent":["import {\n Children,\n forwardRef,\n ReactElement,\n useEffect,\n ElementType,\n} from \"react\";\nimport { clsx } from \"clsx\";\n\nimport { GridLayout, GridLayoutProps } from \"../grid-layout\";\nimport {\n makePrefixer,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport { BorderItemProps } from \"../border-item\";\n\nexport type BorderLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 0\n */\n gap?: GridLayoutProps<T>[\"gap\"];\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 0\n */\n columnGap?: GridLayoutProps<T>[\"columnGap\"];\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 0\n */\n rowGap?: GridLayoutProps<T>[\"rowGap\"];\n /**\n * Border item components to be rendered.\n */\n children: ReactElement<BorderItemProps<T>>[];\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltBorderLayout\");\n\nconst numberOfColumns = 3;\n\ntype BorderLayoutComponent = <T extends ElementType = \"div\">(\n props: BorderLayoutProps<T>\n) => ReactElement | null;\n\nexport const BorderLayout: BorderLayoutComponent = forwardRef(\n <T extends ElementType>(\n { children, className, gap, style, ...rest }: BorderLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const borderAreas = Children.map(\n children,\n (child: ReactElement<BorderItemProps<T>>) => child.props.position\n );\n\n const topSection = borderAreas.includes(\"north\")\n ? \"north \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const leftSection = borderAreas.includes(\"west\") ? \"west\" : \"center\";\n\n const rightSection = borderAreas.includes(\"east\") ? \"east\" : \"center\";\n\n const midSection = `${leftSection} center ${rightSection}`;\n\n const bottomSection = borderAreas.includes(\"south\")\n ? \"south \".repeat(numberOfColumns)\n : \"none \".repeat(numberOfColumns);\n\n const gridTemplateAreas = `\"${topSection}\" \"${midSection}\" \"${bottomSection}\"`;\n\n const hasMainSection = borderAreas.includes(\"center\");\n\n useEffect(() => {\n if (process.env.NODE_ENV !== \"production\") {\n if (!hasMainSection) {\n console.warn(\n \"No main section has been found. A main section should be provided.\"\n );\n }\n }\n }, [hasMainSection]);\n\n const borderLayoutStyles = {\n ...style,\n \"--gridLayout-gridTemplate\": gridTemplateAreas,\n };\n\n return (\n <GridLayout\n className={clsx(withBaseName(), className, \"saltGridLayout-area\")}\n columns={numberOfColumns}\n gap={gap || 0}\n style={borderLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </GridLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Children","useEffect","jsx","GridLayout","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAEpD,MAAM,eAAkB,GAAA,CAAA,CAAA;AAMjB,MAAM,YAAsC,GAAAC,gBAAA;AAAA,EACjD,CACE,EAAE,QAAU,EAAA,SAAA,EAAW,KAAK,KAAU,EAAA,GAAA,IAAA,IACtC,GACG,KAAA;AACH,IAAA,MAAM,cAAcC,cAAS,CAAA,GAAA;AAAA,MAC3B,QAAA;AAAA,MACA,CAAC,KAA4C,KAAA,KAAA,CAAM,KAAM,CAAA,QAAA;AAAA,KAC3D,CAAA;AAEA,IAAM,MAAA,UAAA,GAAa,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC3C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAA,MAAM,WAAc,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE5D,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,QAAS,CAAA,MAAM,IAAI,MAAS,GAAA,QAAA,CAAA;AAE7D,IAAM,MAAA,UAAA,GAAa,GAAG,WAAsB,CAAA,QAAA,EAAA,YAAA,CAAA,CAAA,CAAA;AAE5C,IAAM,MAAA,aAAA,GAAgB,WAAY,CAAA,QAAA,CAAS,OAAO,CAAA,GAC9C,QAAS,CAAA,MAAA,CAAO,eAAe,CAAA,GAC/B,OAAQ,CAAA,MAAA,CAAO,eAAe,CAAA,CAAA;AAElC,IAAM,MAAA,iBAAA,GAAoB,CAAI,CAAA,EAAA,UAAA,CAAA,GAAA,EAAgB,UAAgB,CAAA,GAAA,EAAA,aAAA,CAAA,CAAA,CAAA,CAAA;AAE9D,IAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,QAAA,CAAS,QAAQ,CAAA,CAAA;AAEpD,IAAAC,eAAA,CAAU,MAAM;AACd,MAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,QAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,UAAQ,OAAA,CAAA,IAAA;AAAA,YACN,oEAAA;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,EAAG,CAAC,cAAc,CAAC,CAAA,CAAA;AAEnB,IAAA,MAAM,kBAAqB,GAAA;AAAA,MACzB,GAAG,KAAA;AAAA,MACH,2BAA6B,EAAA,iBAAA;AAAA,KAC/B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,WAAW,qBAAqB,CAAA;AAAA,MAChE,OAAS,EAAA,eAAA;AAAA,MACT,KAAK,GAAO,IAAA,CAAA;AAAA,MACZ,KAAO,EAAA,kBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"BreakpointProvider.js","sources":["../src/breakpoints/BreakpointProvider.tsx"],"sourcesContent":["import { createContext, useIsomorphicLayoutEffect } from \"../utils\";\nimport { ReactNode, useContext, useState } from \"react\";\nimport { Breakpoints } from \"./Breakpoints\";\n\ntype Breakpoint = keyof Breakpoints;\n\ninterface BreakpointContext {\n matchedBreakpoints: Breakpoint[];\n}\n\nconst Context = createContext<BreakpointContext>(\"BreakpointContext\", {\n matchedBreakpoints: [],\n});\n\ninterface BreakpointProviderProps {\n children?: ReactNode;\n matchedBreakpoints: Breakpoint[];\n}\n\nexport function BreakpointProvider(props: BreakpointProviderProps) {\n const { children, matchedBreakpoints } = props;\n\n return (\n <Context.Provider value={{ matchedBreakpoints }}>\n {children}\n </Context.Provider>\n );\n}\n\nexport function useMatchedBreakpoints(breakpoints: Breakpoints): Breakpoint[] {\n const entries = Object.entries(breakpoints).sort(([, a], [, b]) => b - a);\n const queries = entries.map(([, value]) => `(min-width: ${value}px)`);\n\n const supportsMatchMedia =\n typeof window !== \"undefined\" && typeof window.matchMedia === \"function\";\n\n const [matchedBreakpoints, setMatchedBreakpoints] = useState<\n Partial<Record<Breakpoint, boolean>>\n >(Object.fromEntries(entries.map(([bp]) => [bp as Breakpoint, false])));\n\n useIsomorphicLayoutEffect(() => {\n if (!supportsMatchMedia) {\n return;\n }\n\n const matchers = queries.map((query, index) => {\n const mq = window.matchMedia(query);\n const bp = entries[index][0] as Breakpoint;\n\n return {\n mq,\n handler: () => {\n setMatchedBreakpoints((prev) => {\n return {\n ...prev,\n [bp]: mq.matches,\n };\n });\n },\n };\n });\n\n matchers.forEach(({ mq, handler }) => {\n handler();\n mq.addEventListener(\"change\", handler);\n });\n\n return () => {\n matchers.forEach(({ mq, handler }) => {\n mq.removeEventListener(\"change\", handler);\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [supportsMatchMedia]);\n\n return Object.keys(matchedBreakpoints).filter(\n (bp) => matchedBreakpoints[bp as Breakpoint]\n ) as Breakpoint[];\n}\n\nexport function useBreakpoint(): BreakpointContext & {\n breakpoint: Breakpoint | null;\n} {\n const { matchedBreakpoints } = useContext(Context);\n\n return {\n matchedBreakpoints,\n breakpoint: matchedBreakpoints[0] ?? null,\n };\n}\n"],"names":["createContext","jsx","useState","useIsomorphicLayoutEffect","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,OAAA,GAAUA,4BAAiC,mBAAqB,EAAA;AAAA,EACpE,oBAAoB,EAAC;AACvB,CAAC,CAAA,CAAA;AAOM,SAAS,mBAAmB,KAAgC,EAAA;AACjE,EAAM,MAAA,EAAE,QAAU,EAAA,kBAAA,EAAuB,GAAA,KAAA,CAAA;AAEzC,EACE,uBAAAC,cAAA,CAAC,QAAQ,QAAR,EAAA;AAAA,IAAiB,KAAA,EAAO,EAAE,kBAAmB,EAAA;AAAA,IAC3C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,sBAAsB,WAAwC,EAAA;AAC5E,EAAA,MAAM,UAAU,MAAO,CAAA,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA,KAAM,IAAI,CAAC,CAAA,CAAA;AACxE,EAAM,MAAA,OAAA,GAAU,QAAQ,GAAI,CAAA,CAAC,GAAG,KAAK,CAAM,KAAA,CAAA,YAAA,EAAe,KAAU,CAAA,GAAA,CAAA,CAAA,CAAA;AAEpE,EAAA,MAAM,qBACJ,OAAO,MAAA,KAAW,WAAe,IAAA,OAAO,OAAO,UAAe,KAAA,UAAA,CAAA;AAEhE,EAAA,MAAM,CAAC,kBAAoB,EAAA,qBAAqB,IAAIC,cAElD,CAAA,MAAA,CAAO,YAAY,OAAQ,CAAA,GAAA,CAAI,CAAC,CAAC,EAAE,CAAM,KAAA,CAAC,IAAkB,KAAK,CAAC,CAAC,CAAC,CAAA,CAAA;AAEtE,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,kBAAoB,EAAA;AACvB,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,MAAM,QAAW,GAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,OAAO,KAAU,KAAA;AAC7C,MAAM,MAAA,EAAA,GAAK,MAAO,CAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAClC,MAAM,MAAA,EAAA,GAAK,QAAQ,KAAO,CAAA,CAAA,CAAA,CAAA,CAAA;AAE1B,MAAO,OAAA;AAAA,QACL,EAAA;AAAA,QACA,SAAS,MAAM;AACb,UAAA,qBAAA,CAAsB,CAAC,IAAS,KAAA;AAC9B,YAAO,OAAA;AAAA,cACL,GAAG,IAAA;AAAA,cACH,CAAC,KAAK,EAAG,CAAA,OAAA;AAAA,aACX,CAAA;AAAA,WACD,CAAA,CAAA;AAAA,SACH;AAAA,OACF,CAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,QAAA,CAAS,OAAQ,CAAA,CAAC,EAAE,EAAA,EAAI,SAAc,KAAA;AACpC,MAAQ,OAAA,EAAA,CAAA;AACR,MAAG,EAAA,CAAA,gBAAA,CAAiB,UAAU,OAAO,CAAA,CAAA;AAAA,KACtC,CAAA,CAAA;AAED,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,OAAQ,CAAA,CAAC,EAAE,EAAA,EAAI,SAAc,KAAA;AACpC,QAAG,EAAA,CAAA,mBAAA,CAAoB,UAAU,OAAO,CAAA,CAAA;AAAA,OACzC,CAAA,CAAA;AAAA,KACH,CAAA;AAAA,GAEF,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,EAAO,OAAA,MAAA,CAAO,IAAK,CAAA,kBAAkB,CAAE,CAAA,MAAA;AAAA,IACrC,CAAC,OAAO,kBAAmB,CAAA,EAAA,CAAA;AAAA,GAC7B,CAAA;AACF,CAAA;AAEO,SAAS,aAEd,GAAA;AAlFF,EAAA,IAAA,EAAA,CAAA;AAmFE,EAAA,MAAM,EAAE,kBAAA,EAAuB,GAAAC,gBAAA,CAAW,OAAO,CAAA,CAAA;AAEjD,EAAO,OAAA;AAAA,IACL,kBAAA;AAAA,IACA,UAAA,EAAA,CAAY,EAAmB,GAAA,kBAAA,CAAA,CAAA,CAAA,KAAnB,IAAyB,GAAA,EAAA,GAAA,IAAA;AAAA,GACvC,CAAA;AACF;;;;;;"}
1
+ {"version":3,"file":"BreakpointProvider.js","sources":["../src/breakpoints/BreakpointProvider.tsx"],"sourcesContent":["import { createContext, useIsomorphicLayoutEffect } from \"../utils\";\nimport { ReactNode, useContext, useState } from \"react\";\nimport { Breakpoints } from \"./Breakpoints\";\n\ntype Breakpoint = keyof Breakpoints;\n\ninterface BreakpointContext {\n matchedBreakpoints: Breakpoint[];\n}\n\nconst Context = createContext<BreakpointContext>(\"BreakpointContext\", {\n matchedBreakpoints: [],\n});\n\ninterface BreakpointProviderProps {\n children?: ReactNode;\n matchedBreakpoints: Breakpoint[];\n}\n\nexport function BreakpointProvider(props: BreakpointProviderProps) {\n const { children, matchedBreakpoints } = props;\n\n return (\n <Context.Provider value={{ matchedBreakpoints }}>\n {children}\n </Context.Provider>\n );\n}\n\nexport function useMatchedBreakpoints(breakpoints: Breakpoints): Breakpoint[] {\n const entries = Object.entries(breakpoints).sort(([, a], [, b]) => b - a);\n const queries = entries.map(([, value]) => `(min-width: ${value}px)`);\n\n const supportsMatchMedia =\n typeof window !== \"undefined\" && typeof window.matchMedia === \"function\";\n\n const [matchedBreakpoints, setMatchedBreakpoints] = useState<\n Partial<Record<Breakpoint, boolean>>\n >(Object.fromEntries(entries.map(([bp]) => [bp as Breakpoint, false])));\n\n useIsomorphicLayoutEffect(() => {\n if (!supportsMatchMedia) {\n return;\n }\n\n const matchers = queries.map((query, index) => {\n const mq = window.matchMedia(query);\n const bp = entries[index][0] as Breakpoint;\n\n return {\n mq,\n handler: () => {\n setMatchedBreakpoints((prev) => {\n return {\n ...prev,\n [bp]: mq.matches,\n };\n });\n },\n };\n });\n\n matchers.forEach(({ mq, handler }) => {\n handler();\n mq.addEventListener(\"change\", handler);\n });\n\n return () => {\n matchers.forEach(({ mq, handler }) => {\n mq.removeEventListener(\"change\", handler);\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [supportsMatchMedia]);\n\n return Object.keys(matchedBreakpoints).filter(\n (bp) => matchedBreakpoints[bp as Breakpoint]\n ) as Breakpoint[];\n}\n\nexport function useBreakpoint(): BreakpointContext & {\n breakpoint: Breakpoint | null;\n} {\n const { matchedBreakpoints } = useContext(Context);\n\n return {\n matchedBreakpoints,\n breakpoint: matchedBreakpoints[0] ?? null,\n };\n}\n"],"names":["createContext","jsx","useState","useIsomorphicLayoutEffect","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,OAAA,GAAUA,4BAAiC,mBAAqB,EAAA;AAAA,EACpE,oBAAoB,EAAC;AACvB,CAAC,CAAA,CAAA;AAOM,SAAS,mBAAmB,KAAgC,EAAA;AACjE,EAAM,MAAA,EAAE,QAAU,EAAA,kBAAA,EAAuB,GAAA,KAAA,CAAA;AAEzC,EACE,uBAAAC,cAAA,CAAC,QAAQ,QAAR,EAAA;AAAA,IAAiB,KAAA,EAAO,EAAE,kBAAmB,EAAA;AAAA,IAC3C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,sBAAsB,WAAwC,EAAA;AAC5E,EAAA,MAAM,UAAU,MAAO,CAAA,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA,KAAM,IAAI,CAAC,CAAA,CAAA;AACxE,EAAM,MAAA,OAAA,GAAU,QAAQ,GAAI,CAAA,CAAC,GAAG,KAAK,CAAM,KAAA,CAAA,YAAA,EAAe,KAAU,CAAA,GAAA,CAAA,CAAA,CAAA;AAEpE,EAAA,MAAM,qBACJ,OAAO,MAAA,KAAW,WAAe,IAAA,OAAO,OAAO,UAAe,KAAA,UAAA,CAAA;AAEhE,EAAA,MAAM,CAAC,kBAAoB,EAAA,qBAAqB,IAAIC,cAElD,CAAA,MAAA,CAAO,YAAY,OAAQ,CAAA,GAAA,CAAI,CAAC,CAAC,EAAE,CAAM,KAAA,CAAC,IAAkB,KAAK,CAAC,CAAC,CAAC,CAAA,CAAA;AAEtE,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,CAAC,kBAAoB,EAAA;AACvB,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,MAAM,QAAW,GAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,OAAO,KAAU,KAAA;AAC7C,MAAM,MAAA,EAAA,GAAK,MAAO,CAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAClC,MAAM,MAAA,EAAA,GAAK,QAAQ,KAAO,CAAA,CAAA,CAAA,CAAA,CAAA;AAE1B,MAAO,OAAA;AAAA,QACL,EAAA;AAAA,QACA,SAAS,MAAM;AACb,UAAA,qBAAA,CAAsB,CAAC,IAAS,KAAA;AAC9B,YAAO,OAAA;AAAA,cACL,GAAG,IAAA;AAAA,cACH,CAAC,KAAK,EAAG,CAAA,OAAA;AAAA,aACX,CAAA;AAAA,WACD,CAAA,CAAA;AAAA,SACH;AAAA,OACF,CAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,QAAA,CAAS,OAAQ,CAAA,CAAC,EAAE,EAAA,EAAI,SAAc,KAAA;AACpC,MAAQ,OAAA,EAAA,CAAA;AACR,MAAG,EAAA,CAAA,gBAAA,CAAiB,UAAU,OAAO,CAAA,CAAA;AAAA,KACtC,CAAA,CAAA;AAED,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,OAAQ,CAAA,CAAC,EAAE,EAAA,EAAI,SAAc,KAAA;AACpC,QAAG,EAAA,CAAA,mBAAA,CAAoB,UAAU,OAAO,CAAA,CAAA;AAAA,OACzC,CAAA,CAAA;AAAA,KACH,CAAA;AAAA,GAEF,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,EAAO,OAAA,MAAA,CAAO,IAAK,CAAA,kBAAkB,CAAE,CAAA,MAAA;AAAA,IACrC,CAAC,OAAO,kBAAmB,CAAA,EAAA,CAAA;AAAA,GAC7B,CAAA;AACF,CAAA;AAEO,SAAS,aAEd,GAAA;AAlFF,EAAA,IAAA,EAAA,CAAA;AAmFE,EAAA,MAAM,EAAE,kBAAA,EAAuB,GAAAC,gBAAA,CAAW,OAAO,CAAA,CAAA;AAEjD,EAAO,OAAA;AAAA,IACL,kBAAA;AAAA,IACA,UAAA,EAAA,CAAY,EAAmB,GAAA,kBAAA,CAAA,CAAA,CAAA,KAAnB,IAAyB,GAAA,EAAA,GAAA,IAAA;AAAA,GACvC,CAAA;AACF;;;;;;"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = "/* Styles applied to the root element if variant=\"cta\" */\n.saltButton-cta {\n --button-background: var(--salt-actionable-cta-background);\n --button-background-active: var(--salt-actionable-cta-background-active);\n --button-background-disabled: var(--salt-actionable-cta-background-disabled);\n --button-background-hover: var(--salt-actionable-cta-background-hover);\n --button-text-color: var(--salt-actionable-cta-foreground);\n --button-text-color-active: var(--salt-actionable-cta-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-cta-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-cta-foreground-hover);\n --button-borderColor: var(--salt-actionable-cta-borderColor);\n --button-borderColor-hover: var(--salt-actionable-cta-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-cta-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-cta-borderColor-disabled);\n}\n\n/* Styles applied to the root element if variant=\"primary\" (or no variant specified) */\n.saltButton-primary {\n --button-background: var(--salt-actionable-primary-background);\n --button-background-active: var(--salt-actionable-primary-background-active);\n --button-background-disabled: var(--salt-actionable-primary-background-disabled);\n --button-background-hover: var(--salt-actionable-primary-background-hover);\n --button-text-color: var(--salt-actionable-primary-foreground);\n --button-text-color-active: var(--salt-actionable-primary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-primary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-primary-foreground-hover);\n --button-borderColor: var(--salt-actionable-primary-borderColor);\n --button-borderColor-hover: var(--salt-actionable-primary-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-primary-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-primary-borderColor-disabled);\n}\n\n/* Styles applied to the root element if variant=\"secondary\" */\n.saltButton-secondary {\n --button-background: var(--salt-actionable-secondary-background);\n --button-background-active: var(--salt-actionable-secondary-background-active);\n --button-background-disabled: var(--salt-actionable-secondary-background-disabled);\n --button-background-hover: var(--salt-actionable-secondary-background-hover);\n --button-text-color: var(--salt-actionable-secondary-foreground);\n --button-text-color-active: var(--salt-actionable-secondary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-secondary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-secondary-foreground-hover);\n --button-borderColor: var(--salt-actionable-secondary-borderColor);\n --button-borderColor-hover: var(--salt-actionable-secondary-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-secondary-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-secondary-borderColor-disabled);\n}\n\n.saltButton {\n align-items: var(--saltButton-alignItems, center);\n appearance: none;\n background: var(--saltButton-background, var(--button-background));\n border-color: var(--saltButton-borderColor, var(--button-borderColor, transparent));\n border-style: var(--saltButton-borderStyle, solid);\n border-width: var(--saltButton-borderWidth, var(--salt-size-border, 0));\n border-radius: var(--saltButton-borderRadius, var(--salt-palette-corner-weak, 0));\n color: var(--saltButton-text-color, var(--button-text-color));\n cursor: var(--saltButton-cursor, pointer);\n display: inline-flex;\n gap: var(--salt-spacing-50);\n justify-content: var(--saltButton-justifyContent, center);\n font-size: var(--saltButton-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltButton-fontFamily, var(--salt-text-fontFamily));\n line-height: var(--saltButton-lineHeight, var(--salt-text-lineHeight));\n letter-spacing: var(--saltButton-letterSpacing, var(--salt-text-action-letterSpacing));\n text-transform: var(--saltButton-textTransform, var(--salt-text-action-textTransform));\n padding: 0 var(--saltButton-padding, calc(var(--salt-spacing-100) - var(--saltButton-borderWidth, var(--salt-size-border, 0))));\n margin: var(--saltButton-margin, 0);\n height: var(--saltButton-height, var(--salt-size-base));\n min-width: var(--saltButton-minWidth, unset);\n position: relative;\n text-align: var(--saltButton-textAlign, var(--salt-text-action-textAlign));\n text-decoration: none;\n transition: none;\n width: var(--saltButton-width, auto);\n -webkit-appearance: none;\n -webkit-tap-highlight-color: transparent;\n /* Styles applied to align children*/\n font-weight: var(--saltButton-fontWeight, var(--salt-text-action-fontWeight));\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltButton:focus-visible {\n outline-style: var(--salt-focused-outlineStyle);\n outline-width: var(--salt-focused-outlineWidth);\n outline-color: var(--salt-focused-outlineColor);\n outline-offset: var(--salt-focused-outlineOffset);\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element on focus when Button is active */\n.saltButton.saltButton-active:focus-visible,\n.saltButton:focus-visible(:active) {\n background: var(--saltButton-background-active-hover, var(--button-background));\n color: var(--saltButton-text-color-active-hover, var(--button-text-color));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element on hover when Button is not active or disabled */\n.saltButton:hover {\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element when Button is active and not disabled */\n.saltButton:active,\n.saltButton.saltButton-active {\n background: var(--saltButton-background-active, var(--button-background-active));\n color: var(--saltButton-text-color-active, var(--button-text-color-active));\n border-color: var(--saltButton-borderColor-active, var(--button-borderColor-active));\n}\n\n/* Styles applied when the button triggers a dialog or menu */\n.saltButton[aria-expanded=\"true\"][aria-haspopup=\"menu\"],\n.saltButton[aria-expanded=\"true\"][aria-haspopup=\"dialog\"] {\n background: var(--saltButton-background-active, var(--button-background-active));\n color: var(--saltButton-text-color-active, var(--button-text-color-active));\n border-color: var(--saltButton-borderColor-active, var(--button-borderColor-active));\n}\n\n/* Pseudo-class applied to the root element if disabled={true} */\n.saltButton:disabled,\n.saltButton-disabled,\n /* Overrides to apply the disabled style when the button is focusable while also disabled */\n.saltButton-disabled:active,\n.saltButton-disabled:focus-visible,\n.saltButton-disabled:hover {\n background: var(--saltButton-background-disabled, var(--button-background-disabled));\n color: var(--saltButton-text-color-disabled, var(--button-text-color-disabled));\n cursor: var(--saltButton-cursor-disabled, var(--salt-actionable-cursor-disabled));\n border-color: var(--saltButton-borderColor-disabled, var(--button-borderColor-disabled));\n}\n";
3
+ var css_248z = "/* Styles applied to the root element if variant=\"cta\" */\n.saltButton-cta {\n --button-background: var(--salt-actionable-cta-background);\n --button-background-active: var(--salt-actionable-cta-background-active);\n --button-background-disabled: var(--salt-actionable-cta-background-disabled);\n --button-background-hover: var(--salt-actionable-cta-background-hover);\n --button-text-color: var(--salt-actionable-cta-foreground);\n --button-text-color-active: var(--salt-actionable-cta-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-cta-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-cta-foreground-hover);\n --button-borderColor: var(--salt-actionable-cta-borderColor);\n --button-borderColor-hover: var(--salt-actionable-cta-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-cta-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-cta-borderColor-disabled);\n}\n\n/* Styles applied to the root element if variant=\"primary\" (or no variant specified) */\n.saltButton-primary {\n --button-background: var(--salt-actionable-primary-background);\n --button-background-active: var(--salt-actionable-primary-background-active);\n --button-background-disabled: var(--salt-actionable-primary-background-disabled);\n --button-background-hover: var(--salt-actionable-primary-background-hover);\n --button-text-color: var(--salt-actionable-primary-foreground);\n --button-text-color-active: var(--salt-actionable-primary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-primary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-primary-foreground-hover);\n --button-borderColor: var(--salt-actionable-primary-borderColor);\n --button-borderColor-hover: var(--salt-actionable-primary-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-primary-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-primary-borderColor-disabled);\n}\n\n/* Styles applied to the root element if variant=\"secondary\" */\n.saltButton-secondary {\n --button-background: var(--salt-actionable-secondary-background);\n --button-background-active: var(--salt-actionable-secondary-background-active);\n --button-background-disabled: var(--salt-actionable-secondary-background-disabled);\n --button-background-hover: var(--salt-actionable-secondary-background-hover);\n --button-text-color: var(--salt-actionable-secondary-foreground);\n --button-text-color-active: var(--salt-actionable-secondary-foreground-active);\n --button-text-color-disabled: var(--salt-actionable-secondary-foreground-disabled);\n --button-text-color-hover: var(--salt-actionable-secondary-foreground-hover);\n --button-borderColor: var(--salt-actionable-secondary-borderColor);\n --button-borderColor-hover: var(--salt-actionable-secondary-borderColor-hover);\n --button-borderColor-active: var(--salt-actionable-secondary-borderColor-active);\n --button-borderColor-disabled: var(--salt-actionable-secondary-borderColor-disabled);\n}\n\n.saltButton {\n align-items: var(--saltButton-alignItems, center);\n appearance: none;\n background: var(--saltButton-background, var(--button-background));\n border-color: var(--saltButton-borderColor, var(--button-borderColor, transparent));\n border-style: var(--saltButton-borderStyle, solid);\n border-width: var(--saltButton-borderWidth, var(--salt-size-border, 0));\n border-radius: var(--saltButton-borderRadius, var(--salt-palette-corner-weak, 0));\n color: var(--saltButton-text-color, var(--button-text-color));\n cursor: var(--saltButton-cursor, pointer);\n display: inline-flex;\n gap: var(--salt-spacing-50);\n justify-content: var(--saltButton-justifyContent, center);\n font-size: var(--saltButton-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltButton-fontFamily, var(--salt-text-action-fontFamily));\n line-height: var(--saltButton-lineHeight, var(--salt-text-lineHeight));\n letter-spacing: var(--saltButton-letterSpacing, var(--salt-text-action-letterSpacing));\n text-transform: var(--saltButton-textTransform, var(--salt-text-action-textTransform));\n padding: 0 var(--saltButton-padding, calc(var(--salt-spacing-100) - var(--saltButton-borderWidth, var(--salt-size-border, 0))));\n margin: var(--saltButton-margin, 0);\n height: var(--saltButton-height, var(--salt-size-base));\n min-width: var(--saltButton-minWidth, unset);\n position: relative;\n text-align: var(--saltButton-textAlign, var(--salt-text-action-textAlign));\n text-decoration: none;\n transition: none;\n width: var(--saltButton-width, auto);\n -webkit-appearance: none;\n -webkit-tap-highlight-color: transparent;\n /* Styles applied to align children*/\n font-weight: var(--saltButton-fontWeight, var(--salt-text-action-fontWeight));\n}\n\n/* Pseudo-class applied to the root element on focus */\n.saltButton:focus-visible {\n outline-style: var(--salt-focused-outlineStyle);\n outline-width: var(--salt-focused-outlineWidth);\n outline-color: var(--salt-focused-outlineColor);\n outline-offset: var(--salt-focused-outlineOffset);\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element on focus when Button is active */\n.saltButton.saltButton-active:focus-visible,\n.saltButton:focus-visible(:active) {\n background: var(--saltButton-background-active-hover, var(--button-background));\n color: var(--saltButton-text-color-active-hover, var(--button-text-color));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element on hover when Button is not active or disabled */\n.saltButton:hover {\n background: var(--saltButton-background-hover, var(--button-background-hover));\n color: var(--saltButton-text-color-hover, var(--button-text-color-hover));\n border-color: var(--saltButton-borderColor-hover, var(--button-borderColor-hover));\n}\n\n/* Pseudo-class applied to the root element when Button is active and not disabled */\n.saltButton:active,\n.saltButton.saltButton-active {\n background: var(--saltButton-background-active, var(--button-background-active));\n color: var(--saltButton-text-color-active, var(--button-text-color-active));\n border-color: var(--saltButton-borderColor-active, var(--button-borderColor-active));\n}\n\n/* Styles applied when the button triggers a dialog or menu */\n.saltButton[aria-expanded=\"true\"][aria-haspopup=\"menu\"],\n.saltButton[aria-expanded=\"true\"][aria-haspopup=\"dialog\"] {\n background: var(--saltButton-background-active, var(--button-background-active));\n color: var(--saltButton-text-color-active, var(--button-text-color-active));\n border-color: var(--saltButton-borderColor-active, var(--button-borderColor-active));\n}\n\n/* Pseudo-class applied to the root element if disabled={true} */\n.saltButton:disabled,\n.saltButton-disabled,\n /* Overrides to apply the disabled style when the button is focusable while also disabled */\n.saltButton-disabled:active,\n.saltButton-disabled:focus-visible,\n.saltButton-disabled:hover {\n background: var(--saltButton-background-disabled, var(--button-background-disabled));\n color: var(--saltButton-text-color-disabled, var(--button-text-color-disabled));\n cursor: var(--saltButton-cursor-disabled, var(--salt-actionable-cursor-disabled));\n border-color: var(--saltButton-borderColor-disabled, var(--button-borderColor-disabled));\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=Button.css.js.map
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n */\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n children,\n className,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n type = \"button\",\n variant = \"primary\",\n ...restProps\n },\n ref?\n ): ReactElement<ButtonProps> {\n const { active, buttonProps } = useButton({\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n },\n className\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Button","useButton","useWindow","useComponentCssInjection","buttonCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK,EAAA;AAmB1D,MAAM,MAAS,GAAAC,gBAAA;AAAA,EACpB,SAASC,OACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAO,GAAA,QAAA;AAAA,IACP,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GAC2B,EAAA;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAY,EAAA,GAAIC,mBAAU,CAAA;AAAA,MACxC,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAID,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MACE,GAAG,eAAA;AAAA,MACJ,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
1
+ {"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n */\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n children,\n className,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n type = \"button\",\n variant = \"primary\",\n ...restProps\n },\n ref?\n ): ReactElement<ButtonProps> {\n const { active, buttonProps } = useButton({\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n },\n className\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Button","useButton","useWindow","useComponentCssInjection","buttonCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,YAAY,CAAA,CAAA;AAEvC,MAAM,mBAAsB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,KAAK,EAAA;AAmB1D,MAAM,MAAS,GAAAC,gBAAA;AAAA,EACpB,SAASC,OACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAO,GAAA,QAAA;AAAA,IACP,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GAC2B,EAAA;AAC3B,IAAA,MAAM,EAAE,MAAA,EAAQ,WAAY,EAAA,GAAIC,mBAAU,CAAA;AAAA,MACxC,QAAA;AAAA,MACA,qBAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,aAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAID,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MACE,GAAG,eAAA;AAAA,MACJ,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,SAC5B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,IAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
37
37
  require('../dialog/DialogContent.js');
38
38
  require('../dialog/DialogContext.js');
39
39
  require('../dialog/DialogCloseButton.js');
40
+ require('../divider/Divider.js');
40
41
  require('../drawer/Drawer.js');
41
42
  require('../drawer/DrawerCloseButton.js');
42
43
  require('../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
64
65
  require('../interactable-card/InteractableCardGroupContext.js');
65
66
  require('../link/Link.js');
66
67
  require('../link-card/LinkCard.js');
68
+ require('../list-box/ListBox.js');
67
69
  require('../list-control/ListControlContext.js');
68
70
  require('../menu/MenuContext.js');
69
71
  require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
101
103
  require('../toast/ToastContent.js');
102
104
  require('../split-layout/SplitLayout.js');
103
105
  require('../switch/Switch.js');
106
+ require('../tag/Tag.js');
104
107
  require('../toggle-button/ToggleButton.js');
105
108
  require('../toggle-button-group/ToggleButtonGroup.js');
106
109
  require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -1 +1 @@
1
- {"version":3,"file":"Card.js","sources":["../src/card/Card.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport cardCss from \"./Card.css\";\n\nconst withBaseName = makePrefixer(\"saltCard\");\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, the card will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the card will have hover styling.\n */\n hoverable?: boolean;\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, interactive styles will be applied to `Card`. These styles give prominence to certain content\n * on the page.\n */\n interactable?: boolean;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(function Card(\n props,\n ref\n) {\n const {\n accent,\n children,\n className,\n disabled,\n interactable,\n hoverable,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card\",\n css: cardCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent || \"\")}`)]: accent,\n [withBaseName(\"hoverable\")]: hoverable,\n /* **Deprecated:** InteractableCard should be used instead for these features */\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"interactable\")]: interactable,\n },\n className\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Card","useWindow","useComponentCssInjection","cardCss","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AA6BrC,MAAM,IAAO,GAAAC,gBAAA,CAAsC,SAASC,KAAAA,CACjE,OACA,GACA,EAAA;AACA,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,QAC1B,CAAC,YAAa,CAAA,CAAA,MAAA,EAASC,sBAAW,MAAU,IAAA,EAAE,GAAG,CAAI,GAAA,MAAA;AAAA,QACrD,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,SAAA;AAAA,QAE7B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,YAAA;AAAA,OAClC;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"Card.js","sources":["../src/card/Card.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport cardCss from \"./Card.css\";\n\nconst withBaseName = makePrefixer(\"saltCard\");\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, the card will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the card will have hover styling.\n */\n hoverable?: boolean;\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, interactive styles will be applied to `Card`. These styles give prominence to certain content\n * on the page.\n */\n interactable?: boolean;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(function Card(\n props,\n ref\n) {\n const {\n accent,\n children,\n className,\n disabled,\n interactable,\n hoverable,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card\",\n css: cardCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent || \"\")}`)]: accent,\n [withBaseName(\"hoverable\")]: hoverable,\n /* **Deprecated:** InteractableCard should be used instead for these features */\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"interactable\")]: interactable,\n },\n className\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Card","useWindow","useComponentCssInjection","cardCss","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AA6BrC,MAAM,IAAO,GAAAC,gBAAA,CAAsC,SAASC,KAAAA,CACjE,OACA,GACA,EAAA;AACA,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,QAC1B,CAAC,YAAa,CAAA,CAAA,MAAA,EAASC,sBAAW,MAAU,IAAA,EAAE,GAAG,CAAI,GAAA,MAAA;AAAA,QACrD,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,SAAA;AAAA,QAE7B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,YAAA;AAAA,OAClC;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
38
38
  require('../dialog/DialogContent.js');
39
39
  require('../dialog/DialogContext.js');
40
40
  require('../dialog/DialogCloseButton.js');
41
+ require('../divider/Divider.js');
41
42
  require('../drawer/Drawer.js');
42
43
  require('../drawer/DrawerCloseButton.js');
43
44
  require('../dropdown/Dropdown.js');
@@ -66,6 +67,7 @@ require('../interactable-card/InteractableCardGroup.js');
66
67
  require('../interactable-card/InteractableCardGroupContext.js');
67
68
  require('../link/Link.js');
68
69
  require('../link-card/LinkCard.js');
70
+ require('../list-box/ListBox.js');
69
71
  require('../list-control/ListControlContext.js');
70
72
  require('../menu/MenuContext.js');
71
73
  require('@floating-ui/react');
@@ -103,6 +105,7 @@ require('../toast/Toast.js');
103
105
  require('../toast/ToastContent.js');
104
106
  require('../split-layout/SplitLayout.js');
105
107
  require('../switch/Switch.js');
108
+ require('../tag/Tag.js');
106
109
  require('../toggle-button/ToggleButton.js');
107
110
  require('../toggle-button-group/ToggleButtonGroup.js');
108
111
  require('../toggle-button-group/ToggleButtonGroupContext.js');