@cloudscape-design/components 3.0.1340 → 3.0.1342

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/button-dropdown/filter.d.ts +1 -1
  2. package/button-dropdown/filter.d.ts.map +1 -1
  3. package/button-dropdown/internal.d.ts.map +1 -1
  4. package/button-dropdown/internal.js +2 -2
  5. package/button-dropdown/internal.js.map +1 -1
  6. package/button-dropdown/utils/use-button-dropdown.d.ts +1 -0
  7. package/button-dropdown/utils/use-button-dropdown.d.ts.map +1 -1
  8. package/button-dropdown/utils/use-button-dropdown.js +9 -0
  9. package/button-dropdown/utils/use-button-dropdown.js.map +1 -1
  10. package/i18n/context.d.ts +16 -4
  11. package/i18n/context.d.ts.map +1 -1
  12. package/i18n/context.js +10 -4
  13. package/i18n/context.js.map +1 -1
  14. package/i18n/index.d.ts +3 -1
  15. package/i18n/index.d.ts.map +1 -1
  16. package/i18n/index.js +1 -0
  17. package/i18n/index.js.map +1 -1
  18. package/input/index.d.ts.map +1 -1
  19. package/input/index.js +4 -2
  20. package/input/index.js.map +1 -1
  21. package/input/interfaces.d.ts +9 -0
  22. package/input/interfaces.d.ts.map +1 -1
  23. package/input/interfaces.js.map +1 -1
  24. package/input/internal.d.ts +5 -5
  25. package/input/internal.d.ts.map +1 -1
  26. package/input/internal.js +60 -24
  27. package/input/internal.js.map +1 -1
  28. package/input/styles.css.js +28 -18
  29. package/input/styles.scoped.css +213 -52
  30. package/input/styles.selectors.js +28 -18
  31. package/input/utils.js +3 -3
  32. package/input/utils.js.map +1 -1
  33. package/internal/base-component/styles.scoped.css +1 -1
  34. package/internal/components/chart-legend/styles.css.js +6 -6
  35. package/internal/components/chart-legend/styles.scoped.css +16 -14
  36. package/internal/components/chart-legend/styles.selectors.js +6 -6
  37. package/internal/environment.js +2 -2
  38. package/internal/environment.json +2 -2
  39. package/internal/manifest.json +1 -1
  40. package/manifest.json +2 -2
  41. package/multiselect/embedded.d.ts +1 -1
  42. package/package.json +1 -1
  43. package/select/parts/filter.d.ts +1 -1
  44. package/select/parts/filter.d.ts.map +1 -1
  45. package/status-indicator/interfaces.d.ts +1 -1
  46. package/status-indicator/interfaces.d.ts.map +1 -1
  47. package/status-indicator/interfaces.js.map +1 -1
  48. package/status-indicator/internal.d.ts +2 -6
  49. package/status-indicator/internal.d.ts.map +1 -1
  50. package/status-indicator/internal.js.map +1 -1
  51. package/steps/interfaces.d.ts +2 -2
  52. package/steps/interfaces.d.ts.map +1 -1
  53. package/steps/interfaces.js.map +1 -1
  54. package/test-utils/dom/input/index.d.ts +2 -0
  55. package/test-utils/dom/input/index.js +6 -0
  56. package/test-utils/dom/input/index.js.map +1 -1
  57. package/test-utils/selectors/input/index.d.ts +2 -0
  58. package/test-utils/selectors/input/index.js +6 -0
  59. package/test-utils/selectors/input/index.js.map +1 -1
  60. package/status-indicator/internal-interfaces.d.ts +0 -2
  61. package/status-indicator/internal-interfaces.d.ts.map +0 -1
  62. package/status-indicator/internal-interfaces.js +0 -2
  63. package/status-indicator/internal-interfaces.js.map +0 -1
@@ -142,11 +142,41 @@
142
142
  */
143
143
  /* Style used for links in slots/components that are text heavy, to help links stand out among
144
144
  surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
145
- .awsui_root_2rhyz_b0nan_145:not(#\9) {
145
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9), .awsui_input_2rhyz_fcxkz_145:not(#\9) {
146
+ background-color: var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff));
147
+ border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94));
148
+ border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94));
149
+ box-shadow: var(--awsui-style-box-shadow-default-esndbs);
150
+ }
151
+
152
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9):hover, .awsui_input_2rhyz_fcxkz_145:not(#\9):hover {
153
+ border-color: var(--awsui-style-border-color-hover-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94)));
154
+ background-color: var(--awsui-style-background-hover-esndbs, var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff)));
155
+ box-shadow: var(--awsui-style-box-shadow-hover-esndbs, --awsui-style-box-shadow-default-esndbs);
156
+ }
157
+
158
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-readonly_2rhyz_fcxkz_158:not(#\9), .awsui_input_2rhyz_fcxkz_145.awsui_input-readonly_2rhyz_fcxkz_158:not(#\9) {
159
+ background-color: var(--awsui-style-background-readonly-esndbs, var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff)));
160
+ border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-readonly-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0)));
161
+ border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-readonly-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0)));
162
+ }
163
+
164
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9):focus-within, .awsui_input_2rhyz_fcxkz_145:not(#\9):focus {
165
+ outline: 2px dotted transparent;
166
+ border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-focus-esndbs, var(--color-border-input-focused-4z0pgn, #006ce0));
167
+ border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-focus-esndbs, var(--color-border-input-focused-4z0pgn, #006ce0));
168
+ border-start-start-radius: var(--border-radius-input-7q0str, 8px);
169
+ border-start-end-radius: var(--border-radius-input-7q0str, 8px);
170
+ border-end-start-radius: var(--border-radius-input-7q0str, 8px);
171
+ border-end-end-radius: var(--border-radius-input-7q0str, 8px);
172
+ box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0));
173
+ }
174
+
175
+ .awsui_root_2rhyz_fcxkz_175:not(#\9) {
146
176
  /* used in test-utils for component to distinguish input from other input-like components, for example autosuggest */
147
177
  }
148
178
 
149
- .awsui_input_2rhyz_b0nan_149:not(#\9) {
179
+ .awsui_input_2rhyz_fcxkz_145:not(#\9) {
150
180
  border-collapse: separate;
151
181
  border-spacing: 0;
152
182
  box-sizing: border-box;
@@ -182,32 +212,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
182
212
  inline-size: 100%;
183
213
  cursor: text;
184
214
  box-sizing: border-box;
185
- background-color: var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff));
186
215
  border-start-start-radius: var(--border-radius-input-7q0str, 8px);
187
216
  border-start-end-radius: var(--border-radius-input-7q0str, 8px);
188
217
  border-end-start-radius: var(--border-radius-input-7q0str, 8px);
189
218
  border-end-end-radius: var(--border-radius-input-7q0str, 8px);
190
- border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94));
191
- border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94));
192
- box-shadow: var(--awsui-style-box-shadow-default-esndbs);
193
219
  font-size: var(--font-size-body-m-a7nh2n, 14px);
194
220
  line-height: var(--line-height-body-m-2mh3ke, 20px);
195
221
  min-block-size: var(--size-vertical-input-p1d7xx, 32px);
196
222
  }
197
- .awsui_input_2rhyz_b0nan_149:not(#\9):hover {
198
- border-color: var(--awsui-style-border-color-hover-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-default-317xk5, #8c8c94)));
223
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):hover {
199
224
  color: var(--awsui-style-color-hover-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-text-body-default-vvtq8u, #0f141a)));
200
- background-color: var(--awsui-style-background-hover-esndbs, var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff)));
201
- box-shadow: var(--awsui-style-box-shadow-hover-esndbs, --awsui-style-box-shadow-default-esndbs);
202
225
  }
203
- .awsui_input_2rhyz_b0nan_149.awsui_input-readonly_2rhyz_b0nan_203:not(#\9) {
204
- background-color: var(--awsui-style-background-readonly-esndbs, var(--awsui-style-background-default-esndbs, var(--color-background-input-default-ifz5bb, #ffffff)));
205
- border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-readonly-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0)));
206
- border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-readonly-esndbs, var(--awsui-style-border-color-default-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0)));
226
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-readonly_2rhyz_fcxkz_158:not(#\9) {
207
227
  color: var(--awsui-style-color-readonly-esndbs, var(--awsui-style-color-default-esndbs, var(--color-text-body-default-vvtq8u, #0f141a)));
208
228
  box-shadow: var(--awsui-style-box-shadow-readonly-esndbs);
209
229
  }
210
- .awsui_input_2rhyz_b0nan_149:not(#\9)::-webkit-input-placeholder {
230
+ .awsui_input_2rhyz_fcxkz_145:not(#\9)::-webkit-input-placeholder {
211
231
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-dclg8u, #656871));
212
232
  font-size: var(--awsui-style-placeholder-font-size-esndbs);
213
233
  font-style: var(--awsui-style-placeholder-font-style-esndbs, italic);
@@ -215,33 +235,25 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
215
235
  -webkit-user-select: none;
216
236
  user-select: none;
217
237
  }
218
- .awsui_input_2rhyz_b0nan_149:not(#\9)::-moz-placeholder {
238
+ .awsui_input_2rhyz_fcxkz_145:not(#\9)::-moz-placeholder {
219
239
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-dclg8u, #656871));
220
240
  font-size: var(--awsui-style-placeholder-font-size-esndbs);
221
241
  font-style: var(--awsui-style-placeholder-font-style-esndbs, italic);
222
242
  font-weight: var(--awsui-style-placeholder-font-weight-esndbs);
223
243
  opacity: 1;
224
244
  }
225
- .awsui_input_2rhyz_b0nan_149:not(#\9):-moz-placeholder {
245
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):-moz-placeholder {
226
246
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-dclg8u, #656871));
227
247
  font-size: var(--awsui-style-placeholder-font-size-esndbs);
228
248
  font-style: var(--awsui-style-placeholder-font-style-esndbs, italic);
229
249
  font-weight: var(--awsui-style-placeholder-font-weight-esndbs);
230
250
  opacity: 1;
231
251
  }
232
- .awsui_input_2rhyz_b0nan_149:not(#\9):focus {
233
- outline: 2px dotted transparent;
234
- border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-focus-esndbs, var(--color-border-input-focused-4z0pgn, #006ce0));
235
- border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-focus-esndbs, var(--color-border-input-focused-4z0pgn, #006ce0));
236
- border-start-start-radius: var(--border-radius-input-7q0str, 8px);
237
- border-start-end-radius: var(--border-radius-input-7q0str, 8px);
238
- border-end-start-radius: var(--border-radius-input-7q0str, 8px);
239
- border-end-end-radius: var(--border-radius-input-7q0str, 8px);
240
- box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0));
252
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):focus {
241
253
  color: var(--awsui-style-color-focus-esndbs, var(--color-text-body-default-vvtq8u, #0f141a));
242
254
  background-color: var(--awsui-style-background-focus-esndbs, var(--color-background-input-default-ifz5bb, #ffffff));
243
255
  }
244
- .awsui_input_2rhyz_b0nan_149:not(#\9):disabled {
256
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):disabled {
245
257
  background-color: var(--awsui-style-background-disabled-esndbs, var(--color-background-input-disabled-dihaja, #ebebf0));
246
258
  border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-disabled-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0));
247
259
  border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-disabled-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0));
@@ -249,106 +261,106 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
249
261
  cursor: default;
250
262
  box-shadow: var(--awsui-style-box-shadow-disabled-esndbs);
251
263
  }
252
- .awsui_input_2rhyz_b0nan_149:not(#\9):disabled::-webkit-input-placeholder {
264
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):disabled::-webkit-input-placeholder {
253
265
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-disabled-wg87og, #b4b4bb));
254
266
  -webkit-user-select: none;
255
267
  user-select: none;
256
268
  }
257
- .awsui_input_2rhyz_b0nan_149:not(#\9):disabled::-moz-placeholder {
269
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):disabled::-moz-placeholder {
258
270
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-disabled-wg87og, #b4b4bb));
259
271
  opacity: 1;
260
272
  }
261
- .awsui_input_2rhyz_b0nan_149:not(#\9):disabled:-moz-placeholder {
273
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):disabled:-moz-placeholder {
262
274
  color: var(--awsui-style-placeholder-color-esndbs, var(--color-text-input-placeholder-disabled-wg87og, #b4b4bb));
263
275
  opacity: 1;
264
276
  }
265
- .awsui_input_2rhyz_b0nan_149:not(#\9):invalid {
277
+ .awsui_input_2rhyz_fcxkz_145:not(#\9):invalid {
266
278
  box-shadow: none;
267
279
  }
268
- .awsui_input_2rhyz_b0nan_149.awsui_input-invalid_2rhyz_b0nan_266:not(#\9) {
280
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-invalid_2rhyz_fcxkz_278:not(#\9) {
269
281
  color: var(--awsui-style-color-default-esndbs, var(--color-text-status-error-bwp1cm, #db0000));
270
282
  border-color: var(--awsui-style-border-color-default-esndbs, var(--color-text-status-error-bwp1cm, #db0000));
271
283
  padding-inline-start: calc(var(--space-field-horizontal-0aq2ch, 12px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
272
284
  border-inline-start-width: var(--border-invalid-width-3xd6e1, 8px);
273
285
  }
274
- .awsui_input_2rhyz_b0nan_149.awsui_input-invalid_2rhyz_b0nan_266:not(#\9):focus {
286
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-invalid_2rhyz_fcxkz_278:not(#\9):focus {
275
287
  box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
276
288
  }
277
- .awsui_input_2rhyz_b0nan_149.awsui_input-invalid_2rhyz_b0nan_266.awsui_input-has-icon-left_2rhyz_b0nan_275:not(#\9) {
289
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-invalid_2rhyz_fcxkz_278.awsui_input-has-icon-start_2rhyz_fcxkz_287:not(#\9) {
278
290
  padding-inline-start: calc(var(--space-field-icon-offset-ikwzwx, 36px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
279
291
  }
280
- .awsui_input_2rhyz_b0nan_149.awsui_input-warning_2rhyz_b0nan_278:not(#\9) {
292
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-warning_2rhyz_fcxkz_290:not(#\9) {
281
293
  color: var(--awsui-style-color-default-esndbs, var(--color-text-status-warning-ylxn5k, #855900));
282
294
  border-color: var(--awsui-style-border-color-default-esndbs, var(--color-text-status-warning-ylxn5k, #855900));
283
295
  padding-inline-start: calc(var(--space-field-horizontal-0aq2ch, 12px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
284
296
  border-inline-start-width: var(--border-invalid-width-3xd6e1, 8px);
285
297
  }
286
- .awsui_input_2rhyz_b0nan_149.awsui_input-warning_2rhyz_b0nan_278:not(#\9):focus {
298
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-warning_2rhyz_fcxkz_290:not(#\9):focus {
287
299
  box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
288
300
  }
289
- .awsui_input_2rhyz_b0nan_149.awsui_input-warning_2rhyz_b0nan_278.awsui_input-has-icon-left_2rhyz_b0nan_275:not(#\9) {
301
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-warning_2rhyz_fcxkz_290.awsui_input-has-icon-start_2rhyz_fcxkz_287:not(#\9) {
290
302
  padding-inline-start: calc(var(--space-field-icon-offset-ikwzwx, 36px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
291
303
  }
292
- .awsui_input_2rhyz_b0nan_149.awsui_input-type-search_2rhyz_b0nan_290:not(#\9) {
304
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-type-search_2rhyz_fcxkz_302:not(#\9) {
293
305
  box-sizing: border-box;
294
306
  -webkit-appearance: none;
295
307
  }
296
- .awsui_input_2rhyz_b0nan_149.awsui_input-type-search_2rhyz_b0nan_290:not(#\9)::-webkit-search-decoration {
308
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-type-search_2rhyz_fcxkz_302:not(#\9)::-webkit-search-decoration {
297
309
  -webkit-appearance: none;
298
310
  }
299
- .awsui_input_2rhyz_b0nan_149.awsui_input-type-search_2rhyz_b0nan_290:not(#\9)::-webkit-search-cancel-button {
311
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-type-search_2rhyz_fcxkz_302:not(#\9)::-webkit-search-cancel-button {
300
312
  display: none;
301
313
  }
302
- .awsui_input_2rhyz_b0nan_149.awsui_input-has-icon-left_2rhyz_b0nan_275:not(#\9) {
314
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-has-icon-start_2rhyz_fcxkz_287:not(#\9) {
303
315
  padding-inline-start: var(--space-field-icon-offset-ikwzwx, 36px);
304
316
  }
305
- .awsui_input_2rhyz_b0nan_149.awsui_input-has-icon-right_2rhyz_b0nan_303:not(#\9) {
317
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-has-icon-end_2rhyz_fcxkz_315:not(#\9) {
306
318
  padding-inline-end: var(--space-field-icon-offset-ikwzwx, 36px);
307
319
  }
308
- .awsui_input_2rhyz_b0nan_149.awsui_input-has-no-border-radius_2rhyz_b0nan_306:not(#\9) {
320
+ .awsui_input_2rhyz_fcxkz_145.awsui_input-has-no-border-radius_2rhyz_fcxkz_318:not(#\9) {
309
321
  border-start-start-radius: var(--border-radius-dropdown-fgc2a1, 8px);
310
322
  border-start-end-radius: var(--border-radius-dropdown-fgc2a1, 8px);
311
323
  border-end-start-radius: var(--border-radius-dropdown-fgc2a1, 8px);
312
324
  border-end-end-radius: var(--border-radius-dropdown-fgc2a1, 8px);
313
325
  }
314
326
 
315
- .awsui_input-container_2rhyz_b0nan_313:not(#\9) {
327
+ .awsui_input-container_2rhyz_fcxkz_325:not(#\9) {
316
328
  display: flex;
317
329
  position: relative;
318
330
  }
319
331
 
320
- .awsui_input-icon-left_2rhyz_b0nan_318:not(#\9) {
332
+ .awsui_input-icon-start_2rhyz_fcxkz_330:not(#\9) {
321
333
  position: absolute;
322
334
  pointer-events: none;
323
335
  inset-inline-start: var(--space-field-horizontal-0aq2ch, 12px);
324
336
  inset-block-start: calc(50% - var(--line-height-body-m-2mh3ke, 20px) / 2);
325
337
  }
326
338
 
327
- .awsui_input-icon-right_2rhyz_b0nan_325:not(#\9) {
339
+ .awsui_input-icon-end_2rhyz_fcxkz_337:not(#\9) {
328
340
  position: absolute;
329
341
  inset-block-start: calc(calc(50% - var(--line-height-body-m-2mh3ke, 20px) / 2) - var(--space-xxxs-pajhad, 2px));
330
342
  inset-inline-end: calc(var(--space-field-horizontal-0aq2ch, 12px) - var(--space-xxs-hwfkai, 4px));
331
343
  }
332
344
 
333
- .awsui_input-button-right_2rhyz_b0nan_331:not(#\9) {
345
+ .awsui_input-button-right_2rhyz_fcxkz_343:not(#\9) {
334
346
  /* used in test-utils */
335
347
  }
336
348
 
337
- .awsui_inline-label-trigger-wrapper_2rhyz_b0nan_335:not(#\9) {
349
+ .awsui_inline-label-trigger-wrapper_2rhyz_fcxkz_347:not(#\9) {
338
350
  margin-block-start: -7px;
339
351
  }
340
- .awsui_inline-label-trigger-wrapper-full-width_2rhyz_b0nan_338:not(#\9) {
352
+ .awsui_inline-label-trigger-wrapper-full-width_2rhyz_fcxkz_350:not(#\9) {
341
353
  inline-size: 100%;
342
354
  }
343
355
 
344
- .awsui_inline-label-wrapper_2rhyz_b0nan_342:not(#\9) {
356
+ .awsui_inline-label-wrapper_2rhyz_fcxkz_354:not(#\9) {
345
357
  margin-block-start: calc(var(--space-scaled-xs-xwoogq, 8px) * -1);
346
358
  }
347
- .awsui_inline-label-wrapper-full-width_2rhyz_b0nan_345:not(#\9) {
359
+ .awsui_inline-label-wrapper-full-width_2rhyz_fcxkz_357:not(#\9) {
348
360
  inline-size: 100%;
349
361
  }
350
362
 
351
- .awsui_inline-label_2rhyz_b0nan_335:not(#\9) {
363
+ .awsui_inline-label_2rhyz_fcxkz_347:not(#\9) {
352
364
  background: linear-gradient(to bottom, var(--color-background-layout-main-5ilwcb, #ffffff), var(--color-background-input-default-ifz5bb, #ffffff));
353
365
  border-start-start-radius: 2px;
354
366
  border-start-end-radius: 2px;
@@ -368,4 +380,153 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
368
380
  padding-inline: var(--space-scaled-xxs-pfm1nx, 4px);
369
381
  max-inline-size: calc(100% - 2 * var(--space-field-horizontal-0aq2ch, 12px));
370
382
  z-index: 1;
383
+ }
384
+
385
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9) {
386
+ display: flex;
387
+ align-items: stretch;
388
+ inline-size: 100%;
389
+ box-sizing: border-box;
390
+ color: var(--awsui-style-color-default-esndbs, var(--color-text-form-secondary-1nm780, #656871));
391
+ border-start-start-radius: var(--border-radius-input-7q0str, 8px);
392
+ border-start-end-radius: var(--border-radius-input-7q0str, 8px);
393
+ border-end-start-radius: var(--border-radius-input-7q0str, 8px);
394
+ border-end-end-radius: var(--border-radius-input-7q0str, 8px);
395
+ min-block-size: var(--size-vertical-input-p1d7xx, 32px);
396
+ }
397
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9):hover {
398
+ color: var(--awsui-style-color-hover-esndbs, var(--awsui-style-color-default-esndbs, var(--color-text-form-secondary-1nm780, #656871)));
399
+ }
400
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-readonly_2rhyz_fcxkz_158:not(#\9) {
401
+ color: var(--awsui-style-color-readonly-esndbs, var(--awsui-style-color-default-esndbs, var(--color-text-form-secondary-1nm780, #656871)));
402
+ }
403
+ .awsui_input-adorned-container_2rhyz_fcxkz_145:not(#\9):focus-within {
404
+ color: var(--awsui-style-color-focus-esndbs, var(--awsui-style-color-default-esndbs, var(--color-text-form-secondary-1nm780, #656871)));
405
+ }
406
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-invalid_2rhyz_fcxkz_404:not(#\9) {
407
+ color: var(--awsui-style-color-default-esndbs, var(--color-text-status-error-bwp1cm, #db0000));
408
+ border-color: var(--awsui-style-border-color-default-esndbs, var(--color-text-status-error-bwp1cm, #db0000));
409
+ padding-inline-start: calc(var(--space-field-horizontal-0aq2ch, 12px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
410
+ border-inline-start-width: var(--border-invalid-width-3xd6e1, 8px);
411
+ padding-inline-start: 0;
412
+ }
413
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-invalid_2rhyz_fcxkz_404:not(#\9):focus {
414
+ box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
415
+ }
416
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-invalid_2rhyz_fcxkz_404:not(#\9):focus-within {
417
+ box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
418
+ }
419
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-warning_2rhyz_fcxkz_417:not(#\9) {
420
+ color: var(--awsui-style-color-default-esndbs, var(--color-text-status-warning-ylxn5k, #855900));
421
+ border-color: var(--awsui-style-border-color-default-esndbs, var(--color-text-status-warning-ylxn5k, #855900));
422
+ padding-inline-start: calc(var(--space-field-horizontal-0aq2ch, 12px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
423
+ border-inline-start-width: var(--border-invalid-width-3xd6e1, 8px);
424
+ padding-inline-start: 0;
425
+ }
426
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-warning_2rhyz_fcxkz_417:not(#\9):focus {
427
+ box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
428
+ }
429
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-warning_2rhyz_fcxkz_417:not(#\9):focus-within {
430
+ box-shadow: var(--awsui-style-box-shadow-focus-esndbs, 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-9jjf96, 2px) var(--color-border-item-focused-uk47pl, #006ce0));
431
+ }
432
+ .awsui_input-adorned-container_2rhyz_fcxkz_145.awsui_input-adorned-container-disabled_2rhyz_fcxkz_430:not(#\9) {
433
+ background-color: var(--awsui-style-background-disabled-esndbs, var(--color-background-input-disabled-dihaja, #ebebf0));
434
+ border-block: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-disabled-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0));
435
+ border-inline: var(--border-width-field-2xc78x, 1px) solid var(--awsui-style-border-color-disabled-esndbs, var(--color-border-input-disabled-zgnzvk, #ebebf0));
436
+ color: var(--awsui-style-color-disabled-esndbs, var(--color-text-input-disabled-wh1f3y, #b4b4bb));
437
+ cursor: default;
438
+ box-shadow: var(--awsui-style-box-shadow-disabled-esndbs);
439
+ }
440
+
441
+ .awsui_input-prefix_2rhyz_fcxkz_439:not(#\9),
442
+ .awsui_input-suffix_2rhyz_fcxkz_440:not(#\9) {
443
+ display: flex;
444
+ align-items: center;
445
+ flex-shrink: 1;
446
+ max-inline-size: max(0px, (100% - 12rem) / 2);
447
+ min-inline-size: 0;
448
+ padding-block: var(--space-field-vertical-vm99qz, 5px);
449
+ padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
450
+ color: inherit;
451
+ font-size: var(--font-size-body-m-a7nh2n, 14px);
452
+ line-height: var(--line-height-body-m-2mh3ke, 20px);
453
+ }
454
+
455
+ .awsui_input-adornment-content_2rhyz_fcxkz_453:not(#\9) {
456
+ display: block;
457
+ flex: 1;
458
+ min-inline-size: 0;
459
+ overflow: hidden;
460
+ text-overflow: ellipsis;
461
+ white-space: nowrap;
462
+ }
463
+
464
+ .awsui_input-adornment-divider_2rhyz_fcxkz_462:not(#\9) {
465
+ display: block;
466
+ flex-shrink: 0;
467
+ inline-size: var(--border-width-field-2xc78x, 1px);
468
+ background-color: var(--color-border-divider-default-nr68jt, #c6c6cd);
469
+ align-self: stretch;
470
+ }
471
+
472
+ .awsui_input-adorned_2rhyz_fcxkz_145:not(#\9) {
473
+ flex: 1;
474
+ min-inline-size: 0;
475
+ border-block: none;
476
+ border-inline: none;
477
+ border-start-start-radius: 0;
478
+ border-start-end-radius: 0;
479
+ border-end-start-radius: 0;
480
+ border-end-end-radius: 0;
481
+ background-color: transparent;
482
+ box-shadow: none;
483
+ min-block-size: unset;
484
+ }
485
+ .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input_2rhyz_fcxkz_145:not(#\9):focus {
486
+ border-block: 0;
487
+ border-inline: 0;
488
+ box-shadow: none;
489
+ outline: none;
490
+ }
491
+ .awsui_input-adorned_2rhyz_fcxkz_145:not(#\9):hover {
492
+ border-color: transparent;
493
+ background-color: transparent;
494
+ }
495
+ .awsui_input-adorned_2rhyz_fcxkz_145:not(#\9):disabled {
496
+ background-color: transparent;
497
+ border-color: transparent;
498
+ border-block: 0;
499
+ border-inline: 0;
500
+ }
501
+ .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input-readonly_2rhyz_fcxkz_158:not(#\9) {
502
+ background-color: transparent;
503
+ border-color: transparent;
504
+ border-block: 0;
505
+ border-inline: 0;
506
+ }
507
+ .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input-invalid_2rhyz_fcxkz_278:not(#\9), .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input-warning_2rhyz_fcxkz_290:not(#\9) {
508
+ padding-inline-start: var(--space-field-horizontal-0aq2ch, 12px);
509
+ border-block: 0;
510
+ border-inline: 0;
511
+ border-inline-start-width: 0;
512
+ box-shadow: none;
513
+ }
514
+ .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input-invalid_2rhyz_fcxkz_278:not(#\9):focus, .awsui_input-adorned_2rhyz_fcxkz_145.awsui_input-warning_2rhyz_fcxkz_290:not(#\9):focus {
515
+ border-block: 0;
516
+ border-inline: 0;
517
+ box-shadow: none;
518
+ outline: none;
519
+ }
520
+
521
+ .awsui_input-adorned-container-invalid_2rhyz_fcxkz_404 > .awsui_input-prefix_2rhyz_fcxkz_439:not(#\9),
522
+ .awsui_input-adorned-container-invalid_2rhyz_fcxkz_404 > .awsui_input-adorned_2rhyz_fcxkz_145:not(#\9):first-child,
523
+ .awsui_input-adorned-container-warning_2rhyz_fcxkz_417 > .awsui_input-prefix_2rhyz_fcxkz_439:not(#\9),
524
+ .awsui_input-adorned-container-warning_2rhyz_fcxkz_417 > .awsui_input-adorned_2rhyz_fcxkz_145:not(#\9):first-child {
525
+ padding-inline-start: calc(var(--space-field-horizontal-0aq2ch, 12px) - (var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)));
526
+ }
527
+ .awsui_input-adorned-container-invalid_2rhyz_fcxkz_404 > .awsui_input-prefix_2rhyz_fcxkz_439:not(#\9),
528
+ .awsui_input-adorned-container-invalid_2rhyz_fcxkz_404 > .awsui_input-suffix_2rhyz_fcxkz_440:not(#\9),
529
+ .awsui_input-adorned-container-warning_2rhyz_fcxkz_417 > .awsui_input-prefix_2rhyz_fcxkz_439:not(#\9),
530
+ .awsui_input-adorned-container-warning_2rhyz_fcxkz_417 > .awsui_input-suffix_2rhyz_fcxkz_440:not(#\9) {
531
+ max-inline-size: max(0px, (100% - 12rem + var(--border-invalid-width-3xd6e1, 8px) - var(--border-width-field-2xc78x, 1px)) / 2);
371
532
  }
@@ -2,23 +2,33 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "root": "awsui_root_2rhyz_b0nan_145",
6
- "input": "awsui_input_2rhyz_b0nan_149",
7
- "input-readonly": "awsui_input-readonly_2rhyz_b0nan_203",
8
- "input-invalid": "awsui_input-invalid_2rhyz_b0nan_266",
9
- "input-has-icon-left": "awsui_input-has-icon-left_2rhyz_b0nan_275",
10
- "input-warning": "awsui_input-warning_2rhyz_b0nan_278",
11
- "input-type-search": "awsui_input-type-search_2rhyz_b0nan_290",
12
- "input-has-icon-right": "awsui_input-has-icon-right_2rhyz_b0nan_303",
13
- "input-has-no-border-radius": "awsui_input-has-no-border-radius_2rhyz_b0nan_306",
14
- "input-container": "awsui_input-container_2rhyz_b0nan_313",
15
- "input-icon-left": "awsui_input-icon-left_2rhyz_b0nan_318",
16
- "input-icon-right": "awsui_input-icon-right_2rhyz_b0nan_325",
17
- "input-button-right": "awsui_input-button-right_2rhyz_b0nan_331",
18
- "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_2rhyz_b0nan_335",
19
- "inline-label-trigger-wrapper-full-width": "awsui_inline-label-trigger-wrapper-full-width_2rhyz_b0nan_338",
20
- "inline-label-wrapper": "awsui_inline-label-wrapper_2rhyz_b0nan_342",
21
- "inline-label-wrapper-full-width": "awsui_inline-label-wrapper-full-width_2rhyz_b0nan_345",
22
- "inline-label": "awsui_inline-label_2rhyz_b0nan_335"
5
+ "input-adorned-container": "awsui_input-adorned-container_2rhyz_fcxkz_145",
6
+ "input": "awsui_input_2rhyz_fcxkz_145",
7
+ "input-adorned-container-readonly": "awsui_input-adorned-container-readonly_2rhyz_fcxkz_158",
8
+ "input-readonly": "awsui_input-readonly_2rhyz_fcxkz_158",
9
+ "root": "awsui_root_2rhyz_fcxkz_175",
10
+ "input-invalid": "awsui_input-invalid_2rhyz_fcxkz_278",
11
+ "input-has-icon-start": "awsui_input-has-icon-start_2rhyz_fcxkz_287",
12
+ "input-warning": "awsui_input-warning_2rhyz_fcxkz_290",
13
+ "input-type-search": "awsui_input-type-search_2rhyz_fcxkz_302",
14
+ "input-has-icon-end": "awsui_input-has-icon-end_2rhyz_fcxkz_315",
15
+ "input-has-no-border-radius": "awsui_input-has-no-border-radius_2rhyz_fcxkz_318",
16
+ "input-container": "awsui_input-container_2rhyz_fcxkz_325",
17
+ "input-icon-start": "awsui_input-icon-start_2rhyz_fcxkz_330",
18
+ "input-icon-end": "awsui_input-icon-end_2rhyz_fcxkz_337",
19
+ "input-button-right": "awsui_input-button-right_2rhyz_fcxkz_343",
20
+ "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_2rhyz_fcxkz_347",
21
+ "inline-label-trigger-wrapper-full-width": "awsui_inline-label-trigger-wrapper-full-width_2rhyz_fcxkz_350",
22
+ "inline-label-wrapper": "awsui_inline-label-wrapper_2rhyz_fcxkz_354",
23
+ "inline-label-wrapper-full-width": "awsui_inline-label-wrapper-full-width_2rhyz_fcxkz_357",
24
+ "inline-label": "awsui_inline-label_2rhyz_fcxkz_347",
25
+ "input-adorned-container-invalid": "awsui_input-adorned-container-invalid_2rhyz_fcxkz_404",
26
+ "input-adorned-container-warning": "awsui_input-adorned-container-warning_2rhyz_fcxkz_417",
27
+ "input-adorned-container-disabled": "awsui_input-adorned-container-disabled_2rhyz_fcxkz_430",
28
+ "input-prefix": "awsui_input-prefix_2rhyz_fcxkz_439",
29
+ "input-suffix": "awsui_input-suffix_2rhyz_fcxkz_440",
30
+ "input-adornment-content": "awsui_input-adornment-content_2rhyz_fcxkz_453",
31
+ "input-adornment-divider": "awsui_input-adornment-divider_2rhyz_fcxkz_462",
32
+ "input-adorned": "awsui_input-adorned_2rhyz_fcxkz_145"
23
33
  };
24
34
 
package/input/utils.js CHANGED
@@ -9,10 +9,10 @@ export const useSearchProps = (type, disabled, readOnly, value, inputRef, onChan
9
9
  onChange('');
10
10
  }, [inputRef, onChange]);
11
11
  if (type === 'search' || type === 'visualSearch') {
12
- searchProps.__leftIcon = 'search';
12
+ searchProps.__startIcon = 'search';
13
13
  if (!disabled && !readOnly && value) {
14
- searchProps.__rightIcon = 'close';
15
- searchProps.__onRightIconClick = handleIconClick;
14
+ searchProps.__endIcon = 'close';
15
+ searchProps.__onEndIconClick = handleIconClick;
16
16
  }
17
17
  }
18
18
  return searchProps;
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/input/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,MAAM,OAAO,CAAC;AAI/C,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,IAAY,EACZ,QAA6B,EAC7B,QAA6B,EAC7B,KAAa,EACb,QAAqC,EACrC,QAAiC,EACjC,EAAE;IACF,MAAM,WAAW,GAAgC,EAAE,CAAC;IACpD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;;QACvC,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,cAAc,EAAE,CAAC;QACjD,WAAW,CAAC,UAAU,GAAG,QAAQ,CAAC;QAElC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,KAAK,EAAE,CAAC;YACpC,WAAW,CAAC,WAAW,GAAG,OAAO,CAAC;YAClC,WAAW,CAAC,kBAAkB,GAAG,eAAe,CAAC;QACnD,CAAC;IACH,CAAC;IACD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,gBAAkC,KAAK,EAAU,EAAE;IACrF,IAAI,aAAa,KAAK,IAAI,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IACD,OAAO,aAAa,IAAI,KAAK,CAAC;AAChC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback } from 'react';\n\nimport { InternalInputProps } from './internal';\n\nexport const useSearchProps = (\n type: string,\n disabled: boolean | undefined,\n readOnly: boolean | undefined,\n value: string,\n inputRef: RefObject<HTMLInputElement>,\n onChange: (value: string) => void\n) => {\n const searchProps: Partial<InternalInputProps> = {};\n const handleIconClick = useCallback(() => {\n inputRef.current?.focus();\n onChange('');\n }, [inputRef, onChange]);\n if (type === 'search' || type === 'visualSearch') {\n searchProps.__leftIcon = 'search';\n\n if (!disabled && !readOnly && value) {\n searchProps.__rightIcon = 'close';\n searchProps.__onRightIconClick = handleIconClick;\n }\n }\n return searchProps;\n};\n\n/**\n * Converts the boolean or string value of the `autoComplete` property to the correct `autocomplete` attribute value.\n */\nexport const convertAutoComplete = (propertyValue: boolean | string = false): string => {\n if (propertyValue === true) {\n return 'on';\n }\n return propertyValue || 'off';\n};\n"]}
1
+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/input/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,MAAM,OAAO,CAAC;AAI/C,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,IAAY,EACZ,QAA6B,EAC7B,QAA6B,EAC7B,KAAa,EACb,QAAqC,EACrC,QAAiC,EACjC,EAAE;IACF,MAAM,WAAW,GAAgC,EAAE,CAAC;IACpD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;;QACvC,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,cAAc,EAAE,CAAC;QACjD,WAAW,CAAC,WAAW,GAAG,QAAQ,CAAC;QAEnC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,KAAK,EAAE,CAAC;YACpC,WAAW,CAAC,SAAS,GAAG,OAAO,CAAC;YAChC,WAAW,CAAC,gBAAgB,GAAG,eAAe,CAAC;QACjD,CAAC;IACH,CAAC;IACD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,gBAAkC,KAAK,EAAU,EAAE;IACrF,IAAI,aAAa,KAAK,IAAI,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IACD,OAAO,aAAa,IAAI,KAAK,CAAC;AAChC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback } from 'react';\n\nimport { InternalInputProps } from './internal';\n\nexport const useSearchProps = (\n type: string,\n disabled: boolean | undefined,\n readOnly: boolean | undefined,\n value: string,\n inputRef: RefObject<HTMLInputElement>,\n onChange: (value: string) => void\n) => {\n const searchProps: Partial<InternalInputProps> = {};\n const handleIconClick = useCallback(() => {\n inputRef.current?.focus();\n onChange('');\n }, [inputRef, onChange]);\n if (type === 'search' || type === 'visualSearch') {\n searchProps.__startIcon = 'search';\n\n if (!disabled && !readOnly && value) {\n searchProps.__endIcon = 'close';\n searchProps.__onEndIconClick = handleIconClick;\n }\n }\n return searchProps;\n};\n\n/**\n * Converts the boolean or string value of the `autoComplete` property to the correct `autocomplete` attribute value.\n */\nexport const convertAutoComplete = (propertyValue: boolean | string = false): string => {\n if (propertyValue === true) {\n return 'on';\n }\n return propertyValue || 'off';\n};\n"]}
@@ -2606,5 +2606,5 @@
2606
2606
  }
2607
2607
  }
2608
2608
  :root {
2609
- --awsui-version-info-ac811630: true;
2609
+ --awsui-version-info-6db99848: true;
2610
2610
  }
@@ -1,11 +1,11 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "marker": "awsui_marker_1kjc7_qgpiu_153",
5
- "root": "awsui_root_1kjc7_qgpiu_167",
6
- "title": "awsui_title_1kjc7_qgpiu_202",
7
- "list": "awsui_list_1kjc7_qgpiu_206",
8
- "marker--dimmed": "awsui_marker--dimmed_1kjc7_qgpiu_252",
9
- "marker--highlighted": "awsui_marker--highlighted_1kjc7_qgpiu_255"
4
+ "marker": "awsui_marker_1kjc7_1mp4w_153",
5
+ "root": "awsui_root_1kjc7_1mp4w_167",
6
+ "title": "awsui_title_1kjc7_1mp4w_202",
7
+ "list": "awsui_list_1kjc7_1mp4w_206",
8
+ "marker--dimmed": "awsui_marker--dimmed_1kjc7_1mp4w_254",
9
+ "marker--highlighted": "awsui_marker--highlighted_1kjc7_1mp4w_257"
10
10
  };
11
11
 
@@ -150,21 +150,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
150
150
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
151
151
  SPDX-License-Identifier: Apache-2.0
152
152
  */
153
- .awsui_marker_1kjc7_qgpiu_153:not(#\9) {
153
+ .awsui_marker_1kjc7_1mp4w_153:not(#\9) {
154
154
  transition: opacity var(--motion-duration-transition-quick-mcm2y0, 90ms) var(--motion-easing-transition-quick-qxak3i, linear);
155
155
  }
156
156
  @media (prefers-reduced-motion: reduce) {
157
- .awsui_marker_1kjc7_qgpiu_153:not(#\9) {
157
+ .awsui_marker_1kjc7_1mp4w_153:not(#\9) {
158
158
  animation: none;
159
159
  transition: none;
160
160
  }
161
161
  }
162
- .awsui-motion-disabled .awsui_marker_1kjc7_qgpiu_153:not(#\9), .awsui-mode-entering .awsui_marker_1kjc7_qgpiu_153:not(#\9) {
162
+ .awsui-motion-disabled .awsui_marker_1kjc7_1mp4w_153:not(#\9), .awsui-mode-entering .awsui_marker_1kjc7_1mp4w_153:not(#\9) {
163
163
  animation: none;
164
164
  transition: none;
165
165
  }
166
166
 
167
- .awsui_root_1kjc7_qgpiu_167:not(#\9) {
167
+ .awsui_root_1kjc7_1mp4w_167:not(#\9) {
168
168
  border-collapse: separate;
169
169
  border-spacing: 0;
170
170
  box-sizing: border-box;
@@ -195,15 +195,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
195
195
  -webkit-font-smoothing: auto;
196
196
  -moz-osx-font-smoothing: auto;
197
197
  }
198
- .awsui_root_1kjc7_qgpiu_167:not(#\9):focus {
198
+ .awsui_root_1kjc7_1mp4w_167:not(#\9):focus {
199
199
  outline: none;
200
200
  }
201
201
 
202
- .awsui_title_1kjc7_qgpiu_202:not(#\9) {
202
+ .awsui_title_1kjc7_1mp4w_202:not(#\9) {
203
203
  /* used in test utils */
204
204
  }
205
205
 
206
- .awsui_list_1kjc7_qgpiu_206:not(#\9) {
206
+ .awsui_list_1kjc7_1mp4w_206:not(#\9) {
207
207
  display: flex;
208
208
  flex-wrap: wrap;
209
209
  list-style: none;
@@ -214,7 +214,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
214
214
  gap: var(--space-scaled-xxs-pfm1nx, 4px) var(--space-m-dsumyt, 16px);
215
215
  }
216
216
 
217
- .awsui_marker_1kjc7_qgpiu_153:not(#\9) {
217
+ .awsui_marker_1kjc7_1mp4w_153:not(#\9) {
218
+ min-inline-size: 0;
219
+ word-break: break-word;
218
220
  display: inline-flex;
219
221
  align-items: flex-start;
220
222
  padding-block: 0;
@@ -225,17 +227,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
225
227
  cursor: pointer;
226
228
  opacity: 1;
227
229
  }
228
- .awsui_marker_1kjc7_qgpiu_153:not(#\9):focus {
230
+ .awsui_marker_1kjc7_1mp4w_153:not(#\9):focus {
229
231
  outline: none;
230
232
  }
231
- body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_qgpiu_153:not(#\9):focus {
233
+ body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1mp4w_153:not(#\9):focus {
232
234
  position: relative;
233
235
  }
234
- body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_qgpiu_153:not(#\9):focus {
236
+ body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1mp4w_153:not(#\9):focus {
235
237
  outline: 2px dotted transparent;
236
238
  outline-offset: calc(2px - 1px);
237
239
  }
238
- body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_qgpiu_153:not(#\9):focus::before {
240
+ body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1mp4w_153:not(#\9):focus::before {
239
241
  content: " ";
240
242
  display: block;
241
243
  position: absolute;
@@ -249,9 +251,9 @@ body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_qgpiu_153:not(#\9):focus
249
251
  border-end-end-radius: var(--border-radius-control-default-focus-ring-1uabki, 4px);
250
252
  box-shadow: 0 0 0 2px var(--color-border-item-focused-uk47pl, #006ce0);
251
253
  }
252
- .awsui_marker_1kjc7_qgpiu_153.awsui_marker--dimmed_1kjc7_qgpiu_252:not(#\9) {
254
+ .awsui_marker_1kjc7_1mp4w_153.awsui_marker--dimmed_1kjc7_1mp4w_254:not(#\9) {
253
255
  opacity: 0.35;
254
256
  }
255
- .awsui_marker_1kjc7_qgpiu_153.awsui_marker--highlighted_1kjc7_qgpiu_255:not(#\9) {
257
+ .awsui_marker_1kjc7_1mp4w_153.awsui_marker--highlighted_1kjc7_1mp4w_257:not(#\9) {
256
258
  /* used in test utils */
257
259
  }
@@ -2,11 +2,11 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "marker": "awsui_marker_1kjc7_qgpiu_153",
6
- "root": "awsui_root_1kjc7_qgpiu_167",
7
- "title": "awsui_title_1kjc7_qgpiu_202",
8
- "list": "awsui_list_1kjc7_qgpiu_206",
9
- "marker--dimmed": "awsui_marker--dimmed_1kjc7_qgpiu_252",
10
- "marker--highlighted": "awsui_marker--highlighted_1kjc7_qgpiu_255"
5
+ "marker": "awsui_marker_1kjc7_1mp4w_153",
6
+ "root": "awsui_root_1kjc7_1mp4w_167",
7
+ "title": "awsui_title_1kjc7_1mp4w_202",
8
+ "list": "awsui_list_1kjc7_1mp4w_206",
9
+ "marker--dimmed": "awsui_marker--dimmed_1kjc7_1mp4w_254",
10
+ "marker--highlighted": "awsui_marker--highlighted_1kjc7_1mp4w_257"
11
11
  };
12
12
 
@@ -1,6 +1,6 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (ac811630)";
3
- export var GIT_SHA = "ac811630";
2
+ export var PACKAGE_VERSION = "3.0.0 (6db99848)";
3
+ export var GIT_SHA = "6db99848";
4
4
  export var THEME = "open-source-visual-refresh";
5
5
  export var SYSTEM = "core";
6
6
  export var ALWAYS_VISUAL_REFRESH = true;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "components",
3
- "PACKAGE_VERSION": "3.0.0 (ac811630)",
4
- "GIT_SHA": "ac811630",
3
+ "PACKAGE_VERSION": "3.0.0 (6db99848)",
4
+ "GIT_SHA": "6db99848",
5
5
  "THEME": "open-source-visual-refresh",
6
6
  "SYSTEM": "core",
7
7
  "ALWAYS_VISUAL_REFRESH": true,