@cloudscape-design/components 3.0.1341 → 3.0.1343

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 (200) 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/expandable-section/expandable-section-header.d.ts +3 -1
  11. package/expandable-section/expandable-section-header.d.ts.map +1 -1
  12. package/expandable-section/expandable-section-header.js +57 -13
  13. package/expandable-section/expandable-section-header.js.map +1 -1
  14. package/expandable-section/interfaces.d.ts +1 -1
  15. package/expandable-section/interfaces.js.map +1 -1
  16. package/expandable-section/internal.d.ts +15 -0
  17. package/expandable-section/internal.d.ts.map +1 -1
  18. package/expandable-section/internal.js +3 -3
  19. package/expandable-section/internal.js.map +1 -1
  20. package/expandable-section/styles.css.js +42 -35
  21. package/expandable-section/styles.scoped.css +177 -69
  22. package/expandable-section/styles.selectors.js +42 -35
  23. package/i18n/context.d.ts +16 -4
  24. package/i18n/context.d.ts.map +1 -1
  25. package/i18n/context.js +10 -4
  26. package/i18n/context.js.map +1 -1
  27. package/i18n/index.d.ts +3 -1
  28. package/i18n/index.d.ts.map +1 -1
  29. package/i18n/index.js +1 -0
  30. package/i18n/index.js.map +1 -1
  31. package/i18n/messages/all.all.js +1 -1
  32. package/i18n/messages/all.all.json +1 -1
  33. package/i18n/messages/all.ar.js +1 -1
  34. package/i18n/messages/all.ar.json +1 -1
  35. package/i18n/messages/all.de.js +1 -1
  36. package/i18n/messages/all.de.json +1 -1
  37. package/i18n/messages/all.en-GB.js +1 -1
  38. package/i18n/messages/all.en-GB.json +1 -1
  39. package/i18n/messages/all.en.js +1 -1
  40. package/i18n/messages/all.en.json +1 -1
  41. package/i18n/messages/all.es.js +1 -1
  42. package/i18n/messages/all.es.json +1 -1
  43. package/i18n/messages/all.fr.js +1 -1
  44. package/i18n/messages/all.fr.json +1 -1
  45. package/i18n/messages/all.id.js +1 -1
  46. package/i18n/messages/all.id.json +1 -1
  47. package/i18n/messages/all.it.js +1 -1
  48. package/i18n/messages/all.it.json +1 -1
  49. package/i18n/messages/all.ja.js +1 -1
  50. package/i18n/messages/all.ja.json +1 -1
  51. package/i18n/messages/all.ko.js +1 -1
  52. package/i18n/messages/all.ko.json +1 -1
  53. package/i18n/messages/all.pt-BR.js +1 -1
  54. package/i18n/messages/all.pt-BR.json +1 -1
  55. package/i18n/messages/all.tr.js +1 -1
  56. package/i18n/messages/all.tr.json +1 -1
  57. package/i18n/messages/all.zh-CN.js +1 -1
  58. package/i18n/messages/all.zh-CN.json +1 -1
  59. package/i18n/messages/all.zh-TW.js +1 -1
  60. package/i18n/messages/all.zh-TW.json +1 -1
  61. package/i18n/messages-types.d.ts +5 -0
  62. package/i18n/messages-types.d.ts.map +1 -1
  63. package/i18n/messages-types.js.map +1 -1
  64. package/input/index.d.ts.map +1 -1
  65. package/input/index.js +4 -2
  66. package/input/index.js.map +1 -1
  67. package/input/interfaces.d.ts +9 -0
  68. package/input/interfaces.d.ts.map +1 -1
  69. package/input/interfaces.js.map +1 -1
  70. package/input/internal.d.ts +5 -5
  71. package/input/internal.d.ts.map +1 -1
  72. package/input/internal.js +60 -24
  73. package/input/internal.js.map +1 -1
  74. package/input/styles.css.js +28 -18
  75. package/input/styles.scoped.css +213 -52
  76. package/input/styles.selectors.js +28 -18
  77. package/input/utils.js +3 -3
  78. package/input/utils.js.map +1 -1
  79. package/internal/base-component/styles.scoped.css +6 -1
  80. package/internal/components/chart-legend/styles.css.js +6 -6
  81. package/internal/components/chart-legend/styles.scoped.css +16 -14
  82. package/internal/components/chart-legend/styles.selectors.js +6 -6
  83. package/internal/environment.js +2 -2
  84. package/internal/environment.json +2 -2
  85. package/internal/generated/styles/tokens.d.ts +1 -0
  86. package/internal/generated/styles/tokens.js +1 -0
  87. package/internal/generated/theming/index.cjs +31 -0
  88. package/internal/generated/theming/index.js +31 -0
  89. package/internal/manifest.json +1 -1
  90. package/manifest.json +2 -2
  91. package/multiselect/embedded.d.ts +1 -1
  92. package/multiselect/index.d.ts.map +1 -1
  93. package/multiselect/index.js +4 -0
  94. package/multiselect/index.js.map +1 -1
  95. package/multiselect/interfaces.d.ts +8 -1
  96. package/multiselect/interfaces.d.ts.map +1 -1
  97. package/multiselect/interfaces.js.map +1 -1
  98. package/multiselect/internal.d.ts.map +1 -1
  99. package/multiselect/internal.js +22 -2
  100. package/multiselect/internal.js.map +1 -1
  101. package/multiselect/styles.css.js +5 -3
  102. package/multiselect/styles.scoped.css +13 -3
  103. package/multiselect/styles.selectors.js +5 -3
  104. package/multiselect/use-multiselect.d.ts +4 -1
  105. package/multiselect/use-multiselect.d.ts.map +1 -1
  106. package/multiselect/use-multiselect.js +5 -3
  107. package/multiselect/use-multiselect.js.map +1 -1
  108. package/package.json +1 -1
  109. package/pagination/index.d.ts.map +1 -1
  110. package/pagination/index.js +3 -3
  111. package/pagination/index.js.map +1 -1
  112. package/pagination/interfaces.d.ts +19 -3
  113. package/pagination/interfaces.d.ts.map +1 -1
  114. package/pagination/interfaces.js.map +1 -1
  115. package/pagination/internal.d.ts.map +1 -1
  116. package/pagination/internal.js +18 -6
  117. package/pagination/internal.js.map +1 -1
  118. package/pagination/styles.css.js +12 -11
  119. package/pagination/styles.scoped.css +34 -25
  120. package/pagination/styles.selectors.js +12 -11
  121. package/pagination/test-classes/styles.css.js +6 -0
  122. package/pagination/test-classes/styles.scoped.css +7 -0
  123. package/pagination/test-classes/styles.selectors.js +7 -0
  124. package/prompt-input/internal.d.ts.map +1 -1
  125. package/prompt-input/internal.js +14 -2
  126. package/prompt-input/internal.js.map +1 -1
  127. package/select/index.d.ts.map +1 -1
  128. package/select/index.js +4 -0
  129. package/select/index.js.map +1 -1
  130. package/select/interfaces.d.ts +39 -0
  131. package/select/interfaces.d.ts.map +1 -1
  132. package/select/interfaces.js.map +1 -1
  133. package/select/internal.d.ts.map +1 -1
  134. package/select/internal.js +20 -4
  135. package/select/internal.js.map +1 -1
  136. package/select/parts/filter.d.ts +1 -1
  137. package/select/parts/filter.d.ts.map +1 -1
  138. package/select/styles.css.js +3 -1
  139. package/select/styles.scoped.css +11 -1
  140. package/select/styles.selectors.js +3 -1
  141. package/select/utils/dropdown-customization.d.ts +26 -0
  142. package/select/utils/dropdown-customization.d.ts.map +1 -0
  143. package/select/utils/dropdown-customization.js +22 -0
  144. package/select/utils/dropdown-customization.js.map +1 -0
  145. package/select/utils/use-select.d.ts +5 -1
  146. package/select/utils/use-select.d.ts.map +1 -1
  147. package/select/utils/use-select.js +21 -4
  148. package/select/utils/use-select.js.map +1 -1
  149. package/side-navigation/parts.d.ts.map +1 -1
  150. package/side-navigation/parts.js +3 -2
  151. package/side-navigation/parts.js.map +1 -1
  152. package/side-navigation/styles.css.js +50 -48
  153. package/side-navigation/styles.scoped.css +106 -93
  154. package/side-navigation/styles.selectors.js +50 -48
  155. package/status-indicator/interfaces.d.ts +1 -1
  156. package/status-indicator/interfaces.d.ts.map +1 -1
  157. package/status-indicator/interfaces.js.map +1 -1
  158. package/status-indicator/internal.d.ts +2 -6
  159. package/status-indicator/internal.d.ts.map +1 -1
  160. package/status-indicator/internal.js.map +1 -1
  161. package/steps/interfaces.d.ts +2 -2
  162. package/steps/interfaces.d.ts.map +1 -1
  163. package/steps/interfaces.js.map +1 -1
  164. package/test-utils/dom/input/index.d.ts +2 -0
  165. package/test-utils/dom/input/index.js +6 -0
  166. package/test-utils/dom/input/index.js.map +1 -1
  167. package/test-utils/dom/multiselect/index.d.ts +16 -0
  168. package/test-utils/dom/multiselect/index.js +16 -0
  169. package/test-utils/dom/multiselect/index.js.map +1 -1
  170. package/test-utils/dom/pagination/index.d.ts +5 -1
  171. package/test-utils/dom/pagination/index.js +7 -0
  172. package/test-utils/dom/pagination/index.js.map +1 -1
  173. package/test-utils/dom/select/index.d.ts +16 -0
  174. package/test-utils/dom/select/index.js +16 -0
  175. package/test-utils/dom/select/index.js.map +1 -1
  176. package/test-utils/selectors/input/index.d.ts +2 -0
  177. package/test-utils/selectors/input/index.js +6 -0
  178. package/test-utils/selectors/input/index.js.map +1 -1
  179. package/test-utils/selectors/multiselect/index.d.ts +16 -0
  180. package/test-utils/selectors/multiselect/index.js +20 -0
  181. package/test-utils/selectors/multiselect/index.js.map +1 -1
  182. package/test-utils/selectors/pagination/index.d.ts +5 -1
  183. package/test-utils/selectors/pagination/index.js +7 -0
  184. package/test-utils/selectors/pagination/index.js.map +1 -1
  185. package/test-utils/selectors/select/index.d.ts +16 -0
  186. package/test-utils/selectors/select/index.js +20 -0
  187. package/test-utils/selectors/select/index.js.map +1 -1
  188. package/textarea/index.d.ts.map +1 -1
  189. package/textarea/index.js +11 -3
  190. package/textarea/index.js.map +1 -1
  191. package/textarea/interfaces.d.ts +12 -0
  192. package/textarea/interfaces.d.ts.map +1 -1
  193. package/textarea/interfaces.js.map +1 -1
  194. package/textarea/styles.css.js +9 -5
  195. package/textarea/styles.scoped.css +26 -14
  196. package/textarea/styles.selectors.js +9 -5
  197. package/status-indicator/internal-interfaces.d.ts +0 -2
  198. package/status-indicator/internal-interfaces.d.ts.map +0 -1
  199. package/status-indicator/internal-interfaces.js +0 -2
  200. 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_91eq2_145:not(#\9), .awsui_input_2rhyz_91eq2_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_91eq2_145:not(#\9):hover, .awsui_input_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-readonly_2rhyz_91eq2_158:not(#\9), .awsui_input_2rhyz_91eq2_145.awsui_input-readonly_2rhyz_91eq2_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_91eq2_145:not(#\9):focus-within, .awsui_input_2rhyz_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_145.awsui_input-readonly_2rhyz_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_145.awsui_input-invalid_2rhyz_91eq2_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_91eq2_145.awsui_input-invalid_2rhyz_91eq2_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_91eq2_145.awsui_input-invalid_2rhyz_91eq2_278.awsui_input-has-icon-start_2rhyz_91eq2_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_91eq2_145.awsui_input-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-warning_2rhyz_91eq2_290.awsui_input-has-icon-start_2rhyz_91eq2_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_91eq2_145.awsui_input-type-search_2rhyz_91eq2_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_91eq2_145.awsui_input-type-search_2rhyz_91eq2_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_91eq2_145.awsui_input-type-search_2rhyz_91eq2_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_91eq2_145.awsui_input-has-icon-start_2rhyz_91eq2_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_91eq2_145.awsui_input-has-icon-end_2rhyz_91eq2_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_91eq2_145.awsui_input-has-no-border-radius_2rhyz_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_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_91eq2_145.awsui_input-adorned-container-readonly_2rhyz_91eq2_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_91eq2_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_91eq2_145.awsui_input-adorned-container-invalid_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-invalid_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-invalid_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-adorned-container-disabled_2rhyz_91eq2_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_91eq2_439:not(#\9),
442
+ .awsui_input-suffix_2rhyz_91eq2_440:not(#\9) {
443
+ display: flex;
444
+ align-items: center;
445
+ flex-shrink: 1;
446
+ max-inline-size: calc(50% - 6rem);
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_91eq2_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_91eq2_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_91eq2_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_91eq2_145.awsui_input_2rhyz_91eq2_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_91eq2_145:not(#\9):hover {
492
+ border-color: transparent;
493
+ background-color: transparent;
494
+ }
495
+ .awsui_input-adorned_2rhyz_91eq2_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_91eq2_145.awsui_input-readonly_2rhyz_91eq2_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_91eq2_145.awsui_input-invalid_2rhyz_91eq2_278:not(#\9), .awsui_input-adorned_2rhyz_91eq2_145.awsui_input-warning_2rhyz_91eq2_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_91eq2_145.awsui_input-invalid_2rhyz_91eq2_278:not(#\9):focus, .awsui_input-adorned_2rhyz_91eq2_145.awsui_input-warning_2rhyz_91eq2_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_91eq2_404 > .awsui_input-prefix_2rhyz_91eq2_439:not(#\9),
522
+ .awsui_input-adorned-container-invalid_2rhyz_91eq2_404 > .awsui_input-adorned_2rhyz_91eq2_145:not(#\9):first-child,
523
+ .awsui_input-adorned-container-warning_2rhyz_91eq2_417 > .awsui_input-prefix_2rhyz_91eq2_439:not(#\9),
524
+ .awsui_input-adorned-container-warning_2rhyz_91eq2_417 > .awsui_input-adorned_2rhyz_91eq2_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_91eq2_404 > .awsui_input-prefix_2rhyz_91eq2_439:not(#\9),
528
+ .awsui_input-adorned-container-invalid_2rhyz_91eq2_404 > .awsui_input-suffix_2rhyz_91eq2_440:not(#\9),
529
+ .awsui_input-adorned-container-warning_2rhyz_91eq2_417 > .awsui_input-prefix_2rhyz_91eq2_439:not(#\9),
530
+ .awsui_input-adorned-container-warning_2rhyz_91eq2_417 > .awsui_input-suffix_2rhyz_91eq2_440:not(#\9) {
531
+ max-inline-size: calc(50% - 6rem + (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_91eq2_145",
6
+ "input": "awsui_input_2rhyz_91eq2_145",
7
+ "input-adorned-container-readonly": "awsui_input-adorned-container-readonly_2rhyz_91eq2_158",
8
+ "input-readonly": "awsui_input-readonly_2rhyz_91eq2_158",
9
+ "root": "awsui_root_2rhyz_91eq2_175",
10
+ "input-invalid": "awsui_input-invalid_2rhyz_91eq2_278",
11
+ "input-has-icon-start": "awsui_input-has-icon-start_2rhyz_91eq2_287",
12
+ "input-warning": "awsui_input-warning_2rhyz_91eq2_290",
13
+ "input-type-search": "awsui_input-type-search_2rhyz_91eq2_302",
14
+ "input-has-icon-end": "awsui_input-has-icon-end_2rhyz_91eq2_315",
15
+ "input-has-no-border-radius": "awsui_input-has-no-border-radius_2rhyz_91eq2_318",
16
+ "input-container": "awsui_input-container_2rhyz_91eq2_325",
17
+ "input-icon-start": "awsui_input-icon-start_2rhyz_91eq2_330",
18
+ "input-icon-end": "awsui_input-icon-end_2rhyz_91eq2_337",
19
+ "input-button-right": "awsui_input-button-right_2rhyz_91eq2_343",
20
+ "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_2rhyz_91eq2_347",
21
+ "inline-label-trigger-wrapper-full-width": "awsui_inline-label-trigger-wrapper-full-width_2rhyz_91eq2_350",
22
+ "inline-label-wrapper": "awsui_inline-label-wrapper_2rhyz_91eq2_354",
23
+ "inline-label-wrapper-full-width": "awsui_inline-label-wrapper-full-width_2rhyz_91eq2_357",
24
+ "inline-label": "awsui_inline-label_2rhyz_91eq2_347",
25
+ "input-adorned-container-invalid": "awsui_input-adorned-container-invalid_2rhyz_91eq2_404",
26
+ "input-adorned-container-warning": "awsui_input-adorned-container-warning_2rhyz_91eq2_417",
27
+ "input-adorned-container-disabled": "awsui_input-adorned-container-disabled_2rhyz_91eq2_430",
28
+ "input-prefix": "awsui_input-prefix_2rhyz_91eq2_439",
29
+ "input-suffix": "awsui_input-suffix_2rhyz_91eq2_440",
30
+ "input-adornment-content": "awsui_input-adornment-content_2rhyz_91eq2_453",
31
+ "input-adornment-divider": "awsui_input-adornment-divider_2rhyz_91eq2_462",
32
+ "input-adorned": "awsui_input-adorned_2rhyz_91eq2_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"]}
@@ -317,6 +317,7 @@
317
317
  --color-background-item-selected-9gppru:var(--color-primary-50-1y05xv);
318
318
  --color-background-side-navigation-item-active-adfprg:transparent;
319
319
  --color-background-side-navigation-item-active-collapsed-ceubmy:var(--color-background-control-checked-ka7kc2);
320
+ --color-background-side-navigation-item-icon-hover-ul9ia1:var(--color-primary-50-1y05xv);
320
321
  --color-background-layout-main-5ilwcb:var(--color-white-p1zlvy);
321
322
  --color-background-layout-ai-drawer-b4mvv3:var(--color-neutral-850-3f0gro);
322
323
  --color-background-drawer-5hs0eh:var(--color-background-layout-panel-content-xto15e);
@@ -1125,6 +1126,7 @@
1125
1126
  --color-background-input-default-ifz5bb:var(--color-neutral-850-3f0gro);
1126
1127
  --color-background-input-disabled-dihaja:var(--color-neutral-800-t7j5ap);
1127
1128
  --color-background-item-selected-9gppru:var(--color-primary-1000-7umopx);
1129
+ --color-background-side-navigation-item-icon-hover-ul9ia1:var(--color-neutral-700-qw8ats);
1128
1130
  --color-background-layout-main-5ilwcb:var(--color-neutral-850-3f0gro);
1129
1131
  --color-background-layout-panel-hover-tguulw:var(--color-neutral-700-qw8ats);
1130
1132
  --color-background-layout-toggle-selected-active-zcl8w3:var(--color-primary-400-n8h4bx);
@@ -1447,6 +1449,7 @@
1447
1449
  --color-background-input-default-ifz5bb:var(--color-neutral-850-3f0gro);
1448
1450
  --color-background-input-disabled-dihaja:var(--color-neutral-800-t7j5ap);
1449
1451
  --color-background-item-selected-9gppru:var(--color-primary-1000-7umopx);
1452
+ --color-background-side-navigation-item-icon-hover-ul9ia1:var(--color-neutral-700-qw8ats);
1450
1453
  --color-background-layout-main-5ilwcb:var(--color-neutral-850-3f0gro);
1451
1454
  --color-background-layout-panel-hover-tguulw:var(--color-neutral-700-qw8ats);
1452
1455
  --color-background-layout-toggle-selected-active-zcl8w3:var(--color-primary-400-n8h4bx);
@@ -1756,6 +1759,7 @@
1756
1759
  --color-background-input-default-ifz5bb:var(--color-neutral-950-lxybh8);
1757
1760
  --color-background-input-disabled-dihaja:var(--color-neutral-800-t7j5ap);
1758
1761
  --color-background-item-selected-9gppru:var(--color-primary-1000-7umopx);
1762
+ --color-background-side-navigation-item-icon-hover-ul9ia1:var(--color-neutral-700-qw8ats);
1759
1763
  --color-background-layout-main-5ilwcb:var(--color-neutral-950-lxybh8);
1760
1764
  --color-background-layout-panel-hover-tguulw:var(--color-neutral-700-qw8ats);
1761
1765
  --color-background-layout-toggle-selected-active-zcl8w3:var(--color-primary-400-n8h4bx);
@@ -2262,6 +2266,7 @@
2262
2266
  --color-background-input-default-ifz5bb:var(--color-neutral-850-3f0gro);
2263
2267
  --color-background-input-disabled-dihaja:var(--color-neutral-800-t7j5ap);
2264
2268
  --color-background-item-selected-9gppru:var(--color-primary-1000-7umopx);
2269
+ --color-background-side-navigation-item-icon-hover-ul9ia1:var(--color-neutral-700-qw8ats);
2265
2270
  --color-background-layout-main-5ilwcb:var(--color-neutral-850-3f0gro);
2266
2271
  --color-background-layout-panel-hover-tguulw:var(--color-neutral-700-qw8ats);
2267
2272
  --color-background-layout-toggle-selected-active-zcl8w3:var(--color-primary-400-n8h4bx);
@@ -2606,5 +2611,5 @@
2606
2611
  }
2607
2612
  }
2608
2613
  :root {
2609
- --awsui-version-info-154aba5d: true;
2614
+ --awsui-version-info-2041ec8f: true;
2610
2615
  }
@@ -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
  }