@amboss/design-system 4.8.2-canary.1 → 4.9.1

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 (352) hide show
  1. package/build/cjs/components/AIButton/AIButton.js +1 -1
  2. package/build/cjs/components/AccessCardItem/AccessCardItem.js +1 -1
  3. package/build/cjs/components/Avatar/Avatar.js +1 -1
  4. package/build/cjs/components/BulkActionsToolbar/BulkActionsToolbar.js +1 -1
  5. package/build/cjs/components/Button/Button.js +1 -1
  6. package/build/cjs/components/Card/CardHeader/CardHeader.js +1 -1
  7. package/build/cjs/components/CatalogCard/CatalogCard.d.ts +5 -1
  8. package/build/cjs/components/CatalogCard/CatalogCard.js +1 -1
  9. package/build/cjs/components/CheckboxCard/CheckboxCard.js +1 -1
  10. package/build/cjs/components/Collapsible/Collapsible.js +1 -1
  11. package/build/cjs/components/Container/Container.js +1 -1
  12. package/build/cjs/components/Content/ContentBadge/ContentBadge.js +1 -1
  13. package/build/cjs/components/Content/ContentBox/constants.js +1 -1
  14. package/build/cjs/components/Content/ContentBox/types.d.ts +1 -1
  15. package/build/cjs/components/Content/ContentCheckbox/ContentCheckbox.js +1 -1
  16. package/build/cjs/components/Content/ContentLink/ContentLink.js +1 -1
  17. package/build/cjs/components/Content/ContentPictogramButton/ContentPictogramButton.js +1 -1
  18. package/build/cjs/components/Content/ContentTableModal/ContentTableModal.js +2 -2
  19. package/build/cjs/components/Content/ContentText/ContentText.d.ts +1 -1
  20. package/build/cjs/components/Content/ContentText/ContentText.js +1 -1
  21. package/build/cjs/components/Content/DosageButton/DosageButton.d.ts +1 -1
  22. package/build/cjs/components/CountButton/CountButton.js +1 -1
  23. package/build/cjs/components/DataTable/header/SortableCellContent.js +1 -1
  24. package/build/cjs/components/DataTable/header/TableHeader.js +1 -1
  25. package/build/cjs/components/DataTable/useDataTableSelectRows.d.ts +2 -2
  26. package/build/cjs/components/DataTable/useDataTableSelectRows.js +1 -1
  27. package/build/cjs/components/DataTable/useDataTableSort.d.ts +3 -3
  28. package/build/cjs/components/Divider/Divider.js +1 -1
  29. package/build/cjs/components/DropdownMenu/DropdownMenu.d.ts +5 -1
  30. package/build/cjs/components/DropdownMenu/DropdownMenu.js +1 -1
  31. package/build/cjs/components/DropdownMenu/Menu.d.ts +1 -1
  32. package/build/cjs/components/DropdownMenu/Menu.js +1 -1
  33. package/build/cjs/components/EntityList/BaseEntityList.js +1 -1
  34. package/build/cjs/components/EntityList/EntityItemBody.d.ts +3 -1
  35. package/build/cjs/components/EntityList/EntityItemBody.js +1 -1
  36. package/build/cjs/components/EntityList/EntityListItem.js +1 -1
  37. package/build/cjs/components/EntityTree/BaseEntityTree.d.ts +3 -2
  38. package/build/cjs/components/EntityTree/BaseEntityTree.js +1 -1
  39. package/build/cjs/components/EntityTree/EntityTreeItem.js +1 -1
  40. package/build/cjs/components/EntityTree/EntityTreeItemExpandButton.d.ts +3 -1
  41. package/build/cjs/components/EntityTree/EntityTreeItemExpandButton.js +1 -1
  42. package/build/cjs/components/EntityTree/tree.d.ts +1 -1
  43. package/build/cjs/components/EntityTree/tree.js +1 -1
  44. package/build/cjs/components/Form/Checkbox/Checkbox.js +1 -1
  45. package/build/cjs/components/Form/Combobox/Combobox.js +1 -1
  46. package/build/cjs/components/Form/Combobox/MultiSelect.d.ts +1 -1
  47. package/build/cjs/components/Form/Combobox/MultiSelect.js +1 -1
  48. package/build/cjs/components/Form/Combobox/MultiSelectReducer.d.ts +1 -1
  49. package/build/cjs/components/Form/Combobox/OptionsList.d.ts +6 -3
  50. package/build/cjs/components/Form/Combobox/OptionsList.js +1 -1
  51. package/build/cjs/components/Form/Combobox/SingleSelect.d.ts +1 -1
  52. package/build/cjs/components/Form/Combobox/SingleSelect.js +1 -1
  53. package/build/cjs/components/Form/Combobox/constants.js +1 -1
  54. package/build/cjs/components/Form/FormFieldGroup/FormFieldGroup.js +1 -1
  55. package/build/cjs/components/Form/Input/Input.js +1 -1
  56. package/build/cjs/components/Form/PasswordInput/PasswordInput.js +1 -1
  57. package/build/cjs/components/Form/PasswordInput/PasswordInputButton.d.ts +2 -2
  58. package/build/cjs/components/Form/PasswordInput/PasswordInputButton.js +1 -1
  59. package/build/cjs/components/Form/Radio/Radio.js +1 -1
  60. package/build/cjs/components/Form/RangeInput/RangeInput.js +1 -1
  61. package/build/cjs/components/Form/SearchInput/SearchInput.js +1 -1
  62. package/build/cjs/components/Form/SegmentedControl/-types.d.ts +2 -2
  63. package/build/cjs/components/Form/SegmentedControl/SegmentedControl.js +1 -1
  64. package/build/cjs/components/Form/SegmentedControl/SegmentedControlOption.js +1 -1
  65. package/build/cjs/components/Form/Select/Select.js +1 -1
  66. package/build/cjs/components/Form/Select/SelectWithCustomTrigger.js +1 -1
  67. package/build/cjs/components/Form/Select/useTypeAheadSearch.js +1 -1
  68. package/build/cjs/components/Form/Textarea/Textarea.js +1 -1
  69. package/build/cjs/components/Form/Toggle/Toggle.js +1 -1
  70. package/build/cjs/components/Form/ToggleButton/ToggleButton.js +1 -1
  71. package/build/cjs/components/Grid/Grid.js +1 -1
  72. package/build/cjs/components/Icon/Icon.js +1 -1
  73. package/build/cjs/components/Image/Image.js +1 -1
  74. package/build/cjs/components/Inline/Inline.js +1 -1
  75. package/build/cjs/components/Internal/BaseTag/BaseTag.d.ts +5 -1
  76. package/build/cjs/components/Internal/BaseTag/BaseTag.js +1 -1
  77. package/build/cjs/components/Internal/Float/Float.d.ts +1 -1
  78. package/build/cjs/components/Internal/Float/Float.js +1 -1
  79. package/build/cjs/components/Internal/LayoutFloat/LayoutFloatDragHandleGuard.d.ts +3 -1
  80. package/build/cjs/components/Internal/LayoutFloat/LayoutFloatDragHandleGuard.js +1 -1
  81. package/build/cjs/components/Internal/PanelHeader/PanelHeader.js +1 -1
  82. package/build/cjs/components/Internal/Sandwich/useSandwichContext.d.ts +1 -1
  83. package/build/cjs/components/Layout/-constants.d.ts +12 -0
  84. package/build/cjs/components/Layout/-constants.js +1 -1
  85. package/build/cjs/components/Layout/Layout.js +1 -1
  86. package/build/cjs/components/Layout/LayoutCssVars.d.ts +1 -1
  87. package/build/cjs/components/Layout/LeftPanel/LeftBarToggle.js +1 -1
  88. package/build/cjs/components/Layout/Split/MobileSplitView/useMobileSplitStack.d.ts +1 -1
  89. package/build/cjs/components/Layout/context.d.ts +1 -1
  90. package/build/cjs/components/Layout/registry.d.ts +4 -4
  91. package/build/cjs/components/Layout/usePanelDockedSlide.d.ts +10 -0
  92. package/build/cjs/components/Layout/usePanelDockedSlide.js +1 -1
  93. package/build/cjs/components/Lightbox/Lightbox.js +2 -2
  94. package/build/cjs/components/Link/Link.js +1 -1
  95. package/build/cjs/components/MediaItem/MediaItem.d.ts +1 -0
  96. package/build/cjs/components/MediaItem/MediaItem.js +1 -1
  97. package/build/cjs/components/MediaItem/MediaItemSkeleton.js +1 -1
  98. package/build/cjs/components/MediaViewerBar/MediaViewerBar.js +1 -1
  99. package/build/cjs/components/MediaViewerCarousel/CarouselThumbnail/CarouselThumbnail.js +1 -1
  100. package/build/cjs/components/MediaViewerCarousel/MediaCarousel/MediaCarousel.js +1 -1
  101. package/build/cjs/components/Notification/Notification.d.ts +1 -1
  102. package/build/cjs/components/Notification/Notification.js +1 -1
  103. package/build/cjs/components/Patterns/ButtonGroup/ButtonGroup.d.ts +1 -1
  104. package/build/cjs/components/Patterns/EmptyState/EmptyState.js +1 -1
  105. package/build/cjs/components/Patterns/Modal/Modal.js +2 -2
  106. package/build/cjs/components/PictogramButton/PictogramButton.js +1 -1
  107. package/build/cjs/components/Portal/Portal.d.ts +2 -2
  108. package/build/cjs/components/PromptButton/PromptButton.js +1 -1
  109. package/build/cjs/components/PromptInput/AutocompleteList.d.ts +1 -1
  110. package/build/cjs/components/PromptInput/AutocompleteList.js +1 -1
  111. package/build/cjs/components/PromptInput/PromptInput.js +1 -1
  112. package/build/cjs/components/PromptInput/PromptTextArea.js +1 -1
  113. package/build/cjs/components/RadioCard/RadioCard.js +1 -1
  114. package/build/cjs/components/RoundButton/RoundButton.js +1 -1
  115. package/build/cjs/components/SearchResult/SearchResult.js +1 -1
  116. package/build/cjs/components/SegmentedProgressBar/-utils/getPercentagesForVariants.d.ts +4 -2
  117. package/build/cjs/components/SegmentedProgressBar/-utils/getPercentagesForVariants.js +1 -1
  118. package/build/cjs/components/SegmentedProgressBar/LegendPopover.d.ts +2 -1
  119. package/build/cjs/components/SegmentedProgressBar/LegendPopover.js +1 -1
  120. package/build/cjs/components/SegmentedProgressBar/SegmentedProgressBar.js +1 -1
  121. package/build/cjs/components/ShadowWebComponent/ShadowWebComponent.js +1 -1
  122. package/build/cjs/components/Sheet/Sheet.d.ts +1 -1
  123. package/build/cjs/components/Sheet/Sheet.js +1 -1
  124. package/build/cjs/components/SplashCard/SplashCard.js +1 -1
  125. package/build/cjs/components/SplashCardMedia/SplashCardMedia.js +1 -1
  126. package/build/cjs/components/Stack/Stack.js +1 -1
  127. package/build/cjs/components/SubThemeProvider/SubThemeContext.d.ts +1 -1
  128. package/build/cjs/components/SubThemeProvider/SubThemeProvider.d.ts +2 -1
  129. package/build/cjs/components/SubThemeProvider/SubThemeProvider.js +1 -1
  130. package/build/cjs/components/Tabs/Tabs.js +1 -1
  131. package/build/cjs/components/TagGroup/TagGroup.js +1 -1
  132. package/build/cjs/components/Toast/Toast.d.ts +2 -1
  133. package/build/cjs/components/Toast/Toast.js +1 -1
  134. package/build/cjs/components/Toast/ToastProvider.d.ts +5 -3
  135. package/build/cjs/components/Toggletip/BasePopover.js +1 -1
  136. package/build/cjs/components/Tooltip/BaseTooltip.js +1 -1
  137. package/build/cjs/components/Tooltip/TooltipContent.d.ts +13 -1
  138. package/build/cjs/components/Tooltip/TooltipContent.js +1 -1
  139. package/build/cjs/components/Tooltip/utils.d.ts +0 -1
  140. package/build/cjs/components/Tooltip/utils.js +1 -1
  141. package/build/cjs/components/Typography/StyledText/StyledText.d.ts +1 -1
  142. package/build/cjs/components/Typography/StyledText/StyledText.js +1 -1
  143. package/build/cjs/components/Typography/Text/Text.d.ts +1 -1
  144. package/build/cjs/components/Typography/Text/Text.js +1 -1
  145. package/build/cjs/components/Typography/Text/TextSkeleton.js +1 -1
  146. package/build/cjs/components/Typography/TextClamped/TextClamped.js +1 -1
  147. package/build/cjs/components/UserHighlightTooltip/UserHighlightTooltip.d.ts +1 -1
  148. package/build/cjs/components/UserHighlightTooltip/UserHighlightTooltip.js +1 -1
  149. package/build/cjs/components/Utilities/ContainerQuery/ContainerQueryContext.d.ts +1 -1
  150. package/build/cjs/components/Utilities/Expandable/Expandable.js +1 -1
  151. package/build/cjs/components/Utilities/FloatingPosition/utils.d.ts +1 -1
  152. package/build/cjs/components/VirtualScrollList/VirtualScrollList.d.ts +1 -1
  153. package/build/cjs/components/VirtualScrollList/VirtualScrollList.js +1 -1
  154. package/build/cjs/components/VirtualScrollList/VirtualScrollListReducer.d.ts +2 -2
  155. package/build/cjs/components/VirtualScrollList/VirtualScrollListReducer.js +1 -1
  156. package/build/cjs/shared/appendId.d.ts +1 -1
  157. package/build/cjs/shared/forwardRefPolymorphic.d.ts +2 -0
  158. package/build/cjs/shared/forwardRefPolymorphic.js +1 -0
  159. package/build/cjs/shared/intl/translations/de.json +7 -1
  160. package/build/cjs/shared/intl/translations/en.json +7 -1
  161. package/build/cjs/shared/mediaQueries.d.ts +3 -3
  162. package/build/cjs/shared/mixins/Button/getPillStyles.js +1 -1
  163. package/build/cjs/shared/parseDurationMs.d.ts +2 -0
  164. package/build/cjs/shared/parseDurationMs.js +1 -0
  165. package/build/cjs/shared/useAutoPosition.js +1 -1
  166. package/build/cjs/shared/useHover.d.ts +1 -1
  167. package/build/cjs/shared/useHover.js +1 -1
  168. package/build/cjs/shared/useOutsideClickDeactivatesWithinPortal.d.ts +1 -1
  169. package/build/cjs/shared/useOutsideClickDeactivatesWithinPortal.js +1 -1
  170. package/build/cjs/web-tokens/_colors.json +12 -12
  171. package/build/cjs/web-tokens/_sizes.json +55 -55
  172. package/build/cjs/web-tokens/assets/icons.json +4 -5
  173. package/build/cjs/web-tokens/assets/icons16.json +4 -5
  174. package/build/cjs/web-tokens/visualConfig.d.ts +14 -0
  175. package/build/cjs/web-tokens/visualConfig.js +1 -1
  176. package/build/esm/components/AIButton/AIButton.js +1 -1
  177. package/build/esm/components/AccessCardItem/AccessCardItem.js +1 -1
  178. package/build/esm/components/Avatar/Avatar.js +1 -1
  179. package/build/esm/components/BulkActionsToolbar/BulkActionsToolbar.js +1 -1
  180. package/build/esm/components/Button/Button.js +1 -1
  181. package/build/esm/components/Card/CardHeader/CardHeader.js +1 -1
  182. package/build/esm/components/CatalogCard/CatalogCard.d.ts +5 -1
  183. package/build/esm/components/CatalogCard/CatalogCard.js +1 -1
  184. package/build/esm/components/CheckboxCard/CheckboxCard.js +1 -1
  185. package/build/esm/components/Collapsible/Collapsible.js +1 -1
  186. package/build/esm/components/Container/Container.js +1 -1
  187. package/build/esm/components/Content/ContentBadge/ContentBadge.js +1 -1
  188. package/build/esm/components/Content/ContentBox/constants.js +1 -1
  189. package/build/esm/components/Content/ContentBox/types.d.ts +1 -1
  190. package/build/esm/components/Content/ContentCheckbox/ContentCheckbox.js +1 -1
  191. package/build/esm/components/Content/ContentLink/ContentLink.js +1 -1
  192. package/build/esm/components/Content/ContentPictogramButton/ContentPictogramButton.js +1 -1
  193. package/build/esm/components/Content/ContentTableModal/ContentTableModal.js +2 -2
  194. package/build/esm/components/Content/ContentText/ContentText.d.ts +1 -1
  195. package/build/esm/components/Content/ContentText/ContentText.js +1 -1
  196. package/build/esm/components/Content/DosageButton/DosageButton.d.ts +1 -1
  197. package/build/esm/components/CountButton/CountButton.js +1 -1
  198. package/build/esm/components/DataTable/header/SortableCellContent.js +1 -1
  199. package/build/esm/components/DataTable/header/TableHeader.js +1 -1
  200. package/build/esm/components/DataTable/useDataTableSelectRows.d.ts +2 -2
  201. package/build/esm/components/DataTable/useDataTableSelectRows.js +1 -1
  202. package/build/esm/components/DataTable/useDataTableSort.d.ts +3 -3
  203. package/build/esm/components/Divider/Divider.js +1 -1
  204. package/build/esm/components/DropdownMenu/DropdownMenu.d.ts +5 -1
  205. package/build/esm/components/DropdownMenu/DropdownMenu.js +1 -1
  206. package/build/esm/components/DropdownMenu/Menu.d.ts +1 -1
  207. package/build/esm/components/DropdownMenu/Menu.js +1 -1
  208. package/build/esm/components/EntityList/BaseEntityList.js +1 -1
  209. package/build/esm/components/EntityList/EntityItemBody.d.ts +3 -1
  210. package/build/esm/components/EntityList/EntityItemBody.js +1 -1
  211. package/build/esm/components/EntityList/EntityListItem.js +1 -1
  212. package/build/esm/components/EntityTree/BaseEntityTree.d.ts +3 -2
  213. package/build/esm/components/EntityTree/BaseEntityTree.js +1 -1
  214. package/build/esm/components/EntityTree/EntityTreeItem.js +1 -1
  215. package/build/esm/components/EntityTree/EntityTreeItemExpandButton.d.ts +3 -1
  216. package/build/esm/components/EntityTree/EntityTreeItemExpandButton.js +1 -1
  217. package/build/esm/components/EntityTree/tree.d.ts +1 -1
  218. package/build/esm/components/EntityTree/tree.js +1 -1
  219. package/build/esm/components/Form/Checkbox/Checkbox.js +1 -1
  220. package/build/esm/components/Form/Combobox/Combobox.js +1 -1
  221. package/build/esm/components/Form/Combobox/MultiSelect.d.ts +1 -1
  222. package/build/esm/components/Form/Combobox/MultiSelect.js +1 -1
  223. package/build/esm/components/Form/Combobox/MultiSelectReducer.d.ts +1 -1
  224. package/build/esm/components/Form/Combobox/OptionsList.d.ts +6 -3
  225. package/build/esm/components/Form/Combobox/OptionsList.js +1 -1
  226. package/build/esm/components/Form/Combobox/SingleSelect.d.ts +1 -1
  227. package/build/esm/components/Form/Combobox/SingleSelect.js +1 -1
  228. package/build/esm/components/Form/Combobox/constants.js +1 -1
  229. package/build/esm/components/Form/FormFieldGroup/FormFieldGroup.js +1 -1
  230. package/build/esm/components/Form/Input/Input.js +1 -1
  231. package/build/esm/components/Form/PasswordInput/PasswordInput.js +1 -1
  232. package/build/esm/components/Form/PasswordInput/PasswordInputButton.d.ts +2 -2
  233. package/build/esm/components/Form/PasswordInput/PasswordInputButton.js +1 -1
  234. package/build/esm/components/Form/Radio/Radio.js +1 -1
  235. package/build/esm/components/Form/RangeInput/RangeInput.js +1 -1
  236. package/build/esm/components/Form/SearchInput/SearchInput.js +1 -1
  237. package/build/esm/components/Form/SegmentedControl/-types.d.ts +2 -2
  238. package/build/esm/components/Form/SegmentedControl/SegmentedControl.js +1 -1
  239. package/build/esm/components/Form/SegmentedControl/SegmentedControlOption.js +1 -1
  240. package/build/esm/components/Form/Select/Select.js +1 -1
  241. package/build/esm/components/Form/Select/SelectWithCustomTrigger.js +1 -1
  242. package/build/esm/components/Form/Select/useTypeAheadSearch.js +1 -1
  243. package/build/esm/components/Form/Textarea/Textarea.js +1 -1
  244. package/build/esm/components/Form/Toggle/Toggle.js +1 -1
  245. package/build/esm/components/Form/ToggleButton/ToggleButton.js +1 -1
  246. package/build/esm/components/Grid/Grid.js +1 -1
  247. package/build/esm/components/Icon/Icon.js +1 -1
  248. package/build/esm/components/Image/Image.js +1 -1
  249. package/build/esm/components/Inline/Inline.js +1 -1
  250. package/build/esm/components/Internal/BaseTag/BaseTag.d.ts +5 -1
  251. package/build/esm/components/Internal/BaseTag/BaseTag.js +1 -1
  252. package/build/esm/components/Internal/Float/Float.d.ts +1 -1
  253. package/build/esm/components/Internal/Float/Float.js +1 -1
  254. package/build/esm/components/Internal/LayoutFloat/LayoutFloatDragHandleGuard.d.ts +3 -1
  255. package/build/esm/components/Internal/LayoutFloat/LayoutFloatDragHandleGuard.js +1 -1
  256. package/build/esm/components/Internal/PanelHeader/PanelHeader.js +1 -1
  257. package/build/esm/components/Internal/Sandwich/useSandwichContext.d.ts +1 -1
  258. package/build/esm/components/Layout/-constants.d.ts +12 -0
  259. package/build/esm/components/Layout/-constants.js +1 -1
  260. package/build/esm/components/Layout/Layout.js +1 -1
  261. package/build/esm/components/Layout/LayoutCssVars.d.ts +1 -1
  262. package/build/esm/components/Layout/LeftPanel/LeftBarToggle.js +1 -1
  263. package/build/esm/components/Layout/Split/MobileSplitView/useMobileSplitStack.d.ts +1 -1
  264. package/build/esm/components/Layout/context.d.ts +1 -1
  265. package/build/esm/components/Layout/registry.d.ts +4 -4
  266. package/build/esm/components/Layout/usePanelDockedSlide.d.ts +10 -0
  267. package/build/esm/components/Layout/usePanelDockedSlide.js +1 -1
  268. package/build/esm/components/Lightbox/Lightbox.js +2 -2
  269. package/build/esm/components/Link/Link.js +1 -1
  270. package/build/esm/components/MediaItem/MediaItem.d.ts +1 -0
  271. package/build/esm/components/MediaItem/MediaItem.js +1 -1
  272. package/build/esm/components/MediaItem/MediaItemSkeleton.js +1 -1
  273. package/build/esm/components/MediaViewerBar/MediaViewerBar.js +1 -1
  274. package/build/esm/components/MediaViewerCarousel/CarouselThumbnail/CarouselThumbnail.js +1 -1
  275. package/build/esm/components/MediaViewerCarousel/MediaCarousel/MediaCarousel.js +1 -1
  276. package/build/esm/components/Notification/Notification.d.ts +1 -1
  277. package/build/esm/components/Notification/Notification.js +1 -1
  278. package/build/esm/components/Patterns/ButtonGroup/ButtonGroup.d.ts +1 -1
  279. package/build/esm/components/Patterns/EmptyState/EmptyState.js +1 -1
  280. package/build/esm/components/Patterns/Modal/Modal.js +2 -2
  281. package/build/esm/components/PictogramButton/PictogramButton.js +1 -1
  282. package/build/esm/components/Portal/Portal.d.ts +2 -2
  283. package/build/esm/components/PromptButton/PromptButton.js +1 -1
  284. package/build/esm/components/PromptInput/AutocompleteList.d.ts +1 -1
  285. package/build/esm/components/PromptInput/AutocompleteList.js +1 -1
  286. package/build/esm/components/PromptInput/PromptInput.js +1 -1
  287. package/build/esm/components/PromptInput/PromptTextArea.js +1 -1
  288. package/build/esm/components/RadioCard/RadioCard.js +1 -1
  289. package/build/esm/components/RoundButton/RoundButton.js +1 -1
  290. package/build/esm/components/SearchResult/SearchResult.js +1 -1
  291. package/build/esm/components/SegmentedProgressBar/-utils/getPercentagesForVariants.d.ts +4 -2
  292. package/build/esm/components/SegmentedProgressBar/-utils/getPercentagesForVariants.js +1 -1
  293. package/build/esm/components/SegmentedProgressBar/LegendPopover.d.ts +2 -1
  294. package/build/esm/components/SegmentedProgressBar/LegendPopover.js +1 -1
  295. package/build/esm/components/SegmentedProgressBar/SegmentedProgressBar.js +1 -1
  296. package/build/esm/components/ShadowWebComponent/ShadowWebComponent.js +1 -1
  297. package/build/esm/components/Sheet/Sheet.d.ts +1 -1
  298. package/build/esm/components/Sheet/Sheet.js +1 -1
  299. package/build/esm/components/SplashCard/SplashCard.js +1 -1
  300. package/build/esm/components/SplashCardMedia/SplashCardMedia.js +1 -1
  301. package/build/esm/components/Stack/Stack.js +1 -1
  302. package/build/esm/components/SubThemeProvider/SubThemeContext.d.ts +1 -1
  303. package/build/esm/components/SubThemeProvider/SubThemeProvider.d.ts +2 -1
  304. package/build/esm/components/SubThemeProvider/SubThemeProvider.js +1 -1
  305. package/build/esm/components/Tabs/Tabs.js +1 -1
  306. package/build/esm/components/TagGroup/TagGroup.js +1 -1
  307. package/build/esm/components/Toast/Toast.d.ts +2 -1
  308. package/build/esm/components/Toast/Toast.js +1 -1
  309. package/build/esm/components/Toast/ToastProvider.d.ts +5 -3
  310. package/build/esm/components/Toggletip/BasePopover.js +1 -1
  311. package/build/esm/components/Tooltip/BaseTooltip.js +1 -1
  312. package/build/esm/components/Tooltip/TooltipContent.d.ts +13 -1
  313. package/build/esm/components/Tooltip/TooltipContent.js +1 -1
  314. package/build/esm/components/Tooltip/utils.d.ts +0 -1
  315. package/build/esm/components/Tooltip/utils.js +1 -1
  316. package/build/esm/components/Typography/StyledText/StyledText.d.ts +1 -1
  317. package/build/esm/components/Typography/StyledText/StyledText.js +1 -1
  318. package/build/esm/components/Typography/Text/Text.d.ts +1 -1
  319. package/build/esm/components/Typography/Text/Text.js +1 -1
  320. package/build/esm/components/Typography/Text/TextSkeleton.js +1 -1
  321. package/build/esm/components/Typography/TextClamped/TextClamped.js +1 -1
  322. package/build/esm/components/UserHighlightTooltip/UserHighlightTooltip.d.ts +1 -1
  323. package/build/esm/components/UserHighlightTooltip/UserHighlightTooltip.js +1 -1
  324. package/build/esm/components/Utilities/ContainerQuery/ContainerQueryContext.d.ts +1 -1
  325. package/build/esm/components/Utilities/Expandable/Expandable.js +1 -1
  326. package/build/esm/components/Utilities/FloatingPosition/utils.d.ts +1 -1
  327. package/build/esm/components/VirtualScrollList/VirtualScrollList.d.ts +1 -1
  328. package/build/esm/components/VirtualScrollList/VirtualScrollList.js +1 -1
  329. package/build/esm/components/VirtualScrollList/VirtualScrollListReducer.d.ts +2 -2
  330. package/build/esm/components/VirtualScrollList/VirtualScrollListReducer.js +1 -1
  331. package/build/esm/shared/appendId.d.ts +1 -1
  332. package/build/esm/shared/forwardRefPolymorphic.d.ts +2 -0
  333. package/build/esm/shared/forwardRefPolymorphic.js +1 -0
  334. package/build/esm/shared/intl/translations/de.json +7 -1
  335. package/build/esm/shared/intl/translations/en.json +7 -1
  336. package/build/esm/shared/mediaQueries.d.ts +3 -3
  337. package/build/esm/shared/mixins/Button/getPillStyles.js +1 -1
  338. package/build/esm/shared/parseDurationMs.d.ts +2 -0
  339. package/build/esm/shared/parseDurationMs.js +1 -0
  340. package/build/esm/shared/useAutoPosition.js +1 -1
  341. package/build/esm/shared/useHover.d.ts +1 -1
  342. package/build/esm/shared/useHover.js +1 -1
  343. package/build/esm/shared/useOutsideClickDeactivatesWithinPortal.d.ts +1 -1
  344. package/build/esm/shared/useOutsideClickDeactivatesWithinPortal.js +1 -1
  345. package/build/esm/web-tokens/_colors.json +12 -12
  346. package/build/esm/web-tokens/_sizes.json +55 -55
  347. package/build/esm/web-tokens/assets/icons.json +4 -5
  348. package/build/esm/web-tokens/assets/icons16.json +4 -5
  349. package/build/esm/web-tokens/visualConfig.d.ts +14 -0
  350. package/build/esm/web-tokens/visualConfig.js +1 -1
  351. package/build/scss/_variables.scss +6 -0
  352. package/package.json +12 -6
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SearchResult",{enumerable:!0,get:function(){return SearchResult}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Columns=require("../Column/Columns"),_Icon=require("../Icon/Icon"),_Inline=require("../Inline/Inline"),_Stack=require("../Stack/Stack"),_StyledText=require("../Typography/StyledText/StyledText"),_Badge=require("../Badge/Badge"),_TextClamped=require("../Typography/TextClamped/TextClamped"),_Text=require("../Typography/Text/Text"),StyledResultContainer=(0,_styled.default)("div",{target:"ejj4x3a0",label:"StyledResultContainer"})(()=>({position:"relative",textDecoration:"none"})),StyledLinkTitle=(0,_styled.default)("div",{target:"ejj4x3a1",label:"StyledLinkTitle"})(({theme})=>({color:theme.values.color.text.accent.default})),StyledLinkContainerOnHover=(0,_styled.default)("div",{target:"ejj4x3a2",label:"StyledLinkContainerOnHover"})(({theme})=>({"> a":{textDecoration:"none",color:theme.values.color.text.accent.default},"&:hover":{[`${StyledLinkTitle}`]:{textDecoration:"underline"}}})),StyledSecLinkTitle=(0,_styled.default)("span",{target:"ejj4x3a3",label:"StyledSecLinkTitle"})(({theme})=>({display:"list-item",marginLeft:theme.variables.size.spacing.m,paddingTop:theme.variables.size.spacing.xxxs,paddingBottom:theme.variables.size.spacing.xxxs,"&:hover":{"> span":{textDecoration:"underline",color:theme.values.color.text.primary.default}}})),StyledSecLinkContainerOnHover=(0,_styled.default)("div",{target:"ejj4x3a4",label:"StyledSecLinkContainerOnHover"})(({theme})=>({"> a":{textDecoration:"none",color:theme.values.color.text.tertiary.default},"&:hover":{[`${StyledSecLinkTitle}`]:{color:theme.values.color.text.tertiary.default}}})),SecondaryTargets=({data})=>_react.default.createElement(_react.default.Fragment,null,data.map(({title,link:SecLink,body,"data-e2e-test-id":dataE2eTestId},i)=>{let key=`${title}-${i}`;return _react.default.createElement(StyledSecLinkContainerOnHover,{key:key,"data-e2e-test-id":dataE2eTestId},_react.default.createElement(SecLink,null,_react.default.createElement(StyledSecLinkTitle,null,_react.default.createElement(_Text.Text,{size:"m",color:"primary",as:"span"},_react.default.createElement(_StyledText.StyledText,null,title))),body&&_react.default.createElement(_TextClamped.TextClamped,{size:"s",color:"tertiary",lines:2},_react.default.createElement(_StyledText.StyledText,null,body))))})),BadgeWithBottomPadding=(0,_styled.default)("div",{target:"ejj4x3a5",label:"BadgeWithBottomPadding"})(({theme})=>({paddingBottom:theme.variables.size.spacing.xxxs}));function SearchResult({title,subtitle,icon,details,body,secondaryTargets,link,labels,"data-e2e-test-id":dataE2eTestId,...ariaAttributes}){let containerRef=(0,_react.useRef)(null),spacing=subtitle||labels?.length?"xxs":"zero";return _react.default.createElement(StyledResultContainer,{ref:containerRef,"data-ds-id":"SearchResult",...ariaAttributes},_react.default.createElement(_Columns.Columns,{gap:"m"},icon&&_react.default.createElement(_Columns.Column,{size:"narrow"},_react.default.createElement(_Icon.Icon,{name:icon,color:"tertiary"})),_react.default.createElement(_Columns.Column,{size:"fill"},_react.default.createElement(_Stack.Stack,{space:"xxs"},_react.default.createElement(StyledLinkContainerOnHover,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(link,null,_react.default.createElement(_Stack.Stack,{space:spacing},_react.default.createElement(_Columns.Columns,{gap:"xxs"},_react.default.createElement(_Columns.Column,{size:[12,12,"fill"]},_react.default.createElement(StyledLinkTitle,null,_react.default.createElement(_Stack.Stack,{space:"zero"},_react.default.createElement(_TextClamped.TextClamped,{color:"accent",weight:"bold",lines:3,hyphens:"auto"},_react.default.createElement(_StyledText.StyledText,null,title)),subtitle&&_react.default.createElement(_TextClamped.TextClamped,{color:"accent",lines:3,size:"s"},_react.default.createElement(_StyledText.StyledText,null,subtitle))))),labels&&!!labels.length&&_react.default.createElement(_Columns.Column,{size:"narrow"},_react.default.createElement(_Inline.Inline,{space:"xs"},labels.map((label,i)=>{let key=`${i}${label}`;return _react.default.createElement(BadgeWithBottomPadding,{key:key},_react.default.createElement(_Badge.Badge,{text:label}))})))),_react.default.createElement(_Stack.Stack,{space:"xxs"},details&&!!details.length&&_react.default.createElement(_Stack.Stack,{space:"zero"},details.slice(0,3).map(detail=>_react.default.createElement(_TextClamped.TextClamped,{color:"primary",size:"s",key:detail,lines:3},_react.default.createElement(_StyledText.StyledText,null,detail)))),body&&_react.default.createElement(_TextClamped.TextClamped,{size:"s",lines:2},_react.default.createElement(_StyledText.StyledText,null,body)))))),secondaryTargets&&!!secondaryTargets.length&&_react.default.createElement(SecondaryTargets,{data:secondaryTargets})))))}SearchResult.defaultProps={icon:null,details:[],body:null,secondaryTargets:[],labels:[],"data-e2e-test-id":void 0};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SearchResult",{enumerable:!0,get:function(){return SearchResult}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Columns=require("../Column/Columns"),_Icon=require("../Icon/Icon"),_Inline=require("../Inline/Inline"),_Stack=require("../Stack/Stack"),_StyledText=require("../Typography/StyledText/StyledText"),_Badge=require("../Badge/Badge"),_TextClamped=require("../Typography/TextClamped/TextClamped"),_Text=require("../Typography/Text/Text"),StyledResultContainer=(0,_styled.default)("div",{target:"enm6m950",label:"StyledResultContainer"})(()=>({position:"relative",textDecoration:"none"})),StyledLinkTitle=(0,_styled.default)("div",{target:"enm6m951",label:"StyledLinkTitle"})(({theme})=>({color:theme.values.color.text.accent.default})),StyledLinkContainerOnHover=(0,_styled.default)("div",{target:"enm6m952",label:"StyledLinkContainerOnHover"})(({theme})=>({"> a":{textDecoration:"none",color:theme.values.color.text.accent.default},"&:hover":{[`${StyledLinkTitle}`]:{textDecoration:"underline"}}})),StyledSecLinkTitle=(0,_styled.default)("span",{target:"enm6m953",label:"StyledSecLinkTitle"})(({theme})=>({display:"list-item",marginLeft:theme.variables.size.spacing.m,paddingTop:theme.variables.size.spacing.xxxs,paddingBottom:theme.variables.size.spacing.xxxs,"&:hover":{"> span":{textDecoration:"underline",color:theme.values.color.text.primary.default}}})),StyledSecLinkContainerOnHover=(0,_styled.default)("div",{target:"enm6m954",label:"StyledSecLinkContainerOnHover"})(({theme})=>({"> a":{textDecoration:"none",color:theme.values.color.text.tertiary.default},"&:hover":{[`${StyledSecLinkTitle}`]:{color:theme.values.color.text.tertiary.default}}})),SecondaryTargets=({data})=>_react.default.createElement(_react.default.Fragment,null,data.map(({title,link:SecLink,body,"data-e2e-test-id":dataE2eTestId},i)=>{let key=`${title}-${i}`;return _react.default.createElement(StyledSecLinkContainerOnHover,{key:key,"data-e2e-test-id":dataE2eTestId},_react.default.createElement(SecLink,null,_react.default.createElement(StyledSecLinkTitle,null,_react.default.createElement(_Text.Text,{size:"m",color:"primary",as:"span"},_react.default.createElement(_StyledText.StyledText,null,title))),body&&_react.default.createElement(_TextClamped.TextClamped,{size:"s",color:"tertiary",lines:2},_react.default.createElement(_StyledText.StyledText,null,body))))})),BadgeWithBottomPadding=(0,_styled.default)("div",{target:"enm6m955",label:"BadgeWithBottomPadding"})(({theme})=>({paddingBottom:theme.variables.size.spacing.xxxs}));function SearchResult({title,subtitle,icon,details,body,secondaryTargets,link,labels,"data-e2e-test-id":dataE2eTestId,...ariaAttributes}){let containerRef=(0,_react.useRef)(null),spacing=subtitle||labels?.length?"xxs":"zero";return _react.default.createElement(StyledResultContainer,{ref:containerRef,"data-ds-id":"SearchResult",...ariaAttributes},_react.default.createElement(_Columns.Columns,{gap:"m"},icon&&_react.default.createElement(_Columns.Column,{size:"narrow"},_react.default.createElement(_Icon.Icon,{name:icon,color:"tertiary"})),_react.default.createElement(_Columns.Column,{size:"fill"},_react.default.createElement(_Stack.Stack,{space:"xxs"},_react.default.createElement(StyledLinkContainerOnHover,{"data-e2e-test-id":dataE2eTestId},_react.default.createElement(link,null,_react.default.createElement(_Stack.Stack,{space:spacing},_react.default.createElement(_Columns.Columns,{gap:"xxs"},_react.default.createElement(_Columns.Column,{size:[12,12,"fill"]},_react.default.createElement(StyledLinkTitle,null,_react.default.createElement(_Stack.Stack,{space:"zero"},_react.default.createElement(_TextClamped.TextClamped,{color:"accent",weight:"bold",lines:3,hyphens:"auto"},_react.default.createElement(_StyledText.StyledText,null,title)),subtitle&&_react.default.createElement(_TextClamped.TextClamped,{color:"accent",lines:3,size:"s"},_react.default.createElement(_StyledText.StyledText,null,subtitle))))),labels&&!!labels.length&&_react.default.createElement(_Columns.Column,{size:"narrow"},_react.default.createElement(_Inline.Inline,{space:"xs"},labels.map((label,i)=>{let key=`${i}${label}`;return _react.default.createElement(BadgeWithBottomPadding,{key:key},_react.default.createElement(_Badge.Badge,{text:label}))})))),_react.default.createElement(_Stack.Stack,{space:"xxs"},details&&!!details.length&&_react.default.createElement(_Stack.Stack,{space:"zero"},details.slice(0,3).map(detail=>_react.default.createElement(_TextClamped.TextClamped,{color:"primary",size:"s",key:detail,lines:3},_react.default.createElement(_StyledText.StyledText,null,detail)))),body&&_react.default.createElement(_TextClamped.TextClamped,{size:"s",lines:2},_react.default.createElement(_StyledText.StyledText,null,body)))))),secondaryTargets&&!!secondaryTargets.length&&_react.default.createElement(SecondaryTargets,{data:secondaryTargets})))))}SearchResult.defaultProps={icon:void 0,details:[],body:void 0,secondaryTargets:[],labels:[],"data-e2e-test-id":void 0};
@@ -1,5 +1,7 @@
1
1
  import type { ValuesVariant, Value, StyleVariant } from "../-types";
2
- export declare const getPercentagesForVariants: (maxValue: number, values: Partial<Record<ValuesVariant, Value>>) => {
2
+ type VariantPercentage = {
3
3
  percentage: number;
4
4
  variant: StyleVariant;
5
- }[];
5
+ };
6
+ export declare const getPercentagesForVariants: (maxValue: number, values: Partial<Record<ValuesVariant, Value>>) => VariantPercentage[];
7
+ export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"getPercentagesForVariants",{enumerable:!0,get:function(){return getPercentagesForVariants}});const _constants=require("../-constants"),getPercentagesForVariants=(maxValue,values)=>{let result=_constants.variants.map(variant=>{let percentage=100*values[variant]/maxValue;return percentage>0?{percentage,variant:variant}:null}),usedPercentage=result.reduce((currentValue,item)=>currentValue+(item?item.percentage:0),0);return usedPercentage<100&&result.push({percentage:100-usedPercentage,variant:"empty"}),result.filter(Boolean)};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"getPercentagesForVariants",{enumerable:!0,get:function(){return getPercentagesForVariants}});const _constants=require("../-constants"),getPercentagesForVariants=(maxValue,values)=>{let result=_constants.variants.map(variant=>{let percentage=100*(values[variant]??0)/maxValue;return percentage>0?{percentage,variant:variant}:null}),usedPercentage=result.reduce((currentValue,item)=>currentValue+(item?item.percentage:0),0);return usedPercentage<100&&result.push({percentage:100-usedPercentage,variant:"empty"}),result.filter(item=>null!==item)};
@@ -6,6 +6,7 @@ type LegendPopoverProps = {
6
6
  variant: StyleVariant;
7
7
  }[];
8
8
  monochrome: boolean;
9
- } & Pick<SegmentedProgressBarProps, "getTooltipText" | "tooltipProps">;
9
+ getTooltipText: NonNullable<SegmentedProgressBarProps["getTooltipText"]>;
10
+ } & Pick<SegmentedProgressBarProps, "tooltipProps">;
10
11
  export declare function LegendPopover({ percentages, getTooltipText, monochrome, tooltipProps: { triggerAriaLabel, portalContainer }, }: LegendPopoverProps): React.ReactElement;
11
12
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"LegendPopover",{enumerable:!0,get:function(){return LegendPopover}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_PictogramButton=require("../PictogramButton/PictogramButton"),_Popover=require("../Popover/Popover"),_Text=require("../Typography/Text/Text"),_Box=require("../Box/Box"),_Inline=require("../Inline/Inline"),_Stack=require("../Stack/Stack"),_getBackgroundColor=require("./-utils/getBackgroundColor"),StyledKey=(0,_styled.default)("div",{target:"e1liqb4f0",label:"StyledKey"})(({theme,variant,monochrome})=>({width:theme.variables.size.dimension.legendKey.width,height:theme.variables.size.dimension.legendKey.width,borderRadius:theme.variables.size.borderRadius.full,backgroundColor:(0,_getBackgroundColor.getBackgroundColor)(theme,variant,monochrome)}));function LegendPopover({percentages,getTooltipText,monochrome,tooltipProps:{triggerAriaLabel,portalContainer}}){let content=_react.default.createElement(_Box.Box,{space:"m","data-e2e-test-id":"tooltipContent"},_react.default.createElement(_Stack.Stack,{space:"xs"},percentages.map(({percentage,variant})=>_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",key:variant},_react.default.createElement(StyledKey,{variant:variant,monochrome:monochrome,"aria-hidden":!0}),_react.default.createElement(_Text.Text,{size:"s",color:"secondary"},getTooltipText({percentage,variant}))))));return _react.default.createElement(_Popover.Popover,{content:content,portalContainer:portalContainer,defaultVerticalPlacement:"top"},_react.default.createElement(_PictogramButton.PictogramButton,{icon:"help-circle",size:"xs","aria-label":triggerAriaLabel}))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"LegendPopover",{enumerable:!0,get:function(){return LegendPopover}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_PictogramButton=require("../PictogramButton/PictogramButton"),_Popover=require("../Popover/Popover"),_Text=require("../Typography/Text/Text"),_Box=require("../Box/Box"),_Inline=require("../Inline/Inline"),_Stack=require("../Stack/Stack"),_getBackgroundColor=require("./-utils/getBackgroundColor"),StyledKey=(0,_styled.default)("div",{target:"e1ah9t590",label:"StyledKey"})(({theme,variant,monochrome})=>({width:theme.variables.size.dimension.legendKey.width,height:theme.variables.size.dimension.legendKey.width,borderRadius:theme.variables.size.borderRadius.full,backgroundColor:(0,_getBackgroundColor.getBackgroundColor)(theme,variant,monochrome)}));function LegendPopover({percentages,getTooltipText,monochrome,tooltipProps:{triggerAriaLabel="More information",portalContainer}={}}){let content=_react.default.createElement(_Box.Box,{space:"m","data-e2e-test-id":"tooltipContent"},_react.default.createElement(_Stack.Stack,{space:"xs"},percentages.map(({percentage,variant})=>_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",key:variant},_react.default.createElement(StyledKey,{variant:variant,monochrome:monochrome,"aria-hidden":!0}),_react.default.createElement(_Text.Text,{size:"s",color:"secondary"},getTooltipText({percentage,variant}))))));return _react.default.createElement(_Popover.Popover,{content:content,portalContainer:portalContainer,defaultVerticalPlacement:"top"},_react.default.createElement(_PictogramButton.PictogramButton,{icon:"help-circle",size:"xs","aria-label":triggerAriaLabel}))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedProgressBar",{enumerable:!0,get:function(){return SegmentedProgressBar}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_getBackgroundColor=require("./-utils/getBackgroundColor"),_sanitizeInputValues=require("./-utils/sanitizeInputValues"),_getPercentagesForVariants=require("./-utils/getPercentagesForVariants"),_getTotalFilledValue=require("./-utils/getTotalFilledValue"),_LegendPopover=require("./LegendPopover"),StyledProgressBarContainer=(0,_styled.default)("div",{target:"e1ou528a0",label:"StyledProgressBarContainer"})(({theme,squareCorners,weight})=>({width:"100%",lineHeight:0,backgroundColor:theme.values.color.background.placeholder.default,...!squareCorners&&{borderRadius:theme.variables.size.borderRadius.xs},height:"thin"===weight?theme.variables.size.spacing.xxs:theme.variables.size.spacing.xs,position:"relative"})),StyledSegment=(0,_styled.default)("div",{target:"e1ou528a1",label:"StyledSegment"})(({theme,styleVariant,percentage,monochrome,filledPercentage})=>({height:"100%",backgroundColor:(0,_getBackgroundColor.getBackgroundColor)(theme,styleVariant,monochrome),width:`${percentage/filledPercentage*100}%`,minWidth:4,"&:first-of-type":{borderTopLeftRadius:"inherit",borderBottomLeftRadius:"inherit"},"&:last-of-type":{borderTopRightRadius:"inherit",borderBottomRightRadius:"inherit"}})),StyledSegmentContainer=(0,_styled.default)("div",{target:"e1ou528a2",label:"StyledSegmentContainer"})(({theme,filledPercentage})=>({width:`${filledPercentage}%`,minWidth:"fit-content",display:"flex",flexDirection:"row",gap:theme.variables.size.spacing.xxxs,backgroundColor:theme.values.color.background.primary.default,borderRadius:"inherit",height:"100%"})),StyledProgressElement=(0,_styled.default)("progress",{target:"e1ou528a3",label:"StyledProgressElement"})(({theme})=>({appearance:"none",height:1,width:1,margin:-1,overflow:"hidden",padding:0,opacity:theme.variables.opacity.hidden,position:"absolute"})),StyledContainer=(0,_styled.default)("div",{target:"e1ou528a4",label:"StyledContainer"})(({theme})=>({width:"100%",display:"flex",gap:theme.variables.size.spacing.xs,alignItems:"center"}));function SegmentedProgressBar({maxValue,values,weight="fat",squareCorners=!1,getTooltipText,tooltipProps={triggerAriaLabel:"More information"},privateProps:{monochrome}={monochrome:!1},"data-e2e-test-id":dataE2eTestId,id,...ariaAttributes}){let{sanitizedMaxValue,sanitizedValues}=(0,_sanitizeInputValues.sanitizeInputValues)(maxValue,values),percentages=(0,_getPercentagesForVariants.getPercentagesForVariants)(sanitizedMaxValue,sanitizedValues),totalFilledValue=(0,_getTotalFilledValue.getTotalFilledValue)(sanitizedValues),filledSegmentPercentages=percentages.filter(({variant})=>"empty"!==variant),filledPercentage=filledSegmentPercentages.reduce((currentValue,item)=>currentValue+item.percentage,0),segments=filledPercentage?_react.default.createElement(StyledSegmentContainer,{filledPercentage:filledPercentage,"data-e2e-test-id":"segmentContainer"},filledSegmentPercentages.map(({percentage,variant})=>_react.default.createElement(StyledSegment,{key:variant,"data-e2e-test-id":variant,styleVariant:variant,monochrome:monochrome,percentage:percentage,filledPercentage:filledPercentage}))):null;return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"SegmentedProgressBar"},_react.default.createElement(StyledProgressBarContainer,{squareCorners:squareCorners,weight:weight,"data-e2e-test-id":"progressBarContainer"},_react.default.createElement(StyledProgressElement,{max:sanitizedMaxValue,value:totalFilledValue,id:id,...ariaAttributes}),segments),!!getTooltipText&&_react.default.createElement(_LegendPopover.LegendPopover,{percentages:percentages,getTooltipText:getTooltipText,tooltipProps:tooltipProps,monochrome:monochrome}))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SegmentedProgressBar",{enumerable:!0,get:function(){return SegmentedProgressBar}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_getBackgroundColor=require("./-utils/getBackgroundColor"),_sanitizeInputValues=require("./-utils/sanitizeInputValues"),_getPercentagesForVariants=require("./-utils/getPercentagesForVariants"),_getTotalFilledValue=require("./-utils/getTotalFilledValue"),_LegendPopover=require("./LegendPopover"),StyledProgressBarContainer=(0,_styled.default)("div",{target:"eprpznh0",label:"StyledProgressBarContainer"})(({theme,squareCorners,weight})=>({width:"100%",lineHeight:0,backgroundColor:theme.values.color.background.placeholder.default,...!squareCorners&&{borderRadius:theme.variables.size.borderRadius.xs},height:"thin"===weight?theme.variables.size.spacing.xxs:theme.variables.size.spacing.xs,position:"relative"})),StyledSegment=(0,_styled.default)("div",{target:"eprpznh1",label:"StyledSegment"})(({theme,styleVariant,percentage,monochrome,filledPercentage})=>({height:"100%",backgroundColor:(0,_getBackgroundColor.getBackgroundColor)(theme,styleVariant,monochrome),width:`${percentage/filledPercentage*100}%`,minWidth:4,"&:first-of-type":{borderTopLeftRadius:"inherit",borderBottomLeftRadius:"inherit"},"&:last-of-type":{borderTopRightRadius:"inherit",borderBottomRightRadius:"inherit"}})),StyledSegmentContainer=(0,_styled.default)("div",{target:"eprpznh2",label:"StyledSegmentContainer"})(({theme,filledPercentage})=>({width:`${filledPercentage}%`,minWidth:"fit-content",display:"flex",flexDirection:"row",gap:theme.variables.size.spacing.xxxs,backgroundColor:theme.values.color.background.primary.default,borderRadius:"inherit",height:"100%"})),StyledProgressElement=(0,_styled.default)("progress",{target:"eprpznh3",label:"StyledProgressElement"})(({theme})=>({appearance:"none",height:1,width:1,margin:-1,overflow:"hidden",padding:0,opacity:theme.variables.opacity.hidden,position:"absolute"})),StyledContainer=(0,_styled.default)("div",{target:"eprpznh4",label:"StyledContainer"})(({theme})=>({width:"100%",display:"flex",gap:theme.variables.size.spacing.xs,alignItems:"center"}));function SegmentedProgressBar({maxValue,values,weight="fat",squareCorners=!1,getTooltipText,tooltipProps={triggerAriaLabel:"More information"},privateProps:{monochrome=!1}={},"data-e2e-test-id":dataE2eTestId,id,...ariaAttributes}){let{sanitizedMaxValue,sanitizedValues}=(0,_sanitizeInputValues.sanitizeInputValues)(maxValue,values),percentages=(0,_getPercentagesForVariants.getPercentagesForVariants)(sanitizedMaxValue,sanitizedValues),totalFilledValue=(0,_getTotalFilledValue.getTotalFilledValue)(sanitizedValues),filledSegmentPercentages=percentages.filter(({variant})=>"empty"!==variant),filledPercentage=filledSegmentPercentages.reduce((currentValue,item)=>currentValue+item.percentage,0),segments=filledPercentage?_react.default.createElement(StyledSegmentContainer,{filledPercentage:filledPercentage,"data-e2e-test-id":"segmentContainer"},filledSegmentPercentages.map(({percentage,variant})=>_react.default.createElement(StyledSegment,{key:variant,"data-e2e-test-id":variant,styleVariant:variant,monochrome:monochrome,percentage:percentage,filledPercentage:filledPercentage}))):null;return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"SegmentedProgressBar"},_react.default.createElement(StyledProgressBarContainer,{squareCorners:squareCorners,weight:weight,"data-e2e-test-id":"progressBarContainer"},_react.default.createElement(StyledProgressElement,{max:sanitizedMaxValue,value:totalFilledValue,id:id,...ariaAttributes}),segments),getTooltipText&&_react.default.createElement(_LegendPopover.LegendPopover,{percentages:percentages,getTooltipText:getTooltipText,tooltipProps:tooltipProps,monochrome:monochrome}))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ShadowWebComponent",{enumerable:!0,get:function(){return ShadowWebComponent}});const _react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_default")._(require("react")),_client=require("react-dom/client"),_index=require("../../index");class SuchShadow extends HTMLElement{get theme(){return this.themeValue}set theme(value){this.themeValue=value,this.setAttribute("theme",value)}connectedCallback(){this.attachShadow({mode:"open"});let emotionCache=(0,_index.createCache)({key:"shadow-css",container:this.shadowRoot});(0,_client.createRoot)(this.shadowRoot).render(_react.default.createElement(_index.ThemeProvider,{theme:"light-theme"===this.theme?_index.light:_index.dark},_react.default.createElement(_index.CacheProvider,{value:emotionCache},_react.default.createElement(_index.Card,null,_react.default.createElement(_index.CardBox,null,_react.default.createElement(_index.H1,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H2,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H3,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H4,null,"I love you shadow unicorn!!!"))))))}constructor(...args){super(...args),this.themeValue="light-theme"}}function ShadowWebComponent({theme}){return _react.default.createElement("shadow-element",{theme},null)}"undefined"==typeof customElements||customElements.get("shadow-element")||customElements.define("shadow-element",SuchShadow);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"ShadowWebComponent",{enumerable:!0,get:function(){return ShadowWebComponent}});const _react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_default")._(require("react")),_client=require("react-dom/client"),_index=require("../../index");class SuchShadow extends HTMLElement{get theme(){return this.themeValue}set theme(value){this.themeValue=value,this.setAttribute("theme",value)}connectedCallback(){let shadowRoot=this.attachShadow({mode:"open"}),emotionCache=(0,_index.createCache)({key:"shadow-css",container:shadowRoot});(0,_client.createRoot)(shadowRoot).render(_react.default.createElement(_index.ThemeProvider,{theme:"light-theme"===this.theme?_index.light:_index.dark},_react.default.createElement(_index.CacheProvider,{value:emotionCache},_react.default.createElement(_index.Card,null,_react.default.createElement(_index.CardBox,null,_react.default.createElement(_index.H1,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H2,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H3,null,"I love you shadow unicorn!!!"),_react.default.createElement(_index.H4,null,"I love you shadow unicorn!!!"))))))}constructor(...args){super(...args),this.themeValue="light-theme"}}function ShadowWebComponent({theme}){return _react.default.createElement("shadow-element",{theme},null)}"undefined"==typeof customElements||customElements.get("shadow-element")||customElements.define("shadow-element",SuchShadow);
@@ -17,4 +17,4 @@ export type SheetProps = {
17
17
  role?: PopupRole;
18
18
  };
19
19
  export declare const SHEET_MAX_HEIGHT = "80svh";
20
- export declare function Sheet({ id, children, hasBackdrop, isVisible, onClose, onUnmount, portalContainer, dismissOnOutsideClick, disableInitialFocus, disableReturnFocusToTrigger, onClickOutsideDeactivates, "data-e2e-test-id": dataE2eTestId, role, ...ariaAttributes }: SheetProps): React.ReactElement;
20
+ export declare function Sheet({ id, children, hasBackdrop, isVisible, onClose, onUnmount, portalContainer, dismissOnOutsideClick, disableInitialFocus, disableReturnFocusToTrigger, onClickOutsideDeactivates, "data-e2e-test-id": dataE2eTestId, role, ...ariaAttributes }: SheetProps): React.ReactElement | null;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get SHEET_MAX_HEIGHT(){return SHEET_MAX_HEIGHT},get Sheet(){return Sheet}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_reactdom=require("react-dom"),_react1=require("@emotion/react"),_FocusTrapWrapper=require("../../shared/FocusTrapWrapper"),_Container=require("../Container/Container"),_useDragDown=require("../../shared/useDragDown"),_Lightbox=require("../Lightbox/Lightbox"),_isWithinScrolledElement=require("../../shared/isWithinScrolledElement"),SHEET_MAX_HEIGHT="80svh",StyledContainer=(0,_styled.default)("div",{target:"e12q8tu60",label:"StyledContainer"})(({theme,containerHeight,isClosing,isOpening,dragOffset=0})=>{let animation;if(containerHeight){let slideOut=(0,_react1.keyframes)({from:{transform:`translateY(${dragOffset}px)`},to:{transform:`translateY(${containerHeight}px)`}}),slideIn=(0,_react1.keyframes)({from:{transform:`translateY(${containerHeight}px)`},to:{transform:"translateY(0px)"}});animation=isClosing?`200ms ease-out forwards ${slideOut}`:isOpening?`300ms ease-out forwards ${slideIn}`:"none"}return{position:"fixed",left:0,bottom:0,width:"100vw",transformOrigin:"bottom",animation,boxSizing:"border-box",zIndex:theme.variables.zIndex.modal,"> div":{borderBottomLeftRadius:0,borderBottomRightRadius:0}}}),StyledContentContainer=(0,_styled.default)("div",{target:"e12q8tu61",label:"StyledContentContainer"})(({theme,isClosing,isOpening})=>{let animation,fadeOut=(0,_react1.keyframes)({from:{opacity:theme.variables.opacity.visible},to:{opacity:theme.variables.opacity.hidden}}),fadeIn=(0,_react1.keyframes)({from:{opacity:theme.variables.opacity.hidden},to:{opacity:theme.variables.opacity.visible}}),opacity=theme.variables.opacity.hidden;return isClosing?animation=`50ms ease-out forwards ${fadeOut}`:isOpening?animation=`50ms ease-out 250ms forwards ${fadeIn}`:(animation="none",opacity=theme.variables.opacity.visible),{overflow:"auto",maxHeight:"80svh",boxSizing:"border-box",overscrollBehavior:"none",backgroundColor:theme.values.color.background.elevated.default,opacity,animation}}),StyledHandleContainer=(0,_styled.default)("div",{target:"e12q8tu62",label:"StyledHandleContainer"})(({theme,isContentContainerScrolled})=>({padding:`${theme.variables.size.spacing.xs} 0`,display:"flex",justifyContent:"center",backgroundColor:theme.values.color.background.elevated.default,...isContentContainerScrolled&&{boxShadow:theme.values.elevation[1]}})),StyledHandle=(0,_styled.default)("div",{target:"e12q8tu63",label:"StyledHandle"})(({theme})=>({width:"80px",height:"4px",borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.divider.secondary}));function Sheet({id,children,hasBackdrop,isVisible,onClose,onUnmount,portalContainer,dismissOnOutsideClick=!0,disableInitialFocus,disableReturnFocusToTrigger,onClickOutsideDeactivates,"data-e2e-test-id":dataE2eTestId,role,...ariaAttributes}){let[isClosing,setClosing]=(0,_react.useState)(!1),[isOpening,setOpening]=(0,_react.useState)(!1),[containerHeight,setContainerHeight]=(0,_react.useState)(0),[isContentContainerScrolled,setContentContainerScrolled]=(0,_react.useState)(!1),containerRef=(0,_react.useRef)(null),contentContainerRef=(0,_react.useRef)(null),handleContainerRef=(0,_react.useRef)(null),prevVisibleState=(0,_react.useRef)(!1),dragOffset=(0,_react.useRef)(0),isDragStarted=(0,_react.useRef)(!1);(0,_react.useLayoutEffect)(()=>{isVisible&&setOpening(!0)},[isVisible]),(0,_react.useLayoutEffect)(()=>{isVisible&&containerRef.current&&setContainerHeight(containerRef.current.getBoundingClientRect().height)},[isVisible,children]),(0,_react.useEffect)(()=>{!isVisible&&prevVisibleState.current&&setClosing(!0),prevVisibleState.current=isVisible},[isVisible]),(0,_react.useEffect)(()=>{isVisible&&isClosing&&onClose()},[isVisible,isClosing,onClose]);let handleDragStart=(0,_react.useCallback)(()=>{requestAnimationFrame(()=>{contentContainerRef.current?.scrollTop===0&&containerRef.current&&(containerRef.current.style.animation="none",containerRef.current.style.transition="transform 0.1s ease",containerRef.current.style.transform="translateY(0px)",dragOffset.current=0,isDragStarted.current=!0)})},[containerRef,contentContainerRef]),handleDrag=(0,_react.useCallback)((_,offsetFromStart)=>{let containerCurrentHeight=containerRef.current?.getBoundingClientRect()?.height??0;requestAnimationFrame(()=>{isDragStarted.current&&containerRef.current&&contentContainerRef.current?.scrollTop===0&&offsetFromStart<containerCurrentHeight&&(containerRef.current.style.transform=`translateY(${offsetFromStart}px)`,dragOffset.current=offsetFromStart)})},[containerRef,contentContainerRef]),handleDragEnd=(0,_react.useCallback)((_,offsetFromStart)=>{let containerCurrentHeight=containerRef.current?.getBoundingClientRect()?.height??0,minDragDistance=containerCurrentHeight<300?containerCurrentHeight/4:150;requestAnimationFrame(()=>{isDragStarted.current&&(offsetFromStart>=minDragDistance&&contentContainerRef.current?.scrollTop===0?onClose():containerRef.current&&(containerRef.current.style.transform="translateY(0px)",dragOffset.current=0)),isDragStarted.current=!1})},[containerRef,onClose]),handleDragCancel=(0,_react.useCallback)(()=>{requestAnimationFrame(()=>{isDragStarted.current&&containerRef.current&&(containerRef.current.style.transform="translateY(0px)",dragOffset.current=0),isDragStarted.current=!1})},[containerRef]),shouldInitiateDrag=(0,_react.useCallback)(event=>{let target=event.target;return!!handleContainerRef.current?.contains(target)||!((0,_isWithinScrolledElement.isWithinScrolledElement)(target,containerRef.current)||contentContainerRef.current?.scrollTop>0)},[containerRef,contentContainerRef,handleContainerRef]);(0,_useDragDown.useDragDown)({ref:containerRef,isVisible,onDragStart:handleDragStart,onDrag:handleDrag,onDragEnd:handleDragEnd,onDragCancel:handleDragCancel,shouldInitiateDrag});let handlePostDeactivate=(0,_react.useCallback)(()=>{onClose()},[onClose]);if(!((isVisible||isClosing)&&!(isVisible&&isClosing)))return null;let sheetElm=_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_react1.Global,{styles:[{html:{overflow:"hidden",overscrollBehavior:"none"}}]}),_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{clickOutsideDeactivates:dismissOnOutsideClick&&onClickOutsideDeactivates?onClickOutsideDeactivates:dismissOnOutsideClick,allowOutsideClick:!0,escapeDeactivates:!0,preventScroll:!0,initialFocus:()=>!disableInitialFocus,returnFocusOnDeactivate:!disableReturnFocusToTrigger,fallbackFocus:'[data-ds-id="Sheet"]',onPostDeactivate:handlePostDeactivate}},_react.default.createElement(StyledContainer,{...id?{id}:{},"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Sheet",containerHeight:containerHeight,isClosing:isClosing,isOpening:isOpening,ref:containerRef,dragOffset:dragOffset.current,onAnimationEnd:()=>{isClosing?(setClosing(!1),setContainerHeight(0),dragOffset.current=0,onUnmount&&onUnmount()):isOpening&&setOpening(!1)},role:role,...ariaAttributes},_react.default.createElement(_Container.Container,{elevation:4},_react.default.createElement(StyledHandleContainer,{ref:handleContainerRef,isContentContainerScrolled:isContentContainerScrolled},_react.default.createElement(StyledHandle,null)),_react.default.createElement(StyledContentContainer,{isClosing:isClosing,isOpening:isOpening,ref:contentContainerRef,onScroll:()=>{setContentContainerScrolled(contentContainerRef.current?.scrollTop!==0)},onAnimationEnd:evt=>evt.stopPropagation()},children))))),wrappedSheet=hasBackdrop&&!isClosing?_react.default.createElement(_Lightbox.StyledBackdrop,null,sheetElm):sheetElm,container=portalContainer||!!document&&document.body;return container&&(0,_reactdom.createPortal)(wrappedSheet,container)}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get SHEET_MAX_HEIGHT(){return SHEET_MAX_HEIGHT},get Sheet(){return Sheet}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_reactdom=require("react-dom"),_react1=require("@emotion/react"),_FocusTrapWrapper=require("../../shared/FocusTrapWrapper"),_Container=require("../Container/Container"),_useDragDown=require("../../shared/useDragDown"),_Lightbox=require("../Lightbox/Lightbox"),_isWithinScrolledElement=require("../../shared/isWithinScrolledElement"),SHEET_MAX_HEIGHT="80svh",StyledContainer=(0,_styled.default)("div",{target:"e137uunh0",label:"StyledContainer"})(({theme,containerHeight,isClosing,isOpening,dragOffset=0})=>{let animation;if(containerHeight){let slideOut=(0,_react1.keyframes)({from:{transform:`translateY(${dragOffset}px)`},to:{transform:`translateY(${containerHeight}px)`}}),slideIn=(0,_react1.keyframes)({from:{transform:`translateY(${containerHeight}px)`},to:{transform:"translateY(0px)"}});animation=isClosing?`200ms ease-out forwards ${slideOut}`:isOpening?`300ms ease-out forwards ${slideIn}`:"none"}return{position:"fixed",left:0,bottom:0,width:"100vw",transformOrigin:"bottom",animation,boxSizing:"border-box",zIndex:theme.variables.zIndex.modal,"> div":{borderBottomLeftRadius:0,borderBottomRightRadius:0}}}),StyledContentContainer=(0,_styled.default)("div",{target:"e137uunh1",label:"StyledContentContainer"})(({theme,isClosing,isOpening})=>{let animation,fadeOut=(0,_react1.keyframes)({from:{opacity:theme.variables.opacity.visible},to:{opacity:theme.variables.opacity.hidden}}),fadeIn=(0,_react1.keyframes)({from:{opacity:theme.variables.opacity.hidden},to:{opacity:theme.variables.opacity.visible}}),opacity=theme.variables.opacity.hidden;return isClosing?animation=`50ms ease-out forwards ${fadeOut}`:isOpening?animation=`50ms ease-out 250ms forwards ${fadeIn}`:(animation="none",opacity=theme.variables.opacity.visible),{overflow:"auto",maxHeight:"80svh",boxSizing:"border-box",overscrollBehavior:"none",backgroundColor:theme.values.color.background.elevated.default,opacity,animation}}),StyledHandleContainer=(0,_styled.default)("div",{target:"e137uunh2",label:"StyledHandleContainer"})(({theme,isContentContainerScrolled})=>({padding:`${theme.variables.size.spacing.xs} 0`,display:"flex",justifyContent:"center",backgroundColor:theme.values.color.background.elevated.default,...isContentContainerScrolled&&{boxShadow:theme.values.elevation[1]}})),StyledHandle=(0,_styled.default)("div",{target:"e137uunh3",label:"StyledHandle"})(({theme})=>({width:"80px",height:"4px",borderRadius:theme.variables.size.borderRadius.xs,backgroundColor:theme.values.color.divider.secondary}));function Sheet({id,children,hasBackdrop,isVisible,onClose,onUnmount,portalContainer,dismissOnOutsideClick=!0,disableInitialFocus,disableReturnFocusToTrigger,onClickOutsideDeactivates,"data-e2e-test-id":dataE2eTestId,role,...ariaAttributes}){let[isClosing,setClosing]=(0,_react.useState)(!1),[isOpening,setOpening]=(0,_react.useState)(!1),[containerHeight,setContainerHeight]=(0,_react.useState)(0),[isContentContainerScrolled,setContentContainerScrolled]=(0,_react.useState)(!1),containerRef=(0,_react.useRef)(null),contentContainerRef=(0,_react.useRef)(null),handleContainerRef=(0,_react.useRef)(null),prevVisibleState=(0,_react.useRef)(!1),dragOffset=(0,_react.useRef)(0),isDragStarted=(0,_react.useRef)(!1);(0,_react.useLayoutEffect)(()=>{isVisible&&setOpening(!0)},[isVisible]),(0,_react.useLayoutEffect)(()=>{isVisible&&containerRef.current&&setContainerHeight(containerRef.current.getBoundingClientRect().height)},[isVisible,children]),(0,_react.useEffect)(()=>{!isVisible&&prevVisibleState.current&&setClosing(!0),prevVisibleState.current=isVisible},[isVisible]),(0,_react.useEffect)(()=>{isVisible&&isClosing&&onClose()},[isVisible,isClosing,onClose]);let handleDragStart=(0,_react.useCallback)(()=>{requestAnimationFrame(()=>{contentContainerRef.current?.scrollTop===0&&containerRef.current&&(containerRef.current.style.animation="none",containerRef.current.style.transition="transform 0.1s ease",containerRef.current.style.transform="translateY(0px)",dragOffset.current=0,isDragStarted.current=!0)})},[containerRef,contentContainerRef]),handleDrag=(0,_react.useCallback)((_,offsetFromStart)=>{let containerCurrentHeight=containerRef.current?.getBoundingClientRect()?.height??0;requestAnimationFrame(()=>{isDragStarted.current&&containerRef.current&&contentContainerRef.current?.scrollTop===0&&offsetFromStart<containerCurrentHeight&&(containerRef.current.style.transform=`translateY(${offsetFromStart}px)`,dragOffset.current=offsetFromStart)})},[containerRef,contentContainerRef]),handleDragEnd=(0,_react.useCallback)((_,offsetFromStart)=>{let containerCurrentHeight=containerRef.current?.getBoundingClientRect()?.height??0,minDragDistance=containerCurrentHeight<300?containerCurrentHeight/4:150;requestAnimationFrame(()=>{isDragStarted.current&&(offsetFromStart>=minDragDistance&&contentContainerRef.current?.scrollTop===0?onClose():containerRef.current&&(containerRef.current.style.transform="translateY(0px)",dragOffset.current=0)),isDragStarted.current=!1})},[containerRef,onClose]),handleDragCancel=(0,_react.useCallback)(()=>{requestAnimationFrame(()=>{isDragStarted.current&&containerRef.current&&(containerRef.current.style.transform="translateY(0px)",dragOffset.current=0),isDragStarted.current=!1})},[containerRef]),shouldInitiateDrag=(0,_react.useCallback)(event=>{let target=event.target;return!!handleContainerRef.current?.contains(target)||!((0,_isWithinScrolledElement.isWithinScrolledElement)(target,containerRef.current)||(contentContainerRef.current?.scrollTop??0)>0)},[containerRef,contentContainerRef,handleContainerRef]);(0,_useDragDown.useDragDown)({ref:containerRef,isVisible,onDragStart:handleDragStart,onDrag:handleDrag,onDragEnd:handleDragEnd,onDragCancel:handleDragCancel,shouldInitiateDrag});let handlePostDeactivate=(0,_react.useCallback)(()=>{onClose()},[onClose]);if(!((isVisible||isClosing)&&!(isVisible&&isClosing)))return null;let sheetElm=_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_react1.Global,{styles:[{html:{overflow:"hidden",overscrollBehavior:"none"}}]}),_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{clickOutsideDeactivates:dismissOnOutsideClick&&onClickOutsideDeactivates?onClickOutsideDeactivates:dismissOnOutsideClick,allowOutsideClick:!0,escapeDeactivates:!0,preventScroll:!0,initialFocus:()=>!disableInitialFocus,returnFocusOnDeactivate:!disableReturnFocusToTrigger,fallbackFocus:'[data-ds-id="Sheet"]',onPostDeactivate:handlePostDeactivate}},_react.default.createElement(StyledContainer,{...id?{id}:{},"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Sheet",containerHeight:containerHeight,isClosing:isClosing,isOpening:isOpening,ref:containerRef,dragOffset:dragOffset.current,onAnimationEnd:()=>{isClosing?(setClosing(!1),setContainerHeight(0),dragOffset.current=0,onUnmount&&onUnmount()):isOpening&&setOpening(!1)},role:role,...ariaAttributes},_react.default.createElement(_Container.Container,{elevation:4},_react.default.createElement(StyledHandleContainer,{ref:handleContainerRef,isContentContainerScrolled:isContentContainerScrolled},_react.default.createElement(StyledHandle,null)),_react.default.createElement(StyledContentContainer,{isClosing:isClosing,isOpening:isOpening,ref:contentContainerRef,onScroll:()=>{setContentContainerScrolled(contentContainerRef.current?.scrollTop!==0)},onAnimationEnd:evt=>evt.stopPropagation()},children))))),wrappedSheet=hasBackdrop&&!isClosing?_react.default.createElement(_Lightbox.StyledBackdrop,null,sheetElm):sheetElm,container=portalContainer||!!document&&document.body;return container&&(0,_reactdom.createPortal)(wrappedSheet,container)}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SplashCard",{enumerable:!0,get:function(){return SplashCard}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_useHover=require("../../shared/useHover"),_Header=require("../Typography/Header/Header"),_Text=require("../Typography/Text/Text"),_Stack=require("../Stack/Stack"),_Container=require("../Container/Container"),_useFocusWithin=require("../../shared/useFocusWithin"),_Icon=require("../Icon/Icon"),_InteractiveCard=require("../Internal/InteractiveCard/InteractiveCard"),StyledIcon=(0,_styled.default)("div",{target:"ehiczq60",label:"StyledIcon"})(({isVisible,theme})=>({opacity:+!!isVisible,transform:`translateX(${isVisible?0:-25}%)`,transitionProperty:"opacity, transform",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,position:"absolute",top:theme.variables.size.spacing.l,right:theme.variables.size.spacing.l})),CustomContainer=(0,_styled.default)(_Container.Container,{target:"ehiczq61",label:"CustomContainer"})(({theme,isActive,hasShadow})=>({...hasShadow&&{borderBottom:"4px solid rgba(138, 97, 241, 0.20);"},backgroundColor:isActive?theme.values.color.splashCard.background.hover:theme.values.color.background.accentSubtle.default,transitionProperty:"background-color",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,height:"100%"})),CustomH4=(0,_styled.default)(_Header.H4,{target:"ehiczq62",label:"CustomH4"})(({color,theme})=>({..."accent"===color&&{color:theme.values.color.splashCard.text.accent.default}}));function SplashCard({isPressed,disabled,title,description,iconProps,hasShadow,...rest}){let ref=(0,_react.useRef)(null),isHovered=(0,_useHover.useHover)(ref),isFocused=(0,_useFocusWithin.useFocusWithin)(ref),isActive=!disabled&&(isHovered||isFocused||isPressed),activeColor="onAccent",mainTextColor=isActive?activeColor:"accent",descriptionColor=isActive?activeColor:"secondary",rightElement=_react.default.createElement(StyledIcon,{isVisible:isActive},_react.default.createElement(_Icon.Icon,{size:"m",name:"arrow-right",color:activeColor}));return _react.default.createElement(CustomContainer,{hasShadow:hasShadow,isActive:isActive,elevation:0},_react.default.createElement(_InteractiveCard.InteractiveCard,{...rest,ref:ref,disabled:disabled,iconProps:{color:mainTextColor,...iconProps},rightElement:rightElement,"aria-pressed":isPressed??void 0,height:"100%"},_react.default.createElement(_Stack.Stack,{space:"xxs"},_react.default.createElement(CustomH4,{color:mainTextColor},title),description&&_react.default.createElement(_Text.Text,{size:"m",color:descriptionColor},description))))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SplashCard",{enumerable:!0,get:function(){return SplashCard}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_useHover=require("../../shared/useHover"),_Header=require("../Typography/Header/Header"),_Text=require("../Typography/Text/Text"),_Stack=require("../Stack/Stack"),_Container=require("../Container/Container"),_useFocusWithin=require("../../shared/useFocusWithin"),_Icon=require("../Icon/Icon"),_InteractiveCard=require("../Internal/InteractiveCard/InteractiveCard"),StyledIcon=(0,_styled.default)("div",{target:"eevu1zx0",label:"StyledIcon"})(({isVisible,theme})=>({opacity:+!!isVisible,transform:`translateX(${isVisible?0:-25}%)`,transitionProperty:"opacity, transform",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,position:"absolute",top:theme.variables.size.spacing.l,right:theme.variables.size.spacing.l})),CustomContainer=(0,_styled.default)(_Container.Container,{target:"eevu1zx1",label:"CustomContainer"})(({theme,isActive,hasShadow})=>({...hasShadow&&{borderBottom:"4px solid rgba(138, 97, 241, 0.20);"},backgroundColor:isActive?theme.values.color.splashCard.background.hover:theme.values.color.background.accentSubtle.default,transitionProperty:"background-color",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,height:"100%"})),CustomH4=(0,_styled.default)(_Header.H4,{target:"eevu1zx2",label:"CustomH4"})(({color,theme})=>({..."accent"===color&&{color:theme.values.color.splashCard.text.accent.default}}));function SplashCard({isPressed,disabled,title,description,iconProps,hasShadow,...rest}){let ref=(0,_react.useRef)(null),isHovered=(0,_useHover.useHover)(ref),isFocused=(0,_useFocusWithin.useFocusWithin)(ref),isActive=!disabled&&!!(isHovered||isFocused||isPressed),activeColor="onAccent",mainTextColor=isActive?activeColor:"accent",descriptionColor=isActive?activeColor:"secondary",rightElement=_react.default.createElement(StyledIcon,{isVisible:isActive},_react.default.createElement(_Icon.Icon,{size:"m",name:"arrow-right",color:activeColor}));return _react.default.createElement(CustomContainer,{hasShadow:hasShadow,isActive:isActive,elevation:0},_react.default.createElement(_InteractiveCard.InteractiveCard,{...rest,ref:ref,disabled:disabled,iconProps:iconProps&&{color:mainTextColor,...iconProps},rightElement:rightElement,"aria-pressed":isPressed??void 0,height:"100%"},_react.default.createElement(_Stack.Stack,{space:"xxs"},_react.default.createElement(CustomH4,{color:mainTextColor},title),description&&_react.default.createElement(_Text.Text,{size:"m",color:descriptionColor},description))))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SplashCardMedia",{enumerable:!0,get:function(){return SplashCardMedia}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/_breakpoints.json")),_useHover=require("../../shared/useHover"),_Header=require("../Typography/Header/Header"),_Text=require("../Typography/Text/Text"),_Stack=require("../Stack/Stack"),_Container=require("../Container/Container"),_useFocusWithin=require("../../shared/useFocusWithin"),_Icon=require("../Icon/Icon"),_Image=require("../Image/Image"),_Box=require("../Box/Box"),_mixins=require("../../shared/mixins"),_useBreakpoints=require("../../shared/useBreakpoints"),CustomContainer=(0,_styled.default)(_Container.Container,{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"isActive"!==prop&&"hasShadow"!==prop,target:"eddois80",label:"CustomContainer"})(({theme,isActive,hasShadow})=>({...hasShadow&&{borderBottom:"4px solid rgba(138, 97, 241, 0.20)"},backgroundColor:isActive?theme.values.color.splashCard.background.hover:theme.values.color.background.accentSubtle.default,transitionProperty:"background-color",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,width:"100%",height:"100%"})),StyledButton=(0,_styled.default)("button",{target:"eddois81",label:"StyledButton"})(({theme,disabled})=>({...(0,_mixins.getButtonAppearanceReset)(),...(0,_mixins.getBaseButtonStyles)({theme}),...(0,_mixins.getFocusStyles)(),...disabled&&{...(0,_mixins.getDisabledStyles)({theme}),cursor:"not-allowed"},position:"relative",width:"100%",height:"100%",display:"flex",flexDirection:"row",textAlign:"left",alignItems:"center",padding:0,[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"column",alignItems:"start"}})),ImageWrapper=(0,_styled.default)("div",{target:"eddois82",label:"ImageWrapper"})(({theme,borderRadius})=>({width:179,flexShrink:0,overflow:"hidden",borderBottomLeftRadius:theme.variables.size.borderRadius[borderRadius],[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{width:"calc(100% - 40px)"}})),StyledImage=(0,_styled.default)(_Image.Image,{target:"eddois83",label:"StyledImage"})({width:"100%",height:"100%",display:"block"}),FadingIconLayer=(0,_styled.default)("div",{target:"eddois84",label:"FadingIconLayer"})(({theme,isVisible})=>({position:"absolute",top:theme.variables.size.spacing.l,right:theme.variables.size.spacing.l,opacity:+!!isVisible,transitionProperty:"opacity",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction})),LabelWrapper=(0,_styled.default)("div",{target:"eddois85",label:"LabelWrapper"})(({theme,isActive})=>({opacity:isActive?.6:1,transitionProperty:"opacity",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction})),getTextColor=(color,theme)=>"accent"===color?{color:theme.values.color.splashCard.text.accent.default}:{},CustomH4=(0,_styled.default)(_Header.H4,{target:"eddois86",label:"CustomH4"})(({color,theme})=>({...getTextColor(color,theme)})),CustomH6=(0,_styled.default)(_Header.H6,{target:"eddois87",label:"CustomH6"})(({color,theme})=>({...getTextColor(color,theme)})),CustomH5=(0,_styled.default)(_Header.H5,{target:"eddois88",label:"CustomH5"})(({color,theme})=>({...getTextColor(color,theme)}));function SplashCardMedia({isPressed,disabled,title,description,variant="standard",iconProps,imageProps,hasShadow,...rest}){let ref=(0,_react.useRef)(null),isHovered=(0,_useHover.useHover)(ref),isFocused=(0,_useFocusWithin.useFocusWithin)(ref),isActive=!disabled&&(isHovered||isFocused||isPressed),activeColor="onAccent",mainTextColor=isActive?activeColor:"accent",descriptionColor=isActive?activeColor:"secondary",labelColor=isActive?activeColor:"tertiary",{isMobile,isSmallMobile}=(0,_useBreakpoints.useBreakpoints)(),showIcons=!isMobile,DescriptionHeading=isMobile?CustomH5:CustomH4;return _react.default.createElement(CustomContainer,{hasShadow:hasShadow,isActive:isActive,elevation:0,overflow:"hidden",borderRadius:"m"},_react.default.createElement(StyledButton,{ref:ref,disabled:disabled,"aria-pressed":isPressed??void 0,...rest},!isSmallMobile&&_react.default.createElement(ImageWrapper,{borderRadius:"m"},_react.default.createElement(StyledImage,{...imageProps,fit:"contain"})),iconProps&&showIcons&&_react.default.createElement(FadingIconLayer,{isVisible:!isActive},_react.default.createElement(_Icon.Icon,{size:"m",...iconProps,color:mainTextColor})),showIcons&&_react.default.createElement(FadingIconLayer,{isVisible:isActive},_react.default.createElement(_Icon.Icon,{size:"m",name:"arrow-right",color:activeColor})),_react.default.createElement(_Box.StyledBox,{space:["m","l"],lSpace:isSmallMobile?"m":"l"},_react.default.createElement(_Stack.Stack,{space:"xxs"},"bold"===variant?_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(LabelWrapper,{isActive:isActive},_react.default.createElement(CustomH6,{as:"div",color:labelColor},title)),description&&_react.default.createElement(DescriptionHeading,{as:"div",color:mainTextColor},description)):_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(CustomH4,{as:"div",color:mainTextColor},title),description&&_react.default.createElement(_Text.Text,{size:isMobile?"s":"m",color:descriptionColor},description))))))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SplashCardMedia",{enumerable:!0,get:function(){return SplashCardMedia}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_breakpointsjson=/*#__PURE__*/_interop_require_default._(require("../../web-tokens/_breakpoints.json")),_useHover=require("../../shared/useHover"),_Header=require("../Typography/Header/Header"),_Text=require("../Typography/Text/Text"),_Stack=require("../Stack/Stack"),_Container=require("../Container/Container"),_useFocusWithin=require("../../shared/useFocusWithin"),_Icon=require("../Icon/Icon"),_Image=require("../Image/Image"),_Box=require("../Box/Box"),_mixins=require("../../shared/mixins"),_useBreakpoints=require("../../shared/useBreakpoints"),CustomContainer=(0,_styled.default)(_Container.Container,{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"isActive"!==prop&&"hasShadow"!==prop,target:"e1jmcmnv0",label:"CustomContainer"})(({theme,isActive,hasShadow})=>({...hasShadow&&{borderBottom:"4px solid rgba(138, 97, 241, 0.20)"},backgroundColor:isActive?theme.values.color.splashCard.background.hover:theme.values.color.background.accentSubtle.default,transitionProperty:"background-color",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction,width:"100%",height:"100%"})),StyledButton=(0,_styled.default)("button",{target:"e1jmcmnv1",label:"StyledButton"})(({theme,disabled})=>({...(0,_mixins.getButtonAppearanceReset)(),...(0,_mixins.getBaseButtonStyles)({theme}),...(0,_mixins.getFocusStyles)(),...disabled&&{...(0,_mixins.getDisabledStyles)({theme}),cursor:"not-allowed"},position:"relative",width:"100%",height:"100%",display:"flex",flexDirection:"row",textAlign:"left",alignItems:"center",padding:0,[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{flexDirection:"column",alignItems:"start"}})),ImageWrapper=(0,_styled.default)("div",{target:"e1jmcmnv2",label:"ImageWrapper"})(({theme,borderRadius})=>({width:179,flexShrink:0,overflow:"hidden",borderBottomLeftRadius:theme.variables.size.borderRadius[borderRadius],[`@media (min-width: ${_breakpointsjson.default.m.value}px)`]:{width:"calc(100% - 40px)"}})),StyledImage=(0,_styled.default)(_Image.Image,{target:"e1jmcmnv3",label:"StyledImage"})({width:"100%",height:"100%",display:"block"}),FadingIconLayer=(0,_styled.default)("div",{target:"e1jmcmnv4",label:"FadingIconLayer"})(({theme,isVisible})=>({position:"absolute",top:theme.variables.size.spacing.l,right:theme.variables.size.spacing.l,opacity:+!!isVisible,transitionProperty:"opacity",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction})),LabelWrapper=(0,_styled.default)("div",{target:"e1jmcmnv5",label:"LabelWrapper"})(({theme,isActive})=>({opacity:isActive?.6:1,transitionProperty:"opacity",transitionDuration:theme.variables.animation.duration.medium,transitionTimingFunction:theme.variables.animation.timingFunction})),getTextColor=(color,theme)=>"accent"===color?{color:theme.values.color.splashCard.text.accent.default}:{},CustomH4=(0,_styled.default)(_Header.H4,{target:"e1jmcmnv6",label:"CustomH4"})(({color,theme})=>({...getTextColor(color,theme)})),CustomH6=(0,_styled.default)(_Header.H6,{target:"e1jmcmnv7",label:"CustomH6"})(({color,theme})=>({...getTextColor(color,theme)})),CustomH5=(0,_styled.default)(_Header.H5,{target:"e1jmcmnv8",label:"CustomH5"})(({color,theme})=>({...getTextColor(color,theme)}));function SplashCardMedia({isPressed,disabled,title,description,variant="standard",iconProps,imageProps,hasShadow,...rest}){let ref=(0,_react.useRef)(null),isHovered=(0,_useHover.useHover)(ref),isFocused=(0,_useFocusWithin.useFocusWithin)(ref),isActive=!disabled&&!!(isHovered||isFocused||isPressed),activeColor="onAccent",mainTextColor=isActive?activeColor:"accent",descriptionColor=isActive?activeColor:"secondary",labelColor=isActive?activeColor:"tertiary",{isMobile,isSmallMobile}=(0,_useBreakpoints.useBreakpoints)(),showIcons=!isMobile,DescriptionHeading=isMobile?CustomH5:CustomH4;return _react.default.createElement(CustomContainer,{hasShadow:hasShadow,isActive:isActive,elevation:0,overflow:"hidden",borderRadius:"m"},_react.default.createElement(StyledButton,{ref:ref,disabled:disabled,"aria-pressed":isPressed??void 0,...rest},!isSmallMobile&&_react.default.createElement(ImageWrapper,{borderRadius:"m"},_react.default.createElement(StyledImage,{...imageProps,fit:"contain"})),iconProps&&showIcons&&_react.default.createElement(FadingIconLayer,{isVisible:!isActive},_react.default.createElement(_Icon.Icon,{size:"m",...iconProps,color:mainTextColor})),showIcons&&_react.default.createElement(FadingIconLayer,{isVisible:isActive},_react.default.createElement(_Icon.Icon,{size:"m",name:"arrow-right",color:activeColor})),_react.default.createElement(_Box.StyledBox,{space:["m","l"],lSpace:isSmallMobile?"m":"l"},_react.default.createElement(_Stack.Stack,{space:"xxs"},"bold"===variant?_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(LabelWrapper,{isActive:isActive},_react.default.createElement(CustomH6,{as:"div",color:labelColor},title)),description&&_react.default.createElement(DescriptionHeading,{as:"div",color:mainTextColor},description)):_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(CustomH4,{as:"div",color:mainTextColor},title),description&&_react.default.createElement(_Text.Text,{size:isMobile?"s":"m",color:descriptionColor},description))))))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Stack",{enumerable:!0,get:function(){return Stack}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_flattenChildren=require("../../shared/flattenChildren"),_mediaQueries=require("../../shared/mediaQueries"),StackContainer=(0,_styled.default)("div",{target:"e1dhj6190",label:"StackContainer"})(({alignItems,vAlignItems,height,as,fullWidth})=>({...(0,_mediaQueries.useResponsiveStyles)({justifyContent:[vAlignItems,{top:"flex-start",bottom:"flex-end",center:"center",spaceBetween:"space-between"}],alignItems:[alignItems,{left:"flex-start",right:"flex-end",center:"center",stretch:"stretch"}]}),display:"flex",flexDirection:"column",height,..."div"!==as&&{padding:0,margin:0,listStyle:"none"},...fullWidth&&{width:"100%"}})),StackItem=(0,_styled.default)("div",{target:"e1dhj6191",label:"StackItem"})(({theme,space,as})=>({..."div"!==as&&{padding:0,margin:0,"> *":{listStyle:"initial"}},...(0,_mediaQueries.useResponsiveStyles)({marginTop:[space,theme.variables.size.spacing]}),"&:first-of-type":{marginTop:0},"&:empty":{marginTop:0}}));function Stack({id,children,space="xs",alignItems,vAlignItems,height,as="div",fullWidth,role,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId="Stack",...ariaAttributes}){let isList="div"!==as,stackItemAs=isList?"li":"div";return _react.default.createElement(StackContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId,alignItems:alignItems,vAlignItems:vAlignItems,height:height,id:id,as:as,fullWidth:fullWidth,role:role??(isList?"list":void 0),...ariaAttributes},_react.default.Children.map((0,_flattenChildren.flattenChildren)(children),child=>child&&_react.default.createElement(StackItem,{as:stackItemAs,space:space},child)))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Stack",{enumerable:!0,get:function(){return Stack}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_flattenChildren=require("../../shared/flattenChildren"),_mediaQueries=require("../../shared/mediaQueries"),StackContainer=(0,_styled.default)("div",{target:"exraq9d0",label:"StackContainer"})(({alignItems,vAlignItems,height,as,fullWidth})=>({...(0,_mediaQueries.useResponsiveStyles)({justifyContent:[vAlignItems,{top:"flex-start",bottom:"flex-end",center:"center",spaceBetween:"space-between"}],alignItems:[alignItems,{left:"flex-start",right:"flex-end",center:"center",stretch:"stretch"}]}),display:"flex",flexDirection:"column",height,..."div"!==as&&{padding:0,margin:0,listStyle:"none"},...fullWidth&&{width:"100%"}})),StackItem=(0,_styled.default)("div",{target:"exraq9d1",label:"StackItem"})(({theme,space,as})=>({..."div"!==as&&{padding:0,margin:0,"> *":{listStyle:"initial"}},...(0,_mediaQueries.useResponsiveStyles)({marginTop:[space,theme.variables.size.spacing]}),"&:first-of-type":{marginTop:0},"&:empty":{marginTop:0}}));function Stack({id,children,space="xs",alignItems,vAlignItems,height,as="div",fullWidth,role,"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId="Stack",...ariaAttributes}){let isList="div"!==as,stackItemAs=isList?"li":"div";return _react.default.createElement(StackContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDsId,alignItems:alignItems,vAlignItems:vAlignItems,height:height,id:id,as:as,fullWidth:fullWidth,role:role??(isList?"list":void 0),...ariaAttributes},_react.default.Children.map((0,_flattenChildren.flattenChildren)(children),child=>child&&_react.default.createElement(StackItem,{as:stackItemAs,space:space},child)))}
@@ -1 +1 @@
1
- export declare const SubThemeContext: React.Context<import("./SubThemeProvider").SubThemeName>;
1
+ export declare const SubThemeContext: React.Context<import("./SubThemeProvider").SubThemeName | null | undefined>;
@@ -2,7 +2,8 @@ import React from "react";
2
2
  import type { SubThemeTypes } from "../../web-tokens/_subThemeType";
3
3
  export type SubThemeName = SubThemeTypes | "unset";
4
4
  type BaseProps = {
5
- name: SubThemeName;
5
+ /** Sub-theme to apply. Omitted (or `undefined`) leaves the parent theme untouched. */
6
+ name?: SubThemeName;
6
7
  as?: "div";
7
8
  "data-e2e-test-id"?: string;
8
9
  children: React.ReactNode[] | React.ReactNode;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SubThemeProvider",{enumerable:!0,get:function(){return SubThemeProvider}});const _react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_react1=require("@emotion/react"),_SubThemeContext=require("./SubThemeContext");function isObject(item){return item&&"object"==typeof item&&!Array.isArray(item)}const baseThemeByName=new Map,setBaseTheme=theme=>{theme.name&&!baseThemeByName.has(theme.name)&&baseThemeByName.set(theme.name,theme)},getBaseTheme=theme=>baseThemeByName.get(theme.name)??theme,subThemeCreator=(parentTheme,name)=>(setBaseTheme(parentTheme),function mergeDeep(target,...sources){if(!sources.length)return target;let source=sources.shift();if(isObject(target)&&isObject(source))for(let key in source)isObject(source[key])?(target[key]||Object.assign(target,{[key]:{}}),mergeDeep(target[key],source[key])):Object.assign(target,{[key]:source[key]});return mergeDeep(target,...sources)}({},parentTheme,{values:{...parentTheme.values.subThemes[name]}}));function SubThemeProvider({name,children,as,"data-e2e-test-id":dataE2eTestId}){let memoizedTheme=(0,_react.useMemo)(()=>parentTheme=>"unset"===name?getBaseTheme(parentTheme):subThemeCreator(parentTheme,name),[name]);return _react.default.createElement(_react1.ThemeProvider,{theme:memoizedTheme},_react.default.createElement(_SubThemeContext.SubThemeContext.Provider,{value:name},"div"===as?_react.default.createElement("div",{"data-subtheme":name,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"SubThemeProvider"},children):children))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"SubThemeProvider",{enumerable:!0,get:function(){return SubThemeProvider}});const _react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_react1=require("@emotion/react"),_SubThemeContext=require("./SubThemeContext");function isObject(item){return!!item&&"object"==typeof item&&!Array.isArray(item)}const baseThemeByName=new Map,setBaseTheme=theme=>{theme.name&&!baseThemeByName.has(theme.name)&&baseThemeByName.set(theme.name,theme)},getBaseTheme=theme=>baseThemeByName.get(theme.name)??theme,subThemeCreator=(parentTheme,name)=>(setBaseTheme(parentTheme),function mergeDeep(target,...sources){if(!sources.length)return target;let source=sources.shift();if(isObject(target)&&isObject(source)){for(let key in source)if(Object.prototype.hasOwnProperty.call(source,key)){let sourceValue=source[key];if(isObject(sourceValue)){let nestedTarget=target[key]||{};Object.assign(target,{[key]:nestedTarget}),mergeDeep(nestedTarget,sourceValue)}else Object.assign(target,{[key]:sourceValue})}}return mergeDeep(target,...sources)}({},parentTheme,{values:{...parentTheme.values.subThemes[name]}}));function SubThemeProvider({name,children,as,"data-e2e-test-id":dataE2eTestId}){let memoizedTheme=(0,_react.useMemo)(()=>parentTheme=>"unset"===name?getBaseTheme(parentTheme):subThemeCreator(parentTheme,name),[name]);return _react.default.createElement(_react1.ThemeProvider,{theme:memoizedTheme},_react.default.createElement(_SubThemeContext.SubThemeContext.Provider,{value:name},"div"===as?_react.default.createElement("div",{"data-subtheme":name,"data-e2e-test-id":dataE2eTestId,"data-ds-id":"SubThemeProvider"},children):children))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Tabs",{enumerable:!0,get:function(){return Tabs}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_react=/*#__PURE__*/_interop_require_wildcard._(require("react")),_mediaQueries=require("../../shared/mediaQueries"),_useKeyboard=require("../../shared/useKeyboard"),_Icon=require("../Icon/Icon"),_Stack=require("../Stack/Stack"),_Tooltip=require("../Tooltip/Tooltip"),_useTabFocus=require("./useTabFocus"),_getButtonAppearanceReset=require("../../shared/mixins/Button/getButtonAppearanceReset"),StyledContainer=(0,_styled.default)("div",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop),target:"e2kj0g00",label:"StyledContainer"})(({theme,horizontalPadding,hideBottomBorder})=>({display:"flex",flexDirection:"row",...(0,_mediaQueries.useResponsiveStyles)({gap:[["m","l","l"],theme.variables.size.spacing],paddingInline:[horizontalPadding,theme.variables.size.spacing]}),...!hideBottomBorder&&{borderBottom:`1px solid ${theme.values.color.border.secondary.default}`},whiteSpace:"nowrap",overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none","::-webkit-scrollbar":{display:"none"}})),StyledTab=(0,_styled.default)("button",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"active"!==prop&&"disabled"!==prop,target:"e2kj0g01",label:"StyledTab"})(({theme,active,disabled,hideBottomBorder,activeTabClickable})=>({...(0,_getButtonAppearanceReset.getButtonAppearanceReset)(),padding:0,display:"flex",gap:theme.variables.size.spacing.xxs,alignItems:"center",boxSizing:"border-box",color:theme.values.color.text.secondary.default,fontFamily:theme.variables.fontFamily.lato,fontWeight:theme.variables.weight.bold,fontSize:theme.variables.size.font.s,lineHeight:theme.variables.size.lineHeight.xs,borderBottom:"4px solid transparent",paddingTop:hideBottomBorder?theme.variables.size.spacing.m:`calc(${theme.variables.size.spacing.m} - 1px)`,paddingBottom:`calc(${theme.variables.size.spacing.m} - 4px)`,...active&&!disabled&&{color:theme.values.color.text.accent.default,borderBottomColor:theme.values.color.border.accent.default},...!active&&!disabled&&{cursor:"pointer","&:hover":{color:theme.values.color.text.primary.default,borderBottomColor:theme.values.color.border.secondary.default},"&:active":{color:theme.values.color.text.primary.default,borderBottomColor:theme.values.color.border.secondary.active}},...activeTabClickable&&{cursor:"pointer"},...disabled&&{opacity:theme.variables.opacity.disabled,cursor:"not-allowed"},"&:focus-visible":{outlineWidth:2,outlineOffset:-1}})),addSubtitle=text=>text?`(${text})`:"";function Tabs({tabs,horizontalPadding,activeTab=0,children,onTabSelect,activeTabClickable,tabPanelId:tabPanelIdProp,"data-e2e-test-id":dataE2eTestId,hideBottomBorder,...ariaAttributes}){let tablistRef=(0,_react.useRef)(null),instanceId=(0,_react.useId)(),tabPanelId=tabPanelIdProp||`${instanceId}-panel`,{onBlur,onTabFocus,getTabIndex,focusNextTab}=(0,_useTabFocus.useTabFocus)({tabs,activeTab,tablistRef,tabAttribute:"data-tab-index"});(0,_useKeyboard.useKeyboard)({ArrowRight:()=>focusNextTab(1),ArrowLeft:()=>focusNextTab(-1)},tablistRef,!0);let getTabId=index=>`${instanceId}-tab-${index}`;return _react.default.createElement(_Stack.Stack,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Tabs"},_react.default.createElement(StyledContainer,{...ariaAttributes,hideBottomBorder:hideBottomBorder,horizontalPadding:horizontalPadding,onBlur:onBlur,ref:tablistRef,"aria-orientation":"horizontal",role:"tablist"},tabs.map(({label,sublabel,icon,as="button",disabled,tooltipContent,...rest},i)=>{let iconConfig;icon&&(iconConfig="string"==typeof icon?{name:icon,position:"left"}:icon);let Tab=_react.default.createElement(StyledTab,{id:getTabId(i),activeTabClickable:activeTabClickable,hideBottomBorder:hideBottomBorder,disabled:disabled,as:as,key:label,active:activeTab===i,...rest,onFocus:e=>{onTabFocus(i),rest.onFocus?.(e)},onClick:e=>{disabled||(onTabSelect?.(i),rest.onClick?.(e))},tabIndex:getTabIndex(i),"data-tab-index":i,type:"button"!==as?void 0:"button",role:"tab","aria-selected":activeTab===i,"aria-disabled":disabled||void 0,"aria-controls":children?tabPanelId:void 0},iconConfig&&"left"===iconConfig.position&&_react.default.createElement(_Icon.Icon,{size:"s",name:iconConfig.name}),label," ",addSubtitle(sublabel),iconConfig&&"right"===iconConfig.position&&_react.default.createElement(_Icon.Icon,{size:"s",name:iconConfig.name}));return disabled&&tooltipContent?_react.default.createElement(_Tooltip.Tooltip,{key:label,content:tooltipContent},Tab):Tab})),children&&null!=activeTab&&_react.default.createElement("div",{role:"tabpanel",id:tabPanelId,"aria-labelledby":getTabId(activeTab)},children))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Tabs",{enumerable:!0,get:function(){return Tabs}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),_react=/*#__PURE__*/_interop_require_wildcard._(require("react")),_mediaQueries=require("../../shared/mediaQueries"),_useKeyboard=require("../../shared/useKeyboard"),_Icon=require("../Icon/Icon"),_Stack=require("../Stack/Stack"),_Tooltip=require("../Tooltip/Tooltip"),_useTabFocus=require("./useTabFocus"),_getButtonAppearanceReset=require("../../shared/mixins/Button/getButtonAppearanceReset"),StyledContainer=(0,_styled.default)("div",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop),target:"e1ab8gc80",label:"StyledContainer"})(({theme,horizontalPadding,hideBottomBorder})=>({display:"flex",flexDirection:"row",...(0,_mediaQueries.useResponsiveStyles)({gap:[["m","l","l"],theme.variables.size.spacing],paddingInline:[horizontalPadding,theme.variables.size.spacing]}),...!hideBottomBorder&&{borderBottom:`1px solid ${theme.values.color.border.secondary.default}`},whiteSpace:"nowrap",overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none","::-webkit-scrollbar":{display:"none"}})),StyledTab=(0,_styled.default)("button",{shouldForwardProp:prop=>(0,_ispropvalid.default)(prop)&&"active"!==prop&&"disabled"!==prop,target:"e1ab8gc81",label:"StyledTab"})(({theme,active,disabled,hideBottomBorder,activeTabClickable})=>({...(0,_getButtonAppearanceReset.getButtonAppearanceReset)(),padding:0,display:"flex",gap:theme.variables.size.spacing.xxs,alignItems:"center",boxSizing:"border-box",color:theme.values.color.text.secondary.default,fontFamily:theme.variables.fontFamily.lato,fontWeight:theme.variables.weight.bold,fontSize:theme.variables.size.font.s,lineHeight:theme.variables.size.lineHeight.xs,borderBottom:"4px solid transparent",paddingTop:hideBottomBorder?theme.variables.size.spacing.m:`calc(${theme.variables.size.spacing.m} - 1px)`,paddingBottom:`calc(${theme.variables.size.spacing.m} - 4px)`,...active&&!disabled&&{color:theme.values.color.text.accent.default,borderBottomColor:theme.values.color.border.accent.default},...!active&&!disabled&&{cursor:"pointer","&:hover":{color:theme.values.color.text.primary.default,borderBottomColor:theme.values.color.border.secondary.default},"&:active":{color:theme.values.color.text.primary.default,borderBottomColor:theme.values.color.border.secondary.active}},...activeTabClickable&&{cursor:"pointer"},...disabled&&{opacity:theme.variables.opacity.disabled,cursor:"not-allowed"},"&:focus-visible":{outlineWidth:2,outlineOffset:-1}})),addSubtitle=text=>text?`(${text})`:"";function Tabs({tabs,horizontalPadding,activeTab=0,children,onTabSelect,activeTabClickable,tabPanelId:tabPanelIdProp,"data-e2e-test-id":dataE2eTestId,hideBottomBorder,...ariaAttributes}){let tablistRef=(0,_react.useRef)(null),instanceId=(0,_react.useId)(),tabPanelId=tabPanelIdProp||`${instanceId}-panel`,{onBlur,onTabFocus,getTabIndex,focusNextTab}=(0,_useTabFocus.useTabFocus)({tabs,activeTab,tablistRef,tabAttribute:"data-tab-index"});(0,_useKeyboard.useKeyboard)({ArrowRight:()=>focusNextTab(1),ArrowLeft:()=>focusNextTab(-1)},tablistRef,!0);let getTabId=index=>`${instanceId}-tab-${index}`;return _react.default.createElement(_Stack.Stack,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Tabs"},_react.default.createElement(StyledContainer,{...ariaAttributes,hideBottomBorder:hideBottomBorder,horizontalPadding:horizontalPadding,onBlur:onBlur,ref:tablistRef,"aria-orientation":"horizontal",role:"tablist"},tabs.map(({label,sublabel,icon,as="button",disabled,tooltipContent,...rest},i)=>{let iconConfig;icon&&(iconConfig="string"==typeof icon?{name:icon,position:"left"}:icon);let Tab=_react.default.createElement(StyledTab,{id:getTabId(i),activeTabClickable:activeTabClickable,hideBottomBorder:hideBottomBorder,disabled:disabled,as:as,key:label,active:activeTab===i,...rest,onFocus:e=>{onTabFocus(i),rest.onFocus?.(e)},onClick:e=>{disabled||(onTabSelect?.(i),rest.onClick?.(e))},tabIndex:getTabIndex(i),"data-tab-index":i,type:"button"!==as?void 0:"button",role:"tab","aria-selected":activeTab===i,"aria-disabled":disabled||void 0,"aria-controls":children?tabPanelId:void 0},iconConfig&&"left"===iconConfig.position&&_react.default.createElement(_Icon.Icon,{size:"s",name:iconConfig.name}),label," ",addSubtitle(sublabel),iconConfig&&"right"===iconConfig.position&&_react.default.createElement(_Icon.Icon,{size:"s",name:iconConfig.name}));return disabled&&tooltipContent?_react.default.createElement(_Tooltip.Tooltip,{key:label,content:tooltipContent},Tab):Tab})),children&&null!=activeTab&&_react.default.createElement("div",{role:"tabpanel",id:tabPanelId,"aria-labelledby":getTabId(activeTab)},children))}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"TagGroup",{enumerable:!0,get:function(){return TagGroup}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_Tag=require("../Tag/Tag"),_BaseTag=require("../Internal/BaseTag/BaseTag"),shrink=currentWidth=>(0,_react1.keyframes)({from:{width:`${currentWidth}px`},to:{width:"0px"}},"label:shrink"),StyledContainer=(0,_styled.default)("div",{target:"e7a71ut0",label:"StyledContainer"})(({theme})=>({display:"flex",flexWrap:"wrap",gap:theme.variables.size.spacing.xs})),StyledTagContainer=(0,_styled.default)("div",{target:"e7a71ut1",label:"StyledTagContainer"})(({theme,toBeRemoved,tagWidth})=>({overflow:"hidden",...toBeRemoved&&{opacity:theme.variables.opacity.hidden,marginLeft:`-${theme.variables.size.spacing.xs}`,animation:`0.2s ease-out 0s normal forwards ${shrink(tagWidth)}`}}));function TagGroup({colorVariant="gray",isTagRemovable=!1,tags,onRemoveTag,"data-e2e-test-id":dataE2eTestId}){let[tagToBeRemoved,setTagToBeRemoved]=(0,_react.useState)(null),containerRef=(0,_react.useRef)(null),handleTagRemove=(tag,index)=>{let width=_BaseTag.MAX_TAG_WIDTH;containerRef.current&&(width=containerRef.current.children[index].clientWidth),setTagToBeRemoved({tag,tagWidth:width})},handleAnimationEnd=()=>{onRemoveTag&&tagToBeRemoved&&onRemoveTag(tagToBeRemoved.tag)},tagElms=tags.map((tag,index)=>{let{label,clearBtnAriaLabel}=tag;if(isTagRemovable){let isToBeRemovedTag=tagToBeRemoved&&tagToBeRemoved.tag.label===label;return _react.default.createElement(StyledTagContainer,{key:label,toBeRemoved:isToBeRemovedTag,onAnimationEnd:handleAnimationEnd,tagWidth:isToBeRemovedTag&&tagToBeRemoved?.tagWidth},_react.default.createElement(_Tag.Tag,{label:label,colorVariant:colorVariant,clearBtnAriaLabel:clearBtnAriaLabel,onClear:()=>handleTagRemove(tag,index),isRemovable:!0}))}return _react.default.createElement(_Tag.Tag,{key:label,label:label,colorVariant:colorVariant})});return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"TagGroup",ref:containerRef},tagElms)}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"TagGroup",{enumerable:!0,get:function(){return TagGroup}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_Tag=require("../Tag/Tag"),_BaseTag=require("../Internal/BaseTag/BaseTag"),shrink=currentWidth=>(0,_react1.keyframes)({from:{width:`${currentWidth}px`},to:{width:"0px"}},"label:shrink"),StyledContainer=(0,_styled.default)("div",{target:"e1q0hgtq0",label:"StyledContainer"})(({theme})=>({display:"flex",flexWrap:"wrap",gap:theme.variables.size.spacing.xs})),StyledTagContainer=(0,_styled.default)("div",{target:"e1q0hgtq1",label:"StyledTagContainer"})(({theme,toBeRemoved,tagWidth})=>({overflow:"hidden",...toBeRemoved&&{opacity:theme.variables.opacity.hidden,marginLeft:`-${theme.variables.size.spacing.xs}`,animation:`0.2s ease-out 0s normal forwards ${shrink(tagWidth)}`}}));function TagGroup({colorVariant="gray",isTagRemovable=!1,tags,onRemoveTag,"data-e2e-test-id":dataE2eTestId}){let[tagToBeRemoved,setTagToBeRemoved]=(0,_react.useState)(null),containerRef=(0,_react.useRef)(null),handleTagRemove=(tag,index)=>{let width=_BaseTag.MAX_TAG_WIDTH;containerRef.current&&(width=containerRef.current.children[index].clientWidth),setTagToBeRemoved({tag,tagWidth:width})},handleAnimationEnd=()=>{onRemoveTag&&tagToBeRemoved&&onRemoveTag(tagToBeRemoved.tag)},tagElms=tags.map((tag,index)=>{let{label,clearBtnAriaLabel}=tag;if(isTagRemovable){let isToBeRemovedTag=tagToBeRemoved?.tag.label===label;return _react.default.createElement(StyledTagContainer,{key:label,toBeRemoved:isToBeRemovedTag,onAnimationEnd:handleAnimationEnd,tagWidth:tagToBeRemoved?.tagWidth??_BaseTag.MAX_TAG_WIDTH},_react.default.createElement(_Tag.Tag,{label:label,colorVariant:colorVariant,clearBtnAriaLabel:clearBtnAriaLabel,onClear:()=>handleTagRemove(tag,index),isRemovable:!0}))}return _react.default.createElement(_Tag.Tag,{key:label,label:label,colorVariant:colorVariant})});return _react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"TagGroup",ref:containerRef},tagElms)}
@@ -11,10 +11,11 @@ export type ToastProps<C extends React.ElementType = "button"> = {
11
11
  isVisible: boolean;
12
12
  message: string | ReactElement;
13
13
  autoDismissDuration?: "none" | "s" | "m" | "l";
14
+ /** Accessible name for the close button. */
14
15
  closeButtonAriaLabel?: string;
15
16
  actionButton?: PolymorphicComponentPropsWithRef<C, ButtonProps>;
16
17
  onDismiss: (reason: DismissReason) => void;
17
18
  "data-e2e-test-id"?: string;
18
19
  } & Pick<PortalProps, "portalContainer"> & AriaAttributes;
19
- export declare function Toast<C extends React.ElementType = "button">({ type, iconName, isVisible, message, portalContainer, actionButton, autoDismissDuration, closeButtonAriaLabel, onDismiss, "data-e2e-test-id": dataE2eTestId, ...ariaAttributes }: ToastProps<C>): React.ReactElement;
20
+ export declare function Toast<C extends React.ElementType = "button">({ type, iconName, isVisible, message, portalContainer, actionButton, autoDismissDuration, closeButtonAriaLabel, onDismiss, "data-e2e-test-id": dataE2eTestId, ...ariaAttributes }: ToastProps<C>): React.ReactElement | null;
20
21
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Toast",{enumerable:!0,get:function(){return Toast}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_react1=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Text=require("../Typography/Text/Text"),_Box=require("../Box/Box"),_PictogramButton=require("../PictogramButton/PictogramButton"),_SubThemeProvider=require("../SubThemeProvider/SubThemeProvider"),_Portal=require("../Portal/Portal"),_Container=require("../Container/Container"),_Button=require("../Button/Button"),_Inline=require("../Inline/Inline"),_ToastProvider=require("./ToastProvider"),_Icon=require("../Icon/Icon"),_mediaQueries=require("../../shared/mediaQueries"),StyledContainer=(0,_styled.default)("aside",{target:"eht99970",label:"StyledContainer"})(({theme,isShowing,isHiding})=>{let entryAnimation=(0,_react1.keyframes)({from:{transform:`translate(-50%, ${theme.variables.animation.toast.entry.distanceY})`,opacity:theme.variables.opacity.hidden},to:{transform:"translate(-50%, 0px)",opacity:theme.variables.opacity.visible}}),exitAnimation=(0,_react1.keyframes)({from:{transform:"translate(-50%, 0px)",opacity:theme.variables.opacity.visible},to:{transform:`translate(-50%, ${theme.variables.animation.toast.exit.distanceY})`,opacity:theme.variables.opacity.hidden}}),animation="none";return isShowing?animation=`${theme.variables.animation.toast.entry.duration} ease forwards ${entryAnimation}`:isHiding&&(animation=`${theme.variables.animation.toast.exit.duration} ease forwards ${exitAnimation}`),{position:"fixed",opacity:"none"===animation?theme.variables.opacity.visible:theme.variables.opacity.hidden,left:"50%",transform:"translateX(-50%)",animation,zIndex:(0,_Portal.usePortalChildZIndex)(theme.variables.zIndex.tooltip),...(0,_mediaQueries.useResponsiveValue)({maxWidth:[void 0,520],minWidth:[void 0,280],width:[`calc(100% - (2 * ${theme.variables.size.spacing.m}))`,"auto"],bottom:[theme.variables.size.spacing.m,theme.variables.size.spacing.l]})}}),StyledIconContainer=(0,_styled.default)("div",{target:"eht99971",label:"StyledIconContainer"})(()=>(0,_mediaQueries.useResponsiveValue)({display:["none","block"]})),DEFAULT_ICONS_BY_TYPE={info:"info",success:"check",error:"alert-triangle",neutral:"info"},TYPE_TO_SUB_THEME_NAMES={info:"info",success:"success",error:"error",neutral:"dimmed"},AUTO_DISMISS_DURATION={none:0,s:5e3,m:1e4,l:15e3};function Toast({type="info",iconName=DEFAULT_ICONS_BY_TYPE[type],isVisible,message,portalContainer,actionButton,autoDismissDuration=actionButton?"m":"s",closeButtonAriaLabel,onDismiss,"data-e2e-test-id":dataE2eTestId,...ariaAttributes}){let[isShowing,setIsShowing]=(0,_react.useState)(!1),[isHiding,setIsHiding]=(0,_react.useState)(!1),[isToastVisible,setIsToastVisible]=(0,_react.useState)(!1),toastContext=(0,_react.useContext)(_ToastProvider.ToastContext),timeoutId=(0,_react.useRef)(null),id=(0,_react.useId)(),autoDismissDurationMs=AUTO_DISMISS_DURATION[autoDismissDuration],showToast=(0,_react.useCallback)(()=>{!isToastVisible&&(setIsShowing(!0),autoDismissDurationMs&&(timeoutId.current=setTimeout(()=>onDismiss("timeout"),autoDismissDurationMs)))},[isToastVisible,autoDismissDurationMs,onDismiss]),hideToast=(0,_react.useCallback)(()=>{isToastVisible&&setIsHiding(!0)},[isToastVisible]);if((0,_react.useEffect)(()=>()=>{clearTimeout(timeoutId.current)},[]),(0,_react.useEffect)(()=>{isVisible?showToast():(clearTimeout(timeoutId.current),hideToast())},[isVisible,showToast,hideToast]),(0,_react.useEffect)(()=>{isToastVisible&&toastContext&&toastContext.lastToastId&&toastContext.lastToastId!==id&&onDismiss("replaced")},[isToastVisible,toastContext,id,onDismiss]),!(isToastVisible||isShowing||isHiding))return null;let actionButtonElm=actionButton?_react.default.createElement(_Button.Button,{...actionButton,variant:"secondary",size:"s","aria-hidden":"true"}):null;return _react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},_react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Toast",...ariaAttributes,role:"alert",isShowing:isShowing,isHiding:isHiding,onAnimationEnd:()=>{isShowing&&(setIsShowing(!1),setIsToastVisible(!0),toastContext&&toastContext.setLastToastId(id)),isHiding&&(setIsHiding(!1),setIsToastVisible(!1))},onKeyDown:evt=>{"Escape"===evt.key&&onDismiss("close")}},_react.default.createElement(_SubThemeProvider.SubThemeProvider,{name:TYPE_TO_SUB_THEME_NAMES[type]},_react.default.createElement(_Container.Container,{elevation:3,borderRadius:"s"},_react.default.createElement(_Box.Box,{space:"m",vSpace:"s",rSpace:"s"},_react.default.createElement(_Inline.Inline,{space:"m",alignItems:"spaceBetween",vAlignItems:"top",noWrap:!0},_react.default.createElement(_Box.Box,{space:"zero",vSpace:"xxs"},_react.default.createElement(_Inline.Inline,{space:"s",vAlignItems:"top",noWrap:!0},iconName&&_react.default.createElement(StyledIconContainer,null,_react.default.createElement(_Text.Text,{as:"span"},_react.default.createElement(_Icon.Icon,{name:iconName,"data-e2e-test-id":iconName}))),_react.default.createElement(_Text.Text,null,message))),_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},actionButtonElm,_react.default.createElement(_PictogramButton.PictogramButton,{"data-e2e-test-id":"close-button","aria-label":closeButtonAriaLabel,variant:"quaternary",icon:"x",size:"s",onClick:()=>onDismiss("close")}))))))))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Toast",{enumerable:!0,get:function(){return Toast}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_react1=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Text=require("../Typography/Text/Text"),_Box=require("../Box/Box"),_PictogramButton=require("../PictogramButton/PictogramButton"),_SubThemeProvider=require("../SubThemeProvider/SubThemeProvider"),_Portal=require("../Portal/Portal"),_Container=require("../Container/Container"),_Button=require("../Button/Button"),_Inline=require("../Inline/Inline"),_ToastProvider=require("./ToastProvider"),_Icon=require("../Icon/Icon"),_mediaQueries=require("../../shared/mediaQueries"),StyledContainer=(0,_styled.default)("aside",{target:"e2cd6ok0",label:"StyledContainer"})(({theme,isShowing,isHiding})=>{let entryAnimation=(0,_react1.keyframes)({from:{transform:`translate(-50%, ${theme.variables.animation.toast.entry.distanceY})`,opacity:theme.variables.opacity.hidden},to:{transform:"translate(-50%, 0px)",opacity:theme.variables.opacity.visible}}),exitAnimation=(0,_react1.keyframes)({from:{transform:"translate(-50%, 0px)",opacity:theme.variables.opacity.visible},to:{transform:`translate(-50%, ${theme.variables.animation.toast.exit.distanceY})`,opacity:theme.variables.opacity.hidden}}),animation="none";return isShowing?animation=`${theme.variables.animation.toast.entry.duration} ease forwards ${entryAnimation}`:isHiding&&(animation=`${theme.variables.animation.toast.exit.duration} ease forwards ${exitAnimation}`),{position:"fixed",opacity:"none"===animation?theme.variables.opacity.visible:theme.variables.opacity.hidden,left:"50%",transform:"translateX(-50%)",animation,zIndex:(0,_Portal.usePortalChildZIndex)(theme.variables.zIndex.tooltip),...(0,_mediaQueries.useResponsiveValue)({maxWidth:["none",520],minWidth:[0,280],width:[`calc(100% - (2 * ${theme.variables.size.spacing.m}))`,"auto"],bottom:[theme.variables.size.spacing.m,theme.variables.size.spacing.l]})}}),StyledIconContainer=(0,_styled.default)("div",{target:"e2cd6ok1",label:"StyledIconContainer"})(()=>(0,_mediaQueries.useResponsiveValue)({display:["none","block"]})),DEFAULT_ICONS_BY_TYPE={info:"info",success:"check",error:"alert-triangle",neutral:"info"},TYPE_TO_SUB_THEME_NAMES={info:"info",success:"success",error:"error",neutral:"dimmed"},AUTO_DISMISS_DURATION={none:0,s:5e3,m:1e4,l:15e3};function Toast({type="info",iconName=DEFAULT_ICONS_BY_TYPE[type],isVisible,message,portalContainer,actionButton,autoDismissDuration=actionButton?"m":"s",closeButtonAriaLabel="Dismiss notification",onDismiss,"data-e2e-test-id":dataE2eTestId,...ariaAttributes}){let[isShowing,setIsShowing]=(0,_react.useState)(!1),[isHiding,setIsHiding]=(0,_react.useState)(!1),[isToastVisible,setIsToastVisible]=(0,_react.useState)(!1),toastContext=(0,_react.useContext)(_ToastProvider.ToastContext),timeoutId=(0,_react.useRef)(null),id=(0,_react.useId)(),autoDismissDurationMs=AUTO_DISMISS_DURATION[autoDismissDuration],showToast=(0,_react.useCallback)(()=>{!isToastVisible&&(setIsShowing(!0),autoDismissDurationMs&&(timeoutId.current=setTimeout(()=>onDismiss("timeout"),autoDismissDurationMs)))},[isToastVisible,autoDismissDurationMs,onDismiss]),hideToast=(0,_react.useCallback)(()=>{isToastVisible&&setIsHiding(!0)},[isToastVisible]);if((0,_react.useEffect)(()=>()=>{clearTimeout(timeoutId.current??void 0)},[]),(0,_react.useEffect)(()=>{isVisible?showToast():(clearTimeout(timeoutId.current??void 0),hideToast())},[isVisible,showToast,hideToast]),(0,_react.useEffect)(()=>{isToastVisible&&toastContext&&toastContext.lastToastId&&toastContext.lastToastId!==id&&onDismiss("replaced")},[isToastVisible,toastContext,id,onDismiss]),!(isToastVisible||isShowing||isHiding))return null;let actionButtonElm=actionButton?_react.default.createElement(_Button.Button,{...actionButton,variant:"secondary",size:"s","aria-hidden":"true"}):null;return _react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},_react.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"Toast",...ariaAttributes,role:"alert",isShowing:isShowing,isHiding:isHiding,onAnimationEnd:()=>{isShowing&&(setIsShowing(!1),setIsToastVisible(!0),toastContext&&toastContext.setLastToastId(id)),isHiding&&(setIsHiding(!1),setIsToastVisible(!1))},onKeyDown:evt=>{"Escape"===evt.key&&onDismiss("close")}},_react.default.createElement(_SubThemeProvider.SubThemeProvider,{name:TYPE_TO_SUB_THEME_NAMES[type]},_react.default.createElement(_Container.Container,{elevation:3,borderRadius:"s"},_react.default.createElement(_Box.Box,{space:"m",vSpace:"s",rSpace:"s"},_react.default.createElement(_Inline.Inline,{space:"m",alignItems:"spaceBetween",vAlignItems:"top",noWrap:!0},_react.default.createElement(_Box.Box,{space:"zero",vSpace:"xxs"},_react.default.createElement(_Inline.Inline,{space:"s",vAlignItems:"top",noWrap:!0},iconName&&_react.default.createElement(StyledIconContainer,null,_react.default.createElement(_Text.Text,{as:"span"},_react.default.createElement(_Icon.Icon,{name:iconName,"data-e2e-test-id":iconName}))),_react.default.createElement(_Text.Text,null,message))),_react.default.createElement(_Inline.Inline,{space:"xs",vAlignItems:"center",noWrap:!0},actionButtonElm,_react.default.createElement(_PictogramButton.PictogramButton,{"data-e2e-test-id":"close-button","aria-label":closeButtonAriaLabel,variant:"quaternary",icon:"x",size:"s",onClick:()=>onDismiss("close")}))))))))}
@@ -1,7 +1,9 @@
1
1
  import type { PropsWithChildren, ReactElement } from "react";
2
2
  import React from "react";
3
- export declare const ToastContext: React.Context<{
4
- lastToastId: string;
3
+ type ToastContextValue = {
4
+ lastToastId: string | null;
5
5
  setLastToastId: React.Dispatch<string>;
6
- }>;
6
+ } | null;
7
+ export declare const ToastContext: React.Context<ToastContextValue>;
7
8
  export declare function ToastProvider({ children }: PropsWithChildren): ReactElement;
9
+ export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"BasePopover",{enumerable:!0,get:function(){return BasePopover}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react=/*#__PURE__*/_interop_require_wildcard._(require("react")),_ariaAttributes=require("../../shared/ariaAttributes"),_FocusTrapWrapper=require("../../shared/FocusTrapWrapper"),_useBreakpoints=require("../../shared/useBreakpoints"),_PopoverContext=require("../Patterns/Popover/PopoverContext"),_Sheet=require("../Sheet/Sheet"),_TooltipContent=require("../Tooltip/TooltipContent"),StyledContainer=(0,_styled.default)("div",{target:"e39b55t0",label:"StyledContainer"})(()=>({borderRadius:"inherit"})),FocusTrapContent=_react.default.forwardRef(({children},ref)=>_react.default.createElement(StyledContainer,{ref:ref},children)),VisibilityChangeReason={triggerClick:"triggerClick",outsideClick:"outsideClick"};function getAriaPopupType(role){let popupType=String(role);return(role||(popupType="true"),"alertdialog"===role)?"dialog":popupType}function BasePopover({placement="auto",content,children,contentPadding="m",maxWidth,externalTriggerRef,portalContainer,name="Popover",isVisible:isPopoverVisible,dismissOnOutsideClick=!0,retainOnOutsideClick,"data-e2e-test-id":dataE2eTestId,subTheme,defaultVerticalPlacement,onVisibilityChange,disableInitialFocus=!1,disableReturnFocusToTrigger=!1,renderAsSheetOnMobile=!1,forceSheetLayout=!1,role,sheetProps,...restContentProps}){let tooltipId=(0,_react.useMemo)(()=>`DS${name}_${Math.floor(Date.now()*Math.random())}`,[name]),[isVisible,setVisible]=(0,_react.useState)(isPopoverVisible),{isMobileInPortrait,isMobileInLandscape}=(0,_useBreakpoints.useBreakpoints)(),internalTriggerRef=(0,_react.useRef)(null),triggerRef=externalTriggerRef||internalTriggerRef,isOutsideClickOnTrigger=(0,_react.useRef)(!1),ariaAttributes=(0,_ariaAttributes.getAriaAttributes)(restContentProps),popoverContextValue=(0,_react.useMemo)(()=>({isWithinPopover:!0,portalContainer}),[portalContainer]),contentWithProvider=_react.default.createElement(_PopoverContext.PopoverContext.Provider,{value:popoverContextValue},content),toggleVisibility=(0,_react.useCallback)((status,reason)=>{setVisible(status),onVisibilityChange&&onVisibilityChange(status,reason)},[onVisibilityChange]),handleTriggerClick=(0,_react.useCallback)(()=>{isOutsideClickOnTrigger.current?isOutsideClickOnTrigger.current=!1:toggleVisibility(!isVisible,VisibilityChangeReason.triggerClick)},[toggleVisibility,isVisible]),handleClickOutsideDeactivates=(0,_react.useCallback)(evt=>!retainOnOutsideClick?.(evt)&&(triggerRef.current&&triggerRef.current.contains(evt.target)&&(isOutsideClickOnTrigger.current=!0),!0),[triggerRef,isOutsideClickOnTrigger,retainOnOutsideClick]),handlePostDeactivate=(0,_react.useCallback)(()=>{toggleVisibility(!1,isOutsideClickOnTrigger.current?VisibilityChangeReason.triggerClick:VisibilityChangeReason.outsideClick)},[toggleVisibility]);(0,_react.useEffect)(()=>{setVisible(isPopoverVisible)},[isPopoverVisible]),(0,_react.useEffect)(()=>{let trigger=triggerRef.current;if(trigger)return trigger.addEventListener("click",handleTriggerClick),()=>{trigger.removeEventListener("click",handleTriggerClick)}},[handleTriggerClick,triggerRef]),(0,_react.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current,triggerTabIndex=trigger.getAttribute("tabindex");trigger.setAttribute("tabindex",triggerTabIndex??"0")}},[externalTriggerRef,children]),(0,_react.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current;trigger.setAttribute("aria-haspopup",getAriaPopupType(role)),trigger.setAttribute("aria-expanded",String(!!isVisible)),isVisible?trigger.setAttribute("aria-controls",tooltipId):trigger.removeAttribute("aria-controls")}},[externalTriggerRef,children,role,tooltipId,isVisible]);let triggerElm=children?_react.default.cloneElement(children,{ref:triggerRef,"aria-expanded":!!isVisible,...isVisible&&{"aria-controls":tooltipId},tabIndex:children.props.tabIndex??0,"aria-haspopup":getAriaPopupType(role)}):null;if(forceSheetLayout||renderAsSheetOnMobile&&(isMobileInPortrait||isMobileInLandscape)){let sheetElm=_react.default.createElement(_Sheet.Sheet,{id:tooltipId,isVisible:isVisible,portalContainer:portalContainer,dismissOnOutsideClick:dismissOnOutsideClick,disableInitialFocus:disableInitialFocus,disableReturnFocusToTrigger:disableReturnFocusToTrigger,onClose:handlePostDeactivate,onClickOutsideDeactivates:handleClickOutsideDeactivates,role:role,...sheetProps??{},...ariaAttributes},contentWithProvider);return _react.default.createElement(_react.default.Fragment,null,triggerElm,sheetElm)}let contentElm=_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{clickOutsideDeactivates:dismissOnOutsideClick&&handleClickOutsideDeactivates,allowOutsideClick:!0,escapeDeactivates:!0,fallbackFocus:`#${tooltipId}`,onPostDeactivate:handlePostDeactivate,preventScroll:!0,initialFocus:()=>!disableInitialFocus,returnFocusOnDeactivate:!disableReturnFocusToTrigger}},_react.default.createElement(FocusTrapContent,null,contentWithProvider)),tooltipElm=_react.default.createElement(_TooltipContent.TooltipContent,{...restContentProps,role:role,defaultVerticalPlacement:defaultVerticalPlacement,dataDSId:name,content:contentElm,contentPadding:contentPadding,maxWidth:maxWidth,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,subTheme:subTheme,isVisible:isVisible,tooltipId:tooltipId,triggerRef:triggerRef,isHiddenOnInvisibleTrigger:!0});return _react.default.createElement(_react.default.Fragment,null,triggerElm,tooltipElm)}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"BasePopover",{enumerable:!0,get:function(){return BasePopover}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react=/*#__PURE__*/_interop_require_wildcard._(require("react")),_ariaAttributes=require("../../shared/ariaAttributes"),_FocusTrapWrapper=require("../../shared/FocusTrapWrapper"),_useBreakpoints=require("../../shared/useBreakpoints"),_PopoverContext=require("../Patterns/Popover/PopoverContext"),_Sheet=require("../Sheet/Sheet"),_TooltipContent=require("../Tooltip/TooltipContent"),StyledContainer=(0,_styled.default)("div",{target:"e1bmyswc0",label:"StyledContainer"})(()=>({borderRadius:"inherit"})),FocusTrapContent=_react.default.forwardRef(({children},ref)=>_react.default.createElement(StyledContainer,{ref:ref},children)),VisibilityChangeReason={triggerClick:"triggerClick",outsideClick:"outsideClick"};function getAriaPopupType(role){let popupType=String(role);return(role||(popupType="true"),"alertdialog"===role)?"dialog":popupType}function BasePopover({placement="auto",content,children,contentPadding="m",maxWidth,externalTriggerRef,portalContainer,name="Popover",isVisible:isPopoverVisible,dismissOnOutsideClick=!0,retainOnOutsideClick,"data-e2e-test-id":dataE2eTestId,subTheme,defaultVerticalPlacement,onVisibilityChange,disableInitialFocus=!1,disableReturnFocusToTrigger=!1,renderAsSheetOnMobile=!1,forceSheetLayout=!1,role,sheetProps,...restContentProps}){let tooltipId=(0,_react.useMemo)(()=>`DS${name}_${Math.floor(Date.now()*Math.random())}`,[name]),[isVisible,setVisible]=(0,_react.useState)(isPopoverVisible),{isMobileInPortrait,isMobileInLandscape}=(0,_useBreakpoints.useBreakpoints)(),internalTriggerRef=(0,_react.useRef)(null),triggerRef=externalTriggerRef||internalTriggerRef,isOutsideClickOnTrigger=(0,_react.useRef)(!1),ariaAttributes=(0,_ariaAttributes.getAriaAttributes)(restContentProps),popoverContextValue=(0,_react.useMemo)(()=>({isWithinPopover:!0,portalContainer}),[portalContainer]),contentWithProvider=_react.default.createElement(_PopoverContext.PopoverContext.Provider,{value:popoverContextValue},content),toggleVisibility=(0,_react.useCallback)((status,reason)=>{setVisible(status),onVisibilityChange&&onVisibilityChange(status,reason)},[onVisibilityChange]),handleTriggerClick=(0,_react.useCallback)(()=>{isOutsideClickOnTrigger.current?isOutsideClickOnTrigger.current=!1:toggleVisibility(!isVisible,VisibilityChangeReason.triggerClick)},[toggleVisibility,isVisible]),handleClickOutsideDeactivates=(0,_react.useCallback)(evt=>!retainOnOutsideClick?.(evt)&&(triggerRef.current&&triggerRef.current.contains(evt.target)&&(isOutsideClickOnTrigger.current=!0),!0),[triggerRef,isOutsideClickOnTrigger,retainOnOutsideClick]),handlePostDeactivate=(0,_react.useCallback)(()=>{toggleVisibility(!1,isOutsideClickOnTrigger.current?VisibilityChangeReason.triggerClick:VisibilityChangeReason.outsideClick)},[toggleVisibility]);(0,_react.useEffect)(()=>{setVisible(isPopoverVisible)},[isPopoverVisible]),(0,_react.useEffect)(()=>{let trigger=triggerRef.current;if(trigger)return trigger.addEventListener("click",handleTriggerClick),()=>{trigger.removeEventListener("click",handleTriggerClick)}},[handleTriggerClick,triggerRef]),(0,_react.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current,triggerTabIndex=trigger.getAttribute("tabindex");trigger.setAttribute("tabindex",triggerTabIndex??"0")}},[externalTriggerRef,children]),(0,_react.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current;trigger.setAttribute("aria-haspopup",getAriaPopupType(role)),trigger.setAttribute("aria-expanded",String(!!isVisible)),isVisible?trigger.setAttribute("aria-controls",tooltipId):trigger.removeAttribute("aria-controls")}},[externalTriggerRef,children,role,tooltipId,isVisible]);let triggerElm=children?_react.default.cloneElement(children,{ref:triggerRef,"aria-expanded":!!isVisible,...isVisible&&{"aria-controls":tooltipId},tabIndex:children.props.tabIndex??0,"aria-haspopup":getAriaPopupType(role)}):null;if(forceSheetLayout||renderAsSheetOnMobile&&(isMobileInPortrait||isMobileInLandscape)){let sheetElm=_react.default.createElement(_Sheet.Sheet,{id:tooltipId,isVisible:!!isVisible,portalContainer:portalContainer??void 0,dismissOnOutsideClick:dismissOnOutsideClick,disableInitialFocus:disableInitialFocus,disableReturnFocusToTrigger:disableReturnFocusToTrigger,onClose:handlePostDeactivate,onClickOutsideDeactivates:handleClickOutsideDeactivates,role:role,...sheetProps??{},...ariaAttributes},contentWithProvider);return _react.default.createElement(_react.default.Fragment,null,triggerElm,sheetElm)}let contentElm=_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{clickOutsideDeactivates:dismissOnOutsideClick&&handleClickOutsideDeactivates,allowOutsideClick:!0,escapeDeactivates:!0,fallbackFocus:`#${tooltipId}`,onPostDeactivate:handlePostDeactivate,preventScroll:!0,initialFocus:()=>!disableInitialFocus,returnFocusOnDeactivate:!disableReturnFocusToTrigger}},_react.default.createElement(FocusTrapContent,null,contentWithProvider)),tooltipElm=_react.default.createElement(_TooltipContent.TooltipContent,{...restContentProps,role:role,defaultVerticalPlacement:defaultVerticalPlacement,dataDSId:name,content:contentElm,contentPadding:contentPadding,maxWidth:maxWidth,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,subTheme:subTheme,isVisible:isVisible,tooltipId:tooltipId,triggerRef:triggerRef,isHiddenOnInvisibleTrigger:!0});return _react.default.createElement(_react.default.Fragment,null,triggerElm,tooltipElm)}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"BaseTooltip",{enumerable:!0,get:function(){return BaseTooltip}});const _interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_interactions=require("@react-aria/interactions"),_react=/*#__PURE__*/_interop_require_wildcard._(require("react")),_TooltipContent=require("./TooltipContent");function BaseTooltip({placement="auto",content,children,externalTriggerRef,portalContainer,contentPadding,maxWidth,subTheme,"data-e2e-test-id":dataE2eTestId,onVisibilityChange,privateProps,...ariaAttributes}){let tooltipId=(0,_react.useMemo)(()=>`DSTooltip_${Math.floor(Date.now()*Math.random())}`,[]),{isFocusVisible}=(0,_interactions.useFocusVisible)(),[isVisible,setVisible]=(0,_react.useState)(!1),triggeredByEvent=(0,_react.useRef)(null),isTooltipHovered=(0,_react.useRef)(!1),isTriggerHovered=(0,_react.useRef)(!1),hideTooltipTimeoutId=(0,_react.useRef)(null),showTooltipTimeoutId=(0,_react.useRef)(null),internalTriggerRef=(0,_react.useRef)(null),triggerRef=externalTriggerRef||internalTriggerRef,toggleVisibility=(0,_react.useCallback)(status=>{setVisible(status),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]),handleTriggerPointerEnter=(0,_react.useCallback)(()=>{isTriggerHovered.current=!0,isTooltipHovered.current||(clearTimeout(showTooltipTimeoutId.current),showTooltipTimeoutId.current=setTimeout(()=>{isTriggerHovered.current&&(triggeredByEvent.current="hover",toggleVisibility(!0))},200))},[toggleVisibility]),handleTriggerPointerLeave=(0,_react.useCallback)(()=>{isTriggerHovered.current=!1,clearTimeout(hideTooltipTimeoutId.current),hideTooltipTimeoutId.current=setTimeout(()=>{isTooltipHovered.current||"hover"!==triggeredByEvent.current||isTriggerHovered.current||toggleVisibility(!1)},200)},[toggleVisibility]),handleTriggerFocus=(0,_react.useCallback)(()=>{isFocusVisible&&(triggeredByEvent.current="focus",toggleVisibility(!0))},[isFocusVisible,toggleVisibility]),handleTriggerBlur=(0,_react.useCallback)(()=>{"focus"===triggeredByEvent.current&&toggleVisibility(!1)},[toggleVisibility]),handleTriggerClick=(0,_react.useCallback)(()=>{toggleVisibility(!1)},[toggleVisibility]),handleTriggerKeyDown=(0,_react.useCallback)(evt=>{"Escape"===evt.key&&toggleVisibility(!1)},[toggleVisibility]);(0,_react.useEffect)(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),(0,_react.useEffect)(()=>{let trigger;if(externalTriggerRef?.current&&!children){let triggerTabIndex=(trigger=externalTriggerRef.current).getAttribute("tabindex");trigger.setAttribute("tabindex",triggerTabIndex??"0"),trigger.addEventListener("pointerenter",handleTriggerPointerEnter),trigger.addEventListener("pointerleave",handleTriggerPointerLeave),trigger.addEventListener("focus",handleTriggerFocus),trigger.addEventListener("blur",handleTriggerBlur),trigger.addEventListener("click",handleTriggerClick),trigger.addEventListener("keydown",handleTriggerKeyDown)}return()=>{trigger&&(trigger.removeEventListener("pointerenter",handleTriggerPointerEnter),trigger.removeEventListener("pointerleave",handleTriggerPointerLeave),trigger.removeEventListener("focus",handleTriggerFocus),trigger.removeEventListener("blur",handleTriggerBlur),trigger.removeEventListener("click",handleTriggerClick),trigger.removeEventListener("keydown",handleTriggerKeyDown))}},[externalTriggerRef,children,handleTriggerPointerEnter,handleTriggerPointerLeave,handleTriggerFocus,handleTriggerBlur,handleTriggerClick,handleTriggerKeyDown]),(0,_react.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current;isVisible?trigger.setAttribute("aria-describedby",tooltipId):trigger.removeAttribute("aria-describedby")}},[externalTriggerRef,children,tooltipId,isVisible]);let triggerElm=children?_react.default.cloneElement(children,{ref:triggerRef,...ariaAttributes,...isVisible&&{"aria-describedby":tooltipId},tabIndex:children.props.tabIndex??0,onPointerEnter:handleTriggerPointerEnter,onPointerLeave:handleTriggerPointerLeave,onFocus:evt=>{handleTriggerFocus(),children.props.onFocus&&children.props.onFocus(evt)},onBlur:evt=>{handleTriggerBlur(),children.props.onBlur&&children.props.onBlur(evt)},onClick:evt=>{handleTriggerClick(),children.props.onClick&&children.props.onClick(evt)},onKeyDown:handleTriggerKeyDown}):null,tooltipElm=_react.default.createElement(_TooltipContent.TooltipContent,{dataDSId:"Tooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:isVisible,tooltipId:tooltipId,triggerRef:triggerRef,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,subTheme:subTheme,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{isTooltipHovered.current=!1,"hover"===triggeredByEvent.current&&toggleVisibility(!1)},privateProps:privateProps});return _react.default.createElement(_react.default.Fragment,null,triggerElm,tooltipElm)}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"BaseTooltip",{enumerable:!0,get:function(){return BaseTooltip}});const _interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_interactions=require("@react-aria/interactions"),_react=require("@emotion/react"),_react1=/*#__PURE__*/_interop_require_wildcard._(require("react")),_parseDurationMs=require("../../shared/parseDurationMs"),_TooltipContent=require("./TooltipContent");let openTooltip=null,lastHiddenInstance=null,lastTooltipHideTimestamp=0;const isOpenTooltip=instance=>openTooltip?.instance===instance,canReplacePreviousTooltip=(instance,replaceWindow)=>openTooltip?openTooltip.isReplaceable():lastHiddenInstance!==instance&&Date.now()-lastTooltipHideTimestamp<replaceWindow;function BaseTooltip({placement="auto",content,children,externalTriggerRef,portalContainer,contentPadding,maxWidth,subTheme,"data-e2e-test-id":dataE2eTestId,onVisibilityChange,privateProps,...ariaAttributes}){let tooltipId=(0,_react1.useMemo)(()=>`DSTooltip_${Math.floor(Date.now()*Math.random())}`,[]),{isFocusVisible}=(0,_interactions.useFocusVisible)(),{open:openMotion,close:closeMotion,replace:replaceMotion}=(0,_react.useTheme)().variables.animation.tooltip,showDelay=(0,_parseDurationMs.parseDurationMs)(openMotion.delay),hideDelay=(0,_parseDurationMs.parseDurationMs)(closeMotion.delay),replaceWindow=(0,_parseDurationMs.parseDurationMs)(replaceMotion.window),instanceRef=(0,_react1.useRef)({}),[isVisible,setVisible]=(0,_react1.useState)(!1),[openedAsReplacement,setOpenedAsReplacement]=(0,_react1.useState)(!1),triggeredByEvent=(0,_react1.useRef)(null),isTooltipHovered=(0,_react1.useRef)(!1),isTriggerHovered=(0,_react1.useRef)(!1),hideTooltipTimeoutId=(0,_react1.useRef)(null),showTooltipTimeoutId=(0,_react1.useRef)(null),internalTriggerRef=(0,_react1.useRef)(null),triggerRef=externalTriggerRef||internalTriggerRef,toggleVisibility=(0,_react1.useCallback)(status=>{setVisible(status),status||setOpenedAsReplacement(!1),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]),handleTriggerPointerEnter=(0,_react1.useCallback)(()=>{if(isTriggerHovered.current=!0,!isTooltipHovered.current&&!isOpenTooltip(instanceRef.current)){clearTimeout(showTooltipTimeoutId.current);let showOnHover=()=>{triggeredByEvent.current="hover",toggleVisibility(!0)};if(canReplacePreviousTooltip(instanceRef.current,replaceWindow)){openTooltip?.hide(),setOpenedAsReplacement(!0),showOnHover();return}showTooltipTimeoutId.current=setTimeout(()=>{isTriggerHovered.current&&showOnHover()},showDelay)}},[toggleVisibility,showDelay,replaceWindow]),scheduleHoverHide=(0,_react1.useCallback)(()=>{clearTimeout(hideTooltipTimeoutId.current),hideTooltipTimeoutId.current=setTimeout(()=>{isTooltipHovered.current||"hover"!==triggeredByEvent.current||isTriggerHovered.current||toggleVisibility(!1)},hideDelay)},[toggleVisibility,hideDelay]),handleTriggerPointerLeave=(0,_react1.useCallback)(()=>{isTriggerHovered.current=!1,scheduleHoverHide()},[scheduleHoverHide]),handleTriggerFocus=(0,_react1.useCallback)(()=>{isFocusVisible&&(triggeredByEvent.current="focus",toggleVisibility(!0))},[isFocusVisible,toggleVisibility]),handleTriggerBlur=(0,_react1.useCallback)(()=>{"focus"===triggeredByEvent.current&&toggleVisibility(!1)},[toggleVisibility]),handleTriggerClick=(0,_react1.useCallback)(()=>{toggleVisibility(!1)},[toggleVisibility]),handleTriggerKeyDown=(0,_react1.useCallback)(evt=>{"Escape"===evt.key&&toggleVisibility(!1)},[toggleVisibility]),toggleVisibilityRef=(0,_react1.useRef)(toggleVisibility);(0,_react1.useEffect)(()=>{toggleVisibilityRef.current=toggleVisibility},[toggleVisibility]),(0,_react1.useEffect)(()=>{if(!isVisible)return;let openedTooltip={instance:instanceRef.current,hide:()=>{clearTimeout(hideTooltipTimeoutId.current),toggleVisibilityRef.current(!1)},isReplaceable:()=>"hover"===triggeredByEvent.current};return openTooltip=openedTooltip,()=>{openTooltip===openedTooltip&&(openTooltip=null),lastHiddenInstance=openedTooltip.instance,lastTooltipHideTimestamp=Date.now()}},[isVisible]),(0,_react1.useEffect)(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),(0,_react1.useEffect)(()=>{let trigger;if(externalTriggerRef?.current&&!children){let triggerTabIndex=(trigger=externalTriggerRef.current).getAttribute("tabindex");trigger.setAttribute("tabindex",triggerTabIndex??"0"),trigger.addEventListener("pointerenter",handleTriggerPointerEnter),trigger.addEventListener("pointerleave",handleTriggerPointerLeave),trigger.addEventListener("focus",handleTriggerFocus),trigger.addEventListener("blur",handleTriggerBlur),trigger.addEventListener("click",handleTriggerClick),trigger.addEventListener("keydown",handleTriggerKeyDown)}return()=>{trigger&&(trigger.removeEventListener("pointerenter",handleTriggerPointerEnter),trigger.removeEventListener("pointerleave",handleTriggerPointerLeave),trigger.removeEventListener("focus",handleTriggerFocus),trigger.removeEventListener("blur",handleTriggerBlur),trigger.removeEventListener("click",handleTriggerClick),trigger.removeEventListener("keydown",handleTriggerKeyDown))}},[externalTriggerRef,children,handleTriggerPointerEnter,handleTriggerPointerLeave,handleTriggerFocus,handleTriggerBlur,handleTriggerClick,handleTriggerKeyDown]),(0,_react1.useEffect)(()=>{if(externalTriggerRef?.current&&!children){let trigger=externalTriggerRef.current;isVisible?trigger.setAttribute("aria-describedby",tooltipId):trigger.removeAttribute("aria-describedby")}},[externalTriggerRef,children,tooltipId,isVisible]);let triggerElm=children?_react1.default.cloneElement(children,{ref:triggerRef,...ariaAttributes,...isVisible&&{"aria-describedby":tooltipId},tabIndex:children.props.tabIndex??0,onPointerEnter:handleTriggerPointerEnter,onPointerLeave:handleTriggerPointerLeave,onFocus:evt=>{handleTriggerFocus(),children.props.onFocus&&children.props.onFocus(evt)},onBlur:evt=>{handleTriggerBlur(),children.props.onBlur&&children.props.onBlur(evt)},onClick:evt=>{handleTriggerClick(),children.props.onClick&&children.props.onClick(evt)},onKeyDown:handleTriggerKeyDown}):null,tooltipElm=_react1.default.createElement(_TooltipContent.TooltipContent,{dataDSId:"Tooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:isVisible,skipOpenAnimation:openedAsReplacement,hasHoverBridge:!0,tooltipId:tooltipId,triggerRef:triggerRef,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,subTheme:subTheme,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{isTooltipHovered.current=!1,scheduleHoverHide()},privateProps:privateProps});return _react1.default.createElement(_react1.default.Fragment,null,triggerElm,tooltipElm)}
@@ -45,6 +45,18 @@ export type TooltipContentProps = {
45
45
  hideArrow?: boolean;
46
46
  /** Sets css visibility hidden when trigger is scrolled out of view */
47
47
  isHiddenOnInvisibleTrigger?: boolean;
48
+ /**
49
+ * @internal
50
+ * Appears without its open animation, when this tooltip replaces one already
51
+ * on screen. Defaults to `false`.
52
+ */
53
+ skipOpenAnimation?: boolean;
54
+ /**
55
+ * @internal
56
+ * Covers the gap to the trigger with an invisible hover area, so a hover
57
+ * tooltip survives the pointer moving onto it. Defaults to `false`.
58
+ */
59
+ hasHoverBridge?: boolean;
48
60
  onTooltipPointerEnter?: React.PointerEventHandler<HTMLDivElement>;
49
61
  onTooltipPointerLeave?: React.PointerEventHandler<HTMLDivElement>;
50
62
  /** This callback is triggered when content overflows the viewport both above and below trigger. Use this for tracking purposes or re-rendering Popover with a larger maxWidth */
@@ -52,4 +64,4 @@ export type TooltipContentProps = {
52
64
  privateProps?: TooltipPrivateProps;
53
65
  } & Pick<PortalProps, "portalContainer"> & AriaAttributes;
54
66
  /** This component is used to display the overlay for both Toggletip and Tooltip components */
55
- export declare function TooltipContent({ placement, content, tooltipId, triggerRef, portalContainer, dataE2eTestId, dataDSId, isVisible, "aria-hidden": ariaHidden, role, tabIndex, contentPadding, maxWidth, subTheme, defaultVerticalPlacement, hideArrow, isHiddenOnInvisibleTrigger, onTooltipPointerEnter, onTooltipPointerLeave, onOverflowViewport, privateProps, ...ariaAttributes }: TooltipContentProps): React.ReactElement;
67
+ export declare function TooltipContent({ placement, content, tooltipId, triggerRef, portalContainer, dataE2eTestId, dataDSId, isVisible, "aria-hidden": ariaHidden, role, tabIndex, contentPadding, maxWidth, subTheme, defaultVerticalPlacement, hideArrow, isHiddenOnInvisibleTrigger, skipOpenAnimation, hasHoverBridge, onTooltipPointerEnter, onTooltipPointerLeave, onOverflowViewport, privateProps, ...ariaAttributes }: TooltipContentProps): React.ReactElement | null;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"TooltipContent",{enumerable:!0,get:function(){return TooltipContent}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_react=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=/*#__PURE__*/_interop_require_wildcard._(require("react")),_Portal=require("../Portal/Portal"),_SubThemeProvider=require("../SubThemeProvider/SubThemeProvider"),_useFloatingPosition=require("../Utilities/FloatingPosition/useFloatingPosition"),_FloatingPositionedContext=require("./FloatingPositionedContext"),_utils=require("./utils"),StyledContainer=(0,_styled.default)("div",{target:"e1l7l62c0",label:"StyledContainer"})(({theme,side,maxWidth,contentPadding,subTheme,isHidden,isSidePlacement})=>{let zIndex=(0,_Portal.usePortalChildZIndex)(theme.variables.zIndex.tooltip),animationDistance="top"===side?`${-_utils.ANIMATION_DISTANCE}px`:`${_utils.ANIMATION_DISTANCE}px`,animation=(0,_react.keyframes)({from:{opacity:theme.variables.opacity.hidden,...!isSidePlacement&&{transform:`translateY(${animationDistance})`}},to:{opacity:theme.variables.opacity.visible,...!isSidePlacement&&{transform:"translateY(0)"}}}),contentPaddingMap={s:theme.variables.size.spacing.xxs,m:theme.variables.size.spacing.s},invertedSubThemeStyles={padding:`${theme.variables.size.spacing.xs} ${theme.variables.size.spacing.s}`,...contentPadding&&{padding:contentPaddingMap[contentPadding]}};return{zIndex,opacity:theme.variables.opacity.hidden,animation:`200ms ease-out forwards ${animation}`,maxWidth,width:"max-content",boxSizing:"border-box",backgroundColor:subTheme?theme.values.color.background.primary.default:theme.values.color.background.elevated.default,borderRadius:subTheme?theme.variables.size.borderRadius.xs:theme.variables.size.borderRadius.s,...isHidden&&{visibility:"hidden"},...!!subTheme&&invertedSubThemeStyles,...!subTheme&&{":after":{content:'" "',position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none",borderRadius:"inherit",boxShadow:theme.values.elevation[3]}}}}),StyledArrow=(0,_styled.default)("div",{target:"e1l7l62c1",label:"StyledArrow"})(({theme,subTheme,side,size=_utils.ARROW_SIZE,arrowOffsetLeft})=>{let adjustmentForShadow=+!subTheme,arrowContainerHeight=size+_utils.DISTANCE_FROM_TRIGGER,arrowSideLength=Math.sqrt(size**2+(size+adjustmentForShadow)**2);return{position:"absolute",left:arrowOffsetLeft,width:40,height:arrowContainerHeight,zIndex:1,overflow:"hidden",..."top"===side&&{top:`calc(100% - ${adjustmentForShadow}px)`},..."bottom"===side&&{top:`-${arrowContainerHeight-adjustmentForShadow}px`},"&::after":{content:'" "',position:"absolute",top:"top"===side?0:"100%",left:"50%",width:arrowSideLength,height:arrowSideLength,backgroundColor:subTheme?theme.values.color.background.primary.default:theme.values.color.background.elevated.default,transform:"translate(-50%, -50%) rotate(45deg)",...!subTheme&&{boxShadow:theme.values.elevation[3]}}}});let lastTooltipHideTimestamp=0;function TooltipContent({placement="auto",content,tooltipId,triggerRef,portalContainer,dataE2eTestId,dataDSId,isVisible,"aria-hidden":ariaHidden,role,tabIndex,contentPadding,maxWidth=224,subTheme,defaultVerticalPlacement,hideArrow=!1,isHiddenOnInvisibleTrigger=!1,onTooltipPointerEnter,onTooltipPointerLeave,onOverflowViewport,privateProps,...ariaAttributes}){let animationDuration,[isHidden,setIsHidden]=(0,_react1.useState)(!1),arrowRef=(0,_react1.useRef)(null),isOverflowCallbackCalledRef=(0,_react1.useRef)(!1),{placement:sidePlacement,offset:sideOffset=_utils.sidePlacementOffset,maxWidth:privateMaxWidth}=privateProps??{},arrowSize=(0,_react1.useMemo)(()=>hideArrow?0:subTheme?_utils.ARROW_SIZE:_utils.ARROW_SIZE_BIG,[subTheme,hideArrow]),handleViewportOverflow=(0,_react1.useCallback)((triggerRect,tooltipRect,viewportHeight)=>{isOverflowCallbackCalledRef.current||(onOverflowViewport?.(triggerRect,tooltipRect,viewportHeight),isOverflowCallbackCalledRef.current=!0)},[onOverflowViewport,isOverflowCallbackCalledRef]),overflowMiddleware=(0,_react1.useMemo)(()=>"auto"===placement?[(0,_utils.createOverflowViewportReporter)(handleViewportOverflow)]:void 0,[placement,handleViewportOverflow]),{placement:preferredPlacement,fallbackPlacements}=(0,_react1.useMemo)(()=>(0,_utils.toFloatingPlacement)({placement,defaultVerticalPlacement,sidePlacement}),[placement,defaultVerticalPlacement,sidePlacement]),offset=(0,_react1.useMemo)(()=>(0,_utils.getTooltipOffsetOptions)({arrowSize,sideOffset}),[arrowSize,sideOffset]),anchorRef=(0,_react1.useRef)(null),anchorSourceRef=(0,_react1.useRef)(null);anchorSourceRef.current!==triggerRef.current&&(anchorSourceRef.current=triggerRef.current,anchorRef.current=(0,_utils.toFloatingAnchor)(triggerRef.current));let{setFloating,floatingStyles,placement:resolvedPlacement,isPositioned,middlewareData}=(0,_useFloatingPosition.useFloatingPosition)({anchorRef,placement:preferredPlacement,offset,flip:{fallbackPlacements},arrowRef:hideArrow?void 0:arrowRef,disableTransform:!0,trackAnimationFrame:!0,isOpen:!!isVisible,extraMiddleware:overflowMiddleware});if((0,_react1.useEffect)(()=>{isVisible||(lastTooltipHideTimestamp=Date.now())},[isVisible]),(0,_react1.useEffect)(()=>{isOverflowCallbackCalledRef.current=!1},[isVisible,isOverflowCallbackCalledRef]),(0,_react1.useEffect)(()=>{let observer;return isHiddenOnInvisibleTrigger&&triggerRef.current&&isVisible&&"undefined"!=typeof IntersectionObserver&&(observer=new IntersectionObserver(entries=>entries.forEach(entry=>{let rect=entry.boundingClientRect;(rect?.width!==0||rect?.height!==0)&&setIsHidden(!entry.isIntersecting)}),{root:null,threshold:.99})).observe(triggerRef.current),()=>{observer&&observer.disconnect()}},[triggerRef,isVisible,isHiddenOnInvisibleTrigger]),!isVisible)return null;let side=(0,_utils.getPlacementSide)(resolvedPlacement),isSidePlacement=side===_utils.SIDE_PLACEMENT_SIDE,tooltipElm=_react1.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDSId,"data-placement":resolvedPlacement,style:{...floatingStyles,animationDuration:(animationDuration="200ms",lastTooltipHideTimestamp&&Date.now()-lastTooltipHideTimestamp<700&&(animationDuration="0ms"),animationDuration)},ref:setFloating,id:tooltipId,role:role,...ariaAttributes,"aria-hidden":ariaHidden,subTheme:subTheme,tabIndex:tabIndex,side:side,maxWidth:privateMaxWidth??maxWidth,contentPadding:contentPadding,isHidden:isHidden||!isPositioned,isSidePlacement:isSidePlacement,onPointerEnter:onTooltipPointerEnter,onPointerLeave:onTooltipPointerLeave},_react1.default.createElement(_FloatingPositionedContext.FloatingPositionedContext.Provider,{value:isPositioned},content),!hideArrow&&side!==_utils.SIDE_PLACEMENT_SIDE&&_react1.default.createElement(StyledArrow,{ref:arrowRef,"data-e2e-test-id":`${dataE2eTestId}_arrow`,subTheme:subTheme,side:side,size:arrowSize,arrowOffsetLeft:middlewareData.arrow?.x})),wrapperElm=subTheme?_react1.default.createElement(_SubThemeProvider.SubThemeProvider,{name:subTheme},tooltipElm):tooltipElm;return _react1.default.createElement(_Portal.Portal,{portalContainer:portalContainer},wrapperElm)}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"TooltipContent",{enumerable:!0,get:function(){return TooltipContent}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_interop_require_wildcard=require("@swc/helpers/_/_interop_require_wildcard"),_react=require("@emotion/react"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=/*#__PURE__*/_interop_require_wildcard._(require("react")),_Portal=require("../Portal/Portal"),_SubThemeProvider=require("../SubThemeProvider/SubThemeProvider"),_useFloatingPosition=require("../Utilities/FloatingPosition/useFloatingPosition"),_FloatingPositionedContext=require("./FloatingPositionedContext"),_utils=require("./utils"),StyledContainer=(0,_styled.default)("div",{target:"e1igm2h80",label:"StyledContainer"})(({theme,side,maxWidth,contentPadding,subTheme,isHidden,isSidePlacement,hoverBridgeSize})=>{let zIndex=(0,_Portal.usePortalChildZIndex)(theme.variables.zIndex.tooltip),{open:openMotion}=theme.variables.animation.tooltip,animationDistance="top"===side?`-${openMotion.distanceY}`:openMotion.distanceY,animation=(0,_react.keyframes)({from:{opacity:theme.variables.opacity.hidden,...!isSidePlacement&&{transform:`translateY(${animationDistance})`}},to:{opacity:theme.variables.opacity.visible,...!isSidePlacement&&{transform:"translateY(0)"}}}),contentPaddingMap={s:theme.variables.size.spacing.xxs,m:theme.variables.size.spacing.s},invertedSubThemeStyles={padding:`${theme.variables.size.spacing.xs} ${theme.variables.size.spacing.s}`,...contentPadding&&{padding:contentPaddingMap[contentPadding]}};return{zIndex,opacity:theme.variables.opacity.hidden,animation:`${openMotion.duration} ${openMotion.timingFunction} forwards ${animation}`,maxWidth,width:"max-content",boxSizing:"border-box",backgroundColor:subTheme?theme.values.color.background.primary.default:theme.values.color.background.elevated.default,borderRadius:subTheme?theme.variables.size.borderRadius.xs:theme.variables.size.borderRadius.s,...isHidden&&{visibility:"hidden"},...void 0!==hoverBridgeSize&&{"::before":{content:'""',position:"absolute",..."top"===side&&{top:"100%",left:0,right:0,height:hoverBridgeSize},..."bottom"===side&&{bottom:"100%",left:0,right:0,height:hoverBridgeSize},...side===_utils.SIDE_PLACEMENT_SIDE&&{right:"100%",top:0,bottom:0,width:hoverBridgeSize}}},"@media (prefers-reduced-motion: reduce)":{animation:"none",opacity:theme.variables.opacity.visible},...!!subTheme&&invertedSubThemeStyles,...!subTheme&&{":after":{content:'" "',position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none",borderRadius:"inherit",boxShadow:theme.values.elevation[3]}}}}),StyledArrow=(0,_styled.default)("div",{target:"e1igm2h81",label:"StyledArrow"})(({theme,subTheme,side,size=_utils.ARROW_SIZE,arrowOffsetLeft})=>{let adjustmentForShadow=+!subTheme,arrowContainerHeight=size+_utils.DISTANCE_FROM_TRIGGER,arrowSideLength=Math.sqrt(size**2+(size+adjustmentForShadow)**2);return{position:"absolute",left:arrowOffsetLeft,width:40,height:arrowContainerHeight,zIndex:1,overflow:"hidden",..."top"===side&&{top:`calc(100% - ${adjustmentForShadow}px)`},..."bottom"===side&&{top:`-${arrowContainerHeight-adjustmentForShadow}px`},"&::after":{content:'" "',position:"absolute",top:"top"===side?0:"100%",left:"50%",width:arrowSideLength,height:arrowSideLength,backgroundColor:subTheme?theme.values.color.background.primary.default:theme.values.color.background.elevated.default,transform:"translate(-50%, -50%) rotate(45deg)",...!subTheme&&{boxShadow:theme.values.elevation[3]}}}});function TooltipContent({placement="auto",content,tooltipId,triggerRef,portalContainer,dataE2eTestId,dataDSId,isVisible,"aria-hidden":ariaHidden,role,tabIndex,contentPadding,maxWidth=224,subTheme,defaultVerticalPlacement,hideArrow=!1,isHiddenOnInvisibleTrigger=!1,skipOpenAnimation=!1,hasHoverBridge=!1,onTooltipPointerEnter,onTooltipPointerLeave,onOverflowViewport,privateProps,...ariaAttributes}){let[isHidden,setIsHidden]=(0,_react1.useState)(!1),arrowRef=(0,_react1.useRef)(null),isOverflowCallbackCalledRef=(0,_react1.useRef)(!1),{placement:sidePlacement,offset:sideOffset=_utils.sidePlacementOffset,maxWidth:privateMaxWidth}=privateProps??{},arrowSize=(0,_react1.useMemo)(()=>hideArrow?0:subTheme?_utils.ARROW_SIZE:_utils.ARROW_SIZE_BIG,[subTheme,hideArrow]),handleViewportOverflow=(0,_react1.useCallback)((triggerRect,tooltipRect,viewportHeight)=>{isOverflowCallbackCalledRef.current||(onOverflowViewport?.(triggerRect,tooltipRect,viewportHeight),isOverflowCallbackCalledRef.current=!0)},[onOverflowViewport,isOverflowCallbackCalledRef]),overflowMiddleware=(0,_react1.useMemo)(()=>"auto"===placement?[(0,_utils.createOverflowViewportReporter)(handleViewportOverflow)]:void 0,[placement,handleViewportOverflow]),{placement:preferredPlacement,fallbackPlacements}=(0,_react1.useMemo)(()=>(0,_utils.toFloatingPlacement)({placement,defaultVerticalPlacement,sidePlacement}),[placement,defaultVerticalPlacement,sidePlacement]),offset=(0,_react1.useMemo)(()=>(0,_utils.getTooltipOffsetOptions)({arrowSize,sideOffset}),[arrowSize,sideOffset]),anchorRef=(0,_react1.useRef)(null),anchorSourceRef=(0,_react1.useRef)(null);anchorSourceRef.current!==triggerRef.current&&(anchorSourceRef.current=triggerRef.current,anchorRef.current=(0,_utils.toFloatingAnchor)(triggerRef.current));let{setFloating,floatingStyles,placement:resolvedPlacement,isPositioned,middlewareData}=(0,_useFloatingPosition.useFloatingPosition)({anchorRef,placement:preferredPlacement,offset,flip:{fallbackPlacements},arrowRef:hideArrow?void 0:arrowRef,disableTransform:!0,trackAnimationFrame:!0,isOpen:!!isVisible,extraMiddleware:overflowMiddleware});if((0,_react1.useEffect)(()=>{isOverflowCallbackCalledRef.current=!1},[isVisible,isOverflowCallbackCalledRef]),(0,_react1.useEffect)(()=>{let observer;return isHiddenOnInvisibleTrigger&&triggerRef.current&&isVisible&&"undefined"!=typeof IntersectionObserver&&(observer=new IntersectionObserver(entries=>entries.forEach(entry=>{let rect=entry.boundingClientRect;(rect?.width!==0||rect?.height!==0)&&setIsHidden(!entry.isIntersecting)}),{root:null,threshold:.99})).observe(triggerRef.current),()=>{observer&&observer.disconnect()}},[triggerRef,isVisible,isHiddenOnInvisibleTrigger]),!isVisible)return null;let side=(0,_utils.getPlacementSide)(resolvedPlacement),isSidePlacement=side===_utils.SIDE_PLACEMENT_SIDE,triggerGap=isSidePlacement?sideOffset:arrowSize+_utils.DISTANCE_FROM_TRIGGER,tooltipElm=_react1.default.createElement(StyledContainer,{"data-e2e-test-id":dataE2eTestId,"data-ds-id":dataDSId,"data-placement":resolvedPlacement,style:{...floatingStyles,...skipOpenAnimation&&{animationDuration:"0ms"}},ref:setFloating,id:tooltipId,role:role,...ariaAttributes,"aria-hidden":ariaHidden,subTheme:subTheme,tabIndex:tabIndex,side:side,maxWidth:privateMaxWidth??maxWidth,contentPadding:contentPadding,isHidden:isHidden||!isPositioned,isSidePlacement:isSidePlacement,hoverBridgeSize:hasHoverBridge?triggerGap:void 0,onPointerEnter:onTooltipPointerEnter,onPointerLeave:onTooltipPointerLeave},_react1.default.createElement(_FloatingPositionedContext.FloatingPositionedContext.Provider,{value:isPositioned},content),!hideArrow&&side!==_utils.SIDE_PLACEMENT_SIDE&&_react1.default.createElement(StyledArrow,{ref:arrowRef,"data-e2e-test-id":`${dataE2eTestId}_arrow`,subTheme:subTheme,side:side,size:arrowSize,arrowOffsetLeft:middlewareData.arrow?.x})),wrapperElm=subTheme?_react1.default.createElement(_SubThemeProvider.SubThemeProvider,{name:subTheme},tooltipElm):tooltipElm;return _react1.default.createElement(_Portal.Portal,{portalContainer:portalContainer},wrapperElm)}
@@ -2,7 +2,6 @@ import type { OffsetOptions } from "@floating-ui/react-dom";
2
2
  import type { Middleware, Placement, VirtualElement } from "../Utilities/FloatingPosition/useFloatingPosition";
3
3
  import type { TooltipContentProps, TooltipPlacement, TooltipPrivateProps, TooltipVerticalPlacement } from "./TooltipContent";
4
4
  export declare const DISTANCE_FROM_TRIGGER = 4;
5
- export declare const ANIMATION_DISTANCE = 8;
6
5
  export declare const ARROW_SIZE = 6;
7
6
  export declare const ARROW_SIZE_BIG = 8;
8
7
  /** TODO: remove temporary side placement. Matches the gap top/bottom tooltips settle at. */
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get ANIMATION_DISTANCE(){return ANIMATION_DISTANCE},get ARROW_SIZE(){return ARROW_SIZE},get ARROW_SIZE_BIG(){return ARROW_SIZE_BIG},get DISTANCE_FROM_TRIGGER(){return DISTANCE_FROM_TRIGGER},get SIDE_PLACEMENT_SIDE(){return SIDE_PLACEMENT_SIDE},get createOverflowViewportReporter(){return createOverflowViewportReporter},get getArrowOffset(){return getArrowOffset},get getPlacementSide(){return getPlacementSide},get getTooltipOffsetOptions(){return getTooltipOffsetOptions},get sidePlacementOffset(){return sidePlacementOffset},get toFloatingAnchor(){return toFloatingAnchor},get toFloatingPlacement(){return toFloatingPlacement}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const DISTANCE_FROM_TRIGGER=4,ANIMATION_DISTANCE=8,ARROW_SIZE=6,ARROW_SIZE_BIG=8,sidePlacementOffset=10,getArrowOffset=size=>2*size,START_SUFFIX="-start",END_SUFFIX="-end",SIDE_PLACEMENT="right-start",DS_TO_FLOATING_PLACEMENT={top:"top",bottom:"bottom","top-left":`top${END_SUFFIX}`,"top-right":`top${START_SUFFIX}`,"bottom-left":`bottom${END_SUFFIX}`,"bottom-right":`bottom${START_SUFFIX}`},OPPOSITE_SIDE={top:"bottom",bottom:"top"},sideWithAlignments=side=>[side,`${side}${START_SUFFIX}`,`${side}${END_SUFFIX}`],toFloatingPlacement=({placement,defaultVerticalPlacement,sidePlacement})=>{let isAutomatic=!placement||"auto"===placement,preferred=isAutomatic?defaultVerticalPlacement??"top":DS_TO_FLOATING_PLACEMENT[placement],[side,alignment]=preferred.split("-"),oppositeSide=OPPOSITE_SIDE[side],resolved=isAutomatic?{placement:preferred,fallbackPlacements:[...sideWithAlignments(side).slice(1),...sideWithAlignments(oppositeSide)]}:{placement:preferred,fallbackPlacements:[alignment?`${oppositeSide}-${alignment}`:oppositeSide]};return"right-top"===sidePlacement?{placement:SIDE_PLACEMENT,fallbackPlacements:[resolved.placement,...resolved.fallbackPlacements]}:resolved},SIDE_PLACEMENT_SIDE="right",getPlacementSide=placement=>placement.split("-")[0],getTooltipOffsetOptions=({arrowSize,sideOffset})=>({rects,placement})=>{if(placement===SIDE_PLACEMENT)return{mainAxis:sideOffset};let mainAxis=arrowSize+DISTANCE_FROM_TRIGGER;return(placement.endsWith(START_SUFFIX)||placement.endsWith(END_SUFFIX))&&0!==arrowSize?{mainAxis,alignmentAxis:rects.reference.width/2-getArrowOffset(arrowSize)-arrowSize}:{mainAxis}},createOverflowViewportReporter=onOverflowViewport=>({name:"reportOverflowViewport",fn({elements}){let triggerRect=elements.reference.getBoundingClientRect(),tooltipRect=elements.floating.getBoundingClientRect(),viewportHeight=elements.floating.ownerDocument.documentElement.clientHeight,canPlaceAboveTrigger=triggerRect.top>=tooltipRect.height,canPlaceBelowTrigger=triggerRect.bottom+tooltipRect.height<viewportHeight;return canPlaceAboveTrigger||canPlaceBelowTrigger||onOverflowViewport(triggerRect,tooltipRect,viewportHeight),{}}}),toFloatingAnchor=trigger=>{if(!trigger)return null;if("undefined"!=typeof Range&&trigger instanceof Range){let container=trigger.commonAncestorContainer;return{getBoundingClientRect:()=>trigger.getBoundingClientRect(),getClientRects:()=>trigger.getClientRects(),contextElement:container instanceof Element?container:container.parentElement??void 0}}return trigger};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get ARROW_SIZE(){return ARROW_SIZE},get ARROW_SIZE_BIG(){return ARROW_SIZE_BIG},get DISTANCE_FROM_TRIGGER(){return DISTANCE_FROM_TRIGGER},get SIDE_PLACEMENT_SIDE(){return SIDE_PLACEMENT_SIDE},get createOverflowViewportReporter(){return createOverflowViewportReporter},get getArrowOffset(){return getArrowOffset},get getPlacementSide(){return getPlacementSide},get getTooltipOffsetOptions(){return getTooltipOffsetOptions},get sidePlacementOffset(){return sidePlacementOffset},get toFloatingAnchor(){return toFloatingAnchor},get toFloatingPlacement(){return toFloatingPlacement}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const DISTANCE_FROM_TRIGGER=4,ARROW_SIZE=6,ARROW_SIZE_BIG=8,sidePlacementOffset=10,getArrowOffset=size=>2*size,START_SUFFIX="-start",END_SUFFIX="-end",SIDE_PLACEMENT="right-start",DS_TO_FLOATING_PLACEMENT={top:"top",bottom:"bottom","top-left":`top${END_SUFFIX}`,"top-right":`top${START_SUFFIX}`,"bottom-left":`bottom${END_SUFFIX}`,"bottom-right":`bottom${START_SUFFIX}`},OPPOSITE_SIDE={top:"bottom",bottom:"top"},sideWithAlignments=side=>[side,`${side}${START_SUFFIX}`,`${side}${END_SUFFIX}`],toFloatingPlacement=({placement,defaultVerticalPlacement,sidePlacement})=>{let isAutomatic=!placement||"auto"===placement,preferred=isAutomatic?defaultVerticalPlacement??"top":DS_TO_FLOATING_PLACEMENT[placement],[side,alignment]=preferred.split("-"),oppositeSide=OPPOSITE_SIDE[side],resolved=isAutomatic?{placement:preferred,fallbackPlacements:[...sideWithAlignments(side).slice(1),...sideWithAlignments(oppositeSide)]}:{placement:preferred,fallbackPlacements:[alignment?`${oppositeSide}-${alignment}`:oppositeSide]};return"right-top"===sidePlacement?{placement:SIDE_PLACEMENT,fallbackPlacements:[resolved.placement,...resolved.fallbackPlacements]}:resolved},SIDE_PLACEMENT_SIDE="right",getPlacementSide=placement=>placement.split("-")[0],getTooltipOffsetOptions=({arrowSize,sideOffset})=>({rects,placement})=>{if(placement===SIDE_PLACEMENT)return{mainAxis:sideOffset};let mainAxis=arrowSize+DISTANCE_FROM_TRIGGER;return(placement.endsWith(START_SUFFIX)||placement.endsWith(END_SUFFIX))&&0!==arrowSize?{mainAxis,alignmentAxis:rects.reference.width/2-getArrowOffset(arrowSize)-arrowSize}:{mainAxis}},createOverflowViewportReporter=onOverflowViewport=>({name:"reportOverflowViewport",fn({elements}){let triggerRect=elements.reference.getBoundingClientRect(),tooltipRect=elements.floating.getBoundingClientRect(),viewportHeight=elements.floating.ownerDocument.documentElement.clientHeight,canPlaceAboveTrigger=triggerRect.top>=tooltipRect.height,canPlaceBelowTrigger=triggerRect.bottom+tooltipRect.height<viewportHeight;return canPlaceAboveTrigger||canPlaceBelowTrigger||onOverflowViewport(triggerRect,tooltipRect,viewportHeight),{}}}),toFloatingAnchor=trigger=>{if(!trigger)return null;if("undefined"!=typeof Range&&trigger instanceof Range){let container=trigger.commonAncestorContainer;return{getBoundingClientRect:()=>trigger.getBoundingClientRect(),getClientRects:()=>trigger.getClientRects(),contextElement:container instanceof Element?container:container.parentElement??void 0}}return trigger};
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  export type FormattedElementProps = {
3
3
  key: string;
4
- children: string | React.ReactNode[];
4
+ children: string | React.ReactNode[] | null;
5
5
  };
6
6
  export declare const makeStyledJSX: (string: string) => React.ReactNode[] | string | null;
7
7
  export type StyledTextProps = {
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get StyledText(){return StyledText},get makeStyledJSX(){return makeStyledJSX}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Text=require("../Text/Text"),Italic=(0,_styled.default)("i",{target:"e52exb50",label:"Italic"})({fontStyle:"italic"}),Bold=(0,_styled.default)("b",{target:"e52exb51",label:"Bold"})({fontWeight:"bolder"}),Components={b:({key,children})=>_react.default.createElement(Bold,{key:key},children),i:({key,children})=>_react.default.createElement(Italic,{key:key},children),p:({key,children})=>_react.default.createElement(_Text.Text,{key:key,as:"p",color:"primary"},children),small:({key,children})=>_react.default.createElement(_Text.Text,{key:key,as:"span",color:"tertiary"},children),sup:({key,children})=>_react.default.createElement("sup",{key:key},children),sub:({key,children})=>_react.default.createElement("sub",{key:key},children)},getNodes=string=>{let closingTagStartIndex,closingTagEndIndex,elementNames=Object.keys(Components).join("|"),elementMatch=RegExp(`<(${elementNames})>.*</\\1>`).exec(string);if(!elementMatch)return null;let elementName=elementMatch[1],openingTagStartIndex=elementMatch.index,openingTagEndIndex=elementMatch.index+elementName.length+2,numberOpenTags=1,elementTagsRegex=RegExp(`(<${elementName}>)|(</${elementName}>)`,"g"),currentTagMatch=elementTagsRegex.exec(string);do if(currentTagMatch.index>openingTagStartIndex&&(currentTagMatch[1]?numberOpenTags+=1:currentTagMatch[2]&&(numberOpenTags-=1,closingTagEndIndex=(closingTagStartIndex=currentTagMatch.index)+currentTagMatch[2].length)),!(currentTagMatch=elementTagsRegex.exec(string)))break;while(numberOpenTags>0);return{elementName,prev:string.slice(0,openingTagStartIndex),node:string.slice(openingTagEndIndex,closingTagStartIndex),next:string.slice(closingTagEndIndex)}},makeStyledJSX=string=>{if(!string||string.length<1)return null;let nodes=getNodes(string);if(!nodes)return string;let{elementName,prev,node,next}=nodes;return[prev,Components[elementName]({key:node,children:makeStyledJSX(node)}),makeStyledJSX(next)].filter(i=>null!==i&&""!==i&&!(Array.isArray(i)&&!i.length))};function StyledText({children,"data-e2e-test-id":dataE2eTestId}){return"string"!=typeof children?children:_react.default.createElement("span",{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"StyledText"},makeStyledJSX(children))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get StyledText(){return StyledText},get makeStyledJSX(){return makeStyledJSX}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/_interop_require_default._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Text=require("../Text/Text"),Italic=(0,_styled.default)("i",{target:"e839vll0",label:"Italic"})({fontStyle:"italic"}),Bold=(0,_styled.default)("b",{target:"e839vll1",label:"Bold"})({fontWeight:"bolder"}),Components={b:({key,children})=>_react.default.createElement(Bold,{key:key},children),i:({key,children})=>_react.default.createElement(Italic,{key:key},children),p:({key,children})=>_react.default.createElement(_Text.Text,{key:key,as:"p",color:"primary"},children),small:({key,children})=>_react.default.createElement(_Text.Text,{key:key,as:"span",color:"tertiary"},children),sup:({key,children})=>_react.default.createElement("sup",{key:key},children),sub:({key,children})=>_react.default.createElement("sub",{key:key},children)},getNodes=string=>{let closingTagStartIndex,closingTagEndIndex,elementNames=Object.keys(Components).join("|"),elementMatch=RegExp(`<(${elementNames})>.*</\\1>`).exec(string);if(!elementMatch)return null;let elementName=elementMatch[1],openingTagStartIndex=elementMatch.index,openingTagEndIndex=elementMatch.index+elementName.length+2,numberOpenTags=1,elementTagsRegex=RegExp(`(<${elementName}>)|(</${elementName}>)`,"g"),currentTagMatch=elementTagsRegex.exec(string);for(;currentTagMatch&&(currentTagMatch.index>openingTagStartIndex&&(currentTagMatch[1]?numberOpenTags+=1:currentTagMatch[2]&&(numberOpenTags-=1,closingTagEndIndex=(closingTagStartIndex=currentTagMatch.index)+currentTagMatch[2].length)),currentTagMatch=elementTagsRegex.exec(string),!(numberOpenTags<=0)););return{elementName,prev:string.slice(0,openingTagStartIndex),node:string.slice(openingTagEndIndex,closingTagStartIndex),next:string.slice(closingTagEndIndex)}},makeStyledJSX=string=>{if(!string||string.length<1)return null;let nodes=getNodes(string);if(!nodes)return string;let{elementName,prev,node,next}=nodes;return[prev,Components[elementName]({key:node,children:makeStyledJSX(node)}),makeStyledJSX(next)].filter(i=>null!==i&&""!==i&&!(Array.isArray(i)&&!i.length))};function StyledText({children,"data-e2e-test-id":dataE2eTestId}){return"string"!=typeof children?children:_react.default.createElement("span",{"data-e2e-test-id":dataE2eTestId,"data-ds-id":"StyledText"},makeStyledJSX(children))}
@@ -19,7 +19,7 @@ export type BaseTextProps = {
19
19
  /** @ignore */
20
20
  "data-ds-id"?: string;
21
21
  };
22
- export declare const TextContext: React.Context<Pick<BaseTextProps, "color" | "size" | "weight">>;
22
+ export declare const TextContext: React.Context<Pick<BaseTextProps, "color" | "size" | "weight"> | null>;
23
23
  export declare const getTextLineHeight: ({ theme, size, }: {
24
24
  theme: Theme;
25
25
  size: TextSize;