@cloudscape-design/components-themeable 3.0.1120 → 3.0.1121

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 (222) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/box/text.scss +11 -0
  3. package/lib/internal/scss/cards/analytics-metadata/styles.scss +16 -0
  4. package/lib/internal/scss/file-token-group/styles.scss +1 -1
  5. package/lib/internal/scss/internal/components/button-trigger/styles.scss +2 -2
  6. package/lib/internal/scss/internal/components/drag-handle-wrapper/motion.scss +14 -6
  7. package/lib/internal/scss/internal/components/drag-handle-wrapper/styles.scss +3 -4
  8. package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +1 -1
  9. package/lib/internal/scss/property-filter/filtering-token/styles.scss +1 -1
  10. package/lib/internal/scss/select/parts/styles.scss +0 -32
  11. package/lib/internal/scss/table/resizer/styles.scss +28 -16
  12. package/lib/internal/scss/token/analytics-metadata/styles.scss +8 -0
  13. package/lib/internal/scss/{token-group → token}/constants.scss +2 -0
  14. package/lib/internal/scss/{token-group → token}/mixins.scss +20 -0
  15. package/lib/internal/scss/token/styles.scss +119 -0
  16. package/lib/internal/scss/token/test-classes/styles.scss +8 -0
  17. package/lib/internal/scss/token-group/styles.scss +5 -72
  18. package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.d.ts +1 -1
  19. package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.d.ts.map +1 -1
  20. package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.js.map +1 -1
  21. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.d.ts +29 -0
  22. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.d.ts.map +1 -0
  23. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.js +87 -0
  24. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.js.map +1 -0
  25. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.d.ts.map +1 -1
  26. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js +4 -3
  27. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js.map +1 -1
  28. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-widget-messages.d.ts +3 -0
  29. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-widget-messages.d.ts.map +1 -0
  30. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-widget-messages.js +18 -0
  31. package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-widget-messages.js.map +1 -0
  32. package/lib/internal/template/box/interfaces.d.ts +3 -1
  33. package/lib/internal/template/box/interfaces.d.ts.map +1 -1
  34. package/lib/internal/template/box/interfaces.js.map +1 -1
  35. package/lib/internal/template/box/internal.js +3 -0
  36. package/lib/internal/template/box/internal.js.map +1 -1
  37. package/lib/internal/template/box/styles.css.js +192 -191
  38. package/lib/internal/template/box/styles.scoped.css +250 -236
  39. package/lib/internal/template/box/styles.selectors.js +192 -191
  40. package/lib/internal/template/cards/analytics-metadata/interfaces.d.ts +32 -0
  41. package/lib/internal/template/cards/analytics-metadata/interfaces.d.ts.map +1 -0
  42. package/lib/internal/template/cards/analytics-metadata/interfaces.js +4 -0
  43. package/lib/internal/template/cards/analytics-metadata/interfaces.js.map +1 -0
  44. package/lib/internal/template/cards/analytics-metadata/styles.css.js +8 -0
  45. package/lib/internal/template/cards/analytics-metadata/styles.scoped.css +15 -0
  46. package/lib/internal/template/cards/analytics-metadata/styles.selectors.js +9 -0
  47. package/lib/internal/template/cards/index.d.ts.map +1 -1
  48. package/lib/internal/template/cards/index.js +59 -21
  49. package/lib/internal/template/cards/index.js.map +1 -1
  50. package/lib/internal/template/file-token-group/file-token.js +1 -1
  51. package/lib/internal/template/file-token-group/file-token.js.map +1 -1
  52. package/lib/internal/template/index.d.ts +1 -0
  53. package/lib/internal/template/index.d.ts.map +1 -1
  54. package/lib/internal/template/index.js +1 -0
  55. package/lib/internal/template/index.js.map +1 -1
  56. package/lib/internal/template/internal/base-component/styles.scoped.css +13 -1
  57. package/lib/internal/template/internal/components/drag-handle-wrapper/direction-button.js +1 -1
  58. package/lib/internal/template/internal/components/drag-handle-wrapper/direction-button.js.map +1 -1
  59. package/lib/internal/template/internal/components/drag-handle-wrapper/index.d.ts +1 -1
  60. package/lib/internal/template/internal/components/drag-handle-wrapper/index.d.ts.map +1 -1
  61. package/lib/internal/template/internal/components/drag-handle-wrapper/index.js +26 -32
  62. package/lib/internal/template/internal/components/drag-handle-wrapper/index.js.map +1 -1
  63. package/lib/internal/template/internal/components/drag-handle-wrapper/interfaces.d.ts +1 -0
  64. package/lib/internal/template/internal/components/drag-handle-wrapper/interfaces.d.ts.map +1 -1
  65. package/lib/internal/template/internal/components/drag-handle-wrapper/interfaces.js.map +1 -1
  66. package/lib/internal/template/internal/components/drag-handle-wrapper/styles.css.js +20 -21
  67. package/lib/internal/template/internal/components/drag-handle-wrapper/styles.scoped.css +50 -39
  68. package/lib/internal/template/internal/components/drag-handle-wrapper/styles.selectors.js +20 -21
  69. package/lib/internal/template/internal/components/option/highlight-match.d.ts +3 -2
  70. package/lib/internal/template/internal/components/option/highlight-match.d.ts.map +1 -1
  71. package/lib/internal/template/internal/components/option/highlight-match.js +6 -6
  72. package/lib/internal/template/internal/components/option/highlight-match.js.map +1 -1
  73. package/lib/internal/template/internal/components/option/index.d.ts +1 -1
  74. package/lib/internal/template/internal/components/option/index.d.ts.map +1 -1
  75. package/lib/internal/template/internal/components/option/index.js +8 -6
  76. package/lib/internal/template/internal/components/option/index.js.map +1 -1
  77. package/lib/internal/template/internal/components/option/interfaces.d.ts +5 -0
  78. package/lib/internal/template/internal/components/option/interfaces.d.ts.map +1 -1
  79. package/lib/internal/template/internal/components/option/interfaces.js.map +1 -1
  80. package/lib/internal/template/internal/components/option/option-parts.d.ts +5 -2
  81. package/lib/internal/template/internal/components/option/option-parts.d.ts.map +1 -1
  82. package/lib/internal/template/internal/components/option/option-parts.js +7 -5
  83. package/lib/internal/template/internal/components/option/option-parts.js.map +1 -1
  84. package/lib/internal/template/internal/environment.js +2 -2
  85. package/lib/internal/template/internal/environment.json +2 -2
  86. package/lib/internal/template/internal/generated/styles/tokens.d.ts +1 -0
  87. package/lib/internal/template/internal/generated/styles/tokens.js +1 -0
  88. package/lib/internal/template/internal/generated/theming/index.cjs +31 -0
  89. package/lib/internal/template/internal/generated/theming/index.js +31 -0
  90. package/lib/internal/template/internal/plugins/widget/core.d.ts +17 -0
  91. package/lib/internal/template/internal/plugins/widget/core.d.ts.map +1 -0
  92. package/lib/internal/template/internal/plugins/widget/{internal.js → core.js} +14 -24
  93. package/lib/internal/template/internal/plugins/widget/core.js.map +1 -0
  94. package/lib/internal/template/internal/plugins/widget/index.d.ts +12 -0
  95. package/lib/internal/template/internal/plugins/widget/index.d.ts.map +1 -0
  96. package/lib/internal/template/internal/plugins/widget/index.js +22 -0
  97. package/lib/internal/template/internal/plugins/widget/index.js.map +1 -0
  98. package/lib/internal/template/internal/plugins/widget/interfaces.d.ts +2 -1
  99. package/lib/internal/template/internal/plugins/widget/interfaces.d.ts.map +1 -1
  100. package/lib/internal/template/internal/plugins/widget/interfaces.js.map +1 -1
  101. package/lib/internal/template/internal/plugins/widget.d.ts +2 -1
  102. package/lib/internal/template/internal/plugins/widget.d.ts.map +1 -1
  103. package/lib/internal/template/internal/plugins/widget.js +2 -1
  104. package/lib/internal/template/internal/plugins/widget.js.map +1 -1
  105. package/lib/internal/template/package.json +1 -0
  106. package/lib/internal/template/select/parts/styles.css.js +19 -22
  107. package/lib/internal/template/select/parts/styles.scoped.css +20 -49
  108. package/lib/internal/template/select/parts/styles.selectors.js +19 -22
  109. package/lib/internal/template/select/parts/trigger.d.ts.map +1 -1
  110. package/lib/internal/template/select/parts/trigger.js +2 -1
  111. package/lib/internal/template/select/parts/trigger.js.map +1 -1
  112. package/lib/internal/template/table/header-cell/index.d.ts +2 -1
  113. package/lib/internal/template/table/header-cell/index.d.ts.map +1 -1
  114. package/lib/internal/template/table/header-cell/index.js +5 -2
  115. package/lib/internal/template/table/header-cell/index.js.map +1 -1
  116. package/lib/internal/template/table/interfaces.d.ts +2 -0
  117. package/lib/internal/template/table/interfaces.d.ts.map +1 -1
  118. package/lib/internal/template/table/interfaces.js.map +1 -1
  119. package/lib/internal/template/table/internal.d.ts.map +1 -1
  120. package/lib/internal/template/table/internal.js +1 -0
  121. package/lib/internal/template/table/internal.js.map +1 -1
  122. package/lib/internal/template/table/resizer/index.d.ts +2 -1
  123. package/lib/internal/template/table/resizer/index.d.ts.map +1 -1
  124. package/lib/internal/template/table/resizer/index.js +211 -78
  125. package/lib/internal/template/table/resizer/index.js.map +1 -1
  126. package/lib/internal/template/table/resizer/resizer-lookup.d.ts +2 -1
  127. package/lib/internal/template/table/resizer/resizer-lookup.d.ts.map +1 -1
  128. package/lib/internal/template/table/resizer/resizer-lookup.js +3 -2
  129. package/lib/internal/template/table/resizer/resizer-lookup.js.map +1 -1
  130. package/lib/internal/template/table/resizer/styles.css.js +12 -12
  131. package/lib/internal/template/table/resizer/styles.scoped.css +37 -26
  132. package/lib/internal/template/table/resizer/styles.selectors.js +12 -12
  133. package/lib/internal/template/table/thead.d.ts +1 -0
  134. package/lib/internal/template/table/thead.d.ts.map +1 -1
  135. package/lib/internal/template/table/thead.js +2 -2
  136. package/lib/internal/template/table/thead.js.map +1 -1
  137. package/lib/internal/template/test-utils/dom/file-token-group/index.js +1 -1
  138. package/lib/internal/template/test-utils/dom/file-token-group/index.js.map +1 -1
  139. package/lib/internal/template/test-utils/dom/index.d.ts +20 -0
  140. package/lib/internal/template/test-utils/dom/index.js +15 -1
  141. package/lib/internal/template/test-utils/dom/index.js.map +1 -1
  142. package/lib/internal/template/test-utils/dom/internal/drag-handle.js +5 -5
  143. package/lib/internal/template/test-utils/dom/internal/drag-handle.js.map +1 -1
  144. package/lib/internal/template/test-utils/dom/multiselect/index.d.ts +3 -3
  145. package/lib/internal/template/test-utils/dom/token/index.d.ts +26 -0
  146. package/lib/internal/template/test-utils/dom/token/index.js +45 -0
  147. package/lib/internal/template/test-utils/dom/token/index.js.map +1 -0
  148. package/lib/internal/template/test-utils/dom/token-group/index.d.ts +3 -3
  149. package/lib/internal/template/test-utils/dom/token-group/index.js +6 -4
  150. package/lib/internal/template/test-utils/dom/token-group/index.js.map +1 -1
  151. package/lib/internal/template/test-utils/dom/token-group/token.d.ts +1 -2
  152. package/lib/internal/template/test-utils/dom/token-group/token.js +8 -5
  153. package/lib/internal/template/test-utils/dom/token-group/token.js.map +1 -1
  154. package/lib/internal/template/test-utils/selectors/file-token-group/index.js +1 -1
  155. package/lib/internal/template/test-utils/selectors/file-token-group/index.js.map +1 -1
  156. package/lib/internal/template/test-utils/selectors/index.d.ts +18 -0
  157. package/lib/internal/template/test-utils/selectors/index.js +15 -1
  158. package/lib/internal/template/test-utils/selectors/index.js.map +1 -1
  159. package/lib/internal/template/test-utils/selectors/internal/drag-handle.js +5 -5
  160. package/lib/internal/template/test-utils/selectors/internal/drag-handle.js.map +1 -1
  161. package/lib/internal/template/test-utils/selectors/multiselect/index.d.ts +3 -3
  162. package/lib/internal/template/test-utils/selectors/token/index.d.ts +26 -0
  163. package/lib/internal/template/test-utils/selectors/token/index.js +45 -0
  164. package/lib/internal/template/test-utils/selectors/token/index.js.map +1 -0
  165. package/lib/internal/template/test-utils/selectors/token-group/index.d.ts +3 -3
  166. package/lib/internal/template/test-utils/selectors/token-group/index.js +6 -4
  167. package/lib/internal/template/test-utils/selectors/token-group/index.js.map +1 -1
  168. package/lib/internal/template/test-utils/selectors/token-group/token.d.ts +1 -2
  169. package/lib/internal/template/test-utils/selectors/token-group/token.js +8 -5
  170. package/lib/internal/template/test-utils/selectors/token-group/token.js.map +1 -1
  171. package/lib/internal/template/token/analytics-metadata/interfaces.d.ts +13 -0
  172. package/lib/internal/template/token/analytics-metadata/interfaces.d.ts.map +1 -0
  173. package/lib/internal/template/token/analytics-metadata/interfaces.js +2 -0
  174. package/lib/internal/template/token/analytics-metadata/interfaces.js.map +1 -0
  175. package/lib/internal/template/token/analytics-metadata/styles.css.js +6 -0
  176. package/lib/internal/template/token/analytics-metadata/styles.scoped.css +7 -0
  177. package/lib/internal/template/token/analytics-metadata/styles.selectors.js +7 -0
  178. package/lib/internal/template/{token-group → token}/dismiss-button.d.ts +3 -1
  179. package/lib/internal/template/token/dismiss-button.d.ts.map +1 -0
  180. package/lib/internal/template/{token-group → token}/dismiss-button.js +6 -3
  181. package/lib/internal/template/token/dismiss-button.js.map +1 -0
  182. package/lib/internal/template/token/index.d.ts +5 -0
  183. package/lib/internal/template/token/index.d.ts.map +1 -0
  184. package/lib/internal/template/token/index.js +19 -0
  185. package/lib/internal/template/token/index.js.map +1 -0
  186. package/lib/internal/template/token/interfaces.d.ts +61 -0
  187. package/lib/internal/template/token/interfaces.d.ts.map +1 -0
  188. package/lib/internal/template/token/interfaces.js +2 -0
  189. package/lib/internal/template/token/interfaces.js.map +1 -0
  190. package/lib/internal/template/token/internal.d.ts +10 -0
  191. package/lib/internal/template/token/internal.d.ts.map +1 -0
  192. package/lib/internal/template/token/internal.js +77 -0
  193. package/lib/internal/template/token/internal.js.map +1 -0
  194. package/lib/internal/template/token/styles.css.js +19 -0
  195. package/lib/internal/template/token/styles.scoped.css +357 -0
  196. package/lib/internal/template/token/styles.selectors.js +20 -0
  197. package/lib/internal/template/token/test-classes/styles.css.js +7 -0
  198. package/lib/internal/template/token/test-classes/styles.scoped.css +8 -0
  199. package/lib/internal/template/token/test-classes/styles.selectors.js +8 -0
  200. package/lib/internal/template/token-group/analytics-metadata/interfaces.d.ts +0 -8
  201. package/lib/internal/template/token-group/analytics-metadata/interfaces.d.ts.map +1 -1
  202. package/lib/internal/template/token-group/analytics-metadata/interfaces.js.map +1 -1
  203. package/lib/internal/template/token-group/internal.d.ts.map +1 -1
  204. package/lib/internal/template/token-group/internal.js +5 -6
  205. package/lib/internal/template/token-group/internal.js.map +1 -1
  206. package/lib/internal/template/token-group/styles.css.js +5 -8
  207. package/lib/internal/template/token-group/styles.scoped.css +7 -115
  208. package/lib/internal/template/token-group/styles.selectors.js +5 -8
  209. package/package.json +1 -1
  210. package/lib/internal/template/app-layout/utils/use-ai-drawer.d.ts +0 -28
  211. package/lib/internal/template/app-layout/utils/use-ai-drawer.d.ts.map +0 -1
  212. package/lib/internal/template/app-layout/utils/use-ai-drawer.js +0 -111
  213. package/lib/internal/template/app-layout/utils/use-ai-drawer.js.map +0 -1
  214. package/lib/internal/template/internal/plugins/widget/internal.d.ts +0 -25
  215. package/lib/internal/template/internal/plugins/widget/internal.d.ts.map +0 -1
  216. package/lib/internal/template/internal/plugins/widget/internal.js.map +0 -1
  217. package/lib/internal/template/token-group/dismiss-button.d.ts.map +0 -1
  218. package/lib/internal/template/token-group/dismiss-button.js.map +0 -1
  219. package/lib/internal/template/token-group/token.d.ts +0 -13
  220. package/lib/internal/template/token-group/token.d.ts.map +0 -1
  221. package/lib/internal/template/token-group/token.js +0 -17
  222. package/lib/internal/template/token-group/token.js.map +0 -1
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "d52c074d07d2880ee17b6cd8f32a66b8a2336952"
2
+ "commit": "e5e2ffcdbdf08517eb3dd33025c7acca81a5cc23"
3
3
  }
@@ -53,6 +53,17 @@
53
53
  font-weight: awsui.$font-box-value-large-weight;
54
54
  color: inherit;
55
55
  }
56
+ &.inline-code-variant {
57
+ @include base-styles.code-extra-defaults;
58
+ @include styles.font-body-s;
59
+ border-start-start-radius: awsui.$space-static-xxs;
60
+ border-start-end-radius: awsui.$space-static-xxs;
61
+ border-end-start-radius: awsui.$space-static-xxs;
62
+ border-end-end-radius: awsui.$space-static-xxs;
63
+ background-color: awsui.$color-background-inline-code;
64
+ padding-block: awsui.$space-static-xxxs;
65
+ padding-inline: awsui.$space-static-xxs;
66
+ }
56
67
  &.h1-variant.font-weight-default,
57
68
  &.h2-variant.font-weight-default,
58
69
  &.h3-variant.font-weight-default,
@@ -0,0 +1,16 @@
1
+ /*
2
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
+ SPDX-License-Identifier: Apache-2.0
4
+ */
5
+
6
+ .container {
7
+ /* used in analytics metadata */
8
+ }
9
+
10
+ .cards-list {
11
+ /* used in analytics metadata */
12
+ }
13
+
14
+ .card-header {
15
+ /* used in analytics metadata */
16
+ }
@@ -6,7 +6,7 @@
6
6
  @use '../internal/styles/tokens' as awsui;
7
7
  @use '../internal/styles' as styles;
8
8
  @use './constants' as constants;
9
- @use '../token-group/mixins.scss' as mixins;
9
+ @use '../token/mixins.scss' as mixins;
10
10
  @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
11
11
 
12
12
  @mixin token-box-validation {
@@ -6,7 +6,7 @@
6
6
  @use '../../styles' as styles;
7
7
  @use '../../styles/tokens' as awsui;
8
8
  @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
9
- @use '../../../token-group/constants' as tokenGroup;
9
+ @use '../../../token/constants' as token;
10
10
 
11
11
  @use './motion';
12
12
 
@@ -40,7 +40,7 @@ $padding-block-inner-filtering-token: 0px;
40
40
  border-block-width: awsui.$border-width-token;
41
41
  border-inline-width: awsui.$border-width-token;
42
42
 
43
- border-color: tokenGroup.$token-border-color;
43
+ border-color: token.$token-border-color;
44
44
  border-start-end-radius: 0;
45
45
  border-end-end-radius: 0;
46
46
  block-size: 100%;
@@ -71,12 +71,20 @@
71
71
  #{custom-props.$dragHandleAnimationBlockOffset}: -20px;
72
72
  }
73
73
 
74
- .direction-button-wrapper-inline-start,
75
- .direction-button-wrapper-inline-end.direction-button-wrapper-rtl {
76
- #{custom-props.$dragHandleAnimationInlineOffset}: 20px;
74
+ .direction-button-wrapper-inline-start {
75
+ @include styles.with-direction('ltr') {
76
+ #{custom-props.$dragHandleAnimationInlineOffset}: 20px;
77
+ }
78
+ @include styles.with-direction('rtl') {
79
+ #{custom-props.$dragHandleAnimationInlineOffset}: -20px;
80
+ }
77
81
  }
78
82
 
79
- .direction-button-wrapper-inline-end,
80
- .direction-button-wrapper-inline-start.direction-button-wrapper-rtl {
81
- #{custom-props.$dragHandleAnimationInlineOffset}: -20px;
83
+ .direction-button-wrapper-inline-end {
84
+ @include styles.with-direction('ltr') {
85
+ #{custom-props.$dragHandleAnimationInlineOffset}: -20px;
86
+ }
87
+ @include styles.with-direction('rtl') {
88
+ #{custom-props.$dragHandleAnimationInlineOffset}: 20px;
89
+ }
82
90
  }
@@ -11,9 +11,8 @@ $direction-button-wrapper-size: calc(#{awsui.$space-static-xl} + 2 * #{awsui.$sp
11
11
  $direction-button-size: awsui.$space-static-xl;
12
12
  $direction-button-offset: awsui.$space-static-xxs;
13
13
 
14
- .drag-handle-wrapper {
15
- position: relative;
16
- display: inline-block;
14
+ .contents {
15
+ display: contents;
17
16
  }
18
17
 
19
18
  .portal-overlay {
@@ -35,7 +34,7 @@ $direction-button-offset: awsui.$space-static-xxs;
35
34
 
36
35
  .drag-handle {
37
36
  position: relative;
38
- display: flex;
37
+ display: inline-flex;
39
38
  }
40
39
 
41
40
  .direction-button-wrapper {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Build environment
3
- $awsui-commit-hash: "d52c074d";
3
+ $awsui-commit-hash: "e5e2ffcd";
4
4
  // Manually managed CSS-variables
5
5
  $maxContentWidth: --awsui-max-content-width-vl73au;
6
6
  $minContentWidth: --awsui-min-content-width-vl73au;
@@ -6,7 +6,7 @@
6
6
  @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
7
7
  @use '../../internal/styles' as styles;
8
8
  @use '../../internal/styles/tokens' as awsui;
9
- @use '../../token-group/constants' as constants;
9
+ @use '../../token/constants' as constants;
10
10
 
11
11
  $token-padding-block: styles.$control-padding-vertical;
12
12
  $token-padding-inline: styles.$control-padding-horizontal;
@@ -88,31 +88,6 @@ $inlineLabel-border-radius: 2px;
88
88
  @include styles.with-direction('rtl') {
89
89
  mask-image: linear-gradient(-270deg, transparent, white 20px, white);
90
90
  }
91
-
92
- > .inline-token {
93
- display: flex;
94
- align-items: center;
95
- min-inline-size: max-content;
96
- block-size: 18px;
97
-
98
- border-block: awsui.$border-width-token solid awsui.$color-border-item-selected;
99
- border-inline: awsui.$border-width-token solid awsui.$color-border-item-selected;
100
- padding-block: 0;
101
- padding-inline: awsui.$space-xxs;
102
- background: awsui.$color-background-item-selected;
103
- border-start-start-radius: awsui.$border-radius-token;
104
- border-start-end-radius: awsui.$border-radius-token;
105
- border-end-start-radius: awsui.$border-radius-token;
106
- border-end-end-radius: awsui.$border-radius-token;
107
- color: awsui.$color-text-body-default;
108
- }
109
- }
110
-
111
- .visual-refresh > .inline-token-list > .inline-token {
112
- border-start-start-radius: awsui.$border-radius-badge;
113
- border-start-end-radius: awsui.$border-radius-badge;
114
- border-end-start-radius: awsui.$border-radius-badge;
115
- border-end-end-radius: awsui.$border-radius-badge;
116
91
  }
117
92
 
118
93
  .inline-token-hidden-placeholder {
@@ -122,13 +97,6 @@ $inlineLabel-border-radius: 2px;
122
97
  .inline-token-counter {
123
98
  white-space: nowrap;
124
99
  }
125
- .inline-token-trigger--disabled {
126
- > .inline-token-list > .inline-token {
127
- border-color: awsui.$color-border-control-disabled;
128
- background-color: awsui.$color-background-container-content;
129
- color: awsui.$color-text-disabled;
130
- }
131
- }
132
100
 
133
101
  .inline-label-trigger-wrapper {
134
102
  margin-block-start: -7px;
@@ -15,11 +15,27 @@
15
15
 
16
16
  $handle-width: awsui.$space-xl;
17
17
  $active-separator-width: 2px;
18
+ $block-gap: calc(2 * #{awsui.$space-xs} + #{awsui.$space-xxxs});
19
+
20
+ .resizer-wrapper {
21
+ inset-block: 0;
22
+ position: absolute;
23
+ inset-inline-end: calc(-1 * #{$handle-width} / 2);
24
+ inline-size: $handle-width;
25
+ overflow: hidden;
26
+ z-index: 10;
27
+
28
+ th:last-child > &:has(.divider-interactive):not(.is-visual-refresh) {
29
+ inset-inline-end: 0;
30
+ }
31
+ }
32
+
33
+ .resizer-button-wrapper {
34
+ block-size: 100%;
35
+ }
18
36
 
19
37
  th:not(:last-child) > .divider,
20
38
  .divider-interactive {
21
- $gap: calc(2 * #{awsui.$space-xs} + #{awsui.$space-xxxs});
22
-
23
39
  position: absolute;
24
40
  outline: none;
25
41
  pointer-events: none;
@@ -27,24 +43,25 @@ th:not(:last-child) > .divider,
27
43
  inset-block-end: 0;
28
44
  inset-block-start: 0;
29
45
  min-block-size: awsui.$line-height-heading-xs;
30
- max-block-size: calc(100% - #{$gap});
46
+ max-block-size: calc(100% - #{$block-gap});
31
47
  margin-block: auto;
32
48
  margin-inline: auto;
33
49
  border-inline-start: awsui.$border-item-width solid awsui.$color-border-divider-interactive-default;
34
50
  box-sizing: border-box;
51
+ }
35
52
 
36
- &-disabled {
37
- border-inline-start-color: awsui.$color-border-divider-default;
38
- }
39
- &-active {
40
- border-inline-start: $active-separator-width solid awsui.$color-border-divider-active;
41
- }
53
+ th:not(:last-child) > .divider-disabled {
54
+ border-inline-start-color: awsui.$color-border-divider-default;
42
55
  }
43
56
 
44
- th:last-child > .divider-interactive:not(.is-visual-refresh) {
57
+ .divider-interactive {
45
58
  inset-inline-end: calc(#{$handle-width} / 2);
46
59
  }
47
60
 
61
+ .divider-active {
62
+ border-inline-start: $active-separator-width solid awsui.$color-border-divider-active;
63
+ }
64
+
48
65
  .resizer {
49
66
  @include styles.styles-reset;
50
67
  border-block: none;
@@ -52,10 +69,8 @@ th:last-child > .divider-interactive:not(.is-visual-refresh) {
52
69
  background: none;
53
70
  inset-block: 0;
54
71
  cursor: col-resize;
55
- position: absolute;
56
- inset-inline-end: calc(-1 * #{$handle-width} / 2);
72
+ block-size: 100%;
57
73
  inline-size: $handle-width;
58
- z-index: 10;
59
74
  &:focus {
60
75
  outline: none;
61
76
  text-decoration: none;
@@ -70,9 +85,6 @@ th:last-child > .divider-interactive:not(.is-visual-refresh) {
70
85
  &.has-focus {
71
86
  @include focus-visible.when-visible-unfocused {
72
87
  @include styles.focus-highlight(calc(#{awsui.$space-table-header-focus-outline-gutter} - 2px));
73
- & {
74
- position: absolute;
75
- }
76
88
  }
77
89
  }
78
90
  }
@@ -0,0 +1,8 @@
1
+ /*
2
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
+ SPDX-License-Identifier: Apache-2.0
4
+ */
5
+
6
+ .token {
7
+ /* used in analytics metadata */
8
+ }
@@ -8,3 +8,5 @@
8
8
 
9
9
  $token-background: awsui.$color-background-item-selected;
10
10
  $token-border-color: awsui.$color-border-item-selected;
11
+ $token-max-height-inline: 20px;
12
+ $icon-width: 16px;
@@ -25,3 +25,23 @@
25
25
  color: awsui.$color-text-body-default;
26
26
  box-sizing: border-box;
27
27
  }
28
+
29
+ @mixin token-box-inline-styles {
30
+ position: relative;
31
+ block-size: constants.$token-max-height-inline;
32
+ max-block-size: constants.$token-max-height-inline;
33
+ border-block: awsui.$border-width-field solid constants.$token-border-color;
34
+ border-inline: awsui.$border-width-field solid constants.$token-border-color;
35
+ padding-inline-start: awsui.$space-scaled-xxs;
36
+ padding-inline-end: awsui.$space-scaled-xxs;
37
+ display: flex;
38
+ align-items: center;
39
+ background: constants.$token-background;
40
+ border-start-start-radius: awsui.$space-scaled-xxs;
41
+ border-start-end-radius: awsui.$space-scaled-xxs;
42
+ border-end-start-radius: awsui.$space-scaled-xxs;
43
+ border-end-end-radius: awsui.$space-scaled-xxs;
44
+ color: awsui.$color-text-body-default;
45
+ box-sizing: border-box;
46
+ max-inline-size: 100%;
47
+ }
@@ -0,0 +1,119 @@
1
+ /*
2
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
+ SPDX-License-Identifier: Apache-2.0
4
+ */
5
+
6
+ @use '../internal/styles' as styles;
7
+ @use '../internal/styles/tokens' as awsui;
8
+ @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
9
+ @use './constants' as constants;
10
+ @use './mixins.scss' as mixins;
11
+
12
+ .root {
13
+ @include styles.styles-reset;
14
+ }
15
+
16
+ .dismiss-button {
17
+ align-self: flex-start;
18
+ margin-block-end: 0;
19
+ margin-inline-start: awsui.$space-xxs;
20
+ border-block: awsui.$border-width-field solid transparent;
21
+ border-inline: awsui.$border-width-field solid transparent;
22
+ padding-block: 0;
23
+ padding-inline: awsui.$space-xxs;
24
+ color: awsui.$color-text-button-inline-icon-default;
25
+ background-color: transparent;
26
+ cursor: pointer;
27
+
28
+ @include focus-visible.when-visible {
29
+ @include styles.focus-highlight(0px);
30
+ }
31
+
32
+ &:focus {
33
+ outline: none;
34
+ text-decoration: none;
35
+ }
36
+
37
+ &:hover {
38
+ color: awsui.$color-text-button-inline-icon-hover;
39
+ }
40
+
41
+ &-inline {
42
+ padding-inline: 0;
43
+ display: flex;
44
+ align-items: center;
45
+ align-self: center;
46
+ }
47
+ }
48
+
49
+ .icon {
50
+ padding-inline-end: awsui.$space-xs;
51
+ align-self: flex-start;
52
+ display: flex;
53
+ flex-shrink: 0;
54
+
55
+ &-inline {
56
+ padding-inline-end: awsui.$space-xxs;
57
+ align-self: center;
58
+ }
59
+ }
60
+
61
+ .token-normal {
62
+ block-size: 100%;
63
+ display: flex;
64
+ flex-direction: column;
65
+ gap: awsui.$space-xxs;
66
+ }
67
+
68
+ .token-inline {
69
+ display: inline-flex;
70
+ max-inline-size: 100%;
71
+
72
+ @include focus-visible.when-visible {
73
+ @include styles.focus-highlight(0px);
74
+ }
75
+ }
76
+
77
+ .token-option-inline {
78
+ max-block-size: constants.$token-max-height-inline;
79
+ }
80
+
81
+ .token-box {
82
+ @include mixins.token-box-styles();
83
+
84
+ &-without-dismiss {
85
+ padding-inline-end: styles.$control-padding-horizontal;
86
+ }
87
+ }
88
+
89
+ .token-box-inline {
90
+ @include mixins.token-box-inline-styles();
91
+ }
92
+
93
+ .disable-padding {
94
+ padding-block-start: 0;
95
+ padding-block-end: 0;
96
+ padding-inline-start: 0;
97
+ padding-inline-end: 0;
98
+ }
99
+
100
+ .token-box-readonly,
101
+ .token-box-disabled {
102
+ border-color: awsui.$color-border-input-disabled;
103
+ background-color: awsui.$color-background-container-content;
104
+ pointer-events: none;
105
+
106
+ > .dismiss-button {
107
+ color: awsui.$color-text-button-inline-icon-disabled;
108
+ cursor: initial;
109
+
110
+ &:hover {
111
+ color: awsui.$color-text-button-inline-icon-disabled;
112
+ }
113
+ }
114
+ }
115
+
116
+ .token-box-disabled {
117
+ border-color: awsui.$color-border-control-disabled;
118
+ color: awsui.$color-text-disabled;
119
+ }
@@ -0,0 +1,8 @@
1
+ /*
2
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
+ SPDX-License-Identifier: Apache-2.0
4
+ */
5
+ .root,
6
+ .dismiss-button {
7
+ /* used in test-utils */
8
+ }
@@ -5,9 +5,11 @@
5
5
 
6
6
  @use '../internal/styles' as styles;
7
7
  @use '../internal/styles/tokens' as awsui;
8
- @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
9
- @use './constants' as constants;
10
- @use './mixins.scss' as mixins;
8
+
9
+ .dismiss-button,
10
+ .token {
11
+ /* used in test-utils */
12
+ }
11
13
 
12
14
  .root {
13
15
  @include styles.styles-reset;
@@ -16,72 +18,3 @@
16
18
  padding-block-start: awsui.$space-xs;
17
19
  }
18
20
  }
19
-
20
- .dismiss-button {
21
- margin-block-start: -1px;
22
- margin-block-end: 0;
23
- margin-inline-start: awsui.$space-xxs;
24
- margin-inline-end: -1px;
25
- border-block: 1px solid transparent;
26
- border-inline: 1px solid transparent;
27
- padding-block: 0;
28
- padding-inline: awsui.$space-xxs;
29
- color: awsui.$color-text-button-inline-icon-default;
30
- background-color: transparent;
31
-
32
- @include focus-visible.when-visible {
33
- @include styles.focus-highlight(0px);
34
- }
35
-
36
- &:focus {
37
- outline: none;
38
- text-decoration: none;
39
- }
40
-
41
- &:hover {
42
- cursor: pointer;
43
- color: awsui.$color-text-button-inline-icon-hover;
44
- }
45
- }
46
-
47
- .token {
48
- block-size: 100%;
49
- display: flex;
50
- flex-direction: column;
51
- gap: awsui.$space-xxs;
52
- }
53
-
54
- .token-box {
55
- @include mixins.token-box-styles();
56
- }
57
-
58
- .token-box-readonly {
59
- border-color: awsui.$color-border-input-disabled;
60
- background-color: awsui.$color-background-container-content;
61
- pointer-events: none;
62
-
63
- > .dismiss-button {
64
- color: awsui.$color-text-button-inline-icon-disabled;
65
-
66
- &:hover {
67
- /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
68
- cursor: initial;
69
- color: awsui.$color-text-button-inline-icon-disabled;
70
- }
71
- }
72
- }
73
- .token-box-disabled.token-box-disabled {
74
- border-color: awsui.$color-border-control-disabled;
75
- background-color: awsui.$color-background-container-content;
76
- color: awsui.$color-text-disabled;
77
- pointer-events: none;
78
-
79
- > .dismiss-button {
80
- color: awsui.$color-text-button-inline-icon-disabled;
81
-
82
- &:hover {
83
- cursor: initial;
84
- color: awsui.$color-text-button-inline-icon-disabled;
85
- }
86
- }
87
- }
@@ -1,8 +1,8 @@
1
1
  /// <reference types="react" />
2
2
  import { AppLayoutProps } from '../../interfaces';
3
- import { OnChangeParams } from '../../utils/use-ai-drawer';
4
3
  import { FocusControlState } from '../../utils/use-focus-control';
5
4
  import { AppLayoutInternals, InternalDrawer } from '../interfaces';
5
+ import { OnChangeParams } from '../state/use-ai-drawer';
6
6
  interface AIDrawerProps {
7
7
  activeAiDrawerSize: number;
8
8
  minAiDrawerSize: number;
@@ -1 +1 @@
1
- {"version":3,"file":"global-ai-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAOnE,UAAU,aAAa;IACrB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC5C,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,GAAG,CAAC;IAChB,oBAAoB,EAAE,iBAAiB,GAAG,SAAS,CAAC;IACpD,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,aAAa,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACpD,sBAAsB,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC,CAAC;IACpG,oBAAoB,EAAE,CAAC,MAAM,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACrE,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACrD;AAED,UAAU,0CAA0C;IAClD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;CAC9B;AAED,wBAAgB,qCAAqC,CAAC,EACpD,kBAAkB,EAClB,IAAI,EACJ,cAAc,EACd,aAAa,GACd,EAAE,0CAA0C,eAyL5C"}
1
+ {"version":3,"file":"global-ai-drawer.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAOxD,UAAU,aAAa;IACrB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC5C,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,GAAG,CAAC;IAChB,oBAAoB,EAAE,iBAAiB,GAAG,SAAS,CAAC;IACpD,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,aAAa,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACpD,sBAAsB,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC,CAAC;IACpG,oBAAoB,EAAE,CAAC,MAAM,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACrE,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACrD;AAED,UAAU,0CAA0C;IAClD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,IAAI,EAAE,OAAO,CAAC;IACd,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;CAC9B;AAED,wBAAgB,qCAAqC,CAAC,EACpD,kBAAkB,EAClB,IAAI,EACJ,cAAc,EACd,aAAa,GACd,EAAE,0CAA0C,eAyL5C"}
@@ -1 +1 @@
1
- {"version":3,"file":"global-ai-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.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 { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalItemOrGroup } from '../../../button-group/interfaces';\nimport ButtonGroup from '../../../button-group/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { usePrevious } from '../../../internal/hooks/use-previous';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { AppLayoutProps } from '../../interfaces';\nimport { OnChangeParams } from '../../utils/use-ai-drawer';\nimport { FocusControlState } from '../../utils/use-focus-control';\nimport { AppLayoutInternals, InternalDrawer } from '../interfaces';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AIDrawerProps {\n activeAiDrawerSize: number;\n minAiDrawerSize: number;\n aiDrawer: AppLayoutProps.Drawer | undefined;\n maxAiDrawerSize: number;\n ariaLabels: any;\n aiDrawerFocusControl: FocusControlState | undefined;\n isMobile: boolean;\n drawersOpenQueue: ReadonlyArray<string> | undefined;\n onActiveAiDrawerChange: undefined | ((newDrawerId: string | null, params?: OnChangeParams) => void);\n onActiveDrawerResize: (detail: { id: string; size: number }) => void;\n expandedDrawerId?: string | null;\n setExpandedDrawerId: (value: string | null) => void;\n}\n\ninterface AppLayoutGlobalAiDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n show: boolean;\n activeAiDrawer: InternalDrawer | null;\n aiDrawerProps: AIDrawerProps;\n}\n\nexport function AppLayoutGlobalAiDrawerImplementation({\n appLayoutInternals,\n show,\n activeAiDrawer,\n aiDrawerProps,\n}: AppLayoutGlobalAiDrawerImplementationProps) {\n const {\n activeAiDrawerSize,\n minAiDrawerSize,\n maxAiDrawerSize,\n ariaLabels,\n aiDrawerFocusControl,\n isMobile,\n drawersOpenQueue,\n onActiveAiDrawerChange,\n onActiveDrawerResize,\n expandedDrawerId,\n setExpandedDrawerId,\n } = aiDrawerProps;\n const { verticalOffsets, placement } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeAiDrawer?.id;\n\n const computedAriaLabels = {\n closeButton: activeAiDrawer ? activeAiDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeAiDrawer ? activeAiDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const resizeProps = useResize({\n currentWidth: activeAiDrawerSize,\n minWidth: minAiDrawerSize,\n maxWidth: maxAiDrawerSize,\n panelRef: drawerRef,\n handleRef: aiDrawerFocusControl!.refs.slider,\n onResize: size => {\n onActiveDrawerResize({ id: activeDrawerId!, size });\n },\n position: 'side-start',\n });\n const size = getLimitedValue(minAiDrawerSize, activeAiDrawerSize, maxAiDrawerSize);\n const isExpanded = activeAiDrawer?.isExpandable && expandedDrawerId === activeDrawerId;\n const wasExpanded = usePrevious(isExpanded);\n const animationDisabled =\n (activeAiDrawer?.defaultActive && !drawersOpenQueue?.includes(activeAiDrawer.id)) || (wasExpanded && !isExpanded);\n const drawerHeight = `calc(100vh - ${verticalOffsets.toolbar + placement.insetBlockEnd}px)`;\n // disable resizing when the drawer is at its minimum width in a \"squeezed\" state\n // (window is between mobile and desktop sizes). At this point, the drawer can't be\n // resized in either direction, so we disable the resize handler\n const isResizingDisabled = maxAiDrawerSize < activeAiDrawerSize;\n let drawerActions: ReadonlyArray<InternalItemOrGroup> = [\n {\n type: 'icon-button',\n id: 'close',\n iconName: isMobile ? 'close' : 'angle-left',\n text: computedAriaLabels.closeButton,\n analyticsAction: 'close',\n },\n ];\n if (!isMobile && activeAiDrawer?.isExpandable) {\n drawerActions = [\n {\n type: 'icon-button',\n id: 'expand',\n iconName: isExpanded ? 'shrink' : 'expand',\n text: activeAiDrawer?.ariaLabels?.expandedModeButton ?? '',\n analyticsAction: isExpanded ? 'expand' : 'collapse',\n },\n ...drawerActions,\n ];\n }\n if (activeAiDrawer?.headerActions) {\n drawerActions = [\n {\n type: 'group',\n text: 'Actions',\n items: activeAiDrawer.headerActions!,\n },\n ...drawerActions,\n ];\n }\n\n return (\n <Transition nodeRef={drawerRef} in={show} appear={show} mountOnEnter={true} timeout={250}>\n {drawerTransitionState => {\n return (\n <Transition nodeRef={drawerRef} in={isExpanded} timeout={250}>\n {expandedTransitionState => {\n return (\n <aside\n id={activeAiDrawer?.id}\n aria-hidden={!activeAiDrawer}\n aria-label={computedAriaLabels.content}\n className={clsx(\n styles.drawer,\n styles['ai-drawer'],\n !animationDisabled && isExpanded && styles['with-expanded-motion'],\n {\n [sharedStyles['with-motion-horizontal']]: !animationDisabled,\n [testutilStyles['active-drawer']]: show,\n [styles['drawer-hidden']]: !show && drawerTransitionState === 'exited',\n [testutilStyles['drawer-closed']]: !activeAiDrawer,\n [styles['drawer-expanded']]: isExpanded,\n }\n )}\n ref={drawerRef}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n aiDrawerFocusControl?.loseFocus();\n }\n }}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: `${placement.insetBlockStart}px`,\n ...(!isMobile && {\n [customCssProps.drawerMinSize]: `${size}px`,\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(drawerTransitionState) ? size : 0}px`,\n }),\n }}\n data-testid={activeDrawerId && `awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeAiDrawer?.resizable && (!isExpanded || expandedTransitionState !== 'entered') && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={aiDrawerFocusControl?.refs.slider}\n position=\"side-start\"\n className={clsx(testutilStyles['drawers-slider'], styles['ai-drawer-slider-handle'])}\n ariaLabel={activeAiDrawer?.ariaLabels?.resizeHandle}\n tooltipText={activeAiDrawer?.ariaLabels?.resizeHandleTooltipText}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n onDirectionClick={resizeProps.onDirectionClick}\n disabled={isResizingDisabled}\n />\n </div>\n )}\n <div className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}>\n <div className={styles['drawer-content']}>\n <header className={styles['drawer-content-header']}>\n <div className={styles['drawer-content-header-content']}>\n {activeAiDrawer?.header ?? <div />}\n <div className={styles['drawer-actions']}>\n <ButtonGroup\n dropdownExpandToViewport={false}\n variant=\"icon\"\n onItemClick={event => {\n switch (event.detail.id) {\n case 'close':\n onActiveAiDrawerChange?.(null, { initiatedByUserAction: true });\n break;\n case 'expand':\n setExpandedDrawerId(isExpanded ? null : activeDrawerId!);\n break;\n default:\n activeAiDrawer?.onHeaderActionClick?.(event);\n }\n }}\n ariaLabel=\"Left panel actions\"\n items={drawerActions}\n />\n </div>\n </div>\n {!isMobile && isExpanded && activeAiDrawer?.ariaLabels?.exitExpandedModeButton && (\n <div className={styles['drawer-back-to-console-slot']}>\n <div className={styles['drawer-back-to-console-button-wrapper']}>\n <button\n className={clsx(\n testutilStyles['active-ai-drawer-leave-expanded-mode-custom-button'],\n styles['drawer-back-to-console-button']\n )}\n formAction=\"none\"\n onClick={() => setExpandedDrawerId(null)}\n >\n {activeAiDrawer?.ariaLabels?.exitExpandedModeButton}\n </button>\n </div>\n </div>\n )}\n </header>\n <div className={styles['drawer-content-content']}>{activeAiDrawer?.content}</div>\n </div>\n </div>\n </aside>\n );\n }}\n </Transition>\n );\n }}\n </Transition>\n );\n}\n"]}
1
+ {"version":3,"file":"global-ai-drawer.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.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 { Transition } from 'react-transition-group';\nimport clsx from 'clsx';\n\nimport { InternalItemOrGroup } from '../../../button-group/interfaces';\nimport ButtonGroup from '../../../button-group/internal';\nimport PanelResizeHandle from '../../../internal/components/panel-resize-handle';\nimport customCssProps from '../../../internal/generated/custom-css-properties';\nimport { usePrevious } from '../../../internal/hooks/use-previous';\nimport { getLimitedValue } from '../../../split-panel/utils/size-utils';\nimport { AppLayoutProps } from '../../interfaces';\nimport { FocusControlState } from '../../utils/use-focus-control';\nimport { AppLayoutInternals, InternalDrawer } from '../interfaces';\nimport { OnChangeParams } from '../state/use-ai-drawer';\nimport { useResize } from './use-resize';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AIDrawerProps {\n activeAiDrawerSize: number;\n minAiDrawerSize: number;\n aiDrawer: AppLayoutProps.Drawer | undefined;\n maxAiDrawerSize: number;\n ariaLabels: any;\n aiDrawerFocusControl: FocusControlState | undefined;\n isMobile: boolean;\n drawersOpenQueue: ReadonlyArray<string> | undefined;\n onActiveAiDrawerChange: undefined | ((newDrawerId: string | null, params?: OnChangeParams) => void);\n onActiveDrawerResize: (detail: { id: string; size: number }) => void;\n expandedDrawerId?: string | null;\n setExpandedDrawerId: (value: string | null) => void;\n}\n\ninterface AppLayoutGlobalAiDrawerImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n show: boolean;\n activeAiDrawer: InternalDrawer | null;\n aiDrawerProps: AIDrawerProps;\n}\n\nexport function AppLayoutGlobalAiDrawerImplementation({\n appLayoutInternals,\n show,\n activeAiDrawer,\n aiDrawerProps,\n}: AppLayoutGlobalAiDrawerImplementationProps) {\n const {\n activeAiDrawerSize,\n minAiDrawerSize,\n maxAiDrawerSize,\n ariaLabels,\n aiDrawerFocusControl,\n isMobile,\n drawersOpenQueue,\n onActiveAiDrawerChange,\n onActiveDrawerResize,\n expandedDrawerId,\n setExpandedDrawerId,\n } = aiDrawerProps;\n const { verticalOffsets, placement } = appLayoutInternals;\n const drawerRef = useRef<HTMLDivElement>(null);\n const activeDrawerId = activeAiDrawer?.id;\n\n const computedAriaLabels = {\n closeButton: activeAiDrawer ? activeAiDrawer.ariaLabels?.closeButton : ariaLabels?.toolsClose,\n content: activeAiDrawer ? activeAiDrawer.ariaLabels?.drawerName : ariaLabels?.tools,\n };\n\n const resizeProps = useResize({\n currentWidth: activeAiDrawerSize,\n minWidth: minAiDrawerSize,\n maxWidth: maxAiDrawerSize,\n panelRef: drawerRef,\n handleRef: aiDrawerFocusControl!.refs.slider,\n onResize: size => {\n onActiveDrawerResize({ id: activeDrawerId!, size });\n },\n position: 'side-start',\n });\n const size = getLimitedValue(minAiDrawerSize, activeAiDrawerSize, maxAiDrawerSize);\n const isExpanded = activeAiDrawer?.isExpandable && expandedDrawerId === activeDrawerId;\n const wasExpanded = usePrevious(isExpanded);\n const animationDisabled =\n (activeAiDrawer?.defaultActive && !drawersOpenQueue?.includes(activeAiDrawer.id)) || (wasExpanded && !isExpanded);\n const drawerHeight = `calc(100vh - ${verticalOffsets.toolbar + placement.insetBlockEnd}px)`;\n // disable resizing when the drawer is at its minimum width in a \"squeezed\" state\n // (window is between mobile and desktop sizes). At this point, the drawer can't be\n // resized in either direction, so we disable the resize handler\n const isResizingDisabled = maxAiDrawerSize < activeAiDrawerSize;\n let drawerActions: ReadonlyArray<InternalItemOrGroup> = [\n {\n type: 'icon-button',\n id: 'close',\n iconName: isMobile ? 'close' : 'angle-left',\n text: computedAriaLabels.closeButton,\n analyticsAction: 'close',\n },\n ];\n if (!isMobile && activeAiDrawer?.isExpandable) {\n drawerActions = [\n {\n type: 'icon-button',\n id: 'expand',\n iconName: isExpanded ? 'shrink' : 'expand',\n text: activeAiDrawer?.ariaLabels?.expandedModeButton ?? '',\n analyticsAction: isExpanded ? 'expand' : 'collapse',\n },\n ...drawerActions,\n ];\n }\n if (activeAiDrawer?.headerActions) {\n drawerActions = [\n {\n type: 'group',\n text: 'Actions',\n items: activeAiDrawer.headerActions!,\n },\n ...drawerActions,\n ];\n }\n\n return (\n <Transition nodeRef={drawerRef} in={show} appear={show} mountOnEnter={true} timeout={250}>\n {drawerTransitionState => {\n return (\n <Transition nodeRef={drawerRef} in={isExpanded} timeout={250}>\n {expandedTransitionState => {\n return (\n <aside\n id={activeAiDrawer?.id}\n aria-hidden={!activeAiDrawer}\n aria-label={computedAriaLabels.content}\n className={clsx(\n styles.drawer,\n styles['ai-drawer'],\n !animationDisabled && isExpanded && styles['with-expanded-motion'],\n {\n [sharedStyles['with-motion-horizontal']]: !animationDisabled,\n [testutilStyles['active-drawer']]: show,\n [styles['drawer-hidden']]: !show && drawerTransitionState === 'exited',\n [testutilStyles['drawer-closed']]: !activeAiDrawer,\n [styles['drawer-expanded']]: isExpanded,\n }\n )}\n ref={drawerRef}\n onBlur={e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n aiDrawerFocusControl?.loseFocus();\n }\n }}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: `${placement.insetBlockStart}px`,\n ...(!isMobile && {\n [customCssProps.drawerMinSize]: `${size}px`,\n [customCssProps.drawerSize]: `${['entering', 'entered'].includes(drawerTransitionState) ? size : 0}px`,\n }),\n }}\n data-testid={activeDrawerId && `awsui-app-layout-drawer-${activeDrawerId}`}\n >\n {!isMobile && activeAiDrawer?.resizable && (!isExpanded || expandedTransitionState !== 'entered') && (\n <div className={styles['drawer-slider']}>\n <PanelResizeHandle\n ref={aiDrawerFocusControl?.refs.slider}\n position=\"side-start\"\n className={clsx(testutilStyles['drawers-slider'], styles['ai-drawer-slider-handle'])}\n ariaLabel={activeAiDrawer?.ariaLabels?.resizeHandle}\n tooltipText={activeAiDrawer?.ariaLabels?.resizeHandleTooltipText}\n ariaValuenow={resizeProps.relativeSize}\n onKeyDown={resizeProps.onKeyDown}\n onPointerDown={resizeProps.onPointerDown}\n onDirectionClick={resizeProps.onDirectionClick}\n disabled={isResizingDisabled}\n />\n </div>\n )}\n <div className={clsx(styles['drawer-content-container'], sharedStyles['with-motion-horizontal'])}>\n <div className={styles['drawer-content']}>\n <header className={styles['drawer-content-header']}>\n <div className={styles['drawer-content-header-content']}>\n {activeAiDrawer?.header ?? <div />}\n <div className={styles['drawer-actions']}>\n <ButtonGroup\n dropdownExpandToViewport={false}\n variant=\"icon\"\n onItemClick={event => {\n switch (event.detail.id) {\n case 'close':\n onActiveAiDrawerChange?.(null, { initiatedByUserAction: true });\n break;\n case 'expand':\n setExpandedDrawerId(isExpanded ? null : activeDrawerId!);\n break;\n default:\n activeAiDrawer?.onHeaderActionClick?.(event);\n }\n }}\n ariaLabel=\"Left panel actions\"\n items={drawerActions}\n />\n </div>\n </div>\n {!isMobile && isExpanded && activeAiDrawer?.ariaLabels?.exitExpandedModeButton && (\n <div className={styles['drawer-back-to-console-slot']}>\n <div className={styles['drawer-back-to-console-button-wrapper']}>\n <button\n className={clsx(\n testutilStyles['active-ai-drawer-leave-expanded-mode-custom-button'],\n styles['drawer-back-to-console-button']\n )}\n formAction=\"none\"\n onClick={() => setExpandedDrawerId(null)}\n >\n {activeAiDrawer?.ariaLabels?.exitExpandedModeButton}\n </button>\n </div>\n </div>\n )}\n </header>\n <div className={styles['drawer-content-content']}>{activeAiDrawer?.content}</div>\n </div>\n </div>\n </aside>\n );\n }}\n </Transition>\n );\n }}\n </Transition>\n );\n}\n"]}
@@ -0,0 +1,29 @@
1
+ import { WidgetMessage } from '../../../internal/plugins/widget/interfaces';
2
+ export interface OnChangeParams {
3
+ initiatedByUserAction: boolean;
4
+ }
5
+ interface UseDrawersProps {
6
+ onAiDrawerFocus: () => void;
7
+ expandedDrawerId: string | null;
8
+ setExpandedDrawerId: (value: string | null) => void;
9
+ }
10
+ export declare function useAiDrawer({ onAiDrawerFocus, expandedDrawerId, setExpandedDrawerId }: UseDrawersProps): {
11
+ aiDrawer: (import("../..").AppLayoutProps.Drawer & {
12
+ orderPriority?: number | undefined;
13
+ onToggle?: import("../../../internal/events").NonCancelableEventHandler<import("../../../internal/plugins/controllers/drawers").DrawerStateChangeParams> | undefined;
14
+ headerActions?: readonly import("../../..").ButtonGroupProps.Item[] | undefined;
15
+ }) | null;
16
+ aiDrawerMessageHandler: (event: WidgetMessage) => void;
17
+ onActiveAiDrawerChange: (newDrawerId: string | null, { initiatedByUserAction }?: OnChangeParams) => void;
18
+ activeAiDrawer: (import("../..").AppLayoutProps.Drawer & {
19
+ orderPriority?: number | undefined;
20
+ onToggle?: import("../../../internal/events").NonCancelableEventHandler<import("../../../internal/plugins/controllers/drawers").DrawerStateChangeParams> | undefined;
21
+ headerActions?: readonly import("../../..").ButtonGroupProps.Item[] | undefined;
22
+ }) | null;
23
+ activeAiDrawerId: string | null;
24
+ activeAiDrawerSize: number;
25
+ minAiDrawerSize: number;
26
+ onActiveAiDrawerResize: (size: number) => void;
27
+ };
28
+ export {};
29
+ //# sourceMappingURL=use-ai-drawer.d.ts.map