@cloudscape-design/components-themeable 3.0.663 → 3.0.665

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 (515) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/app-layout/visual-refresh/background.scss +0 -19
  3. package/lib/internal/scss/app-layout/visual-refresh/breadcrumbs.scss +0 -10
  4. package/lib/internal/scss/app-layout/visual-refresh/drawers.scss +0 -2
  5. package/lib/internal/scss/app-layout/visual-refresh/layout.scss +0 -9
  6. package/lib/internal/scss/app-layout/visual-refresh/notifications.scss +11 -1
  7. package/lib/internal/scss/app-layout/visual-refresh/tools.scss +0 -2
  8. package/lib/internal/scss/box/styles.scss +2 -5
  9. package/lib/internal/scss/button-dropdown/item-element/styles.scss +2 -1
  10. package/lib/internal/scss/code-editor/background-inline-svg.scss +0 -2
  11. package/lib/internal/scss/container/styles.scss +10 -2
  12. package/lib/internal/scss/drawer/styles.scss +2 -1
  13. package/lib/internal/scss/flashbar/collapsible.scss +0 -1
  14. package/lib/internal/scss/help-panel/styles.scss +11 -2
  15. package/lib/internal/scss/icon/mixins.scss +2 -1
  16. package/lib/internal/scss/input/styles.scss +2 -2
  17. package/lib/internal/scss/internal/components/abstract-switch/styles.scss +2 -2
  18. package/lib/internal/scss/internal/components/chart-popover-footer/styles.scss +1 -1
  19. package/lib/internal/scss/internal/components/token-list/styles.scss +0 -1
  20. package/lib/internal/scss/internal/styles/direction.scss +1 -2
  21. package/lib/internal/scss/internal/styles/forms/mixins.scss +2 -1
  22. package/lib/internal/scss/popover/body.scss +1 -2
  23. package/lib/internal/scss/popover/styles.scss +5 -0
  24. package/lib/internal/scss/s3-resource-selector/s3-in-context/styles.scss +1 -1
  25. package/lib/internal/scss/split-panel/styles.scss +0 -1
  26. package/lib/internal/scss/table/styles.scss +0 -2
  27. package/lib/internal/scss/textarea/styles.scss +1 -1
  28. package/lib/internal/scss/token-group/styles.scss +0 -1
  29. package/lib/internal/scss/tutorial-panel/components/tutorial-list/styles.scss +0 -1
  30. package/lib/internal/scss/wizard/styles.scss +4 -1
  31. package/lib/internal/template/alert/styles.css.js +25 -25
  32. package/lib/internal/template/alert/styles.scoped.css +39 -41
  33. package/lib/internal/template/alert/styles.selectors.js +25 -25
  34. package/lib/internal/template/anchor-navigation/styles.css.js +8 -8
  35. package/lib/internal/template/anchor-navigation/styles.scoped.css +18 -20
  36. package/lib/internal/template/anchor-navigation/styles.selectors.js +8 -8
  37. package/lib/internal/template/annotation-context/annotation/styles.css.js +24 -24
  38. package/lib/internal/template/annotation-context/annotation/styles.scoped.css +31 -32
  39. package/lib/internal/template/annotation-context/annotation/styles.selectors.js +24 -24
  40. package/lib/internal/template/app-layout/content-wrapper/styles.css.js +3 -3
  41. package/lib/internal/template/app-layout/content-wrapper/styles.scoped.css +6 -8
  42. package/lib/internal/template/app-layout/content-wrapper/styles.selectors.js +3 -3
  43. package/lib/internal/template/app-layout/drawer/index.js +2 -2
  44. package/lib/internal/template/app-layout/drawer/index.js.map +1 -1
  45. package/lib/internal/template/app-layout/drawer/styles.css.js +13 -13
  46. package/lib/internal/template/app-layout/drawer/styles.scoped.css +21 -23
  47. package/lib/internal/template/app-layout/drawer/styles.selectors.js +13 -13
  48. package/lib/internal/template/app-layout/mobile-toolbar/index.js +1 -1
  49. package/lib/internal/template/app-layout/mobile-toolbar/index.js.map +1 -1
  50. package/lib/internal/template/app-layout/mobile-toolbar/styles.css.js +8 -8
  51. package/lib/internal/template/app-layout/mobile-toolbar/styles.scoped.css +8 -10
  52. package/lib/internal/template/app-layout/mobile-toolbar/styles.selectors.js +8 -8
  53. package/lib/internal/template/app-layout/skeleton/styles.css.js +11 -11
  54. package/lib/internal/template/app-layout/skeleton/styles.scoped.css +20 -22
  55. package/lib/internal/template/app-layout/skeleton/styles.selectors.js +11 -11
  56. package/lib/internal/template/app-layout/split-panel/styles.css.js +2 -2
  57. package/lib/internal/template/app-layout/split-panel/styles.scoped.css +2 -4
  58. package/lib/internal/template/app-layout/split-panel/styles.selectors.js +2 -2
  59. package/lib/internal/template/app-layout/styles.css.js +16 -16
  60. package/lib/internal/template/app-layout/styles.scoped.css +19 -21
  61. package/lib/internal/template/app-layout/styles.selectors.js +16 -16
  62. package/lib/internal/template/app-layout/toggles/styles.css.js +2 -2
  63. package/lib/internal/template/app-layout/toggles/styles.scoped.css +6 -8
  64. package/lib/internal/template/app-layout/toggles/styles.selectors.js +2 -2
  65. package/lib/internal/template/app-layout/utils/sticky-offsets.d.ts +1 -1
  66. package/lib/internal/template/app-layout/utils/sticky-offsets.d.ts.map +1 -1
  67. package/lib/internal/template/app-layout/utils/sticky-offsets.js +2 -2
  68. package/lib/internal/template/app-layout/utils/sticky-offsets.js.map +1 -1
  69. package/lib/internal/template/app-layout/visual-refresh/background.d.ts.map +1 -1
  70. package/lib/internal/template/app-layout/visual-refresh/background.js +2 -5
  71. package/lib/internal/template/app-layout/visual-refresh/background.js.map +1 -1
  72. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.d.ts.map +1 -1
  73. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.js +1 -2
  74. package/lib/internal/template/app-layout/visual-refresh/breadcrumbs.js.map +1 -1
  75. package/lib/internal/template/app-layout/visual-refresh/context.d.ts +0 -2
  76. package/lib/internal/template/app-layout/visual-refresh/context.d.ts.map +1 -1
  77. package/lib/internal/template/app-layout/visual-refresh/context.js +2 -7
  78. package/lib/internal/template/app-layout/visual-refresh/context.js.map +1 -1
  79. package/lib/internal/template/app-layout/visual-refresh/drawers.js +2 -2
  80. package/lib/internal/template/app-layout/visual-refresh/drawers.js.map +1 -1
  81. package/lib/internal/template/app-layout/visual-refresh/layout.d.ts.map +1 -1
  82. package/lib/internal/template/app-layout/visual-refresh/layout.js +1 -3
  83. package/lib/internal/template/app-layout/visual-refresh/layout.js.map +1 -1
  84. package/lib/internal/template/app-layout/visual-refresh/main.d.ts.map +1 -1
  85. package/lib/internal/template/app-layout/visual-refresh/main.js +2 -4
  86. package/lib/internal/template/app-layout/visual-refresh/main.js.map +1 -1
  87. package/lib/internal/template/app-layout/visual-refresh/navigation.js +2 -2
  88. package/lib/internal/template/app-layout/visual-refresh/navigation.js.map +1 -1
  89. package/lib/internal/template/app-layout/visual-refresh/notifications.d.ts.map +1 -1
  90. package/lib/internal/template/app-layout/visual-refresh/notifications.js +3 -1
  91. package/lib/internal/template/app-layout/visual-refresh/notifications.js.map +1 -1
  92. package/lib/internal/template/app-layout/visual-refresh/styles.css.js +82 -83
  93. package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +169 -196
  94. package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js +82 -83
  95. package/lib/internal/template/app-layout/visual-refresh/tools.js +2 -2
  96. package/lib/internal/template/app-layout/visual-refresh/tools.js.map +1 -1
  97. package/lib/internal/template/app-layout/visual-refresh/trigger-button.js +1 -1
  98. package/lib/internal/template/app-layout/visual-refresh/trigger-button.js.map +1 -1
  99. package/lib/internal/template/app-layout/visual-refresh/use-background-overlap.d.ts +0 -6
  100. package/lib/internal/template/app-layout/visual-refresh/use-background-overlap.d.ts.map +1 -1
  101. package/lib/internal/template/app-layout/visual-refresh/use-background-overlap.js +0 -6
  102. package/lib/internal/template/app-layout/visual-refresh/use-background-overlap.js.map +1 -1
  103. package/lib/internal/template/area-chart/styles.css.js +6 -6
  104. package/lib/internal/template/area-chart/styles.scoped.css +9 -11
  105. package/lib/internal/template/area-chart/styles.selectors.js +6 -6
  106. package/lib/internal/template/attribute-editor/styles.css.js +14 -14
  107. package/lib/internal/template/attribute-editor/styles.scoped.css +24 -26
  108. package/lib/internal/template/attribute-editor/styles.selectors.js +14 -14
  109. package/lib/internal/template/badge/styles.css.js +5 -5
  110. package/lib/internal/template/badge/styles.scoped.css +5 -7
  111. package/lib/internal/template/badge/styles.selectors.js +5 -5
  112. package/lib/internal/template/box/styles.css.js +191 -191
  113. package/lib/internal/template/box/styles.scoped.css +248 -446
  114. package/lib/internal/template/box/styles.selectors.js +191 -191
  115. package/lib/internal/template/breadcrumb-group/item/styles.css.js +8 -8
  116. package/lib/internal/template/breadcrumb-group/item/styles.scoped.css +16 -18
  117. package/lib/internal/template/breadcrumb-group/item/styles.selectors.js +8 -8
  118. package/lib/internal/template/breadcrumb-group/styles.css.js +7 -7
  119. package/lib/internal/template/breadcrumb-group/styles.scoped.css +12 -14
  120. package/lib/internal/template/breadcrumb-group/styles.selectors.js +7 -7
  121. package/lib/internal/template/button/styles.css.js +19 -19
  122. package/lib/internal/template/button/styles.scoped.css +153 -155
  123. package/lib/internal/template/button/styles.selectors.js +19 -19
  124. package/lib/internal/template/button-dropdown/category-elements/category-element.js +1 -1
  125. package/lib/internal/template/button-dropdown/category-elements/category-element.js.map +1 -1
  126. package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js +1 -1
  127. package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
  128. package/lib/internal/template/button-dropdown/category-elements/styles.css.js +14 -14
  129. package/lib/internal/template/button-dropdown/category-elements/styles.scoped.css +24 -25
  130. package/lib/internal/template/button-dropdown/category-elements/styles.selectors.js +14 -14
  131. package/lib/internal/template/button-dropdown/item-element/styles.css.js +11 -11
  132. package/lib/internal/template/button-dropdown/item-element/styles.scoped.css +16 -17
  133. package/lib/internal/template/button-dropdown/item-element/styles.selectors.js +11 -11
  134. package/lib/internal/template/button-dropdown/mobile-expandable-group/mobile-expandable-group.js +1 -1
  135. package/lib/internal/template/button-dropdown/mobile-expandable-group/mobile-expandable-group.js.map +1 -1
  136. package/lib/internal/template/button-dropdown/mobile-expandable-group/styles.css.js +5 -5
  137. package/lib/internal/template/button-dropdown/mobile-expandable-group/styles.scoped.css +5 -7
  138. package/lib/internal/template/button-dropdown/mobile-expandable-group/styles.selectors.js +5 -5
  139. package/lib/internal/template/button-dropdown/styles.css.js +15 -15
  140. package/lib/internal/template/button-dropdown/styles.scoped.css +22 -24
  141. package/lib/internal/template/button-dropdown/styles.selectors.js +15 -15
  142. package/lib/internal/template/calendar/styles.css.js +20 -20
  143. package/lib/internal/template/calendar/styles.scoped.css +42 -44
  144. package/lib/internal/template/calendar/styles.selectors.js +20 -20
  145. package/lib/internal/template/cards/styles.css.js +39 -39
  146. package/lib/internal/template/cards/styles.scoped.css +50 -52
  147. package/lib/internal/template/cards/styles.selectors.js +39 -39
  148. package/lib/internal/template/checkbox/styles.css.js +3 -3
  149. package/lib/internal/template/checkbox/styles.scoped.css +5 -7
  150. package/lib/internal/template/checkbox/styles.selectors.js +3 -3
  151. package/lib/internal/template/code-editor/resizable-box/styles.css.js +3 -3
  152. package/lib/internal/template/code-editor/resizable-box/styles.scoped.css +8 -10
  153. package/lib/internal/template/code-editor/resizable-box/styles.selectors.js +3 -3
  154. package/lib/internal/template/code-editor/styles.css.js +32 -32
  155. package/lib/internal/template/code-editor/styles.scoped.css +177 -211
  156. package/lib/internal/template/code-editor/styles.selectors.js +32 -32
  157. package/lib/internal/template/collection-preferences/content-display/styles.css.js +11 -11
  158. package/lib/internal/template/collection-preferences/content-display/styles.scoped.css +17 -21
  159. package/lib/internal/template/collection-preferences/content-display/styles.selectors.js +11 -11
  160. package/lib/internal/template/collection-preferences/styles.css.js +37 -37
  161. package/lib/internal/template/collection-preferences/styles.scoped.css +44 -52
  162. package/lib/internal/template/collection-preferences/styles.selectors.js +37 -37
  163. package/lib/internal/template/column-layout/styles.css.js +13 -13
  164. package/lib/internal/template/column-layout/styles.scoped.css +43 -45
  165. package/lib/internal/template/column-layout/styles.selectors.js +13 -13
  166. package/lib/internal/template/container/internal.d.ts.map +1 -1
  167. package/lib/internal/template/container/internal.js +7 -25
  168. package/lib/internal/template/container/internal.js.map +1 -1
  169. package/lib/internal/template/container/styles.css.js +30 -29
  170. package/lib/internal/template/container/styles.scoped.css +60 -55
  171. package/lib/internal/template/container/styles.selectors.js +30 -29
  172. package/lib/internal/template/container/use-sticky-header.d.ts +3 -2
  173. package/lib/internal/template/container/use-sticky-header.d.ts.map +1 -1
  174. package/lib/internal/template/container/use-sticky-header.js +5 -3
  175. package/lib/internal/template/container/use-sticky-header.js.map +1 -1
  176. package/lib/internal/template/content-layout/internal.js +2 -2
  177. package/lib/internal/template/content-layout/internal.js.map +1 -1
  178. package/lib/internal/template/content-layout/styles.css.js +14 -14
  179. package/lib/internal/template/content-layout/styles.scoped.css +16 -18
  180. package/lib/internal/template/content-layout/styles.selectors.js +14 -14
  181. package/lib/internal/template/date-picker/styles.css.js +7 -7
  182. package/lib/internal/template/date-picker/styles.scoped.css +9 -11
  183. package/lib/internal/template/date-picker/styles.selectors.js +7 -7
  184. package/lib/internal/template/date-range-picker/calendar/grids/styles.css.js +27 -27
  185. package/lib/internal/template/date-range-picker/calendar/grids/styles.scoped.css +42 -44
  186. package/lib/internal/template/date-range-picker/calendar/grids/styles.selectors.js +27 -27
  187. package/lib/internal/template/date-range-picker/relative-range/styles.css.js +9 -9
  188. package/lib/internal/template/date-range-picker/relative-range/styles.scoped.css +13 -15
  189. package/lib/internal/template/date-range-picker/relative-range/styles.selectors.js +9 -9
  190. package/lib/internal/template/date-range-picker/styles.css.js +39 -39
  191. package/lib/internal/template/date-range-picker/styles.scoped.css +48 -50
  192. package/lib/internal/template/date-range-picker/styles.selectors.js +39 -39
  193. package/lib/internal/template/drawer/implementation.js +2 -2
  194. package/lib/internal/template/drawer/implementation.js.map +1 -1
  195. package/lib/internal/template/drawer/styles.css.js +3 -3
  196. package/lib/internal/template/drawer/styles.scoped.css +10 -11
  197. package/lib/internal/template/drawer/styles.selectors.js +3 -3
  198. package/lib/internal/template/expandable-section/styles.css.js +32 -32
  199. package/lib/internal/template/expandable-section/styles.scoped.css +65 -66
  200. package/lib/internal/template/expandable-section/styles.selectors.js +32 -32
  201. package/lib/internal/template/file-upload/dropzone/styles.css.js +2 -2
  202. package/lib/internal/template/file-upload/dropzone/styles.scoped.css +2 -4
  203. package/lib/internal/template/file-upload/dropzone/styles.selectors.js +2 -2
  204. package/lib/internal/template/file-upload/file-input/styles.css.js +4 -4
  205. package/lib/internal/template/file-upload/file-input/styles.scoped.css +7 -9
  206. package/lib/internal/template/file-upload/file-input/styles.selectors.js +4 -4
  207. package/lib/internal/template/flashbar/styles.css.js +47 -47
  208. package/lib/internal/template/flashbar/styles.scoped.css +146 -154
  209. package/lib/internal/template/flashbar/styles.selectors.js +47 -47
  210. package/lib/internal/template/form/styles.css.js +8 -8
  211. package/lib/internal/template/form/styles.scoped.css +8 -10
  212. package/lib/internal/template/form/styles.selectors.js +8 -8
  213. package/lib/internal/template/form-field/styles.css.js +24 -24
  214. package/lib/internal/template/form-field/styles.scoped.css +38 -40
  215. package/lib/internal/template/form-field/styles.selectors.js +24 -24
  216. package/lib/internal/template/grid/styles.css.js +53 -53
  217. package/lib/internal/template/grid/styles.scoped.css +54 -56
  218. package/lib/internal/template/grid/styles.selectors.js +53 -53
  219. package/lib/internal/template/header/styles.css.js +34 -34
  220. package/lib/internal/template/header/styles.scoped.css +50 -52
  221. package/lib/internal/template/header/styles.selectors.js +34 -34
  222. package/lib/internal/template/help-panel/implementation.js +2 -2
  223. package/lib/internal/template/help-panel/implementation.js.map +1 -1
  224. package/lib/internal/template/help-panel/styles.css.js +4 -4
  225. package/lib/internal/template/help-panel/styles.scoped.css +78 -68
  226. package/lib/internal/template/help-panel/styles.selectors.js +4 -4
  227. package/lib/internal/template/hotspot/styles.css.js +7 -7
  228. package/lib/internal/template/hotspot/styles.scoped.css +7 -9
  229. package/lib/internal/template/hotspot/styles.selectors.js +7 -7
  230. package/lib/internal/template/icon/icons.js +1 -1
  231. package/lib/internal/template/icon/interfaces.d.ts +1 -1
  232. package/lib/internal/template/icon/interfaces.d.ts.map +1 -1
  233. package/lib/internal/template/icon/interfaces.js.map +1 -1
  234. package/lib/internal/template/icon/styles.css.js +37 -37
  235. package/lib/internal/template/icon/styles.scoped.css +84 -67
  236. package/lib/internal/template/icon/styles.selectors.js +37 -37
  237. package/lib/internal/template/input/styles.css.js +13 -13
  238. package/lib/internal/template/input/styles.scoped.css +34 -36
  239. package/lib/internal/template/input/styles.selectors.js +13 -13
  240. package/lib/internal/template/internal/analytics/index.d.ts +7 -1
  241. package/lib/internal/template/internal/analytics/index.d.ts.map +1 -1
  242. package/lib/internal/template/internal/analytics/index.js +10 -0
  243. package/lib/internal/template/internal/analytics/index.js.map +1 -1
  244. package/lib/internal/template/internal/analytics/interfaces.d.ts +12 -0
  245. package/lib/internal/template/internal/analytics/interfaces.d.ts.map +1 -1
  246. package/lib/internal/template/internal/analytics/interfaces.js.map +1 -1
  247. package/lib/internal/template/internal/base-component/index.d.ts +5 -3
  248. package/lib/internal/template/internal/base-component/index.d.ts.map +1 -1
  249. package/lib/internal/template/internal/base-component/index.js.map +1 -1
  250. package/lib/internal/template/internal/components/abstract-switch/styles.css.js +13 -13
  251. package/lib/internal/template/internal/components/abstract-switch/styles.scoped.css +23 -26
  252. package/lib/internal/template/internal/components/abstract-switch/styles.selectors.js +13 -13
  253. package/lib/internal/template/internal/components/button-trigger/styles.css.js +11 -11
  254. package/lib/internal/template/internal/components/button-trigger/styles.scoped.css +26 -28
  255. package/lib/internal/template/internal/components/button-trigger/styles.selectors.js +11 -11
  256. package/lib/internal/template/internal/components/cartesian-chart/inline-start-labels.js +1 -1
  257. package/lib/internal/template/internal/components/cartesian-chart/inline-start-labels.js.map +1 -1
  258. package/lib/internal/template/internal/components/chart-filter/styles.css.js +3 -3
  259. package/lib/internal/template/internal/components/chart-filter/styles.scoped.css +3 -5
  260. package/lib/internal/template/internal/components/chart-filter/styles.selectors.js +3 -3
  261. package/lib/internal/template/internal/components/chart-legend/styles.css.js +6 -6
  262. package/lib/internal/template/internal/components/chart-legend/styles.scoped.css +15 -17
  263. package/lib/internal/template/internal/components/chart-legend/styles.selectors.js +6 -6
  264. package/lib/internal/template/internal/components/chart-plot/styles.css.js +5 -5
  265. package/lib/internal/template/internal/components/chart-plot/styles.scoped.css +5 -7
  266. package/lib/internal/template/internal/components/chart-plot/styles.selectors.js +5 -5
  267. package/lib/internal/template/internal/components/chart-popover/styles.css.js +3 -3
  268. package/lib/internal/template/internal/components/chart-popover/styles.scoped.css +3 -5
  269. package/lib/internal/template/internal/components/chart-popover/styles.selectors.js +3 -3
  270. package/lib/internal/template/internal/components/chart-popover-footer/styles.css.js +1 -1
  271. package/lib/internal/template/internal/components/chart-popover-footer/styles.scoped.css +3 -3
  272. package/lib/internal/template/internal/components/chart-popover-footer/styles.selectors.js +1 -1
  273. package/lib/internal/template/internal/components/chart-series-details/styles.css.js +20 -20
  274. package/lib/internal/template/internal/components/chart-series-details/styles.scoped.css +33 -35
  275. package/lib/internal/template/internal/components/chart-series-details/styles.selectors.js +20 -20
  276. package/lib/internal/template/internal/components/chart-series-marker/styles.css.js +5 -5
  277. package/lib/internal/template/internal/components/chart-series-marker/styles.scoped.css +7 -9
  278. package/lib/internal/template/internal/components/chart-series-marker/styles.selectors.js +5 -5
  279. package/lib/internal/template/internal/components/chart-wrapper/styles.css.js +9 -9
  280. package/lib/internal/template/internal/components/chart-wrapper/styles.scoped.css +9 -11
  281. package/lib/internal/template/internal/components/chart-wrapper/styles.selectors.js +9 -9
  282. package/lib/internal/template/internal/components/checkbox-icon/styles.css.js +7 -7
  283. package/lib/internal/template/internal/components/checkbox-icon/styles.scoped.css +8 -10
  284. package/lib/internal/template/internal/components/checkbox-icon/styles.selectors.js +7 -7
  285. package/lib/internal/template/internal/components/dropdown/styles.css.js +20 -20
  286. package/lib/internal/template/internal/components/dropdown/styles.scoped.css +41 -41
  287. package/lib/internal/template/internal/components/dropdown/styles.selectors.js +20 -20
  288. package/lib/internal/template/internal/components/dropdown-footer/styles.css.js +3 -3
  289. package/lib/internal/template/internal/components/dropdown-footer/styles.scoped.css +3 -5
  290. package/lib/internal/template/internal/components/dropdown-footer/styles.selectors.js +3 -3
  291. package/lib/internal/template/internal/components/dropdown-status/styles.css.js +2 -2
  292. package/lib/internal/template/internal/components/dropdown-status/styles.scoped.css +2 -4
  293. package/lib/internal/template/internal/components/dropdown-status/styles.selectors.js +2 -2
  294. package/lib/internal/template/internal/components/filtering-token/styles.css.js +7 -7
  295. package/lib/internal/template/internal/components/filtering-token/styles.scoped.css +13 -15
  296. package/lib/internal/template/internal/components/filtering-token/styles.selectors.js +7 -7
  297. package/lib/internal/template/internal/components/handle/styles.css.js +2 -2
  298. package/lib/internal/template/internal/components/handle/styles.scoped.css +6 -8
  299. package/lib/internal/template/internal/components/handle/styles.selectors.js +2 -2
  300. package/lib/internal/template/internal/components/menu-dropdown/styles.css.js +7 -7
  301. package/lib/internal/template/internal/components/menu-dropdown/styles.scoped.css +13 -15
  302. package/lib/internal/template/internal/components/menu-dropdown/styles.selectors.js +7 -7
  303. package/lib/internal/template/internal/components/option/highlight-match.d.ts.map +1 -1
  304. package/lib/internal/template/internal/components/option/highlight-match.js +1 -2
  305. package/lib/internal/template/internal/components/option/highlight-match.js.map +1 -1
  306. package/lib/internal/template/internal/components/option/index.js +2 -2
  307. package/lib/internal/template/internal/components/option/index.js.map +1 -1
  308. package/lib/internal/template/internal/components/option/styles.css.js +17 -17
  309. package/lib/internal/template/internal/components/option/styles.scoped.css +29 -31
  310. package/lib/internal/template/internal/components/option/styles.selectors.js +17 -17
  311. package/lib/internal/template/internal/components/options-list/styles.css.js +2 -2
  312. package/lib/internal/template/internal/components/options-list/styles.scoped.css +2 -4
  313. package/lib/internal/template/internal/components/options-list/styles.selectors.js +2 -2
  314. package/lib/internal/template/internal/components/panel-resize-handle/styles.css.js +5 -5
  315. package/lib/internal/template/internal/components/panel-resize-handle/styles.scoped.css +10 -12
  316. package/lib/internal/template/internal/components/panel-resize-handle/styles.selectors.js +5 -5
  317. package/lib/internal/template/internal/components/screenreader-only/styles.css.js +1 -1
  318. package/lib/internal/template/internal/components/screenreader-only/styles.scoped.css +1 -3
  319. package/lib/internal/template/internal/components/screenreader-only/styles.selectors.js +1 -1
  320. package/lib/internal/template/internal/components/selectable-item/styles.css.js +16 -16
  321. package/lib/internal/template/internal/components/selectable-item/styles.scoped.css +29 -31
  322. package/lib/internal/template/internal/components/selectable-item/styles.selectors.js +16 -16
  323. package/lib/internal/template/internal/components/token-list/styles.css.js +9 -9
  324. package/lib/internal/template/internal/components/token-list/styles.scoped.css +20 -23
  325. package/lib/internal/template/internal/components/token-list/styles.selectors.js +9 -9
  326. package/lib/internal/template/internal/context/reset-contexts-for-modal.d.ts.map +1 -1
  327. package/lib/internal/template/internal/context/reset-contexts-for-modal.js +6 -8
  328. package/lib/internal/template/internal/context/reset-contexts-for-modal.js.map +1 -1
  329. package/lib/internal/template/internal/context/single-tab-stop-navigation-context.d.ts +16 -2
  330. package/lib/internal/template/internal/context/single-tab-stop-navigation-context.d.ts.map +1 -1
  331. package/lib/internal/template/internal/context/single-tab-stop-navigation-context.js +51 -1
  332. package/lib/internal/template/internal/context/single-tab-stop-navigation-context.js.map +1 -1
  333. package/lib/internal/template/internal/environment.js +1 -1
  334. package/lib/internal/template/internal/environment.json +1 -1
  335. package/lib/internal/template/internal/hooks/use-table-interaction-metrics/index.d.ts +10 -0
  336. package/lib/internal/template/internal/hooks/use-table-interaction-metrics/index.d.ts.map +1 -0
  337. package/lib/internal/template/internal/hooks/use-table-interaction-metrics/index.js +47 -0
  338. package/lib/internal/template/internal/hooks/use-table-interaction-metrics/index.js.map +1 -0
  339. package/lib/internal/template/link/styles.css.js +20 -20
  340. package/lib/internal/template/link/styles.scoped.css +71 -73
  341. package/lib/internal/template/link/styles.selectors.js +20 -20
  342. package/lib/internal/template/mixed-line-bar-chart/styles.css.js +11 -11
  343. package/lib/internal/template/mixed-line-bar-chart/styles.scoped.css +17 -19
  344. package/lib/internal/template/mixed-line-bar-chart/styles.selectors.js +11 -11
  345. package/lib/internal/template/modal/styles.css.js +23 -23
  346. package/lib/internal/template/modal/styles.scoped.css +38 -40
  347. package/lib/internal/template/modal/styles.selectors.js +23 -23
  348. package/lib/internal/template/multiselect/styles.css.js +2 -2
  349. package/lib/internal/template/multiselect/styles.scoped.css +2 -4
  350. package/lib/internal/template/multiselect/styles.selectors.js +2 -2
  351. package/lib/internal/template/pagination/styles.css.js +9 -9
  352. package/lib/internal/template/pagination/styles.scoped.css +23 -25
  353. package/lib/internal/template/pagination/styles.selectors.js +9 -9
  354. package/lib/internal/template/pie-chart/styles.css.js +27 -27
  355. package/lib/internal/template/pie-chart/styles.scoped.css +48 -50
  356. package/lib/internal/template/pie-chart/styles.selectors.js +27 -27
  357. package/lib/internal/template/popover/index.d.ts +1 -1
  358. package/lib/internal/template/popover/index.d.ts.map +1 -1
  359. package/lib/internal/template/popover/index.js +2 -2
  360. package/lib/internal/template/popover/index.js.map +1 -1
  361. package/lib/internal/template/popover/interfaces.d.ts +5 -0
  362. package/lib/internal/template/popover/interfaces.d.ts.map +1 -1
  363. package/lib/internal/template/popover/interfaces.js.map +1 -1
  364. package/lib/internal/template/popover/internal.js +2 -2
  365. package/lib/internal/template/popover/internal.js.map +1 -1
  366. package/lib/internal/template/popover/styles.css.js +50 -49
  367. package/lib/internal/template/popover/styles.scoped.css +78 -78
  368. package/lib/internal/template/popover/styles.selectors.js +50 -49
  369. package/lib/internal/template/progress-bar/styles.css.js +19 -19
  370. package/lib/internal/template/progress-bar/styles.scoped.css +33 -37
  371. package/lib/internal/template/progress-bar/styles.selectors.js +19 -19
  372. package/lib/internal/template/property-filter/styles.css.js +32 -32
  373. package/lib/internal/template/property-filter/styles.scoped.css +34 -36
  374. package/lib/internal/template/property-filter/styles.selectors.js +32 -32
  375. package/lib/internal/template/radio-group/styles.css.js +9 -9
  376. package/lib/internal/template/radio-group/styles.scoped.css +15 -17
  377. package/lib/internal/template/radio-group/styles.selectors.js +9 -9
  378. package/lib/internal/template/s3-resource-selector/s3-in-context/styles.css.js +7 -7
  379. package/lib/internal/template/s3-resource-selector/s3-in-context/styles.scoped.css +9 -9
  380. package/lib/internal/template/s3-resource-selector/s3-in-context/styles.selectors.js +7 -7
  381. package/lib/internal/template/segmented-control/styles.css.js +14 -14
  382. package/lib/internal/template/segmented-control/styles.scoped.css +33 -35
  383. package/lib/internal/template/segmented-control/styles.selectors.js +14 -14
  384. package/lib/internal/template/select/parts/styles.css.js +16 -16
  385. package/lib/internal/template/select/parts/styles.scoped.css +18 -19
  386. package/lib/internal/template/select/parts/styles.selectors.js +16 -16
  387. package/lib/internal/template/select/styles.css.js +1 -1
  388. package/lib/internal/template/select/styles.scoped.css +1 -3
  389. package/lib/internal/template/select/styles.selectors.js +1 -1
  390. package/lib/internal/template/side-navigation/styles.css.js +28 -28
  391. package/lib/internal/template/side-navigation/styles.scoped.css +38 -40
  392. package/lib/internal/template/side-navigation/styles.selectors.js +28 -28
  393. package/lib/internal/template/slider/internal.js +1 -1
  394. package/lib/internal/template/slider/internal.js.map +1 -1
  395. package/lib/internal/template/slider/slider-labels.js +1 -1
  396. package/lib/internal/template/slider/slider-labels.js.map +1 -1
  397. package/lib/internal/template/slider/styles.css.js +25 -25
  398. package/lib/internal/template/slider/styles.scoped.css +62 -64
  399. package/lib/internal/template/slider/styles.selectors.js +25 -25
  400. package/lib/internal/template/slider/tick-marks.js +2 -2
  401. package/lib/internal/template/slider/tick-marks.js.map +1 -1
  402. package/lib/internal/template/space-between/styles.css.js +23 -23
  403. package/lib/internal/template/space-between/styles.scoped.css +24 -26
  404. package/lib/internal/template/space-between/styles.selectors.js +23 -23
  405. package/lib/internal/template/spinner/styles.css.js +13 -13
  406. package/lib/internal/template/spinner/styles.scoped.css +20 -21
  407. package/lib/internal/template/spinner/styles.selectors.js +13 -13
  408. package/lib/internal/template/split-panel/icons/styles.css.js +22 -22
  409. package/lib/internal/template/split-panel/icons/styles.scoped.css +28 -24
  410. package/lib/internal/template/split-panel/icons/styles.selectors.js +22 -22
  411. package/lib/internal/template/split-panel/side.js +3 -3
  412. package/lib/internal/template/split-panel/side.js.map +1 -1
  413. package/lib/internal/template/split-panel/styles.css.js +26 -26
  414. package/lib/internal/template/split-panel/styles.scoped.css +41 -46
  415. package/lib/internal/template/split-panel/styles.selectors.js +26 -26
  416. package/lib/internal/template/status-indicator/styles.css.js +23 -23
  417. package/lib/internal/template/status-indicator/styles.scoped.css +29 -31
  418. package/lib/internal/template/status-indicator/styles.selectors.js +23 -23
  419. package/lib/internal/template/table/body-cell/styles.css.js +45 -45
  420. package/lib/internal/template/table/body-cell/styles.scoped.css +175 -174
  421. package/lib/internal/template/table/body-cell/styles.selectors.js +45 -45
  422. package/lib/internal/template/table/expandable-rows/styles.css.js +3 -3
  423. package/lib/internal/template/table/expandable-rows/styles.scoped.css +15 -15
  424. package/lib/internal/template/table/expandable-rows/styles.selectors.js +3 -3
  425. package/lib/internal/template/table/header-cell/styles.css.js +26 -26
  426. package/lib/internal/template/table/header-cell/styles.scoped.css +54 -54
  427. package/lib/internal/template/table/header-cell/styles.selectors.js +26 -26
  428. package/lib/internal/template/table/internal.d.ts.map +1 -1
  429. package/lib/internal/template/table/internal.js +23 -17
  430. package/lib/internal/template/table/internal.js.map +1 -1
  431. package/lib/internal/template/table/resizer/styles.css.js +8 -8
  432. package/lib/internal/template/table/resizer/styles.scoped.css +14 -16
  433. package/lib/internal/template/table/resizer/styles.selectors.js +8 -8
  434. package/lib/internal/template/table/selection/selection-control.js +1 -1
  435. package/lib/internal/template/table/selection/selection-control.js.map +1 -1
  436. package/lib/internal/template/table/selection/styles.css.js +3 -3
  437. package/lib/internal/template/table/selection/styles.scoped.css +3 -5
  438. package/lib/internal/template/table/selection/styles.selectors.js +3 -3
  439. package/lib/internal/template/table/sticky-scrollbar/styles.css.js +6 -6
  440. package/lib/internal/template/table/sticky-scrollbar/styles.scoped.css +7 -9
  441. package/lib/internal/template/table/sticky-scrollbar/styles.selectors.js +6 -6
  442. package/lib/internal/template/table/styles.css.js +34 -34
  443. package/lib/internal/template/table/styles.scoped.css +39 -43
  444. package/lib/internal/template/table/styles.selectors.js +34 -34
  445. package/lib/internal/template/table/table-role/grid-navigation.d.ts.map +1 -1
  446. package/lib/internal/template/table/table-role/grid-navigation.js +40 -67
  447. package/lib/internal/template/table/table-role/grid-navigation.js.map +1 -1
  448. package/lib/internal/template/table/thead.d.ts +1 -0
  449. package/lib/internal/template/table/thead.d.ts.map +1 -1
  450. package/lib/internal/template/table/thead.js +5 -2
  451. package/lib/internal/template/table/thead.js.map +1 -1
  452. package/lib/internal/template/table/tools-header.d.ts +2 -1
  453. package/lib/internal/template/table/tools-header.d.ts.map +1 -1
  454. package/lib/internal/template/table/tools-header.js +4 -4
  455. package/lib/internal/template/table/tools-header.js.map +1 -1
  456. package/lib/internal/template/tabs/styles.css.js +22 -22
  457. package/lib/internal/template/tabs/styles.scoped.css +42 -46
  458. package/lib/internal/template/tabs/styles.selectors.js +22 -22
  459. package/lib/internal/template/tabs/tab-header-bar.d.ts.map +1 -1
  460. package/lib/internal/template/tabs/tab-header-bar.js +19 -47
  461. package/lib/internal/template/tabs/tab-header-bar.js.map +1 -1
  462. package/lib/internal/template/tag-editor/styles.css.js +3 -3
  463. package/lib/internal/template/tag-editor/styles.scoped.css +10 -12
  464. package/lib/internal/template/tag-editor/styles.selectors.js +3 -3
  465. package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
  466. package/lib/internal/template/text-content/styles.css.js +1 -1
  467. package/lib/internal/template/text-content/styles.scoped.css +60 -62
  468. package/lib/internal/template/text-content/styles.selectors.js +1 -1
  469. package/lib/internal/template/text-filter/styles.css.js +3 -3
  470. package/lib/internal/template/text-filter/styles.scoped.css +3 -5
  471. package/lib/internal/template/text-filter/styles.selectors.js +3 -3
  472. package/lib/internal/template/textarea/styles.css.js +5 -5
  473. package/lib/internal/template/textarea/styles.scoped.css +15 -17
  474. package/lib/internal/template/textarea/styles.selectors.js +5 -5
  475. package/lib/internal/template/tiles/styles.css.js +29 -29
  476. package/lib/internal/template/tiles/styles.scoped.css +70 -72
  477. package/lib/internal/template/tiles/styles.selectors.js +29 -29
  478. package/lib/internal/template/toggle/styles.css.js +8 -8
  479. package/lib/internal/template/toggle/styles.scoped.css +15 -16
  480. package/lib/internal/template/toggle/styles.selectors.js +8 -8
  481. package/lib/internal/template/token-group/dismiss-button.d.ts.map +1 -1
  482. package/lib/internal/template/token-group/dismiss-button.js +1 -2
  483. package/lib/internal/template/token-group/dismiss-button.js.map +1 -1
  484. package/lib/internal/template/token-group/styles.css.js +9 -9
  485. package/lib/internal/template/token-group/styles.scoped.css +19 -22
  486. package/lib/internal/template/token-group/styles.selectors.js +9 -9
  487. package/lib/internal/template/top-navigation/1.0-beta/styles.css.js +25 -25
  488. package/lib/internal/template/top-navigation/1.0-beta/styles.scoped.css +42 -44
  489. package/lib/internal/template/top-navigation/1.0-beta/styles.selectors.js +25 -25
  490. package/lib/internal/template/top-navigation/styles.css.js +47 -47
  491. package/lib/internal/template/top-navigation/styles.scoped.css +66 -68
  492. package/lib/internal/template/top-navigation/styles.selectors.js +47 -47
  493. package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/styles.css.js +20 -20
  494. package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/styles.scoped.css +21 -23
  495. package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/styles.selectors.js +20 -20
  496. package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.css.js +18 -18
  497. package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.scoped.css +27 -30
  498. package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.selectors.js +18 -18
  499. package/lib/internal/template/tutorial-panel/styles.css.js +1 -1
  500. package/lib/internal/template/tutorial-panel/styles.scoped.css +1 -3
  501. package/lib/internal/template/tutorial-panel/styles.selectors.js +1 -1
  502. package/lib/internal/template/wizard/styles.css.js +30 -30
  503. package/lib/internal/template/wizard/styles.scoped.css +62 -61
  504. package/lib/internal/template/wizard/styles.selectors.js +30 -30
  505. package/lib/internal/template/wizard/wizard-form-header.js +1 -1
  506. package/lib/internal/template/wizard/wizard-form-header.js.map +1 -1
  507. package/lib/internal/template/wizard/wizard-form.js +1 -1
  508. package/lib/internal/template/wizard/wizard-form.js.map +1 -1
  509. package/lib/internal/template/wizard/wizard-navigation.js +3 -3
  510. package/lib/internal/template/wizard/wizard-navigation.js.map +1 -1
  511. package/package.json +1 -1
  512. package/lib/internal/template/internal/context/app-layout-context.d.ts +0 -8
  513. package/lib/internal/template/internal/context/app-layout-context.d.ts.map +0 -1
  514. package/lib/internal/template/internal/context/app-layout-context.js +0 -9
  515. package/lib/internal/template/internal/context/app-layout-context.js.map +0 -1
@@ -1,12 +1,12 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import React from 'react';
3
+ import React, { useRef } from 'react';
4
4
  import { useEffect, useMemo } from 'react';
5
5
  import { defaultIsSuppressed, findTableRowByAriaRowIndex, findTableRowCellByAriaColIndex, focusNextElement, getClosestCell, isElementDisabled, isTableCell, } from './utils';
6
6
  import { useStableCallback } from '@cloudscape-design/component-toolkit/internal';
7
7
  import { nodeBelongs } from '../../internal/utils/node-belongs';
8
8
  import { getAllFocusables } from '../../internal/components/focus-lock/utils';
9
- import { SingleTabStopNavigationContext, } from '../../internal/context/single-tab-stop-navigation-context';
9
+ import { SingleTabStopNavigationProvider, } from '../../internal/context/single-tab-stop-navigation-context';
10
10
  import handleKey, { isEventLike } from '../../internal/utils/handle-key';
11
11
  import { KeyCode } from '../../internal/keycode';
12
12
  /**
@@ -14,7 +14,8 @@ import { KeyCode } from '../../internal/keycode';
14
14
  * See grid-navigation.md
15
15
  */
16
16
  export function GridNavigationProvider({ keyboardNavigation, pageSize, getTable, children }) {
17
- const gridNavigation = useMemo(() => new GridNavigationProcessor(), []);
17
+ const navigationAPI = useRef(null);
18
+ const gridNavigation = useMemo(() => new GridNavigationProcessor(navigationAPI), []);
18
19
  const getTableStable = useStableCallback(getTable);
19
20
  // Initialize the processor with the table container assuming it is mounted synchronously and only once.
20
21
  useEffect(() => {
@@ -34,10 +35,7 @@ export function GridNavigationProvider({ keyboardNavigation, pageSize, getTable,
34
35
  gridNavigation.refresh();
35
36
  }
36
37
  });
37
- return (React.createElement(SingleTabStopNavigationContext.Provider, { value: {
38
- navigationActive: keyboardNavigation,
39
- registerFocusable: gridNavigation.registerFocusable,
40
- } }, children));
38
+ return (React.createElement(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: keyboardNavigation, getNextFocusTarget: gridNavigation.getNextFocusTarget, isElementSuppressed: gridNavigation.isElementSuppressed, onRegisterFocusable: gridNavigation.onRegisterFocusable, onUnregisterFocusable: gridNavigation.onUnregisterFocusable }, children));
41
39
  }
42
40
  /**
43
41
  * This helper encapsulates the grid navigation behaviors which are:
@@ -46,38 +44,23 @@ export function GridNavigationProvider({ keyboardNavigation, pageSize, getTable,
46
44
  * 3. Suppressing the above behaviors when focusing an element inside a dialog or when instructed explicitly.
47
45
  */
48
46
  class GridNavigationProcessor {
49
- constructor() {
47
+ constructor(navigationAPI) {
50
48
  // Props
51
49
  this._pageSize = 0;
52
50
  this._table = null;
53
51
  // State
54
52
  this.focusedCell = null;
55
53
  this.keepUserIndex = false;
56
- this.focusables = new Set();
57
- this.focusHandlers = new Map();
58
- this.focusablesState = new WeakMap();
59
- this.focusTarget = null;
60
- this.registerFocusable = (focusableElement, changeHandler) => {
61
- var _a, _b;
62
- this.focusables.add(focusableElement);
63
- this.focusHandlers.set(focusableElement, changeHandler);
64
- const isFocusable = (_a = this.focusablesState.get(focusableElement)) !== null && _a !== void 0 ? _a : false;
65
- const newIsFocusable = this.focusTarget === focusableElement || this.isSuppressed(focusableElement);
66
- if (newIsFocusable !== isFocusable) {
67
- this.focusablesState.set(focusableElement, newIsFocusable);
68
- changeHandler(newIsFocusable);
69
- }
54
+ this.onRegisterFocusable = (focusableElement) => {
55
+ var _a;
70
56
  // When newly registered element belongs to the focused cell the focus must transition to it.
71
- const focusedElement = (_b = this.focusedCell) === null || _b === void 0 ? void 0 : _b.element;
57
+ const focusedElement = (_a = this.focusedCell) === null || _a === void 0 ? void 0 : _a.element;
72
58
  if (focusedElement && isTableCell(focusedElement) && focusedElement.contains(focusableElement)) {
73
59
  // Scroll is unnecessary when moving focus from a cell to element within the cell.
74
60
  focusableElement.focus({ preventScroll: true });
75
61
  }
76
- return () => this.unregisterFocusable(focusableElement);
77
62
  };
78
- this.unregisterFocusable = (focusable) => {
79
- this.focusables.delete(focusable);
80
- this.focusHandlers.delete(focusable);
63
+ this.onUnregisterFocusable = (focusable) => {
81
64
  const isUnregisteringFocusedNode = nodeBelongs(focusable, document.activeElement);
82
65
  if (isUnregisteringFocusedNode) {
83
66
  // Wait for unmounted node to get removed from the DOM.
@@ -90,7 +73,28 @@ class GridNavigationProcessor {
90
73
  }, 0);
91
74
  }
92
75
  };
76
+ this.getNextFocusTarget = () => {
77
+ var _a;
78
+ const cell = this.focusedCell;
79
+ const firstTableCell = this.table.querySelector('td,th');
80
+ // A single element of the table is made user-focusable.
81
+ // It defaults to the first interactive element of the first cell or the first cell itself otherwise.
82
+ let focusTarget = (_a = (firstTableCell && this.getFocusablesFrom(firstTableCell)[0])) !== null && _a !== void 0 ? _a : firstTableCell;
83
+ // When a navigation-focused element is present in the table it is used for user-navigation instead.
84
+ if (cell) {
85
+ focusTarget = this.getNextFocusable(cell, { x: 0, y: 0 });
86
+ }
87
+ return focusTarget;
88
+ };
89
+ this.isElementSuppressed = (element) => {
90
+ // Omit calculation as irrelevant until the table receives focus.
91
+ if (!this.focusedCell) {
92
+ return false;
93
+ }
94
+ return !element || defaultIsSuppressed(element);
95
+ };
93
96
  this.onFocusin = (event) => {
97
+ var _a;
94
98
  if (!(event.target instanceof HTMLElement)) {
95
99
  return;
96
100
  }
@@ -98,7 +102,7 @@ class GridNavigationProcessor {
98
102
  if (!this.focusedCell) {
99
103
  return;
100
104
  }
101
- this.updateFocusTarget();
105
+ (_a = this._navigationAPI.current) === null || _a === void 0 ? void 0 : _a.updateFocusTarget();
102
106
  // Focusing on cell is not eligible when it contains focusable elements in the content.
103
107
  // If content focusables are available - move the focus to the first one.
104
108
  const focusedElement = this.focusedCell.element;
@@ -133,7 +137,7 @@ class GridNavigationProcessor {
133
137
  const invalidModifierCombination = (modifiersPressed && !event.ctrlKey) ||
134
138
  (event.ctrlKey && event.keyCode !== KeyCode.home && event.keyCode !== KeyCode.end);
135
139
  if (invalidModifierCombination ||
136
- this.isSuppressed(document.activeElement) ||
140
+ this.isElementSuppressed(document.activeElement) ||
137
141
  !this.isRegistered(document.activeElement) ||
138
142
  keys.indexOf(event.keyCode) === -1) {
139
143
  return;
@@ -156,16 +160,15 @@ class GridNavigationProcessor {
156
160
  : this.moveFocusBy(from, { y: 0, x: Infinity }),
157
161
  });
158
162
  };
163
+ this._navigationAPI = navigationAPI;
159
164
  }
160
165
  init(table) {
161
166
  this._table = table;
162
167
  this.table.addEventListener('focusin', this.onFocusin);
163
168
  this.table.addEventListener('keydown', this.onKeydown);
164
- this.updateFocusTarget();
165
169
  this.cleanup = () => {
166
170
  this.table.removeEventListener('focusin', this.onFocusin);
167
171
  this.table.removeEventListener('keydown', this.onKeydown);
168
- this.focusables.forEach(this.unregisterFocusable);
169
172
  };
170
173
  }
171
174
  cleanup() {
@@ -177,11 +180,11 @@ class GridNavigationProcessor {
177
180
  refresh() {
178
181
  // Timeout ensures the newly rendered content elements are registered.
179
182
  setTimeout(() => {
180
- var _a;
183
+ var _a, _b;
181
184
  if (this._table) {
182
185
  // Update focused cell indices in case table rows, columns, or firstIndex change.
183
186
  this.updateFocusedCell((_a = this.focusedCell) === null || _a === void 0 ? void 0 : _a.element);
184
- this.updateFocusTarget();
187
+ (_b = this._navigationAPI.current) === null || _b === void 0 ? void 0 : _b.updateFocusTarget();
185
188
  }
186
189
  }, 0);
187
190
  }
@@ -202,27 +205,9 @@ class GridNavigationProcessor {
202
205
  }
203
206
  focusNextElement(this.getNextFocusable(cell, delta));
204
207
  }
205
- updateFocusTarget() {
206
- var _a;
207
- this.focusTarget = this.getSingleFocusable();
208
- for (const focusableElement of this.focusables) {
209
- const isFocusable = (_a = this.focusablesState.get(focusableElement)) !== null && _a !== void 0 ? _a : false;
210
- const newIsFocusable = this.focusTarget === focusableElement || this.isSuppressed(focusableElement);
211
- if (newIsFocusable !== isFocusable) {
212
- this.focusablesState.set(focusableElement, newIsFocusable);
213
- this.focusHandlers.get(focusableElement)(newIsFocusable);
214
- }
215
- }
216
- }
217
- isSuppressed(element) {
218
- // Omit calculation as irrelevant until the table receives focus.
219
- if (!this.focusedCell) {
220
- return false;
221
- }
222
- return !element || defaultIsSuppressed(element);
223
- }
224
208
  isRegistered(element) {
225
- return !element || this.focusables.has(element);
209
+ var _a, _b;
210
+ return !element || ((_b = (_a = this._navigationAPI.current) === null || _a === void 0 ? void 0 : _a.isRegistered(element)) !== null && _b !== void 0 ? _b : false);
226
211
  }
227
212
  updateFocusedCell(focusedElement) {
228
213
  var _a, _b, _c, _d, _e, _f;
@@ -291,21 +276,9 @@ class GridNavigationProcessor {
291
276
  }
292
277
  return (_a = targetCellFocusables[focusIndex]) !== null && _a !== void 0 ? _a : targetCell;
293
278
  }
294
- getSingleFocusable() {
295
- var _a;
296
- const cell = this.focusedCell;
297
- const firstTableCell = this.table.querySelector('td,th');
298
- // A single element of the table is made user-focusable.
299
- // It defaults to the first interactive element of the first cell or the first cell itself otherwise.
300
- let focusTarget = (_a = (firstTableCell && this.getFocusablesFrom(firstTableCell)[0])) !== null && _a !== void 0 ? _a : firstTableCell;
301
- // When a navigation-focused element is present in the table it is used for user-navigation instead.
302
- if (cell) {
303
- focusTarget = this.getNextFocusable(cell, { x: 0, y: 0 });
304
- }
305
- return focusTarget;
306
- }
307
279
  getFocusablesFrom(target) {
308
- return getAllFocusables(target).filter(el => this.focusables.has(el) && !isElementDisabled(el));
280
+ const isElementRegistered = (element) => { var _a; return (_a = this._navigationAPI.current) === null || _a === void 0 ? void 0 : _a.isRegistered(element); };
281
+ return getAllFocusables(target).filter(el => isElementRegistered(el) && !isElementDisabled(el));
309
282
  }
310
283
  }
311
284
  //# sourceMappingURL=grid-navigation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"grid-navigation.js","sourceRoot":"","sources":["../../../../src/table/table-role/grid-navigation.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\n\nimport React from 'react';\nimport { useEffect, useMemo } from 'react';\nimport {\n defaultIsSuppressed,\n findTableRowByAriaRowIndex,\n findTableRowCellByAriaColIndex,\n focusNextElement,\n getClosestCell,\n isElementDisabled,\n isTableCell,\n} from './utils';\nimport { FocusedCell, GridNavigationProps } from './interfaces';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { nodeBelongs } from '../../internal/utils/node-belongs';\nimport { getAllFocusables } from '../../internal/components/focus-lock/utils';\nimport {\n SingleTabStopNavigationContext,\n FocusableChangeHandler,\n} from '../../internal/context/single-tab-stop-navigation-context';\nimport handleKey, { isEventLike } from '../../internal/utils/handle-key';\nimport { KeyCode } from '../../internal/keycode';\n\n/**\n * Makes table navigable with keyboard commands.\n * See grid-navigation.md\n */\nexport function GridNavigationProvider({ keyboardNavigation, pageSize, getTable, children }: GridNavigationProps) {\n const gridNavigation = useMemo(() => new GridNavigationProcessor(), []);\n\n const getTableStable = useStableCallback(getTable);\n\n // Initialize the processor with the table container assuming it is mounted synchronously and only once.\n useEffect(() => {\n if (keyboardNavigation) {\n const table = getTableStable();\n table && gridNavigation.init(table);\n }\n return () => gridNavigation.cleanup();\n }, [keyboardNavigation, gridNavigation, getTableStable]);\n\n // Notify the processor of the props change.\n useEffect(() => {\n gridNavigation.update({ pageSize });\n }, [gridNavigation, pageSize]);\n\n // Notify the processor of the new render.\n useEffect(() => {\n if (keyboardNavigation) {\n gridNavigation.refresh();\n }\n });\n\n return (\n <SingleTabStopNavigationContext.Provider\n value={{\n navigationActive: keyboardNavigation,\n registerFocusable: gridNavigation.registerFocusable,\n }}\n >\n {children}\n </SingleTabStopNavigationContext.Provider>\n );\n}\n\n/**\n * This helper encapsulates the grid navigation behaviors which are:\n * 1. Responding to keyboard commands and moving the focus accordingly;\n * 2. Muting table interactive elements for only one to be user-focusable at a time;\n * 3. Suppressing the above behaviors when focusing an element inside a dialog or when instructed explicitly.\n */\nclass GridNavigationProcessor {\n // Props\n private _pageSize = 0;\n private _table: null | HTMLTableElement = null;\n\n // State\n private focusedCell: null | FocusedCell = null;\n private keepUserIndex = false;\n private focusables = new Set<Element>();\n private focusHandlers = new Map<Element, FocusableChangeHandler>();\n private focusablesState = new WeakMap<Element, boolean>();\n private focusTarget: null | Element = null;\n\n public init(table: HTMLTableElement) {\n this._table = table;\n\n this.table.addEventListener('focusin', this.onFocusin);\n this.table.addEventListener('keydown', this.onKeydown);\n\n this.updateFocusTarget();\n\n this.cleanup = () => {\n this.table.removeEventListener('focusin', this.onFocusin);\n this.table.removeEventListener('keydown', this.onKeydown);\n this.focusables.forEach(this.unregisterFocusable);\n };\n }\n\n public cleanup() {\n // Do nothing before initialized.\n }\n\n public update({ pageSize }: { pageSize: number }) {\n this._pageSize = pageSize;\n }\n\n public refresh() {\n // Timeout ensures the newly rendered content elements are registered.\n setTimeout(() => {\n if (this._table) {\n // Update focused cell indices in case table rows, columns, or firstIndex change.\n this.updateFocusedCell(this.focusedCell?.element);\n this.updateFocusTarget();\n }\n }, 0);\n }\n\n public registerFocusable = (focusableElement: HTMLElement, changeHandler: FocusableChangeHandler) => {\n this.focusables.add(focusableElement);\n this.focusHandlers.set(focusableElement, changeHandler);\n const isFocusable = this.focusablesState.get(focusableElement) ?? false;\n const newIsFocusable = this.focusTarget === focusableElement || this.isSuppressed(focusableElement);\n if (newIsFocusable !== isFocusable) {\n this.focusablesState.set(focusableElement, newIsFocusable);\n changeHandler(newIsFocusable);\n }\n // When newly registered element belongs to the focused cell the focus must transition to it.\n const focusedElement = this.focusedCell?.element;\n if (focusedElement && isTableCell(focusedElement) && focusedElement.contains(focusableElement)) {\n // Scroll is unnecessary when moving focus from a cell to element within the cell.\n focusableElement.focus({ preventScroll: true });\n }\n return () => this.unregisterFocusable(focusableElement);\n };\n\n public unregisterFocusable = (focusable: Element) => {\n this.focusables.delete(focusable);\n this.focusHandlers.delete(focusable);\n\n const isUnregisteringFocusedNode = nodeBelongs(focusable, document.activeElement);\n if (isUnregisteringFocusedNode) {\n // Wait for unmounted node to get removed from the DOM.\n setTimeout(() => {\n // If the focused cell appears to be no longer attached to the table we need to re-apply\n // focus to a cell with the same or closest position.\n if (this.focusedCell && !nodeBelongs(this.table, this.focusedCell.element)) {\n this.moveFocusBy(this.focusedCell, { x: 0, y: 0 });\n }\n }, 0);\n }\n };\n\n private get pageSize() {\n return this._pageSize;\n }\n\n private get table(): HTMLTableElement {\n if (!this._table) {\n throw new Error('Invariant violation: GridNavigationProcessor is used before initialization.');\n }\n return this._table;\n }\n\n private onFocusin = (event: FocusEvent) => {\n if (!(event.target instanceof HTMLElement)) {\n return;\n }\n\n this.updateFocusedCell(event.target);\n if (!this.focusedCell) {\n return;\n }\n\n this.updateFocusTarget();\n\n // Focusing on cell is not eligible when it contains focusable elements in the content.\n // If content focusables are available - move the focus to the first one.\n const focusedElement = this.focusedCell.element;\n const nextTarget = isTableCell(focusedElement) ? this.getFocusablesFrom(focusedElement)[0] : null;\n if (nextTarget) {\n // Scroll is unnecessary when moving focus from a cell to element within the cell.\n nextTarget.focus({ preventScroll: true });\n } else {\n this.keepUserIndex = false;\n }\n };\n\n private onKeydown = (event: KeyboardEvent) => {\n if (!this.focusedCell) {\n return;\n }\n\n const keys = [\n KeyCode.up,\n KeyCode.down,\n KeyCode.left,\n KeyCode.right,\n KeyCode.pageUp,\n KeyCode.pageDown,\n KeyCode.home,\n KeyCode.end,\n ];\n const ctrlKey = event.ctrlKey ? 1 : 0;\n const altKey = event.altKey ? 1 : 0;\n const shiftKey = event.shiftKey ? 1 : 0;\n const metaKey = event.metaKey ? 1 : 0;\n const modifiersPressed = ctrlKey + altKey + shiftKey + metaKey;\n const invalidModifierCombination =\n (modifiersPressed && !event.ctrlKey) ||\n (event.ctrlKey && event.keyCode !== KeyCode.home && event.keyCode !== KeyCode.end);\n\n if (\n invalidModifierCombination ||\n this.isSuppressed(document.activeElement) ||\n !this.isRegistered(document.activeElement) ||\n keys.indexOf(event.keyCode) === -1\n ) {\n return;\n }\n\n const from = this.focusedCell;\n event.preventDefault();\n\n isEventLike(event) &&\n handleKey(event, {\n onBlockStart: () => this.moveFocusBy(from, { y: -1, x: 0 }),\n onBlockEnd: () => this.moveFocusBy(from, { y: 1, x: 0 }),\n onInlineStart: () => this.moveFocusBy(from, { y: 0, x: -1 }),\n onInlineEnd: () => this.moveFocusBy(from, { y: 0, x: 1 }),\n onPageUp: () => this.moveFocusBy(from, { y: -this.pageSize, x: 0 }),\n onPageDown: () => this.moveFocusBy(from, { y: this.pageSize, x: 0 }),\n onHome: () =>\n event.ctrlKey\n ? this.moveFocusBy(from, { y: -Infinity, x: -Infinity })\n : this.moveFocusBy(from, { y: 0, x: -Infinity }),\n onEnd: () =>\n event.ctrlKey\n ? this.moveFocusBy(from, { y: Infinity, x: Infinity })\n : this.moveFocusBy(from, { y: 0, x: Infinity }),\n });\n };\n\n private moveFocusBy(cell: FocusedCell, delta: { x: number; y: number }) {\n // For vertical moves preserve column- and element indices set by user.\n // It allows keeping indices while moving over disabled actions or cells with colspan > 1.\n if (delta.y !== 0 && delta.x === 0) {\n this.keepUserIndex = true;\n }\n focusNextElement(this.getNextFocusable(cell, delta));\n }\n\n private updateFocusTarget() {\n this.focusTarget = this.getSingleFocusable();\n for (const focusableElement of this.focusables) {\n const isFocusable = this.focusablesState.get(focusableElement) ?? false;\n const newIsFocusable = this.focusTarget === focusableElement || this.isSuppressed(focusableElement);\n if (newIsFocusable !== isFocusable) {\n this.focusablesState.set(focusableElement, newIsFocusable);\n this.focusHandlers.get(focusableElement)!(newIsFocusable);\n }\n }\n }\n\n private isSuppressed(element: null | Element) {\n // Omit calculation as irrelevant until the table receives focus.\n if (!this.focusedCell) {\n return false;\n }\n return !element || defaultIsSuppressed(element);\n }\n\n private isRegistered(element: null | Element) {\n return !element || this.focusables.has(element);\n }\n\n private updateFocusedCell(focusedElement?: HTMLElement): void {\n if (!focusedElement) {\n return;\n }\n\n const cellElement = getClosestCell(focusedElement);\n const rowElement = cellElement?.closest('tr');\n if (!cellElement || !rowElement) {\n return;\n }\n\n const colIndex = parseInt(cellElement.getAttribute('aria-colindex') ?? '');\n const rowIndex = parseInt(rowElement.getAttribute('aria-rowindex') ?? '');\n if (isNaN(colIndex) || isNaN(rowIndex)) {\n return;\n }\n\n const cellFocusables = this.getFocusablesFrom(cellElement);\n const elementIndex = cellFocusables.indexOf(focusedElement);\n\n const prevColIndex = this.focusedCell?.colIndex ?? -1;\n const prevElementIndex = this.focusedCell?.elementIndex ?? -1;\n this.focusedCell = {\n rowIndex,\n colIndex: this.keepUserIndex && prevColIndex !== -1 ? prevColIndex : colIndex,\n elementIndex: this.keepUserIndex && prevElementIndex !== -1 ? prevElementIndex : elementIndex,\n element: focusedElement,\n };\n }\n\n private getNextFocusable(from: FocusedCell, delta: { y: number; x: number }) {\n // Find next row to move focus into (can be null if the top/bottom is reached).\n const targetAriaRowIndex = from.rowIndex + delta.y;\n const targetRow = findTableRowByAriaRowIndex(this.table, targetAriaRowIndex, delta.y);\n if (!targetRow) {\n return null;\n }\n\n // Return next interactive cell content element if available.\n const cellElement = getClosestCell(from.element);\n const cellFocusables = cellElement ? this.getFocusablesFrom(cellElement) : [];\n const nextElementIndex = from.elementIndex + delta.x;\n const isValidDirection = !!delta.x;\n const isValidIndex = from.elementIndex !== -1 && 0 <= nextElementIndex && nextElementIndex < cellFocusables.length;\n const isTargetDifferent = from.element !== cellFocusables[nextElementIndex];\n if (isValidDirection && isValidIndex && isTargetDifferent) {\n return cellFocusables[nextElementIndex];\n }\n\n // Find next cell to focus or move focus into (can be null if the left/right edge is reached).\n const targetAriaColIndex = from.colIndex + delta.x;\n const targetCell = findTableRowCellByAriaColIndex(targetRow, targetAriaColIndex, delta.x);\n if (!targetCell) {\n return null;\n }\n\n // When target cell matches the current cell it means we reached the left or right boundary.\n if (targetCell === cellElement && delta.x !== 0) {\n return null;\n }\n\n const targetCellFocusables = this.getFocusablesFrom(targetCell);\n\n // When delta.x = 0 keep element index if possible.\n let focusIndex = from.elementIndex;\n // Use first element index when moving to the right or to extreme left.\n if ((isFinite(delta.x) && delta.x > 0) || delta.x === -Infinity) {\n focusIndex = 0;\n }\n // Use last element index when moving to the left or to extreme right.\n if ((isFinite(delta.x) && delta.x < 0) || delta.x === Infinity) {\n focusIndex = targetCellFocusables.length - 1;\n }\n\n return targetCellFocusables[focusIndex] ?? targetCell;\n }\n\n private getSingleFocusable() {\n const cell = this.focusedCell;\n const firstTableCell = this.table.querySelector('td,th') as null | HTMLTableCellElement;\n\n // A single element of the table is made user-focusable.\n // It defaults to the first interactive element of the first cell or the first cell itself otherwise.\n let focusTarget: null | HTMLElement =\n (firstTableCell && this.getFocusablesFrom(firstTableCell)[0]) ?? firstTableCell;\n\n // When a navigation-focused element is present in the table it is used for user-navigation instead.\n if (cell) {\n focusTarget = this.getNextFocusable(cell, { x: 0, y: 0 });\n }\n\n return focusTarget;\n }\n\n private getFocusablesFrom(target: HTMLElement) {\n return getAllFocusables(target).filter(el => this.focusables.has(el) && !isElementDisabled(el));\n }\n}\n"]}
1
+ {"version":3,"file":"grid-navigation.js","sourceRoot":"","sources":["../../../../src/table/table-role/grid-navigation.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\n\nimport React, { useRef } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport {\n defaultIsSuppressed,\n findTableRowByAriaRowIndex,\n findTableRowCellByAriaColIndex,\n focusNextElement,\n getClosestCell,\n isElementDisabled,\n isTableCell,\n} from './utils';\nimport { FocusedCell, GridNavigationProps } from './interfaces';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { nodeBelongs } from '../../internal/utils/node-belongs';\nimport { getAllFocusables } from '../../internal/components/focus-lock/utils';\nimport {\n SingleTabStopNavigationProvider,\n SingleTabStopNavigationAPI,\n} from '../../internal/context/single-tab-stop-navigation-context';\nimport handleKey, { isEventLike } from '../../internal/utils/handle-key';\nimport { KeyCode } from '../../internal/keycode';\n\n/**\n * Makes table navigable with keyboard commands.\n * See grid-navigation.md\n */\nexport function GridNavigationProvider({ keyboardNavigation, pageSize, getTable, children }: GridNavigationProps) {\n const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n const gridNavigation = useMemo(() => new GridNavigationProcessor(navigationAPI), []);\n\n const getTableStable = useStableCallback(getTable);\n\n // Initialize the processor with the table container assuming it is mounted synchronously and only once.\n useEffect(() => {\n if (keyboardNavigation) {\n const table = getTableStable();\n table && gridNavigation.init(table);\n }\n return () => gridNavigation.cleanup();\n }, [keyboardNavigation, gridNavigation, getTableStable]);\n\n // Notify the processor of the props change.\n useEffect(() => {\n gridNavigation.update({ pageSize });\n }, [gridNavigation, pageSize]);\n\n // Notify the processor of the new render.\n useEffect(() => {\n if (keyboardNavigation) {\n gridNavigation.refresh();\n }\n });\n\n return (\n <SingleTabStopNavigationProvider\n ref={navigationAPI}\n navigationActive={keyboardNavigation}\n getNextFocusTarget={gridNavigation.getNextFocusTarget}\n isElementSuppressed={gridNavigation.isElementSuppressed}\n onRegisterFocusable={gridNavigation.onRegisterFocusable}\n onUnregisterFocusable={gridNavigation.onUnregisterFocusable}\n >\n {children}\n </SingleTabStopNavigationProvider>\n );\n}\n\n/**\n * This helper encapsulates the grid navigation behaviors which are:\n * 1. Responding to keyboard commands and moving the focus accordingly;\n * 2. Muting table interactive elements for only one to be user-focusable at a time;\n * 3. Suppressing the above behaviors when focusing an element inside a dialog or when instructed explicitly.\n */\nclass GridNavigationProcessor {\n // Props\n private _pageSize = 0;\n private _table: null | HTMLTableElement = null;\n private _navigationAPI: { current: null | SingleTabStopNavigationAPI };\n\n // State\n private focusedCell: null | FocusedCell = null;\n private keepUserIndex = false;\n\n constructor(navigationAPI: { current: null | SingleTabStopNavigationAPI }) {\n this._navigationAPI = navigationAPI;\n }\n\n public init(table: HTMLTableElement) {\n this._table = table;\n\n this.table.addEventListener('focusin', this.onFocusin);\n this.table.addEventListener('keydown', this.onKeydown);\n\n this.cleanup = () => {\n this.table.removeEventListener('focusin', this.onFocusin);\n this.table.removeEventListener('keydown', this.onKeydown);\n };\n }\n\n public cleanup() {\n // Do nothing before initialized.\n }\n\n public update({ pageSize }: { pageSize: number }) {\n this._pageSize = pageSize;\n }\n\n public refresh() {\n // Timeout ensures the newly rendered content elements are registered.\n setTimeout(() => {\n if (this._table) {\n // Update focused cell indices in case table rows, columns, or firstIndex change.\n this.updateFocusedCell(this.focusedCell?.element);\n this._navigationAPI.current?.updateFocusTarget();\n }\n }, 0);\n }\n\n public onRegisterFocusable = (focusableElement: HTMLElement) => {\n // When newly registered element belongs to the focused cell the focus must transition to it.\n const focusedElement = this.focusedCell?.element;\n if (focusedElement && isTableCell(focusedElement) && focusedElement.contains(focusableElement)) {\n // Scroll is unnecessary when moving focus from a cell to element within the cell.\n focusableElement.focus({ preventScroll: true });\n }\n };\n\n public onUnregisterFocusable = (focusable: Element) => {\n const isUnregisteringFocusedNode = nodeBelongs(focusable, document.activeElement);\n if (isUnregisteringFocusedNode) {\n // Wait for unmounted node to get removed from the DOM.\n setTimeout(() => {\n // If the focused cell appears to be no longer attached to the table we need to re-apply\n // focus to a cell with the same or closest position.\n if (this.focusedCell && !nodeBelongs(this.table, this.focusedCell.element)) {\n this.moveFocusBy(this.focusedCell, { x: 0, y: 0 });\n }\n }, 0);\n }\n };\n\n public getNextFocusTarget = () => {\n const cell = this.focusedCell;\n const firstTableCell = this.table.querySelector('td,th') as null | HTMLTableCellElement;\n\n // A single element of the table is made user-focusable.\n // It defaults to the first interactive element of the first cell or the first cell itself otherwise.\n let focusTarget: null | HTMLElement =\n (firstTableCell && this.getFocusablesFrom(firstTableCell)[0]) ?? firstTableCell;\n\n // When a navigation-focused element is present in the table it is used for user-navigation instead.\n if (cell) {\n focusTarget = this.getNextFocusable(cell, { x: 0, y: 0 });\n }\n\n return focusTarget;\n };\n\n public isElementSuppressed = (element: null | Element) => {\n // Omit calculation as irrelevant until the table receives focus.\n if (!this.focusedCell) {\n return false;\n }\n return !element || defaultIsSuppressed(element);\n };\n\n private get pageSize() {\n return this._pageSize;\n }\n\n private get table(): HTMLTableElement {\n if (!this._table) {\n throw new Error('Invariant violation: GridNavigationProcessor is used before initialization.');\n }\n return this._table;\n }\n\n private onFocusin = (event: FocusEvent) => {\n if (!(event.target instanceof HTMLElement)) {\n return;\n }\n\n this.updateFocusedCell(event.target);\n if (!this.focusedCell) {\n return;\n }\n\n this._navigationAPI.current?.updateFocusTarget();\n\n // Focusing on cell is not eligible when it contains focusable elements in the content.\n // If content focusables are available - move the focus to the first one.\n const focusedElement = this.focusedCell.element;\n const nextTarget = isTableCell(focusedElement) ? this.getFocusablesFrom(focusedElement)[0] : null;\n if (nextTarget) {\n // Scroll is unnecessary when moving focus from a cell to element within the cell.\n nextTarget.focus({ preventScroll: true });\n } else {\n this.keepUserIndex = false;\n }\n };\n\n private onKeydown = (event: KeyboardEvent) => {\n if (!this.focusedCell) {\n return;\n }\n\n const keys = [\n KeyCode.up,\n KeyCode.down,\n KeyCode.left,\n KeyCode.right,\n KeyCode.pageUp,\n KeyCode.pageDown,\n KeyCode.home,\n KeyCode.end,\n ];\n const ctrlKey = event.ctrlKey ? 1 : 0;\n const altKey = event.altKey ? 1 : 0;\n const shiftKey = event.shiftKey ? 1 : 0;\n const metaKey = event.metaKey ? 1 : 0;\n const modifiersPressed = ctrlKey + altKey + shiftKey + metaKey;\n const invalidModifierCombination =\n (modifiersPressed && !event.ctrlKey) ||\n (event.ctrlKey && event.keyCode !== KeyCode.home && event.keyCode !== KeyCode.end);\n\n if (\n invalidModifierCombination ||\n this.isElementSuppressed(document.activeElement) ||\n !this.isRegistered(document.activeElement) ||\n keys.indexOf(event.keyCode) === -1\n ) {\n return;\n }\n\n const from = this.focusedCell;\n event.preventDefault();\n\n isEventLike(event) &&\n handleKey(event, {\n onBlockStart: () => this.moveFocusBy(from, { y: -1, x: 0 }),\n onBlockEnd: () => this.moveFocusBy(from, { y: 1, x: 0 }),\n onInlineStart: () => this.moveFocusBy(from, { y: 0, x: -1 }),\n onInlineEnd: () => this.moveFocusBy(from, { y: 0, x: 1 }),\n onPageUp: () => this.moveFocusBy(from, { y: -this.pageSize, x: 0 }),\n onPageDown: () => this.moveFocusBy(from, { y: this.pageSize, x: 0 }),\n onHome: () =>\n event.ctrlKey\n ? this.moveFocusBy(from, { y: -Infinity, x: -Infinity })\n : this.moveFocusBy(from, { y: 0, x: -Infinity }),\n onEnd: () =>\n event.ctrlKey\n ? this.moveFocusBy(from, { y: Infinity, x: Infinity })\n : this.moveFocusBy(from, { y: 0, x: Infinity }),\n });\n };\n\n private moveFocusBy(cell: FocusedCell, delta: { x: number; y: number }) {\n // For vertical moves preserve column- and element indices set by user.\n // It allows keeping indices while moving over disabled actions or cells with colspan > 1.\n if (delta.y !== 0 && delta.x === 0) {\n this.keepUserIndex = true;\n }\n focusNextElement(this.getNextFocusable(cell, delta));\n }\n\n private isRegistered(element: null | Element): boolean {\n return !element || (this._navigationAPI.current?.isRegistered(element) ?? false);\n }\n\n private updateFocusedCell(focusedElement?: HTMLElement): void {\n if (!focusedElement) {\n return;\n }\n\n const cellElement = getClosestCell(focusedElement);\n const rowElement = cellElement?.closest('tr');\n if (!cellElement || !rowElement) {\n return;\n }\n\n const colIndex = parseInt(cellElement.getAttribute('aria-colindex') ?? '');\n const rowIndex = parseInt(rowElement.getAttribute('aria-rowindex') ?? '');\n if (isNaN(colIndex) || isNaN(rowIndex)) {\n return;\n }\n\n const cellFocusables = this.getFocusablesFrom(cellElement);\n const elementIndex = cellFocusables.indexOf(focusedElement);\n\n const prevColIndex = this.focusedCell?.colIndex ?? -1;\n const prevElementIndex = this.focusedCell?.elementIndex ?? -1;\n this.focusedCell = {\n rowIndex,\n colIndex: this.keepUserIndex && prevColIndex !== -1 ? prevColIndex : colIndex,\n elementIndex: this.keepUserIndex && prevElementIndex !== -1 ? prevElementIndex : elementIndex,\n element: focusedElement,\n };\n }\n\n private getNextFocusable(from: FocusedCell, delta: { y: number; x: number }) {\n // Find next row to move focus into (can be null if the top/bottom is reached).\n const targetAriaRowIndex = from.rowIndex + delta.y;\n const targetRow = findTableRowByAriaRowIndex(this.table, targetAriaRowIndex, delta.y);\n if (!targetRow) {\n return null;\n }\n\n // Return next interactive cell content element if available.\n const cellElement = getClosestCell(from.element);\n const cellFocusables = cellElement ? this.getFocusablesFrom(cellElement) : [];\n const nextElementIndex = from.elementIndex + delta.x;\n const isValidDirection = !!delta.x;\n const isValidIndex = from.elementIndex !== -1 && 0 <= nextElementIndex && nextElementIndex < cellFocusables.length;\n const isTargetDifferent = from.element !== cellFocusables[nextElementIndex];\n if (isValidDirection && isValidIndex && isTargetDifferent) {\n return cellFocusables[nextElementIndex];\n }\n\n // Find next cell to focus or move focus into (can be null if the left/right edge is reached).\n const targetAriaColIndex = from.colIndex + delta.x;\n const targetCell = findTableRowCellByAriaColIndex(targetRow, targetAriaColIndex, delta.x);\n if (!targetCell) {\n return null;\n }\n\n // When target cell matches the current cell it means we reached the left or right boundary.\n if (targetCell === cellElement && delta.x !== 0) {\n return null;\n }\n\n const targetCellFocusables = this.getFocusablesFrom(targetCell);\n\n // When delta.x = 0 keep element index if possible.\n let focusIndex = from.elementIndex;\n // Use first element index when moving to the right or to extreme left.\n if ((isFinite(delta.x) && delta.x > 0) || delta.x === -Infinity) {\n focusIndex = 0;\n }\n // Use last element index when moving to the left or to extreme right.\n if ((isFinite(delta.x) && delta.x < 0) || delta.x === Infinity) {\n focusIndex = targetCellFocusables.length - 1;\n }\n\n return targetCellFocusables[focusIndex] ?? targetCell;\n }\n\n private getFocusablesFrom(target: HTMLElement) {\n const isElementRegistered = (element: Element) => this._navigationAPI.current?.isRegistered(element);\n return getAllFocusables(target).filter(el => isElementRegistered(el) && !isElementDisabled(el));\n }\n}\n"]}
@@ -29,6 +29,7 @@ export interface TheadProps {
29
29
  onFocusedComponentChange?: (focusId: null | string) => void;
30
30
  tableRole: TableRole;
31
31
  isExpandable?: boolean;
32
+ setLastUserAction: (name: string) => void;
32
33
  }
33
34
  declare const Thead: React.ForwardRefExoticComponent<TheadProps & React.RefAttributes<HTMLTableRowElement>>;
34
35
  export default Thead;
@@ -1 +1 @@
1
- {"version":3,"file":"thead.d.ts","sourceRoot":"","sources":["../../../src/table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAkC,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAQvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAA8B,SAAS,EAAE,MAAM,cAAc,CAAC;AAKrE,MAAM,WAAW,UAAU;IACzB,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,CAAC,EAAE,MAAM,cAAc,CAAC;IACzC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC9D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5D,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,KAAK,wFA6HV,CAAC;AAEF,eAAe,KAAK,CAAC"}
1
+ {"version":3,"file":"thead.d.ts","sourceRoot":"","sources":["../../../src/table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAkC,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAQvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAA8B,SAAS,EAAE,MAAM,cAAc,CAAC;AAKrE,MAAM,WAAW,UAAU;IACzB,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,CAAC,EAAE,MAAM,cAAc,CAAC;IACzC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC9D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5D,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,QAAA,MAAM,KAAK,wFAiIV,CAAC;AAEF,eAAe,KAAK,CAAC"}
@@ -15,7 +15,7 @@ import { getTableHeaderRowRoleProps } from './table-role';
15
15
  import { TableThElement } from './header-cell/th-element';
16
16
  import { findUpUntil } from '@cloudscape-design/component-toolkit/dom';
17
17
  import { Divider } from './resizer';
18
- const Thead = React.forwardRef(({ selectionType, getSelectAllProps, columnDefinitions, sortingColumn, sortingDisabled, sortingDescending, resizableColumns, variant, wrapLines, onFocusMove, onSortingChange, onResizeFinish, singleSelectionHeaderAriaLabel, stripedRows, sticky = false, hidden = false, stuck = false, stickyState, selectionColumnId, focusedComponent, onFocusedComponentChange, tableRole, resizerRoleDescription, isExpandable, }, outerRef) => {
18
+ const Thead = React.forwardRef(({ selectionType, getSelectAllProps, columnDefinitions, sortingColumn, sortingDisabled, sortingDescending, resizableColumns, variant, wrapLines, onFocusMove, onSortingChange, onResizeFinish, singleSelectionHeaderAriaLabel, stripedRows, sticky = false, hidden = false, stuck = false, stickyState, selectionColumnId, focusedComponent, onFocusedComponentChange, tableRole, resizerRoleDescription, isExpandable, setLastUserAction, }, outerRef) => {
19
19
  const isVisualRefresh = useVisualRefresh();
20
20
  const headerCellClass = clsx(headerCellStyles['header-cell'], headerCellStyles[`header-cell-variant-${variant}`], sticky && headerCellStyles['header-cell-sticky'], stuck && headerCellStyles['header-cell-stuck'], stripedRows && headerCellStyles['has-striped-rows'], isVisualRefresh && headerCellStyles['is-visual-refresh']);
21
21
  const selectionCellClass = clsx(styles['selection-control'], styles['selection-control-header'], isVisualRefresh && styles['is-visual-refresh']);
@@ -34,7 +34,10 @@ const Thead = React.forwardRef(({ selectionType, getSelectAllProps, columnDefini
34
34
  React.createElement(Divider, { className: styles['resize-divider'] }))) : null,
35
35
  columnDefinitions.map((column, colIndex) => {
36
36
  const columnId = getColumnKey(column, colIndex);
37
- return (React.createElement(TableHeaderCell, { key: columnId, style: getColumnStyles(sticky, columnId), className: headerCellClass, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, hidden: hidden, colIndex: selectionType ? colIndex + 1 : colIndex, columnId: columnId, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, onClick: detail => fireNonCancelableEvent(onSortingChange, detail), isEditable: !!column.editConfig, stickyState: stickyState, cellRef: node => setCell(sticky, columnId, node), tableRole: tableRole, resizerRoleDescription: resizerRoleDescription,
37
+ return (React.createElement(TableHeaderCell, { key: columnId, style: getColumnStyles(sticky, columnId), className: headerCellClass, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, hidden: hidden, colIndex: selectionType ? colIndex + 1 : colIndex, columnId: columnId, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, onClick: detail => {
38
+ setLastUserAction('sorting');
39
+ fireNonCancelableEvent(onSortingChange, detail);
40
+ }, isEditable: !!column.editConfig, stickyState: stickyState, cellRef: node => setCell(sticky, columnId, node), tableRole: tableRole, resizerRoleDescription: resizerRoleDescription,
38
41
  // Expandable option is only applicable to the first data column of the table.
39
42
  // When present, the header content receives extra padding to match the first offset in the data cells.
40
43
  isExpandable: colIndex === 0 && isExpandable }));
@@ -1 +1 @@
1
- {"version":3,"file":"thead.js","sourceRoot":"","sources":["../../../src/table/thead.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 clsx from 'clsx';\nimport React from 'react';\nimport { TableProps } from './interfaces';\nimport { SelectionControl, focusMarkers, SelectionProps } from './selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { TableThElement } from './header-cell/th-element';\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\nimport { Divider } from './resizer';\n\nexport interface TheadProps {\n selectionType: TableProps.SelectionType | undefined;\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n sortingColumn: TableProps.SortingColumn<any> | undefined;\n sortingDescending: boolean | undefined;\n sortingDisabled: boolean | undefined;\n variant: TableProps.Variant;\n wrapLines: boolean | undefined;\n resizableColumns: boolean | undefined;\n getSelectAllProps?: () => SelectionProps;\n onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) => void) | undefined;\n onResizeFinish: (newWidths: Map<PropertyKey, number>) => void;\n onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n sticky?: boolean;\n hidden?: boolean;\n stuck?: boolean;\n singleSelectionHeaderAriaLabel?: string;\n resizerRoleDescription?: string;\n stripedRows?: boolean;\n stickyState: StickyColumnsModel;\n selectionColumnId: PropertyKey;\n focusedComponent?: null | string;\n onFocusedComponentChange?: (focusId: null | string) => void;\n tableRole: TableRole;\n isExpandable?: boolean;\n}\n\nconst Thead = React.forwardRef(\n (\n {\n selectionType,\n getSelectAllProps,\n columnDefinitions,\n sortingColumn,\n sortingDisabled,\n sortingDescending,\n resizableColumns,\n variant,\n wrapLines,\n onFocusMove,\n onSortingChange,\n onResizeFinish,\n singleSelectionHeaderAriaLabel,\n stripedRows,\n sticky = false,\n hidden = false,\n stuck = false,\n stickyState,\n selectionColumnId,\n focusedComponent,\n onFocusedComponentChange,\n tableRole,\n resizerRoleDescription,\n isExpandable,\n }: TheadProps,\n outerRef: React.Ref<HTMLTableRowElement>\n ) => {\n const isVisualRefresh = useVisualRefresh();\n\n const headerCellClass = clsx(\n headerCellStyles['header-cell'],\n headerCellStyles[`header-cell-variant-${variant}`],\n sticky && headerCellStyles['header-cell-sticky'],\n stuck && headerCellStyles['header-cell-stuck'],\n stripedRows && headerCellStyles['has-striped-rows'],\n isVisualRefresh && headerCellStyles['is-visual-refresh']\n );\n\n const selectionCellClass = clsx(\n styles['selection-control'],\n styles['selection-control-header'],\n isVisualRefresh && styles['is-visual-refresh']\n );\n\n const { getColumnStyles, columnWidths, updateColumn, setCell } = useColumnWidths();\n\n return (\n <thead className={clsx(!hidden && styles['thead-active'])}>\n <tr\n {...focusMarkers.all}\n ref={outerRef}\n aria-rowindex={1}\n {...getTableHeaderRowRoleProps({ tableRole })}\n onFocus={event => {\n const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n onFocusedComponentChange?.(focusId);\n }}\n onBlur={() => onFocusedComponentChange?.(null)}\n >\n {selectionType ? (\n <TableThElement\n className={clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden'])}\n hidden={hidden}\n tableRole={tableRole}\n colIndex={0}\n focusedComponent={focusedComponent}\n columnId={selectionColumnId}\n stickyState={stickyState}\n >\n {getSelectAllProps ? (\n <SelectionControl\n onFocusDown={event => {\n onFocusMove!(event.target as HTMLElement, -1, +1);\n }}\n focusedComponent={focusedComponent}\n {...getSelectAllProps()}\n {...(sticky ? { tabIndex: -1 } : {})}\n />\n ) : (\n <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n )}\n <Divider className={styles['resize-divider']} />\n </TableThElement>\n ) : null}\n\n {columnDefinitions.map((column, colIndex) => {\n const columnId = getColumnKey(column, colIndex);\n return (\n <TableHeaderCell\n key={columnId}\n style={getColumnStyles(sticky, columnId)}\n className={headerCellClass}\n tabIndex={sticky ? -1 : 0}\n focusedComponent={focusedComponent}\n column={column}\n activeSortingColumn={sortingColumn}\n sortingDescending={sortingDescending}\n sortingDisabled={sortingDisabled}\n wrapLines={wrapLines}\n hidden={hidden}\n colIndex={selectionType ? colIndex + 1 : colIndex}\n columnId={columnId}\n updateColumn={updateColumn}\n onResizeFinish={() => onResizeFinish(columnWidths)}\n resizableColumns={resizableColumns}\n onClick={detail => fireNonCancelableEvent(onSortingChange, detail)}\n isEditable={!!column.editConfig}\n stickyState={stickyState}\n cellRef={node => setCell(sticky, columnId, node)}\n tableRole={tableRole}\n resizerRoleDescription={resizerRoleDescription}\n // Expandable option is only applicable to the first data column of the table.\n // When present, the header content receives extra padding to match the first offset in the data cells.\n isExpandable={colIndex === 0 && isExpandable}\n />\n );\n })}\n </tr>\n </thead>\n );\n }\n);\n\nexport default Thead;\n"]}
1
+ {"version":3,"file":"thead.js","sourceRoot":"","sources":["../../../src/table/thead.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 clsx from 'clsx';\nimport React from 'react';\nimport { TableProps } from './interfaces';\nimport { SelectionControl, focusMarkers, SelectionProps } from './selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { TableThElement } from './header-cell/th-element';\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\nimport { Divider } from './resizer';\n\nexport interface TheadProps {\n selectionType: TableProps.SelectionType | undefined;\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n sortingColumn: TableProps.SortingColumn<any> | undefined;\n sortingDescending: boolean | undefined;\n sortingDisabled: boolean | undefined;\n variant: TableProps.Variant;\n wrapLines: boolean | undefined;\n resizableColumns: boolean | undefined;\n getSelectAllProps?: () => SelectionProps;\n onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) => void) | undefined;\n onResizeFinish: (newWidths: Map<PropertyKey, number>) => void;\n onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n sticky?: boolean;\n hidden?: boolean;\n stuck?: boolean;\n singleSelectionHeaderAriaLabel?: string;\n resizerRoleDescription?: string;\n stripedRows?: boolean;\n stickyState: StickyColumnsModel;\n selectionColumnId: PropertyKey;\n focusedComponent?: null | string;\n onFocusedComponentChange?: (focusId: null | string) => void;\n tableRole: TableRole;\n isExpandable?: boolean;\n setLastUserAction: (name: string) => void;\n}\n\nconst Thead = React.forwardRef(\n (\n {\n selectionType,\n getSelectAllProps,\n columnDefinitions,\n sortingColumn,\n sortingDisabled,\n sortingDescending,\n resizableColumns,\n variant,\n wrapLines,\n onFocusMove,\n onSortingChange,\n onResizeFinish,\n singleSelectionHeaderAriaLabel,\n stripedRows,\n sticky = false,\n hidden = false,\n stuck = false,\n stickyState,\n selectionColumnId,\n focusedComponent,\n onFocusedComponentChange,\n tableRole,\n resizerRoleDescription,\n isExpandable,\n setLastUserAction,\n }: TheadProps,\n outerRef: React.Ref<HTMLTableRowElement>\n ) => {\n const isVisualRefresh = useVisualRefresh();\n\n const headerCellClass = clsx(\n headerCellStyles['header-cell'],\n headerCellStyles[`header-cell-variant-${variant}`],\n sticky && headerCellStyles['header-cell-sticky'],\n stuck && headerCellStyles['header-cell-stuck'],\n stripedRows && headerCellStyles['has-striped-rows'],\n isVisualRefresh && headerCellStyles['is-visual-refresh']\n );\n\n const selectionCellClass = clsx(\n styles['selection-control'],\n styles['selection-control-header'],\n isVisualRefresh && styles['is-visual-refresh']\n );\n\n const { getColumnStyles, columnWidths, updateColumn, setCell } = useColumnWidths();\n\n return (\n <thead className={clsx(!hidden && styles['thead-active'])}>\n <tr\n {...focusMarkers.all}\n ref={outerRef}\n aria-rowindex={1}\n {...getTableHeaderRowRoleProps({ tableRole })}\n onFocus={event => {\n const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n onFocusedComponentChange?.(focusId);\n }}\n onBlur={() => onFocusedComponentChange?.(null)}\n >\n {selectionType ? (\n <TableThElement\n className={clsx(headerCellClass, selectionCellClass, hidden && headerCellStyles['header-cell-hidden'])}\n hidden={hidden}\n tableRole={tableRole}\n colIndex={0}\n focusedComponent={focusedComponent}\n columnId={selectionColumnId}\n stickyState={stickyState}\n >\n {getSelectAllProps ? (\n <SelectionControl\n onFocusDown={event => {\n onFocusMove!(event.target as HTMLElement, -1, +1);\n }}\n focusedComponent={focusedComponent}\n {...getSelectAllProps()}\n {...(sticky ? { tabIndex: -1 } : {})}\n />\n ) : (\n <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n )}\n <Divider className={styles['resize-divider']} />\n </TableThElement>\n ) : null}\n\n {columnDefinitions.map((column, colIndex) => {\n const columnId = getColumnKey(column, colIndex);\n return (\n <TableHeaderCell\n key={columnId}\n style={getColumnStyles(sticky, columnId)}\n className={headerCellClass}\n tabIndex={sticky ? -1 : 0}\n focusedComponent={focusedComponent}\n column={column}\n activeSortingColumn={sortingColumn}\n sortingDescending={sortingDescending}\n sortingDisabled={sortingDisabled}\n wrapLines={wrapLines}\n hidden={hidden}\n colIndex={selectionType ? colIndex + 1 : colIndex}\n columnId={columnId}\n updateColumn={updateColumn}\n onResizeFinish={() => onResizeFinish(columnWidths)}\n resizableColumns={resizableColumns}\n onClick={detail => {\n setLastUserAction('sorting');\n fireNonCancelableEvent(onSortingChange, detail);\n }}\n isEditable={!!column.editConfig}\n stickyState={stickyState}\n cellRef={node => setCell(sticky, columnId, node)}\n tableRole={tableRole}\n resizerRoleDescription={resizerRoleDescription}\n // Expandable option is only applicable to the first data column of the table.\n // When present, the header content receives extra padding to match the first offset in the data cells.\n isExpandable={colIndex === 0 && isExpandable}\n />\n );\n })}\n </tr>\n </thead>\n );\n }\n);\n\nexport default Thead;\n"]}
@@ -4,7 +4,8 @@ interface ToolsHeaderProps {
4
4
  filter?: React.ReactNode;
5
5
  pagination?: React.ReactNode;
6
6
  preferences?: React.ReactNode;
7
+ setLastUserAction?: (name: string) => void;
7
8
  }
8
- export default function ToolsHeader({ header, filter, pagination, preferences }: ToolsHeaderProps): JSX.Element;
9
+ export default function ToolsHeader({ header, filter, pagination, preferences, setLastUserAction }: ToolsHeaderProps): JSX.Element;
9
10
  export {};
10
11
  //# sourceMappingURL=tools-header.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"tools-header.d.ts","sourceRoot":"","sources":["../../../src/table/tools-header.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAM1C,UAAU,gBAAgB;IACxB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,EAAE,gBAAgB,eAwBhG"}
1
+ {"version":3,"file":"tools-header.d.ts","sourceRoot":"","sources":["../../../src/table/tools-header.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAM1C,UAAU,gBAAgB;IACxB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,iBAAiB,EAAE,EAAE,gBAAgB,eAwCnH"}
@@ -6,7 +6,7 @@ import { useContainerBreakpoints } from '../internal/hooks/container-queries';
6
6
  import styles from './styles.css.js';
7
7
  import { CollectionLabelContext } from '../internal/context/collection-label-context';
8
8
  import { useUniqueId } from '../internal/hooks/use-unique-id';
9
- export default function ToolsHeader({ header, filter, pagination, preferences }) {
9
+ export default function ToolsHeader({ header, filter, pagination, preferences, setLastUserAction }) {
10
10
  const [breakpoint, ref] = useContainerBreakpoints(['xs']);
11
11
  const isHeaderString = typeof header === 'string';
12
12
  const assignHeaderId = useContext(CollectionLabelContext).assignId;
@@ -19,9 +19,9 @@ export default function ToolsHeader({ header, filter, pagination, preferences })
19
19
  return (React.createElement(React.Fragment, null,
20
20
  isHeaderString ? React.createElement("span", { id: headingId }, header) : header,
21
21
  hasTools && (React.createElement("div", { ref: ref, className: clsx(styles.tools, isSmall && styles['tools-small']) },
22
- filter && React.createElement("div", { className: styles['tools-filtering'] }, filter),
22
+ filter && (React.createElement("div", { className: styles['tools-filtering'], onClickCapture: () => setLastUserAction === null || setLastUserAction === void 0 ? void 0 : setLastUserAction('filter'), onKeyDownCapture: () => setLastUserAction === null || setLastUserAction === void 0 ? void 0 : setLastUserAction('filter') }, filter)),
23
23
  React.createElement("div", { className: styles['tools-align-right'] },
24
- pagination && React.createElement("div", { className: styles['tools-pagination'] }, pagination),
25
- preferences && React.createElement("div", { className: styles['tools-preferences'] }, preferences))))));
24
+ pagination && (React.createElement("div", { className: styles['tools-pagination'], onClickCapture: () => setLastUserAction === null || setLastUserAction === void 0 ? void 0 : setLastUserAction('pagination') }, pagination)),
25
+ preferences && (React.createElement("div", { className: styles['tools-preferences'], onClickCapture: () => setLastUserAction === null || setLastUserAction === void 0 ? void 0 : setLastUserAction('preferences') }, preferences)))))));
26
26
  }
27
27
  //# sourceMappingURL=tools-header.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tools-header.js","sourceRoot":"","sources":["../../../src/table/tools-header.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,MAAM,8CAA8C,CAAC;AACtF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAS9D,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAoB;IAC/F,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,GAAG,uBAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAC1D,MAAM,cAAc,GAAG,OAAO,MAAM,KAAK,QAAQ,CAAC;IAClD,MAAM,cAAc,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC,QAAQ,CAAC;IACnE,MAAM,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IACzC,IAAI,cAAc,KAAK,SAAS,IAAI,cAAc,EAAE;QAClD,cAAc,CAAC,SAAS,CAAC,CAAC;KAC3B;IACD,MAAM,OAAO,GAAG,UAAU,KAAK,SAAS,CAAC;IACzC,MAAM,QAAQ,GAAG,MAAM,IAAI,UAAU,IAAI,WAAW,CAAC;IACrD,OAAO,CACL;QACG,cAAc,CAAC,CAAC,CAAC,8BAAM,EAAE,EAAE,SAAS,IAAG,MAAM,CAAQ,CAAC,CAAC,CAAC,MAAM;QAC9D,QAAQ,IAAI,CACX,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,IAAI,MAAM,CAAC,aAAa,CAAC,CAAC;YAC3E,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,IAAG,MAAM,CAAO;YACpE,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC;gBACxC,UAAU,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,IAAG,UAAU,CAAO;gBAC5E,WAAW,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,WAAW,CAAO,CAC5E,CACF,CACP,CACA,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useContext } from 'react';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport styles from './styles.css.js';\nimport { CollectionLabelContext } from '../internal/context/collection-label-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\ninterface ToolsHeaderProps {\n header: React.ReactNode;\n filter?: React.ReactNode;\n pagination?: React.ReactNode;\n preferences?: React.ReactNode;\n}\n\nexport default function ToolsHeader({ header, filter, pagination, preferences }: ToolsHeaderProps) {\n const [breakpoint, ref] = useContainerBreakpoints(['xs']);\n const isHeaderString = typeof header === 'string';\n const assignHeaderId = useContext(CollectionLabelContext).assignId;\n const headingId = useUniqueId('heading');\n if (assignHeaderId !== undefined && isHeaderString) {\n assignHeaderId(headingId);\n }\n const isSmall = breakpoint === 'default';\n const hasTools = filter || pagination || preferences;\n return (\n <>\n {isHeaderString ? <span id={headingId}>{header}</span> : header}\n {hasTools && (\n <div ref={ref} className={clsx(styles.tools, isSmall && styles['tools-small'])}>\n {filter && <div className={styles['tools-filtering']}>{filter}</div>}\n <div className={styles['tools-align-right']}>\n {pagination && <div className={styles['tools-pagination']}>{pagination}</div>}\n {preferences && <div className={styles['tools-preferences']}>{preferences}</div>}\n </div>\n </div>\n )}\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"tools-header.js","sourceRoot":"","sources":["../../../src/table/tools-header.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,MAAM,8CAA8C,CAAC;AACtF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAU9D,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,iBAAiB,EAAoB;IAClH,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,GAAG,uBAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAC1D,MAAM,cAAc,GAAG,OAAO,MAAM,KAAK,QAAQ,CAAC;IAClD,MAAM,cAAc,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC,QAAQ,CAAC;IACnE,MAAM,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IACzC,IAAI,cAAc,KAAK,SAAS,IAAI,cAAc,EAAE;QAClD,cAAc,CAAC,SAAS,CAAC,CAAC;KAC3B;IACD,MAAM,OAAO,GAAG,UAAU,KAAK,SAAS,CAAC;IACzC,MAAM,QAAQ,GAAG,MAAM,IAAI,UAAU,IAAI,WAAW,CAAC;IACrD,OAAO,CACL;QACG,cAAc,CAAC,CAAC,CAAC,8BAAM,EAAE,EAAE,SAAS,IAAG,MAAM,CAAQ,CAAC,CAAC,CAAC,MAAM;QAC9D,QAAQ,IAAI,CACX,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,IAAI,MAAM,CAAC,aAAa,CAAC,CAAC;YAC3E,MAAM,IAAI,CACT,6BACE,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,EACpC,cAAc,EAAE,GAAG,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,QAAQ,CAAC,EACnD,gBAAgB,EAAE,GAAG,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,QAAQ,CAAC,IAEpD,MAAM,CACH,CACP;YACD,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC;gBACxC,UAAU,IAAI,CACb,6BAAK,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EAAE,cAAc,EAAE,GAAG,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,YAAY,CAAC,IAChG,UAAU,CACP,CACP;gBACA,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,EAAE,cAAc,EAAE,GAAG,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,aAAa,CAAC,IAClG,WAAW,CACR,CACP,CACG,CACF,CACP,CACA,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useContext } from 'react';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport styles from './styles.css.js';\nimport { CollectionLabelContext } from '../internal/context/collection-label-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\ninterface ToolsHeaderProps {\n header: React.ReactNode;\n filter?: React.ReactNode;\n pagination?: React.ReactNode;\n preferences?: React.ReactNode;\n setLastUserAction?: (name: string) => void;\n}\n\nexport default function ToolsHeader({ header, filter, pagination, preferences, setLastUserAction }: ToolsHeaderProps) {\n const [breakpoint, ref] = useContainerBreakpoints(['xs']);\n const isHeaderString = typeof header === 'string';\n const assignHeaderId = useContext(CollectionLabelContext).assignId;\n const headingId = useUniqueId('heading');\n if (assignHeaderId !== undefined && isHeaderString) {\n assignHeaderId(headingId);\n }\n const isSmall = breakpoint === 'default';\n const hasTools = filter || pagination || preferences;\n return (\n <>\n {isHeaderString ? <span id={headingId}>{header}</span> : header}\n {hasTools && (\n <div ref={ref} className={clsx(styles.tools, isSmall && styles['tools-small'])}>\n {filter && (\n <div\n className={styles['tools-filtering']}\n onClickCapture={() => setLastUserAction?.('filter')}\n onKeyDownCapture={() => setLastUserAction?.('filter')}\n >\n {filter}\n </div>\n )}\n <div className={styles['tools-align-right']}>\n {pagination && (\n <div className={styles['tools-pagination']} onClickCapture={() => setLastUserAction?.('pagination')}>\n {pagination}\n </div>\n )}\n {preferences && (\n <div className={styles['tools-preferences']} onClickCapture={() => setLastUserAction?.('preferences')}>\n {preferences}\n </div>\n )}\n </div>\n </div>\n )}\n </>\n );\n}\n"]}
@@ -1,27 +1,27 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "tabs-header": "awsui_tabs-header_14rmt_iftfj_198",
5
- "tabs-header-list": "awsui_tabs-header-list_14rmt_iftfj_206",
6
- "pagination-button": "awsui_pagination-button_14rmt_iftfj_223",
7
- "pagination-button-left": "awsui_pagination-button-left_14rmt_iftfj_230",
8
- "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_iftfj_233",
9
- "pagination-button-right": "awsui_pagination-button-right_14rmt_iftfj_237",
10
- "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_iftfj_240",
11
- "tabs-tab": "awsui_tabs-tab_14rmt_iftfj_245",
12
- "tabs-tab-label": "awsui_tabs-tab-label_14rmt_iftfj_257",
13
- "tabs-tab-link": "awsui_tabs-tab-link_14rmt_iftfj_273",
14
- "refresh": "awsui_refresh_14rmt_iftfj_292",
15
- "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_iftfj_343",
16
- "tabs-tab-active": "awsui_tabs-tab-active_14rmt_iftfj_378",
17
- "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_iftfj_385",
18
- "root": "awsui_root_14rmt_iftfj_389",
19
- "tabs": "awsui_tabs_14rmt_iftfj_198",
20
- "tabs-content": "awsui_tabs-content_14rmt_iftfj_430",
21
- "fit-height": "awsui_fit-height_14rmt_iftfj_434",
22
- "tabs-content-active": "awsui_tabs-content-active_14rmt_iftfj_440",
23
- "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_iftfj_454",
24
- "with-paddings": "awsui_with-paddings_14rmt_iftfj_454",
25
- "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_iftfj_465"
4
+ "tabs-header": "awsui_tabs-header_14rmt_1f77r_194",
5
+ "tabs-header-list": "awsui_tabs-header-list_14rmt_1f77r_202",
6
+ "pagination-button": "awsui_pagination-button_14rmt_1f77r_219",
7
+ "pagination-button-left": "awsui_pagination-button-left_14rmt_1f77r_226",
8
+ "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_1f77r_229",
9
+ "pagination-button-right": "awsui_pagination-button-right_14rmt_1f77r_233",
10
+ "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_1f77r_236",
11
+ "tabs-tab": "awsui_tabs-tab_14rmt_1f77r_241",
12
+ "tabs-tab-label": "awsui_tabs-tab-label_14rmt_1f77r_253",
13
+ "tabs-tab-link": "awsui_tabs-tab-link_14rmt_1f77r_269",
14
+ "refresh": "awsui_refresh_14rmt_1f77r_288",
15
+ "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_1f77r_339",
16
+ "tabs-tab-active": "awsui_tabs-tab-active_14rmt_1f77r_374",
17
+ "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_1f77r_381",
18
+ "root": "awsui_root_14rmt_1f77r_385",
19
+ "tabs": "awsui_tabs_14rmt_1f77r_194",
20
+ "tabs-content": "awsui_tabs-content_14rmt_1f77r_426",
21
+ "fit-height": "awsui_fit-height_14rmt_1f77r_430",
22
+ "tabs-content-active": "awsui_tabs-content-active_14rmt_1f77r_436",
23
+ "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_1f77r_450",
24
+ "with-paddings": "awsui_with-paddings_14rmt_1f77r_450",
25
+ "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_1f77r_461"
26
26
  };
27
27