@cloudscape-design/components-themeable 3.0.1383 → 3.0.1384
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.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/internal/components/control-group/styles.scss +27 -10
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +1 -1
- package/lib/internal/scss/internal/styles/forms/mixins.scss +37 -22
- package/lib/internal/scss/modal/styles.scss +6 -0
- package/lib/internal/scss/prompt-input/styles.scss +4 -0
- package/lib/internal/scss/segmented-control/segment.scss +5 -0
- package/lib/internal/scss/segmented-control/styles.scss +12 -2
- package/lib/internal/scss/steps/styles.scss +1 -1
- package/lib/internal/template/input/internal.d.ts.map +1 -1
- package/lib/internal/template/input/internal.js +3 -4
- package/lib/internal/template/input/internal.js.map +1 -1
- package/lib/internal/template/input/styles.css.js +36 -34
- package/lib/internal/template/input/styles.scoped.css +89 -79
- package/lib/internal/template/input/styles.selectors.js +36 -34
- package/lib/internal/template/internal/base-component/styles.scoped.css +1 -1
- package/lib/internal/template/internal/components/button-trigger/index.d.ts +2 -2
- package/lib/internal/template/internal/components/button-trigger/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/button-trigger/index.js +3 -2
- package/lib/internal/template/internal/components/button-trigger/index.js.map +1 -1
- package/lib/internal/template/internal/components/button-trigger/styles.css.js +21 -19
- package/lib/internal/template/internal/components/button-trigger/styles.scoped.css +49 -39
- package/lib/internal/template/internal/components/button-trigger/styles.selectors.js +21 -19
- package/lib/internal/template/internal/components/control-group/grouped-control-styles.d.ts +10 -0
- package/lib/internal/template/internal/components/control-group/grouped-control-styles.d.ts.map +1 -0
- package/lib/internal/template/internal/components/control-group/grouped-control-styles.js +14 -0
- package/lib/internal/template/internal/components/control-group/grouped-control-styles.js.map +1 -0
- package/lib/internal/template/internal/components/control-group/index.d.ts +3 -1
- package/lib/internal/template/internal/components/control-group/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/control-group/index.js +5 -5
- package/lib/internal/template/internal/components/control-group/index.js.map +1 -1
- package/lib/internal/template/internal/components/control-group/styles.css.js +8 -4
- package/lib/internal/template/internal/components/control-group/styles.scoped.css +13 -4
- package/lib/internal/template/internal/components/control-group/styles.selectors.js +8 -4
- package/lib/internal/template/internal/components/focus-lock/index.d.ts +6 -0
- package/lib/internal/template/internal/components/focus-lock/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/focus-lock/index.js +8 -3
- package/lib/internal/template/internal/components/focus-lock/index.js.map +1 -1
- package/lib/internal/template/internal/context/control-group-context.d.ts +6 -0
- package/lib/internal/template/internal/context/control-group-context.d.ts.map +1 -1
- package/lib/internal/template/internal/context/control-group-context.js +3 -1
- package/lib/internal/template/internal/context/control-group-context.js.map +1 -1
- package/lib/internal/template/internal/environment.js +2 -2
- package/lib/internal/template/internal/environment.json +2 -2
- package/lib/internal/template/modal/index.d.ts +1 -1
- package/lib/internal/template/modal/index.d.ts.map +1 -1
- package/lib/internal/template/modal/index.js +6 -5
- package/lib/internal/template/modal/index.js.map +1 -1
- package/lib/internal/template/modal/interfaces.d.ts +7 -0
- package/lib/internal/template/modal/interfaces.d.ts.map +1 -1
- package/lib/internal/template/modal/interfaces.js.map +1 -1
- package/lib/internal/template/modal/internal.js +23 -6
- package/lib/internal/template/modal/internal.js.map +1 -1
- package/lib/internal/template/modal/styles.css.js +32 -31
- package/lib/internal/template/modal/styles.scoped.css +49 -46
- package/lib/internal/template/modal/styles.selectors.js +32 -31
- package/lib/internal/template/multiselect/internal.d.ts.map +1 -1
- package/lib/internal/template/multiselect/internal.js +7 -3
- package/lib/internal/template/multiselect/internal.js.map +1 -1
- package/lib/internal/template/prompt-input/styles.css.js +26 -26
- package/lib/internal/template/prompt-input/styles.scoped.css +57 -53
- package/lib/internal/template/prompt-input/styles.selectors.js +26 -26
- package/lib/internal/template/segmented-control/internal-segmented-control.d.ts +3 -3
- package/lib/internal/template/segmented-control/internal-segmented-control.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/internal-segmented-control.js +8 -5
- package/lib/internal/template/segmented-control/internal-segmented-control.js.map +1 -1
- package/lib/internal/template/segmented-control/internal.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/internal.js +4 -6
- package/lib/internal/template/segmented-control/internal.js.map +1 -1
- package/lib/internal/template/segmented-control/segment.d.ts +1 -0
- package/lib/internal/template/segmented-control/segment.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/segment.js +2 -2
- package/lib/internal/template/segmented-control/segment.js.map +1 -1
- package/lib/internal/template/segmented-control/styles.css.js +26 -21
- package/lib/internal/template/segmented-control/styles.scoped.css +75 -43
- package/lib/internal/template/segmented-control/styles.selectors.js +26 -21
- package/lib/internal/template/select/internal.js +2 -2
- package/lib/internal/template/select/internal.js.map +1 -1
- package/lib/internal/template/select/parts/trigger.d.ts +2 -2
- package/lib/internal/template/select/parts/trigger.d.ts.map +1 -1
- package/lib/internal/template/select/parts/trigger.js +2 -2
- package/lib/internal/template/select/parts/trigger.js.map +1 -1
- package/lib/internal/template/steps/styles.css.js +17 -17
- package/lib/internal/template/steps/styles.scoped.css +35 -35
- package/lib/internal/template/steps/styles.selectors.js +17 -17
- package/package.json +1 -1
|
@@ -14,7 +14,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
14
14
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
15
15
|
SPDX-License-Identifier: Apache-2.0
|
|
16
16
|
*/
|
|
17
|
-
@keyframes awsui_modal-slide-
|
|
17
|
+
@keyframes awsui_modal-slide-up_1d2i7_1ls09_1 {
|
|
18
18
|
0% {
|
|
19
19
|
transform: translate(0, 10px);
|
|
20
20
|
}
|
|
@@ -22,12 +22,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
22
22
|
transform: translate(0, 0);
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
|
-
.
|
|
26
|
-
animation: awsui_modal-slide-
|
|
25
|
+
.awsui_dialog_1d2i7_1ls09_25:not(#\9) {
|
|
26
|
+
animation: awsui_modal-slide-up_1d2i7_1ls09_1 var(--motion-duration-slow-8cu00l, 180ms) ease-out, awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1 var(--motion-duration-slow-8cu00l, 180ms) ease-out;
|
|
27
27
|
animation-delay: var(--motion-duration-fast-yb0m8k, 90ms);
|
|
28
28
|
animation-fill-mode: both;
|
|
29
29
|
}
|
|
30
|
-
@keyframes awsui_awsui-motion-fade-in-
|
|
30
|
+
@keyframes awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1 {
|
|
31
31
|
from {
|
|
32
32
|
opacity: 0;
|
|
33
33
|
}
|
|
@@ -36,22 +36,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
36
36
|
}
|
|
37
37
|
}
|
|
38
38
|
@media (prefers-reduced-motion: reduce) {
|
|
39
|
-
.
|
|
39
|
+
.awsui_dialog_1d2i7_1ls09_25:not(#\9) {
|
|
40
40
|
animation: none;
|
|
41
41
|
transition: none;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
|
-
.awsui-motion-disabled .
|
|
44
|
+
.awsui-motion-disabled .awsui_dialog_1d2i7_1ls09_25:not(#\9), .awsui-mode-entering .awsui_dialog_1d2i7_1ls09_25:not(#\9) {
|
|
45
45
|
animation: none;
|
|
46
46
|
transition: none;
|
|
47
47
|
}
|
|
48
|
-
.
|
|
49
|
-
animation: awsui_awsui-motion-scale-
|
|
48
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
49
|
+
animation: awsui_awsui-motion-scale-popup_1d2i7_1ls09_1, awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1;
|
|
50
50
|
animation-duration: var(--motion-duration-refresh-only-fast-y8f250, 0ms);
|
|
51
51
|
animation-timing-function: var(--motion-easing-refresh-only-a-b2p95e, cubic-bezier(0, 0, 0, 1));
|
|
52
52
|
animation-fill-mode: both;
|
|
53
53
|
}
|
|
54
|
-
@keyframes awsui_awsui-motion-fade-in-
|
|
54
|
+
@keyframes awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1 {
|
|
55
55
|
from {
|
|
56
56
|
opacity: 0;
|
|
57
57
|
}
|
|
@@ -59,7 +59,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
59
59
|
opacity: 1;
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
|
-
@keyframes awsui_awsui-motion-scale-
|
|
62
|
+
@keyframes awsui_awsui-motion-scale-popup_1d2i7_1ls09_1 {
|
|
63
63
|
0% {
|
|
64
64
|
transform: scale(0.95);
|
|
65
65
|
}
|
|
@@ -68,21 +68,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
@media (prefers-reduced-motion: reduce) {
|
|
71
|
-
.
|
|
71
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
72
72
|
animation: none;
|
|
73
73
|
transition: none;
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
|
-
.awsui-motion-disabled .
|
|
76
|
+
.awsui-motion-disabled .awsui_dialog_1d2i7_1ls09_25.awsui_refresh_1d2i7_1ls09_48:not(#\9), .awsui-mode-entering .awsui_dialog_1d2i7_1ls09_25.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
77
77
|
animation: none;
|
|
78
78
|
transition: none;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
-
.
|
|
82
|
-
animation: awsui_awsui-motion-fade-
|
|
81
|
+
.awsui_root_1d2i7_1ls09_81:not(#\9) {
|
|
82
|
+
animation: awsui_awsui-motion-fade-in_1d2i7_1ls09_1 var(--motion-duration-extra-slow-bzo8np, 270ms) ease-out;
|
|
83
83
|
animation-fill-mode: both;
|
|
84
84
|
}
|
|
85
|
-
@keyframes awsui_awsui-motion-fade-
|
|
85
|
+
@keyframes awsui_awsui-motion-fade-in_1d2i7_1ls09_1 {
|
|
86
86
|
from {
|
|
87
87
|
opacity: 0.2;
|
|
88
88
|
}
|
|
@@ -91,30 +91,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
91
91
|
}
|
|
92
92
|
}
|
|
93
93
|
@media (prefers-reduced-motion: reduce) {
|
|
94
|
-
.
|
|
94
|
+
.awsui_root_1d2i7_1ls09_81:not(#\9) {
|
|
95
95
|
animation: none;
|
|
96
96
|
transition: none;
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
|
-
.awsui-motion-disabled .
|
|
99
|
+
.awsui-motion-disabled .awsui_root_1d2i7_1ls09_81:not(#\9), .awsui-mode-entering .awsui_root_1d2i7_1ls09_81:not(#\9) {
|
|
100
100
|
animation: none;
|
|
101
101
|
transition: none;
|
|
102
102
|
}
|
|
103
|
-
.
|
|
103
|
+
.awsui_root_1d2i7_1ls09_81.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
104
104
|
animation-duration: var(--motion-duration-refresh-only-fast-y8f250, 0ms);
|
|
105
105
|
}
|
|
106
106
|
@media (prefers-reduced-motion: reduce) {
|
|
107
|
-
.
|
|
107
|
+
.awsui_root_1d2i7_1ls09_81.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
108
108
|
animation: none;
|
|
109
109
|
transition: none;
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
|
-
.awsui-motion-disabled .
|
|
112
|
+
.awsui-motion-disabled .awsui_root_1d2i7_1ls09_81.awsui_refresh_1d2i7_1ls09_48:not(#\9), .awsui-mode-entering .awsui_root_1d2i7_1ls09_81.awsui_refresh_1d2i7_1ls09_48:not(#\9) {
|
|
113
113
|
animation: none;
|
|
114
114
|
transition: none;
|
|
115
115
|
}
|
|
116
116
|
|
|
117
|
-
.
|
|
117
|
+
.awsui_root_1d2i7_1ls09_81:not(#\9) {
|
|
118
118
|
border-collapse: separate;
|
|
119
119
|
border-spacing: 0;
|
|
120
120
|
box-sizing: border-box;
|
|
@@ -155,11 +155,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
155
155
|
overflow: auto;
|
|
156
156
|
cursor: pointer;
|
|
157
157
|
}
|
|
158
|
-
.
|
|
158
|
+
.awsui_root_1d2i7_1ls09_81.awsui_hide-dismiss-button_1d2i7_1ls09_158:not(#\9) {
|
|
159
|
+
cursor: default;
|
|
160
|
+
}
|
|
161
|
+
.awsui_root_1d2i7_1ls09_81.awsui_hidden_1d2i7_1ls09_161:not(#\9) {
|
|
159
162
|
display: none;
|
|
160
163
|
}
|
|
161
164
|
|
|
162
|
-
.awsui_focus-
|
|
165
|
+
.awsui_focus-lock_1d2i7_1ls09_165:not(#\9) {
|
|
163
166
|
align-self: flex-start;
|
|
164
167
|
margin-inline: auto;
|
|
165
168
|
padding-block: var(--space-s-kll7oj, 12px);
|
|
@@ -167,14 +170,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
167
170
|
z-index: 5000;
|
|
168
171
|
pointer-events: none;
|
|
169
172
|
}
|
|
170
|
-
.awsui_focus-
|
|
173
|
+
.awsui_focus-lock_1d2i7_1ls09_165.awsui_position-top_1d2i7_1ls09_173:not(#\9) {
|
|
171
174
|
margin-block-start: 0;
|
|
172
175
|
}
|
|
173
|
-
.awsui_focus-
|
|
176
|
+
.awsui_focus-lock_1d2i7_1ls09_165.awsui_position-center_1d2i7_1ls09_176:not(#\9) {
|
|
174
177
|
margin-block: auto;
|
|
175
178
|
}
|
|
176
179
|
|
|
177
|
-
.
|
|
180
|
+
.awsui_dialog_1d2i7_1ls09_25:not(#\9) {
|
|
178
181
|
position: static;
|
|
179
182
|
inset-block-start: 0;
|
|
180
183
|
transform: translate(0, 0);
|
|
@@ -184,35 +187,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
184
187
|
z-index: 5000;
|
|
185
188
|
pointer-events: all;
|
|
186
189
|
}
|
|
187
|
-
.
|
|
190
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_small_1d2i7_1ls09_190:not(#\9) {
|
|
188
191
|
max-inline-size: 320px;
|
|
189
192
|
}
|
|
190
|
-
.
|
|
193
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_medium_1d2i7_1ls09_193:not(#\9) {
|
|
191
194
|
max-inline-size: 600px;
|
|
192
195
|
}
|
|
193
|
-
.
|
|
196
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_large_1d2i7_1ls09_196:not(#\9) {
|
|
194
197
|
max-inline-size: 820px;
|
|
195
198
|
}
|
|
196
|
-
.
|
|
199
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_x-large_1d2i7_1ls09_199:not(#\9) {
|
|
197
200
|
max-inline-size: 1024px;
|
|
198
201
|
}
|
|
199
|
-
.
|
|
202
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_xx-large_1d2i7_1ls09_202:not(#\9) {
|
|
200
203
|
max-inline-size: 1280px;
|
|
201
204
|
}
|
|
202
|
-
.
|
|
205
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_custom-width_1d2i7_1ls09_205:not(#\9) {
|
|
203
206
|
max-inline-size: var(--awsui-modal-custom-width-ka4djm);
|
|
204
207
|
}
|
|
205
|
-
.
|
|
208
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_max_1d2i7_1ls09_208.awsui_breakpoint-xs_1d2i7_1ls09_208:not(#\9) {
|
|
206
209
|
max-inline-size: calc(100vw - (8 * 10px + var(--space-xxxl-pjngik, 40px)));
|
|
207
210
|
margin-block: auto;
|
|
208
211
|
margin-inline: auto;
|
|
209
212
|
}
|
|
210
|
-
.
|
|
213
|
+
.awsui_dialog_1d2i7_1ls09_25.awsui_custom-height_1d2i7_1ls09_213:not(#\9) {
|
|
211
214
|
block-size: var(--awsui-modal-custom-height-ka4djm);
|
|
212
215
|
max-block-size: calc(100vh - 2 * var(--space-s-kll7oj, 12px));
|
|
213
216
|
}
|
|
214
217
|
|
|
215
|
-
.
|
|
218
|
+
.awsui_container_1d2i7_1ls09_218:not(#\9) {
|
|
216
219
|
border-collapse: separate;
|
|
217
220
|
border-spacing: 0;
|
|
218
221
|
box-sizing: border-box;
|
|
@@ -252,27 +255,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
252
255
|
border-end-end-radius: var(--border-radius-container-33hhdh, 0px);
|
|
253
256
|
box-shadow: var(--shadow-modal-gdc1ov, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
|
|
254
257
|
}
|
|
255
|
-
.
|
|
258
|
+
.awsui_container_1d2i7_1ls09_218.awsui_custom-height-container_1d2i7_1ls09_258:not(#\9) {
|
|
256
259
|
display: flex;
|
|
257
260
|
flex-direction: column;
|
|
258
261
|
block-size: 100%;
|
|
259
262
|
}
|
|
260
263
|
|
|
261
|
-
.
|
|
264
|
+
.awsui_content_1d2i7_1ls09_264:not(#\9) {
|
|
262
265
|
padding-block-start: var(--space-container-content-top-ryubqz, 16px);
|
|
263
266
|
padding-block-end: var(--space-modal-content-bottom-i4wk4i, 20px);
|
|
264
267
|
padding-inline: var(--space-modal-horizontal-f789j4, 20px);
|
|
265
268
|
}
|
|
266
|
-
.
|
|
269
|
+
.awsui_content_1d2i7_1ls09_264.awsui_no-paddings_1d2i7_1ls09_269:not(#\9) {
|
|
267
270
|
padding-block: 0;
|
|
268
271
|
padding-inline: 0;
|
|
269
272
|
}
|
|
270
|
-
.
|
|
273
|
+
.awsui_content_1d2i7_1ls09_264.awsui_custom-height-content_1d2i7_1ls09_273:not(#\9) {
|
|
271
274
|
flex-grow: 1;
|
|
272
275
|
overflow-y: auto;
|
|
273
276
|
}
|
|
274
277
|
|
|
275
|
-
.
|
|
278
|
+
.awsui_header_1d2i7_1ls09_278:not(#\9) {
|
|
276
279
|
padding-block-start: var(--space-container-header-top-3txhx4, 12px);
|
|
277
280
|
padding-block-end: var(--space-container-header-bottom-9elagw, 12px);
|
|
278
281
|
padding-inline: var(--space-modal-horizontal-f789j4, 20px);
|
|
@@ -284,11 +287,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
284
287
|
border-end-end-radius: 0;
|
|
285
288
|
}
|
|
286
289
|
|
|
287
|
-
.awsui_header--
|
|
290
|
+
.awsui_header--text_1d2i7_1ls09_290:not(#\9) {
|
|
288
291
|
/* used in test-utils */
|
|
289
292
|
}
|
|
290
293
|
|
|
291
|
-
.
|
|
294
|
+
.awsui_footer_1d2i7_1ls09_294:not(#\9) {
|
|
292
295
|
border-block-start: var(--border-divider-section-width-dlkb8v, 1px) solid var(--color-border-divider-default-diwd4w, #eaeded);
|
|
293
296
|
padding-block: var(--space-scaled-s-2crg2b, 12px);
|
|
294
297
|
padding-inline: var(--space-container-horizontal-quy5ai, 20px);
|
|
@@ -297,23 +300,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
297
300
|
inset-block-end: 0;
|
|
298
301
|
z-index: 800;
|
|
299
302
|
}
|
|
300
|
-
.awsui_footer--
|
|
303
|
+
.awsui_footer--rounded_1d2i7_1ls09_303:not(#\9) {
|
|
301
304
|
border-start-start-radius: 0;
|
|
302
305
|
border-start-end-radius: 0;
|
|
303
306
|
border-end-start-radius: var(--border-radius-container-33hhdh, 0px);
|
|
304
307
|
border-end-end-radius: var(--border-radius-container-33hhdh, 0px);
|
|
305
308
|
}
|
|
306
|
-
.
|
|
309
|
+
.awsui_footer_1d2i7_1ls09_294:not(#\9):after {
|
|
307
310
|
content: "";
|
|
308
311
|
display: table;
|
|
309
312
|
clear: both;
|
|
310
313
|
}
|
|
311
314
|
|
|
312
|
-
.awsui_dismiss-
|
|
315
|
+
.awsui_dismiss-control_1d2i7_1ls09_315:not(#\9) {
|
|
313
316
|
/* used in test-utils */
|
|
314
317
|
}
|
|
315
318
|
|
|
316
|
-
.awsui_modal-
|
|
319
|
+
.awsui_modal-open_1d2i7_1ls09_319:not(#\9) {
|
|
317
320
|
overflow: hidden;
|
|
318
321
|
/*
|
|
319
322
|
* When padding-right is added to account for scrollbar being turned
|
|
@@ -2,36 +2,37 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"dialog": "
|
|
6
|
-
"modal-slide-up": "awsui_modal-slide-
|
|
7
|
-
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-
|
|
8
|
-
"refresh": "
|
|
9
|
-
"awsui-motion-scale-popup": "awsui_awsui-motion-scale-
|
|
10
|
-
"root": "
|
|
11
|
-
"awsui-motion-fade-in": "awsui_awsui-motion-fade-
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"position-
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"header
|
|
32
|
-
"
|
|
33
|
-
"footer
|
|
34
|
-
"
|
|
35
|
-
"
|
|
5
|
+
"dialog": "awsui_dialog_1d2i7_1ls09_25",
|
|
6
|
+
"modal-slide-up": "awsui_modal-slide-up_1d2i7_1ls09_1",
|
|
7
|
+
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1",
|
|
8
|
+
"refresh": "awsui_refresh_1d2i7_1ls09_48",
|
|
9
|
+
"awsui-motion-scale-popup": "awsui_awsui-motion-scale-popup_1d2i7_1ls09_1",
|
|
10
|
+
"root": "awsui_root_1d2i7_1ls09_81",
|
|
11
|
+
"awsui-motion-fade-in": "awsui_awsui-motion-fade-in_1d2i7_1ls09_1",
|
|
12
|
+
"hide-dismiss-button": "awsui_hide-dismiss-button_1d2i7_1ls09_158",
|
|
13
|
+
"hidden": "awsui_hidden_1d2i7_1ls09_161",
|
|
14
|
+
"focus-lock": "awsui_focus-lock_1d2i7_1ls09_165",
|
|
15
|
+
"position-top": "awsui_position-top_1d2i7_1ls09_173",
|
|
16
|
+
"position-center": "awsui_position-center_1d2i7_1ls09_176",
|
|
17
|
+
"small": "awsui_small_1d2i7_1ls09_190",
|
|
18
|
+
"medium": "awsui_medium_1d2i7_1ls09_193",
|
|
19
|
+
"large": "awsui_large_1d2i7_1ls09_196",
|
|
20
|
+
"x-large": "awsui_x-large_1d2i7_1ls09_199",
|
|
21
|
+
"xx-large": "awsui_xx-large_1d2i7_1ls09_202",
|
|
22
|
+
"custom-width": "awsui_custom-width_1d2i7_1ls09_205",
|
|
23
|
+
"max": "awsui_max_1d2i7_1ls09_208",
|
|
24
|
+
"breakpoint-xs": "awsui_breakpoint-xs_1d2i7_1ls09_208",
|
|
25
|
+
"custom-height": "awsui_custom-height_1d2i7_1ls09_213",
|
|
26
|
+
"container": "awsui_container_1d2i7_1ls09_218",
|
|
27
|
+
"custom-height-container": "awsui_custom-height-container_1d2i7_1ls09_258",
|
|
28
|
+
"content": "awsui_content_1d2i7_1ls09_264",
|
|
29
|
+
"no-paddings": "awsui_no-paddings_1d2i7_1ls09_269",
|
|
30
|
+
"custom-height-content": "awsui_custom-height-content_1d2i7_1ls09_273",
|
|
31
|
+
"header": "awsui_header_1d2i7_1ls09_278",
|
|
32
|
+
"header--text": "awsui_header--text_1d2i7_1ls09_290",
|
|
33
|
+
"footer": "awsui_footer_1d2i7_1ls09_294",
|
|
34
|
+
"footer--rounded": "awsui_footer--rounded_1d2i7_1ls09_303",
|
|
35
|
+
"dismiss-control": "awsui_dismiss-control_1d2i7_1ls09_315",
|
|
36
|
+
"modal-open": "awsui_modal-open_1d2i7_1ls09_319"
|
|
36
37
|
};
|
|
37
38
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAahD,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAW3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAahD,QAAA,MAAM,mBAAmB;;;;;;;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAahD,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAW3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAahD,QAAA,MAAM,mBAAmB;;;;;;;2EAsOxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -25,8 +25,12 @@ const InternalMultiselect = React.forwardRef(({ options, filteringType, filterin
|
|
|
25
25
|
var _a;
|
|
26
26
|
const baseProps = getBaseProps(restProps);
|
|
27
27
|
const formFieldContext = useFormFieldContext(restProps);
|
|
28
|
-
const
|
|
28
|
+
const groupedControlProps = useGroupedControlContext();
|
|
29
29
|
const i18n = useInternalI18n('multiselect');
|
|
30
|
+
// When rendered inside a control group, tokens are always shown inline in the
|
|
31
|
+
// trigger regardless of the `inlineTokens` prop, since there is no room to
|
|
32
|
+
// display tokens below the control within a group.
|
|
33
|
+
const showTokensInline = inlineTokens || !!groupedControlProps.position;
|
|
30
34
|
const selfControlId = useUniqueId('trigger');
|
|
31
35
|
const controlId = (_a = formFieldContext.controlId) !== null && _a !== void 0 ? _a : selfControlId;
|
|
32
36
|
const ariaLabelId = useUniqueId('multiselect-ariaLabel-');
|
|
@@ -60,7 +64,7 @@ const InternalMultiselect = React.forwardRef(({ options, filteringType, filterin
|
|
|
60
64
|
const triggerRef = useRef(null);
|
|
61
65
|
const [triggerWidth, setTriggerWidth] = useState(null);
|
|
62
66
|
useResizeObserver(() => triggerRef.current, entry => entry.borderBoxWidth > 0 && setTriggerWidth(entry.borderBoxWidth));
|
|
63
|
-
const trigger = (React.createElement(Trigger, { ref: triggerRef, placeholder: placeholder, disabled: disabled, readOnly: readOnly, triggerProps: multiselectProps.getTriggerProps(disabled, autoFocus), selectedOption: null, selectedOptions: selectedOptions, triggerVariant:
|
|
67
|
+
const trigger = (React.createElement(Trigger, { ref: triggerRef, placeholder: placeholder, disabled: disabled, readOnly: readOnly, triggerProps: multiselectProps.getTriggerProps(disabled, autoFocus), selectedOption: null, selectedOptions: selectedOptions, triggerVariant: showTokensInline ? 'tokens' : 'placeholder', isOpen: multiselectProps.isOpen, groupedControlProps: groupedControlProps, inlineLabelText: inlineLabelText, ...formFieldContext, controlId: controlId, ariaLabelledby: joinStrings(formFieldContext.ariaLabelledby, ariaLabelId) }));
|
|
64
68
|
const tokens = selectedOptions.map(option => ({
|
|
65
69
|
label: option.label,
|
|
66
70
|
disabled,
|
|
@@ -75,7 +79,7 @@ const InternalMultiselect = React.forwardRef(({ options, filteringType, filterin
|
|
|
75
79
|
_readOnly: !!option.disabled,
|
|
76
80
|
}));
|
|
77
81
|
const ListComponent = virtualScroll ? VirtualList : PlainList;
|
|
78
|
-
const showTokens = !hideTokens && !
|
|
82
|
+
const showTokens = !hideTokens && !showTokensInline && tokens.length > 0;
|
|
79
83
|
const tokenGroupI18nStrings = {
|
|
80
84
|
limitShowFewer: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.tokenLimitShowFewer,
|
|
81
85
|
limitShowMore: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.tokenLimitShowMore,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/internal.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, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport Dropdown from '../dropdown/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { getBreakpointValue } from '../internal/breakpoints';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { ResetGroupedControlContext, useGroupedControlContext } from '../internal/context/control-group-context';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { SomeRequired } from '../internal/types';\nimport { getDropdownMinWidth } from '../internal/utils/get-dropdown-min-width';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { composeDropdownContent } from '../select/utils/dropdown-customization';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\nimport { useMultiselect } from './use-multiselect';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = SomeRequired<\n MultiselectProps,\n 'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen' | 'hideTokens'\n> &\n InternalBaseComponentProps;\n\ntype ExtendedToken = TokenGroupProps.Item & { _readOnly: boolean };\n\nconst InternalMultiselect = React.forwardRef(\n (\n {\n options,\n filteringType,\n filteringPlaceholder,\n filteringAriaLabel,\n filteringClearAriaLabel,\n ariaRequired,\n placeholder,\n disabled,\n readOnly,\n ariaLabel,\n inlineLabelText,\n selectedOptions,\n deselectAriaLabel,\n tokenLimit,\n i18nStrings,\n virtualScroll,\n inlineTokens = false,\n hideTokens,\n expandToViewport,\n tokenLimitShowFewerAriaLabel,\n tokenLimitShowMoreAriaLabel,\n __internalRootRef,\n autoFocus,\n enableSelectAll,\n renderOption,\n renderDropdownHeader,\n renderDropdownFooter,\n dropdownRole,\n dropdownAriaDescribedby,\n ...restProps\n }: InternalMultiselectProps,\n externalRef: React.Ref<MultiselectProps.Ref>\n ) => {\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n const { position: groupedControlPosition } = useGroupedControlContext();\n const i18n = useInternalI18n('multiselect');\n\n const selfControlId = useUniqueId('trigger');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const ariaLabelId = useUniqueId('multiselect-ariaLabel-');\n const footerId = useUniqueId('multiselect-footer-');\n\n const [filteringValue, setFilteringValue] = useState('');\n const multiselectProps = useMultiselect({\n options,\n selectedOptions,\n filteringType,\n disabled,\n deselectAriaLabel,\n controlId,\n ariaLabelId,\n footerId,\n filteringValue,\n setFilteringValue,\n externalRef,\n enableSelectAll,\n i18nStrings,\n dropdownRole,\n dropdownAriaDescribedby,\n ...restProps,\n });\n\n const dropdownContentProps: MultiselectProps.DropdownContentProps = {\n filterText: filteringValue,\n closeDropdown: multiselectProps.closeDropdown,\n };\n const customDropdownHeader = renderDropdownHeader?.(dropdownContentProps);\n const customDropdownFooter = renderDropdownFooter?.(dropdownContentProps);\n\n const filter = (\n <Filter\n clearAriaLabel={filteringClearAriaLabel}\n filteringType={filteringType}\n placeholder={filteringPlaceholder}\n ariaLabel={filteringAriaLabel}\n ariaRequired={ariaRequired}\n value={filteringValue}\n {...multiselectProps.getFilterProps()}\n />\n );\n\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [triggerWidth, setTriggerWidth] = useState<number | null>(null);\n useResizeObserver(\n () => triggerRef.current,\n entry => entry.borderBoxWidth > 0 && setTriggerWidth(entry.borderBoxWidth)\n );\n\n const trigger = (\n <Trigger\n ref={triggerRef}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n triggerProps={multiselectProps.getTriggerProps(disabled, autoFocus)}\n selectedOption={null}\n selectedOptions={selectedOptions}\n triggerVariant={inlineTokens ? 'tokens' : 'placeholder'}\n isOpen={multiselectProps.isOpen}\n groupedControlPosition={groupedControlPosition}\n inlineLabelText={inlineLabelText}\n {...formFieldContext}\n controlId={controlId}\n ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, ariaLabelId)}\n />\n );\n\n const tokens: Array<ExtendedToken> = selectedOptions.map(option => ({\n label: option.label,\n disabled,\n labelTag: option.labelTag,\n description: option.description,\n iconAlt: option.iconAlt,\n iconName: option.iconName,\n iconUrl: option.iconUrl,\n iconSvg: option.iconSvg,\n tags: option.tags,\n dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n format({ option__label: option.label ?? '' })\n ),\n _readOnly: !!option.disabled,\n }));\n\n const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;\n\n const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n limitShowMore: i18nStrings?.tokenLimitShowMore,\n };\n\n const dropdownStatus = multiselectProps.dropdownStatus;\n const dropdownProps = multiselectProps.getDropdownProps();\n const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;\n\n const statusFooter = dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null;\n const { header: dropdownHeader, footer: dropdownFooter } = composeDropdownContent({\n filter,\n customDropdownHeader,\n customDropdownFooter,\n statusFooter,\n dropdownHeaderClass: styles['dropdown-header'],\n dropdownFooterClass: styles['dropdown-footer'],\n });\n\n const hasOptions = useRef(options.length > 0);\n hasOptions.current = hasOptions.current || options.length > 0;\n\n return (\n <ResetGroupedControlContext>\n <div\n {...baseProps}\n ref={__internalRootRef}\n className={clsx(styles.root, baseProps.className)}\n {...multiselectProps.getWrapperProps()}\n >\n <Dropdown\n {...dropdownProps}\n ariaLabelledby={dropdownProps.ariaRole ? joinStrings(ariaLabelId, controlId) : undefined}\n ariaDescribedby={\n dropdownProps.ariaRole\n ? joinStrings(dropdownStatus.content ? footerId : undefined, dropdownAriaDescribedby)\n : undefined\n }\n open={multiselectProps.isOpen}\n minWidth={getDropdownMinWidth({ expandToViewport, triggerWidth })}\n maxWidth={getBreakpointValue('xxs')} // AWSUI-19898\n trigger={trigger}\n header={dropdownHeader}\n footer={dropdownFooter}\n expandToViewport={expandToViewport}\n // Forces dropdown position recalculation when new options are loaded\n contentKey={hasOptions.current.toString()}\n content={\n <ListComponent\n renderOption={renderOption}\n listBottom={\n !dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n menuProps={{ ...multiselectProps.getMenuProps(), ariaRequired }}\n getOptionProps={multiselectProps.getOptionProps}\n filteredOptions={multiselectProps.filteredOptions}\n filteringValue={filteringValue}\n ref={multiselectProps.scrollToIndex}\n hasDropdownStatus={dropdownStatus.content !== null}\n checkboxes={true}\n useInteractiveGroups={true}\n screenReaderContent={multiselectProps.announcement}\n highlightType={multiselectProps.highlightType}\n firstOptionSticky={hasFilteredOptions && enableSelectAll}\n isMultiSelect={true}\n />\n }\n />\n\n {showTokens && (\n <InternalTokenGroup\n {...multiselectProps.getTokenProps()}\n className={styles.tokens}\n alignment=\"horizontal\"\n limit={tokenLimit}\n items={tokens}\n i18nStrings={tokenGroupI18nStrings}\n limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n disableOuterPadding={true}\n readOnly={readOnly}\n isItemReadOnly={item => (item as ExtendedToken)._readOnly}\n />\n )}\n\n <ScreenreaderOnly id={ariaLabelId}>{ariaLabel || inlineLabelText}</ScreenreaderOnly>\n </div>\n </ResetGroupedControlContext>\n );\n }\n);\n\nexport default InternalMultiselect;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/internal.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, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport Dropdown from '../dropdown/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { getBreakpointValue } from '../internal/breakpoints';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { ResetGroupedControlContext, useGroupedControlContext } from '../internal/context/control-group-context';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { SomeRequired } from '../internal/types';\nimport { getDropdownMinWidth } from '../internal/utils/get-dropdown-min-width';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { composeDropdownContent } from '../select/utils/dropdown-customization';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\nimport { useMultiselect } from './use-multiselect';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = SomeRequired<\n MultiselectProps,\n 'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen' | 'hideTokens'\n> &\n InternalBaseComponentProps;\n\ntype ExtendedToken = TokenGroupProps.Item & { _readOnly: boolean };\n\nconst InternalMultiselect = React.forwardRef(\n (\n {\n options,\n filteringType,\n filteringPlaceholder,\n filteringAriaLabel,\n filteringClearAriaLabel,\n ariaRequired,\n placeholder,\n disabled,\n readOnly,\n ariaLabel,\n inlineLabelText,\n selectedOptions,\n deselectAriaLabel,\n tokenLimit,\n i18nStrings,\n virtualScroll,\n inlineTokens = false,\n hideTokens,\n expandToViewport,\n tokenLimitShowFewerAriaLabel,\n tokenLimitShowMoreAriaLabel,\n __internalRootRef,\n autoFocus,\n enableSelectAll,\n renderOption,\n renderDropdownHeader,\n renderDropdownFooter,\n dropdownRole,\n dropdownAriaDescribedby,\n ...restProps\n }: InternalMultiselectProps,\n externalRef: React.Ref<MultiselectProps.Ref>\n ) => {\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n const groupedControlProps = useGroupedControlContext();\n const i18n = useInternalI18n('multiselect');\n\n // When rendered inside a control group, tokens are always shown inline in the\n // trigger regardless of the `inlineTokens` prop, since there is no room to\n // display tokens below the control within a group.\n const showTokensInline = inlineTokens || !!groupedControlProps.position;\n\n const selfControlId = useUniqueId('trigger');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const ariaLabelId = useUniqueId('multiselect-ariaLabel-');\n const footerId = useUniqueId('multiselect-footer-');\n\n const [filteringValue, setFilteringValue] = useState('');\n const multiselectProps = useMultiselect({\n options,\n selectedOptions,\n filteringType,\n disabled,\n deselectAriaLabel,\n controlId,\n ariaLabelId,\n footerId,\n filteringValue,\n setFilteringValue,\n externalRef,\n enableSelectAll,\n i18nStrings,\n dropdownRole,\n dropdownAriaDescribedby,\n ...restProps,\n });\n\n const dropdownContentProps: MultiselectProps.DropdownContentProps = {\n filterText: filteringValue,\n closeDropdown: multiselectProps.closeDropdown,\n };\n const customDropdownHeader = renderDropdownHeader?.(dropdownContentProps);\n const customDropdownFooter = renderDropdownFooter?.(dropdownContentProps);\n\n const filter = (\n <Filter\n clearAriaLabel={filteringClearAriaLabel}\n filteringType={filteringType}\n placeholder={filteringPlaceholder}\n ariaLabel={filteringAriaLabel}\n ariaRequired={ariaRequired}\n value={filteringValue}\n {...multiselectProps.getFilterProps()}\n />\n );\n\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [triggerWidth, setTriggerWidth] = useState<number | null>(null);\n useResizeObserver(\n () => triggerRef.current,\n entry => entry.borderBoxWidth > 0 && setTriggerWidth(entry.borderBoxWidth)\n );\n\n const trigger = (\n <Trigger\n ref={triggerRef}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n triggerProps={multiselectProps.getTriggerProps(disabled, autoFocus)}\n selectedOption={null}\n selectedOptions={selectedOptions}\n triggerVariant={showTokensInline ? 'tokens' : 'placeholder'}\n isOpen={multiselectProps.isOpen}\n groupedControlProps={groupedControlProps}\n inlineLabelText={inlineLabelText}\n {...formFieldContext}\n controlId={controlId}\n ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, ariaLabelId)}\n />\n );\n\n const tokens: Array<ExtendedToken> = selectedOptions.map(option => ({\n label: option.label,\n disabled,\n labelTag: option.labelTag,\n description: option.description,\n iconAlt: option.iconAlt,\n iconName: option.iconName,\n iconUrl: option.iconUrl,\n iconSvg: option.iconSvg,\n tags: option.tags,\n dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n format({ option__label: option.label ?? '' })\n ),\n _readOnly: !!option.disabled,\n }));\n\n const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n const showTokens = !hideTokens && !showTokensInline && tokens.length > 0;\n\n const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n limitShowMore: i18nStrings?.tokenLimitShowMore,\n };\n\n const dropdownStatus = multiselectProps.dropdownStatus;\n const dropdownProps = multiselectProps.getDropdownProps();\n const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;\n\n const statusFooter = dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null;\n const { header: dropdownHeader, footer: dropdownFooter } = composeDropdownContent({\n filter,\n customDropdownHeader,\n customDropdownFooter,\n statusFooter,\n dropdownHeaderClass: styles['dropdown-header'],\n dropdownFooterClass: styles['dropdown-footer'],\n });\n\n const hasOptions = useRef(options.length > 0);\n hasOptions.current = hasOptions.current || options.length > 0;\n\n return (\n <ResetGroupedControlContext>\n <div\n {...baseProps}\n ref={__internalRootRef}\n className={clsx(styles.root, baseProps.className)}\n {...multiselectProps.getWrapperProps()}\n >\n <Dropdown\n {...dropdownProps}\n ariaLabelledby={dropdownProps.ariaRole ? joinStrings(ariaLabelId, controlId) : undefined}\n ariaDescribedby={\n dropdownProps.ariaRole\n ? joinStrings(dropdownStatus.content ? footerId : undefined, dropdownAriaDescribedby)\n : undefined\n }\n open={multiselectProps.isOpen}\n minWidth={getDropdownMinWidth({ expandToViewport, triggerWidth })}\n maxWidth={getBreakpointValue('xxs')} // AWSUI-19898\n trigger={trigger}\n header={dropdownHeader}\n footer={dropdownFooter}\n expandToViewport={expandToViewport}\n // Forces dropdown position recalculation when new options are loaded\n contentKey={hasOptions.current.toString()}\n content={\n <ListComponent\n renderOption={renderOption}\n listBottom={\n !dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n menuProps={{ ...multiselectProps.getMenuProps(), ariaRequired }}\n getOptionProps={multiselectProps.getOptionProps}\n filteredOptions={multiselectProps.filteredOptions}\n filteringValue={filteringValue}\n ref={multiselectProps.scrollToIndex}\n hasDropdownStatus={dropdownStatus.content !== null}\n checkboxes={true}\n useInteractiveGroups={true}\n screenReaderContent={multiselectProps.announcement}\n highlightType={multiselectProps.highlightType}\n firstOptionSticky={hasFilteredOptions && enableSelectAll}\n isMultiSelect={true}\n />\n }\n />\n\n {showTokens && (\n <InternalTokenGroup\n {...multiselectProps.getTokenProps()}\n className={styles.tokens}\n alignment=\"horizontal\"\n limit={tokenLimit}\n items={tokens}\n i18nStrings={tokenGroupI18nStrings}\n limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n disableOuterPadding={true}\n readOnly={readOnly}\n isItemReadOnly={item => (item as ExtendedToken)._readOnly}\n />\n )}\n\n <ScreenreaderOnly id={ariaLabelId}>{ariaLabel || inlineLabelText}</ScreenreaderOnly>\n </div>\n </ResetGroupedControlContext>\n );\n }\n);\n\nexport default InternalMultiselect;\n"]}
|
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"root": "
|
|
5
|
-
"textarea-readonly": "awsui_textarea-
|
|
6
|
-
"disabled": "
|
|
7
|
-
"textarea-invalid": "awsui_textarea-
|
|
8
|
-
"textarea-warning": "awsui_textarea-
|
|
9
|
-
"textarea": "
|
|
10
|
-
"placeholder-visible": "awsui_placeholder-
|
|
11
|
-
"invalid": "
|
|
12
|
-
"warning": "
|
|
13
|
-
"textarea-disabled": "awsui_textarea-
|
|
14
|
-
"textarea-wrapper": "awsui_textarea-
|
|
15
|
-
"editable-wrapper": "awsui_editable-
|
|
16
|
-
"editable-element": "awsui_editable-
|
|
17
|
-
"primary-action": "awsui_primary-
|
|
18
|
-
"action-button": "awsui_action-
|
|
19
|
-
"secondary-content": "awsui_secondary-
|
|
20
|
-
"with-paddings": "awsui_with-
|
|
21
|
-
"action-stripe": "awsui_action-
|
|
22
|
-
"secondary-actions": "awsui_secondary-
|
|
23
|
-
"with-paddings-and-actions": "awsui_with-paddings-and-
|
|
24
|
-
"buffer": "
|
|
25
|
-
"token-container": "awsui_token-
|
|
26
|
-
"reference-wrapper": "awsui_reference-
|
|
27
|
-
"trigger-base": "awsui_trigger-
|
|
28
|
-
"trigger-token": "awsui_trigger-
|
|
29
|
-
"paragraph": "
|
|
4
|
+
"root": "awsui_root_55fkh_p5zjs_10",
|
|
5
|
+
"textarea-readonly": "awsui_textarea-readonly_55fkh_p5zjs_55",
|
|
6
|
+
"disabled": "awsui_disabled_55fkh_p5zjs_61",
|
|
7
|
+
"textarea-invalid": "awsui_textarea-invalid_55fkh_p5zjs_69",
|
|
8
|
+
"textarea-warning": "awsui_textarea-warning_55fkh_p5zjs_97",
|
|
9
|
+
"textarea": "awsui_textarea_55fkh_p5zjs_55",
|
|
10
|
+
"placeholder-visible": "awsui_placeholder-visible_55fkh_p5zjs_192",
|
|
11
|
+
"invalid": "awsui_invalid_55fkh_p5zjs_228",
|
|
12
|
+
"warning": "awsui_warning_55fkh_p5zjs_228",
|
|
13
|
+
"textarea-disabled": "awsui_textarea-disabled_55fkh_p5zjs_231",
|
|
14
|
+
"textarea-wrapper": "awsui_textarea-wrapper_55fkh_p5zjs_248",
|
|
15
|
+
"editable-wrapper": "awsui_editable-wrapper_55fkh_p5zjs_253",
|
|
16
|
+
"editable-element": "awsui_editable-element_55fkh_p5zjs_259",
|
|
17
|
+
"primary-action": "awsui_primary-action_55fkh_p5zjs_266",
|
|
18
|
+
"action-button": "awsui_action-button_55fkh_p5zjs_274",
|
|
19
|
+
"secondary-content": "awsui_secondary-content_55fkh_p5zjs_279",
|
|
20
|
+
"with-paddings": "awsui_with-paddings_55fkh_p5zjs_314",
|
|
21
|
+
"action-stripe": "awsui_action-stripe_55fkh_p5zjs_324",
|
|
22
|
+
"secondary-actions": "awsui_secondary-actions_55fkh_p5zjs_363",
|
|
23
|
+
"with-paddings-and-actions": "awsui_with-paddings-and-actions_55fkh_p5zjs_381",
|
|
24
|
+
"buffer": "awsui_buffer_55fkh_p5zjs_385",
|
|
25
|
+
"token-container": "awsui_token-container_55fkh_p5zjs_391",
|
|
26
|
+
"reference-wrapper": "awsui_reference-wrapper_55fkh_p5zjs_399",
|
|
27
|
+
"trigger-base": "awsui_trigger-base_55fkh_p5zjs_403",
|
|
28
|
+
"trigger-token": "awsui_trigger-token_55fkh_p5zjs_407",
|
|
29
|
+
"paragraph": "awsui_paragraph_55fkh_p5zjs_413"
|
|
30
30
|
};
|
|
31
31
|
|