@cloudscape-design/components 3.0.623 → 3.0.625
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/alert/index.d.ts.map +1 -1
- package/alert/index.js +9 -5
- package/alert/index.js.map +1 -1
- package/attribute-editor/interfaces.d.ts +4 -0
- package/attribute-editor/interfaces.d.ts.map +1 -1
- package/attribute-editor/interfaces.js.map +1 -1
- package/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +4 -1
- package/attribute-editor/row.js.map +1 -1
- package/container/index.js +1 -1
- package/container/index.js.map +1 -1
- package/date-picker/index.d.ts.map +1 -1
- package/date-picker/index.js +2 -2
- package/date-picker/index.js.map +1 -1
- package/date-range-picker/index.d.ts.map +1 -1
- package/date-range-picker/index.js +2 -2
- package/date-range-picker/index.js.map +1 -1
- package/file-upload/interfaces.d.ts +14 -4
- package/file-upload/interfaces.d.ts.map +1 -1
- package/file-upload/interfaces.js.map +1 -1
- package/file-upload/internal.js +13 -7
- package/file-upload/internal.js.map +1 -1
- package/form/index.d.ts.map +1 -1
- package/form/index.js +17 -6
- package/form/index.js.map +1 -1
- package/form/internal.d.ts.map +1 -1
- package/form/internal.js +1 -14
- package/form/internal.js.map +1 -1
- package/form-field/index.d.ts.map +1 -1
- package/form-field/index.js +3 -2
- package/form-field/index.js.map +1 -1
- package/form-field/interfaces.d.ts +12 -1
- package/form-field/interfaces.d.ts.map +1 -1
- package/form-field/interfaces.js.map +1 -1
- package/form-field/internal.d.ts +9 -3
- package/form-field/internal.d.ts.map +1 -1
- package/form-field/internal.js +39 -13
- package/form-field/internal.js.map +1 -1
- package/form-field/styles.css.js +23 -19
- package/form-field/styles.scoped.css +45 -29
- package/form-field/styles.selectors.js +23 -19
- package/form-field/util.d.ts +3 -2
- package/form-field/util.d.ts.map +1 -1
- package/form-field/util.js +4 -3
- package/form-field/util.js.map +1 -1
- package/input/index.d.ts.map +1 -1
- package/input/index.js +2 -1
- package/input/index.js.map +1 -1
- package/input/internal.d.ts.map +1 -1
- package/input/internal.js +4 -1
- package/input/internal.js.map +1 -1
- package/input/styles.css.js +13 -12
- package/input/styles.scoped.css +46 -30
- package/input/styles.selectors.js +13 -12
- package/internal/analytics/components/analytics-funnel.d.ts +12 -12
- package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
- package/internal/analytics/components/analytics-funnel.js +38 -25
- package/internal/analytics/components/analytics-funnel.js.map +1 -1
- package/internal/analytics/context/analytics-context.d.ts +7 -2
- package/internal/analytics/context/analytics-context.d.ts.map +1 -1
- package/internal/analytics/context/analytics-context.js.map +1 -1
- package/internal/analytics/hooks/use-funnel.d.ts +5 -1
- package/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
- package/internal/analytics/hooks/use-funnel.js +9 -5
- package/internal/analytics/hooks/use-funnel.js.map +1 -1
- package/internal/analytics/interfaces.d.ts +23 -37
- package/internal/analytics/interfaces.d.ts.map +1 -1
- package/internal/analytics/interfaces.js.map +1 -1
- package/internal/base-component/index.d.ts +1 -1
- package/internal/base-component/index.d.ts.map +1 -1
- package/internal/base-component/index.js +1 -1
- package/internal/base-component/index.js.map +1 -1
- package/internal/components/button-trigger/index.d.ts +1 -0
- package/internal/components/button-trigger/index.d.ts.map +1 -1
- package/internal/components/button-trigger/index.js +2 -2
- package/internal/components/button-trigger/index.js.map +1 -1
- package/internal/components/button-trigger/styles.css.js +11 -10
- package/internal/components/button-trigger/styles.scoped.css +35 -24
- package/internal/components/button-trigger/styles.selectors.js +11 -10
- package/internal/components/responsive-text/index.d.ts +1 -1
- package/internal/components/responsive-text/index.d.ts.map +1 -1
- package/internal/components/responsive-text/index.js +9 -4
- package/internal/components/responsive-text/index.js.map +1 -1
- package/internal/context/form-field-context.d.ts +14 -1
- package/internal/context/form-field-context.d.ts.map +1 -1
- package/internal/context/form-field-context.js +1 -1
- package/internal/context/form-field-context.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/link/internal.d.ts.map +1 -1
- package/link/internal.js +9 -3
- package/link/internal.js.map +1 -1
- package/modal/body-scroll.d.ts.map +1 -1
- package/modal/body-scroll.js +5 -0
- package/modal/body-scroll.js.map +1 -1
- package/package.json +1 -1
- package/pie-chart/responsive-text.d.ts.map +1 -1
- package/pie-chart/responsive-text.js +5 -1
- package/pie-chart/responsive-text.js.map +1 -1
- package/select/parts/filter.d.ts +1 -1
- package/select/parts/filter.d.ts.map +1 -1
- package/select/parts/trigger.d.ts.map +1 -1
- package/select/parts/trigger.js +2 -2
- package/select/parts/trigger.js.map +1 -1
- package/test-utils/dom/file-upload/index.d.ts +2 -0
- package/test-utils/dom/file-upload/index.js +6 -0
- package/test-utils/dom/file-upload/index.js.map +1 -1
- package/test-utils/dom/form-field/index.d.ts +1 -0
- package/test-utils/dom/form-field/index.js +3 -0
- package/test-utils/dom/form-field/index.js.map +1 -1
- package/test-utils/selectors/file-upload/index.d.ts +2 -0
- package/test-utils/selectors/file-upload/index.js +6 -0
- package/test-utils/selectors/file-upload/index.js.map +1 -1
- package/test-utils/selectors/form-field/index.d.ts +1 -0
- package/test-utils/selectors/form-field/index.js +3 -0
- package/test-utils/selectors/form-field/index.js.map +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
- package/textarea/index.d.ts.map +1 -1
- package/textarea/index.js +2 -1
- package/textarea/index.js.map +1 -1
- package/textarea/styles.css.js +5 -4
- package/textarea/styles.scoped.css +23 -12
- package/textarea/styles.selectors.js +5 -4
- package/token-group/styles.css.js +9 -8
- package/token-group/styles.scoped.css +27 -16
- package/token-group/styles.selectors.js +9 -8
- package/token-group/token.d.ts +3 -1
- package/token-group/token.d.ts.map +1 -1
- package/token-group/token.js +8 -5
- package/token-group/token.js.map +1 -1
- package/wizard/analytics.d.ts +2 -1
- package/wizard/analytics.d.ts.map +1 -1
- package/wizard/analytics.js +7 -3
- package/wizard/analytics.js.map +1 -1
- package/wizard/index.js +1 -1
- package/wizard/index.js.map +1 -1
- package/wizard/internal.d.ts.map +1 -1
- package/wizard/internal.js +2 -2
- package/wizard/internal.js.map +1 -1
- package/wizard/wizard-form.d.ts +4 -2
- package/wizard/wizard-form.d.ts.map +1 -1
- package/wizard/wizard-form.js +31 -19
- package/wizard/wizard-form.js.map +1 -1
|
@@ -100,16 +100,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
100
100
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
101
101
|
SPDX-License-Identifier: Apache-2.0
|
|
102
102
|
*/
|
|
103
|
-
.awsui_button-
|
|
103
|
+
.awsui_button-trigger_18eso_vwec8_103 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
104
104
|
transition: transform var(--motion-duration-rotate-180-dpvl4m, 135ms) var(--motion-easing-rotate-180-e270ko, cubic-bezier(0.165, 0.84, 0.44, 1));
|
|
105
105
|
}
|
|
106
106
|
@media (prefers-reduced-motion: reduce) {
|
|
107
|
-
.awsui_button-
|
|
107
|
+
.awsui_button-trigger_18eso_vwec8_103 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
108
108
|
animation: none;
|
|
109
109
|
transition: none;
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
|
-
.awsui-motion-disabled .awsui_button-
|
|
112
|
+
.awsui-motion-disabled .awsui_button-trigger_18eso_vwec8_103 > .awsui_arrow_18eso_vwec8_103:not(#\9), .awsui-mode-entering .awsui_button-trigger_18eso_vwec8_103 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
113
113
|
animation: none;
|
|
114
114
|
transition: none;
|
|
115
115
|
}
|
|
@@ -118,7 +118,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
118
118
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
119
119
|
SPDX-License-Identifier: Apache-2.0
|
|
120
120
|
*/
|
|
121
|
-
.awsui_button-
|
|
121
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9) {
|
|
122
122
|
border-collapse: separate;
|
|
123
123
|
border-spacing: 0;
|
|
124
124
|
box-sizing: border-box;
|
|
@@ -168,51 +168,51 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
168
168
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-default-1zl7hq, #7d8998);
|
|
169
169
|
min-block-size: var(--size-vertical-input-v5iwwf, 32px);
|
|
170
170
|
}
|
|
171
|
-
.awsui_button-
|
|
171
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_has-caret_18eso_vwec8_170:not(#\9) {
|
|
172
172
|
padding-inline-end: var(--space-field-icon-offset-csk9vw, 36px);
|
|
173
173
|
}
|
|
174
|
-
.awsui_button-
|
|
174
|
+
.awsui_button-trigger_18eso_vwec8_103 > .awsui_placeholder_18eso_vwec8_173:not(#\9) {
|
|
175
175
|
color: var(--color-text-input-placeholder-mx1ygd, #5f6b7a);
|
|
176
176
|
font-style: italic;
|
|
177
177
|
}
|
|
178
|
-
.awsui_button-
|
|
178
|
+
.awsui_button-trigger_18eso_vwec8_103 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
179
179
|
position: absolute;
|
|
180
180
|
inset-inline-end: var(--space-field-horizontal-gg19kw, 12px);
|
|
181
181
|
inset-block-start: calc(50% - var(--line-height-body-m-30ar75, 20px) / 2);
|
|
182
182
|
color: var(--color-text-button-inline-icon-default-s3yux9, #0972d3);
|
|
183
183
|
}
|
|
184
|
-
.awsui_button-
|
|
184
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):hover > .awsui_arrow_18eso_vwec8_103 {
|
|
185
185
|
color: var(--color-text-button-inline-icon-hover-my2daf, #033160);
|
|
186
186
|
}
|
|
187
|
-
.awsui_button-
|
|
187
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_pressed_18eso_vwec8_186 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
188
188
|
transform: rotate(-180deg);
|
|
189
189
|
}
|
|
190
|
-
.awsui_button-
|
|
190
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_disabled_18eso_vwec8_189:not(#\9) {
|
|
191
191
|
background-color: var(--color-background-input-disabled-ab59a3, #e9ebed);
|
|
192
192
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
193
193
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
194
194
|
color: var(--color-text-input-disabled-f8pjm5, #9ba7b6);
|
|
195
195
|
cursor: auto;
|
|
196
196
|
}
|
|
197
|
-
.awsui_button-
|
|
197
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_disabled_18eso_vwec8_189 > .awsui_arrow_18eso_vwec8_103:not(#\9) {
|
|
198
198
|
color: var(--color-text-button-inline-icon-disabled-mz5gmn, #9ba7b6);
|
|
199
199
|
}
|
|
200
|
-
.awsui_button-
|
|
200
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_disabled_18eso_vwec8_189.awsui_in-filtering-token_18eso_vwec8_199:not(#\9) {
|
|
201
201
|
border-color: var(--color-border-control-disabled-bv2kkn, #d1d5db);
|
|
202
202
|
}
|
|
203
|
-
.awsui_button-
|
|
203
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_disabled_18eso_vwec8_189 > .awsui_placeholder_18eso_vwec8_173:not(#\9) {
|
|
204
204
|
color: var(--color-text-input-placeholder-disabled-abhb0d, #9ba7b6);
|
|
205
205
|
}
|
|
206
|
-
.awsui_button-
|
|
206
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_read-only_18eso_vwec8_205:not(#\9) {
|
|
207
207
|
background-color: var(--color-background-input-default-igdh5e, #ffffff);
|
|
208
208
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
209
209
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-disabled-rx2aau, #e9ebed);
|
|
210
210
|
}
|
|
211
|
-
.awsui_button-
|
|
211
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):focus {
|
|
212
212
|
outline: none;
|
|
213
213
|
text-decoration: none;
|
|
214
214
|
}
|
|
215
|
-
body[data-awsui-focus-visible=true] .awsui_button-
|
|
215
|
+
body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199):focus {
|
|
216
216
|
outline: 2px dotted transparent;
|
|
217
217
|
border-block: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-focused-3d15sl, #033160);
|
|
218
218
|
border-inline: var(--border-field-width-09w7vk, 2px) solid var(--color-border-input-focused-3d15sl, #033160);
|
|
@@ -222,10 +222,10 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_syr88_103:not(#\
|
|
|
222
222
|
border-end-end-radius: var(--border-radius-input-plgbrq, 8px);
|
|
223
223
|
box-shadow: 0 0 0 var(--border-control-focus-ring-shadow-spread-0ctpjf, 0px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
224
224
|
}
|
|
225
|
-
.awsui_button-
|
|
225
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199):invalid {
|
|
226
226
|
box-shadow: none;
|
|
227
227
|
}
|
|
228
|
-
.awsui_button-
|
|
228
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_invalid_18eso_vwec8_227, .awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_invalid_18eso_vwec8_227:focus {
|
|
229
229
|
color: var(--color-text-status-error-wdvepn, #d91515);
|
|
230
230
|
border-color: var(--color-text-status-error-wdvepn, #d91515);
|
|
231
231
|
padding-inline-start: calc(
|
|
@@ -233,23 +233,34 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_syr88_103:not(#\
|
|
|
233
233
|
);
|
|
234
234
|
border-inline-start-width: var(--border-invalid-width-5ktjp2, 8px);
|
|
235
235
|
}
|
|
236
|
-
.awsui_button-
|
|
236
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_invalid_18eso_vwec8_227:focus, .awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_invalid_18eso_vwec8_227:focus:focus {
|
|
237
237
|
box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-fhmbjn, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
238
238
|
}
|
|
239
|
-
.awsui_button-
|
|
239
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_warning_18eso_vwec8_238, .awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_warning_18eso_vwec8_238:focus {
|
|
240
|
+
color: var(--color-text-status-warning-yik8vi, #8d6605);
|
|
241
|
+
border-color: var(--color-text-status-warning-yik8vi, #8d6605);
|
|
242
|
+
padding-inline-start: calc(
|
|
243
|
+
var(--space-field-horizontal-gg19kw, 12px) - (var(--border-invalid-width-5ktjp2, 8px) - var(--border-field-width-09w7vk, 2px))
|
|
244
|
+
);
|
|
245
|
+
border-inline-start-width: var(--border-invalid-width-5ktjp2, 8px);
|
|
246
|
+
}
|
|
247
|
+
.awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_warning_18eso_vwec8_238:focus, .awsui_button-trigger_18eso_vwec8_103:not(#\9):not(.awsui_in-filtering-token_18eso_vwec8_199).awsui_warning_18eso_vwec8_238:focus:focus {
|
|
248
|
+
box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-fhmbjn, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
249
|
+
}
|
|
250
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_in-filtering-token_18eso_vwec8_199:not(#\9) {
|
|
240
251
|
border-color: var(--color-border-item-selected-k00wlz, #0972d3);
|
|
241
252
|
border-start-end-radius: 0;
|
|
242
253
|
border-end-end-radius: 0;
|
|
243
254
|
block-size: 100%;
|
|
244
255
|
}
|
|
245
|
-
body[data-awsui-focus-visible=true] .awsui_button-
|
|
256
|
+
body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_vwec8_103.awsui_in-filtering-token_18eso_vwec8_199:not(#\9):focus {
|
|
246
257
|
position: relative;
|
|
247
258
|
}
|
|
248
|
-
body[data-awsui-focus-visible=true] .awsui_button-
|
|
259
|
+
body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_vwec8_103.awsui_in-filtering-token_18eso_vwec8_199:not(#\9):focus {
|
|
249
260
|
outline: 2px dotted transparent;
|
|
250
261
|
outline-offset: calc(var(--space-filtering-token-operation-select-focus-outline-gutter-0ailok, -5px) - 1px);
|
|
251
262
|
}
|
|
252
|
-
body[data-awsui-focus-visible=true] .awsui_button-
|
|
263
|
+
body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_vwec8_103.awsui_in-filtering-token_18eso_vwec8_199:not(#\9):focus::before {
|
|
253
264
|
content: " ";
|
|
254
265
|
display: block;
|
|
255
266
|
position: absolute;
|
|
@@ -263,6 +274,6 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_syr88_103.awsui_
|
|
|
263
274
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
|
|
264
275
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
265
276
|
}
|
|
266
|
-
.awsui_button-
|
|
277
|
+
.awsui_button-trigger_18eso_vwec8_103.awsui_inline-tokens_18eso_vwec8_276:not(#\9) {
|
|
267
278
|
padding-block: 0;
|
|
268
279
|
}
|
|
@@ -2,15 +2,16 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"button-trigger": "awsui_button-
|
|
6
|
-
"arrow": "
|
|
7
|
-
"has-caret": "awsui_has-
|
|
8
|
-
"placeholder": "
|
|
9
|
-
"pressed": "
|
|
10
|
-
"disabled": "
|
|
11
|
-
"in-filtering-token": "awsui_in-filtering-
|
|
12
|
-
"read-only": "awsui_read-
|
|
13
|
-
"invalid": "
|
|
14
|
-
"
|
|
5
|
+
"button-trigger": "awsui_button-trigger_18eso_vwec8_103",
|
|
6
|
+
"arrow": "awsui_arrow_18eso_vwec8_103",
|
|
7
|
+
"has-caret": "awsui_has-caret_18eso_vwec8_170",
|
|
8
|
+
"placeholder": "awsui_placeholder_18eso_vwec8_173",
|
|
9
|
+
"pressed": "awsui_pressed_18eso_vwec8_186",
|
|
10
|
+
"disabled": "awsui_disabled_18eso_vwec8_189",
|
|
11
|
+
"in-filtering-token": "awsui_in-filtering-token_18eso_vwec8_199",
|
|
12
|
+
"read-only": "awsui_read-only_18eso_vwec8_205",
|
|
13
|
+
"invalid": "awsui_invalid_18eso_vwec8_227",
|
|
14
|
+
"warning": "awsui_warning_18eso_vwec8_238",
|
|
15
|
+
"inline-tokens": "awsui_inline-tokens_18eso_vwec8_276"
|
|
15
16
|
};
|
|
16
17
|
|
|
@@ -9,5 +9,5 @@ interface ResponsiveTextProps {
|
|
|
9
9
|
declare const _default: React.MemoExoticComponent<typeof ResponsiveText>;
|
|
10
10
|
export default _default;
|
|
11
11
|
declare function ResponsiveText({ x, y, className, children, maxWidth }: ResponsiveTextProps): JSX.Element;
|
|
12
|
-
export declare function renderTextContent(textNode: SVGTextElement, text: string, maxWidth: number): void;
|
|
12
|
+
export declare function renderTextContent(textNode: SVGTextElement, text: string, maxWidth: number, isRtl: boolean): void;
|
|
13
13
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAIvD,UAAU,mBAAmB;IAC3B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB;;AAED,wBAAoC;AAEpC,iBAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,mBAAmB,eAcnF;AAED,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,QAWzG"}
|
|
@@ -2,19 +2,21 @@
|
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React, { memo, useEffect, useRef } from 'react';
|
|
4
4
|
import { getTextWidth } from './responsive-text-utils';
|
|
5
|
+
import { getIsRtl } from '../../direction';
|
|
5
6
|
export default memo(ResponsiveText);
|
|
6
7
|
function ResponsiveText({ x, y, className, children, maxWidth }) {
|
|
7
8
|
const textRef = useRef(null);
|
|
8
9
|
// Determine the visible width of the text and if necessary truncate it until it fits.
|
|
9
10
|
useEffect(() => {
|
|
10
|
-
|
|
11
|
+
const isRtl = getIsRtl(textRef.current);
|
|
12
|
+
renderTextContent(textRef.current, children, maxWidth, isRtl);
|
|
11
13
|
}, [maxWidth, children]);
|
|
12
14
|
return (React.createElement("text", { ref: textRef, x: x, y: y, style: { textAnchor: 'end' }, className: className }, children));
|
|
13
15
|
}
|
|
14
|
-
export function renderTextContent(textNode, text, maxWidth) {
|
|
16
|
+
export function renderTextContent(textNode, text, maxWidth, isRtl) {
|
|
15
17
|
let visibleLength = text.length;
|
|
16
18
|
while (visibleLength >= 0) {
|
|
17
|
-
textNode.textContent = truncateText(text, visibleLength);
|
|
19
|
+
textNode.textContent = truncateText(text, visibleLength, isRtl);
|
|
18
20
|
if (getTextWidth(textNode) <= maxWidth) {
|
|
19
21
|
return;
|
|
20
22
|
}
|
|
@@ -23,10 +25,13 @@ export function renderTextContent(textNode, text, maxWidth) {
|
|
|
23
25
|
}
|
|
24
26
|
}
|
|
25
27
|
}
|
|
26
|
-
function truncateText(text, maxLength) {
|
|
28
|
+
function truncateText(text, maxLength, isRtl) {
|
|
27
29
|
if (text.length === maxLength) {
|
|
28
30
|
return text;
|
|
29
31
|
}
|
|
32
|
+
if (isRtl) {
|
|
33
|
+
return text.slice(text.length - maxLength) + '…';
|
|
34
|
+
}
|
|
30
35
|
return text.slice(0, maxLength) + '…';
|
|
31
36
|
}
|
|
32
37
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAU3C,eAAe,IAAI,CAAC,cAAc,CAAC,CAAC;AAEpC,SAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAuB;IAClF,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,sFAAsF;IACtF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAQ,CAAC,CAAC;QACzC,iBAAiB,CAAC,OAAO,CAAC,OAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;IACjE,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEzB,OAAO,CACL,8BAAM,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,IAC/E,QAAQ,CACJ,CACR,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,QAAwB,EAAE,IAAY,EAAE,QAAgB,EAAE,KAAc;IACxG,IAAI,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;IAChC,OAAO,aAAa,IAAI,CAAC,EAAE;QACzB,QAAQ,CAAC,WAAW,GAAG,YAAY,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC;QAEhE,IAAI,YAAY,CAAC,QAAQ,CAAC,IAAI,QAAQ,EAAE;YACtC,OAAO;SACR;aAAM;YACL,aAAa,EAAE,CAAC;SACjB;KACF;AACH,CAAC;AAED,SAAS,YAAY,CAAC,IAAY,EAAE,SAAiB,EAAE,KAAc;IACnE,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;QAC7B,OAAO,IAAI,CAAC;KACb;IACD,IAAI,KAAK,EAAE;QACT,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,GAAG,CAAC;KAClD;IACD,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC,GAAG,GAAG,CAAC;AACxC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useEffect, useRef } from 'react';\nimport { getTextWidth } from './responsive-text-utils';\nimport { getIsRtl } from '../../direction';\n\ninterface ResponsiveTextProps {\n x: number;\n y: number;\n className?: string;\n children: string;\n maxWidth: number;\n}\n\nexport default memo(ResponsiveText);\n\nfunction ResponsiveText({ x, y, className, children, maxWidth }: ResponsiveTextProps) {\n const textRef = useRef<SVGTextElement>(null);\n\n // Determine the visible width of the text and if necessary truncate it until it fits.\n useEffect(() => {\n const isRtl = getIsRtl(textRef.current!);\n renderTextContent(textRef.current!, children, maxWidth, isRtl);\n }, [maxWidth, children]);\n\n return (\n <text ref={textRef} x={x} y={y} style={{ textAnchor: 'end' }} className={className}>\n {children}\n </text>\n );\n}\n\nexport function renderTextContent(textNode: SVGTextElement, text: string, maxWidth: number, isRtl: boolean) {\n let visibleLength = text.length;\n while (visibleLength >= 0) {\n textNode.textContent = truncateText(text, visibleLength, isRtl);\n\n if (getTextWidth(textNode) <= maxWidth) {\n return;\n } else {\n visibleLength--;\n }\n }\n}\n\nfunction truncateText(text: string, maxLength: number, isRtl: boolean) {\n if (text.length === maxLength) {\n return text;\n }\n if (isRtl) {\n return text.slice(text.length - maxLength) + '…';\n }\n return text.slice(0, maxLength) + '…';\n}\n"]}
|
|
@@ -30,7 +30,7 @@ export interface FormFieldControlProps {
|
|
|
30
30
|
*/
|
|
31
31
|
ariaDescribedby?: string;
|
|
32
32
|
}
|
|
33
|
-
export interface
|
|
33
|
+
export interface FormFieldCommonValidationControlProps extends FormFieldControlProps {
|
|
34
34
|
/**
|
|
35
35
|
* Overrides the invalidation state. Usually the invalid state
|
|
36
36
|
* comes from the parent `FormField`component,
|
|
@@ -40,6 +40,19 @@ export interface FormFieldValidationControlProps extends FormFieldControlProps {
|
|
|
40
40
|
*/
|
|
41
41
|
invalid?: boolean;
|
|
42
42
|
}
|
|
43
|
+
export interface FormFieldValidationControlProps extends FormFieldCommonValidationControlProps {
|
|
44
|
+
/**
|
|
45
|
+
* Overrides the warning state. Usually the warning state
|
|
46
|
+
* comes from the parent `FormField`component,
|
|
47
|
+
* however sometimes you need to override its
|
|
48
|
+
* state when you have more than one input within a
|
|
49
|
+
* single form field.
|
|
50
|
+
* When you use it, provide additional context with
|
|
51
|
+
* information on the input state, and associate it
|
|
52
|
+
* with the input using `ariaDescribedby`.
|
|
53
|
+
*/
|
|
54
|
+
warning?: boolean;
|
|
55
|
+
}
|
|
43
56
|
export declare const FormFieldContext: import("react").Context<FormFieldValidationControlProps>;
|
|
44
57
|
export declare function useFormFieldContext(props: FormFieldValidationControlProps): FormFieldValidationControlProps;
|
|
45
58
|
//# sourceMappingURL=form-field-context.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-field-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/form-field-context.ts"],"names":[],"mappings":";AAIA,MAAM,WAAW,qBAAqB;IACpC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;;;;OASG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW
|
|
1
|
+
{"version":3,"file":"form-field-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/form-field-context.ts"],"names":[],"mappings":";AAIA,MAAM,WAAW,qBAAqB;IACpC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;;;;OASG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,qCAAsC,SAAQ,qBAAqB;IAClF;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,+BAAgC,SAAQ,qCAAqC;IAC5F;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,gBAAgB,0DAAqD,CAAC;AAUnF,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,+BAA+B,mCAGzE"}
|
|
@@ -11,6 +11,6 @@ function applyDefault(fields, defaults, keys) {
|
|
|
11
11
|
}
|
|
12
12
|
export function useFormFieldContext(props) {
|
|
13
13
|
const context = useContext(FormFieldContext);
|
|
14
|
-
return applyDefault(props, context, ['invalid', 'controlId', 'ariaLabelledby', 'ariaDescribedby']);
|
|
14
|
+
return applyDefault(props, context, ['invalid', 'warning', 'controlId', 'ariaLabelledby', 'ariaDescribedby']);
|
|
15
15
|
}
|
|
16
16
|
//# sourceMappingURL=form-field-context.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-field-context.js","sourceRoot":"","sources":["../../../../src/internal/context/form-field-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"form-field-context.js","sourceRoot":"","sources":["../../../../src/internal/context/form-field-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AA6DlD,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAkC,EAAE,CAAC,CAAC;AAEnF,SAAS,YAAY,CAAI,MAAS,EAAE,QAAW,EAAE,IAAiB;IAChE,MAAM,MAAM,GAAM,EAAE,CAAC;IACrB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;QACjB,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;IACxE,CAAC,CAAC,CAAC;IACH,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAC,KAAsC;IACxE,MAAM,OAAO,GAAG,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAC7C,OAAO,YAAY,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,gBAAgB,EAAE,iBAAiB,CAAC,CAAC,CAAC;AAChH,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useContext, createContext } from 'react';\n\nexport interface FormFieldControlProps {\n /**\n * Specifies the ID of the native form element. You can use it to relate\n * a label element's `for` attribute to this control.\n *\n * It defaults to an automatically generated ID that\n * is provided by its parent form field component.\n */\n controlId?: string;\n\n /**\n * Adds `aria-labelledby` to the component. If you're using this component within a form field,\n * don't set this property because the form field component automatically sets it.\n *\n * Use this property if the component isn't surrounded by a form field, or you want to override the value\n * automatically set by the form field (for example, if you have two components within a single form field).\n *\n * To use it correctly, define an ID for the element you want to use as label and set the property to that ID.\n */\n ariaLabelledby?: string;\n\n /**\n * Adds `aria-describedby` to the component. If you're using this component within a form field,\n * don't set this property because the form field component automatically sets it.\n *\n * Use this property if the component isn't surrounded by a form field, or you want to override the value\n * automatically set by the form field (for example, if you have two components within a single form field).\n *\n * To use it correctly, define an ID for each element that you want to use as a description\n * and set the property to a string of each ID separated by spaces (for example, `\"id1 id2 id3\"`).\n */\n ariaDescribedby?: string;\n}\n\nexport interface FormFieldCommonValidationControlProps extends FormFieldControlProps {\n /**\n * Overrides the invalidation state. Usually the invalid state\n * comes from the parent `FormField`component,\n * however sometimes you need to override its\n * state when you have more than one input within a\n * single form field.\n */\n invalid?: boolean;\n}\n\nexport interface FormFieldValidationControlProps extends FormFieldCommonValidationControlProps {\n /**\n * Overrides the warning state. Usually the warning state\n * comes from the parent `FormField`component,\n * however sometimes you need to override its\n * state when you have more than one input within a\n * single form field.\n * When you use it, provide additional context with\n * information on the input state, and associate it\n * with the input using `ariaDescribedby`.\n */\n warning?: boolean;\n}\n\nexport const FormFieldContext = createContext<FormFieldValidationControlProps>({});\n\nfunction applyDefault<T>(fields: T, defaults: T, keys: (keyof T)[]) {\n const result = <T>{};\n keys.forEach(key => {\n result[key] = fields[key] === undefined ? defaults[key] : fields[key];\n });\n return result;\n}\n\nexport function useFormFieldContext(props: FormFieldValidationControlProps) {\n const context = useContext(FormFieldContext);\n return applyDefault(props, context, ['invalid', 'warning', 'controlId', 'ariaLabelledby', 'ariaDescribedby']);\n}\n"]}
|
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
package/link/internal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/link/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAQlD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAwBlF,QAAA,MAAM,YAAY;cAHJ,SAAS,CAAC,SAAS,CAAC,GAAG,gBAAgB,GAAG,MAAM,GAAG,UAAU;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/link/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAQlD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAwBlF,QAAA,MAAM,YAAY;cAHJ,SAAS,CAAC,SAAS,CAAC,GAAG,gBAAgB,GAAG,MAAM,GAAG,UAAU;uCAgM1E,CAAC;AAqBF,eAAe,YAAY,CAAC"}
|
package/link/internal.js
CHANGED
|
@@ -36,17 +36,20 @@ const InternalLink = React.forwardRef((_a, ref) => {
|
|
|
36
36
|
const linkId = useUniqueId('link-self');
|
|
37
37
|
const infoId = useUniqueId('link-info');
|
|
38
38
|
const infoLinkLabelFromContext = useContext(InfoLinkLabelContext);
|
|
39
|
-
const { funnelInteractionId } = useFunnel();
|
|
40
|
-
const { stepNumber, stepNameSelector } = useFunnelStep();
|
|
41
|
-
const { subStepSelector, subStepNameSelector } = useFunnelSubStep();
|
|
39
|
+
const { funnelIdentifier, funnelInteractionId } = useFunnel();
|
|
40
|
+
const { stepIdentifier, stepNumber, stepNameSelector } = useFunnelStep();
|
|
41
|
+
const { subStepIdentifier, subStepSelector, subStepNameSelector } = useFunnelSubStep();
|
|
42
42
|
const fireFunnelEvent = (funnelInteractionId) => {
|
|
43
43
|
if (variant === 'info') {
|
|
44
44
|
const stepName = getNameFromSelector(stepNameSelector);
|
|
45
45
|
const subStepName = getNameFromSelector(subStepNameSelector);
|
|
46
46
|
FunnelMetrics.helpPanelInteracted({
|
|
47
|
+
funnelIdentifier,
|
|
47
48
|
funnelInteractionId,
|
|
49
|
+
stepIdentifier,
|
|
48
50
|
stepNumber,
|
|
49
51
|
stepName,
|
|
52
|
+
subStepIdentifier,
|
|
50
53
|
stepNameSelector,
|
|
51
54
|
subStepSelector,
|
|
52
55
|
subStepName,
|
|
@@ -59,10 +62,13 @@ const InternalLink = React.forwardRef((_a, ref) => {
|
|
|
59
62
|
const stepName = getNameFromSelector(stepNameSelector);
|
|
60
63
|
const subStepName = getNameFromSelector(subStepNameSelector);
|
|
61
64
|
FunnelMetrics.externalLinkInteracted({
|
|
65
|
+
funnelIdentifier,
|
|
62
66
|
funnelInteractionId,
|
|
67
|
+
stepIdentifier,
|
|
63
68
|
stepNumber,
|
|
64
69
|
stepName,
|
|
65
70
|
stepNameSelector,
|
|
71
|
+
subStepIdentifier,
|
|
66
72
|
subStepSelector,
|
|
67
73
|
subStepName,
|
|
68
74
|
subStepNameSelector,
|
package/link/internal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/link/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, { useContext, useRef } from 'react';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport styles from './styles.css.js';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, isPlainLeftClick } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { KeyCode } from '../internal/keycode';\nimport { LinkProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { useInternalI18n } from '../i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n DATA_ATTR_FUNNEL_VALUE,\n getFunnelValueSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';\n\ntype InternalLinkProps = InternalBaseComponentProps<HTMLAnchorElement> &\n Omit<LinkProps, 'variant'> & {\n variant?: LinkProps['variant'] | 'top-navigation' | 'link' | 'recovery';\n };\n\nconst InternalLink = React.forwardRef(\n (\n {\n variant: providedVariant,\n fontSize = 'body-m',\n color = 'normal',\n external = false,\n target,\n href,\n rel,\n ariaLabel,\n externalIconAriaLabel,\n onFollow,\n children,\n __internalRootRef = null,\n ...props\n }: InternalLinkProps,\n ref: React.Ref<LinkProps.Ref>\n ) => {\n checkSafeUrl('Link', href);\n const isButton = !href;\n const { defaultVariant } = useContext(LinkDefaultVariantContext);\n const variant = providedVariant || defaultVariant;\n const specialStyles = ['top-navigation', 'link', 'recovery'];\n const hasSpecialStyle = specialStyles.indexOf(variant) > -1;\n\n const i18n = useInternalI18n('link');\n const baseProps = getBaseProps(props);\n const anchorTarget = target ?? (external ? '_blank' : undefined);\n const anchorRel = rel ?? (anchorTarget === '_blank' ? 'noopener noreferrer' : undefined);\n const uniqueId = useUniqueId('link');\n const linkId = useUniqueId('link-self');\n const infoId = useUniqueId('link-info');\n\n const infoLinkLabelFromContext = useContext(InfoLinkLabelContext);\n\n const { funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const fireFunnelEvent = (funnelInteractionId: string) => {\n if (variant === 'info') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n FunnelMetrics.helpPanelInteracted({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n } else if (external) {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n FunnelMetrics.externalLinkInteracted({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const fireFollowEvent = (event: React.SyntheticEvent) => {\n if (funnelInteractionId) {\n fireFunnelEvent(funnelInteractionId);\n }\n\n fireCancelableEvent(onFollow, { href, external, target: anchorTarget }, event);\n };\n\n const handleLinkClick = (event: React.MouseEvent) => {\n if (isPlainLeftClick(event)) {\n fireFollowEvent(event);\n }\n };\n\n const handleButtonClick = (event: React.MouseEvent) => {\n fireFollowEvent(event);\n };\n\n const handleButtonKeyDown = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.space || event.keyCode === KeyCode.enter) {\n event.preventDefault();\n fireFollowEvent(event);\n }\n };\n\n const linkRef = useRef<HTMLElement>(null);\n const isVisualRefresh = useVisualRefresh();\n useForwardFocus(ref, linkRef);\n\n // Visual refresh should only add styles to buttons that don't already have unique styles (e.g. primary/secondary variants)\n const applyButtonStyles = isButton && isVisualRefresh && !hasSpecialStyle;\n\n const sharedProps = {\n id: linkId,\n ...baseProps,\n // https://github.com/microsoft/TypeScript/issues/36659\n ref: useMergeRefs(linkRef, __internalRootRef),\n className: clsx(\n styles.link,\n baseProps.className,\n applyButtonStyles ? styles.button : null,\n styles[getVariantStyle(variant)],\n styles[getFontSizeStyle(variant, fontSize)],\n styles[getColorStyle(variant, color)]\n ),\n 'aria-label': ariaLabel,\n 'aria-labelledby': '',\n [DATA_ATTR_FUNNEL_VALUE]: uniqueId,\n };\n\n if (variant === 'info' && infoLinkLabelFromContext && !ariaLabel) {\n sharedProps['aria-labelledby'] = `${sharedProps.id} ${infoId} ${infoLinkLabelFromContext}`;\n }\n\n const renderedExternalIconAriaLabel = i18n('externalIconAriaLabel', externalIconAriaLabel);\n const content = (\n <>\n {children}\n {external && (\n <span className={styles['icon-wrapper']}>\n \n <span\n className={styles.icon}\n aria-label={renderedExternalIconAriaLabel}\n role={renderedExternalIconAriaLabel ? 'img' : undefined}\n >\n <InternalIcon name=\"external\" size=\"inherit\" />\n </span>\n </span>\n )}\n {variant === 'info' && (\n <span hidden={true} id={infoId}>\n :\n </span>\n )}\n </>\n );\n\n const { tabIndex } = useSingleTabStopNavigation(linkRef, { tabIndex: isButton ? 0 : undefined });\n\n if (isButton) {\n return (\n <a\n {...sharedProps}\n role=\"button\"\n tabIndex={tabIndex}\n onKeyDown={handleButtonKeyDown}\n onClick={handleButtonClick}\n >\n {content}\n </a>\n );\n }\n\n return (\n // we dynamically set proper rel in the code above\n // eslint-disable-next-line react/jsx-no-target-blank\n <a\n {...sharedProps}\n tabIndex={tabIndex}\n target={anchorTarget}\n rel={anchorRel}\n href={href}\n onClick={handleLinkClick}\n >\n {content}\n </a>\n );\n }\n);\n\nfunction getVariantStyle(variant: Exclude<InternalLinkProps['variant'], undefined>) {\n return `variant-${variant.replace(/^awsui-/, '')}`;\n}\n\nfunction getFontSizeStyle(variant: InternalLinkProps['variant'], fontSize: InternalLinkProps['fontSize']) {\n switch (variant) {\n case 'info':\n return 'font-size-body-s';\n case 'awsui-value-large':\n return 'font-size-display-l';\n default:\n return `font-size-${fontSize}`;\n }\n}\n\nfunction getColorStyle(variant: InternalLinkProps['variant'], color: InternalLinkProps['color']) {\n return `color-${variant === 'info' ? 'normal' : color}`;\n}\n\nexport default InternalLink;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/link/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, { useContext, useRef } from 'react';\nimport clsx from 'clsx';\nimport InternalIcon from '../icon/internal';\nimport styles from './styles.css.js';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent, isPlainLeftClick } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { KeyCode } from '../internal/keycode';\nimport { LinkProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { useInternalI18n } from '../i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n DATA_ATTR_FUNNEL_VALUE,\n getFunnelValueSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';\n\ntype InternalLinkProps = InternalBaseComponentProps<HTMLAnchorElement> &\n Omit<LinkProps, 'variant'> & {\n variant?: LinkProps['variant'] | 'top-navigation' | 'link' | 'recovery';\n };\n\nconst InternalLink = React.forwardRef(\n (\n {\n variant: providedVariant,\n fontSize = 'body-m',\n color = 'normal',\n external = false,\n target,\n href,\n rel,\n ariaLabel,\n externalIconAriaLabel,\n onFollow,\n children,\n __internalRootRef = null,\n ...props\n }: InternalLinkProps,\n ref: React.Ref<LinkProps.Ref>\n ) => {\n checkSafeUrl('Link', href);\n const isButton = !href;\n const { defaultVariant } = useContext(LinkDefaultVariantContext);\n const variant = providedVariant || defaultVariant;\n const specialStyles = ['top-navigation', 'link', 'recovery'];\n const hasSpecialStyle = specialStyles.indexOf(variant) > -1;\n\n const i18n = useInternalI18n('link');\n const baseProps = getBaseProps(props);\n const anchorTarget = target ?? (external ? '_blank' : undefined);\n const anchorRel = rel ?? (anchorTarget === '_blank' ? 'noopener noreferrer' : undefined);\n const uniqueId = useUniqueId('link');\n const linkId = useUniqueId('link-self');\n const infoId = useUniqueId('link-info');\n\n const infoLinkLabelFromContext = useContext(InfoLinkLabelContext);\n\n const { funnelIdentifier, funnelInteractionId } = useFunnel();\n const { stepIdentifier, stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepIdentifier, subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const fireFunnelEvent = (funnelInteractionId: string) => {\n if (variant === 'info') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n FunnelMetrics.helpPanelInteracted({\n funnelIdentifier,\n funnelInteractionId,\n stepIdentifier,\n stepNumber,\n stepName,\n subStepIdentifier,\n stepNameSelector,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n } else if (external) {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n FunnelMetrics.externalLinkInteracted({\n funnelIdentifier,\n funnelInteractionId,\n stepIdentifier,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepIdentifier,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const fireFollowEvent = (event: React.SyntheticEvent) => {\n if (funnelInteractionId) {\n fireFunnelEvent(funnelInteractionId);\n }\n\n fireCancelableEvent(onFollow, { href, external, target: anchorTarget }, event);\n };\n\n const handleLinkClick = (event: React.MouseEvent) => {\n if (isPlainLeftClick(event)) {\n fireFollowEvent(event);\n }\n };\n\n const handleButtonClick = (event: React.MouseEvent) => {\n fireFollowEvent(event);\n };\n\n const handleButtonKeyDown = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.space || event.keyCode === KeyCode.enter) {\n event.preventDefault();\n fireFollowEvent(event);\n }\n };\n\n const linkRef = useRef<HTMLElement>(null);\n const isVisualRefresh = useVisualRefresh();\n useForwardFocus(ref, linkRef);\n\n // Visual refresh should only add styles to buttons that don't already have unique styles (e.g. primary/secondary variants)\n const applyButtonStyles = isButton && isVisualRefresh && !hasSpecialStyle;\n\n const sharedProps = {\n id: linkId,\n ...baseProps,\n // https://github.com/microsoft/TypeScript/issues/36659\n ref: useMergeRefs(linkRef, __internalRootRef),\n className: clsx(\n styles.link,\n baseProps.className,\n applyButtonStyles ? styles.button : null,\n styles[getVariantStyle(variant)],\n styles[getFontSizeStyle(variant, fontSize)],\n styles[getColorStyle(variant, color)]\n ),\n 'aria-label': ariaLabel,\n 'aria-labelledby': '',\n [DATA_ATTR_FUNNEL_VALUE]: uniqueId,\n };\n\n if (variant === 'info' && infoLinkLabelFromContext && !ariaLabel) {\n sharedProps['aria-labelledby'] = `${sharedProps.id} ${infoId} ${infoLinkLabelFromContext}`;\n }\n\n const renderedExternalIconAriaLabel = i18n('externalIconAriaLabel', externalIconAriaLabel);\n const content = (\n <>\n {children}\n {external && (\n <span className={styles['icon-wrapper']}>\n \n <span\n className={styles.icon}\n aria-label={renderedExternalIconAriaLabel}\n role={renderedExternalIconAriaLabel ? 'img' : undefined}\n >\n <InternalIcon name=\"external\" size=\"inherit\" />\n </span>\n </span>\n )}\n {variant === 'info' && (\n <span hidden={true} id={infoId}>\n :\n </span>\n )}\n </>\n );\n\n const { tabIndex } = useSingleTabStopNavigation(linkRef, { tabIndex: isButton ? 0 : undefined });\n\n if (isButton) {\n return (\n <a\n {...sharedProps}\n role=\"button\"\n tabIndex={tabIndex}\n onKeyDown={handleButtonKeyDown}\n onClick={handleButtonClick}\n >\n {content}\n </a>\n );\n }\n\n return (\n // we dynamically set proper rel in the code above\n // eslint-disable-next-line react/jsx-no-target-blank\n <a\n {...sharedProps}\n tabIndex={tabIndex}\n target={anchorTarget}\n rel={anchorRel}\n href={href}\n onClick={handleLinkClick}\n >\n {content}\n </a>\n );\n }\n);\n\nfunction getVariantStyle(variant: Exclude<InternalLinkProps['variant'], undefined>) {\n return `variant-${variant.replace(/^awsui-/, '')}`;\n}\n\nfunction getFontSizeStyle(variant: InternalLinkProps['variant'], fontSize: InternalLinkProps['fontSize']) {\n switch (variant) {\n case 'info':\n return 'font-size-body-s';\n case 'awsui-value-large':\n return 'font-size-display-l';\n default:\n return `font-size-${fontSize}`;\n }\n}\n\nfunction getColorStyle(variant: InternalLinkProps['variant'], color: InternalLinkProps['color']) {\n return `color-${variant === 'info' ? 'normal' : color}`;\n}\n\nexport default InternalLink;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body-scroll.d.ts","sourceRoot":"","sources":["../../../src/modal/body-scroll.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"body-scroll.d.ts","sourceRoot":"","sources":["../../../src/modal/body-scroll.ts"],"names":[],"mappings":"AAaA,wBAAgB,oBAAoB,SAGnC;AAED,wBAAgB,mBAAmB,SAGlC"}
|
package/modal/body-scroll.js
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import styles from './styles.css.js';
|
|
4
4
|
import { browserScrollbarSize } from '../internal/utils/browser-scrollbar-size';
|
|
5
|
+
// Read this before making changes to the code below.
|
|
6
|
+
//
|
|
7
|
+
// When a modal is used from an iframe the body scrolling utils take no effect because they need to be applied to another document.
|
|
8
|
+
// The customers replicate this behavior by running the same code on the correct document instance, see AWSUI-41915.
|
|
9
|
+
// Hence, we should avoid making changes to the component that break the body scrolling logic in its current form.
|
|
5
10
|
let initialBodyPaddingRightStyle = undefined;
|
|
6
11
|
export function disableBodyScrolling() {
|
|
7
12
|
setBodyScrollbarPadding();
|
package/modal/body-scroll.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body-scroll.js","sourceRoot":"","sources":["../../../src/modal/body-scroll.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAEhF,IAAI,4BAA4B,GAAuB,SAAS,CAAC;AAEjE,MAAM,UAAU,oBAAoB;IAClC,uBAAuB,EAAE,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;AACpD,CAAC;AAED,MAAM,UAAU,mBAAmB;IACjC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;IACrD,2BAA2B,EAAE,CAAC;AAChC,CAAC;AAED,SAAS,uBAAuB;IAC9B,IAAI,gBAAgB,EAAE,EAAE;QACtB,4BAA4B,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAChE,MAAM,uBAAuB,GAAG,8BAA8B,EAAE,CAAC;QACjE,MAAM,cAAc,GAAG,oBAAoB,EAAE,CAAC,KAAK,CAAC;QACpD,MAAM,mBAAmB,GAAG,uBAAuB,GAAG,cAAc,CAAC;QACrE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,mBAAmB,GAAG,IAAI,CAAC;KAC/D;AACH,CAAC;AAED,SAAS,8BAA8B;IACrC,OAAO,QAAQ,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAC3E,CAAC;AAED,SAAS,2BAA2B;IAClC,IAAI,4BAA4B,EAAE;QAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,eAAe,EAAE,4BAA4B,CAAC,CAAC;KAChF;SAAM;QACL,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;KACrD;IACD,4BAA4B,GAAG,SAAS,CAAC;AAC3C,CAAC;AAED,SAAS,gBAAgB;IACvB,4FAA4F;IAC5F,gGAAgG;IAChG,YAAY;IACZ,OAAO,QAAQ,CAAC,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AACvD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport styles from './styles.css.js';\nimport { browserScrollbarSize } from '../internal/utils/browser-scrollbar-size';\n\nlet initialBodyPaddingRightStyle: string | undefined = undefined;\n\nexport function disableBodyScrolling() {\n setBodyScrollbarPadding();\n document.body.classList.add(styles['modal-open']);\n}\n\nexport function enableBodyScrolling() {\n document.body.classList.remove(styles['modal-open']);\n restoreBodyScrollbarPadding();\n}\n\nfunction setBodyScrollbarPadding() {\n if (bodyHasScrollbar()) {\n initialBodyPaddingRightStyle = document.body.style.paddingRight;\n const initialBodyPaddingRight = computedBodyPaddingRightPixels();\n const scrollbarWidth = browserScrollbarSize().width;\n const newBodyPaddingRight = initialBodyPaddingRight + scrollbarWidth;\n document.body.style.paddingRight = newBodyPaddingRight + 'px';\n }\n}\n\nfunction computedBodyPaddingRightPixels() {\n return parseInt(window.getComputedStyle(document.body).paddingRight, 10);\n}\n\nfunction restoreBodyScrollbarPadding() {\n if (initialBodyPaddingRightStyle) {\n document.body.style.setProperty('padding-right', initialBodyPaddingRightStyle);\n } else {\n document.body.style.removeProperty('padding-right');\n }\n initialBodyPaddingRightStyle = undefined;\n}\n\nfunction bodyHasScrollbar() {\n // Unfortunately this difference doesn't appear to match the scrollbar width during testing,\n // otherwise we could remove browserScrollbarSize(). Bootstrap also doesn't use this difference\n // directly.\n return document.body.clientWidth < window.innerWidth;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"body-scroll.js","sourceRoot":"","sources":["../../../src/modal/body-scroll.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAEhF,qDAAqD;AACrD,EAAE;AACF,mIAAmI;AACnI,oHAAoH;AACpH,kHAAkH;AAElH,IAAI,4BAA4B,GAAuB,SAAS,CAAC;AAEjE,MAAM,UAAU,oBAAoB;IAClC,uBAAuB,EAAE,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;AACpD,CAAC;AAED,MAAM,UAAU,mBAAmB;IACjC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC;IACrD,2BAA2B,EAAE,CAAC;AAChC,CAAC;AAED,SAAS,uBAAuB;IAC9B,IAAI,gBAAgB,EAAE,EAAE;QACtB,4BAA4B,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAChE,MAAM,uBAAuB,GAAG,8BAA8B,EAAE,CAAC;QACjE,MAAM,cAAc,GAAG,oBAAoB,EAAE,CAAC,KAAK,CAAC;QACpD,MAAM,mBAAmB,GAAG,uBAAuB,GAAG,cAAc,CAAC;QACrE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,mBAAmB,GAAG,IAAI,CAAC;KAC/D;AACH,CAAC;AAED,SAAS,8BAA8B;IACrC,OAAO,QAAQ,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAC3E,CAAC;AAED,SAAS,2BAA2B;IAClC,IAAI,4BAA4B,EAAE;QAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,eAAe,EAAE,4BAA4B,CAAC,CAAC;KAChF;SAAM;QACL,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;KACrD;IACD,4BAA4B,GAAG,SAAS,CAAC;AAC3C,CAAC;AAED,SAAS,gBAAgB;IACvB,4FAA4F;IAC5F,gGAAgG;IAChG,YAAY;IACZ,OAAO,QAAQ,CAAC,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AACvD,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport styles from './styles.css.js';\nimport { browserScrollbarSize } from '../internal/utils/browser-scrollbar-size';\n\n// Read this before making changes to the code below.\n//\n// When a modal is used from an iframe the body scrolling utils take no effect because they need to be applied to another document.\n// The customers replicate this behavior by running the same code on the correct document instance, see AWSUI-41915.\n// Hence, we should avoid making changes to the component that break the body scrolling logic in its current form.\n\nlet initialBodyPaddingRightStyle: string | undefined = undefined;\n\nexport function disableBodyScrolling() {\n setBodyScrollbarPadding();\n document.body.classList.add(styles['modal-open']);\n}\n\nexport function enableBodyScrolling() {\n document.body.classList.remove(styles['modal-open']);\n restoreBodyScrollbarPadding();\n}\n\nfunction setBodyScrollbarPadding() {\n if (bodyHasScrollbar()) {\n initialBodyPaddingRightStyle = document.body.style.paddingRight;\n const initialBodyPaddingRight = computedBodyPaddingRightPixels();\n const scrollbarWidth = browserScrollbarSize().width;\n const newBodyPaddingRight = initialBodyPaddingRight + scrollbarWidth;\n document.body.style.paddingRight = newBodyPaddingRight + 'px';\n }\n}\n\nfunction computedBodyPaddingRightPixels() {\n return parseInt(window.getComputedStyle(document.body).paddingRight, 10);\n}\n\nfunction restoreBodyScrollbarPadding() {\n if (initialBodyPaddingRightStyle) {\n document.body.style.setProperty('padding-right', initialBodyPaddingRightStyle);\n } else {\n document.body.style.removeProperty('padding-right');\n }\n initialBodyPaddingRightStyle = undefined;\n}\n\nfunction bodyHasScrollbar() {\n // Unfortunately this difference doesn't appear to match the scrollbar width during testing,\n // otherwise we could remove browserScrollbarSize(). Bootstrap also doesn't use this difference\n // directly.\n return document.body.clientWidth < window.innerWidth;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"responsive-text.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/responsive-text.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"responsive-text.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/responsive-text.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAIvD,UAAU,mBAAmB;IAC3B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,mBAAmB,EAAE,IAAI,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC7D;;AAED,wBAAoC;AAEpC,iBAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,mBAAmB,EAAE,EAAE,mBAAmB,eAuCzG"}
|
|
@@ -2,17 +2,21 @@
|
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React, { memo, useEffect, useRef } from 'react';
|
|
4
4
|
import { renderTextContent } from '../internal/components/responsive-text';
|
|
5
|
+
import { getIsRtl } from '../internal/direction';
|
|
5
6
|
export default memo(ResponsiveText);
|
|
6
7
|
function ResponsiveText({ x, y, rightSide, className, children, containerBoundaries }) {
|
|
7
8
|
const actualRef = useRef(null);
|
|
8
9
|
const virtualRef = useRef(null);
|
|
10
|
+
const isRtl = actualRef.current ? getIsRtl(actualRef.current) : false;
|
|
11
|
+
rightSide = !isRtl ? rightSide : !rightSide;
|
|
9
12
|
// Determine the visible width of the text and if necessary truncate it until it fits.
|
|
10
13
|
useEffect(() => {
|
|
11
14
|
// The debouncing is necessary for visual smoothness.
|
|
12
15
|
const timeoutId = setTimeout(() => {
|
|
16
|
+
const isRtl = getIsRtl(virtualRef.current);
|
|
13
17
|
const groupRect = virtualRef.current.getBoundingClientRect();
|
|
14
18
|
const visibleWidth = containerBoundaries ? getVisibleWidth(groupRect, containerBoundaries) : 0;
|
|
15
|
-
renderTextContent(actualRef.current, children, visibleWidth);
|
|
19
|
+
renderTextContent(actualRef.current, children, visibleWidth, isRtl);
|
|
16
20
|
}, 25);
|
|
17
21
|
return () => clearTimeout(timeoutId);
|
|
18
22
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"responsive-text.js","sourceRoot":"","sources":["../../../src/pie-chart/responsive-text.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;
|
|
1
|
+
{"version":3,"file":"responsive-text.js","sourceRoot":"","sources":["../../../src/pie-chart/responsive-text.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAWjD,eAAe,IAAI,CAAC,cAAc,CAAC,CAAC;AAEpC,SAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,mBAAmB,EAAuB;IACxG,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IACtE,SAAS,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE5C,sFAAsF;IACtF,SAAS,CAAC,GAAG,EAAE;QACb,qDAAqD;QACrD,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,MAAM,KAAK,GAAG,QAAQ,CAAC,UAAU,CAAC,OAAQ,CAAC,CAAC;YAC5C,MAAM,SAAS,GAAG,UAAU,CAAC,OAAQ,CAAC,qBAAqB,EAAE,CAAC;YAC9D,MAAM,YAAY,GAAG,mBAAmB,CAAC,CAAC,CAAC,eAAe,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC/F,iBAAiB,CAAC,SAAS,CAAC,OAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;QACvE,CAAC,EAAE,EAAE,CAAC,CAAC;QACP,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,OAAO,CACL;QAEE,8BACE,GAAG,EAAE,UAAU,EACf,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,iBAC5D,MAAM,EAClB,SAAS,EAAE,SAAS,IAEnB,QAAQ,CACJ;QAGP,8BAAM,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,IACvG,QAAQ,CACJ,CACN,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,eAAe,CAAC,OAAwC,EAAE,SAA0C;IAC3G,IAAI,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,IAAI,EAAE;QACjC,OAAO,OAAO,CAAC,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC;KACvC;SAAM,IAAI,OAAO,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,EAAE;QAC1C,OAAO,SAAS,CAAC,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC;KACvC;SAAM;QACL,OAAO,SAAS,CAAC,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC;KACzC;AACH,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useEffect, useRef } from 'react';\nimport { renderTextContent } from '../internal/components/responsive-text';\nimport { getIsRtl } from '../internal/direction';\n\ninterface ResponsiveTextProps {\n x: number;\n y: number;\n rightSide?: boolean;\n className?: string;\n children: string;\n containerBoundaries: null | { left: number; right: number };\n}\n\nexport default memo(ResponsiveText);\n\nfunction ResponsiveText({ x, y, rightSide, className, children, containerBoundaries }: ResponsiveTextProps) {\n const actualRef = useRef<SVGTextElement>(null);\n const virtualRef = useRef<SVGTextElement>(null);\n\n const isRtl = actualRef.current ? getIsRtl(actualRef.current) : false;\n rightSide = !isRtl ? rightSide : !rightSide;\n\n // Determine the visible width of the text and if necessary truncate it until it fits.\n useEffect(() => {\n // The debouncing is necessary for visual smoothness.\n const timeoutId = setTimeout(() => {\n const isRtl = getIsRtl(virtualRef.current!);\n const groupRect = virtualRef.current!.getBoundingClientRect();\n const visibleWidth = containerBoundaries ? getVisibleWidth(groupRect, containerBoundaries) : 0;\n renderTextContent(actualRef.current!, children, visibleWidth, isRtl);\n }, 25);\n return () => clearTimeout(timeoutId);\n });\n\n return (\n <>\n {/* Invisible sample text used for measurement */}\n <text\n ref={virtualRef}\n x={x}\n y={y}\n style={{ textAnchor: rightSide ? 'start' : 'end', visibility: 'hidden' }}\n aria-hidden=\"true\"\n className={className}\n >\n {children}\n </text>\n\n {/* Text node to render truncated text into */}\n <text ref={actualRef} x={x} y={y} style={{ textAnchor: rightSide ? 'start' : 'end' }} className={className}>\n {children}\n </text>\n </>\n );\n}\n\nfunction getVisibleWidth(element: { left: number; right: number }, container: { left: number; right: number }): number {\n if (element.left < container.left) {\n return element.right - container.left;\n } else if (element.right > container.right) {\n return container.right - element.left;\n } else {\n return container.right - container.left;\n }\n}\n"]}
|
package/select/parts/filter.d.ts
CHANGED
|
@@ -5,6 +5,6 @@ export interface FilterProps extends InternalInputProps {
|
|
|
5
5
|
ref?: React.Ref<HTMLInputElement>;
|
|
6
6
|
filteringType: SelectProps.FilteringType;
|
|
7
7
|
}
|
|
8
|
-
declare const Filter: React.ForwardRefExoticComponent<Pick<FilterProps, "disabled" | "autoComplete" | "autoFocus" | "name" | "className" | "id" | "placeholder" | "inputMode" | "type" | "readOnly" | "step" | "value" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "invalid" | "__internalRootRef" | "ariaLabel" | "ariaDescribedby" | "__nativeAttributes" | "clearAriaLabel" | "ariaLabelledby" | "controlId" | "filteringType" | "ariaRequired" | "disableBrowserAutocorrect" | "spellcheck" | "__leftIcon" | "__leftIconVariant" | "__onLeftIconClick" | "__rightIcon" | "__onRightIconClick" | "__noBorderRadius" | "__onDelayedInput" | "__onBlurWithDetail" | "__inheritFormFieldProps"> & React.RefAttributes<HTMLInputElement>>;
|
|
8
|
+
declare const Filter: React.ForwardRefExoticComponent<Pick<FilterProps, "disabled" | "autoComplete" | "autoFocus" | "name" | "className" | "id" | "placeholder" | "inputMode" | "type" | "readOnly" | "step" | "value" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "warning" | "invalid" | "__internalRootRef" | "ariaLabel" | "ariaDescribedby" | "__nativeAttributes" | "clearAriaLabel" | "ariaLabelledby" | "controlId" | "filteringType" | "ariaRequired" | "disableBrowserAutocorrect" | "spellcheck" | "__leftIcon" | "__leftIconVariant" | "__onLeftIconClick" | "__rightIcon" | "__onRightIconClick" | "__noBorderRadius" | "__onDelayedInput" | "__onBlurWithDetail" | "__inheritFormFieldProps"> & React.RefAttributes<HTMLInputElement>>;
|
|
9
9
|
export default Filter;
|
|
10
10
|
//# sourceMappingURL=filter.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/filter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAsB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC,aAAa,EAAE,WAAW,CAAC,aAAa,CAAC;CAC1C;AAED,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/filter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAsB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC,aAAa,EAAE,WAAW,CAAC,aAAa,CAAC;CAC1C;AAED,QAAA,MAAM,MAAM,otBAyBV,CAAC;AAEH,eAAe,MAAM,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,2CAA2C,CAAC;AAG5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzD,MAAM,WAAW,YAAa,SAAQ,+BAA+B;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,kBAAkB,CAAC;IACjC,cAAc,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,WAAW,CAAC,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CACnD;AAED,QAAA,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,2CAA2C,CAAC;AAG5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzD,MAAM,WAAW,YAAa,SAAQ,+BAA+B;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,kBAAkB,CAAC;IACjC,cAAc,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,WAAW,CAAC,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CACnD;AAED,QAAA,MAAM,OAAO,wFA8FZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
|