@cloudscape-design/components 3.0.1156 → 3.0.1158

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 (266) hide show
  1. package/alert/index.js +1 -1
  2. package/alert/interfaces.d.ts +1 -2
  3. package/alert/styles.css.js +27 -27
  4. package/alert/styles.scoped.css +50 -50
  5. package/alert/styles.selectors.js +27 -27
  6. package/annotation-context/annotation/styles.css.js +13 -13
  7. package/annotation-context/annotation/styles.scoped.css +21 -21
  8. package/annotation-context/annotation/styles.selectors.js +13 -13
  9. package/app-layout/notifications/styles.css.js +3 -3
  10. package/app-layout/notifications/styles.scoped.css +7 -7
  11. package/app-layout/notifications/styles.selectors.js +3 -3
  12. package/app-layout/runtime-drawer/index.d.ts.map +1 -1
  13. package/app-layout/runtime-drawer/index.js +20 -18
  14. package/app-layout/runtime-drawer/index.js.map +1 -1
  15. package/app-layout/visual-refresh/styles.css.js +86 -86
  16. package/app-layout/visual-refresh/styles.scoped.css +258 -258
  17. package/app-layout/visual-refresh/styles.selectors.js +86 -86
  18. package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +30 -30
  19. package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +89 -89
  20. package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +30 -30
  21. package/app-layout/visual-refresh-toolbar/navigation/styles.css.js +4 -4
  22. package/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +7 -7
  23. package/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +4 -4
  24. package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +27 -27
  25. package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +54 -54
  26. package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +27 -27
  27. package/attribute-editor/styles.css.js +15 -15
  28. package/attribute-editor/styles.scoped.css +28 -28
  29. package/attribute-editor/styles.selectors.js +15 -15
  30. package/autosuggest/index.js +28 -11
  31. package/autosuggest/interfaces.d.ts +2 -1
  32. package/autosuggest/interfaces.js.map +1 -1
  33. package/badge/index.d.ts +2 -0
  34. package/badge/index.js +14 -13
  35. package/badge/interfaces.d.ts +3 -2
  36. package/box/index.js +18 -13
  37. package/box/interfaces.d.ts +2 -1
  38. package/breadcrumb-group/item/styles.css.js +7 -7
  39. package/breadcrumb-group/item/styles.scoped.css +28 -28
  40. package/breadcrumb-group/item/styles.selectors.js +7 -7
  41. package/button/index.js +12 -11
  42. package/button/interfaces.d.ts +4 -2
  43. package/button/styles.css.js +22 -22
  44. package/button/styles.scoped.css +256 -256
  45. package/button/styles.selectors.js +22 -22
  46. package/button-dropdown/index.js +27 -11
  47. package/button-dropdown/interfaces.d.ts +6 -2
  48. package/button-dropdown/item-element/styles.css.js +20 -20
  49. package/button-dropdown/item-element/styles.scoped.css +34 -34
  50. package/button-dropdown/item-element/styles.selectors.js +20 -20
  51. package/button-group/index.js +42 -11
  52. package/button-group/interfaces.d.ts +10 -0
  53. package/button-group/interfaces.d.ts.map +1 -1
  54. package/button-group/interfaces.js.map +1 -1
  55. package/checkbox/index.js +9 -11
  56. package/checkbox/interfaces.d.ts +3 -2
  57. package/checkbox/styles.css.js +3 -3
  58. package/checkbox/styles.scoped.css +11 -11
  59. package/checkbox/styles.selectors.js +3 -3
  60. package/container/index.js +29 -13
  61. package/container/interfaces.d.ts +2 -1
  62. package/content-layout/styles.css.js +14 -14
  63. package/content-layout/styles.scoped.css +27 -27
  64. package/content-layout/styles.selectors.js +14 -14
  65. package/date-input/index.js +8 -10
  66. package/flashbar/index.js +10 -13
  67. package/flashbar/interfaces.d.ts +1 -0
  68. package/flashbar/styles.css.js +50 -50
  69. package/flashbar/styles.scoped.css +187 -187
  70. package/flashbar/styles.selectors.js +50 -50
  71. package/help-panel/styles.css.js +6 -6
  72. package/help-panel/styles.scoped.css +73 -73
  73. package/help-panel/styles.selectors.js +6 -6
  74. package/icon/index.js +8 -13
  75. package/icon/interfaces.d.ts +2 -1
  76. package/icon-provider/index.js +12 -2
  77. package/index.d.ts +4 -1
  78. package/index.js +4 -0
  79. package/input/index.js +53 -12
  80. package/input/interfaces.d.ts +3 -1
  81. package/input/styles.css.js +13 -13
  82. package/input/styles.scoped.css +74 -74
  83. package/input/styles.selectors.js +13 -13
  84. package/internal/base-component/styles.scoped.css +1 -1
  85. package/internal/components/drag-handle-wrapper/styles.css.js +21 -21
  86. package/internal/components/drag-handle-wrapper/styles.scoped.css +49 -49
  87. package/internal/components/drag-handle-wrapper/styles.selectors.js +21 -21
  88. package/internal/components/dropdown/styles.css.js +20 -20
  89. package/internal/components/dropdown/styles.scoped.css +38 -38
  90. package/internal/components/dropdown/styles.selectors.js +20 -20
  91. package/internal/components/radio-button/interfaces.d.ts +3 -3
  92. package/internal/components/radio-button/styles.css.js +7 -7
  93. package/internal/components/radio-button/styles.scoped.css +18 -18
  94. package/internal/components/radio-button/styles.selectors.js +7 -7
  95. package/internal/components/token-list/styles.css.js +10 -10
  96. package/internal/components/token-list/styles.scoped.css +25 -25
  97. package/internal/components/token-list/styles.selectors.js +10 -10
  98. package/internal/environment.js +3 -3
  99. package/internal/environment.json +3 -3
  100. package/internal/generated/custom-css-properties/index.d.ts +5 -0
  101. package/internal/generated/custom-css-properties/index.d.ts.map +1 -1
  102. package/internal/generated/custom-css-properties/index.js +131 -126
  103. package/internal/generated/custom-css-properties/index.js.map +1 -1
  104. package/internal/manifest.json +1 -1
  105. package/internal/plugins/controllers/drawers.d.ts +2 -2
  106. package/internal/plugins/controllers/drawers.d.ts.map +1 -1
  107. package/internal/plugins/controllers/drawers.js.map +1 -1
  108. package/internal/plugins/widget/interfaces.d.ts +2 -2
  109. package/internal/plugins/widget/interfaces.d.ts.map +1 -1
  110. package/internal/plugins/widget/interfaces.js.map +1 -1
  111. package/internal/types.d.ts +19 -1
  112. package/internal/types.d.ts.map +1 -1
  113. package/internal/types.js.map +1 -1
  114. package/link/index.js +25 -11
  115. package/link/interfaces.d.ts +3 -2
  116. package/link/styles.css.js +20 -20
  117. package/link/styles.scoped.css +103 -103
  118. package/link/styles.selectors.js +20 -20
  119. package/navigable-group/index.js +19 -4
  120. package/package.json +4 -1
  121. package/progress-bar/index.d.ts +1 -0
  122. package/progress-bar/index.js +52 -14
  123. package/progress-bar/interfaces.d.ts +1 -0
  124. package/progress-bar/styles.css.js +19 -19
  125. package/progress-bar/styles.scoped.css +56 -56
  126. package/progress-bar/styles.selectors.js +19 -19
  127. package/prompt-input/index.js +19 -11
  128. package/prompt-input/interfaces.d.ts +4 -3
  129. package/prompt-input/styles.css.js +17 -17
  130. package/prompt-input/styles.scoped.css +79 -79
  131. package/prompt-input/styles.selectors.js +17 -17
  132. package/radio-button/index.js +19 -4
  133. package/radio-group/index.js +20 -11
  134. package/radio-group/interfaces.d.ts +1 -1
  135. package/segmented-control/index.js +14 -13
  136. package/segmented-control/interfaces.d.ts +1 -0
  137. package/segmented-control/styles.css.js +16 -16
  138. package/segmented-control/styles.scoped.css +46 -46
  139. package/segmented-control/styles.selectors.js +16 -16
  140. package/select/interfaces.d.ts +1 -1
  141. package/select/interfaces.js.map +1 -1
  142. package/slider/styles.css.js +26 -26
  143. package/slider/styles.scoped.css +86 -86
  144. package/slider/styles.selectors.js +26 -26
  145. package/space-between/index.js +10 -13
  146. package/space-between/interfaces.d.ts +2 -1
  147. package/spinner/index.js +10 -13
  148. package/spinner/interfaces.d.ts +2 -1
  149. package/spinner/styles.css.js +13 -13
  150. package/spinner/styles.scoped.css +39 -39
  151. package/spinner/styles.selectors.js +13 -13
  152. package/status-indicator/index.js +10 -13
  153. package/status-indicator/interfaces.d.ts +2 -1
  154. package/steps/index.js +11 -11
  155. package/steps/interfaces.d.ts +6 -2
  156. package/table/header-cell/index.d.ts +1 -1
  157. package/table/header-cell/index.d.ts.map +1 -1
  158. package/table/header-cell/index.js +1 -1
  159. package/table/header-cell/index.js.map +1 -1
  160. package/table/header-cell/th-element.d.ts +1 -1
  161. package/table/header-cell/th-element.d.ts.map +1 -1
  162. package/table/header-cell/th-element.js.map +1 -1
  163. package/table/resizer/index.d.ts +3 -1
  164. package/table/resizer/index.d.ts.map +1 -1
  165. package/table/resizer/index.js +8 -5
  166. package/table/resizer/index.js.map +1 -1
  167. package/table/resizer/styles.css.js +13 -12
  168. package/table/resizer/styles.scoped.css +22 -22
  169. package/table/resizer/styles.selectors.js +13 -12
  170. package/table/thead.d.ts +1 -1
  171. package/table/thead.d.ts.map +1 -1
  172. package/table/thead.js.map +1 -1
  173. package/tabs/index.d.ts +1 -0
  174. package/tabs/index.d.ts.map +1 -1
  175. package/tabs/index.js +3 -3
  176. package/tabs/index.js.map +1 -1
  177. package/tabs/interfaces.d.ts +45 -0
  178. package/tabs/interfaces.d.ts.map +1 -1
  179. package/tabs/interfaces.js.map +1 -1
  180. package/tabs/styles.css.js +30 -30
  181. package/tabs/styles.d.ts +32 -0
  182. package/tabs/styles.d.ts.map +1 -0
  183. package/tabs/styles.js +47 -0
  184. package/tabs/styles.js.map +1 -0
  185. package/tabs/styles.scoped.css +77 -73
  186. package/tabs/styles.selectors.js +30 -30
  187. package/tabs/tab-header-bar.d.ts +3 -1
  188. package/tabs/tab-header-bar.d.ts.map +1 -1
  189. package/tabs/tab-header-bar.js +6 -4
  190. package/tabs/tab-header-bar.js.map +1 -1
  191. package/tag-editor/styles.css.js +3 -3
  192. package/tag-editor/styles.scoped.css +13 -13
  193. package/tag-editor/styles.selectors.js +3 -3
  194. package/text-content/styles.css.js +1 -1
  195. package/text-content/styles.scoped.css +66 -66
  196. package/text-content/styles.selectors.js +1 -1
  197. package/text-filter/index.js +17 -10
  198. package/text-filter/interfaces.d.ts +1 -0
  199. package/textarea/index.js +65 -12
  200. package/textarea/interfaces.d.ts +3 -2
  201. package/textarea/styles.css.js +5 -5
  202. package/textarea/styles.scoped.css +45 -45
  203. package/textarea/styles.selectors.js +5 -5
  204. package/time-input/index.js +15 -11
  205. package/toggle/index.js +6 -10
  206. package/toggle/interfaces.d.ts +3 -2
  207. package/toggle/styles.css.js +10 -10
  208. package/toggle/styles.scoped.css +23 -23
  209. package/toggle/styles.selectors.js +10 -10
  210. package/toggle-button/index.js +14 -11
  211. package/wizard/index.js +35 -13
  212. package/wizard/interfaces.d.ts +1 -1
  213. package/autosuggest/internal-do-not-use-core.js +0 -35
  214. package/badge/internal-do-not-use-core.js +0 -19
  215. package/box/internal-do-not-use-core.js +0 -23
  216. package/button/internal-do-not-use-core.js +0 -19
  217. package/button-dropdown/internal-do-not-use-core.js +0 -34
  218. package/button-group/internal-do-not-use-core.js +0 -49
  219. package/checkbox/internal-do-not-use-core.js +0 -16
  220. package/container/internal-do-not-use-core.js +0 -34
  221. package/date-input/internal-do-not-use-core.js +0 -16
  222. package/flashbar/internal-do-not-use-core.js +0 -15
  223. package/icon/internal-do-not-use-core.js +0 -13
  224. package/input/internal-do-not-use-core.js +0 -59
  225. package/link/internal-do-not-use-core.js +0 -32
  226. package/progress-bar/internal-do-not-use-core.js +0 -56
  227. package/prompt-input/internal-do-not-use-core.js +0 -26
  228. package/radio-group/internal-do-not-use-core.js +0 -27
  229. package/segmented-control/internal-do-not-use-core.js +0 -19
  230. package/space-between/internal-do-not-use-core.js +0 -15
  231. package/spinner/internal-do-not-use-core.js +0 -15
  232. package/status-indicator/internal-do-not-use-core.js +0 -15
  233. package/steps/internal-do-not-use-core.js +0 -18
  234. package/text-filter/internal-do-not-use-core.js +0 -25
  235. package/textarea/internal-do-not-use-core.js +0 -71
  236. package/time-input/internal-do-not-use-core.js +0 -22
  237. package/toggle/internal-do-not-use-core.js +0 -14
  238. package/toggle-button/internal-do-not-use-core.js +0 -21
  239. package/wizard/internal-do-not-use-core.js +0 -40
  240. /package/autosuggest/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  241. /package/badge/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  242. /package/box/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  243. /package/button/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  244. /package/button-dropdown/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  245. /package/button-group/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  246. /package/checkbox/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  247. /package/container/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  248. /package/date-input/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  249. /package/flashbar/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  250. /package/icon/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  251. /package/input/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  252. /package/link/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  253. /package/progress-bar/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  254. /package/prompt-input/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  255. /package/radio-group/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  256. /package/segmented-control/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  257. /package/space-between/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  258. /package/spinner/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  259. /package/status-indicator/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  260. /package/steps/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  261. /package/text-filter/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  262. /package/textarea/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  263. /package/time-input/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  264. /package/toggle/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  265. /package/toggle-button/{internal-do-not-use-core.js.map → index.js.map} +0 -0
  266. /package/wizard/{internal-do-not-use-core.js.map → index.js.map} +0 -0
@@ -150,52 +150,52 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
150
150
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
151
151
  SPDX-License-Identifier: Apache-2.0
152
152
  */
153
- @keyframes awsui_spinner-rotator_1612d_11e4r_1 {
153
+ @keyframes awsui_spinner-rotator_1612d_1pcpw_1 {
154
154
  0% {
155
- transform: rotate(var(--awsui-spinner-rotator-from-d43v8n));
155
+ transform: rotate(var(--awsui-spinner-rotator-from-rhu47t));
156
156
  }
157
157
  100% {
158
- transform: rotate(var(--awsui-spinner-rotator-to-d43v8n));
158
+ transform: rotate(var(--awsui-spinner-rotator-to-rhu47t));
159
159
  }
160
160
  }
161
- @keyframes awsui_spinner-line-left_1612d_11e4r_1 {
161
+ @keyframes awsui_spinner-line-left_1612d_1pcpw_1 {
162
162
  0% {
163
- transform: rotate(var(--awsui-spinner-line-left-from-d43v8n));
163
+ transform: rotate(var(--awsui-spinner-line-left-from-rhu47t));
164
164
  }
165
165
  50% {
166
- transform: rotate(var(--awsui-spinner-line-left-to-d43v8n));
166
+ transform: rotate(var(--awsui-spinner-line-left-to-rhu47t));
167
167
  }
168
168
  100% {
169
- transform: rotate(var(--awsui-spinner-line-left-from-d43v8n));
169
+ transform: rotate(var(--awsui-spinner-line-left-from-rhu47t));
170
170
  }
171
171
  }
172
- @keyframes awsui_spinner-line-right_1612d_11e4r_1 {
172
+ @keyframes awsui_spinner-line-right_1612d_1pcpw_1 {
173
173
  0% {
174
- transform: rotate(var(--awsui-spinner-line-right-from-d43v8n));
174
+ transform: rotate(var(--awsui-spinner-line-right-from-rhu47t));
175
175
  }
176
176
  50% {
177
- transform: rotate(var(--awsui-spinner-line-right-to-d43v8n));
177
+ transform: rotate(var(--awsui-spinner-line-right-to-rhu47t));
178
178
  }
179
179
  100% {
180
- transform: rotate(var(--awsui-spinner-line-right-from-d43v8n));
180
+ transform: rotate(var(--awsui-spinner-line-right-from-rhu47t));
181
181
  }
182
182
  }
183
- .awsui_root_1612d_11e4r_183:not(#\9) {
184
- --awsui-spinner-rotator-from-d43v8n: 0deg;
185
- --awsui-spinner-rotator-to-d43v8n: 360deg;
186
- --awsui-spinner-line-left-from-d43v8n: 0deg;
187
- --awsui-spinner-line-left-to-d43v8n: 120deg;
188
- --awsui-spinner-line-right-from-d43v8n: 90deg;
189
- --awsui-spinner-line-right-to-d43v8n: -30deg;
183
+ .awsui_root_1612d_1pcpw_183:not(#\9) {
184
+ --awsui-spinner-rotator-from-rhu47t: 0deg;
185
+ --awsui-spinner-rotator-to-rhu47t: 360deg;
186
+ --awsui-spinner-line-left-from-rhu47t: 0deg;
187
+ --awsui-spinner-line-left-to-rhu47t: 120deg;
188
+ --awsui-spinner-line-right-from-rhu47t: 90deg;
189
+ --awsui-spinner-line-right-to-rhu47t: -30deg;
190
190
  display: inline-block;
191
191
  vertical-align: top;
192
192
  /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
193
- animation: awsui_spinner-rotator_1612d_11e4r_1 0.7s linear infinite;
193
+ animation: awsui_spinner-rotator_1612d_1pcpw_1 0.7s linear infinite;
194
194
  box-sizing: border-box;
195
195
  line-height: 0;
196
196
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
197
197
  }
198
- .awsui_root_1612d_11e4r_183.awsui_size-normal_1612d_11e4r_198:not(#\9) {
198
+ .awsui_root_1612d_1pcpw_183.awsui_size-normal_1612d_1pcpw_198:not(#\9) {
199
199
  inline-size: var(--size-icon-normal-levt08, 16px);
200
200
  block-size: var(--size-icon-normal-levt08, 16px);
201
201
  padding-block: calc((var(--size-icon-normal-levt08, 16px) - 12px) / 2);
@@ -203,7 +203,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
203
203
  margin-block: calc((var(--line-height-body-m-2mh3ke, 20px) - var(--size-icon-normal-levt08, 16px)) / 2);
204
204
  box-sizing: border-box;
205
205
  }
206
- .awsui_root_1612d_11e4r_183.awsui_size-big_1612d_11e4r_206:not(#\9) {
206
+ .awsui_root_1612d_1pcpw_183.awsui_size-big_1612d_1pcpw_206:not(#\9) {
207
207
  inline-size: var(--size-icon-big-7pq9l3, 32px);
208
208
  block-size: var(--size-icon-big-7pq9l3, 32px);
209
209
  padding-block: calc((var(--size-icon-big-7pq9l3, 32px) - 24px) / 2);
@@ -211,7 +211,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
211
211
  margin-block: calc((var(--line-height-heading-xl-hko6p0, 30px) - var(--size-icon-big-7pq9l3, 32px)) / 2);
212
212
  box-sizing: border-box;
213
213
  }
214
- .awsui_root_1612d_11e4r_183.awsui_size-large_1612d_11e4r_214:not(#\9) {
214
+ .awsui_root_1612d_1pcpw_183.awsui_size-large_1612d_1pcpw_214:not(#\9) {
215
215
  inline-size: var(--size-icon-large-mb6y6y, 48px);
216
216
  block-size: var(--size-icon-large-mb6y6y, 48px);
217
217
  padding-block: calc((var(--size-icon-large-mb6y6y, 48px) - 36px) / 2);
@@ -219,32 +219,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
219
219
  margin-block: calc((var(--line-height-display-l-vwanzp, 48px) - var(--size-icon-large-mb6y6y, 48px)) / 2);
220
220
  box-sizing: border-box;
221
221
  }
222
- .awsui_root_1612d_11e4r_183.awsui_variant-normal_1612d_11e4r_222:not(#\9) {
222
+ .awsui_root_1612d_1pcpw_183.awsui_variant-normal_1612d_1pcpw_222:not(#\9) {
223
223
  color: currentColor;
224
224
  }
225
- .awsui_root_1612d_11e4r_183.awsui_variant-disabled_1612d_11e4r_225:not(#\9) {
225
+ .awsui_root_1612d_1pcpw_183.awsui_variant-disabled_1612d_1pcpw_225:not(#\9) {
226
226
  color: var(--color-text-interactive-disabled-1bqmrl, #b4b4bb);
227
227
  }
228
- .awsui_root_1612d_11e4r_183.awsui_variant-inverted_1612d_11e4r_228:not(#\9) {
228
+ .awsui_root_1612d_1pcpw_183.awsui_variant-inverted_1612d_1pcpw_228:not(#\9) {
229
229
  color: var(--color-text-inverted-4v4dmq, #ffffff);
230
230
  }
231
- .awsui_root_1612d_11e4r_183:not(#\9):dir(rtl) {
232
- --awsui-spinner-rotator-from-d43v8n: 360deg;
233
- --awsui-spinner-rotator-to-d43v8n: 0deg;
234
- --awsui-spinner-line-left-from-d43v8n: 0deg;
235
- --awsui-spinner-line-left-to-d43v8n: -120deg;
236
- --awsui-spinner-line-right-from-d43v8n: -90deg;
237
- --awsui-spinner-line-right-to-d43v8n: 30deg;
231
+ .awsui_root_1612d_1pcpw_183:not(#\9):dir(rtl) {
232
+ --awsui-spinner-rotator-from-rhu47t: 360deg;
233
+ --awsui-spinner-rotator-to-rhu47t: 0deg;
234
+ --awsui-spinner-line-left-from-rhu47t: 0deg;
235
+ --awsui-spinner-line-left-to-rhu47t: -120deg;
236
+ --awsui-spinner-line-right-from-rhu47t: -90deg;
237
+ --awsui-spinner-line-right-to-rhu47t: 30deg;
238
238
  }
239
239
 
240
- .awsui_circle_1612d_11e4r_240:not(#\9) {
240
+ .awsui_circle_1612d_1pcpw_240:not(#\9) {
241
241
  display: inline-block;
242
242
  inline-size: 50%;
243
243
  block-size: 100%;
244
244
  overflow: hidden;
245
245
  position: relative;
246
246
  }
247
- .awsui_circle_1612d_11e4r_240:not(#\9):after {
247
+ .awsui_circle_1612d_1pcpw_240:not(#\9):after {
248
248
  position: absolute;
249
249
  box-sizing: border-box;
250
250
  content: "";
@@ -257,7 +257,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
257
257
  border-inline-end-color: transparent;
258
258
  border-block-end-color: transparent;
259
259
  }
260
- .awsui_circle_1612d_11e4r_240:not(#\9):after {
260
+ .awsui_circle_1612d_1pcpw_240:not(#\9):after {
261
261
  /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
262
262
  animation: 1.5s ease-in-out infinite;
263
263
  inset-block-start: 0;
@@ -265,13 +265,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
265
265
  block-size: 100%;
266
266
  inline-size: 200%;
267
267
  }
268
- .awsui_circle_1612d_11e4r_240.awsui_circle-left_1612d_11e4r_268:not(#\9):after {
268
+ .awsui_circle_1612d_1pcpw_240.awsui_circle-left_1612d_1pcpw_268:not(#\9):after {
269
269
  inset-inline-start: 0;
270
270
  /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
271
- animation-name: awsui_spinner-line-left_1612d_11e4r_1;
271
+ animation-name: awsui_spinner-line-left_1612d_1pcpw_1;
272
272
  }
273
- .awsui_circle_1612d_11e4r_240.awsui_circle-right_1612d_11e4r_273:not(#\9):after {
273
+ .awsui_circle_1612d_1pcpw_240.awsui_circle-right_1612d_1pcpw_273:not(#\9):after {
274
274
  inset-inline-start: -100%;
275
275
  /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
276
- animation-name: awsui_spinner-line-right_1612d_11e4r_1;
276
+ animation-name: awsui_spinner-line-right_1612d_1pcpw_1;
277
277
  }
@@ -2,18 +2,18 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "root": "awsui_root_1612d_11e4r_183",
6
- "spinner-rotator": "awsui_spinner-rotator_1612d_11e4r_1",
7
- "size-normal": "awsui_size-normal_1612d_11e4r_198",
8
- "size-big": "awsui_size-big_1612d_11e4r_206",
9
- "size-large": "awsui_size-large_1612d_11e4r_214",
10
- "variant-normal": "awsui_variant-normal_1612d_11e4r_222",
11
- "variant-disabled": "awsui_variant-disabled_1612d_11e4r_225",
12
- "variant-inverted": "awsui_variant-inverted_1612d_11e4r_228",
13
- "circle": "awsui_circle_1612d_11e4r_240",
14
- "circle-left": "awsui_circle-left_1612d_11e4r_268",
15
- "spinner-line-left": "awsui_spinner-line-left_1612d_11e4r_1",
16
- "circle-right": "awsui_circle-right_1612d_11e4r_273",
17
- "spinner-line-right": "awsui_spinner-line-right_1612d_11e4r_1"
5
+ "root": "awsui_root_1612d_1pcpw_183",
6
+ "spinner-rotator": "awsui_spinner-rotator_1612d_1pcpw_1",
7
+ "size-normal": "awsui_size-normal_1612d_1pcpw_198",
8
+ "size-big": "awsui_size-big_1612d_1pcpw_206",
9
+ "size-large": "awsui_size-large_1612d_1pcpw_214",
10
+ "variant-normal": "awsui_variant-normal_1612d_1pcpw_222",
11
+ "variant-disabled": "awsui_variant-disabled_1612d_1pcpw_225",
12
+ "variant-inverted": "awsui_variant-inverted_1612d_1pcpw_228",
13
+ "circle": "awsui_circle_1612d_1pcpw_240",
14
+ "circle-left": "awsui_circle-left_1612d_1pcpw_268",
15
+ "spinner-line-left": "awsui_spinner-line-left_1612d_1pcpw_1",
16
+ "circle-right": "awsui_circle-right_1612d_1pcpw_273",
17
+ "spinner-line-right": "awsui_spinner-line-right_1612d_1pcpw_1"
18
18
  };
19
19
 
@@ -1,18 +1,15 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
+ 'use client';
3
4
  import React from 'react';
4
-
5
- import CoreComponent from './internal-do-not-use-core';
5
+ import useBaseComponent from '../internal/hooks/use-base-component';
6
6
  import { applyDisplayName } from '../internal/utils/apply-display-name';
7
- import { validateProps } from '@cloudscape-design/component-toolkit/internal';
8
-
9
-
10
-
11
- const StatusIndicator = (props) => {
12
- validateProps('StatusIndicator', props, ["nativeAttributes"], {}, 'console');
13
- return React.createElement(CoreComponent, props);
14
- };
15
-
16
-
7
+ import InternalStatusIndicator from './internal';
8
+ export default function StatusIndicator({ type = 'success', wrapText = true, ...props }) {
9
+ const baseComponentProps = useBaseComponent('StatusIndicator', {
10
+ props: { colorOverride: props.colorOverride, type, wrapText },
11
+ });
12
+ return React.createElement(InternalStatusIndicator, { type: type, wrapText: wrapText, ...props, ...baseComponentProps });
13
+ }
17
14
  applyDisplayName(StatusIndicator, 'StatusIndicator');
18
- export default StatusIndicator;
15
+ //# sourceMappingURL=index.js.map
@@ -2,7 +2,7 @@ import { BaseComponentProps } from '../internal/base-component';
2
2
  /**
3
3
  * @awsuiSystem core
4
4
  */
5
-
5
+ import { NativeAttributes } from '../internal/utils/with-native-attributes';
6
6
  export interface StatusIndicatorProps extends BaseComponentProps {
7
7
  /**
8
8
  * Specifies the status type.
@@ -36,6 +36,7 @@ export interface StatusIndicatorProps extends BaseComponentProps {
36
36
  *
37
37
  * @awsuiSystem core
38
38
  */
39
+ nativeAttributes?: NativeAttributes<React.HTMLAttributes<HTMLElement>>;
39
40
  }
40
41
  export declare namespace StatusIndicatorProps {
41
42
  type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading' | 'not-started';
package/steps/index.js CHANGED
@@ -1,18 +1,18 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
+ 'use client';
3
4
  import React from 'react';
4
-
5
- import CoreComponent from './internal-do-not-use-core';
5
+ import { getBaseProps } from '../internal/base-component';
6
+ import useBaseComponent from '../internal/hooks/use-base-component';
6
7
  import { applyDisplayName } from '../internal/utils/apply-display-name';
7
- import { validateProps } from '@cloudscape-design/component-toolkit/internal';
8
-
9
-
10
-
11
- const Steps = (props) => {
12
- validateProps('Steps', props, ["orientation","renderStep"], {}, 'console');
13
- return React.createElement(CoreComponent, props);
8
+ import { getExternalProps } from '../internal/utils/external-props';
9
+ import InternalSteps from './internal';
10
+ const Steps = ({ steps, ...props }) => {
11
+ const baseProps = getBaseProps(props);
12
+ const baseComponentProps = useBaseComponent('Steps');
13
+ const externalProps = getExternalProps(props);
14
+ return React.createElement(InternalSteps, { ...baseProps, ...baseComponentProps, ...externalProps, steps: steps });
14
15
  };
15
-
16
-
17
16
  applyDisplayName(Steps, 'Steps');
18
17
  export default Steps;
18
+ //# sourceMappingURL=index.js.map
@@ -17,7 +17,7 @@ export interface StepsProps extends BaseComponentProps {
17
17
  *
18
18
  * @awsuiSystem core
19
19
  */
20
-
20
+ orientation?: StepsProps.Orientation;
21
21
  /**
22
22
  * Render a step. This overrides the default icon, header, and details provided by the component.
23
23
  * The function is called for each step and should return an object with the following keys:
@@ -27,7 +27,11 @@ export interface StepsProps extends BaseComponentProps {
27
27
  *
28
28
  * @awsuiSystem core
29
29
  */
30
-
30
+ renderStep?: (step: StepsProps.Step) => {
31
+ header: React.ReactNode;
32
+ details?: React.ReactNode;
33
+ icon?: React.ReactNode;
34
+ };
31
35
  /**
32
36
  * Provides an `aria-label` to the progress steps container.
33
37
  * Don't use `ariaLabel` and `ariaLabelledby` at the same time.
@@ -31,7 +31,7 @@ export interface TableHeaderCellProps<ItemType> {
31
31
  isExpandable?: boolean;
32
32
  hasDynamicContent?: boolean;
33
33
  variant: TableProps.Variant;
34
- tableVariant?: string;
34
+ tableVariant?: TableProps.Variant;
35
35
  }
36
36
  export declare function TableHeaderCell<ItemType>({
37
37
  tabIndex,
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAWtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAO1C,MAAM,WAAW,oBAAoB,CAAC,QAAQ;IAC5C,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IACxC,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,SAAS,EAAE,SAAS,CAAC;IACrB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,eAAe,CAAC,QAAQ,EAAE,EACxC,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,KAAK,EACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,sBAAsB,EACtB,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,OAAO,EACP,YAAY,GACb,EAAE,oBAAoB,CAAC,QAAQ,CAAC,eAyIhC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAWtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAO1C,MAAM,WAAW,oBAAoB,CAAC,QAAQ;IAC5C,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IACxC,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,SAAS,EAAE,SAAS,CAAC;IACrB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC;CACnC;AAED,wBAAgB,eAAe,CAAC,QAAQ,EAAE,EACxC,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,KAAK,EACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,sBAAsB,EACtB,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,OAAO,EACP,YAAY,GACb,EAAE,oBAAoB,CAAC,QAAQ,CAAC,eA0IhC"}
@@ -83,6 +83,6 @@ export function TableHeaderCell({ tabIndex, column, activeSortingColumn, sorting
83
83
  resizableColumns ? (React.createElement(Resizer, { tabIndex: tabIndex, focusId: `resize-control-${String(columnId)}`, showFocusRing: focusedComponent === `resize-control-${String(columnId)}`, onWidthUpdate: newWidth => updateColumn(columnId, newWidth), onWidthUpdateCommit: onResizeFinish, ariaLabelledby: headerId, minWidth: typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth, roleDescription: i18n('ariaLabels.resizerRoleDescription', resizerRoleDescription),
84
84
  // TODO: Replace with this when strings are available
85
85
  // tooltipText={i18n('ariaLabels.resizerTooltipText', resizerTooltipText)}
86
- tooltipText: resizerTooltipText })) : (React.createElement(Divider, { className: styles['resize-divider'] }))));
86
+ tooltipText: resizerTooltipText, isBorderless: variant === 'full-page' || variant === 'embedded' || variant === 'borderless' })) : (React.createElement(Divider, { className: styles['resize-divider'] }))));
87
87
  }
88
88
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useResizeObserver, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../../i18n/context';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { GeneratedAnalyticsMetadataTableSort } from '../analytics-metadata/interfaces';\nimport { ColumnWidthStyle } from '../column-widths-utils';\nimport { TableProps } from '../interfaces';\nimport { Divider, Resizer } from '../resizer';\nimport { StickyColumnsModel } from '../sticky-columns';\nimport { TableRole } from '../table-role';\nimport { TableThElement } from './th-element';\nimport { getSortingIconName, getSortingStatus, isSorted } from './utils';\n\nimport analyticsSelectors from '../analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface TableHeaderCellProps<ItemType> {\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n stuck?: boolean;\n sticky?: boolean;\n hidden?: boolean;\n stripedRows?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n resizableColumns?: boolean;\n resizableStyle?: ColumnWidthStyle;\n isEditable?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n cellRef: React.RefCallback<HTMLElement>;\n focusedComponent?: null | string;\n tableRole: TableRole;\n resizerRoleDescription?: string;\n resizerTooltipText?: string;\n isExpandable?: boolean;\n hasDynamicContent?: boolean;\n variant: TableProps.Variant;\n tableVariant?: string;\n}\n\nexport function TableHeaderCell<ItemType>({\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n stuck,\n sticky,\n hidden,\n stripedRows,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n resizableStyle,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n cellRef,\n tableRole,\n resizerRoleDescription,\n resizerTooltipText,\n isExpandable,\n hasDynamicContent,\n variant,\n tableVariant,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const clickableHeaderRef = useRef<HTMLDivElement>(null);\n const { tabIndex: clickableHeaderTabIndex } = useSingleTabStopNavigation(clickableHeaderRef, { tabIndex });\n\n const cellRefObject = useRef<HTMLElement>(null);\n const cellRefCombined = useMergeRefs(cellRef, cellRefObject);\n\n // Keep sticky and non-sticky headers in sync for dynamic cell\n // content changes. This is only needed when:\n // - Column has dynamic content\n // - This is the non-sticky version of a sticky header (hidden === true)\n // - Columns are not resizable\n useResizeObserver(hasDynamicContent ? cellRefObject : () => null, entry => {\n updateColumn(columnId, entry.borderBoxWidth);\n });\n\n return (\n <TableThElement\n resizableStyle={resizableStyle}\n cellRef={cellRefCombined}\n sortingStatus={sortingStatus}\n sortingDisabled={sortingDisabled}\n focusedComponent={focusedComponent}\n stuck={stuck}\n sticky={sticky}\n resizable={resizableColumns}\n hidden={hidden}\n stripedRows={stripedRows}\n colIndex={colIndex}\n columnId={columnId}\n stickyState={stickyState}\n tableRole={tableRole}\n variant={variant}\n tableVariant={tableVariant}\n {...(sortingDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n action: 'sort',\n detail: {\n position: `${colIndex + 1}`,\n columnId: column.id ? `${column.id}` : '',\n label: `.${analyticsSelectors['header-cell-text']}`,\n sortingDescending: `${!sortingDescending}`,\n },\n } as GeneratedAnalyticsMetadataTableSort))}\n >\n <div\n ref={clickableHeaderRef}\n data-focus-id={`sorting-control-${String(columnId)}`}\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent === `sorting-control-${String(columnId)}`,\n [styles['header-cell-content-expandable']]: isExpandable,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: clickableHeaderTabIndex,\n role: 'button',\n onClick: handleClick,\n }\n : {})}\n >\n <div\n className={clsx(\n styles['header-cell-text'],\n analyticsSelectors['header-cell-text'],\n wrapLines && styles['header-cell-text-wrap']\n )}\n id={headerId}\n >\n {column.header}\n {isEditable ? (\n <span className={styles['edit-icon']}>\n <InternalIcon\n name=\"edit\"\n ariaLabel={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns ? (\n <Resizer\n tabIndex={tabIndex}\n focusId={`resize-control-${String(columnId)}`}\n showFocusRing={focusedComponent === `resize-control-${String(columnId)}`}\n onWidthUpdate={newWidth => updateColumn(columnId, newWidth)}\n onWidthUpdateCommit={onResizeFinish}\n ariaLabelledby={headerId}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n roleDescription={i18n('ariaLabels.resizerRoleDescription', resizerRoleDescription)}\n // TODO: Replace with this when strings are available\n // tooltipText={i18n('ariaLabels.resizerTooltipText', resizerTooltipText)}\n tooltipText={resizerTooltipText}\n />\n ) : (\n <Divider className={styles['resize-divider']} />\n )}\n </TableThElement>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAC7G,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAC3F,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAIjD,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEzE,OAAO,kBAAkB,MAAM,qCAAqC,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAiCrC,MAAM,UAAU,eAAe,CAAW,EACxC,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,KAAK,EACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,sBAAsB,EACtB,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,OAAO,EACP,YAAY,GACmB;;IAC/B,MAAM,IAAI,GAAG,eAAe,CAAC,OAAO,CAAC,CAAC;IACtC,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,iBAAiB,IAAI,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC;IACrE,MAAM,MAAM,GAAG,CAAC,CAAC,mBAAmB,IAAI,QAAQ,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;IAC9E,MAAM,aAAa,GAAG,gBAAgB,CAAC,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC,iBAAiB,EAAE,CAAC,CAAC,eAAe,CAAC,CAAC;IACjG,MAAM,WAAW,GAAG,GAAG,EAAE,CACvB,OAAO,CAAC;QACN,aAAa,EAAE,MAAM;QACrB,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK;KAClD,CAAC,CAAC;IAEL,2FAA2F;IAC3F,sFAAsF;IACtF,4FAA4F;IAC5F,sDAAsD;IACtD,MAAM,cAAc,GAAG,CAAC,EAAE,WAAW,EAAE,CAAC,EAAuB,EAAE,EAAE;QACjE,IAAI,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,IAAI,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,EAAE,CAAC;YAC/D,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,WAAW,EAAE,CAAC;QAChB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,WAAW,CAAC,eAAe,CAAC,CAAC;IAE9C,MAAM,kBAAkB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACxD,MAAM,EAAE,QAAQ,EAAE,uBAAuB,EAAE,GAAG,0BAA0B,CAAC,kBAAkB,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC;IAE3G,MAAM,aAAa,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAChD,MAAM,eAAe,GAAG,YAAY,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;IAE7D,8DAA8D;IAC9D,6CAA6C;IAC7C,+BAA+B;IAC/B,wEAAwE;IACxE,8BAA8B;IAC9B,iBAAiB,CAAC,iBAAiB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE;QACxE,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,cAAc,IACb,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,eAAe,EACxB,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,gBAAgB,EAC3B,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,KACtB,CAAC,eAAe;YAClB,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,6BAA6B,CAAC;gBAC5B,MAAM,EAAE,MAAM;gBACd,MAAM,EAAE;oBACN,QAAQ,EAAE,GAAG,QAAQ,GAAG,CAAC,EAAE;oBAC3B,QAAQ,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE;oBACzC,KAAK,EAAE,IAAI,kBAAkB,CAAC,kBAAkB,CAAC,EAAE;oBACnD,iBAAiB,EAAE,GAAG,CAAC,iBAAiB,EAAE;iBAC3C;aACqC,CAAC,CAAC;QAE9C,6BACE,GAAG,EAAE,kBAAkB,mBACR,mBAAmB,MAAM,CAAC,QAAQ,CAAC,EAAE,EACpD,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC,EAAE;gBAC7C,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,gBAAgB,KAAK,mBAAmB,MAAM,CAAC,QAAQ,CAAC,EAAE;gBAC9F,CAAC,MAAM,CAAC,gCAAgC,CAAC,CAAC,EAAE,YAAY;aACzD,CAAC,gBAEA,MAAM,CAAC,SAAS;gBACd,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC;oBACf,MAAM,EAAE,MAAM;oBACd,UAAU,EAAE,MAAM,IAAI,CAAC,CAAC,iBAAiB;oBACzC,QAAQ,EAAE,CAAC,CAAC,eAAe;iBAC5B,CAAC;gBACJ,CAAC,CAAC,SAAS,KAEX,CAAC,aAAa,IAAI,CAAC,eAAe;gBACpC,CAAC,CAAC;oBACE,UAAU,EAAE,cAAc;oBAC1B,QAAQ,EAAE,uBAAuB;oBACjC,IAAI,EAAE,QAAQ;oBACd,OAAO,EAAE,WAAW;iBACrB;gBACH,CAAC,CAAC,EAAE,CAAC;YAEP,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,kBAAkB,CAAC,EAC1B,kBAAkB,CAAC,kBAAkB,CAAC,EACtC,SAAS,IAAI,MAAM,CAAC,uBAAuB,CAAC,CAC7C,EACD,EAAE,EAAE,QAAQ;gBAEX,MAAM,CAAC,MAAM;gBACb,UAAU,CAAC,CAAC,CAAC,CACZ,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC;oBAClC,oBAAC,YAAY,IACX,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,IAAI,CAAC,gDAAgD,EAAE,MAAA,MAAM,CAAC,UAAU,0CAAE,iBAAiB,CAAC,GACvG,CACG,CACR,CAAC,CAAC,CAAC,IAAI,CACJ;YACL,aAAa,IAAI,CAChB,8BAAM,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC;gBACrC,oBAAC,YAAY,IAAC,IAAI,EAAE,kBAAkB,CAAC,aAAa,CAAC,GAAI,CACpD,CACR,CACG;QACL,gBAAgB,CAAC,CAAC,CAAC,CAClB,oBAAC,OAAO,IACN,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,kBAAkB,MAAM,CAAC,QAAQ,CAAC,EAAE,EAC7C,aAAa,EAAE,gBAAgB,KAAK,kBAAkB,MAAM,CAAC,QAAQ,CAAC,EAAE,EACxE,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC,YAAY,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAC3D,mBAAmB,EAAE,cAAc,EACnC,cAAc,EAAE,QAAQ,EACxB,QAAQ,EAAE,OAAO,MAAM,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,EAC3F,eAAe,EAAE,IAAI,CAAC,mCAAmC,EAAE,sBAAsB,CAAC;YAClF,qDAAqD;YACrD,0EAA0E;YAC1E,WAAW,EAAE,kBAAkB,EAC/B,YAAY,EAAE,OAAO,KAAK,WAAW,IAAI,OAAO,KAAK,UAAU,IAAI,OAAO,KAAK,YAAY,GAC3F,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,OAAO,IAAC,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,GAAI,CACjD,CACc,CAClB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useResizeObserver, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../../i18n/context';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { GeneratedAnalyticsMetadataTableSort } from '../analytics-metadata/interfaces';\nimport { ColumnWidthStyle } from '../column-widths-utils';\nimport { TableProps } from '../interfaces';\nimport { Divider, Resizer } from '../resizer';\nimport { StickyColumnsModel } from '../sticky-columns';\nimport { TableRole } from '../table-role';\nimport { TableThElement } from './th-element';\nimport { getSortingIconName, getSortingStatus, isSorted } from './utils';\n\nimport analyticsSelectors from '../analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface TableHeaderCellProps<ItemType> {\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n stuck?: boolean;\n sticky?: boolean;\n hidden?: boolean;\n stripedRows?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n resizableColumns?: boolean;\n resizableStyle?: ColumnWidthStyle;\n isEditable?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n cellRef: React.RefCallback<HTMLElement>;\n focusedComponent?: null | string;\n tableRole: TableRole;\n resizerRoleDescription?: string;\n resizerTooltipText?: string;\n isExpandable?: boolean;\n hasDynamicContent?: boolean;\n variant: TableProps.Variant;\n tableVariant?: TableProps.Variant;\n}\n\nexport function TableHeaderCell<ItemType>({\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n stuck,\n sticky,\n hidden,\n stripedRows,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n resizableStyle,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n cellRef,\n tableRole,\n resizerRoleDescription,\n resizerTooltipText,\n isExpandable,\n hasDynamicContent,\n variant,\n tableVariant,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const clickableHeaderRef = useRef<HTMLDivElement>(null);\n const { tabIndex: clickableHeaderTabIndex } = useSingleTabStopNavigation(clickableHeaderRef, { tabIndex });\n\n const cellRefObject = useRef<HTMLElement>(null);\n const cellRefCombined = useMergeRefs(cellRef, cellRefObject);\n\n // Keep sticky and non-sticky headers in sync for dynamic cell\n // content changes. This is only needed when:\n // - Column has dynamic content\n // - This is the non-sticky version of a sticky header (hidden === true)\n // - Columns are not resizable\n useResizeObserver(hasDynamicContent ? cellRefObject : () => null, entry => {\n updateColumn(columnId, entry.borderBoxWidth);\n });\n\n return (\n <TableThElement\n resizableStyle={resizableStyle}\n cellRef={cellRefCombined}\n sortingStatus={sortingStatus}\n sortingDisabled={sortingDisabled}\n focusedComponent={focusedComponent}\n stuck={stuck}\n sticky={sticky}\n resizable={resizableColumns}\n hidden={hidden}\n stripedRows={stripedRows}\n colIndex={colIndex}\n columnId={columnId}\n stickyState={stickyState}\n tableRole={tableRole}\n variant={variant}\n tableVariant={tableVariant}\n {...(sortingDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n action: 'sort',\n detail: {\n position: `${colIndex + 1}`,\n columnId: column.id ? `${column.id}` : '',\n label: `.${analyticsSelectors['header-cell-text']}`,\n sortingDescending: `${!sortingDescending}`,\n },\n } as GeneratedAnalyticsMetadataTableSort))}\n >\n <div\n ref={clickableHeaderRef}\n data-focus-id={`sorting-control-${String(columnId)}`}\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent === `sorting-control-${String(columnId)}`,\n [styles['header-cell-content-expandable']]: isExpandable,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: clickableHeaderTabIndex,\n role: 'button',\n onClick: handleClick,\n }\n : {})}\n >\n <div\n className={clsx(\n styles['header-cell-text'],\n analyticsSelectors['header-cell-text'],\n wrapLines && styles['header-cell-text-wrap']\n )}\n id={headerId}\n >\n {column.header}\n {isEditable ? (\n <span className={styles['edit-icon']}>\n <InternalIcon\n name=\"edit\"\n ariaLabel={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns ? (\n <Resizer\n tabIndex={tabIndex}\n focusId={`resize-control-${String(columnId)}`}\n showFocusRing={focusedComponent === `resize-control-${String(columnId)}`}\n onWidthUpdate={newWidth => updateColumn(columnId, newWidth)}\n onWidthUpdateCommit={onResizeFinish}\n ariaLabelledby={headerId}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n roleDescription={i18n('ariaLabels.resizerRoleDescription', resizerRoleDescription)}\n // TODO: Replace with this when strings are available\n // tooltipText={i18n('ariaLabels.resizerTooltipText', resizerTooltipText)}\n tooltipText={resizerTooltipText}\n isBorderless={variant === 'full-page' || variant === 'embedded' || variant === 'borderless'}\n />\n ) : (\n <Divider className={styles['resize-divider']} />\n )}\n </TableThElement>\n );\n}\n"]}
@@ -22,8 +22,8 @@ export interface TableThElementProps {
22
22
  tableRole: TableRole;
23
23
  children: React.ReactNode;
24
24
  variant: TableProps.Variant;
25
+ tableVariant?: TableProps.Variant;
25
26
  ariaLabel?: string;
26
- tableVariant?: string;
27
27
  }
28
28
  export declare function TableThElement({
29
29
  resizableStyle,
@@ -1 +1 @@
1
- {"version":3,"file":"th-element.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/th-element.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAQtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAuB,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAA8B,SAAS,EAAE,MAAM,eAAe,CAAC;AAEtE,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAKxC,MAAM,WAAW,mBAAmB;IAClC,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAChD,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,cAAc,CAAC,EAC7B,cAAc,EACd,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,KAAK,EACL,MAAM,EACN,SAAS,EACT,MAAM,EACN,WAAW,EACX,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,QAAQ,EACR,OAAO,EACP,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,mBAAmB,eA+CrB"}
1
+ {"version":3,"file":"th-element.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/th-element.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAQtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAuB,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAA8B,SAAS,EAAE,MAAM,eAAe,CAAC;AAEtE,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAKxC,MAAM,WAAW,mBAAmB;IAClC,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACjC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAChD,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,EAC7B,cAAc,EACd,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,KAAK,EACL,MAAM,EACN,SAAS,EACT,MAAM,EACN,WAAW,EACX,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,QAAQ,EACR,OAAO,EACP,SAAS,EACT,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,mBAAmB,eA+CrB"}
@@ -1 +1 @@
1
- {"version":3,"file":"th-element.js","sourceRoot":"","sources":["../../../../src/table/header-cell/th-element.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { ColumnWidthStyle } from '../column-widths-utils';\nimport { TableProps } from '../interfaces';\nimport { StickyColumnsModel, useStickyCellStyles } from '../sticky-columns';\nimport { getTableColHeaderRoleProps, TableRole } from '../table-role';\nimport { getStickyClassNames } from '../utils';\nimport { SortingStatus } from './utils';\n\nimport tableStyles from '../styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface TableThElementProps {\n resizableStyle?: ColumnWidthStyle;\n sortingStatus?: SortingStatus;\n sortingDisabled?: boolean;\n focusedComponent?: null | string;\n stuck?: boolean;\n sticky?: boolean;\n resizable?: boolean;\n hidden?: boolean;\n stripedRows?: boolean;\n isSelection?: boolean;\n colIndex: number;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n cellRef?: React.RefCallback<HTMLElement> | null;\n tableRole: TableRole;\n children: React.ReactNode;\n variant: TableProps.Variant;\n ariaLabel?: string;\n tableVariant?: string;\n}\n\nexport function TableThElement({\n resizableStyle,\n sortingStatus,\n sortingDisabled,\n focusedComponent,\n stuck,\n sticky,\n resizable,\n hidden,\n stripedRows,\n isSelection,\n colIndex,\n columnId,\n stickyState,\n cellRef,\n tableRole,\n children,\n variant,\n ariaLabel,\n tableVariant,\n ...props\n}: TableThElementProps) {\n const isVisualRefresh = useVisualRefresh();\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n const cellRefObject = useRef<HTMLTableCellElement>(null);\n const mergedRef = useMergeRefs(stickyStyles.ref, cellRef, cellRefObject);\n const { tabIndex: cellTabIndex } = useSingleTabStopNavigation(cellRefObject);\n\n return (\n <th\n data-focus-id={`header-${String(columnId)}`}\n className={clsx(\n styles['header-cell'],\n styles[`header-cell-variant-${variant}`],\n sticky && styles['header-cell-sticky'],\n resizable && styles['header-cell-resizable'],\n stuck && styles['header-cell-stuck'],\n stripedRows && styles['has-striped-rows'],\n isVisualRefresh && styles['is-visual-refresh'],\n isSelection && clsx(tableStyles['selection-control'], tableStyles['selection-control-header']),\n tableVariant && styles[`table-variant-${tableVariant}`],\n {\n [styles['header-cell-fake-focus']]: focusedComponent === `header-${String(columnId)}`,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n style={{ ...resizableStyle, ...stickyStyles.style }}\n ref={mergedRef}\n {...getTableColHeaderRoleProps({ tableRole, sortingStatus, colIndex })}\n tabIndex={cellTabIndex === -1 ? undefined : cellTabIndex}\n {...copyAnalyticsMetadataAttribute(props)}\n {...(ariaLabel ? { 'aria-label': ariaLabel } : {})}\n >\n {children}\n </th>\n );\n}\n"]}
1
+ {"version":3,"file":"th-element.js","sourceRoot":"","sources":["../../../../src/table/header-cell/th-element.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { ColumnWidthStyle } from '../column-widths-utils';\nimport { TableProps } from '../interfaces';\nimport { StickyColumnsModel, useStickyCellStyles } from '../sticky-columns';\nimport { getTableColHeaderRoleProps, TableRole } from '../table-role';\nimport { getStickyClassNames } from '../utils';\nimport { SortingStatus } from './utils';\n\nimport tableStyles from '../styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface TableThElementProps {\n resizableStyle?: ColumnWidthStyle;\n sortingStatus?: SortingStatus;\n sortingDisabled?: boolean;\n focusedComponent?: null | string;\n stuck?: boolean;\n sticky?: boolean;\n resizable?: boolean;\n hidden?: boolean;\n stripedRows?: boolean;\n isSelection?: boolean;\n colIndex: number;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n cellRef?: React.RefCallback<HTMLElement> | null;\n tableRole: TableRole;\n children: React.ReactNode;\n variant: TableProps.Variant;\n tableVariant?: TableProps.Variant;\n ariaLabel?: string;\n}\n\nexport function TableThElement({\n resizableStyle,\n sortingStatus,\n sortingDisabled,\n focusedComponent,\n stuck,\n sticky,\n resizable,\n hidden,\n stripedRows,\n isSelection,\n colIndex,\n columnId,\n stickyState,\n cellRef,\n tableRole,\n children,\n variant,\n ariaLabel,\n tableVariant,\n ...props\n}: TableThElementProps) {\n const isVisualRefresh = useVisualRefresh();\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n const cellRefObject = useRef<HTMLTableCellElement>(null);\n const mergedRef = useMergeRefs(stickyStyles.ref, cellRef, cellRefObject);\n const { tabIndex: cellTabIndex } = useSingleTabStopNavigation(cellRefObject);\n\n return (\n <th\n data-focus-id={`header-${String(columnId)}`}\n className={clsx(\n styles['header-cell'],\n styles[`header-cell-variant-${variant}`],\n sticky && styles['header-cell-sticky'],\n resizable && styles['header-cell-resizable'],\n stuck && styles['header-cell-stuck'],\n stripedRows && styles['has-striped-rows'],\n isVisualRefresh && styles['is-visual-refresh'],\n isSelection && clsx(tableStyles['selection-control'], tableStyles['selection-control-header']),\n tableVariant && styles[`table-variant-${tableVariant}`],\n {\n [styles['header-cell-fake-focus']]: focusedComponent === `header-${String(columnId)}`,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n style={{ ...resizableStyle, ...stickyStyles.style }}\n ref={mergedRef}\n {...getTableColHeaderRoleProps({ tableRole, sortingStatus, colIndex })}\n tabIndex={cellTabIndex === -1 ? undefined : cellTabIndex}\n {...copyAnalyticsMetadataAttribute(props)}\n {...(ariaLabel ? { 'aria-label': ariaLabel } : {})}\n >\n {children}\n </th>\n );\n}\n"]}
@@ -8,6 +8,7 @@ interface ResizerProps {
8
8
  showFocusRing?: boolean;
9
9
  roleDescription?: string;
10
10
  tooltipText?: string;
11
+ isBorderless: boolean;
11
12
  }
12
13
  export declare function Divider({
13
14
  className
@@ -23,7 +24,8 @@ export declare function Resizer({
23
24
  showFocusRing,
24
25
  focusId,
25
26
  roleDescription,
26
- tooltipText
27
+ tooltipText,
28
+ isBorderless
27
29
  }: ResizerProps): JSX.Element;
28
30
  export declare function ResizeTracker(): JSX.Element;
29
31
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/resizer/index.tsx"],"names":[],"mappings":"AAmBA,UAAU,YAAY;IACpB,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAMD,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,eAE5D;AAED,wBAAgB,OAAO,CAAC,EACtB,aAAa,EACb,mBAAmB,EACnB,cAAc,EACd,QAA+B,EAC/B,QAAQ,EACR,aAAa,EACb,OAAO,EACP,eAAe,EACf,WAAW,GACZ,EAAE,YAAY,eA8Xd;AAED,wBAAgB,aAAa,gBAE5B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/resizer/index.tsx"],"names":[],"mappings":"AAmBA,UAAU,YAAY;IACpB,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;CACvB;AAMD,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,eAE5D;AAED,wBAAgB,OAAO,CAAC,EACtB,aAAa,EACb,mBAAmB,EACnB,cAAc,EACd,QAA+B,EAC/B,QAAQ,EACR,aAAa,EACb,OAAO,EACP,eAAe,EACf,WAAW,EACX,YAAY,GACb,EAAE,YAAY,eA+Xd;AAED,wBAAgB,aAAa,gBAE5B"}
@@ -19,7 +19,7 @@ const AUTO_GROW_INCREMENT = 5;
19
19
  export function Divider({ className }) {
20
20
  return React.createElement("span", { className: clsx(styles.divider, styles['divider-disabled'], className) });
21
21
  }
22
- export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, minWidth = DEFAULT_COLUMN_WIDTH, tabIndex, showFocusRing, focusId, roleDescription, tooltipText, }) {
22
+ export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, minWidth = DEFAULT_COLUMN_WIDTH, tabIndex, showFocusRing, focusId, roleDescription, tooltipText, isBorderless, }) {
23
23
  onWidthUpdate = useStableCallback(onWidthUpdate);
24
24
  onWidthUpdateCommit = useStableCallback(onWidthUpdateCommit);
25
25
  const isVisualRefresh = useVisualRefresh();
@@ -166,7 +166,7 @@ export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, mi
166
166
  };
167
167
  const onKeyDown = (event) => {
168
168
  if (isKeyboardDragging) {
169
- const keys = [KeyCode.left, KeyCode.right, KeyCode.enter, KeyCode.right, KeyCode.space, KeyCode.escape];
169
+ const keys = [KeyCode.left, KeyCode.right, KeyCode.enter, KeyCode.space, KeyCode.escape];
170
170
  if (keys.indexOf(event.keyCode) !== -1) {
171
171
  event.preventDefault();
172
172
  if (isEventLike(event)) {
@@ -253,7 +253,10 @@ export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, mi
253
253
  }
254
254
  }, [isDragging]);
255
255
  const { tabIndex: resizerTabIndex } = useSingleTabStopNavigation(resizerToggleRef, { tabIndex });
256
- return (React.createElement("div", { className: clsx(styles['resizer-wrapper'], isVisualRefresh && styles['is-visual-refresh']), ref: positioningWrapperRef },
256
+ return (React.createElement("div", {
257
+ // When the table is borderless (works in visual refresh tables only), the last resize handle must not
258
+ // exceed table's edges, as it causes an unintended overflow otherwise.
259
+ className: clsx(styles['resizer-wrapper'], isVisualRefresh && styles['visual-refresh'], (!isVisualRefresh || isBorderless) && styles['is-borderless']), ref: positioningWrapperRef },
257
260
  React.createElement(DragHandleWrapper, { clickDragThreshold: 3, hideButtonsOnDrag: false, directions: {
258
261
  'inline-start': resizerObscured ? undefined : headerCellWidth > minWidth ? 'active' : 'disabled',
259
262
  'inline-end': resizerObscured ? undefined : 'active',
@@ -277,7 +280,7 @@ export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, mi
277
280
  });
278
281
  }
279
282
  } },
280
- React.createElement("button", { type: "button", ref: resizerToggleRef, className: clsx(styles.resizer, (resizerHasFocus || showFocusRing || isKeyboardDragging) && styles['has-focus'], isVisualRefresh && styles['is-visual-refresh']), onPointerDown: event => {
283
+ React.createElement("button", { type: "button", ref: resizerToggleRef, className: clsx(styles.resizer, (resizerHasFocus || showFocusRing || isKeyboardDragging) && styles['has-focus']), onPointerDown: event => {
281
284
  if (event.pointerType === 'mouse' && event.button !== 0) {
282
285
  return;
283
286
  }
@@ -303,7 +306,7 @@ export function Resizer({ onWidthUpdate, onWidthUpdateCommit, ariaLabelledby, mi
303
306
  return;
304
307
  }
305
308
  }, "aria-roledescription": roleDescription, "aria-labelledby": ariaLabelledby, tabIndex: resizerTabIndex, "data-focus-id": focusId }),
306
- React.createElement("span", { className: clsx(styles['divider-interactive'], (isPointerDown || isDragging) && styles['divider-active'], isVisualRefresh && styles['is-visual-refresh']), "data-awsui-table-suppress-navigation": true, ref: resizerSeparatorRef, id: separatorId, role: "slider", tabIndex: -1, "aria-labelledby": ariaLabelledby, "aria-hidden": !isKeyboardDragging, "aria-valuemin": minWidth, "aria-valuemax": Number.MAX_SAFE_INTEGER, "aria-valuenow": headerCellWidth, "data-focus-id": focusId, onBlur: event => {
309
+ React.createElement("span", { className: clsx(styles['divider-interactive'], (isPointerDown || isDragging) && styles['divider-active']), "data-awsui-table-suppress-navigation": true, ref: resizerSeparatorRef, id: separatorId, role: "slider", tabIndex: -1, "aria-labelledby": ariaLabelledby, "aria-hidden": !isKeyboardDragging, "aria-valuemin": minWidth, "aria-valuemax": Number.MAX_SAFE_INTEGER, "aria-valuenow": headerCellWidth, "data-focus-id": focusId, onBlur: event => {
307
310
  setIsKeyboardDragging(false);
308
311
  if (event.relatedTarget !== resizerToggleRef.current) {
309
312
  setResizerHasFocus(false);