@salt-ds/core 1.22.0 → 1.24.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 (461) hide show
  1. package/css/salt-core.css +201 -96
  2. package/dist-cjs/accordion/Accordion.js +9 -2
  3. package/dist-cjs/accordion/Accordion.js.map +1 -1
  4. package/dist-cjs/accordion/AccordionContext.js +9 -2
  5. package/dist-cjs/accordion/AccordionContext.js.map +1 -1
  6. package/dist-cjs/accordion/AccordionGroup.js +9 -2
  7. package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
  8. package/dist-cjs/accordion/AccordionHeader.js +10 -2
  9. package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
  10. package/dist-cjs/accordion/AccordionPanel.js +9 -2
  11. package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
  12. package/dist-cjs/aria-announcer/useAriaAnnouncer.js +9 -2
  13. package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
  14. package/dist-cjs/avatar/Avatar.js +9 -2
  15. package/dist-cjs/avatar/Avatar.js.map +1 -1
  16. package/dist-cjs/avatar/useAvatarImage.js +9 -2
  17. package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
  18. package/dist-cjs/badge/Badge.js +9 -2
  19. package/dist-cjs/badge/Badge.js.map +1 -1
  20. package/dist-cjs/banner/Banner.js +9 -2
  21. package/dist-cjs/banner/Banner.js.map +1 -1
  22. package/dist-cjs/banner/BannerActions.js +9 -2
  23. package/dist-cjs/banner/BannerActions.js.map +1 -1
  24. package/dist-cjs/banner/BannerContent.js +9 -2
  25. package/dist-cjs/banner/BannerContent.js.map +1 -1
  26. package/dist-cjs/border-item/BorderItem.js +9 -2
  27. package/dist-cjs/border-item/BorderItem.js.map +1 -1
  28. package/dist-cjs/border-layout/BorderLayout.js +9 -2
  29. package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
  30. package/dist-cjs/button/Button.js +9 -2
  31. package/dist-cjs/button/Button.js.map +1 -1
  32. package/dist-cjs/card/Card.css.js +1 -1
  33. package/dist-cjs/card/Card.js +9 -2
  34. package/dist-cjs/card/Card.js.map +1 -1
  35. package/dist-cjs/checkbox/Checkbox.js +10 -3
  36. package/dist-cjs/checkbox/Checkbox.js.map +1 -1
  37. package/dist-cjs/checkbox/CheckboxGroup.js +9 -2
  38. package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
  39. package/dist-cjs/checkbox/CheckboxIcon.js +9 -2
  40. package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
  41. package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +9 -2
  42. package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  43. package/dist-cjs/combo-box/ComboBox.js +8 -1
  44. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  45. package/dist-cjs/combo-box/useComboBox.js +9 -2
  46. package/dist-cjs/combo-box/useComboBox.js.map +1 -1
  47. package/dist-cjs/dialog/Dialog.js +10 -3
  48. package/dist-cjs/dialog/Dialog.js.map +1 -1
  49. package/dist-cjs/dialog/DialogActions.js +9 -2
  50. package/dist-cjs/dialog/DialogActions.js.map +1 -1
  51. package/dist-cjs/dialog/DialogCloseButton.js +12 -3
  52. package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
  53. package/dist-cjs/dialog/DialogContent.js +9 -2
  54. package/dist-cjs/dialog/DialogContent.js.map +1 -1
  55. package/dist-cjs/dialog/DialogHeader.js +9 -2
  56. package/dist-cjs/dialog/DialogHeader.js.map +1 -1
  57. package/dist-cjs/drawer/Drawer.js +8 -1
  58. package/dist-cjs/drawer/Drawer.js.map +1 -1
  59. package/dist-cjs/drawer/DrawerCloseButton.js +9 -2
  60. package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
  61. package/dist-cjs/dropdown/Dropdown.js +9 -2
  62. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  63. package/dist-cjs/file-drop-zone/FileDropZone.js +9 -2
  64. package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
  65. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +9 -2
  66. package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  67. package/dist-cjs/flex-item/FlexItem.js +9 -2
  68. package/dist-cjs/flex-item/FlexItem.js.map +1 -1
  69. package/dist-cjs/flex-layout/FlexLayout.js +9 -2
  70. package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
  71. package/dist-cjs/form-field/FormField.js +9 -2
  72. package/dist-cjs/form-field/FormField.js.map +1 -1
  73. package/dist-cjs/form-field/FormFieldHelperText.js +9 -2
  74. package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
  75. package/dist-cjs/form-field/FormFieldLabel.js +9 -2
  76. package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
  77. package/dist-cjs/form-field-context/FormFieldContext.js +9 -2
  78. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  79. package/dist-cjs/grid-item/GridItem.js +9 -2
  80. package/dist-cjs/grid-item/GridItem.js.map +1 -1
  81. package/dist-cjs/grid-layout/GridLayout.js +9 -2
  82. package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
  83. package/dist-cjs/index.js +19 -2
  84. package/dist-cjs/index.js.map +1 -1
  85. package/dist-cjs/input/Input.js +9 -2
  86. package/dist-cjs/input/Input.js.map +1 -1
  87. package/dist-cjs/interactable-card/InteractableCard.css.js +6 -0
  88. package/dist-cjs/interactable-card/InteractableCard.js +201 -0
  89. package/dist-cjs/interactable-card/InteractableCard.js.map +1 -0
  90. package/dist-cjs/interactable-card/InteractableCardGroup.css.js +6 -0
  91. package/dist-cjs/interactable-card/InteractableCardGroup.css.js.map +1 -0
  92. package/dist-cjs/interactable-card/InteractableCardGroup.js +232 -0
  93. package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -0
  94. package/dist-cjs/interactable-card/InteractableCardGroupContext.js +107 -0
  95. package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -0
  96. package/dist-cjs/{card → interactable-card}/useInteractableCard.js +5 -2
  97. package/dist-cjs/interactable-card/useInteractableCard.js.map +1 -0
  98. package/dist-cjs/link/Link.js +9 -2
  99. package/dist-cjs/link/Link.js.map +1 -1
  100. package/dist-cjs/link-card/LinkCard.css.js +1 -1
  101. package/dist-cjs/link-card/LinkCard.js +9 -2
  102. package/dist-cjs/link-card/LinkCard.js.map +1 -1
  103. package/dist-cjs/list-control/ListControlContext.js +9 -2
  104. package/dist-cjs/list-control/ListControlContext.js.map +1 -1
  105. package/dist-cjs/list-control/ListControlState.js +9 -2
  106. package/dist-cjs/list-control/ListControlState.js.map +1 -1
  107. package/dist-cjs/multiline-input/MultilineInput.js +9 -2
  108. package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
  109. package/dist-cjs/navigation-item/NavigationItem.js +9 -2
  110. package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
  111. package/dist-cjs/option/Option.js +9 -2
  112. package/dist-cjs/option/Option.js.map +1 -1
  113. package/dist-cjs/option/OptionGroup.js +9 -2
  114. package/dist-cjs/option/OptionGroup.js.map +1 -1
  115. package/dist-cjs/option/OptionList.js +9 -2
  116. package/dist-cjs/option/OptionList.js.map +1 -1
  117. package/dist-cjs/option/OptionListBase.js +9 -2
  118. package/dist-cjs/option/OptionListBase.js.map +1 -1
  119. package/dist-cjs/overlay/Overlay.js +164 -0
  120. package/dist-cjs/overlay/Overlay.js.map +1 -0
  121. package/dist-cjs/overlay/OverlayContext.js +127 -0
  122. package/dist-cjs/overlay/OverlayContext.js.map +1 -0
  123. package/dist-cjs/overlay/OverlayPanel.css.js +6 -0
  124. package/dist-cjs/overlay/OverlayPanel.css.js.map +1 -0
  125. package/dist-cjs/overlay/OverlayPanel.js +166 -0
  126. package/dist-cjs/overlay/OverlayPanel.js.map +1 -0
  127. package/dist-cjs/overlay/OverlayPanelCloseButton.css.js +6 -0
  128. package/dist-cjs/overlay/OverlayPanelCloseButton.css.js.map +1 -0
  129. package/dist-cjs/overlay/OverlayPanelCloseButton.js +129 -0
  130. package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -0
  131. package/dist-cjs/overlay/OverlayPanelContent.css.js +6 -0
  132. package/dist-cjs/overlay/OverlayPanelContent.css.js.map +1 -0
  133. package/dist-cjs/{card/InteractableCard.js → overlay/OverlayPanelContent.js} +24 -44
  134. package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -0
  135. package/dist-cjs/overlay/OverlayTrigger.js +123 -0
  136. package/dist-cjs/overlay/OverlayTrigger.js.map +1 -0
  137. package/dist-cjs/pagination/CompactInput.js +9 -2
  138. package/dist-cjs/pagination/CompactInput.js.map +1 -1
  139. package/dist-cjs/pagination/CompactPaginator.js +9 -2
  140. package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
  141. package/dist-cjs/pagination/GoToInput.js +9 -2
  142. package/dist-cjs/pagination/GoToInput.js.map +1 -1
  143. package/dist-cjs/pagination/PageButton.js +9 -2
  144. package/dist-cjs/pagination/PageButton.js.map +1 -1
  145. package/dist-cjs/pagination/PageRanges.js +9 -2
  146. package/dist-cjs/pagination/PageRanges.js.map +1 -1
  147. package/dist-cjs/pagination/Pagination.js +9 -2
  148. package/dist-cjs/pagination/Pagination.js.map +1 -1
  149. package/dist-cjs/pagination/Paginator.js +9 -2
  150. package/dist-cjs/pagination/Paginator.js.map +1 -1
  151. package/dist-cjs/panel/Panel.js +9 -2
  152. package/dist-cjs/panel/Panel.js.map +1 -1
  153. package/dist-cjs/pill/Pill.js +10 -2
  154. package/dist-cjs/pill/Pill.js.map +1 -1
  155. package/dist-cjs/pill-input/PillInput.js +9 -2
  156. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  157. package/dist-cjs/progress/CircularProgress/CircularProgress.js +9 -2
  158. package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
  159. package/dist-cjs/progress/LinearProgress/LinearProgress.js +11 -4
  160. package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
  161. package/dist-cjs/radio-button/RadioButton.js +10 -3
  162. package/dist-cjs/radio-button/RadioButton.js.map +1 -1
  163. package/dist-cjs/radio-button/RadioButtonGroup.js +9 -2
  164. package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
  165. package/dist-cjs/radio-button/RadioButtonIcon.js +9 -2
  166. package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
  167. package/dist-cjs/radio-button/internal/RadioGroupContext.js +9 -2
  168. package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
  169. package/dist-cjs/salt-provider/SaltProvider.js +9 -2
  170. package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
  171. package/dist-cjs/scrim/Scrim.js +9 -2
  172. package/dist-cjs/scrim/Scrim.js.map +1 -1
  173. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.css.js +6 -0
  174. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.css.js.map +1 -0
  175. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js +118 -0
  176. package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -0
  177. package/dist-cjs/spinner/Spinner.js +9 -2
  178. package/dist-cjs/spinner/Spinner.js.map +1 -1
  179. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +9 -2
  180. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  181. package/dist-cjs/split-layout/SplitLayout.js +9 -2
  182. package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
  183. package/dist-cjs/stack-layout/StackLayout.js +9 -2
  184. package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
  185. package/dist-cjs/status-adornment/StatusAdornment.js +9 -2
  186. package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
  187. package/dist-cjs/status-indicator/StatusIndicator.js +9 -2
  188. package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
  189. package/dist-cjs/switch/Switch.js +10 -2
  190. package/dist-cjs/switch/Switch.js.map +1 -1
  191. package/dist-cjs/text/Text.js +9 -2
  192. package/dist-cjs/text/Text.js.map +1 -1
  193. package/dist-cjs/toast/Toast.js +9 -2
  194. package/dist-cjs/toast/Toast.js.map +1 -1
  195. package/dist-cjs/toast/ToastContent.js +9 -2
  196. package/dist-cjs/toast/ToastContent.js.map +1 -1
  197. package/dist-cjs/toggle-button/ToggleButton.js +10 -2
  198. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  199. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +9 -2
  200. package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  201. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +9 -2
  202. package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  203. package/dist-cjs/tooltip/Tooltip.css.js +1 -1
  204. package/dist-cjs/tooltip/Tooltip.js +15 -3
  205. package/dist-cjs/tooltip/Tooltip.js.map +1 -1
  206. package/dist-cjs/tooltip/TooltipBase.js +9 -2
  207. package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
  208. package/dist-cjs/tooltip/useAriaAnnounce.js +9 -2
  209. package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
  210. package/dist-cjs/tooltip/useTooltip.js +8 -1
  211. package/dist-cjs/tooltip/useTooltip.js.map +1 -1
  212. package/dist-cjs/utils/useFloatingUI/useFloatingUI.js +3 -5
  213. package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  214. package/dist-cjs/utils/useValueEffect.js +9 -2
  215. package/dist-cjs/utils/useValueEffect.js.map +1 -1
  216. package/dist-cjs/viewport/ViewportProvider.js +9 -2
  217. package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
  218. package/dist-es/accordion/Accordion.js +9 -2
  219. package/dist-es/accordion/Accordion.js.map +1 -1
  220. package/dist-es/accordion/AccordionContext.js +9 -2
  221. package/dist-es/accordion/AccordionContext.js.map +1 -1
  222. package/dist-es/accordion/AccordionGroup.js +9 -2
  223. package/dist-es/accordion/AccordionGroup.js.map +1 -1
  224. package/dist-es/accordion/AccordionHeader.js +10 -2
  225. package/dist-es/accordion/AccordionHeader.js.map +1 -1
  226. package/dist-es/accordion/AccordionPanel.js +9 -2
  227. package/dist-es/accordion/AccordionPanel.js.map +1 -1
  228. package/dist-es/aria-announcer/useAriaAnnouncer.js +9 -2
  229. package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
  230. package/dist-es/avatar/Avatar.js +9 -2
  231. package/dist-es/avatar/Avatar.js.map +1 -1
  232. package/dist-es/avatar/useAvatarImage.js +9 -2
  233. package/dist-es/avatar/useAvatarImage.js.map +1 -1
  234. package/dist-es/badge/Badge.js +9 -2
  235. package/dist-es/badge/Badge.js.map +1 -1
  236. package/dist-es/banner/Banner.js +9 -2
  237. package/dist-es/banner/Banner.js.map +1 -1
  238. package/dist-es/banner/BannerActions.js +9 -2
  239. package/dist-es/banner/BannerActions.js.map +1 -1
  240. package/dist-es/banner/BannerContent.js +9 -2
  241. package/dist-es/banner/BannerContent.js.map +1 -1
  242. package/dist-es/border-item/BorderItem.js +9 -2
  243. package/dist-es/border-item/BorderItem.js.map +1 -1
  244. package/dist-es/border-layout/BorderLayout.js +9 -2
  245. package/dist-es/border-layout/BorderLayout.js.map +1 -1
  246. package/dist-es/button/Button.js +9 -2
  247. package/dist-es/button/Button.js.map +1 -1
  248. package/dist-es/card/Card.css.js +1 -1
  249. package/dist-es/card/Card.js +9 -2
  250. package/dist-es/card/Card.js.map +1 -1
  251. package/dist-es/checkbox/Checkbox.js +10 -3
  252. package/dist-es/checkbox/Checkbox.js.map +1 -1
  253. package/dist-es/checkbox/CheckboxGroup.js +9 -2
  254. package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
  255. package/dist-es/checkbox/CheckboxIcon.js +9 -2
  256. package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
  257. package/dist-es/checkbox/internal/CheckboxGroupContext.js +9 -2
  258. package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
  259. package/dist-es/combo-box/ComboBox.js +8 -1
  260. package/dist-es/combo-box/ComboBox.js.map +1 -1
  261. package/dist-es/combo-box/useComboBox.js +9 -2
  262. package/dist-es/combo-box/useComboBox.js.map +1 -1
  263. package/dist-es/dialog/Dialog.js +10 -3
  264. package/dist-es/dialog/Dialog.js.map +1 -1
  265. package/dist-es/dialog/DialogActions.js +9 -2
  266. package/dist-es/dialog/DialogActions.js.map +1 -1
  267. package/dist-es/dialog/DialogCloseButton.js +12 -3
  268. package/dist-es/dialog/DialogCloseButton.js.map +1 -1
  269. package/dist-es/dialog/DialogContent.js +9 -2
  270. package/dist-es/dialog/DialogContent.js.map +1 -1
  271. package/dist-es/dialog/DialogHeader.js +9 -2
  272. package/dist-es/dialog/DialogHeader.js.map +1 -1
  273. package/dist-es/drawer/Drawer.js +8 -1
  274. package/dist-es/drawer/Drawer.js.map +1 -1
  275. package/dist-es/drawer/DrawerCloseButton.js +9 -2
  276. package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
  277. package/dist-es/dropdown/Dropdown.js +9 -2
  278. package/dist-es/dropdown/Dropdown.js.map +1 -1
  279. package/dist-es/file-drop-zone/FileDropZone.js +9 -2
  280. package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
  281. package/dist-es/file-drop-zone/FileDropZoneTrigger.js +9 -2
  282. package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
  283. package/dist-es/flex-item/FlexItem.js +9 -2
  284. package/dist-es/flex-item/FlexItem.js.map +1 -1
  285. package/dist-es/flex-layout/FlexLayout.js +9 -2
  286. package/dist-es/flex-layout/FlexLayout.js.map +1 -1
  287. package/dist-es/form-field/FormField.js +9 -2
  288. package/dist-es/form-field/FormField.js.map +1 -1
  289. package/dist-es/form-field/FormFieldHelperText.js +9 -2
  290. package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
  291. package/dist-es/form-field/FormFieldLabel.js +9 -2
  292. package/dist-es/form-field/FormFieldLabel.js.map +1 -1
  293. package/dist-es/form-field-context/FormFieldContext.js +9 -2
  294. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  295. package/dist-es/grid-item/GridItem.js +9 -2
  296. package/dist-es/grid-item/GridItem.js.map +1 -1
  297. package/dist-es/grid-layout/GridLayout.js +9 -2
  298. package/dist-es/grid-layout/GridLayout.js.map +1 -1
  299. package/dist-es/index.js +9 -1
  300. package/dist-es/index.js.map +1 -1
  301. package/dist-es/input/Input.js +9 -2
  302. package/dist-es/input/Input.js.map +1 -1
  303. package/dist-es/interactable-card/InteractableCard.css.js +4 -0
  304. package/dist-es/interactable-card/InteractableCard.js +197 -0
  305. package/dist-es/interactable-card/InteractableCard.js.map +1 -0
  306. package/dist-es/interactable-card/InteractableCardGroup.css.js +4 -0
  307. package/dist-es/interactable-card/InteractableCardGroup.css.js.map +1 -0
  308. package/dist-es/interactable-card/InteractableCardGroup.js +228 -0
  309. package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -0
  310. package/dist-es/interactable-card/InteractableCardGroupContext.js +102 -0
  311. package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -0
  312. package/dist-es/{card → interactable-card}/useInteractableCard.js +5 -2
  313. package/dist-es/interactable-card/useInteractableCard.js.map +1 -0
  314. package/dist-es/link/Link.js +9 -2
  315. package/dist-es/link/Link.js.map +1 -1
  316. package/dist-es/link-card/LinkCard.css.js +1 -1
  317. package/dist-es/link-card/LinkCard.js +9 -2
  318. package/dist-es/link-card/LinkCard.js.map +1 -1
  319. package/dist-es/list-control/ListControlContext.js +9 -2
  320. package/dist-es/list-control/ListControlContext.js.map +1 -1
  321. package/dist-es/list-control/ListControlState.js +9 -2
  322. package/dist-es/list-control/ListControlState.js.map +1 -1
  323. package/dist-es/multiline-input/MultilineInput.js +9 -2
  324. package/dist-es/multiline-input/MultilineInput.js.map +1 -1
  325. package/dist-es/navigation-item/NavigationItem.js +9 -2
  326. package/dist-es/navigation-item/NavigationItem.js.map +1 -1
  327. package/dist-es/option/Option.js +9 -2
  328. package/dist-es/option/Option.js.map +1 -1
  329. package/dist-es/option/OptionGroup.js +9 -2
  330. package/dist-es/option/OptionGroup.js.map +1 -1
  331. package/dist-es/option/OptionList.js +9 -2
  332. package/dist-es/option/OptionList.js.map +1 -1
  333. package/dist-es/option/OptionListBase.js +9 -2
  334. package/dist-es/option/OptionListBase.js.map +1 -1
  335. package/dist-es/overlay/Overlay.js +160 -0
  336. package/dist-es/overlay/Overlay.js.map +1 -0
  337. package/dist-es/overlay/OverlayContext.js +122 -0
  338. package/dist-es/overlay/OverlayContext.js.map +1 -0
  339. package/dist-es/overlay/OverlayPanel.css.js +4 -0
  340. package/dist-es/overlay/OverlayPanel.css.js.map +1 -0
  341. package/dist-es/overlay/OverlayPanel.js +162 -0
  342. package/dist-es/overlay/OverlayPanel.js.map +1 -0
  343. package/dist-es/overlay/OverlayPanelCloseButton.css.js +4 -0
  344. package/dist-es/overlay/OverlayPanelCloseButton.css.js.map +1 -0
  345. package/dist-es/overlay/OverlayPanelCloseButton.js +121 -0
  346. package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -0
  347. package/dist-es/overlay/OverlayPanelContent.css.js +4 -0
  348. package/dist-es/overlay/OverlayPanelContent.css.js.map +1 -0
  349. package/dist-es/overlay/OverlayPanelContent.js +115 -0
  350. package/dist-es/overlay/OverlayPanelContent.js.map +1 -0
  351. package/dist-es/overlay/OverlayTrigger.js +119 -0
  352. package/dist-es/overlay/OverlayTrigger.js.map +1 -0
  353. package/dist-es/pagination/CompactInput.js +9 -2
  354. package/dist-es/pagination/CompactInput.js.map +1 -1
  355. package/dist-es/pagination/CompactPaginator.js +9 -2
  356. package/dist-es/pagination/CompactPaginator.js.map +1 -1
  357. package/dist-es/pagination/GoToInput.js +9 -2
  358. package/dist-es/pagination/GoToInput.js.map +1 -1
  359. package/dist-es/pagination/PageButton.js +9 -2
  360. package/dist-es/pagination/PageButton.js.map +1 -1
  361. package/dist-es/pagination/PageRanges.js +9 -2
  362. package/dist-es/pagination/PageRanges.js.map +1 -1
  363. package/dist-es/pagination/Pagination.js +9 -2
  364. package/dist-es/pagination/Pagination.js.map +1 -1
  365. package/dist-es/pagination/Paginator.js +9 -2
  366. package/dist-es/pagination/Paginator.js.map +1 -1
  367. package/dist-es/panel/Panel.js +9 -2
  368. package/dist-es/panel/Panel.js.map +1 -1
  369. package/dist-es/pill/Pill.js +10 -2
  370. package/dist-es/pill/Pill.js.map +1 -1
  371. package/dist-es/pill-input/PillInput.js +9 -2
  372. package/dist-es/pill-input/PillInput.js.map +1 -1
  373. package/dist-es/progress/CircularProgress/CircularProgress.js +9 -2
  374. package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
  375. package/dist-es/progress/LinearProgress/LinearProgress.js +11 -4
  376. package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
  377. package/dist-es/radio-button/RadioButton.js +10 -3
  378. package/dist-es/radio-button/RadioButton.js.map +1 -1
  379. package/dist-es/radio-button/RadioButtonGroup.js +9 -2
  380. package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
  381. package/dist-es/radio-button/RadioButtonIcon.js +9 -2
  382. package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
  383. package/dist-es/radio-button/internal/RadioGroupContext.js +9 -2
  384. package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
  385. package/dist-es/salt-provider/SaltProvider.js +9 -2
  386. package/dist-es/salt-provider/SaltProvider.js.map +1 -1
  387. package/dist-es/scrim/Scrim.js +9 -2
  388. package/dist-es/scrim/Scrim.js.map +1 -1
  389. package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js +4 -0
  390. package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js.map +1 -0
  391. package/dist-es/{card/InteractableCard.js → segmented-button-group/SegmentedButtonGroup.js} +20 -45
  392. package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -0
  393. package/dist-es/spinner/Spinner.js +9 -2
  394. package/dist-es/spinner/Spinner.js.map +1 -1
  395. package/dist-es/spinner/svgSpinners/SpinnerSVG.js +9 -2
  396. package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  397. package/dist-es/split-layout/SplitLayout.js +9 -2
  398. package/dist-es/split-layout/SplitLayout.js.map +1 -1
  399. package/dist-es/stack-layout/StackLayout.js +9 -2
  400. package/dist-es/stack-layout/StackLayout.js.map +1 -1
  401. package/dist-es/status-adornment/StatusAdornment.js +9 -2
  402. package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
  403. package/dist-es/status-indicator/StatusIndicator.js +9 -2
  404. package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
  405. package/dist-es/switch/Switch.js +10 -2
  406. package/dist-es/switch/Switch.js.map +1 -1
  407. package/dist-es/text/Text.js +9 -2
  408. package/dist-es/text/Text.js.map +1 -1
  409. package/dist-es/toast/Toast.js +9 -2
  410. package/dist-es/toast/Toast.js.map +1 -1
  411. package/dist-es/toast/ToastContent.js +9 -2
  412. package/dist-es/toast/ToastContent.js.map +1 -1
  413. package/dist-es/toggle-button/ToggleButton.js +10 -2
  414. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  415. package/dist-es/toggle-button-group/ToggleButtonGroup.js +9 -2
  416. package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
  417. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +9 -2
  418. package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
  419. package/dist-es/tooltip/Tooltip.css.js +1 -1
  420. package/dist-es/tooltip/Tooltip.js +15 -3
  421. package/dist-es/tooltip/Tooltip.js.map +1 -1
  422. package/dist-es/tooltip/TooltipBase.js +9 -2
  423. package/dist-es/tooltip/TooltipBase.js.map +1 -1
  424. package/dist-es/tooltip/useAriaAnnounce.js +9 -2
  425. package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
  426. package/dist-es/tooltip/useTooltip.js +8 -1
  427. package/dist-es/tooltip/useTooltip.js.map +1 -1
  428. package/dist-es/utils/useFloatingUI/useFloatingUI.js +3 -5
  429. package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -1
  430. package/dist-es/utils/useValueEffect.js +9 -2
  431. package/dist-es/utils/useValueEffect.js.map +1 -1
  432. package/dist-es/viewport/ViewportProvider.js +9 -2
  433. package/dist-es/viewport/ViewportProvider.js.map +1 -1
  434. package/dist-types/card/index.d.ts +0 -1
  435. package/dist-types/index.d.ts +3 -0
  436. package/dist-types/{card → interactable-card}/InteractableCard.d.ts +15 -1
  437. package/dist-types/interactable-card/InteractableCardGroup.d.ts +27 -0
  438. package/dist-types/interactable-card/InteractableCardGroupContext.d.ts +12 -0
  439. package/dist-types/interactable-card/index.d.ts +3 -0
  440. package/dist-types/overlay/Overlay.d.ts +13 -0
  441. package/dist-types/overlay/OverlayContext.d.ts +21 -0
  442. package/dist-types/overlay/OverlayPanel.d.ts +8 -0
  443. package/dist-types/overlay/OverlayPanelCloseButton.d.ts +2 -0
  444. package/dist-types/overlay/OverlayPanelContent.d.ts +8 -0
  445. package/dist-types/overlay/OverlayTrigger.d.ts +5 -0
  446. package/dist-types/overlay/index.d.ts +5 -0
  447. package/dist-types/segmented-button-group/SegmentedButtonGroup.d.ts +4 -0
  448. package/dist-types/segmented-button-group/index.d.ts +1 -0
  449. package/dist-types/tooltip/Tooltip.d.ts +2 -1
  450. package/dist-types/tooltip/TooltipBase.d.ts +2 -2
  451. package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +1 -1
  452. package/package.json +2 -2
  453. package/dist-cjs/card/InteractableCard.css.js +0 -6
  454. package/dist-cjs/card/InteractableCard.js.map +0 -1
  455. package/dist-cjs/card/useInteractableCard.js.map +0 -1
  456. package/dist-es/card/InteractableCard.css.js +0 -4
  457. package/dist-es/card/InteractableCard.js.map +0 -1
  458. package/dist-es/card/useInteractableCard.js.map +0 -1
  459. /package/dist-cjs/{card → interactable-card}/InteractableCard.css.js.map +0 -0
  460. /package/dist-es/{card → interactable-card}/InteractableCard.css.js.map +0 -0
  461. /package/dist-types/{card → interactable-card}/useInteractableCard.d.ts +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n FocusEvent,\n forwardRef,\n HTMLAttributes,\n SyntheticEvent,\n useRef,\n} from \"react\";\nimport { useForkRef } from \"../utils\";\nimport { Button } from \"../button\";\n\nexport interface FileDropZoneTriggerProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n /**\n * `accept` attribute for HTML <input>.\n *\n * A comma separated list of file types the user can pick from the file input dialog box.\n */\n accept?: string;\n /**\n * Disable all trigger elements.\n */\n disabled?: boolean;\n /**\n * Allows multiple files to be uploaded.\n */\n multiple?: boolean;\n /**\n * Callback for input change event\n */\n onChange?: (event: SyntheticEvent<HTMLInputElement>, files: File[]) => void;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n HTMLButtonElement,\n FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n { accept, children, disabled, multiple = false, onChange, ...rest },\n ref\n) {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const fileInputRef = useRef<HTMLInputElement>(null);\n const triggerRef = useForkRef(ref, buttonRef);\n\n // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n // move focus back on the button element so that all labels can be announced correctly\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n event.stopPropagation();\n buttonRef.current?.focus();\n };\n\n const handleClick = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n fileInputRef.current?.click();\n };\n\n const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n const files = Array.from((event.target as HTMLInputElement).files ?? []);\n onChange?.(event, files);\n };\n return (\n <>\n <Button\n onClick={handleClick}\n disabled={disabled}\n ref={triggerRef}\n {...rest}\n >\n {children ?? \"Browse files\"}\n </Button>\n <input\n accept={accept}\n className=\"input-hidden\"\n disabled={disabled}\n multiple={multiple}\n onChange={handleChange}\n onFocus={handleFocus}\n ref={fileInputRef}\n type=\"file\"\n />\n </>\n );\n});\n"],"names":["FileDropZoneTrigger"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCO,MAAM,mBAAsB,GAAA,UAAA,CAGjC,SAASA,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAU,EAAA,QAAA,EAAU,QAAW,GAAA,KAAA,EAAO,QAAa,EAAA,GAAA,IAAA,IAC7D,GACA,EAAA;AACA,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA,CAAA;AAChD,EAAM,MAAA,YAAA,GAAe,OAAyB,IAAI,CAAA,CAAA;AAClD,EAAM,MAAA,UAAA,GAAa,UAAW,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAI5C,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AA7C/D,IAAA,IAAA,EAAA,CAAA;AA8CI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAA6C,KAAA;AAlDpE,IAAA,IAAA,EAAA,CAAA;AAmDI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAsB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,KAA4C,KAAA;AAvDpE,IAAA,IAAA,EAAA,CAAA;AAwDI,IAAM,MAAA,KAAA,GAAQ,MAAM,IAAM,CAAA,CAAA,EAAA,GAAA,KAAA,CAAM,OAA4B,KAAlC,KAAA,IAAA,GAAA,EAAA,GAA2C,EAAE,CAAA,CAAA;AACvE,IAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAW,KAAO,EAAA,KAAA,CAAA,CAAA;AAAA,GACpB,CAAA;AACA,EACE,uBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAY,EAAA,QAAA,IAAA,IAAA,GAAA,QAAA,GAAA,cAAA;AAAA,OACf,CAAA;AAAA,sBACC,GAAA,CAAA,OAAA,EAAA;AAAA,QACC,MAAA;AAAA,QACA,SAAU,EAAA,cAAA;AAAA,QACV,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAU,EAAA,YAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,GAAK,EAAA,YAAA;AAAA,QACL,IAAK,EAAA,MAAA;AAAA,OACP,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n FocusEvent,\n forwardRef,\n HTMLAttributes,\n SyntheticEvent,\n useRef,\n} from \"react\";\nimport { useForkRef } from \"../utils\";\nimport { Button } from \"../button\";\n\nexport interface FileDropZoneTriggerProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n /**\n * `accept` attribute for HTML <input>.\n *\n * A comma separated list of file types the user can pick from the file input dialog box.\n */\n accept?: string;\n /**\n * Disable all trigger elements.\n */\n disabled?: boolean;\n /**\n * Allows multiple files to be uploaded.\n */\n multiple?: boolean;\n /**\n * Callback for input change event\n */\n onChange?: (event: SyntheticEvent<HTMLInputElement>, files: File[]) => void;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n HTMLButtonElement,\n FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n { accept, children, disabled, multiple = false, onChange, ...rest },\n ref\n) {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const fileInputRef = useRef<HTMLInputElement>(null);\n const triggerRef = useForkRef(ref, buttonRef);\n\n // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n // move focus back on the button element so that all labels can be announced correctly\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n event.stopPropagation();\n buttonRef.current?.focus();\n };\n\n const handleClick = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n fileInputRef.current?.click();\n };\n\n const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n const files = Array.from((event.target as HTMLInputElement).files ?? []);\n onChange?.(event, files);\n };\n return (\n <>\n <Button\n onClick={handleClick}\n disabled={disabled}\n ref={triggerRef}\n {...rest}\n >\n {children ?? \"Browse files\"}\n </Button>\n <input\n accept={accept}\n className=\"input-hidden\"\n disabled={disabled}\n multiple={multiple}\n onChange={handleChange}\n onFocus={handleFocus}\n ref={fileInputRef}\n type=\"file\"\n />\n </>\n );\n});\n"],"names":["FileDropZoneTrigger"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCO,MAAM,mBAAsB,GAAA,UAAA,CAGjC,SAASA,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAU,EAAA,QAAA,EAAU,QAAW,GAAA,KAAA,EAAO,QAAa,EAAA,GAAA,IAAA,IAC7D,GACA,EAAA;AACA,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA,CAAA;AAChD,EAAM,MAAA,YAAA,GAAe,OAAyB,IAAI,CAAA,CAAA;AAClD,EAAM,MAAA,UAAA,GAAa,UAAW,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAI5C,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AA7C/D,IAAA,IAAA,EAAA,CAAA;AA8CI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAA6C,KAAA;AAlDpE,IAAA,IAAA,EAAA,CAAA;AAmDI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAsB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,KAA4C,KAAA;AAvDpE,IAAA,IAAA,EAAA,CAAA;AAwDI,IAAM,MAAA,KAAA,GAAQ,MAAM,IAAM,CAAA,CAAA,EAAA,GAAA,KAAA,CAAM,OAA4B,KAAlC,KAAA,IAAA,GAAA,EAAA,GAA2C,EAAE,CAAA,CAAA;AACvE,IAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAW,KAAO,EAAA,KAAA,CAAA,CAAA;AAAA,GACpB,CAAA;AACA,EACE,uBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAY,EAAA,QAAA,IAAA,IAAA,GAAA,QAAA,GAAA,cAAA;AAAA,OACf,CAAA;AAAA,sBACC,GAAA,CAAA,OAAA,EAAA;AAAA,QACC,MAAA;AAAA,QACA,SAAU,EAAA,cAAA;AAAA,QACV,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAU,EAAA,YAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,GAAK,EAAA,YAAA;AAAA,QACL,IAAK,EAAA,MAAA;AAAA,OACP,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -19,7 +19,6 @@ import '../border-item/BorderItem.js';
19
19
  import '../border-layout/BorderLayout.js';
20
20
  import '../button/Button.js';
21
21
  import '../card/Card.js';
22
- import '../card/InteractableCard.js';
23
22
  import '../checkbox/Checkbox.js';
24
23
  import '../checkbox/CheckboxGroup.js';
25
24
  import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../form-field-context/FormFieldContext.js';
54
53
  import '../grid-item/GridItem.js';
55
54
  import '../grid-layout/GridLayout.js';
56
55
  import '../input/Input.js';
56
+ import '../interactable-card/InteractableCard.js';
57
+ import '../interactable-card/InteractableCardGroup.js';
58
+ import '../interactable-card/InteractableCardGroupContext.js';
57
59
  import '../link/Link.js';
58
60
  import '../link-card/LinkCard.js';
59
61
  import '../list-control/ListControlContext.js';
@@ -61,6 +63,11 @@ import '../multiline-input/MultilineInput.js';
61
63
  import '../navigation-item/NavigationItem.js';
62
64
  import '../option/Option.js';
63
65
  import '../option/OptionGroup.js';
66
+ import '../overlay/OverlayContext.js';
67
+ import '@floating-ui/react';
68
+ import '../overlay/OverlayPanel.js';
69
+ import '../overlay/OverlayPanelCloseButton.js';
70
+ import '../overlay/OverlayPanelContent.js';
64
71
  import '../pagination/Pagination.js';
65
72
  import '../pagination/Paginator.js';
66
73
  import '../pagination/CompactInput.js';
@@ -73,6 +80,7 @@ import '../progress/LinearProgress/LinearProgress.js';
73
80
  import '../radio-button/RadioButton.js';
74
81
  import '../radio-button/RadioButtonGroup.js';
75
82
  import '../scrim/Scrim.js';
83
+ import '../segmented-button-group/SegmentedButtonGroup.js';
76
84
  import '../spinner/Spinner.js';
77
85
  import '../stack-layout/StackLayout.js';
78
86
  import '../status-adornment/StatusAdornment.js';
@@ -84,7 +92,6 @@ import '../toggle-button/ToggleButton.js';
84
92
  import '../toggle-button-group/ToggleButtonGroup.js';
85
93
  import '../toggle-button-group/ToggleButtonGroupContext.js';
86
94
  import '../tooltip/Tooltip.js';
87
- import '@floating-ui/react';
88
95
  import '../viewport/ViewportProvider.js';
89
96
  import css_248z from './FlexItem.css.js';
90
97
 
@@ -1 +1 @@
1
- {"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\nexport type flexItemAlignment = (typeof FLEX_ITEM_ALIGNMENTS)[number];\n\nexport type FlexItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n */\n align?: flexItemAlignment;\n /**\n * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n */\n shrink?: ResponsiveProp<number>;\n /**\n * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n */\n grow?: ResponsiveProp<number>;\n /**\n * Sets the initial main size of a flex item, default is \"auto\".\n */\n basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n }\n >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n shrink,\n grow,\n basis,\n style,\n ...rest\n }: FlexItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-item\",\n css: flexItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const flexItemShrink = useResponsiveProp(shrink, 1);\n const flexItemGrow = useResponsiveProp(grow, 0);\n const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n const itemStyle = {\n \"--saltFlexItem-alignment\": align,\n \"--saltFlexItem-shrink\": flexItemShrink,\n \"--saltFlexItem-grow\": flexItemGrow,\n \"--saltFlexItem-basis\": flexItemBasis,\n ...style,\n };\n return (\n <Component\n className={clsx(withBaseName(), className)}\n ref={ref}\n style={itemStyle}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\nexport type flexItemAlignment = (typeof FLEX_ITEM_ALIGNMENTS)[number];\n\nexport type FlexItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n */\n align?: flexItemAlignment;\n /**\n * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n */\n shrink?: ResponsiveProp<number>;\n /**\n * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n */\n grow?: ResponsiveProp<number>;\n /**\n * Sets the initial main size of a flex item, default is \"auto\".\n */\n basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n }\n >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n shrink,\n grow,\n basis,\n style,\n ...rest\n }: FlexItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-item\",\n css: flexItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const flexItemShrink = useResponsiveProp(shrink, 1);\n const flexItemGrow = useResponsiveProp(grow, 0);\n const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n const itemStyle = {\n \"--saltFlexItem-alignment\": align,\n \"--saltFlexItem-shrink\": flexItemShrink,\n \"--saltFlexItem-grow\": flexItemGrow,\n \"--saltFlexItem-basis\": flexItemBasis,\n ...style,\n };\n return (\n <Component\n className={clsx(withBaseName(), className)}\n ref={ref}\n style={itemStyle}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -19,7 +19,6 @@ import '../border-item/BorderItem.js';
19
19
  import '../border-layout/BorderLayout.js';
20
20
  import '../button/Button.js';
21
21
  import '../card/Card.js';
22
- import '../card/InteractableCard.js';
23
22
  import '../checkbox/Checkbox.js';
24
23
  import '../checkbox/CheckboxGroup.js';
25
24
  import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../form-field-context/FormFieldContext.js';
54
53
  import '../grid-item/GridItem.js';
55
54
  import '../grid-layout/GridLayout.js';
56
55
  import '../input/Input.js';
56
+ import '../interactable-card/InteractableCard.js';
57
+ import '../interactable-card/InteractableCardGroup.js';
58
+ import '../interactable-card/InteractableCardGroupContext.js';
57
59
  import '../link/Link.js';
58
60
  import '../link-card/LinkCard.js';
59
61
  import '../list-control/ListControlContext.js';
@@ -61,6 +63,11 @@ import '../multiline-input/MultilineInput.js';
61
63
  import '../navigation-item/NavigationItem.js';
62
64
  import '../option/Option.js';
63
65
  import '../option/OptionGroup.js';
66
+ import '../overlay/OverlayContext.js';
67
+ import '@floating-ui/react';
68
+ import '../overlay/OverlayPanel.js';
69
+ import '../overlay/OverlayPanelCloseButton.js';
70
+ import '../overlay/OverlayPanelContent.js';
64
71
  import '../pagination/Pagination.js';
65
72
  import '../pagination/Paginator.js';
66
73
  import '../pagination/CompactInput.js';
@@ -73,6 +80,7 @@ import '../progress/LinearProgress/LinearProgress.js';
73
80
  import '../radio-button/RadioButton.js';
74
81
  import '../radio-button/RadioButtonGroup.js';
75
82
  import '../scrim/Scrim.js';
83
+ import '../segmented-button-group/SegmentedButtonGroup.js';
76
84
  import '../spinner/Spinner.js';
77
85
  import '../stack-layout/StackLayout.js';
78
86
  import '../status-adornment/StatusAdornment.js';
@@ -84,7 +92,6 @@ import '../toggle-button/ToggleButton.js';
84
92
  import '../toggle-button-group/ToggleButtonGroup.js';
85
93
  import '../toggle-button-group/ToggleButtonGroupContext.js';
86
94
  import '../tooltip/Tooltip.js';
87
- import '@floating-ui/react';
88
95
  import '../viewport/ViewportProvider.js';
89
96
  import css_248z from './FlexLayout.css.js';
90
97
 
@@ -1 +1 @@
1
- {"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n ...FLEX_ALIGNMENT_BASE,\n \"space-between\",\n \"space-around\",\n \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = (typeof FLEX_ALIGNMENT_BASE)[number];\nexport type FlexContentAlignment = (typeof FLEX_CONTENT_ALIGNMENT_BASE)[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexAlignment | \"stretch\" | \"baseline\";\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the alignment along the main axis, default is \"start\".\n */\n justify?: FlexContentAlignment;\n /**\n * **Deprecated:** For separators see `StackLayout` component instead.\n *\n * Adds a separator between elements if wrap is not active, default is false.\n */\n separators?: LayoutSeparator | true;\n /**\n * Allow the items to wrap as needed, default is false.\n */\n wrap?: ResponsiveProp<boolean>;\n }\n >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n direction,\n gap,\n justify,\n separators,\n style,\n wrap,\n ...rest\n }: FlexLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-layout\",\n css: flexLayoutCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const separatorAlignment = separators === true ? \"center\" : separators;\n const addPrefix = (style: string) => {\n return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n };\n\n const flexGap = useResponsiveProp(gap, 3);\n const flexDirection = useResponsiveProp(direction, \"row\");\n const flexWrap = useResponsiveProp(wrap, false);\n const flexLayoutStyles = {\n ...style,\n \"--flexLayout-align\": align && addPrefix(align),\n \"--flexLayout-direction\": flexDirection,\n \"--flexLayout-gap-multiplier\": flexGap,\n \"--flexLayout-justify\": justify && addPrefix(justify),\n \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n };\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n [withBaseName(\n `separator-${flexDirection || \"row\"}-${\n separatorAlignment || \"center\"\n }`\n )]: separatorAlignment && !wrap,\n [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n separatorAlignment && !wrap,\n },\n className\n )}\n ref={ref}\n style={flexLayoutStyles}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n ...FLEX_ALIGNMENT_BASE,\n \"space-between\",\n \"space-around\",\n \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = (typeof FLEX_ALIGNMENT_BASE)[number];\nexport type FlexContentAlignment = (typeof FLEX_CONTENT_ALIGNMENT_BASE)[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexAlignment | \"stretch\" | \"baseline\";\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the alignment along the main axis, default is \"start\".\n */\n justify?: FlexContentAlignment;\n /**\n * **Deprecated:** For separators see `StackLayout` component instead.\n *\n * Adds a separator between elements if wrap is not active, default is false.\n */\n separators?: LayoutSeparator | true;\n /**\n * Allow the items to wrap as needed, default is false.\n */\n wrap?: ResponsiveProp<boolean>;\n }\n >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n align,\n children,\n className,\n direction,\n gap,\n justify,\n separators,\n style,\n wrap,\n ...rest\n }: FlexLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-flex-layout\",\n css: flexLayoutCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const separatorAlignment = separators === true ? \"center\" : separators;\n const addPrefix = (style: string) => {\n return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n };\n\n const flexGap = useResponsiveProp(gap, 3);\n const flexDirection = useResponsiveProp(direction, \"row\");\n const flexWrap = useResponsiveProp(wrap, false);\n const flexLayoutStyles = {\n ...style,\n \"--flexLayout-align\": align && addPrefix(align),\n \"--flexLayout-direction\": flexDirection,\n \"--flexLayout-gap-multiplier\": flexGap,\n \"--flexLayout-justify\": justify && addPrefix(justify),\n \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n };\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n [withBaseName(\n `separator-${flexDirection || \"row\"}-${\n separatorAlignment || \"center\"\n }`\n )]: separatorAlignment && !wrap,\n [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n separatorAlignment && !wrap,\n },\n className\n )}\n ref={ref}\n style={flexLayoutStyles}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -24,7 +24,6 @@ import '../border-item/BorderItem.js';
24
24
  import '../border-layout/BorderLayout.js';
25
25
  import '../button/Button.js';
26
26
  import '../card/Card.js';
27
- import '../card/InteractableCard.js';
28
27
  import '../checkbox/Checkbox.js';
29
28
  import '../checkbox/CheckboxGroup.js';
30
29
  import '@salt-ds/icons';
@@ -55,6 +54,9 @@ import '../text/TextNotation.js';
55
54
  import '../grid-item/GridItem.js';
56
55
  import '../grid-layout/GridLayout.js';
57
56
  import '../input/Input.js';
57
+ import '../interactable-card/InteractableCard.js';
58
+ import '../interactable-card/InteractableCardGroup.js';
59
+ import '../interactable-card/InteractableCardGroupContext.js';
58
60
  import '../link/Link.js';
59
61
  import '../link-card/LinkCard.js';
60
62
  import '../list-control/ListControlContext.js';
@@ -62,6 +64,11 @@ import '../multiline-input/MultilineInput.js';
62
64
  import '../navigation-item/NavigationItem.js';
63
65
  import '../option/Option.js';
64
66
  import '../option/OptionGroup.js';
67
+ import '../overlay/OverlayContext.js';
68
+ import '@floating-ui/react';
69
+ import '../overlay/OverlayPanel.js';
70
+ import '../overlay/OverlayPanelCloseButton.js';
71
+ import '../overlay/OverlayPanelContent.js';
65
72
  import '../pagination/Pagination.js';
66
73
  import '../pagination/Paginator.js';
67
74
  import '../pagination/CompactInput.js';
@@ -74,6 +81,7 @@ import '../progress/LinearProgress/LinearProgress.js';
74
81
  import '../radio-button/RadioButton.js';
75
82
  import '../radio-button/RadioButtonGroup.js';
76
83
  import '../scrim/Scrim.js';
84
+ import '../segmented-button-group/SegmentedButtonGroup.js';
77
85
  import '../spinner/Spinner.js';
78
86
  import '../stack-layout/StackLayout.js';
79
87
  import '../status-adornment/StatusAdornment.js';
@@ -85,7 +93,6 @@ import '../toggle-button/ToggleButton.js';
85
93
  import '../toggle-button-group/ToggleButtonGroup.js';
86
94
  import '../toggle-button-group/ToggleButtonGroupContext.js';
87
95
  import '../tooltip/Tooltip.js';
88
- import '@floating-ui/react';
89
96
  import css_248z from './FormField.css.js';
90
97
 
91
98
  const withBaseName = makePrefixer("saltFormField");
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /**\n * Disabled prop\n */\n disabled?: boolean;\n /**\n * Location of the label, values: 'top' (default) or 'left'\n */\n labelPlacement?: FormFieldLabelPlacement;\n /**\n * Readonly prop\n */\n readOnly?: boolean;\n /**\n * Optional id prop\n *\n * Used as suffix of FormFieldLabel id: `label-{id}`\n * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n */\n id?: string;\n /**\n * Displays necessity on label\n */\n necessity?: \"required\" | \"optional\" | \"asterisk\";\n /**\n * Validation status\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n (\n {\n children,\n className,\n disabled = false,\n id: idProp,\n labelPlacement = \"top\",\n necessity,\n onBlur,\n onFocus,\n readOnly = false,\n validationStatus,\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field\",\n css: formFieldCss,\n window: targetWindow,\n });\n\n const formId = useId(idProp);\n\n const labelId = formId ? `label-${formId}` : undefined;\n const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(`label${capitalize(labelPlacement)}`)]:\n labelPlacement,\n },\n className\n )}\n {...restProps}\n >\n <FormFieldContext.Provider\n value={{\n a11yProps: {\n \"aria-labelledby\": labelId,\n \"aria-describedby\": helperTextId,\n },\n disabled,\n necessity,\n readOnly,\n validationStatus,\n }}\n >\n {children}\n </FormFieldContext.Provider>\n </div>\n );\n }\n);\n"],"names":["formFieldCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,EAAI,EAAA,MAAA;AAAA,IACJ,cAAiB,GAAA,KAAA;AAAA,IACjB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,gBAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,MAAM,MAAM,CAAA,CAAA;AAE3B,IAAM,MAAA,OAAA,GAAU,MAAS,GAAA,CAAA,MAAA,EAAS,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAC7C,IAAM,MAAA,YAAA,GAAe,MAAS,GAAA,CAAA,WAAA,EAAc,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEvD,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,CAAA,KAAA,EAAQ,UAAW,CAAA,cAAc,GAAG,CAChD,GAAA,cAAA;AAAA,SACJ;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA,CAAC,iBAAiB,QAAjB,EAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,SAAW,EAAA;AAAA,YACT,iBAAmB,EAAA,OAAA;AAAA,YACnB,kBAAoB,EAAA,YAAA;AAAA,WACtB;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,QAAA;AAAA,UACA,gBAAA;AAAA,SACF;AAAA,QAEC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /**\n * Disabled prop\n */\n disabled?: boolean;\n /**\n * Location of the label, values: 'top' (default) or 'left'\n */\n labelPlacement?: FormFieldLabelPlacement;\n /**\n * Readonly prop\n */\n readOnly?: boolean;\n /**\n * Optional id prop\n *\n * Used as suffix of FormFieldLabel id: `label-{id}`\n * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n */\n id?: string;\n /**\n * Displays necessity on label\n */\n necessity?: \"required\" | \"optional\" | \"asterisk\";\n /**\n * Validation status\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n (\n {\n children,\n className,\n disabled = false,\n id: idProp,\n labelPlacement = \"top\",\n necessity,\n onBlur,\n onFocus,\n readOnly = false,\n validationStatus,\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field\",\n css: formFieldCss,\n window: targetWindow,\n });\n\n const formId = useId(idProp);\n\n const labelId = formId ? `label-${formId}` : undefined;\n const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(`label${capitalize(labelPlacement)}`)]:\n labelPlacement,\n },\n className\n )}\n {...restProps}\n >\n <FormFieldContext.Provider\n value={{\n a11yProps: {\n \"aria-labelledby\": labelId,\n \"aria-describedby\": helperTextId,\n },\n disabled,\n necessity,\n readOnly,\n validationStatus,\n }}\n >\n {children}\n </FormFieldContext.Provider>\n </div>\n );\n }\n);\n"],"names":["formFieldCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,EAAI,EAAA,MAAA;AAAA,IACJ,cAAiB,GAAA,KAAA;AAAA,IACjB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,gBAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,MAAM,MAAM,CAAA,CAAA;AAE3B,IAAM,MAAA,OAAA,GAAU,MAAS,GAAA,CAAA,MAAA,EAAS,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAC7C,IAAM,MAAA,YAAA,GAAe,MAAS,GAAA,CAAA,WAAA,EAAc,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEvD,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,CAAA,KAAA,EAAQ,UAAW,CAAA,cAAc,GAAG,CAChD,GAAA,cAAA;AAAA,SACJ;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA,CAAC,iBAAiB,QAAjB,EAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,SAAW,EAAA;AAAA,YACT,iBAAmB,EAAA,OAAA;AAAA,YACnB,kBAAoB,EAAA,YAAA;AAAA,WACtB;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,QAAA;AAAA,UACA,gBAAA;AAAA,SACF;AAAA,QAEC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -28,7 +28,6 @@ import '../border-item/BorderItem.js';
28
28
  import '../border-layout/BorderLayout.js';
29
29
  import '../button/Button.js';
30
30
  import '../card/Card.js';
31
- import '../card/InteractableCard.js';
32
31
  import '../checkbox/Checkbox.js';
33
32
  import '../checkbox/CheckboxGroup.js';
34
33
  import { useComponentCssInjection } from '@salt-ds/styles';
@@ -57,6 +56,9 @@ import css_248z from './FormFieldHelperText.css.js';
57
56
  import '../grid-item/GridItem.js';
58
57
  import '../grid-layout/GridLayout.js';
59
58
  import '../input/Input.js';
59
+ import '../interactable-card/InteractableCard.js';
60
+ import '../interactable-card/InteractableCardGroup.js';
61
+ import '../interactable-card/InteractableCardGroupContext.js';
60
62
  import '../link/Link.js';
61
63
  import '../link-card/LinkCard.js';
62
64
  import '../list-control/ListControlContext.js';
@@ -64,6 +66,11 @@ import '../multiline-input/MultilineInput.js';
64
66
  import '../navigation-item/NavigationItem.js';
65
67
  import '../option/Option.js';
66
68
  import '../option/OptionGroup.js';
69
+ import '../overlay/OverlayContext.js';
70
+ import '@floating-ui/react';
71
+ import '../overlay/OverlayPanel.js';
72
+ import '../overlay/OverlayPanelCloseButton.js';
73
+ import '../overlay/OverlayPanelContent.js';
67
74
  import '../pagination/Pagination.js';
68
75
  import '../pagination/Paginator.js';
69
76
  import '../pagination/CompactInput.js';
@@ -76,6 +83,7 @@ import '../progress/LinearProgress/LinearProgress.js';
76
83
  import '../radio-button/RadioButton.js';
77
84
  import '../radio-button/RadioButtonGroup.js';
78
85
  import '../scrim/Scrim.js';
86
+ import '../segmented-button-group/SegmentedButtonGroup.js';
79
87
  import '../spinner/Spinner.js';
80
88
  import '../stack-layout/StackLayout.js';
81
89
  import '../status-adornment/StatusAdornment.js';
@@ -87,7 +95,6 @@ import '../toggle-button/ToggleButton.js';
87
95
  import '../toggle-button-group/ToggleButtonGroup.js';
88
96
  import '../toggle-button-group/ToggleButtonGroupContext.js';
89
97
  import '../tooltip/Tooltip.js';
90
- import '@floating-ui/react';
91
98
 
92
99
  const withBaseName = makePrefixer("saltFormFieldHelperText");
93
100
  const FormFieldHelperText = ({
@@ -1 +1 @@
1
- {"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n className,\n children,\n ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-helper-text\",\n css: formFieldHelperTextCss,\n window: targetWindow,\n });\n\n const { a11yProps, disabled, readOnly, validationStatus } =\n useFormFieldProps();\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withValidation\")]: validationStatus },\n className\n )}\n >\n {!disabled && !readOnly && validationStatus && (\n <StatusIndicator status={validationStatus} />\n )}\n <Text\n disabled={disabled}\n id={a11yProps?.[\"aria-describedby\"]}\n variant=\"secondary\"\n styleAs=\"label\"\n {...restProps}\n >\n {children}\n </Text>\n </div>\n );\n};\n"],"names":["formFieldHelperTextCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA,CAAA;AAEpD,MAAM,sBAAsB,CAAC;AAAA,EAClC,SAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,SAAA;AACL,CAAuD,KAAA;AACrD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,QAAU,EAAA,gBAAA,KACrC,iBAAkB,EAAA,CAAA;AAEpB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,gBAAgB,IAAI,gBAAiB,EAAA;AAAA,MACrD,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxB,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,sBAE5C,GAAA,CAAA,IAAA,EAAA;AAAA,QACC,QAAA;AAAA,QACA,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,QAChB,OAAQ,EAAA,WAAA;AAAA,QACR,OAAQ,EAAA,OAAA;AAAA,QACP,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n className,\n children,\n ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-helper-text\",\n css: formFieldHelperTextCss,\n window: targetWindow,\n });\n\n const { a11yProps, disabled, readOnly, validationStatus } =\n useFormFieldProps();\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withValidation\")]: validationStatus },\n className\n )}\n >\n {!disabled && !readOnly && validationStatus && (\n <StatusIndicator status={validationStatus} />\n )}\n <Text\n disabled={disabled}\n id={a11yProps?.[\"aria-describedby\"]}\n variant=\"secondary\"\n styleAs=\"label\"\n {...restProps}\n >\n {children}\n </Text>\n </div>\n );\n};\n"],"names":["formFieldHelperTextCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA,CAAA;AAEpD,MAAM,sBAAsB,CAAC;AAAA,EAClC,SAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,SAAA;AACL,CAAuD,KAAA;AACrD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,QAAU,EAAA,gBAAA,KACrC,iBAAkB,EAAA,CAAA;AAEpB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,gBAAgB,IAAI,gBAAiB,EAAA;AAAA,MACrD,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxB,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,sBAE5C,GAAA,CAAA,IAAA,EAAA;AAAA,QACC,QAAA;AAAA,QACA,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,QAChB,OAAQ,EAAA,WAAA;AAAA,QACR,OAAQ,EAAA,OAAA;AAAA,QACP,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
@@ -32,7 +32,6 @@ import '../border-item/BorderItem.js';
32
32
  import '../border-layout/BorderLayout.js';
33
33
  import '../button/Button.js';
34
34
  import '../card/Card.js';
35
- import '../card/InteractableCard.js';
36
35
  import '../checkbox/Checkbox.js';
37
36
  import '../checkbox/CheckboxGroup.js';
38
37
  import '@salt-ds/icons';
@@ -58,6 +57,9 @@ import css_248z from './FormFieldLabel.css.js';
58
57
  import '../grid-item/GridItem.js';
59
58
  import '../grid-layout/GridLayout.js';
60
59
  import '../input/Input.js';
60
+ import '../interactable-card/InteractableCard.js';
61
+ import '../interactable-card/InteractableCardGroup.js';
62
+ import '../interactable-card/InteractableCardGroupContext.js';
61
63
  import '../link/Link.js';
62
64
  import '../link-card/LinkCard.js';
63
65
  import '../list-control/ListControlContext.js';
@@ -65,6 +67,11 @@ import '../multiline-input/MultilineInput.js';
65
67
  import '../navigation-item/NavigationItem.js';
66
68
  import '../option/Option.js';
67
69
  import '../option/OptionGroup.js';
70
+ import '../overlay/OverlayContext.js';
71
+ import '@floating-ui/react';
72
+ import '../overlay/OverlayPanel.js';
73
+ import '../overlay/OverlayPanelCloseButton.js';
74
+ import '../overlay/OverlayPanelContent.js';
68
75
  import '../pagination/Pagination.js';
69
76
  import '../pagination/Paginator.js';
70
77
  import '../pagination/CompactInput.js';
@@ -77,6 +84,7 @@ import '../progress/LinearProgress/LinearProgress.js';
77
84
  import '../radio-button/RadioButton.js';
78
85
  import '../radio-button/RadioButtonGroup.js';
79
86
  import '../scrim/Scrim.js';
87
+ import '../segmented-button-group/SegmentedButtonGroup.js';
80
88
  import '../spinner/Spinner.js';
81
89
  import '../stack-layout/StackLayout.js';
82
90
  import '../status-adornment/StatusAdornment.js';
@@ -88,7 +96,6 @@ import '../toggle-button/ToggleButton.js';
88
96
  import '../toggle-button-group/ToggleButtonGroup.js';
89
97
  import '../toggle-button-group/ToggleButtonGroupContext.js';
90
98
  import '../tooltip/Tooltip.js';
91
- import '@floating-ui/react';
92
99
 
93
100
  const withBaseName = makePrefixer("saltFormFieldLabel");
94
101
  const FormFieldLabel = ({
@@ -1 +1 @@
1
- {"version":3,"file":"FormFieldLabel.js","sources":["../src/form-field/FormFieldLabel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { Label, TextProps } from \"../text\";\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport formFieldLabelCss from \"./FormFieldLabel.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldLabel\");\n\nexport interface FormFieldLabelProps\n extends Omit<TextProps<\"label\">, \"variant\" | \"styleAs\"> {\n /**\n * Intent for the label.\n *\n * Defaults to \"label\"\n * Using \"sentence\" gives more prominent styling\n */\n intent?: \"label\" | \"sentence\";\n}\n\nexport const FormFieldLabel = ({\n className,\n children,\n intent = \"label\",\n ...restProps\n}: FormFieldLabelProps) => {\n const { a11yProps, disabled, necessity } = useFormFieldProps();\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-label\",\n css: formFieldLabelCss,\n window: targetWindow,\n });\n\n const necessityLabel = necessity\n ? necessity === \"asterisk\"\n ? \" *\"\n : ` (${capitalize(necessity)})`\n : undefined;\n\n return (\n <Label\n as=\"label\"\n className={clsx(withBaseName(), withBaseName(intent), className)}\n id={a11yProps?.[\"aria-labelledby\"]}\n disabled={disabled}\n variant=\"secondary\"\n {...restProps}\n >\n {children}\n {necessityLabel && (\n <span className={withBaseName(\"necessityLabel\")}>{necessityLabel}</span>\n )}\n </Label>\n );\n};\n"],"names":["formFieldLabelCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAa/C,MAAM,iBAAiB,CAAC;AAAA,EAC7B,SAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,SAAA;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,EAAE,SAAA,EAAW,QAAU,EAAA,SAAA,KAAc,iBAAkB,EAAA,CAAA;AAC7D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,cAAA,GAAiB,YACnB,SAAc,KAAA,UAAA,GACZ,OACA,CAAK,EAAA,EAAA,UAAA,CAAW,SAAS,CAC3B,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,EAAG,EAAA,OAAA;AAAA,IACH,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,iBAAA,CAAA;AAAA,IAChB,QAAA;AAAA,IACA,OAAQ,EAAA,WAAA;AAAA,IACP,GAAG,SAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,kCACE,GAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,gBAAgB,CAAA;AAAA,QAAI,QAAA,EAAA,cAAA;AAAA,OAAe,CAAA;AAAA,KAAA;AAAA,GAErE,CAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"FormFieldLabel.js","sources":["../src/form-field/FormFieldLabel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { Label, TextProps } from \"../text\";\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport formFieldLabelCss from \"./FormFieldLabel.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldLabel\");\n\nexport interface FormFieldLabelProps\n extends Omit<TextProps<\"label\">, \"variant\" | \"styleAs\"> {\n /**\n * Intent for the label.\n *\n * Defaults to \"label\"\n * Using \"sentence\" gives more prominent styling\n */\n intent?: \"label\" | \"sentence\";\n}\n\nexport const FormFieldLabel = ({\n className,\n children,\n intent = \"label\",\n ...restProps\n}: FormFieldLabelProps) => {\n const { a11yProps, disabled, necessity } = useFormFieldProps();\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-label\",\n css: formFieldLabelCss,\n window: targetWindow,\n });\n\n const necessityLabel = necessity\n ? necessity === \"asterisk\"\n ? \" *\"\n : ` (${capitalize(necessity)})`\n : undefined;\n\n return (\n <Label\n as=\"label\"\n className={clsx(withBaseName(), withBaseName(intent), className)}\n id={a11yProps?.[\"aria-labelledby\"]}\n disabled={disabled}\n variant=\"secondary\"\n {...restProps}\n >\n {children}\n {necessityLabel && (\n <span className={withBaseName(\"necessityLabel\")}>{necessityLabel}</span>\n )}\n </Label>\n );\n};\n"],"names":["formFieldLabelCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAa/C,MAAM,iBAAiB,CAAC;AAAA,EAC7B,SAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,SAAA;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,EAAE,SAAA,EAAW,QAAU,EAAA,SAAA,KAAc,iBAAkB,EAAA,CAAA;AAC7D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,cAAA,GAAiB,YACnB,SAAc,KAAA,UAAA,GACZ,OACA,CAAK,EAAA,EAAA,UAAA,CAAW,SAAS,CAC3B,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,EAAG,EAAA,OAAA;AAAA,IACH,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,iBAAA,CAAA;AAAA,IAChB,QAAA;AAAA,IACA,OAAQ,EAAA,WAAA;AAAA,IACP,GAAG,SAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,kCACE,GAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,gBAAgB,CAAA;AAAA,QAAI,QAAA,EAAA,cAAA;AAAA,OAAe,CAAA;AAAA,KAAA;AAAA,GAErE,CAAA,CAAA;AAEJ;;;;"}
@@ -20,7 +20,6 @@ import '../border-item/BorderItem.js';
20
20
  import '../border-layout/BorderLayout.js';
21
21
  import '../button/Button.js';
22
22
  import '../card/Card.js';
23
- import '../card/InteractableCard.js';
24
23
  import '../checkbox/Checkbox.js';
25
24
  import '../checkbox/CheckboxGroup.js';
26
25
  import '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../text/TextNotation.js';
54
53
  import '../grid-item/GridItem.js';
55
54
  import '../grid-layout/GridLayout.js';
56
55
  import '../input/Input.js';
56
+ import '../interactable-card/InteractableCard.js';
57
+ import '../interactable-card/InteractableCardGroup.js';
58
+ import '../interactable-card/InteractableCardGroupContext.js';
57
59
  import '../link/Link.js';
58
60
  import '../link-card/LinkCard.js';
59
61
  import '../list-control/ListControlContext.js';
@@ -61,6 +63,11 @@ import '../multiline-input/MultilineInput.js';
61
63
  import '../navigation-item/NavigationItem.js';
62
64
  import '../option/Option.js';
63
65
  import '../option/OptionGroup.js';
66
+ import '../overlay/OverlayContext.js';
67
+ import '@floating-ui/react';
68
+ import '../overlay/OverlayPanel.js';
69
+ import '../overlay/OverlayPanelCloseButton.js';
70
+ import '../overlay/OverlayPanelContent.js';
64
71
  import '../pagination/Pagination.js';
65
72
  import '../pagination/Paginator.js';
66
73
  import '../pagination/CompactInput.js';
@@ -73,6 +80,7 @@ import '../progress/LinearProgress/LinearProgress.js';
73
80
  import '../radio-button/RadioButton.js';
74
81
  import '../radio-button/RadioButtonGroup.js';
75
82
  import '../scrim/Scrim.js';
83
+ import '../segmented-button-group/SegmentedButtonGroup.js';
76
84
  import '../spinner/Spinner.js';
77
85
  import '../stack-layout/StackLayout.js';
78
86
  import '../status-adornment/StatusAdornment.js';
@@ -84,7 +92,6 @@ import '../toggle-button/ToggleButton.js';
84
92
  import '../toggle-button-group/ToggleButtonGroup.js';
85
93
  import '../toggle-button-group/ToggleButtonGroupContext.js';
86
94
  import '../tooltip/Tooltip.js';
87
- import '@floating-ui/react';
88
95
 
89
96
  const FormFieldContext = createContext(
90
97
  "FormFieldContext",
@@ -1 +1 @@
1
- {"version":3,"file":"FormFieldContext.js","sources":["../src/form-field-context/FormFieldContext.ts"],"sourcesContent":["import { createContext } from \"../utils\";\n\nexport interface A11yValueProps {\n /**\n * id for FormFieldHelperText\n */\n helperTextId?: string;\n /**\n * id for FormFieldLabel\n */\n labelId?: string;\n}\n\nexport type NecessityType = \"required\" | \"optional\" | \"asterisk\";\n\nexport interface a11yValueAriaProps {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n}\n\nexport interface FormFieldContextValue {\n a11yProps: a11yValueAriaProps;\n disabled: boolean;\n necessity: NecessityType | undefined;\n readOnly: boolean;\n validationStatus: \"error\" | \"warning\" | \"success\" | undefined;\n}\n\nexport const FormFieldContext = createContext(\n \"FormFieldContext\",\n {} as FormFieldContextValue\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA,EAAC;AACH;;;;"}
1
+ {"version":3,"file":"FormFieldContext.js","sources":["../src/form-field-context/FormFieldContext.ts"],"sourcesContent":["import { createContext } from \"../utils\";\n\nexport interface A11yValueProps {\n /**\n * id for FormFieldHelperText\n */\n helperTextId?: string;\n /**\n * id for FormFieldLabel\n */\n labelId?: string;\n}\n\nexport type NecessityType = \"required\" | \"optional\" | \"asterisk\";\n\nexport interface a11yValueAriaProps {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n}\n\nexport interface FormFieldContextValue {\n a11yProps: a11yValueAriaProps;\n disabled: boolean;\n necessity: NecessityType | undefined;\n readOnly: boolean;\n validationStatus: \"error\" | \"warning\" | \"success\" | undefined;\n}\n\nexport const FormFieldContext = createContext(\n \"FormFieldContext\",\n {} as FormFieldContextValue\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA,EAAC;AACH;;;;"}
@@ -19,7 +19,6 @@ import '../border-item/BorderItem.js';
19
19
  import '../border-layout/BorderLayout.js';
20
20
  import '../button/Button.js';
21
21
  import '../card/Card.js';
22
- import '../card/InteractableCard.js';
23
22
  import '../checkbox/Checkbox.js';
24
23
  import '../checkbox/CheckboxGroup.js';
25
24
  import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../text/TextNotation.js';
54
53
  import '../form-field-context/FormFieldContext.js';
55
54
  import '../grid-layout/GridLayout.js';
56
55
  import '../input/Input.js';
56
+ import '../interactable-card/InteractableCard.js';
57
+ import '../interactable-card/InteractableCardGroup.js';
58
+ import '../interactable-card/InteractableCardGroupContext.js';
57
59
  import '../link/Link.js';
58
60
  import '../link-card/LinkCard.js';
59
61
  import '../list-control/ListControlContext.js';
@@ -61,6 +63,11 @@ import '../multiline-input/MultilineInput.js';
61
63
  import '../navigation-item/NavigationItem.js';
62
64
  import '../option/Option.js';
63
65
  import '../option/OptionGroup.js';
66
+ import '../overlay/OverlayContext.js';
67
+ import '@floating-ui/react';
68
+ import '../overlay/OverlayPanel.js';
69
+ import '../overlay/OverlayPanelCloseButton.js';
70
+ import '../overlay/OverlayPanelContent.js';
64
71
  import '../pagination/Pagination.js';
65
72
  import '../pagination/Paginator.js';
66
73
  import '../pagination/CompactInput.js';
@@ -73,6 +80,7 @@ import '../progress/LinearProgress/LinearProgress.js';
73
80
  import '../radio-button/RadioButton.js';
74
81
  import '../radio-button/RadioButtonGroup.js';
75
82
  import '../scrim/Scrim.js';
83
+ import '../segmented-button-group/SegmentedButtonGroup.js';
76
84
  import '../spinner/Spinner.js';
77
85
  import '../stack-layout/StackLayout.js';
78
86
  import '../status-adornment/StatusAdornment.js';
@@ -84,7 +92,6 @@ import '../toggle-button/ToggleButton.js';
84
92
  import '../toggle-button-group/ToggleButtonGroup.js';
85
93
  import '../toggle-button-group/ToggleButtonGroupContext.js';
86
94
  import '../tooltip/Tooltip.js';
87
- import '@floating-ui/react';
88
95
  import '../viewport/ViewportProvider.js';
89
96
  import css_248z from './GridItem.css.js';
90
97
 
@@ -1 +1 @@
1
- {"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,mBAAsB,GAAA;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA4BA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEhD,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AACf,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AAMR,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAsB,GAAA,SAAA;AAAA,IACtB,iBAAoB,GAAA,SAAA;AAAA,IACpB,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,eACpB,GAAA,CAAA,KAAA,EAAQ,eACR,CAAA,CAAA,GAAA,QAAA,CAAA;AAEJ,IAAM,MAAA,aAAA,GAAgB,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEpE,IAAM,MAAA,YAAA,GAAe,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,QAAA,CAAA;AAEnE,IAAM,MAAA,UAAA,GAAa,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEjE,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,GAAG,KAAA;AAAA,MACH,wBAA0B,EAAA,mBAAA;AAAA,MAC1B,sBAAwB,EAAA,iBAAA;AAAA,MACxB,yBAA2B,EAAA,YAAA;AAAA,MAC3B,4BAA8B,EAAA,eAAA;AAAA,MAC9B,uBAAyB,EAAA,UAAA;AAAA,MACzB,0BAA4B,EAAA,aAAA;AAAA,KAC9B,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,UAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,mBAAsB,GAAA;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA4BA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AAEhD,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AACf,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AAMR,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAsB,GAAA,SAAA;AAAA,IACtB,iBAAoB,GAAA,SAAA;AAAA,IACpB,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,iBAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,eACpB,GAAA,CAAA,KAAA,EAAQ,eACR,CAAA,CAAA,GAAA,QAAA,CAAA;AAEJ,IAAM,MAAA,aAAA,GAAgB,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEpE,IAAM,MAAA,YAAA,GAAe,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,QAAA,CAAA;AAEnE,IAAM,MAAA,UAAA,GAAa,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEjE,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,GAAG,KAAA;AAAA,MACH,wBAA0B,EAAA,mBAAA;AAAA,MAC1B,sBAAwB,EAAA,iBAAA;AAAA,MACxB,yBAA2B,EAAA,YAAA;AAAA,MAC3B,4BAA8B,EAAA,eAAA;AAAA,MAC9B,uBAAyB,EAAA,UAAA;AAAA,MACzB,0BAA4B,EAAA,aAAA;AAAA,KAC9B,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,UAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -19,7 +19,6 @@ import '../border-item/BorderItem.js';
19
19
  import '../border-layout/BorderLayout.js';
20
20
  import '../button/Button.js';
21
21
  import '../card/Card.js';
22
- import '../card/InteractableCard.js';
23
22
  import '../checkbox/Checkbox.js';
24
23
  import '../checkbox/CheckboxGroup.js';
25
24
  import { useComponentCssInjection } from '@salt-ds/styles';
@@ -54,6 +53,9 @@ import '../text/TextNotation.js';
54
53
  import '../form-field-context/FormFieldContext.js';
55
54
  import '../grid-item/GridItem.js';
56
55
  import '../input/Input.js';
56
+ import '../interactable-card/InteractableCard.js';
57
+ import '../interactable-card/InteractableCardGroup.js';
58
+ import '../interactable-card/InteractableCardGroupContext.js';
57
59
  import '../link/Link.js';
58
60
  import '../link-card/LinkCard.js';
59
61
  import '../list-control/ListControlContext.js';
@@ -61,6 +63,11 @@ import '../multiline-input/MultilineInput.js';
61
63
  import '../navigation-item/NavigationItem.js';
62
64
  import '../option/Option.js';
63
65
  import '../option/OptionGroup.js';
66
+ import '../overlay/OverlayContext.js';
67
+ import '@floating-ui/react';
68
+ import '../overlay/OverlayPanel.js';
69
+ import '../overlay/OverlayPanelCloseButton.js';
70
+ import '../overlay/OverlayPanelContent.js';
64
71
  import '../pagination/Pagination.js';
65
72
  import '../pagination/Paginator.js';
66
73
  import '../pagination/CompactInput.js';
@@ -73,6 +80,7 @@ import '../progress/LinearProgress/LinearProgress.js';
73
80
  import '../radio-button/RadioButton.js';
74
81
  import '../radio-button/RadioButtonGroup.js';
75
82
  import '../scrim/Scrim.js';
83
+ import '../segmented-button-group/SegmentedButtonGroup.js';
76
84
  import '../spinner/Spinner.js';
77
85
  import '../stack-layout/StackLayout.js';
78
86
  import '../status-adornment/StatusAdornment.js';
@@ -84,7 +92,6 @@ import '../toggle-button/ToggleButton.js';
84
92
  import '../toggle-button-group/ToggleButtonGroup.js';
85
93
  import '../toggle-button-group/ToggleButtonGroupContext.js';
86
94
  import '../tooltip/Tooltip.js';
87
- import '@floating-ui/react';
88
95
  import '../viewport/ViewportProvider.js';
89
96
  import css_248z from './GridLayout.css.js';
90
97
 
@@ -1 +1 @@
1
- {"version":3,"file":"GridLayout.js","sources":["../src/grid-layout/GridLayout.tsx"],"sourcesContent":["import { forwardRef, ReactElement, ElementType } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport gridLayoutCss from \"./GridLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type GridLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Number of columns to be displayed. Defaults to 12\n */\n columns?: ResponsiveProp<number>;\n /**\n * Number of rows to be displayed. Defaults to 1\n */\n rows?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 3\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 1\n */\n columnGap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 1\n */\n rowGap?: ResponsiveProp<number>;\n }\n >;\n\ntype GridLayoutComponent = <T extends ElementType = \"div\">(\n props: GridLayoutProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltGridLayout\");\n\nexport const GridLayout: GridLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n columns = 12,\n rows = 1,\n gap,\n columnGap,\n rowGap,\n style,\n ...rest\n }: GridLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-layout\",\n css: gridLayoutCss,\n window: targetWindow,\n });\n const Component = as || \"div\";\n\n const gridColumns = useResponsiveProp(columns, 12);\n\n const gridRows = useResponsiveProp(rows, 1);\n\n const gridGap = useResponsiveProp(gap, 3);\n\n const gridColumnGap = useResponsiveProp(columnGap, 3);\n\n const gridRowGap = useResponsiveProp(rowGap, 3);\n\n const gridLayoutStyles = {\n ...style,\n \"--gridLayout-columns\": gridColumns,\n \"--gridLayout-rows\": gridRows,\n \"--gridLayout-columnGap\": gridColumnGap ?? gridGap,\n \"--gridLayout-rowGap\": gridRowGap ?? gridGap,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAE3C,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAU,GAAA,EAAA;AAAA,IACV,IAAO,GAAA,CAAA;AAAA,IACP,GAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AACD,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAM,MAAA,WAAA,GAAc,iBAAkB,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AAEjD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAE1C,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AAExC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,CAAC,CAAA,CAAA;AAEpD,IAAM,MAAA,UAAA,GAAa,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAE9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,sBAAwB,EAAA,WAAA;AAAA,MACxB,mBAAqB,EAAA,QAAA;AAAA,MACrB,0BAA0B,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,OAAA;AAAA,MAC3C,uBAAuB,UAAc,IAAA,IAAA,GAAA,UAAA,GAAA,OAAA;AAAA,KACvC,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,gBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"GridLayout.js","sources":["../src/grid-layout/GridLayout.tsx"],"sourcesContent":["import { forwardRef, ReactElement, ElementType } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport gridLayoutCss from \"./GridLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type GridLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Number of columns to be displayed. Defaults to 12\n */\n columns?: ResponsiveProp<number>;\n /**\n * Number of rows to be displayed. Defaults to 1\n */\n rows?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 3\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 1\n */\n columnGap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 1\n */\n rowGap?: ResponsiveProp<number>;\n }\n >;\n\ntype GridLayoutComponent = <T extends ElementType = \"div\">(\n props: GridLayoutProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltGridLayout\");\n\nexport const GridLayout: GridLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n columns = 12,\n rows = 1,\n gap,\n columnGap,\n rowGap,\n style,\n ...rest\n }: GridLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-layout\",\n css: gridLayoutCss,\n window: targetWindow,\n });\n const Component = as || \"div\";\n\n const gridColumns = useResponsiveProp(columns, 12);\n\n const gridRows = useResponsiveProp(rows, 1);\n\n const gridGap = useResponsiveProp(gap, 3);\n\n const gridColumnGap = useResponsiveProp(columnGap, 3);\n\n const gridRowGap = useResponsiveProp(rowGap, 3);\n\n const gridLayoutStyles = {\n ...style,\n \"--gridLayout-columns\": gridColumns,\n \"--gridLayout-rows\": gridRows,\n \"--gridLayout-columnGap\": gridColumnGap ?? gridGap,\n \"--gridLayout-rowGap\": gridRowGap ?? gridGap,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["gridLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAE3C,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAU,GAAA,EAAA;AAAA,IACV,IAAO,GAAA,CAAA;AAAA,IACP,GAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AACD,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAM,MAAA,WAAA,GAAc,iBAAkB,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AAEjD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAE1C,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AAExC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,CAAC,CAAA,CAAA;AAEpD,IAAM,MAAA,UAAA,GAAa,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAE9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,sBAAwB,EAAA,WAAA;AAAA,MACxB,mBAAqB,EAAA,QAAA;AAAA,MACrB,0BAA0B,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,OAAA;AAAA,MAC3C,uBAAuB,UAAc,IAAA,IAAA,GAAA,UAAA,GAAA,OAAA;AAAA,KACvC,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,gBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
package/dist-es/index.js CHANGED
@@ -18,7 +18,6 @@ export { DEFAULT_BREAKPOINTS } from './breakpoints/Breakpoints.js';
18
18
  export { Button, ButtonVariantValues } from './button/Button.js';
19
19
  export { useButton } from './button/useButton.js';
20
20
  export { Card } from './card/Card.js';
21
- export { InteractableCard } from './card/InteractableCard.js';
22
21
  export { Checkbox } from './checkbox/Checkbox.js';
23
22
  export { CheckboxGroup } from './checkbox/CheckboxGroup.js';
24
23
  export { CheckboxIcon } from './checkbox/CheckboxIcon.js';
@@ -46,6 +45,9 @@ export { useFormFieldProps } from './form-field-context/useFormFieldProps.js';
46
45
  export { GRID_ALIGNMENT_BASE, GridItem } from './grid-item/GridItem.js';
47
46
  export { GridLayout } from './grid-layout/GridLayout.js';
48
47
  export { Input } from './input/Input.js';
48
+ export { InteractableCard } from './interactable-card/InteractableCard.js';
49
+ export { InteractableCardGroup } from './interactable-card/InteractableCardGroup.js';
50
+ export { InteractableCardGroupContext, useInteractableCardGroup } from './interactable-card/InteractableCardGroupContext.js';
49
51
  export { Link } from './link/Link.js';
50
52
  export { LinkCard } from './link-card/LinkCard.js';
51
53
  export { useListControlContext } from './list-control/ListControlContext.js';
@@ -53,6 +55,11 @@ export { MultilineInput } from './multiline-input/MultilineInput.js';
53
55
  export { NavigationItem } from './navigation-item/NavigationItem.js';
54
56
  export { Option } from './option/Option.js';
55
57
  export { OptionGroup } from './option/OptionGroup.js';
58
+ export { Overlay } from './overlay/Overlay.js';
59
+ export { OverlayTrigger } from './overlay/OverlayTrigger.js';
60
+ export { OverlayPanel } from './overlay/OverlayPanel.js';
61
+ export { OverlayPanelCloseButton } from './overlay/OverlayPanelCloseButton.js';
62
+ export { OverlayPanelContent } from './overlay/OverlayPanelContent.js';
56
63
  export { Pagination } from './pagination/Pagination.js';
57
64
  export { Paginator } from './pagination/Paginator.js';
58
65
  export { CompactInput } from './pagination/CompactInput.js';
@@ -66,6 +73,7 @@ export { RadioButton } from './radio-button/RadioButton.js';
66
73
  export { RadioButtonGroup } from './radio-button/RadioButtonGroup.js';
67
74
  export { RadioButtonIcon } from './radio-button/RadioButtonIcon.js';
68
75
  export { Scrim } from './scrim/Scrim.js';
76
+ export { SegmentedButtonGroup } from './segmented-button-group/SegmentedButtonGroup.js';
69
77
  export { Spinner, SpinnerSizeValues } from './spinner/Spinner.js';
70
78
  export { StackLayout } from './stack-layout/StackLayout.js';
71
79
  export { StatusAdornment } from './status-adornment/StatusAdornment.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}