@cloudscape-design/components 3.0.221 → 3.0.223

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 (1002) hide show
  1. package/alert/index.js +4 -4
  2. package/alert/index.js.map +1 -1
  3. package/alert/internal.js +14 -15
  4. package/alert/internal.js.map +1 -1
  5. package/annotation-context/annotation/annotation-icon.js +1 -2
  6. package/annotation-context/annotation/annotation-icon.js.map +1 -1
  7. package/annotation-context/annotation/annotation-popover.js +6 -7
  8. package/annotation-context/annotation/annotation-popover.js.map +1 -1
  9. package/annotation-context/annotation/annotation-trigger.js +4 -6
  10. package/annotation-context/annotation/annotation-trigger.js.map +1 -1
  11. package/annotation-context/annotation/closed-annotation.js +4 -5
  12. package/annotation-context/annotation/closed-annotation.js.map +1 -1
  13. package/annotation-context/annotation/open-annotation.js +2 -3
  14. package/annotation-context/annotation/open-annotation.js.map +1 -1
  15. package/annotation-context/context.js +7 -7
  16. package/annotation-context/context.js.map +1 -1
  17. package/annotation-context/index.js +62 -69
  18. package/annotation-context/index.js.map +1 -1
  19. package/app-layout/content-wrapper/index.js +2 -3
  20. package/app-layout/content-wrapper/index.js.map +1 -1
  21. package/app-layout/defaults.js +13 -14
  22. package/app-layout/defaults.js.map +1 -1
  23. package/app-layout/drawer.js +16 -18
  24. package/app-layout/drawer.js.map +1 -1
  25. package/app-layout/index.js +111 -113
  26. package/app-layout/index.js.map +1 -1
  27. package/app-layout/mobile-toolbar/index.js +7 -9
  28. package/app-layout/mobile-toolbar/index.js.map +1 -1
  29. package/app-layout/navigation-panel.js +5 -8
  30. package/app-layout/navigation-panel.js.map +1 -1
  31. package/app-layout/notifications/index.js +2 -2
  32. package/app-layout/notifications/index.js.map +1 -1
  33. package/app-layout/toggles/index.js +14 -22
  34. package/app-layout/toggles/index.js.map +1 -1
  35. package/app-layout/tools-and-split-panel.js +6 -9
  36. package/app-layout/tools-and-split-panel.js.map +1 -1
  37. package/app-layout/utils/use-content-height.js +14 -15
  38. package/app-layout/utils/use-content-height.js.map +1 -1
  39. package/app-layout/utils/use-content-width.js +8 -8
  40. package/app-layout/utils/use-content-width.js.map +1 -1
  41. package/app-layout/utils/use-focus-control.js +7 -8
  42. package/app-layout/utils/use-focus-control.js.map +1 -1
  43. package/app-layout/utils/use-observed-element.js +3 -3
  44. package/app-layout/utils/use-observed-element.js.map +1 -1
  45. package/app-layout/utils/use-window-width.js +4 -4
  46. package/app-layout/utils/use-window-width.js.map +1 -1
  47. package/app-layout/visual-refresh/app-bar.js +19 -20
  48. package/app-layout/visual-refresh/app-bar.js.map +1 -1
  49. package/app-layout/visual-refresh/background.js +9 -10
  50. package/app-layout/visual-refresh/background.js.map +1 -1
  51. package/app-layout/visual-refresh/context.js +101 -59
  52. package/app-layout/visual-refresh/context.js.map +1 -1
  53. package/app-layout/visual-refresh/header.js +6 -7
  54. package/app-layout/visual-refresh/header.js.map +1 -1
  55. package/app-layout/visual-refresh/index.js +3 -4
  56. package/app-layout/visual-refresh/index.js.map +1 -1
  57. package/app-layout/visual-refresh/layout.js +18 -21
  58. package/app-layout/visual-refresh/layout.js.map +1 -1
  59. package/app-layout/visual-refresh/main.js +17 -18
  60. package/app-layout/visual-refresh/main.js.map +1 -1
  61. package/app-layout/visual-refresh/navigation.js +22 -24
  62. package/app-layout/visual-refresh/navigation.js.map +1 -1
  63. package/app-layout/visual-refresh/notifications.js +6 -7
  64. package/app-layout/visual-refresh/notifications.js.map +1 -1
  65. package/app-layout/visual-refresh/split-panel.js +36 -43
  66. package/app-layout/visual-refresh/split-panel.js.map +1 -1
  67. package/app-layout/visual-refresh/tools.js +32 -34
  68. package/app-layout/visual-refresh/tools.js.map +1 -1
  69. package/app-layout/visual-refresh/trigger-button.js +5 -8
  70. package/app-layout/visual-refresh/trigger-button.js.map +1 -1
  71. package/area-chart/chart-container.js +18 -19
  72. package/area-chart/chart-container.js.map +1 -1
  73. package/area-chart/elements/area-chart-filter.js +7 -8
  74. package/area-chart/elements/area-chart-filter.js.map +1 -1
  75. package/area-chart/elements/area-chart-legend.js +6 -9
  76. package/area-chart/elements/area-chart-legend.js.map +1 -1
  77. package/area-chart/elements/area-series.js +12 -13
  78. package/area-chart/elements/area-series.js.map +1 -1
  79. package/area-chart/elements/chart-popover.js +4 -6
  80. package/area-chart/elements/chart-popover.js.map +1 -1
  81. package/area-chart/elements/data-series.js +14 -17
  82. package/area-chart/elements/data-series.js.map +1 -1
  83. package/area-chart/elements/highlighted-point.js +6 -7
  84. package/area-chart/elements/highlighted-point.js.map +1 -1
  85. package/area-chart/elements/threshold-series.js +5 -7
  86. package/area-chart/elements/threshold-series.js.map +1 -1
  87. package/area-chart/elements/use-highlight-details.js +28 -30
  88. package/area-chart/elements/use-highlight-details.js.map +1 -1
  89. package/area-chart/elements/vertical-marker.js +6 -7
  90. package/area-chart/elements/vertical-marker.js.map +1 -1
  91. package/area-chart/index.js +4 -4
  92. package/area-chart/index.js.map +1 -1
  93. package/area-chart/internal.js +40 -41
  94. package/area-chart/internal.js.map +1 -1
  95. package/area-chart/model/async-store.js +23 -30
  96. package/area-chart/model/async-store.js.map +1 -1
  97. package/area-chart/model/compute-chart-props.js +11 -12
  98. package/area-chart/model/compute-chart-props.js.map +1 -1
  99. package/area-chart/model/create-series-decorator.js +11 -13
  100. package/area-chart/model/create-series-decorator.js.map +1 -1
  101. package/area-chart/model/interactions-store.js +47 -54
  102. package/area-chart/model/interactions-store.js.map +1 -1
  103. package/area-chart/model/use-chart-model.js +85 -89
  104. package/area-chart/model/use-chart-model.js.map +1 -1
  105. package/area-chart/model/use-filter-props.js +6 -6
  106. package/area-chart/model/use-filter-props.js.map +1 -1
  107. package/area-chart/model/use-highlight-props.js +6 -6
  108. package/area-chart/model/use-highlight-props.js.map +1 -1
  109. package/area-chart/model/utils.js +46 -59
  110. package/area-chart/model/utils.js.map +1 -1
  111. package/attribute-editor/additional-info.js +2 -5
  112. package/attribute-editor/additional-info.js.map +1 -1
  113. package/attribute-editor/index.js +5 -5
  114. package/attribute-editor/index.js.map +1 -1
  115. package/attribute-editor/internal.js +20 -20
  116. package/attribute-editor/internal.js.map +1 -1
  117. package/attribute-editor/row.js +17 -25
  118. package/attribute-editor/row.js.map +1 -1
  119. package/autosuggest/autosuggest-option.js +12 -12
  120. package/autosuggest/autosuggest-option.js.map +1 -1
  121. package/autosuggest/index.js +6 -6
  122. package/autosuggest/index.js.map +1 -1
  123. package/autosuggest/internal.js +39 -39
  124. package/autosuggest/internal.js.map +1 -1
  125. package/autosuggest/load-more-controller.js +10 -14
  126. package/autosuggest/load-more-controller.js.map +1 -1
  127. package/autosuggest/options-controller.js +31 -32
  128. package/autosuggest/options-controller.js.map +1 -1
  129. package/autosuggest/options-list.js +12 -13
  130. package/autosuggest/options-list.js.map +1 -1
  131. package/autosuggest/plain-list.js +15 -17
  132. package/autosuggest/plain-list.js.map +1 -1
  133. package/autosuggest/utils/utils.js +12 -12
  134. package/autosuggest/utils/utils.js.map +1 -1
  135. package/autosuggest/virtual-list.js +14 -16
  136. package/autosuggest/virtual-list.js.map +1 -1
  137. package/badge/index.js +6 -6
  138. package/badge/index.js.map +1 -1
  139. package/bar-chart/index.js +6 -6
  140. package/bar-chart/index.js.map +1 -1
  141. package/box/index.js +4 -4
  142. package/box/index.js.map +1 -1
  143. package/box/internal.js +12 -12
  144. package/box/internal.js.map +1 -1
  145. package/breadcrumb-group/index.js +4 -4
  146. package/breadcrumb-group/index.js.map +1 -1
  147. package/breadcrumb-group/internal.js +24 -25
  148. package/breadcrumb-group/internal.js.map +1 -1
  149. package/breadcrumb-group/item/item.js +32 -34
  150. package/breadcrumb-group/item/item.js.map +1 -1
  151. package/button/icon-helper.js +6 -6
  152. package/button/icon-helper.js.map +1 -1
  153. package/button/index.js +6 -6
  154. package/button/index.js.map +1 -1
  155. package/button/internal.js +32 -33
  156. package/button/internal.js.map +1 -1
  157. package/button-dropdown/category-elements/category-element.js +3 -5
  158. package/button-dropdown/category-elements/category-element.js.map +1 -1
  159. package/button-dropdown/category-elements/expandable-category-element.js +23 -26
  160. package/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
  161. package/button-dropdown/category-elements/mobile-expandable-category-element.js +27 -30
  162. package/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
  163. package/button-dropdown/index.js +6 -6
  164. package/button-dropdown/index.js.map +1 -1
  165. package/button-dropdown/internal.js +28 -29
  166. package/button-dropdown/internal.js.map +1 -1
  167. package/button-dropdown/item-element/index.js +30 -36
  168. package/button-dropdown/item-element/index.js.map +1 -1
  169. package/button-dropdown/items-list.js +3 -4
  170. package/button-dropdown/items-list.js.map +1 -1
  171. package/button-dropdown/mobile-expandable-group/mobile-expandable-group.js +2 -4
  172. package/button-dropdown/mobile-expandable-group/mobile-expandable-group.js.map +1 -1
  173. package/button-dropdown/tooltip.js +22 -24
  174. package/button-dropdown/tooltip.js.map +1 -1
  175. package/button-dropdown/utils/create-items-tree.js +21 -23
  176. package/button-dropdown/utils/create-items-tree.js.map +1 -1
  177. package/button-dropdown/utils/menu-item.js +6 -9
  178. package/button-dropdown/utils/menu-item.js.map +1 -1
  179. package/button-dropdown/utils/move-highlight.js +3 -4
  180. package/button-dropdown/utils/move-highlight.js.map +1 -1
  181. package/button-dropdown/utils/use-button-dropdown.js +31 -33
  182. package/button-dropdown/utils/use-button-dropdown.js.map +1 -1
  183. package/button-dropdown/utils/use-hidden-description.js +3 -3
  184. package/button-dropdown/utils/use-hidden-description.js.map +1 -1
  185. package/button-dropdown/utils/use-highlighted-menu.js +40 -42
  186. package/button-dropdown/utils/use-highlighted-menu.js.map +1 -1
  187. package/button-dropdown/utils/utils.js +5 -9
  188. package/button-dropdown/utils/utils.js.map +1 -1
  189. package/calendar/grid/index.js +25 -28
  190. package/calendar/grid/index.js.map +1 -1
  191. package/calendar/header/header-button.js +4 -6
  192. package/calendar/header/header-button.js.map +1 -1
  193. package/calendar/header/index.js +1 -2
  194. package/calendar/header/index.js.map +1 -1
  195. package/calendar/index.js +4 -4
  196. package/calendar/index.js.map +1 -1
  197. package/calendar/internal.js +27 -27
  198. package/calendar/internal.js.map +1 -1
  199. package/calendar/utils/intl.js +12 -13
  200. package/calendar/utils/intl.js.map +1 -1
  201. package/calendar/utils/navigation.js +3 -3
  202. package/calendar/utils/navigation.js.map +1 -1
  203. package/cards/cards-layout-helper.js +12 -12
  204. package/cards/cards-layout-helper.js.map +1 -1
  205. package/cards/index.js +53 -63
  206. package/cards/index.js.map +1 -1
  207. package/checkbox/index.js +4 -4
  208. package/checkbox/index.js.map +1 -1
  209. package/checkbox/internal.d.ts +1 -0
  210. package/checkbox/internal.d.ts.map +1 -1
  211. package/checkbox/internal.js +9 -9
  212. package/checkbox/internal.js.map +1 -1
  213. package/code-editor/ace-modes.js +1 -1
  214. package/code-editor/ace-modes.js.map +1 -1
  215. package/code-editor/ace-themes.js +2 -2
  216. package/code-editor/ace-themes.js.map +1 -1
  217. package/code-editor/error-screen.js +3 -4
  218. package/code-editor/error-screen.js.map +1 -1
  219. package/code-editor/index.js +61 -65
  220. package/code-editor/index.js.map +1 -1
  221. package/code-editor/listeners.js +5 -5
  222. package/code-editor/listeners.js.map +1 -1
  223. package/code-editor/loading-screen.js +2 -2
  224. package/code-editor/loading-screen.js.map +1 -1
  225. package/code-editor/pane.js +21 -25
  226. package/code-editor/pane.js.map +1 -1
  227. package/code-editor/preferences-modal.js +12 -13
  228. package/code-editor/preferences-modal.js.map +1 -1
  229. package/code-editor/resizable-box/index.js +14 -15
  230. package/code-editor/resizable-box/index.js.map +1 -1
  231. package/code-editor/setup-editor.js +20 -20
  232. package/code-editor/setup-editor.js.map +1 -1
  233. package/code-editor/status-bar.js +19 -22
  234. package/code-editor/status-bar.js.map +1 -1
  235. package/code-editor/tab-button.js +7 -10
  236. package/code-editor/tab-button.js.map +1 -1
  237. package/code-editor/util.js +6 -6
  238. package/code-editor/util.js.map +1 -1
  239. package/collection-preferences/index.js +21 -23
  240. package/collection-preferences/index.js.map +1 -1
  241. package/collection-preferences/utils.js +25 -57
  242. package/collection-preferences/utils.js.map +1 -1
  243. package/collection-preferences/visible-content.js +23 -27
  244. package/collection-preferences/visible-content.js.map +1 -1
  245. package/column-layout/index.js +6 -6
  246. package/column-layout/index.js.map +1 -1
  247. package/column-layout/internal.js +20 -21
  248. package/column-layout/internal.js.map +1 -1
  249. package/column-layout/util.js +2 -2
  250. package/column-layout/util.js.map +1 -1
  251. package/container/index.js +5 -5
  252. package/container/index.js.map +1 -1
  253. package/container/internal.js +30 -31
  254. package/container/internal.js.map +1 -1
  255. package/container/use-sticky-header.js +25 -25
  256. package/container/use-sticky-header.js.map +1 -1
  257. package/content-layout/index.js +2 -3
  258. package/content-layout/index.js.map +1 -1
  259. package/content-layout/internal.js +15 -16
  260. package/content-layout/internal.js.map +1 -1
  261. package/date-input/index.js +3 -4
  262. package/date-input/index.js.map +1 -1
  263. package/date-input/interfaces.d.ts +4 -0
  264. package/date-input/interfaces.d.ts.map +1 -1
  265. package/date-input/interfaces.js.map +1 -1
  266. package/date-input/internal.js +8 -8
  267. package/date-input/internal.js.map +1 -1
  268. package/date-picker/index.js +28 -28
  269. package/date-picker/index.js.map +1 -1
  270. package/date-range-picker/calendar/grids/grid.js +54 -57
  271. package/date-range-picker/calendar/grids/grid.js.map +1 -1
  272. package/date-range-picker/calendar/grids/index.js +27 -28
  273. package/date-range-picker/calendar/grids/index.js.map +1 -1
  274. package/date-range-picker/calendar/header/header-button.js +4 -6
  275. package/date-range-picker/calendar/header/header-button.js.map +1 -1
  276. package/date-range-picker/calendar/header/index.js +6 -7
  277. package/date-range-picker/calendar/header/index.js.map +1 -1
  278. package/date-range-picker/calendar/index.js +40 -45
  279. package/date-range-picker/calendar/index.js.map +1 -1
  280. package/date-range-picker/calendar/range-inputs.js +5 -6
  281. package/date-range-picker/calendar/range-inputs.js.map +1 -1
  282. package/date-range-picker/calendar/utils.js +2 -2
  283. package/date-range-picker/calendar/utils.js.map +1 -1
  284. package/date-range-picker/dropdown.js +29 -34
  285. package/date-range-picker/dropdown.js.map +1 -1
  286. package/date-range-picker/index.js +40 -43
  287. package/date-range-picker/index.js.map +1 -1
  288. package/date-range-picker/mode-switcher.js +2 -3
  289. package/date-range-picker/mode-switcher.js.map +1 -1
  290. package/date-range-picker/relative-range/index.js +36 -40
  291. package/date-range-picker/relative-range/index.js.map +1 -1
  292. package/date-range-picker/time-offset.js +5 -5
  293. package/date-range-picker/time-offset.js.map +1 -1
  294. package/date-range-picker/utils.js +4 -5
  295. package/date-range-picker/utils.js.map +1 -1
  296. package/expandable-section/expandable-section-container.js +5 -5
  297. package/expandable-section/expandable-section-container.js.map +1 -1
  298. package/expandable-section/expandable-section-header.js +18 -23
  299. package/expandable-section/expandable-section-header.js.map +1 -1
  300. package/expandable-section/index.js +4 -4
  301. package/expandable-section/index.js.map +1 -1
  302. package/expandable-section/internal.js +22 -22
  303. package/expandable-section/internal.js.map +1 -1
  304. package/flashbar/collapsible-flashbar.js +103 -118
  305. package/flashbar/collapsible-flashbar.js.map +1 -1
  306. package/flashbar/common.js +26 -35
  307. package/flashbar/common.js.map +1 -1
  308. package/flashbar/constant.js +1 -1
  309. package/flashbar/constant.js.map +1 -1
  310. package/flashbar/flash.js +23 -26
  311. package/flashbar/flash.js.map +1 -1
  312. package/flashbar/index.js +3 -4
  313. package/flashbar/index.js.map +1 -1
  314. package/flashbar/internal/analytics.js +12 -12
  315. package/flashbar/internal/analytics.js.map +1 -1
  316. package/flashbar/non-collapsible-flashbar.js +10 -10
  317. package/flashbar/non-collapsible-flashbar.js.map +1 -1
  318. package/flashbar/utils.js +25 -27
  319. package/flashbar/utils.js.map +1 -1
  320. package/form/index.js +4 -4
  321. package/form/index.js.map +1 -1
  322. package/form/internal.js +5 -6
  323. package/form/internal.js.map +1 -1
  324. package/form-field/index.js +4 -4
  325. package/form-field/index.js.map +1 -1
  326. package/form-field/internal.js +20 -23
  327. package/form-field/internal.js.map +1 -1
  328. package/form-field/util.js +9 -10
  329. package/form-field/util.js.map +1 -1
  330. package/grid/index.js +6 -6
  331. package/grid/index.js.map +1 -1
  332. package/grid/internal.js +14 -15
  333. package/grid/internal.js.map +1 -1
  334. package/header/index.js +4 -4
  335. package/header/index.js.map +1 -1
  336. package/header/internal.js +15 -15
  337. package/header/internal.js.map +1 -1
  338. package/help-panel/index.js +7 -7
  339. package/help-panel/index.js.map +1 -1
  340. package/hotspot/index.js +12 -12
  341. package/hotspot/index.js.map +1 -1
  342. package/icon/index.js +4 -4
  343. package/icon/index.js.map +1 -1
  344. package/icon/internal.js +18 -18
  345. package/icon/internal.js.map +1 -1
  346. package/input/index.js +36 -17
  347. package/input/index.js.map +1 -1
  348. package/input/internal.js +30 -25
  349. package/input/internal.js.map +1 -1
  350. package/input/utils.js +4 -5
  351. package/input/utils.js.map +1 -1
  352. package/internal/animate.js +27 -32
  353. package/internal/animate.js.map +1 -1
  354. package/internal/base-component/index.js +2 -2
  355. package/internal/base-component/index.js.map +1 -1
  356. package/internal/breakpoints.js +7 -12
  357. package/internal/breakpoints.js.map +1 -1
  358. package/internal/components/abstract-switch/index.d.ts +2 -1
  359. package/internal/components/abstract-switch/index.d.ts.map +1 -1
  360. package/internal/components/abstract-switch/index.js +19 -19
  361. package/internal/components/abstract-switch/index.js.map +1 -1
  362. package/internal/components/abstract-switch/styles.css.js +13 -12
  363. package/internal/components/abstract-switch/styles.scoped.css +21 -21
  364. package/internal/components/abstract-switch/styles.selectors.js +13 -12
  365. package/internal/components/autosuggest-input/index.js +38 -38
  366. package/internal/components/autosuggest-input/index.js.map +1 -1
  367. package/internal/components/button-trigger/index.js +7 -7
  368. package/internal/components/button-trigger/index.js.map +1 -1
  369. package/internal/components/cartesian-chart/axis-label.js +1 -2
  370. package/internal/components/cartesian-chart/axis-label.js.map +1 -1
  371. package/internal/components/cartesian-chart/bottom-labels.js +20 -26
  372. package/internal/components/cartesian-chart/bottom-labels.js.map +1 -1
  373. package/internal/components/cartesian-chart/constants.js +5 -5
  374. package/internal/components/cartesian-chart/constants.js.map +1 -1
  375. package/internal/components/cartesian-chart/emphasized-baseline.js +4 -5
  376. package/internal/components/cartesian-chart/emphasized-baseline.js.map +1 -1
  377. package/internal/components/cartesian-chart/highlighted-point.js +1 -2
  378. package/internal/components/cartesian-chart/highlighted-point.js.map +1 -1
  379. package/internal/components/cartesian-chart/label-utils.js +20 -24
  380. package/internal/components/cartesian-chart/label-utils.js.map +1 -1
  381. package/internal/components/cartesian-chart/labels-measure.js +6 -7
  382. package/internal/components/cartesian-chart/labels-measure.js.map +1 -1
  383. package/internal/components/cartesian-chart/left-labels.js +13 -17
  384. package/internal/components/cartesian-chart/left-labels.js.map +1 -1
  385. package/internal/components/cartesian-chart/scales.js +21 -26
  386. package/internal/components/cartesian-chart/scales.js.map +1 -1
  387. package/internal/components/cartesian-chart/ticks.js +9 -10
  388. package/internal/components/cartesian-chart/ticks.js.map +1 -1
  389. package/internal/components/cartesian-chart/vertical-grid-lines.js +3 -4
  390. package/internal/components/cartesian-chart/vertical-grid-lines.js.map +1 -1
  391. package/internal/components/cartesian-chart/vertical-marker.js +3 -4
  392. package/internal/components/cartesian-chart/vertical-marker.js.map +1 -1
  393. package/internal/components/chart-filter/index.js +13 -14
  394. package/internal/components/chart-filter/index.js.map +1 -1
  395. package/internal/components/chart-legend/index.js +26 -29
  396. package/internal/components/chart-legend/index.js.map +1 -1
  397. package/internal/components/chart-plot/application-controller.js +21 -25
  398. package/internal/components/chart-plot/application-controller.js.map +1 -1
  399. package/internal/components/chart-plot/focus-outline.js +7 -8
  400. package/internal/components/chart-plot/focus-outline.js.map +1 -1
  401. package/internal/components/chart-plot/index.js +33 -34
  402. package/internal/components/chart-plot/index.js.map +1 -1
  403. package/internal/components/chart-popover/index.js +11 -12
  404. package/internal/components/chart-popover/index.js.map +1 -1
  405. package/internal/components/chart-series-details/index.js +13 -17
  406. package/internal/components/chart-series-details/index.js.map +1 -1
  407. package/internal/components/chart-series-marker/index.js +2 -3
  408. package/internal/components/chart-series-marker/index.js.map +1 -1
  409. package/internal/components/chart-status-container/index.js +8 -10
  410. package/internal/components/chart-status-container/index.js.map +1 -1
  411. package/internal/components/checkbox-icon/index.js +18 -19
  412. package/internal/components/checkbox-icon/index.js.map +1 -1
  413. package/internal/components/dark-ribbon/index.js +13 -14
  414. package/internal/components/dark-ribbon/index.js.map +1 -1
  415. package/internal/components/dropdown/context.js +4 -5
  416. package/internal/components/dropdown/context.js.map +1 -1
  417. package/internal/components/dropdown/dropdown-fit-handler.js +74 -81
  418. package/internal/components/dropdown/dropdown-fit-handler.js.map +1 -1
  419. package/internal/components/dropdown/index.js +57 -65
  420. package/internal/components/dropdown/index.js.map +1 -1
  421. package/internal/components/dropdown-footer/index.js +2 -6
  422. package/internal/components/dropdown-footer/index.js.map +1 -1
  423. package/internal/components/dropdown-status/index.js +5 -7
  424. package/internal/components/dropdown-status/index.js.map +1 -1
  425. package/internal/components/filtering-token/index.js +4 -6
  426. package/internal/components/filtering-token/index.js.map +1 -1
  427. package/internal/components/focus-lock/index.js +10 -11
  428. package/internal/components/focus-lock/index.js.map +1 -1
  429. package/internal/components/focus-lock/utils.js +4 -4
  430. package/internal/components/focus-lock/utils.js.map +1 -1
  431. package/internal/components/live-region/index.js +10 -10
  432. package/internal/components/live-region/index.js.map +1 -1
  433. package/internal/components/masked-input/index.js +22 -24
  434. package/internal/components/masked-input/index.js.map +1 -1
  435. package/internal/components/masked-input/keyboard-handler.js +18 -18
  436. package/internal/components/masked-input/keyboard-handler.js.map +1 -1
  437. package/internal/components/masked-input/use-mask.js +24 -28
  438. package/internal/components/masked-input/use-mask.js.map +1 -1
  439. package/internal/components/masked-input/utils/keys.js +4 -6
  440. package/internal/components/masked-input/utils/keys.js.map +1 -1
  441. package/internal/components/masked-input/utils/mask-format.js +103 -113
  442. package/internal/components/masked-input/utils/mask-format.js.map +1 -1
  443. package/internal/components/masked-input/utils/strings.js +1 -4
  444. package/internal/components/masked-input/utils/strings.js.map +1 -1
  445. package/internal/components/menu-dropdown/index.js +10 -12
  446. package/internal/components/menu-dropdown/index.js.map +1 -1
  447. package/internal/components/option/highlight-match.js +14 -18
  448. package/internal/components/option/highlight-match.js.map +1 -1
  449. package/internal/components/option/index.js +13 -13
  450. package/internal/components/option/index.js.map +1 -1
  451. package/internal/components/option/option-announcer.js +1 -1
  452. package/internal/components/option/option-announcer.js.map +1 -1
  453. package/internal/components/option/option-parts.js +28 -45
  454. package/internal/components/option/option-parts.js.map +1 -1
  455. package/internal/components/option/utils/filter-options.js +16 -19
  456. package/internal/components/option/utils/filter-options.js.map +1 -1
  457. package/internal/components/option/utils/flatten-options.js +15 -15
  458. package/internal/components/option/utils/flatten-options.js.map +1 -1
  459. package/internal/components/option/utils/prepare-options.js +3 -3
  460. package/internal/components/option/utils/prepare-options.js.map +1 -1
  461. package/internal/components/options-list/index.js +19 -20
  462. package/internal/components/options-list/index.js.map +1 -1
  463. package/internal/components/options-list/utils/test-indexes.js +11 -11
  464. package/internal/components/options-list/utils/test-indexes.js.map +1 -1
  465. package/internal/components/options-list/utils/use-highlight-option.js +17 -21
  466. package/internal/components/options-list/utils/use-highlight-option.js.map +1 -1
  467. package/internal/components/options-list/utils/use-ids.js +2 -2
  468. package/internal/components/options-list/utils/use-ids.js.map +1 -1
  469. package/internal/components/options-list/utils/use-keyboard.js +6 -8
  470. package/internal/components/options-list/utils/use-keyboard.js.map +1 -1
  471. package/internal/components/options-list/utils/use-open-state.js +6 -7
  472. package/internal/components/options-list/utils/use-open-state.js.map +1 -1
  473. package/internal/components/portal/index.js +5 -6
  474. package/internal/components/portal/index.js.map +1 -1
  475. package/internal/components/screenreader-only/index.js +1 -2
  476. package/internal/components/screenreader-only/index.js.map +1 -1
  477. package/internal/components/selectable-item/index.js +25 -26
  478. package/internal/components/selectable-item/index.js.map +1 -1
  479. package/internal/components/tab-trap/index.js +1 -2
  480. package/internal/components/tab-trap/index.js.map +1 -1
  481. package/internal/components/transition/index.js +16 -16
  482. package/internal/components/transition/index.js.map +1 -1
  483. package/internal/components/visual-context/index.js +6 -7
  484. package/internal/components/visual-context/index.js.map +1 -1
  485. package/internal/context/app-layout-context.js +2 -2
  486. package/internal/context/app-layout-context.js.map +1 -1
  487. package/internal/context/form-field-context.js +4 -4
  488. package/internal/context/form-field-context.js.map +1 -1
  489. package/internal/context/split-panel-context.js +3 -3
  490. package/internal/context/split-panel-context.js.map +1 -1
  491. package/internal/debounce.js +6 -11
  492. package/internal/debounce.js.map +1 -1
  493. package/internal/environment.js +1 -1
  494. package/internal/events/index.js +12 -16
  495. package/internal/events/index.js.map +1 -1
  496. package/internal/focus-tracker.js +22 -27
  497. package/internal/focus-tracker.js.map +1 -1
  498. package/internal/generated/custom-css-properties/index.js +2 -2
  499. package/internal/generated/custom-css-properties/index.js.map +1 -1
  500. package/internal/hooks/check-controlled/index.js +1 -1
  501. package/internal/hooks/check-controlled/index.js.map +1 -1
  502. package/internal/hooks/container-queries/use-container-breakpoints.js +2 -2
  503. package/internal/hooks/container-queries/use-container-breakpoints.js.map +1 -1
  504. package/internal/hooks/container-queries/use-container-query.js +5 -6
  505. package/internal/hooks/container-queries/use-container-query.js.map +1 -1
  506. package/internal/hooks/container-queries/use-resize-observer.js +13 -13
  507. package/internal/hooks/container-queries/use-resize-observer.js.map +1 -1
  508. package/internal/hooks/focus-visible/index.js +8 -8
  509. package/internal/hooks/focus-visible/index.js.map +1 -1
  510. package/internal/hooks/forward-focus/index.js +5 -9
  511. package/internal/hooks/forward-focus/index.js.map +1 -1
  512. package/internal/hooks/forward-focus/radio-group.js +7 -7
  513. package/internal/hooks/forward-focus/radio-group.js.map +1 -1
  514. package/internal/hooks/use-base-component/component-metadata.js +5 -5
  515. package/internal/hooks/use-base-component/component-metadata.js.map +1 -1
  516. package/internal/hooks/use-base-component/index.js +1 -1
  517. package/internal/hooks/use-base-component/index.js.map +1 -1
  518. package/internal/hooks/use-controllable/index.js +16 -17
  519. package/internal/hooks/use-controllable/index.js.map +1 -1
  520. package/internal/hooks/use-date-cache/index.js +2 -2
  521. package/internal/hooks/use-date-cache/index.js.map +1 -1
  522. package/internal/hooks/use-debounce-callback/index.js +3 -7
  523. package/internal/hooks/use-debounce-callback/index.js.map +1 -1
  524. package/internal/hooks/use-dynamic-overlap/index.js +4 -4
  525. package/internal/hooks/use-dynamic-overlap/index.js.map +1 -1
  526. package/internal/hooks/use-effect-on-update.js +2 -2
  527. package/internal/hooks/use-effect-on-update.js.map +1 -1
  528. package/internal/hooks/use-focus-tracker.js +7 -8
  529. package/internal/hooks/use-focus-tracker.js.map +1 -1
  530. package/internal/hooks/use-has-rendered/index.js +6 -6
  531. package/internal/hooks/use-has-rendered/index.js.map +1 -1
  532. package/internal/hooks/use-merge-refs/index.js +5 -9
  533. package/internal/hooks/use-merge-refs/index.js.map +1 -1
  534. package/internal/hooks/use-mobile/index.js +7 -7
  535. package/internal/hooks/use-mobile/index.js.map +1 -1
  536. package/internal/hooks/use-mouse-down-target.js +5 -5
  537. package/internal/hooks/use-mouse-down-target.js.map +1 -1
  538. package/internal/hooks/use-mutation-observer/index.js +5 -5
  539. package/internal/hooks/use-mutation-observer/index.js.map +1 -1
  540. package/internal/hooks/use-portal-mode-classes/index.js +10 -12
  541. package/internal/hooks/use-portal-mode-classes/index.js.map +1 -1
  542. package/internal/hooks/use-previous/index.js +3 -3
  543. package/internal/hooks/use-previous/index.js.map +1 -1
  544. package/internal/hooks/use-scroll-sync/index.js +8 -9
  545. package/internal/hooks/use-scroll-sync/index.js.map +1 -1
  546. package/internal/hooks/use-singleton-handler/index.js +12 -14
  547. package/internal/hooks/use-singleton-handler/index.js.map +1 -1
  548. package/internal/hooks/use-stable-event-handler/index.js +3 -10
  549. package/internal/hooks/use-stable-event-handler/index.js.map +1 -1
  550. package/internal/hooks/use-telemetry/index.js +2 -2
  551. package/internal/hooks/use-telemetry/index.js.map +1 -1
  552. package/internal/hooks/use-telemetry/telemetry.js +3 -4
  553. package/internal/hooks/use-telemetry/telemetry.js.map +1 -1
  554. package/internal/hooks/use-unique-id/index.js +3 -3
  555. package/internal/hooks/use-unique-id/index.js.map +1 -1
  556. package/internal/hooks/use-visual-mode/index.js +11 -11
  557. package/internal/hooks/use-visual-mode/index.js.map +1 -1
  558. package/internal/is-development.js +1 -1
  559. package/internal/is-development.js.map +1 -1
  560. package/internal/logging.js +2 -2
  561. package/internal/logging.js.map +1 -1
  562. package/internal/manifest.json +1 -1
  563. package/internal/metrics/log-clients.js +18 -27
  564. package/internal/metrics/log-clients.js.map +1 -1
  565. package/internal/metrics/metrics-formatters.js +11 -14
  566. package/internal/metrics/metrics-formatters.js.map +1 -1
  567. package/internal/metrics/metrics.js +27 -33
  568. package/internal/metrics/metrics.js.map +1 -1
  569. package/internal/motion.js +2 -2
  570. package/internal/motion.js.map +1 -1
  571. package/internal/styles/colors.js +1 -1
  572. package/internal/styles/colors.js.map +1 -1
  573. package/internal/utils/browser-scrollbar-size.js +5 -5
  574. package/internal/utils/browser-scrollbar-size.js.map +1 -1
  575. package/internal/utils/calculate-once.js +2 -2
  576. package/internal/utils/calculate-once.js.map +1 -1
  577. package/internal/utils/check-safe-url.js +4 -4
  578. package/internal/utils/check-safe-url.js.map +1 -1
  579. package/internal/utils/create-category-color-scale.js +6 -9
  580. package/internal/utils/create-category-color-scale.js.map +1 -1
  581. package/internal/utils/date-time/format-date-range.js +3 -3
  582. package/internal/utils/date-time/format-date-range.js.map +1 -1
  583. package/internal/utils/date-time/format-date.js +4 -4
  584. package/internal/utils/date-time/format-date.js.map +1 -1
  585. package/internal/utils/date-time/format-time.js +5 -5
  586. package/internal/utils/date-time/format-time.js.map +1 -1
  587. package/internal/utils/date-time/format-timezone-offset.js +4 -4
  588. package/internal/utils/date-time/format-timezone-offset.js.map +1 -1
  589. package/internal/utils/date-time/is-iso-date-only.js +1 -1
  590. package/internal/utils/date-time/is-iso-date-only.js.map +1 -1
  591. package/internal/utils/date-time/join-date-time.js +3 -3
  592. package/internal/utils/date-time/join-date-time.js.map +1 -1
  593. package/internal/utils/date-time/parse-date.js +5 -6
  594. package/internal/utils/date-time/parse-date.js.map +1 -1
  595. package/internal/utils/date-time/parse-timezone-offset.js +5 -5
  596. package/internal/utils/date-time/parse-timezone-offset.js.map +1 -1
  597. package/internal/utils/date-time/shift-timezone-offset.js +6 -6
  598. package/internal/utils/date-time/shift-timezone-offset.js.map +1 -1
  599. package/internal/utils/dom.js +12 -12
  600. package/internal/utils/dom.js.map +1 -1
  601. package/internal/utils/external-props.js +3 -3
  602. package/internal/utils/external-props.js.map +1 -1
  603. package/internal/utils/focus-svg-element.js +1 -1
  604. package/internal/utils/focus-svg-element.js.map +1 -1
  605. package/internal/utils/locale/merge-locales.js +1 -1
  606. package/internal/utils/locale/merge-locales.js.map +1 -1
  607. package/internal/utils/locale/normalize-locale.js +3 -3
  608. package/internal/utils/locale/normalize-locale.js.map +1 -1
  609. package/internal/utils/promises.js +7 -11
  610. package/internal/utils/promises.js.map +1 -1
  611. package/internal/utils/scrollable-containers.js +14 -18
  612. package/internal/utils/scrollable-containers.js.map +1 -1
  613. package/internal/utils/strings/join-strings.js +1 -5
  614. package/internal/utils/strings/join-strings.js.map +1 -1
  615. package/internal/utils/strings/pad-left-zeros.js +1 -1
  616. package/internal/utils/strings/pad-left-zeros.js.map +1 -1
  617. package/internal/utils/throttle.js +10 -15
  618. package/internal/utils/throttle.js.map +1 -1
  619. package/internal/utils/use-container-width.js +3 -5
  620. package/internal/utils/use-container-width.js.map +1 -1
  621. package/line-chart/index.js +6 -6
  622. package/line-chart/index.js.map +1 -1
  623. package/link/index.js +5 -5
  624. package/link/index.js.map +1 -1
  625. package/link/internal.js +25 -25
  626. package/link/internal.js.map +1 -1
  627. package/mixed-line-bar-chart/bar-groups.js +3 -4
  628. package/mixed-line-bar-chart/bar-groups.js.map +1 -1
  629. package/mixed-line-bar-chart/bar-series.js +24 -33
  630. package/mixed-line-bar-chart/bar-series.js.map +1 -1
  631. package/mixed-line-bar-chart/chart-container.js +123 -138
  632. package/mixed-line-bar-chart/chart-container.js.map +1 -1
  633. package/mixed-line-bar-chart/chart-filters.js +10 -17
  634. package/mixed-line-bar-chart/chart-filters.js.map +1 -1
  635. package/mixed-line-bar-chart/chart-legend.js +9 -13
  636. package/mixed-line-bar-chart/chart-legend.js.map +1 -1
  637. package/mixed-line-bar-chart/chart-popover.js +3 -4
  638. package/mixed-line-bar-chart/chart-popover.js.map +1 -1
  639. package/mixed-line-bar-chart/data-series.js +13 -17
  640. package/mixed-line-bar-chart/data-series.js.map +1 -1
  641. package/mixed-line-bar-chart/domain.js +32 -39
  642. package/mixed-line-bar-chart/domain.js.map +1 -1
  643. package/mixed-line-bar-chart/format-highlighted.js +13 -14
  644. package/mixed-line-bar-chart/format-highlighted.js.map +1 -1
  645. package/mixed-line-bar-chart/hooks/use-mouse-hover.js +32 -34
  646. package/mixed-line-bar-chart/hooks/use-mouse-hover.js.map +1 -1
  647. package/mixed-line-bar-chart/hooks/use-navigation.js +48 -57
  648. package/mixed-line-bar-chart/hooks/use-navigation.js.map +1 -1
  649. package/mixed-line-bar-chart/hooks/use-popover.js +7 -7
  650. package/mixed-line-bar-chart/hooks/use-popover.js.map +1 -1
  651. package/mixed-line-bar-chart/index.js +4 -4
  652. package/mixed-line-bar-chart/index.js.map +1 -1
  653. package/mixed-line-bar-chart/internal.js +47 -49
  654. package/mixed-line-bar-chart/internal.js.map +1 -1
  655. package/mixed-line-bar-chart/line-series.js +19 -24
  656. package/mixed-line-bar-chart/line-series.js.map +1 -1
  657. package/mixed-line-bar-chart/make-scaled-bar-groups.js +10 -11
  658. package/mixed-line-bar-chart/make-scaled-bar-groups.js.map +1 -1
  659. package/mixed-line-bar-chart/make-scaled-series.js +30 -38
  660. package/mixed-line-bar-chart/make-scaled-series.js.map +1 -1
  661. package/mixed-line-bar-chart/utils.js +18 -21
  662. package/mixed-line-bar-chart/utils.js.map +1 -1
  663. package/modal/body-scroll.js +4 -4
  664. package/modal/body-scroll.js.map +1 -1
  665. package/modal/index.js +4 -4
  666. package/modal/index.js.map +1 -1
  667. package/modal/internal.js +24 -25
  668. package/modal/internal.js.map +1 -1
  669. package/multiselect/index.js +5 -5
  670. package/multiselect/index.js.map +1 -1
  671. package/multiselect/internal.js +81 -88
  672. package/multiselect/internal.js.map +1 -1
  673. package/package.json +1 -1
  674. package/pagination/index.js +2 -3
  675. package/pagination/index.js.map +1 -1
  676. package/pagination/internal.js +16 -17
  677. package/pagination/internal.js.map +1 -1
  678. package/pagination/utils.js +12 -12
  679. package/pagination/utils.js.map +1 -1
  680. package/pie-chart/index.js +38 -39
  681. package/pie-chart/index.js.map +1 -1
  682. package/pie-chart/labels.js +38 -42
  683. package/pie-chart/labels.js.map +1 -1
  684. package/pie-chart/pie-chart.js +65 -67
  685. package/pie-chart/pie-chart.js.map +1 -1
  686. package/pie-chart/responsive-text.js +9 -10
  687. package/pie-chart/responsive-text.js.map +1 -1
  688. package/pie-chart/segments.js +27 -31
  689. package/pie-chart/segments.js.map +1 -1
  690. package/pie-chart/utils.js +32 -35
  691. package/pie-chart/utils.js.map +1 -1
  692. package/popover/arrow.js +2 -2
  693. package/popover/arrow.js.map +1 -1
  694. package/popover/body.js +16 -19
  695. package/popover/body.js.map +1 -1
  696. package/popover/container.js +52 -55
  697. package/popover/container.js.map +1 -1
  698. package/popover/index.js +6 -6
  699. package/popover/index.js.map +1 -1
  700. package/popover/internal.js +28 -28
  701. package/popover/internal.js.map +1 -1
  702. package/popover/utils/positions.js +54 -66
  703. package/popover/utils/positions.js.map +1 -1
  704. package/progress-bar/index.js +17 -17
  705. package/progress-bar/index.js.map +1 -1
  706. package/progress-bar/internal.js +12 -16
  707. package/progress-bar/internal.js.map +1 -1
  708. package/property-filter/controller.js +117 -125
  709. package/property-filter/controller.js.map +1 -1
  710. package/property-filter/filter-options.js +8 -11
  711. package/property-filter/filter-options.js.map +1 -1
  712. package/property-filter/index.js +50 -50
  713. package/property-filter/index.js.map +1 -1
  714. package/property-filter/property-editor.js +4 -5
  715. package/property-filter/property-editor.js.map +1 -1
  716. package/property-filter/property-filter-autosuggest.js +39 -39
  717. package/property-filter/property-filter-autosuggest.js.map +1 -1
  718. package/property-filter/token-editor.js +55 -66
  719. package/property-filter/token-editor.js.map +1 -1
  720. package/property-filter/token.js +9 -11
  721. package/property-filter/token.js.map +1 -1
  722. package/property-filter/use-load-items.js +8 -12
  723. package/property-filter/use-load-items.js.map +1 -1
  724. package/property-filter/utils.js +13 -18
  725. package/property-filter/utils.js.map +1 -1
  726. package/radio-group/index.js +3 -4
  727. package/radio-group/index.js.map +1 -1
  728. package/radio-group/internal.js +9 -9
  729. package/radio-group/internal.js.map +1 -1
  730. package/radio-group/radio-button.js +12 -15
  731. package/radio-group/radio-button.js.map +1 -1
  732. package/s3-resource-selector/index.js +29 -29
  733. package/s3-resource-selector/index.js.map +1 -1
  734. package/s3-resource-selector/s3-in-context/index.js +16 -18
  735. package/s3-resource-selector/s3-in-context/index.js.map +1 -1
  736. package/s3-resource-selector/s3-in-context/search-input.js +3 -4
  737. package/s3-resource-selector/s3-in-context/search-input.js.map +1 -1
  738. package/s3-resource-selector/s3-in-context/use-versions-fetch.js +16 -16
  739. package/s3-resource-selector/s3-in-context/use-versions-fetch.js.map +1 -1
  740. package/s3-resource-selector/s3-in-context/validation.js +6 -6
  741. package/s3-resource-selector/s3-in-context/validation.js.map +1 -1
  742. package/s3-resource-selector/s3-modal/basic-table.js +19 -20
  743. package/s3-resource-selector/s3-modal/basic-table.js.map +1 -1
  744. package/s3-resource-selector/s3-modal/buckets-table.js +11 -13
  745. package/s3-resource-selector/s3-modal/buckets-table.js.map +1 -1
  746. package/s3-resource-selector/s3-modal/column-formats.js +5 -5
  747. package/s3-resource-selector/s3-modal/column-formats.js.map +1 -1
  748. package/s3-resource-selector/s3-modal/empty-state.js +1 -2
  749. package/s3-resource-selector/s3-modal/empty-state.js.map +1 -1
  750. package/s3-resource-selector/s3-modal/index.js +37 -43
  751. package/s3-resource-selector/s3-modal/index.js.map +1 -1
  752. package/s3-resource-selector/s3-modal/objects-table.js +12 -14
  753. package/s3-resource-selector/s3-modal/objects-table.js.map +1 -1
  754. package/s3-resource-selector/s3-modal/table-utils.js +9 -12
  755. package/s3-resource-selector/s3-modal/table-utils.js.map +1 -1
  756. package/s3-resource-selector/s3-modal/versions-table.js +10 -12
  757. package/s3-resource-selector/s3-modal/versions-table.js.map +1 -1
  758. package/s3-resource-selector/utils.js +1 -1
  759. package/s3-resource-selector/utils.js.map +1 -1
  760. package/segmented-control/index.js +2 -3
  761. package/segmented-control/index.js.map +1 -1
  762. package/segmented-control/internal-segmented-control.js +16 -17
  763. package/segmented-control/internal-segmented-control.js.map +1 -1
  764. package/segmented-control/internal.js +14 -14
  765. package/segmented-control/internal.js.map +1 -1
  766. package/segmented-control/segment.js +3 -6
  767. package/segmented-control/segment.js.map +1 -1
  768. package/select/index.js +6 -6
  769. package/select/index.js.map +1 -1
  770. package/select/internal.js +58 -58
  771. package/select/internal.js.map +1 -1
  772. package/select/parts/filter.js +4 -4
  773. package/select/parts/filter.js.map +1 -1
  774. package/select/parts/item.js +10 -10
  775. package/select/parts/item.js.map +1 -1
  776. package/select/parts/multiselect-item.js +13 -14
  777. package/select/parts/multiselect-item.js.map +1 -1
  778. package/select/parts/plain-list.js +13 -15
  779. package/select/parts/plain-list.js.map +1 -1
  780. package/select/parts/trigger.js +7 -9
  781. package/select/parts/trigger.js.map +1 -1
  782. package/select/parts/virtual-list.js +27 -33
  783. package/select/parts/virtual-list.js.map +1 -1
  784. package/select/utils/check-option-value-field.js +2 -2
  785. package/select/utils/check-option-value-field.js.map +1 -1
  786. package/select/utils/connect-options.js +6 -7
  787. package/select/utils/connect-options.js.map +1 -1
  788. package/select/utils/get-item-props.js +4 -7
  789. package/select/utils/get-item-props.js.map +1 -1
  790. package/select/utils/render-options.js +13 -15
  791. package/select/utils/render-options.js.map +1 -1
  792. package/select/utils/use-announcement.js +10 -11
  793. package/select/utils/use-announcement.js.map +1 -1
  794. package/select/utils/use-load-items.js +16 -19
  795. package/select/utils/use-load-items.js.map +1 -1
  796. package/select/utils/use-native-search.js +20 -29
  797. package/select/utils/use-native-search.js.map +1 -1
  798. package/select/utils/use-select.js +89 -96
  799. package/select/utils/use-select.js.map +1 -1
  800. package/side-navigation/index.js +10 -10
  801. package/side-navigation/index.js.map +1 -1
  802. package/side-navigation/internal.js +35 -46
  803. package/side-navigation/internal.js.map +1 -1
  804. package/side-navigation/util.js +9 -12
  805. package/side-navigation/util.js.map +1 -1
  806. package/space-between/index.js +4 -4
  807. package/space-between/index.js.map +1 -1
  808. package/space-between/internal.js +7 -7
  809. package/space-between/internal.js.map +1 -1
  810. package/spinner/index.js +4 -4
  811. package/spinner/index.js.map +1 -1
  812. package/spinner/internal.js +4 -4
  813. package/spinner/internal.js.map +1 -1
  814. package/split-panel/bottom.js +22 -25
  815. package/split-panel/bottom.js.map +1 -1
  816. package/split-panel/icons/bottom-icon-refresh.js +11 -13
  817. package/split-panel/icons/bottom-icon-refresh.js.map +1 -1
  818. package/split-panel/icons/bottom-icon.js +1 -1
  819. package/split-panel/icons/bottom-icon.js.map +1 -1
  820. package/split-panel/icons/resize-handler.js +3 -6
  821. package/split-panel/icons/resize-handler.js.map +1 -1
  822. package/split-panel/icons/side-position-refresh.js +12 -14
  823. package/split-panel/icons/side-position-refresh.js.map +1 -1
  824. package/split-panel/icons/side-position.js +1 -1
  825. package/split-panel/icons/side-position.js.map +1 -1
  826. package/split-panel/index.js +65 -65
  827. package/split-panel/index.js.map +1 -1
  828. package/split-panel/preferences-modal.js +9 -9
  829. package/split-panel/preferences-modal.js.map +1 -1
  830. package/split-panel/side.js +12 -15
  831. package/split-panel/side.js.map +1 -1
  832. package/split-panel/utils/size-utils.js +3 -3
  833. package/split-panel/utils/size-utils.js.map +1 -1
  834. package/split-panel/utils/use-keyboard-events.js +13 -17
  835. package/split-panel/utils/use-keyboard-events.js.map +1 -1
  836. package/split-panel/utils/use-pointer-events.js +12 -13
  837. package/split-panel/utils/use-pointer-events.js.map +1 -1
  838. package/status-indicator/index.js +4 -4
  839. package/status-indicator/index.js.map +1 -1
  840. package/status-indicator/internal.js +9 -10
  841. package/status-indicator/internal.js.map +1 -1
  842. package/table/body-cell/click-away.js +9 -10
  843. package/table/body-cell/click-away.js.map +1 -1
  844. package/table/body-cell/index.js +18 -18
  845. package/table/body-cell/index.js.map +1 -1
  846. package/table/body-cell/inline-editor.js +32 -46
  847. package/table/body-cell/inline-editor.js.map +1 -1
  848. package/table/body-cell/td-element.js +2 -4
  849. package/table/body-cell/td-element.js.map +1 -1
  850. package/table/body-cell/use-stable-scroll-position.js +10 -13
  851. package/table/body-cell/use-stable-scroll-position.js.map +1 -1
  852. package/table/header-cell/index.d.ts +4 -2
  853. package/table/header-cell/index.d.ts.map +1 -1
  854. package/table/header-cell/index.js +33 -34
  855. package/table/header-cell/index.js.map +1 -1
  856. package/table/header-cell/utils.js +10 -12
  857. package/table/header-cell/utils.js.map +1 -1
  858. package/table/index.js +5 -5
  859. package/table/index.js.map +1 -1
  860. package/table/internal.d.ts.map +1 -1
  861. package/table/internal.js +94 -118
  862. package/table/internal.js.map +1 -1
  863. package/table/resizer/index.d.ts +5 -1
  864. package/table/resizer/index.d.ts.map +1 -1
  865. package/table/resizer/index.js +40 -39
  866. package/table/resizer/index.js.map +1 -1
  867. package/table/selection-control/index.d.ts +4 -1
  868. package/table/selection-control/index.d.ts.map +1 -1
  869. package/table/selection-control/index.js +11 -11
  870. package/table/selection-control/index.js.map +1 -1
  871. package/table/sticky-header.d.ts +2 -2
  872. package/table/sticky-header.d.ts.map +1 -1
  873. package/table/sticky-header.js +16 -15
  874. package/table/sticky-header.js.map +1 -1
  875. package/table/sticky-scrollbar.js +5 -6
  876. package/table/sticky-scrollbar.js.map +1 -1
  877. package/table/sticky-scrolling.js +10 -10
  878. package/table/sticky-scrolling.js.map +1 -1
  879. package/table/thead.d.ts +11 -3
  880. package/table/thead.d.ts.map +1 -1
  881. package/table/thead.js +13 -13
  882. package/table/thead.js.map +1 -1
  883. package/table/tools-header.js +4 -5
  884. package/table/tools-header.js.map +1 -1
  885. package/table/use-column-widths.js +34 -44
  886. package/table/use-column-widths.js.map +1 -1
  887. package/table/use-row-events.js +10 -11
  888. package/table/use-row-events.js.map +1 -1
  889. package/table/use-selection.js +75 -81
  890. package/table/use-selection.js.map +1 -1
  891. package/table/use-sticky-header.js +16 -16
  892. package/table/use-sticky-header.js.map +1 -1
  893. package/table/use-sticky-scrollbar.js +42 -42
  894. package/table/use-sticky-scrollbar.js.map +1 -1
  895. package/table/use-table-focus-navigation.js +27 -28
  896. package/table/use-table-focus-navigation.js.map +1 -1
  897. package/table/utils.js +7 -7
  898. package/table/utils.js.map +1 -1
  899. package/tabs/index.js +30 -33
  900. package/tabs/index.js.map +1 -1
  901. package/tabs/scroll-utils.js +12 -13
  902. package/tabs/scroll-utils.js.map +1 -1
  903. package/tabs/smooth-scroll.js +17 -17
  904. package/tabs/smooth-scroll.js.map +1 -1
  905. package/tabs/tab-header-bar.js +61 -66
  906. package/tabs/tab-header-bar.js.map +1 -1
  907. package/tag-editor/index.js +59 -72
  908. package/tag-editor/index.js.map +1 -1
  909. package/tag-editor/internal.js +21 -29
  910. package/tag-editor/internal.js.map +1 -1
  911. package/tag-editor/utils.js +7 -8
  912. package/tag-editor/utils.js.map +1 -1
  913. package/tag-editor/validation.js +16 -18
  914. package/tag-editor/validation.js.map +1 -1
  915. package/text-content/index.js +6 -6
  916. package/text-content/index.js.map +1 -1
  917. package/text-filter/index.js +3 -4
  918. package/text-filter/index.js.map +1 -1
  919. package/text-filter/internal.js +10 -10
  920. package/text-filter/internal.js.map +1 -1
  921. package/textarea/index.js +23 -24
  922. package/textarea/index.js.map +1 -1
  923. package/theming/index.js +2 -3
  924. package/theming/index.js.map +1 -1
  925. package/tiles/index.js +3 -4
  926. package/tiles/index.js.map +1 -1
  927. package/tiles/internal.js +17 -17
  928. package/tiles/internal.js.map +1 -1
  929. package/tiles/tile.js +7 -9
  930. package/tiles/tile.js.map +1 -1
  931. package/time-input/index.js +5 -5
  932. package/time-input/index.js.map +1 -1
  933. package/time-input/internal.js +9 -9
  934. package/time-input/internal.js.map +1 -1
  935. package/toggle/index.js +3 -4
  936. package/toggle/index.js.map +1 -1
  937. package/toggle/internal.js +15 -16
  938. package/toggle/internal.js.map +1 -1
  939. package/token-group/dismiss-button.js +5 -7
  940. package/token-group/dismiss-button.js.map +1 -1
  941. package/token-group/index.js +4 -4
  942. package/token-group/index.js.map +1 -1
  943. package/token-group/internal.js +14 -14
  944. package/token-group/internal.js.map +1 -1
  945. package/token-group/toggle.js +7 -9
  946. package/token-group/toggle.js.map +1 -1
  947. package/top-navigation/1.0-beta/index.js +4 -4
  948. package/top-navigation/1.0-beta/index.js.map +1 -1
  949. package/top-navigation/1.0-beta/internal.js +43 -46
  950. package/top-navigation/1.0-beta/internal.js.map +1 -1
  951. package/top-navigation/1.0-beta/parts/overflow-menu.js +16 -17
  952. package/top-navigation/1.0-beta/parts/overflow-menu.js.map +1 -1
  953. package/top-navigation/1.0-beta/parts/utility.js +9 -12
  954. package/top-navigation/1.0-beta/parts/utility.js.map +1 -1
  955. package/top-navigation/1.0-beta/use-top-navigation.js +46 -54
  956. package/top-navigation/1.0-beta/use-top-navigation.js.map +1 -1
  957. package/top-navigation/index.js +4 -4
  958. package/top-navigation/index.js.map +1 -1
  959. package/top-navigation/internal.js +64 -71
  960. package/top-navigation/internal.js.map +1 -1
  961. package/top-navigation/parts/overflow-menu/header.js +3 -4
  962. package/top-navigation/parts/overflow-menu/header.js.map +1 -1
  963. package/top-navigation/parts/overflow-menu/index.js +4 -5
  964. package/top-navigation/parts/overflow-menu/index.js.map +1 -1
  965. package/top-navigation/parts/overflow-menu/menu-item.js +56 -61
  966. package/top-navigation/parts/overflow-menu/menu-item.js.map +1 -1
  967. package/top-navigation/parts/overflow-menu/router.js +11 -13
  968. package/top-navigation/parts/overflow-menu/router.js.map +1 -1
  969. package/top-navigation/parts/overflow-menu/views/submenu.js +6 -8
  970. package/top-navigation/parts/overflow-menu/views/submenu.js.map +1 -1
  971. package/top-navigation/parts/overflow-menu/views/utilities.js +5 -7
  972. package/top-navigation/parts/overflow-menu/views/utilities.js.map +1 -1
  973. package/top-navigation/parts/utility.js +12 -15
  974. package/top-navigation/parts/utility.js.map +1 -1
  975. package/top-navigation/use-top-navigation.js +52 -59
  976. package/top-navigation/use-top-navigation.js.map +1 -1
  977. package/tutorial-panel/components/tutorial-detail-view/congratulation-screen.js +5 -7
  978. package/tutorial-panel/components/tutorial-detail-view/congratulation-screen.js.map +1 -1
  979. package/tutorial-panel/components/tutorial-detail-view/index.js +6 -7
  980. package/tutorial-panel/components/tutorial-detail-view/index.js.map +1 -1
  981. package/tutorial-panel/components/tutorial-detail-view/task-list.js +8 -15
  982. package/tutorial-panel/components/tutorial-detail-view/task-list.js.map +1 -1
  983. package/tutorial-panel/components/tutorial-detail-view/task.js +5 -6
  984. package/tutorial-panel/components/tutorial-detail-view/task.js.map +1 -1
  985. package/tutorial-panel/components/tutorial-list/index.js +19 -22
  986. package/tutorial-panel/components/tutorial-list/index.js.map +1 -1
  987. package/tutorial-panel/index.js +8 -8
  988. package/tutorial-panel/index.js.map +1 -1
  989. package/wizard/index.js +28 -28
  990. package/wizard/index.js.map +1 -1
  991. package/wizard/internal/analytics.js +32 -42
  992. package/wizard/internal/analytics.js.map +1 -1
  993. package/wizard/unmount.js +6 -13
  994. package/wizard/unmount.js.map +1 -1
  995. package/wizard/wizard-actions.js +7 -8
  996. package/wizard/wizard-actions.js.map +1 -1
  997. package/wizard/wizard-form-header.js +2 -3
  998. package/wizard/wizard-form-header.js.map +1 -1
  999. package/wizard/wizard-form.js +14 -16
  1000. package/wizard/wizard-form.js.map +1 -1
  1001. package/wizard/wizard-navigation.js +19 -25
  1002. package/wizard/wizard-navigation.js.map +1 -1
@@ -1,69 +1,66 @@
1
- import { __assign } from "tslib";
2
1
  import styles from './styles.css.js';
3
- export var dimensionsBySize = {
2
+ export const dimensionsBySize = {
4
3
  small: {
5
4
  innerRadius: 33,
6
5
  outerRadius: 50,
7
6
  innerLabelPadding: 8,
8
7
  padding: 8,
9
- paddingLabels: 44
8
+ paddingLabels: 44, // = 2 * (size-lineHeight-body-100)
10
9
  },
11
10
  medium: {
12
11
  innerRadius: 66,
13
12
  outerRadius: 100,
14
13
  innerLabelPadding: 12,
15
14
  padding: 12,
16
- paddingLabels: 44
15
+ paddingLabels: 44, // = 2 * (size-lineHeight-body-100)
17
16
  },
18
17
  large: {
19
18
  innerRadius: 93,
20
19
  outerRadius: 140,
21
20
  innerLabelPadding: 12,
22
21
  padding: 12,
23
- paddingLabels: 44
24
- }
22
+ paddingLabels: 44, // = 2 * (size-lineHeight-body-100)
23
+ },
25
24
  };
26
- export var refreshDimensionsBySize = {
27
- small: __assign(__assign({}, dimensionsBySize.small), { innerRadius: 38, cornerRadius: 3 }),
28
- medium: __assign(__assign({}, dimensionsBySize.medium), { innerRadius: 75, cornerRadius: 4 }),
29
- large: __assign(__assign({}, dimensionsBySize.large), { innerRadius: 105, cornerRadius: 5 })
25
+ export const refreshDimensionsBySize = {
26
+ small: Object.assign(Object.assign({}, dimensionsBySize.small), { innerRadius: 38, cornerRadius: 3 }),
27
+ medium: Object.assign(Object.assign({}, dimensionsBySize.medium), { innerRadius: 75, cornerRadius: 4 }),
28
+ large: Object.assign(Object.assign({}, dimensionsBySize.large), { innerRadius: 105, cornerRadius: 5 }),
30
29
  };
31
- export var defaultDetails = function (i18nStrings) { return function (datum, dataSum) {
32
- return [
33
- { key: i18nStrings.detailsValue || '', value: datum.value },
34
- {
35
- key: i18nStrings.detailsPercentage || '',
36
- value: "".concat(((datum.value * 100) / dataSum).toFixed(0), "%")
37
- },
38
- ];
39
- }; };
30
+ export const defaultDetails = (i18nStrings) => (datum, dataSum) => [
31
+ { key: i18nStrings.detailsValue || '', value: datum.value },
32
+ {
33
+ key: i18nStrings.detailsPercentage || '',
34
+ value: `${((datum.value * 100) / dataSum).toFixed(0)}%`,
35
+ },
36
+ ];
40
37
  /**
41
38
  * Adjusts the position of the given label nodes to avoid visual overlapping.
42
39
  * @param nodes List of label nodes of the entire chart (both left and right side)
43
40
  * @param markers Markers array that was calculated in <Labels>, but we just need the `endY` values
44
41
  * @param leftSide Boolean flag whether we are processing the left or right side of the chart labels
45
42
  */
46
- export var balanceLabelNodes = function (nodes, markers, leftSide) {
43
+ export const balanceLabelNodes = (nodes, markers, leftSide) => {
47
44
  var _a;
48
- var MARGIN = 10;
49
- var previousBBox = null;
45
+ const MARGIN = 10;
46
+ let previousBBox = null;
50
47
  // When traversing the right side of labels, we start at the beginning of the array and go forwards.
51
48
  // For the left side, we need to traverse backwards from the end, so that overlapping nodes are pushed down in the right order.
52
- var i = leftSide ? nodes.length - 1 : 0;
49
+ let i = leftSide ? nodes.length - 1 : 0;
53
50
  while ((leftSide && i >= 0) || (!leftSide && i < nodes.length)) {
54
- var node = nodes[i];
51
+ const node = nodes[i];
55
52
  // Currently using dataset attributes to determine the base position.
56
53
  // This implementation can be changed back to using `getBBox` when we drop IE11 support.
57
54
  // Unfortunately, there is no good alternative for `getBBox` that is supported by IE11.
58
55
  // `getBoundingClientRect` works for width and height calculations in SVG, but the x/y positions are inaccurate.
59
- var x = parseFloat(node.getAttribute('data-x') || '0');
60
- var y = parseFloat(node.getAttribute('data-y') || '0');
61
- var box = {
62
- x: x,
63
- y: y,
64
- height: node.getBoundingClientRect().height
56
+ const x = parseFloat(node.getAttribute('data-x') || '0');
57
+ const y = parseFloat(node.getAttribute('data-y') || '0');
58
+ const box = {
59
+ x,
60
+ y,
61
+ height: node.getBoundingClientRect().height,
65
62
  };
66
- var marker = markers[i];
63
+ const marker = markers[i];
67
64
  if (leftSide) {
68
65
  i--;
69
66
  }
@@ -81,14 +78,14 @@ export var balanceLabelNodes = function (nodes, markers, leftSide) {
81
78
  }
82
79
  node.setAttribute('transform', '');
83
80
  // Calculate how much the current node is overlapping with the previous one.
84
- var offset = previousBBox.y + previousBBox.height + MARGIN - box.y;
81
+ const offset = previousBBox.y + previousBBox.height + MARGIN - box.y;
85
82
  if (offset > 0) {
86
83
  // Move the label down.
87
- node.setAttribute('transform', "translate(0 ".concat(offset, ")"));
84
+ node.setAttribute('transform', `translate(0 ${offset})`);
88
85
  // Adjust the attached line accordingly.
89
- var lineNode = (_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(styles['label-line']));
86
+ const lineNode = (_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.querySelector(`.${styles['label-line']}`);
90
87
  if (lineNode) {
91
- var endY = marker.endY;
88
+ const { endY } = marker;
92
89
  lineNode.setAttribute('y2', '' + (endY + offset));
93
90
  }
94
91
  // Update the position accordingly to inform the next label
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/pie-chart/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { PieChartProps } from './interfaces';\nimport styles from './styles.css.js';\n\ninterface Dimension {\n innerRadius: number;\n outerRadius: number;\n padding: number;\n paddingLabels: number;\n innerLabelPadding: number;\n cornerRadius?: number;\n}\n\nexport const dimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n innerRadius: 33,\n outerRadius: 50,\n innerLabelPadding: 8,\n padding: 8, // = space-xs\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n medium: {\n innerRadius: 66,\n outerRadius: 100,\n innerLabelPadding: 12,\n padding: 12, // = space-s\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n large: {\n innerRadius: 93,\n outerRadius: 140,\n innerLabelPadding: 12,\n padding: 12, // = space-s\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n};\n\nexport const refreshDimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n ...dimensionsBySize.small,\n innerRadius: 38,\n cornerRadius: 3,\n },\n medium: {\n ...dimensionsBySize.medium,\n innerRadius: 75,\n cornerRadius: 4,\n },\n large: {\n ...dimensionsBySize.large,\n innerRadius: 105,\n cornerRadius: 5,\n },\n};\n\nexport const defaultDetails =\n (i18nStrings: PieChartProps.I18nStrings) => (datum: PieChartProps.Datum, dataSum: number) =>\n [\n { key: i18nStrings.detailsValue || '', value: datum.value },\n {\n key: i18nStrings.detailsPercentage || '',\n value: `${((datum.value * 100) / dataSum).toFixed(0)}%`,\n },\n ];\n\n/**\n * Adjusts the position of the given label nodes to avoid visual overlapping.\n * @param nodes List of label nodes of the entire chart (both left and right side)\n * @param markers Markers array that was calculated in <Labels>, but we just need the `endY` values\n * @param leftSide Boolean flag whether we are processing the left or right side of the chart labels\n */\nexport const balanceLabelNodes = (\n nodes: NodeListOf<SVGGElement>,\n markers: Array<{ endY: number }>,\n leftSide: boolean\n) => {\n const MARGIN = 10;\n\n let previousBBox: { x: number; y: number; height: number } | null = null;\n\n // When traversing the right side of labels, we start at the beginning of the array and go forwards.\n // For the left side, we need to traverse backwards from the end, so that overlapping nodes are pushed down in the right order.\n let i = leftSide ? nodes.length - 1 : 0;\n\n while ((leftSide && i >= 0) || (!leftSide && i < nodes.length)) {\n const node = nodes[i];\n\n // Currently using dataset attributes to determine the base position.\n // This implementation can be changed back to using `getBBox` when we drop IE11 support.\n // Unfortunately, there is no good alternative for `getBBox` that is supported by IE11.\n // `getBoundingClientRect` works for width and height calculations in SVG, but the x/y positions are inaccurate.\n const x = parseFloat(node.getAttribute('data-x') || '0');\n const y = parseFloat(node.getAttribute('data-y') || '0');\n const box = {\n x,\n y,\n height: node.getBoundingClientRect().height,\n };\n\n const marker = markers[i];\n\n if (leftSide) {\n i--;\n } else {\n i++;\n }\n\n if (!previousBBox) {\n previousBBox = box;\n node.setAttribute('transform', '');\n continue;\n }\n\n if ((!leftSide && box.x < 0) || (leftSide && box.x >= 0)) {\n // We have reached a label that is on the other side of the chart, so we're done.\n break;\n }\n\n node.setAttribute('transform', '');\n\n // Calculate how much the current node is overlapping with the previous one.\n const offset = previousBBox.y + previousBBox.height + MARGIN - box.y;\n\n if (offset > 0) {\n // Move the label down.\n node.setAttribute('transform', `translate(0 ${offset})`);\n\n // Adjust the attached line accordingly.\n const lineNode = node.parentNode?.querySelector(`.${styles['label-line']}`);\n if (lineNode) {\n const { endY } = marker;\n lineNode.setAttribute('y2', '' + (endY + offset));\n }\n\n // Update the position accordingly to inform the next label\n box.y += offset;\n }\n\n previousBBox = box;\n }\n};\n"]}
1
+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/pie-chart/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { PieChartProps } from './interfaces';\nimport styles from './styles.css.js';\n\ninterface Dimension {\n innerRadius: number;\n outerRadius: number;\n padding: number;\n paddingLabels: number;\n innerLabelPadding: number;\n cornerRadius?: number;\n}\n\nexport const dimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n innerRadius: 33,\n outerRadius: 50,\n innerLabelPadding: 8,\n padding: 8, // = space-xs\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n medium: {\n innerRadius: 66,\n outerRadius: 100,\n innerLabelPadding: 12,\n padding: 12, // = space-s\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n large: {\n innerRadius: 93,\n outerRadius: 140,\n innerLabelPadding: 12,\n padding: 12, // = space-s\n paddingLabels: 44, // = 2 * (size-lineHeight-body-100)\n },\n};\n\nexport const refreshDimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n ...dimensionsBySize.small,\n innerRadius: 38,\n cornerRadius: 3,\n },\n medium: {\n ...dimensionsBySize.medium,\n innerRadius: 75,\n cornerRadius: 4,\n },\n large: {\n ...dimensionsBySize.large,\n innerRadius: 105,\n cornerRadius: 5,\n },\n};\n\nexport const defaultDetails =\n (i18nStrings: PieChartProps.I18nStrings) => (datum: PieChartProps.Datum, dataSum: number) =>\n [\n { key: i18nStrings.detailsValue || '', value: datum.value },\n {\n key: i18nStrings.detailsPercentage || '',\n value: `${((datum.value * 100) / dataSum).toFixed(0)}%`,\n },\n ];\n\n/**\n * Adjusts the position of the given label nodes to avoid visual overlapping.\n * @param nodes List of label nodes of the entire chart (both left and right side)\n * @param markers Markers array that was calculated in <Labels>, but we just need the `endY` values\n * @param leftSide Boolean flag whether we are processing the left or right side of the chart labels\n */\nexport const balanceLabelNodes = (\n nodes: NodeListOf<SVGGElement>,\n markers: Array<{ endY: number }>,\n leftSide: boolean\n) => {\n const MARGIN = 10;\n\n let previousBBox: { x: number; y: number; height: number } | null = null;\n\n // When traversing the right side of labels, we start at the beginning of the array and go forwards.\n // For the left side, we need to traverse backwards from the end, so that overlapping nodes are pushed down in the right order.\n let i = leftSide ? nodes.length - 1 : 0;\n\n while ((leftSide && i >= 0) || (!leftSide && i < nodes.length)) {\n const node = nodes[i];\n\n // Currently using dataset attributes to determine the base position.\n // This implementation can be changed back to using `getBBox` when we drop IE11 support.\n // Unfortunately, there is no good alternative for `getBBox` that is supported by IE11.\n // `getBoundingClientRect` works for width and height calculations in SVG, but the x/y positions are inaccurate.\n const x = parseFloat(node.getAttribute('data-x') || '0');\n const y = parseFloat(node.getAttribute('data-y') || '0');\n const box = {\n x,\n y,\n height: node.getBoundingClientRect().height,\n };\n\n const marker = markers[i];\n\n if (leftSide) {\n i--;\n } else {\n i++;\n }\n\n if (!previousBBox) {\n previousBBox = box;\n node.setAttribute('transform', '');\n continue;\n }\n\n if ((!leftSide && box.x < 0) || (leftSide && box.x >= 0)) {\n // We have reached a label that is on the other side of the chart, so we're done.\n break;\n }\n\n node.setAttribute('transform', '');\n\n // Calculate how much the current node is overlapping with the previous one.\n const offset = previousBBox.y + previousBBox.height + MARGIN - box.y;\n\n if (offset > 0) {\n // Move the label down.\n node.setAttribute('transform', `translate(0 ${offset})`);\n\n // Adjust the attached line accordingly.\n const lineNode = node.parentNode?.querySelector(`.${styles['label-line']}`);\n if (lineNode) {\n const { endY } = marker;\n lineNode.setAttribute('y2', '' + (endY + offset));\n }\n\n // Update the position accordingly to inform the next label\n box.y += offset;\n }\n\n previousBBox = box;\n }\n};\n"]}
package/popover/arrow.js CHANGED
@@ -3,8 +3,8 @@
3
3
  import React from 'react';
4
4
  import clsx from 'clsx';
5
5
  import styles from './styles.css.js';
6
- var Arrow = function (props) { return (React.createElement("div", { className: clsx(styles.arrow, props.position && styles["arrow-position-".concat(props.position)]) },
6
+ const Arrow = (props) => (React.createElement("div", { className: clsx(styles.arrow, props.position && styles[`arrow-position-${props.position}`]) },
7
7
  React.createElement("div", { className: styles['arrow-outer'] }),
8
- React.createElement("div", { className: styles['arrow-inner'] }))); };
8
+ React.createElement("div", { className: styles['arrow-inner'] })));
9
9
  export default React.memo(Arrow);
10
10
  //# sourceMappingURL=arrow.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"arrow.js","sourceRoot":"","sources":["../../../src/popover/arrow.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,IAAM,KAAK,GAAG,UAAC,KAAiB,IAAK,OAAA,CACnC,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,IAAI,MAAM,CAAC,yBAAkB,KAAK,CAAC,QAAQ,CAAE,CAAC,CAAC;IAC9F,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,GAAI;IACzC,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,GAAI,CACrC,CACP,EALoC,CAKpC,CAAC;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { InternalPosition } from './interfaces';\n\nexport interface ArrowProps {\n position: InternalPosition | null;\n}\n\nconst Arrow = (props: ArrowProps) => (\n <div className={clsx(styles.arrow, props.position && styles[`arrow-position-${props.position}`])}>\n <div className={styles['arrow-outer']} />\n <div className={styles['arrow-inner']} />\n </div>\n);\n\nexport default React.memo(Arrow);\n"]}
1
+ {"version":3,"file":"arrow.js","sourceRoot":"","sources":["../../../src/popover/arrow.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE,CAAC,CACnC,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,IAAI,MAAM,CAAC,kBAAkB,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC9F,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,GAAI;IACzC,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,GAAI,CACrC,CACP,CAAC;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { InternalPosition } from './interfaces';\n\nexport interface ArrowProps {\n position: InternalPosition | null;\n}\n\nconst Arrow = (props: ArrowProps) => (\n <div className={clsx(styles.arrow, props.position && styles[`arrow-position-${props.position}`])}>\n <div className={styles['arrow-outer']} />\n <div className={styles['arrow-inner']} />\n </div>\n);\n\nexport default React.memo(Arrow);\n"]}
package/popover/body.js CHANGED
@@ -1,4 +1,3 @@
1
- import { __assign } from "tslib";
2
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
2
  // SPDX-License-Identifier: Apache-2.0
4
3
  import React, { useCallback, useEffect, useRef } from 'react';
@@ -8,13 +7,11 @@ import { useUniqueId } from '../internal/hooks/use-unique-id';
8
7
  import { InternalButton } from '../button/internal';
9
8
  import FocusLock from '../internal/components/focus-lock';
10
9
  import styles from './styles.css.js';
11
- export default function PopoverBody(_a) {
12
- var _b, _c;
13
- var showDismissButton = _a.dismissButton, dismissAriaLabel = _a.dismissAriaLabel, header = _a.header, children = _a.children, onDismiss = _a.onDismiss, variant = _a.variant, overflowVisible = _a.overflowVisible, className = _a.className, ariaLabelledby = _a.ariaLabelledby;
14
- var labelledById = useUniqueId('awsui-popover-');
15
- var dismissButtonFocused = useRef(false);
16
- var dismissButtonRef = useRef(null);
17
- var onKeyDown = useCallback(function (event) {
10
+ export default function PopoverBody({ dismissButton: showDismissButton, dismissAriaLabel, header, children, onDismiss, variant, overflowVisible, className, ariaLabelledby, }) {
11
+ const labelledById = useUniqueId('awsui-popover-');
12
+ const dismissButtonFocused = useRef(false);
13
+ const dismissButtonRef = useRef(null);
14
+ const onKeyDown = useCallback((event) => {
18
15
  if (event.keyCode === KeyCode.escape) {
19
16
  onDismiss();
20
17
  }
@@ -22,27 +19,27 @@ export default function PopoverBody(_a) {
22
19
  // Implement our own auto-focus rather than using FocusLock's,
23
20
  // because we also want to focus the dismiss button when it
24
21
  // is added dyamically (e.g. in chart popovers)
25
- useEffect(function () {
22
+ useEffect(() => {
26
23
  var _a;
27
24
  if (showDismissButton && !dismissButtonFocused.current) {
28
25
  (_a = dismissButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
29
26
  }
30
27
  dismissButtonFocused.current = showDismissButton;
31
28
  }, [showDismissButton]);
32
- var dismissButton = (showDismissButton !== null && showDismissButton !== void 0 ? showDismissButton : null) && (React.createElement("div", { className: styles.dismiss },
33
- React.createElement(InternalButton, { variant: "icon", formAction: "none", iconName: "close", className: styles['dismiss-control'], ariaLabel: dismissAriaLabel, onClick: function () { return onDismiss(); }, ref: dismissButtonRef })));
34
- var isDialog = showDismissButton;
35
- var shouldTrapFocus = showDismissButton && variant !== 'annotation';
36
- var dialogProps = isDialog
29
+ const dismissButton = (showDismissButton !== null && showDismissButton !== void 0 ? showDismissButton : null) && (React.createElement("div", { className: styles.dismiss },
30
+ React.createElement(InternalButton, { variant: "icon", formAction: "none", iconName: "close", className: styles['dismiss-control'], ariaLabel: dismissAriaLabel, onClick: () => onDismiss(), ref: dismissButtonRef })));
31
+ const isDialog = showDismissButton;
32
+ const shouldTrapFocus = showDismissButton && variant !== 'annotation';
33
+ const dialogProps = isDialog
37
34
  ? {
38
35
  role: 'dialog',
39
36
  'aria-modal': shouldTrapFocus ? true : undefined,
40
- 'aria-labelledby': ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : (header ? labelledById : undefined)
37
+ 'aria-labelledby': ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : (header ? labelledById : undefined),
41
38
  }
42
39
  : {};
43
- return (React.createElement("div", __assign({ className: clsx(styles.body, className, (_b = {},
44
- _b[styles['body-overflow-visible']] = overflowVisible === 'both',
45
- _b)), onKeyDown: onKeyDown }, dialogProps),
40
+ return (React.createElement("div", Object.assign({ className: clsx(styles.body, className, {
41
+ [styles['body-overflow-visible']]: overflowVisible === 'both',
42
+ }), onKeyDown: onKeyDown }, dialogProps),
46
43
  React.createElement(FocusLock, { disabled: !shouldTrapFocus, autoFocus: false },
47
44
  header && (React.createElement("div", { className: clsx(styles['header-row'], showDismissButton && styles['has-dismiss']) },
48
45
  dismissButton,
@@ -50,6 +47,6 @@ export default function PopoverBody(_a) {
50
47
  React.createElement("h2", null, header)))),
51
48
  React.createElement("div", { className: !header && showDismissButton ? styles['has-dismiss'] : undefined },
52
49
  !header && dismissButton,
53
- React.createElement("div", { className: clsx(styles.content, (_c = {}, _c[styles['content-overflow-visible']] = !!overflowVisible, _c)) }, children)))));
50
+ React.createElement("div", { className: clsx(styles.content, { [styles['content-overflow-visible']]: !!overflowVisible }) }, children)))));
54
51
  }
55
52
  //# sourceMappingURL=body.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport FocusLock from '../internal/components/focus-lock';\n\nimport styles from './styles.css.js';\n\nexport interface PopoverBodyProps {\n dismissButton: boolean;\n dismissAriaLabel: string | undefined;\n onDismiss: () => void;\n\n header: React.ReactNode | undefined;\n children: React.ReactNode;\n variant?: 'annotation';\n overflowVisible?: 'content' | 'both';\n\n className?: string;\n ariaLabelledby?: string;\n}\n\nexport default function PopoverBody({\n dismissButton: showDismissButton,\n dismissAriaLabel,\n header,\n children,\n onDismiss,\n variant,\n overflowVisible,\n className,\n ariaLabelledby,\n}: PopoverBodyProps) {\n const labelledById = useUniqueId('awsui-popover-');\n const dismissButtonFocused = useRef(false);\n const dismissButtonRef = useRef<ButtonProps.Ref>(null);\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n onDismiss();\n }\n },\n [onDismiss]\n );\n\n // Implement our own auto-focus rather than using FocusLock's,\n // because we also want to focus the dismiss button when it\n // is added dyamically (e.g. in chart popovers)\n useEffect(() => {\n if (showDismissButton && !dismissButtonFocused.current) {\n dismissButtonRef.current?.focus({ preventScroll: true });\n }\n dismissButtonFocused.current = showDismissButton;\n }, [showDismissButton]);\n\n const dismissButton = (showDismissButton ?? null) && (\n <div className={styles.dismiss}>\n <InternalButton\n variant=\"icon\"\n formAction=\"none\"\n iconName=\"close\"\n className={styles['dismiss-control']}\n ariaLabel={dismissAriaLabel}\n onClick={() => onDismiss()}\n ref={dismissButtonRef}\n />\n </div>\n );\n\n const isDialog = showDismissButton;\n const shouldTrapFocus = showDismissButton && variant !== 'annotation';\n\n const dialogProps = isDialog\n ? {\n role: 'dialog',\n 'aria-modal': shouldTrapFocus ? true : undefined,\n 'aria-labelledby': ariaLabelledby ?? (header ? labelledById : undefined),\n }\n : {};\n\n return (\n <div\n className={clsx(styles.body, className, {\n [styles['body-overflow-visible']]: overflowVisible === 'both',\n })}\n onKeyDown={onKeyDown}\n {...dialogProps}\n >\n <FocusLock disabled={!shouldTrapFocus} autoFocus={false}>\n {header && (\n <div className={clsx(styles['header-row'], showDismissButton && styles['has-dismiss'])}>\n {dismissButton}\n <div className={styles.header} id={labelledById}>\n <h2>{header}</h2>\n </div>\n </div>\n )}\n <div className={!header && showDismissButton ? styles['has-dismiss'] : undefined}>\n {!header && dismissButton}\n <div className={clsx(styles.content, { [styles['content-overflow-visible']]: !!overflowVisible })}>\n {children}\n </div>\n </div>\n </FocusLock>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport FocusLock from '../internal/components/focus-lock';\n\nimport styles from './styles.css.js';\n\nexport interface PopoverBodyProps {\n dismissButton: boolean;\n dismissAriaLabel: string | undefined;\n onDismiss: () => void;\n\n header: React.ReactNode | undefined;\n children: React.ReactNode;\n variant?: 'annotation';\n overflowVisible?: 'content' | 'both';\n\n className?: string;\n ariaLabelledby?: string;\n}\n\nexport default function PopoverBody({\n dismissButton: showDismissButton,\n dismissAriaLabel,\n header,\n children,\n onDismiss,\n variant,\n overflowVisible,\n className,\n ariaLabelledby,\n}: PopoverBodyProps) {\n const labelledById = useUniqueId('awsui-popover-');\n const dismissButtonFocused = useRef(false);\n const dismissButtonRef = useRef<ButtonProps.Ref>(null);\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n onDismiss();\n }\n },\n [onDismiss]\n );\n\n // Implement our own auto-focus rather than using FocusLock's,\n // because we also want to focus the dismiss button when it\n // is added dyamically (e.g. in chart popovers)\n useEffect(() => {\n if (showDismissButton && !dismissButtonFocused.current) {\n dismissButtonRef.current?.focus({ preventScroll: true });\n }\n dismissButtonFocused.current = showDismissButton;\n }, [showDismissButton]);\n\n const dismissButton = (showDismissButton ?? null) && (\n <div className={styles.dismiss}>\n <InternalButton\n variant=\"icon\"\n formAction=\"none\"\n iconName=\"close\"\n className={styles['dismiss-control']}\n ariaLabel={dismissAriaLabel}\n onClick={() => onDismiss()}\n ref={dismissButtonRef}\n />\n </div>\n );\n\n const isDialog = showDismissButton;\n const shouldTrapFocus = showDismissButton && variant !== 'annotation';\n\n const dialogProps = isDialog\n ? {\n role: 'dialog',\n 'aria-modal': shouldTrapFocus ? true : undefined,\n 'aria-labelledby': ariaLabelledby ?? (header ? labelledById : undefined),\n }\n : {};\n\n return (\n <div\n className={clsx(styles.body, className, {\n [styles['body-overflow-visible']]: overflowVisible === 'both',\n })}\n onKeyDown={onKeyDown}\n {...dialogProps}\n >\n <FocusLock disabled={!shouldTrapFocus} autoFocus={false}>\n {header && (\n <div className={clsx(styles['header-row'], showDismissButton && styles['has-dismiss'])}>\n {dismissButton}\n <div className={styles.header} id={labelledById}>\n <h2>{header}</h2>\n </div>\n </div>\n )}\n <div className={!header && showDismissButton ? styles['has-dismiss'] : undefined}>\n {!header && dismissButton}\n <div className={clsx(styles.content, { [styles['content-overflow-visible']]: !!overflowVisible })}>\n {children}\n </div>\n </div>\n </FocusLock>\n </div>\n );\n}\n"]}
@@ -1,4 +1,3 @@
1
- import { __assign } from "tslib";
2
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
2
  // SPDX-License-Identifier: Apache-2.0
4
3
  import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';
@@ -8,30 +7,28 @@ import { useResizeObserver } from '../internal/hooks/container-queries';
8
7
  import { calculatePosition } from './utils/positions';
9
8
  import styles from './styles.css.js';
10
9
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
11
- var INITIAL_STYLES = { position: 'absolute', top: -9999, left: -9999 };
12
- export default function PopoverContainer(_a) {
13
- var _b;
14
- var position = _a.position, trackRef = _a.trackRef, trackKey = _a.trackKey, arrow = _a.arrow, children = _a.children, zIndex = _a.zIndex, renderWithPortal = _a.renderWithPortal, size = _a.size, fixedWidth = _a.fixedWidth, variant = _a.variant;
15
- var bodyRef = useRef(null);
16
- var contentRef = useRef(null);
17
- var popoverRef = useRef(null);
18
- var arrowRef = useRef(null);
19
- var _c = useState(INITIAL_STYLES), popoverStyle = _c[0], setPopoverStyle = _c[1];
20
- var _d = useState(null), internalPosition = _d[0], setInternalPosition = _d[1];
21
- var isRefresh = useVisualRefresh();
10
+ const INITIAL_STYLES = { position: 'absolute', top: -9999, left: -9999 };
11
+ export default function PopoverContainer({ position, trackRef, trackKey, arrow, children, zIndex, renderWithPortal, size, fixedWidth, variant, }) {
12
+ const bodyRef = useRef(null);
13
+ const contentRef = useRef(null);
14
+ const popoverRef = useRef(null);
15
+ const arrowRef = useRef(null);
16
+ const [popoverStyle, setPopoverStyle] = useState(INITIAL_STYLES);
17
+ const [internalPosition, setInternalPosition] = useState(null);
18
+ const isRefresh = useVisualRefresh();
22
19
  // Store the handler in a ref so that it can still be replaced from outside of the listener closure.
23
- var positionHandlerRef = useRef(function () { });
20
+ const positionHandlerRef = useRef(() => { });
24
21
  // Updates the position handler.
25
- var updatePositionHandler = useCallback(function () {
22
+ const updatePositionHandler = useCallback(() => {
26
23
  if (!trackRef.current || !popoverRef.current || !bodyRef.current || !contentRef.current || !arrowRef.current) {
27
24
  return;
28
25
  }
29
26
  // Get important elements
30
- var popover = popoverRef.current;
31
- var body = bodyRef.current;
32
- var arrow = arrowRef.current;
33
- var document = popover.ownerDocument;
34
- var track = trackRef.current;
27
+ const popover = popoverRef.current;
28
+ const body = bodyRef.current;
29
+ const arrow = arrowRef.current;
30
+ const document = popover.ownerDocument;
31
+ const track = trackRef.current;
35
32
  // If the popover body isn't being rendered for whatever reason (e.g. "display: none" or JSDOM),
36
33
  // or track does not belong to the document - bail on calculating dimensions.
37
34
  if (popover.offsetWidth === 0 || popover.offsetHeight === 0 || !nodeContains(document.body, track)) {
@@ -40,8 +37,8 @@ export default function PopoverContainer(_a) {
40
37
  // Imperatively move body off-screen to give it room to expand.
41
38
  // Not doing this in React because this recalculation should happen
42
39
  // in the span of a single frame without rerendering anything.
43
- var prevTop = popover.style.top;
44
- var prevLeft = popover.style.left;
40
+ const prevTop = popover.style.top;
41
+ const prevLeft = popover.style.left;
45
42
  popover.style.top = '0';
46
43
  popover.style.left = '0';
47
44
  // Imperatively remove body styles that can remain from the previous computation.
@@ -50,27 +47,27 @@ export default function PopoverContainer(_a) {
50
47
  body.style.overflowY = '';
51
48
  // Get rects representing key elements
52
49
  // Use getComputedStyle for arrowRect to avoid modifications made by transform
53
- var viewportRect = getViewportRect(document.defaultView);
54
- var trackRect = track.getBoundingClientRect();
55
- var arrowRect = {
50
+ const viewportRect = getViewportRect(document.defaultView);
51
+ const trackRect = track.getBoundingClientRect();
52
+ const arrowRect = {
56
53
  width: parseFloat(getComputedStyle(arrow).width),
57
- height: parseFloat(getComputedStyle(arrow).height)
54
+ height: parseFloat(getComputedStyle(arrow).height),
58
55
  };
59
- var containingBlock = getContainingBlock(popover);
60
- var containingBlockRect = containingBlock ? containingBlock.getBoundingClientRect() : viewportRect;
61
- var bodyBorderWidth = getBorderWidth(body);
62
- var contentRect = contentRef.current.getBoundingClientRect();
63
- var contentBoundingBox = {
56
+ const containingBlock = getContainingBlock(popover);
57
+ const containingBlockRect = containingBlock ? containingBlock.getBoundingClientRect() : viewportRect;
58
+ const bodyBorderWidth = getBorderWidth(body);
59
+ const contentRect = contentRef.current.getBoundingClientRect();
60
+ const contentBoundingBox = {
64
61
  width: contentRect.width + 2 * bodyBorderWidth,
65
- height: contentRect.height + 2 * bodyBorderWidth
62
+ height: contentRect.height + 2 * bodyBorderWidth,
66
63
  };
67
64
  // Calculate the arrow direction and viewport-relative position of the popover.
68
- var _a = calculatePosition(position, trackRect, arrowRect, contentBoundingBox, containingBlock ? containingBlockRect : getDocumentRect(document), viewportRect, renderWithPortal), scrollable = _a.scrollable, newInternalPosition = _a.internalPosition, boundingOffset = _a.boundingOffset;
65
+ const { scrollable, internalPosition: newInternalPosition, boundingOffset, } = calculatePosition(position, trackRect, arrowRect, contentBoundingBox, containingBlock ? containingBlockRect : getDocumentRect(document), viewportRect, renderWithPortal);
69
66
  // Get the position of the popover relative to the offset parent.
70
- var popoverOffset = toRelativePosition(boundingOffset, containingBlockRect);
67
+ const popoverOffset = toRelativePosition(boundingOffset, containingBlockRect);
71
68
  // Cache the distance between the trigger and the popover (which stays the same as you scroll),
72
69
  // and use that to recalculate the new popover position.
73
- var trackRelativeOffset = toRelativePosition(popoverOffset, toRelativePosition(trackRect, containingBlockRect));
70
+ const trackRelativeOffset = toRelativePosition(popoverOffset, toRelativePosition(trackRect, containingBlockRect));
74
71
  // Bring back the container to its original position to prevent any flashing.
75
72
  popover.style.top = prevTop;
76
73
  popover.style.left = prevLeft;
@@ -83,45 +80,45 @@ export default function PopoverContainer(_a) {
83
80
  // Position the popover
84
81
  setInternalPosition(newInternalPosition);
85
82
  setPopoverStyle({ top: popoverOffset.top, left: popoverOffset.left });
86
- positionHandlerRef.current = function () {
87
- var newTrackOffset = toRelativePosition(track.getBoundingClientRect(), containingBlock ? containingBlock.getBoundingClientRect() : viewportRect);
83
+ positionHandlerRef.current = () => {
84
+ const newTrackOffset = toRelativePosition(track.getBoundingClientRect(), containingBlock ? containingBlock.getBoundingClientRect() : viewportRect);
88
85
  setPopoverStyle({
89
86
  top: newTrackOffset.top + trackRelativeOffset.top,
90
- left: newTrackOffset.left + trackRelativeOffset.left
87
+ left: newTrackOffset.left + trackRelativeOffset.left,
91
88
  });
92
89
  };
93
90
  }, [position, trackRef, renderWithPortal]);
94
91
  // Recalculate position when properties change.
95
- useLayoutEffect(function () {
92
+ useLayoutEffect(() => {
96
93
  updatePositionHandler();
97
94
  }, [updatePositionHandler, trackKey]);
98
95
  // Recalculate position when content size changes.
99
- useResizeObserver(contentRef, function () { return updatePositionHandler(); });
96
+ useResizeObserver(contentRef, () => updatePositionHandler());
100
97
  // Recalculate position on DOM events.
101
- useLayoutEffect(function () {
98
+ useLayoutEffect(() => {
102
99
  /*
103
100
  This is a heuristic. Some layout changes are caused by user clicks (e.g. toggling the tools panel, submitting a form),
104
101
  and by tracking the click event we can adapt the popover's position to the new layout.
105
102
 
106
103
  TODO: extend this to Enter and Spacebar?
107
104
  */
108
- var updatePosition = function () { return requestAnimationFrame(function () { return updatePositionHandler(); }); };
109
- var refreshPosition = function () { return requestAnimationFrame(function () { return positionHandlerRef.current(); }); };
105
+ const updatePosition = () => requestAnimationFrame(() => updatePositionHandler());
106
+ const refreshPosition = () => requestAnimationFrame(() => positionHandlerRef.current());
110
107
  window.addEventListener('click', updatePosition);
111
108
  window.addEventListener('resize', updatePosition);
112
109
  window.addEventListener('scroll', refreshPosition, true);
113
- return function () {
110
+ return () => {
114
111
  window.removeEventListener('click', updatePosition);
115
112
  window.removeEventListener('resize', updatePosition);
116
113
  window.removeEventListener('scroll', refreshPosition, true);
117
114
  };
118
115
  }, [updatePositionHandler]);
119
- return (React.createElement("div", { ref: popoverRef, style: __assign(__assign({}, popoverStyle), { zIndex: zIndex }), className: clsx(styles.container, isRefresh && styles.refresh) },
120
- React.createElement("div", { ref: arrowRef, className: clsx(styles["container-arrow"], styles["container-arrow-position-".concat(internalPosition)]), "aria-hidden": true }, arrow(internalPosition)),
121
- React.createElement("div", { ref: bodyRef, className: clsx(styles['container-body'], styles["container-body-size-".concat(size)], (_b = {},
122
- _b[styles['fixed-width']] = fixedWidth,
123
- _b[styles["container-body-variant-".concat(variant)]] = variant,
124
- _b)) },
116
+ return (React.createElement("div", { ref: popoverRef, style: Object.assign(Object.assign({}, popoverStyle), { zIndex }), className: clsx(styles.container, isRefresh && styles.refresh) },
117
+ React.createElement("div", { ref: arrowRef, className: clsx(styles[`container-arrow`], styles[`container-arrow-position-${internalPosition}`]), "aria-hidden": true }, arrow(internalPosition)),
118
+ React.createElement("div", { ref: bodyRef, className: clsx(styles['container-body'], styles[`container-body-size-${size}`], {
119
+ [styles['fixed-width']]: fixedWidth,
120
+ [styles[`container-body-variant-${variant}`]]: variant,
121
+ }) },
125
122
  React.createElement("div", { ref: contentRef }, children))));
126
123
  }
127
124
  function getBorderWidth(element) {
@@ -133,7 +130,7 @@ function getBorderWidth(element) {
133
130
  function toRelativePosition(element, parent) {
134
131
  return {
135
132
  top: element.top - parent.top,
136
- left: element.left - parent.left
133
+ left: element.left - parent.left,
137
134
  };
138
135
  }
139
136
  /**
@@ -144,16 +141,16 @@ function getViewportRect(window) {
144
141
  top: 0,
145
142
  left: 0,
146
143
  width: window.innerWidth,
147
- height: window.innerHeight
144
+ height: window.innerHeight,
148
145
  };
149
146
  }
150
147
  function getDocumentRect(document) {
151
- var _a = document.documentElement.getBoundingClientRect(), top = _a.top, left = _a.left;
148
+ const { top, left } = document.documentElement.getBoundingClientRect();
152
149
  return {
153
- top: top,
154
- left: left,
150
+ top,
151
+ left,
155
152
  width: document.documentElement.scrollWidth,
156
- height: document.documentElement.scrollHeight
153
+ height: document.documentElement.scrollHeight,
157
154
  };
158
155
  }
159
156
  //# sourceMappingURL=container.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"container.js","sourceRoot":"","sources":["../../../src/popover/container.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { CSSProperties, useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { getContainingBlock, nodeContains } from '../internal/utils/dom';\nimport { useResizeObserver } from '../internal/hooks/container-queries';\nimport { BoundingOffset, InternalPosition, Offset, PopoverProps } from './interfaces';\nimport { calculatePosition } from './utils/positions';\nimport styles from './styles.css.js';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nexport interface PopoverContainerProps {\n /** References the element the container is positioned against. */\n trackRef: React.RefObject<Element>;\n /**\n Used to update the container position in case track or track position changes:\n \n const trackRef = useRef<Element>(null)\n return (<>\n <Track style={getPosition(selectedItemId)} ref={trackRef} />\n <PopoverContainer trackRef={trackRef} trackKey={selectedItemId} .../>\n </>)\n */\n trackKey?: string | number;\n position: PopoverProps.Position;\n zIndex?: React.CSSProperties['zIndex'];\n arrow: (position: InternalPosition | null) => React.ReactNode;\n children: React.ReactNode;\n renderWithPortal?: boolean;\n size: PopoverProps.Size;\n fixedWidth: boolean;\n variant?: 'annotation';\n}\n\nconst INITIAL_STYLES: CSSProperties = { position: 'absolute', top: -9999, left: -9999 };\n\nexport default function PopoverContainer({\n position,\n trackRef,\n trackKey,\n arrow,\n children,\n zIndex,\n renderWithPortal,\n size,\n fixedWidth,\n variant,\n}: PopoverContainerProps) {\n const bodyRef = useRef<HTMLDivElement | null>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n const popoverRef = useRef<HTMLDivElement | null>(null);\n const arrowRef = useRef<HTMLDivElement | null>(null);\n\n const [popoverStyle, setPopoverStyle] = useState<CSSProperties>(INITIAL_STYLES);\n const [internalPosition, setInternalPosition] = useState<InternalPosition | null>(null);\n const isRefresh = useVisualRefresh();\n\n // Store the handler in a ref so that it can still be replaced from outside of the listener closure.\n const positionHandlerRef = useRef<() => void>(() => {});\n\n // Updates the position handler.\n const updatePositionHandler = useCallback(() => {\n if (!trackRef.current || !popoverRef.current || !bodyRef.current || !contentRef.current || !arrowRef.current) {\n return;\n }\n\n // Get important elements\n const popover = popoverRef.current;\n const body = bodyRef.current;\n const arrow = arrowRef.current;\n const document = popover.ownerDocument;\n const track = trackRef.current;\n\n // If the popover body isn't being rendered for whatever reason (e.g. \"display: none\" or JSDOM),\n // or track does not belong to the document - bail on calculating dimensions.\n if (popover.offsetWidth === 0 || popover.offsetHeight === 0 || !nodeContains(document.body, track)) {\n return;\n }\n\n // Imperatively move body off-screen to give it room to expand.\n // Not doing this in React because this recalculation should happen\n // in the span of a single frame without rerendering anything.\n const prevTop = popover.style.top;\n const prevLeft = popover.style.left;\n popover.style.top = '0';\n popover.style.left = '0';\n // Imperatively remove body styles that can remain from the previous computation.\n body.style.maxHeight = '';\n body.style.overflowX = '';\n body.style.overflowY = '';\n\n // Get rects representing key elements\n // Use getComputedStyle for arrowRect to avoid modifications made by transform\n const viewportRect = getViewportRect(document.defaultView!);\n const trackRect = track.getBoundingClientRect();\n const arrowRect = {\n width: parseFloat(getComputedStyle(arrow).width),\n height: parseFloat(getComputedStyle(arrow).height),\n };\n const containingBlock = getContainingBlock(popover);\n const containingBlockRect = containingBlock ? containingBlock.getBoundingClientRect() : viewportRect;\n\n const bodyBorderWidth = getBorderWidth(body);\n const contentRect = contentRef.current.getBoundingClientRect();\n const contentBoundingBox = {\n width: contentRect.width + 2 * bodyBorderWidth,\n height: contentRect.height + 2 * bodyBorderWidth,\n };\n\n // Calculate the arrow direction and viewport-relative position of the popover.\n const {\n scrollable,\n internalPosition: newInternalPosition,\n boundingOffset,\n } = calculatePosition(\n position,\n trackRect,\n arrowRect,\n contentBoundingBox,\n containingBlock ? containingBlockRect : getDocumentRect(document),\n viewportRect,\n renderWithPortal\n );\n\n // Get the position of the popover relative to the offset parent.\n const popoverOffset = toRelativePosition(boundingOffset, containingBlockRect);\n\n // Cache the distance between the trigger and the popover (which stays the same as you scroll),\n // and use that to recalculate the new popover position.\n const trackRelativeOffset = toRelativePosition(popoverOffset, toRelativePosition(trackRect, containingBlockRect));\n\n // Bring back the container to its original position to prevent any flashing.\n popover.style.top = prevTop;\n popover.style.left = prevLeft;\n\n // Allow popover body to scroll if can't fit the popover into the container/viewport otherwise.\n if (scrollable) {\n body.style.maxHeight = boundingOffset.height + 'px';\n body.style.overflowX = 'hidden';\n body.style.overflowY = 'auto';\n }\n\n // Position the popover\n setInternalPosition(newInternalPosition);\n setPopoverStyle({ top: popoverOffset.top, left: popoverOffset.left });\n\n positionHandlerRef.current = () => {\n const newTrackOffset = toRelativePosition(\n track.getBoundingClientRect(),\n containingBlock ? containingBlock.getBoundingClientRect() : viewportRect\n );\n setPopoverStyle({\n top: newTrackOffset.top + trackRelativeOffset.top,\n left: newTrackOffset.left + trackRelativeOffset.left,\n });\n };\n }, [position, trackRef, renderWithPortal]);\n\n // Recalculate position when properties change.\n useLayoutEffect(() => {\n updatePositionHandler();\n }, [updatePositionHandler, trackKey]);\n\n // Recalculate position when content size changes.\n useResizeObserver(contentRef, () => updatePositionHandler());\n\n // Recalculate position on DOM events.\n useLayoutEffect(() => {\n /*\n This is a heuristic. Some layout changes are caused by user clicks (e.g. toggling the tools panel, submitting a form),\n and by tracking the click event we can adapt the popover's position to the new layout.\n\n TODO: extend this to Enter and Spacebar?\n */\n const updatePosition = () => requestAnimationFrame(() => updatePositionHandler());\n const refreshPosition = () => requestAnimationFrame(() => positionHandlerRef.current());\n\n window.addEventListener('click', updatePosition);\n window.addEventListener('resize', updatePosition);\n window.addEventListener('scroll', refreshPosition, true);\n return () => {\n window.removeEventListener('click', updatePosition);\n window.removeEventListener('resize', updatePosition);\n window.removeEventListener('scroll', refreshPosition, true);\n };\n }, [updatePositionHandler]);\n\n return (\n <div\n ref={popoverRef}\n style={{ ...popoverStyle, zIndex }}\n className={clsx(styles.container, isRefresh && styles.refresh)}\n >\n <div\n ref={arrowRef}\n className={clsx(styles[`container-arrow`], styles[`container-arrow-position-${internalPosition}`])}\n aria-hidden={true}\n >\n {arrow(internalPosition)}\n </div>\n\n <div\n ref={bodyRef}\n className={clsx(styles['container-body'], styles[`container-body-size-${size}`], {\n [styles['fixed-width']]: fixedWidth,\n [styles[`container-body-variant-${variant}`]]: variant,\n })}\n >\n <div ref={contentRef}>{children}</div>\n </div>\n </div>\n );\n}\n\nfunction getBorderWidth(element: HTMLElement) {\n return parseInt(getComputedStyle(element).borderWidth) || 0;\n}\n\n/**\n * Convert a viewport-relative offset to an element-relative offset.\n */\nfunction toRelativePosition(element: Offset, parent: Offset): Offset {\n return {\n top: element.top - parent.top,\n left: element.left - parent.left,\n };\n}\n\n/**\n * Get a BoundingOffset that represents the visible viewport.\n */\nfunction getViewportRect(window: Window): BoundingOffset {\n return {\n top: 0,\n left: 0,\n width: window.innerWidth,\n height: window.innerHeight,\n };\n}\n\nfunction getDocumentRect(document: Document): BoundingOffset {\n const { top, left } = document.documentElement.getBoundingClientRect();\n return {\n top,\n left,\n width: document.documentElement.scrollWidth,\n height: document.documentElement.scrollHeight,\n };\n}\n"]}
1
+ {"version":3,"file":"container.js","sourceRoot":"","sources":["../../../src/popover/container.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { CSSProperties, useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { getContainingBlock, nodeContains } from '../internal/utils/dom';\nimport { useResizeObserver } from '../internal/hooks/container-queries';\nimport { BoundingOffset, InternalPosition, Offset, PopoverProps } from './interfaces';\nimport { calculatePosition } from './utils/positions';\nimport styles from './styles.css.js';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nexport interface PopoverContainerProps {\n /** References the element the container is positioned against. */\n trackRef: React.RefObject<Element>;\n /**\n Used to update the container position in case track or track position changes:\n \n const trackRef = useRef<Element>(null)\n return (<>\n <Track style={getPosition(selectedItemId)} ref={trackRef} />\n <PopoverContainer trackRef={trackRef} trackKey={selectedItemId} .../>\n </>)\n */\n trackKey?: string | number;\n position: PopoverProps.Position;\n zIndex?: React.CSSProperties['zIndex'];\n arrow: (position: InternalPosition | null) => React.ReactNode;\n children: React.ReactNode;\n renderWithPortal?: boolean;\n size: PopoverProps.Size;\n fixedWidth: boolean;\n variant?: 'annotation';\n}\n\nconst INITIAL_STYLES: CSSProperties = { position: 'absolute', top: -9999, left: -9999 };\n\nexport default function PopoverContainer({\n position,\n trackRef,\n trackKey,\n arrow,\n children,\n zIndex,\n renderWithPortal,\n size,\n fixedWidth,\n variant,\n}: PopoverContainerProps) {\n const bodyRef = useRef<HTMLDivElement | null>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n const popoverRef = useRef<HTMLDivElement | null>(null);\n const arrowRef = useRef<HTMLDivElement | null>(null);\n\n const [popoverStyle, setPopoverStyle] = useState<CSSProperties>(INITIAL_STYLES);\n const [internalPosition, setInternalPosition] = useState<InternalPosition | null>(null);\n const isRefresh = useVisualRefresh();\n\n // Store the handler in a ref so that it can still be replaced from outside of the listener closure.\n const positionHandlerRef = useRef<() => void>(() => {});\n\n // Updates the position handler.\n const updatePositionHandler = useCallback(() => {\n if (!trackRef.current || !popoverRef.current || !bodyRef.current || !contentRef.current || !arrowRef.current) {\n return;\n }\n\n // Get important elements\n const popover = popoverRef.current;\n const body = bodyRef.current;\n const arrow = arrowRef.current;\n const document = popover.ownerDocument;\n const track = trackRef.current;\n\n // If the popover body isn't being rendered for whatever reason (e.g. \"display: none\" or JSDOM),\n // or track does not belong to the document - bail on calculating dimensions.\n if (popover.offsetWidth === 0 || popover.offsetHeight === 0 || !nodeContains(document.body, track)) {\n return;\n }\n\n // Imperatively move body off-screen to give it room to expand.\n // Not doing this in React because this recalculation should happen\n // in the span of a single frame without rerendering anything.\n const prevTop = popover.style.top;\n const prevLeft = popover.style.left;\n popover.style.top = '0';\n popover.style.left = '0';\n // Imperatively remove body styles that can remain from the previous computation.\n body.style.maxHeight = '';\n body.style.overflowX = '';\n body.style.overflowY = '';\n\n // Get rects representing key elements\n // Use getComputedStyle for arrowRect to avoid modifications made by transform\n const viewportRect = getViewportRect(document.defaultView!);\n const trackRect = track.getBoundingClientRect();\n const arrowRect = {\n width: parseFloat(getComputedStyle(arrow).width),\n height: parseFloat(getComputedStyle(arrow).height),\n };\n const containingBlock = getContainingBlock(popover);\n const containingBlockRect = containingBlock ? containingBlock.getBoundingClientRect() : viewportRect;\n\n const bodyBorderWidth = getBorderWidth(body);\n const contentRect = contentRef.current.getBoundingClientRect();\n const contentBoundingBox = {\n width: contentRect.width + 2 * bodyBorderWidth,\n height: contentRect.height + 2 * bodyBorderWidth,\n };\n\n // Calculate the arrow direction and viewport-relative position of the popover.\n const {\n scrollable,\n internalPosition: newInternalPosition,\n boundingOffset,\n } = calculatePosition(\n position,\n trackRect,\n arrowRect,\n contentBoundingBox,\n containingBlock ? containingBlockRect : getDocumentRect(document),\n viewportRect,\n renderWithPortal\n );\n\n // Get the position of the popover relative to the offset parent.\n const popoverOffset = toRelativePosition(boundingOffset, containingBlockRect);\n\n // Cache the distance between the trigger and the popover (which stays the same as you scroll),\n // and use that to recalculate the new popover position.\n const trackRelativeOffset = toRelativePosition(popoverOffset, toRelativePosition(trackRect, containingBlockRect));\n\n // Bring back the container to its original position to prevent any flashing.\n popover.style.top = prevTop;\n popover.style.left = prevLeft;\n\n // Allow popover body to scroll if can't fit the popover into the container/viewport otherwise.\n if (scrollable) {\n body.style.maxHeight = boundingOffset.height + 'px';\n body.style.overflowX = 'hidden';\n body.style.overflowY = 'auto';\n }\n\n // Position the popover\n setInternalPosition(newInternalPosition);\n setPopoverStyle({ top: popoverOffset.top, left: popoverOffset.left });\n\n positionHandlerRef.current = () => {\n const newTrackOffset = toRelativePosition(\n track.getBoundingClientRect(),\n containingBlock ? containingBlock.getBoundingClientRect() : viewportRect\n );\n setPopoverStyle({\n top: newTrackOffset.top + trackRelativeOffset.top,\n left: newTrackOffset.left + trackRelativeOffset.left,\n });\n };\n }, [position, trackRef, renderWithPortal]);\n\n // Recalculate position when properties change.\n useLayoutEffect(() => {\n updatePositionHandler();\n }, [updatePositionHandler, trackKey]);\n\n // Recalculate position when content size changes.\n useResizeObserver(contentRef, () => updatePositionHandler());\n\n // Recalculate position on DOM events.\n useLayoutEffect(() => {\n /*\n This is a heuristic. Some layout changes are caused by user clicks (e.g. toggling the tools panel, submitting a form),\n and by tracking the click event we can adapt the popover's position to the new layout.\n\n TODO: extend this to Enter and Spacebar?\n */\n const updatePosition = () => requestAnimationFrame(() => updatePositionHandler());\n const refreshPosition = () => requestAnimationFrame(() => positionHandlerRef.current());\n\n window.addEventListener('click', updatePosition);\n window.addEventListener('resize', updatePosition);\n window.addEventListener('scroll', refreshPosition, true);\n return () => {\n window.removeEventListener('click', updatePosition);\n window.removeEventListener('resize', updatePosition);\n window.removeEventListener('scroll', refreshPosition, true);\n };\n }, [updatePositionHandler]);\n\n return (\n <div\n ref={popoverRef}\n style={{ ...popoverStyle, zIndex }}\n className={clsx(styles.container, isRefresh && styles.refresh)}\n >\n <div\n ref={arrowRef}\n className={clsx(styles[`container-arrow`], styles[`container-arrow-position-${internalPosition}`])}\n aria-hidden={true}\n >\n {arrow(internalPosition)}\n </div>\n\n <div\n ref={bodyRef}\n className={clsx(styles['container-body'], styles[`container-body-size-${size}`], {\n [styles['fixed-width']]: fixedWidth,\n [styles[`container-body-variant-${variant}`]]: variant,\n })}\n >\n <div ref={contentRef}>{children}</div>\n </div>\n </div>\n );\n}\n\nfunction getBorderWidth(element: HTMLElement) {\n return parseInt(getComputedStyle(element).borderWidth) || 0;\n}\n\n/**\n * Convert a viewport-relative offset to an element-relative offset.\n */\nfunction toRelativePosition(element: Offset, parent: Offset): Offset {\n return {\n top: element.top - parent.top,\n left: element.left - parent.left,\n };\n}\n\n/**\n * Get a BoundingOffset that represents the visible viewport.\n */\nfunction getViewportRect(window: Window): BoundingOffset {\n return {\n top: 0,\n left: 0,\n width: window.innerWidth,\n height: window.innerHeight,\n };\n}\n\nfunction getDocumentRect(document: Document): BoundingOffset {\n const { top, left } = document.documentElement.getBoundingClientRect();\n return {\n top,\n left,\n width: document.documentElement.scrollWidth,\n height: document.documentElement.scrollHeight,\n };\n}\n"]}
package/popover/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { __assign, __rest } from "tslib";
1
+ import { __rest } from "tslib";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
4
  import React from 'react';
@@ -9,15 +9,15 @@ import useBaseComponent from '../internal/hooks/use-base-component';
9
9
  import { isDevelopment } from '../internal/is-development';
10
10
  import { warnOnce } from '../internal/logging';
11
11
  export default function Popover(_a) {
12
- var _b = _a.position, position = _b === void 0 ? 'right' : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.fixedWidth, fixedWidth = _d === void 0 ? false : _d, _e = _a.triggerType, triggerType = _e === void 0 ? 'text' : _e, _f = _a.dismissButton, dismissButton = _f === void 0 ? true : _f, _g = _a.renderWithPortal, renderWithPortal = _g === void 0 ? false : _g, header = _a.header, rest = __rest(_a, ["position", "size", "fixedWidth", "triggerType", "dismissButton", "renderWithPortal", "header"]);
12
+ var { position = 'right', size = 'medium', fixedWidth = false, triggerType = 'text', dismissButton = true, renderWithPortal = false, header } = _a, rest = __rest(_a, ["position", "size", "fixedWidth", "triggerType", "dismissButton", "renderWithPortal", "header"]);
13
13
  if (isDevelopment) {
14
14
  if (dismissButton && !header) {
15
- warnOnce('Popover', "You should provide a `header` when `dismissButton` is true.");
15
+ warnOnce('Popover', `You should provide a \`header\` when \`dismissButton\` is true.`);
16
16
  }
17
17
  }
18
- var baseComponentProps = useBaseComponent('Popover');
19
- var externalProps = getExternalProps(rest);
20
- return (React.createElement(InternalPopover, __assign({ header: header, position: position, size: size, fixedWidth: fixedWidth, triggerType: triggerType, dismissButton: dismissButton, renderWithPortal: renderWithPortal }, externalProps, baseComponentProps)));
18
+ const baseComponentProps = useBaseComponent('Popover');
19
+ const externalProps = getExternalProps(rest);
20
+ return (React.createElement(InternalPopover, Object.assign({ header: header, position: position, size: size, fixedWidth: fixedWidth, triggerType: triggerType, dismissButton: dismissButton, renderWithPortal: renderWithPortal }, externalProps, baseComponentProps)));
21
21
  }
22
22
  applyDisplayName(Popover, 'Popover');
23
23
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/popover/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,MAAM,YAAY,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAK/C,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EASjB;IARb,IAAA,gBAAkB,EAAlB,QAAQ,mBAAG,OAAO,KAAA,EAClB,YAAe,EAAf,IAAI,mBAAG,QAAQ,KAAA,EACf,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,mBAAoB,EAApB,WAAW,mBAAG,MAAM,KAAA,EACpB,qBAAoB,EAApB,aAAa,mBAAG,IAAI,KAAA,EACpB,wBAAwB,EAAxB,gBAAgB,mBAAG,KAAK,KAAA,EACxB,MAAM,YAAA,EACH,IAAI,cARuB,gGAS/B,CADQ;IAEP,IAAI,aAAa,EAAE;QACjB,IAAI,aAAa,IAAI,CAAC,MAAM,EAAE;YAC5B,QAAQ,CAAC,SAAS,EAAE,6DAAiE,CAAC,CAAC;SACxF;KACF;IAED,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC;IACvD,IAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC7C,OAAO,CACL,oBAAC,eAAe,aACd,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,gBAAgB,IAC9B,aAAa,EACb,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalPopover from './internal';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\nimport { PopoverProps } from './interfaces';\n\nexport { PopoverProps };\n\nexport default function Popover({\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n renderWithPortal = false,\n header,\n ...rest\n}: PopoverProps) {\n if (isDevelopment) {\n if (dismissButton && !header) {\n warnOnce('Popover', `You should provide a \\`header\\` when \\`dismissButton\\` is true.`);\n }\n }\n\n const baseComponentProps = useBaseComponent('Popover');\n const externalProps = getExternalProps(rest);\n return (\n <InternalPopover\n header={header}\n position={position}\n size={size}\n fixedWidth={fixedWidth}\n triggerType={triggerType}\n dismissButton={dismissButton}\n renderWithPortal={renderWithPortal}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(Popover, 'Popover');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/popover/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,MAAM,YAAY,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAK/C,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EASjB;QATiB,EAC9B,QAAQ,GAAG,OAAO,EAClB,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,MAAM,EACpB,aAAa,GAAG,IAAI,EACpB,gBAAgB,GAAG,KAAK,EACxB,MAAM,OAEO,EADV,IAAI,cARuB,gGAS/B,CADQ;IAEP,IAAI,aAAa,EAAE;QACjB,IAAI,aAAa,IAAI,CAAC,MAAM,EAAE;YAC5B,QAAQ,CAAC,SAAS,EAAE,iEAAiE,CAAC,CAAC;SACxF;KACF;IAED,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC;IACvD,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC7C,OAAO,CACL,oBAAC,eAAe,kBACd,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,gBAAgB,IAC9B,aAAa,EACb,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalPopover from './internal';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\nimport { PopoverProps } from './interfaces';\n\nexport { PopoverProps };\n\nexport default function Popover({\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n renderWithPortal = false,\n header,\n ...rest\n}: PopoverProps) {\n if (isDevelopment) {\n if (dismissButton && !header) {\n warnOnce('Popover', `You should provide a \\`header\\` when \\`dismissButton\\` is true.`);\n }\n }\n\n const baseComponentProps = useBaseComponent('Popover');\n const externalProps = getExternalProps(rest);\n return (\n <InternalPopover\n header={header}\n position={position}\n size={size}\n fixedWidth={fixedWidth}\n triggerType={triggerType}\n dismissButton={dismissButton}\n renderWithPortal={renderWithPortal}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(Popover, 'Popover');\n"]}