@aws-amplify/ui 3.9.2 → 3.11.0

package/dist/theme.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 24 May 2022 22:52:46 GMT
+ * Generated on Fri, 17 Jun 2022 21:04:04 GMT
  */
 
 :root, [data-amplify-theme] {
@@ -360,6 +360,7 @@
   --amplify-colors-font-warning: var(--amplify-colors-orange-90);
   --amplify-colors-font-info: var(--amplify-colors-blue-90);
   --amplify-colors-font-inverse: var(--amplify-colors-white);
+  --amplify-colors-font-disabled: var(--amplify-colors-neutral-60);
   --amplify-colors-font-tertiary: var(--amplify-colors-neutral-80);
   --amplify-colors-font-secondary: var(--amplify-colors-neutral-90);
   --amplify-colors-font-primary: var(--amplify-colors-neutral-100);
@@ -390,9 +391,6 @@
   --amplify-components-togglebutton-link-hover-background-color: var(--amplify-colors-transparent);
   --amplify-components-togglebutton-link-color: var(--amplify-colors-overlay-50);
   --amplify-components-togglebutton-link-background-color: var(--amplify-colors-transparent);
-  --amplify-components-togglebutton-primary-pressed-hover-color: var(--amplify-colors-white);
-  --amplify-components-togglebutton-primary-pressed-focus-color: var(--amplify-colors-white);
-  --amplify-components-togglebutton-primary-pressed-color: var(--amplify-colors-white);
   --amplify-components-togglebutton-primary-hover-background-color: var(--amplify-colors-overlay-10);
   --amplify-components-togglebutton-primary-focus-background-color: var(--amplify-colors-transparent);
   --amplify-components-togglebutton-primary-border-width: var(--amplify-border-widths-small);
@@ -445,6 +443,7 @@
   --amplify-components-sliderfield-padding-block: var(--amplify-space-xs);
   --amplify-components-select-icon-wrapper-right: var(--amplify-space-medium);
   --amplify-components-select-padding-inline-end: var(--amplify-space-xxl);
+  --amplify-components-searchfield-button-disabled-background-color: var(--amplify-components-button-disabled-background-color);
   --amplify-components-rating-small-size: var(--amplify-font-sizes-small);
   --amplify-components-rating-default-size: var(--amplify-font-sizes-xl);
   --amplify-components-rating-large-size: var(--amplify-font-sizes-xxxl);
@@ -457,8 +456,6 @@
   --amplify-components-radio-button-outline-width: var(--amplify-outline-widths-medium);
   --amplify-components-radio-button-outline-color: var(--amplify-colors-transparent);
   --amplify-components-radio-button-transition-duration: var(--amplify-time-medium);
-  --amplify-components-radio-button-background-color: var(--amplify-colors-white);
-  --amplify-components-radio-button-color: var(--amplify-colors-white);
   --amplify-components-radio-button-border-width: var(--amplify-border-widths-medium);
   --amplify-components-radio-button-height: var(--amplify-font-sizes-medium);
   --amplify-components-radio-button-width: var(--amplify-font-sizes-medium);
@@ -467,6 +464,7 @@
   --amplify-components-placeholder-small-height: var(--amplify-space-small);
   --amplify-components-placeholder-transition-duration: var(--amplify-time-long);
   --amplify-components-placeholder-border-radius: var(--amplify-radii-small);
+  --amplify-components-passwordfield-button-disabled-background-color: var(--amplify-components-button-disabled-background-color);
   --amplify-components-pagination-item-shared-border-radius: var(--amplify-font-sizes-medium);
   --amplify-components-pagination-item-shared-min-width: var(--amplify-font-sizes-xxl);
   --amplify-components-pagination-item-shared-height: var(--amplify-font-sizes-xxl);
@@ -480,7 +478,6 @@
   --amplify-components-pagination-button-padding-inline-start: var(--amplify-space-xxs);
   --amplify-components-pagination-current-background-color: var(--amplify-colors-overlay-40);
   --amplify-components-pagination-current-font-size: var(--amplify-font-sizes-small);
-  --amplify-components-pagination-current-color: var(--amplify-colors-white);
   --amplify-components-menu-item-padding-inline-end: var(--amplify-space-medium);
   --amplify-components-menu-item-padding-inline-start: var(--amplify-space-medium);
   --amplify-components-menu-large-height: var(--amplify-font-sizes-xxxl);
@@ -490,7 +487,6 @@
   --amplify-components-menu-gap: var(--amplify-space-zero);
   --amplify-components-menu-border-width: var(--amplify-border-widths-small);
   --amplify-components-menu-border-radius: var(--amplify-radii-medium);
-  --amplify-components-menu-background-color: var(--amplify-colors-white);
   --amplify-components-loader-linear-large-font-size: var(--amplify-font-sizes-large);
   --amplify-components-loader-linear-large-stroke-width: var(--amplify-font-sizes-large);
   --amplify-components-loader-linear-small-font-size: var(--amplify-font-sizes-small);
@@ -572,7 +568,6 @@
   --amplify-components-expander-item-border-bottom-right-radius: var(--amplify-radii-medium);
   --amplify-components-expander-item-border-bottom-left-radius: var(--amplify-radii-medium);
   --amplify-components-expander-border-radius: var(--amplify-radii-medium);
-  --amplify-components-expander-background-color: var(--amplify-colors-white);
   --amplify-components-divider-opacity: var(--amplify-opacities-60);
   --amplify-components-divider-large-border-width: var(--amplify-border-widths-large);
   --amplify-components-divider-small-border-width: var(--amplify-border-widths-small);
@@ -594,7 +589,6 @@
   --amplify-components-checkbox-button-focus-outline-width: var(--amplify-outline-widths-medium);
   --amplify-components-checkbox-button-focus-outline-color: var(--amplify-colors-transparent);
   --amplify-components-checkbox-button-before-border-width: var(--amplify-border-widths-medium);
-  --amplify-components-checkbox-button-color: var(--amplify-colors-white);
   --amplify-components-card-elevated-border-radius: var(--amplify-radii-xs);
   --amplify-components-card-outlined-box-shadow: var(--amplify-components-card-box-shadow);
   --amplify-components-card-outlined-border-width: var(--amplify-border-widths-small);
@@ -640,15 +634,20 @@
   --amplify-colors-font-focus: var(--amplify-colors-brand-primary-100);
   --amplify-colors-font-hover: var(--amplify-colors-brand-primary-90);
   --amplify-colors-font-interactive: var(--amplify-colors-brand-primary-80);
-  --amplify-colors-font-disabled: var(--amplify-colors-font-tertiary);
+  --amplify-components-togglebutton-link-disabled-color: var(--amplify-colors-font-disabled);
+  --amplify-components-togglebutton-primary-pressed-hover-color: var(--amplify-colors-background-primary);
   --amplify-components-togglebutton-primary-pressed-hover-box-shadow: var(--amplify-colors-brand-primary-60);
   --amplify-components-togglebutton-primary-pressed-hover-background-color: var(--amplify-colors-brand-primary-60);
   --amplify-components-togglebutton-primary-pressed-hover-border-color: var(--amplify-colors-brand-primary-60);
+  --amplify-components-togglebutton-primary-pressed-focus-color: var(--amplify-colors-background-primary);
+  --amplify-components-togglebutton-primary-pressed-color: var(--amplify-colors-background-primary);
   --amplify-components-togglebutton-primary-pressed-border-color: var(--amplify-colors-brand-primary-80);
   --amplify-components-togglebutton-primary-pressed-background-color: var(--amplify-colors-brand-primary-80);
+  --amplify-components-togglebutton-primary-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-togglebutton-primary-hover-color: var(--amplify-colors-font-primary);
   --amplify-components-togglebutton-primary-focus-color: var(--amplify-colors-font-primary);
   --amplify-components-togglebutton-pressed-color: var(--amplify-colors-font-primary);
+  --amplify-components-togglebutton-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-togglebutton-focus-color: var(--amplify-colors-font-primary);
   --amplify-components-togglebutton-color: var(--amplify-colors-font-primary);
   --amplify-components-togglebutton-border-color: var(--amplify-colors-border-primary);
@@ -661,6 +660,7 @@
   --amplify-components-text-primary-color: var(--amplify-colors-font-primary);
   --amplify-components-text-color: var(--amplify-colors-font-primary);
   --amplify-components-tabs-item-disabled-border-color: var(--amplify-colors-border-tertiary);
+  --amplify-components-tabs-item-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-tabs-item-color: var(--amplify-colors-font-secondary);
   --amplify-components-tabs-item-border-color: var(--amplify-colors-border-secondary);
   --amplify-components-tabs-border-color: var(--amplify-colors-border-secondary);
@@ -684,16 +684,22 @@
   --amplify-components-select-option-background-color: var(--amplify-colors-background-primary);
   --amplify-components-rating-empty-color: var(--amplify-colors-background-tertiary);
   --amplify-components-rating-filled-color: var(--amplify-colors-brand-secondary-80);
+  --amplify-components-radio-label-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-radio-button-disabled-background-color: var(--amplify-colors-background-primary);
   --amplify-components-radio-button-error-border-color: var(--amplify-colors-border-error);
   --amplify-components-radio-button-checked-color: var(--amplify-colors-brand-primary-80);
+  --amplify-components-radio-button-background-color: var(--amplify-colors-background-primary);
+  --amplify-components-radio-button-color: var(--amplify-colors-background-primary);
   --amplify-components-radio-button-border-color: var(--amplify-colors-border-primary);
   --amplify-components-placeholder-end-color: var(--amplify-colors-background-tertiary);
   --amplify-components-placeholder-start-color: var(--amplify-colors-background-secondary);
+  --amplify-components-pagination-button-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-pagination-button-hover-color: var(--amplify-colors-font-primary);
   --amplify-components-pagination-button-color: var(--amplify-colors-font-primary);
+  --amplify-components-pagination-current-color: var(--amplify-colors-font-inverse);
   --amplify-components-menu-box-shadow: var(--amplify-shadows-large);
   --amplify-components-menu-border-color: var(--amplify-colors-border-primary);
+  --amplify-components-menu-background-color: var(--amplify-colors-background-primary);
   --amplify-components-loader-text-fill: var(--amplify-colors-font-primary);
   --amplify-components-loader-linear-stroke-filled: var(--amplify-colors-brand-primary-80);
   --amplify-components-loader-stroke-filled: var(--amplify-colors-brand-primary-80);
@@ -702,6 +708,7 @@
   --amplify-components-fieldmessages-error-color: var(--amplify-colors-font-error);
   --amplify-components-fieldcontrol-error-focus-box-shadow: 0px 0px 0px 1px var(--amplify-colors-border-error);
   --amplify-components-fieldcontrol-error-border-color: var(--amplify-colors-border-error);
+  --amplify-components-fieldcontrol-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-fieldcontrol-quiet-error-focus-box-shadow: 0px 1px 0px  var(--amplify-colors-border-error);
   --amplify-components-fieldcontrol-quiet-error-border-block-end-color: var(--amplify-colors-border-error);
   --amplify-components-fieldcontrol-large-font-size: var(--amplify-components-field-large-font-size);
@@ -713,14 +720,20 @@
   --amplify-components-expander-content-text-color: var(--amplify-colors-font-secondary);
   --amplify-components-expander-item-box-shadow: var(--amplify-shadows-small);
   --amplify-components-expander-box-shadow: var(--amplify-shadows-large);
+  --amplify-components-expander-background-color: var(--amplify-colors-background-primary);
   --amplify-components-divider-label-background-color: var(--amplify-colors-background-primary);
   --amplify-components-divider-label-color: var(--amplify-colors-font-tertiary);
   --amplify-components-divider-border-color: var(--amplify-colors-border-primary);
   --amplify-components-copy-svg-path-fill: var(--amplify-colors-font-primary);
+  --amplify-components-collection-search-button-disabled-background-color: var(--amplify-components-searchfield-button-disabled-background-color);
+  --amplify-components-collection-pagination-button-hover-background-color: var(--amplify-components-pagination-button-hover-background-color);
+  --amplify-components-collection-pagination-current-background-color: var(--amplify-components-pagination-current-background-color);
+  --amplify-components-checkbox-label-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-checkbox-icon-background-color: var(--amplify-colors-brand-primary-80);
   --amplify-components-checkbox-button-error-focus-box-shadow: 0px 0px 0px 2px var(--amplify-colors-border-error);
   --amplify-components-checkbox-button-error-border-color: var(--amplify-colors-border-error);
   --amplify-components-checkbox-button-before-border-color: var(--amplify-colors-border-primary);
+  --amplify-components-checkbox-button-color: var(--amplify-colors-font-inverse);
   --amplify-components-card-elevated-box-shadow: var(--amplify-shadows-medium);
   --amplify-components-card-outlined-border-color: var(--amplify-colors-border-primary);
   --amplify-components-card-background-color: var(--amplify-colors-background-primary);
@@ -732,9 +745,12 @@
   --amplify-components-button-small-padding-inline-start: var(--amplify-components-fieldcontrol-small-padding-inline-start);
   --amplify-components-button-small-padding-block-end: var(--amplify-components-fieldcontrol-small-padding-block-end);
   --amplify-components-button-small-padding-block-start: var(--amplify-components-fieldcontrol-small-padding-block-start);
+  --amplify-components-button-link-loading-color: var(--amplify-colors-font-disabled);
+  --amplify-components-button-link-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-link-active-background-color: var(--amplify-colors-brand-primary-20);
   --amplify-components-button-link-focus-background-color: var(--amplify-colors-brand-primary-10);
   --amplify-components-button-link-hover-background-color: var(--amplify-colors-brand-primary-10);
+  --amplify-components-button-menu-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-menu-active-background-color: var(--amplify-colors-brand-primary-90);
   --amplify-components-button-menu-active-color: var(--amplify-colors-font-inverse);
   --amplify-components-button-menu-focus-background-color: var(--amplify-colors-brand-primary-80);
@@ -747,10 +763,14 @@
   --amplify-components-button-primary-focus-background-color: var(--amplify-colors-brand-primary-90);
   --amplify-components-button-primary-hover-color: var(--amplify-colors-font-inverse);
   --amplify-components-button-primary-hover-background-color: var(--amplify-colors-brand-primary-90);
+  --amplify-components-button-primary-loading-color: var(--amplify-colors-font-disabled);
+  --amplify-components-button-primary-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-primary-color: var(--amplify-colors-font-inverse);
   --amplify-components-button-primary-background-color: var(--amplify-colors-brand-primary-80);
   --amplify-components-button-disabled-border-color: var(--amplify-colors-border-tertiary);
+  --amplify-components-button-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-loading-border-color: var(--amplify-colors-border-tertiary);
+  --amplify-components-button-loading-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-active-border-color: var(--amplify-colors-brand-primary-100);
   --amplify-components-button-active-background-color: var(--amplify-colors-brand-primary-20);
   --amplify-components-button-focus-background-color: var(--amplify-colors-brand-primary-10);
@@ -790,18 +810,18 @@
   --amplify-components-alert-info-color: var(--amplify-colors-font-info);
   --amplify-components-alert-background-color: var(--amplify-colors-background-tertiary);
   --amplify-components-alert-color: var(--amplify-colors-font-primary);
-  --amplify-components-togglebutton-link-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-togglebutton-primary-pressed-focus-border-color: var(--amplify-colors-border-focus);
   --amplify-components-togglebutton-primary-pressed-focus-background-color: var(--amplify-colors-border-focus);
-  --amplify-components-togglebutton-primary-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-togglebutton-primary-disabled-background-color: var(--amplify-colors-background-disabled);
   --amplify-components-togglebutton-primary-disabled-border-color: var(--amplify-colors-border-disabled);
   --amplify-components-togglebutton-primary-focus-border-color: var(--amplify-colors-border-focus);
   --amplify-components-togglebutton-pressed-border-color: var(--amplify-colors-border-pressed);
-  --amplify-components-togglebutton-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-togglebutton-disabled-border-color: var(--amplify-colors-border-disabled);
   --amplify-components-togglebutton-focus-border-color: var(--amplify-colors-border-focus);
-  --amplify-components-tabs-item-disabled-color: var(--amplify-colors-font-disabled);
+  --amplify-components-textfield-border-color: var(--amplify-components-fieldcontrol-border-color);
+  --amplify-components-textfield-color: var(--amplify-components-fieldcontrol-color);
+  --amplify-components-textareafield-border-color: var(--amplify-components-fieldcontrol-border-color);
+  --amplify-components-textareafield-color: var(--amplify-components-fieldcontrol-color);
   --amplify-components-tabs-item-active-border-color: var(--amplify-colors-font-interactive);
   --amplify-components-tabs-item-active-color: var(--amplify-colors-font-interactive);
   --amplify-components-tabs-item-focus-color: var(--amplify-colors-font-focus);
@@ -812,25 +832,43 @@
   --amplify-components-sliderfield-thumb-hover-border-color: var(--amplify-colors-border-focus);
   --amplify-components-sliderfield-thumb-disabled-background-color: var(--amplify-colors-background-disabled);
   --amplify-components-sliderfield-range-disabled-background-color: var(--amplify-colors-background-disabled);
-  --amplify-components-radio-label-disabled-color: var(--amplify-colors-font-disabled);
+  --amplify-components-searchfield-button-hover-border-color: var(--amplify-components-button-hover-border-color);
+  --amplify-components-searchfield-button-hover-background-color: var(--amplify-components-button-hover-background-color);
+  --amplify-components-searchfield-button-focus-background-color: var(--amplify-components-button-focus-background-color);
+  --amplify-components-searchfield-button-disabled-color: var(--amplify-components-button-disabled-color);
+  --amplify-components-searchfield-button-disabled-border-color: var(--amplify-components-button-disabled-border-color);
+  --amplify-components-searchfield-button-active-border-color: var(--amplify-components-button-active-border-color);
+  --amplify-components-searchfield-button-active-background-color: var(--amplify-components-button-active-background-color);
+  --amplify-components-searchfield-button-color: var(--amplify-components-button-color);
+  --amplify-components-searchfield-color: var(--amplify-components-fieldcontrol-color);
   --amplify-components-radio-button-disabled-border-color: var(--amplify-colors-border-disabled);
   --amplify-components-radio-button-error-focus-box-shadow: var(--amplify-components-fieldcontrol-error-focus-box-shadow);
   --amplify-components-radio-button-focus-border-color: var(--amplify-colors-border-focus);
   --amplify-components-radio-button-checked-disabled-color: var(--amplify-colors-background-disabled);
-  --amplify-components-pagination-button-disabled-color: var(--amplify-colors-font-disabled);
+  --amplify-components-passwordfield-button-hover-border-color: var(--amplify-components-button-hover-border-color);
+  --amplify-components-passwordfield-button-hover-background-color: var(--amplify-components-button-hover-background-color);
+  --amplify-components-passwordfield-button-focus-background-color: var(--amplify-components-button-focus-background-color);
+  --amplify-components-passwordfield-button-disabled-color: var(--amplify-components-button-disabled-color);
+  --amplify-components-passwordfield-button-disabled-border-color: var(--amplify-components-button-disabled-border-color);
+  --amplify-components-passwordfield-button-active-border-color: var(--amplify-components-button-active-border-color);
+  --amplify-components-passwordfield-button-active-background-color: var(--amplify-components-button-active-background-color);
+  --amplify-components-passwordfield-button-color: var(--amplify-components-button-color);
+  --amplify-components-passwordfield-color: var(--amplify-components-fieldcontrol-color);
   --amplify-components-link-visited-color: var(--amplify-colors-font-interactive);
   --amplify-components-link-hover-color: var(--amplify-colors-font-hover);
   --amplify-components-link-focus-color: var(--amplify-colors-font-focus);
   --amplify-components-link-color: var(--amplify-colors-font-interactive);
   --amplify-components-link-active-color: var(--amplify-colors-font-active);
   --amplify-components-fieldcontrol-disabled-background-color: var(--amplify-colors-background-disabled);
-  --amplify-components-fieldcontrol-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-fieldcontrol-focus-box-shadow: 0px 0px 0px 1px var(--amplify-colors-border-focus);
   --amplify-components-fieldcontrol-focus-border-color: var(--amplify-colors-border-focus);
   --amplify-components-fieldcontrol-quiet-focus-box-shadow: 0px 1px 0px  var(--amplify-colors-border-focus);
   --amplify-components-fieldcontrol-quiet-focus-border-block-end-color: var(--amplify-colors-border-focus);
   --amplify-components-expander-item-focus-box-shadow: 0 0 0 2px var(--amplify-colors-border-focus);
-  --amplify-components-checkbox-label-disabled-color: var(--amplify-colors-font-disabled);
+  --amplify-components-collection-pagination-button-disabled-color: var(--amplify-components-pagination-button-disabled-color);
+  --amplify-components-collection-pagination-button-hover-color: var(--amplify-components-pagination-button-hover-color);
+  --amplify-components-collection-pagination-button-color: var(--amplify-components-pagination-button-color);
+  --amplify-components-collection-pagination-current-color: var(--amplify-components-pagination-current-color);
   --amplify-components-checkbox-icon-checked-disabled-background-color: var(--amplify-colors-background-disabled);
   --amplify-components-checkbox-button-disabled-border-color: var(--amplify-colors-border-disabled);
   --amplify-components-checkbox-button-focus-box-shadow: 0px 0px 0px 2px var(--amplify-colors-border-focus);
@@ -838,19 +876,12 @@
   --amplify-components-card-outlined-background-color: var(--amplify-components-card-background-color);
   --amplify-components-button-large-font-size: var(--amplify-components-fieldcontrol-large-font-size);
   --amplify-components-button-small-font-size: var(--amplify-components-fieldcontrol-small-font-size);
-  --amplify-components-button-link-loading-color: var(--amplify-colors-font-disabled);
-  --amplify-components-button-link-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-link-active-color: var(--amplify-colors-font-active);
   --amplify-components-button-link-focus-color: var(--amplify-colors-font-focus);
   --amplify-components-button-link-hover-color: var(--amplify-colors-font-hover);
   --amplify-components-button-link-color: var(--amplify-colors-font-interactive);
-  --amplify-components-button-menu-disabled-color: var(--amplify-colors-font-disabled);
-  --amplify-components-button-primary-loading-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-primary-loading-background-color: var(--amplify-colors-background-disabled);
-  --amplify-components-button-primary-disabled-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-primary-disabled-background-color: var(--amplify-colors-background-disabled);
-  --amplify-components-button-disabled-color: var(--amplify-colors-font-disabled);
-  --amplify-components-button-loading-color: var(--amplify-colors-font-disabled);
   --amplify-components-button-active-color: var(--amplify-colors-font-active);
   --amplify-components-button-focus-border-color: var(--amplify-colors-border-focus);
   --amplify-components-button-focus-color: var(--amplify-colors-font-focus);
@@ -858,8 +889,31 @@
   --amplify-components-button-border-color: var(--amplify-components-fieldcontrol-border-color);
   --amplify-components-button-font-size: var(--amplify-components-fieldcontrol-font-size);
   --amplify-components-togglebutton-primary-focus-box-shadow: var(--amplify-components-fieldcontrol-focus-box-shadow);
+  --amplify-components-textfield-focus-border-color: var(--amplify-components-fieldcontrol-focus-border-color);
+  --amplify-components-textareafield-focus-border-color: var(--amplify-components-fieldcontrol-focus-border-color);
+  --amplify-components-searchfield-button-hover-color: var(--amplify-components-button-hover-color);
+  --amplify-components-searchfield-button-focus-color: var(--amplify-components-button-focus-color);
+  --amplify-components-searchfield-button-focus-border-color: var(--amplify-components-button-focus-border-color);
+  --amplify-components-searchfield-button-active-color: var(--amplify-components-button-active-color);
   --amplify-components-radio-button-focus-box-shadow: var(--amplify-components-fieldcontrol-focus-box-shadow);
+  --amplify-components-passwordfield-button-hover-color: var(--amplify-components-button-hover-color);
+  --amplify-components-passwordfield-button-focus-color: var(--amplify-components-button-focus-color);
+  --amplify-components-passwordfield-button-focus-border-color: var(--amplify-components-button-focus-border-color);
+  --amplify-components-passwordfield-button-active-color: var(--amplify-components-button-active-color);
+  --amplify-components-collection-search-button-hover-border-color: var(--amplify-components-searchfield-button-hover-border-color);
+  --amplify-components-collection-search-button-hover-background-color: var(--amplify-components-searchfield-button-hover-background-color);
+  --amplify-components-collection-search-button-focus-background-color: var(--amplify-components-searchfield-button-focus-background-color);
+  --amplify-components-collection-search-button-disabled-color: var(--amplify-components-searchfield-button-disabled-color);
+  --amplify-components-collection-search-button-disabled-border-color: var(--amplify-components-searchfield-button-disabled-border-color);
+  --amplify-components-collection-search-button-active-border-color: var(--amplify-components-searchfield-button-active-border-color);
+  --amplify-components-collection-search-button-active-background-color: var(--amplify-components-searchfield-button-active-background-color);
+  --amplify-components-collection-search-button-color: var(--amplify-components-searchfield-button-color);
+  --amplify-components-collection-search-input-color: var(--amplify-components-searchfield-color);
   --amplify-components-button-link-focus-box-shadow: var(--amplify-components-fieldcontrol-focus-box-shadow);
   --amplify-components-button-primary-focus-box-shadow: var(--amplify-components-fieldcontrol-focus-box-shadow);
   --amplify-components-button-focus-box-shadow: var(--amplify-components-fieldcontrol-focus-box-shadow);
+  --amplify-components-collection-search-button-hover-color: var(--amplify-components-searchfield-button-hover-color);
+  --amplify-components-collection-search-button-focus-color: var(--amplify-components-searchfield-button-focus-color);
+  --amplify-components-collection-search-button-focus-border-color: var(--amplify-components-searchfield-button-focus-border-color);
+  --amplify-components-collection-search-button-active-color: var(--amplify-components-searchfield-button-active-color);
 }

package/dist/types/helpers/authenticator/constants.d.ts

@@ -3,3 +3,9 @@
  */
 import { DefaultFormFieldOptions } from '../../types';
 export declare const defaultFormFieldOptions: DefaultFormFieldOptions;
+/**
+ * List of special characters that Cognito allows.
+ *
+ * Adapted from https://docs.aws.amazon.com/cognito/latest/developerguide/user-pool-settings-policies.html
+ */
+export declare const ALLOWED_SPECIAL_CHARACTERS: string[];

package/dist/types/helpers/authenticator/utils.d.ts

@@ -15,3 +15,4 @@ export declare const defaultAuthHubHandler: HubHandler;
  * @returns function that unsubscribes to the hub evenmt
  */
 export declare const listenToAuthHub: (service: AuthInterpreter, handler?: HubHandler) => () => void;
+export declare const hasSpecialChars: (password: string) => boolean;

package/dist/types/machines/authenticator/actors/resetPassword.d.ts

@@ -6,24 +6,4 @@ export declare type ResetPasswordMachineOptions = {
 export declare function resetPasswordActor({ services }: ResetPasswordMachineOptions): import("xstate").StateMachine<ResetPasswordContext, any, AuthEvent, {
     value: any;
     context: ResetPasswordContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").TypegenDisabled & {
-    missingImplementations: {
-        actions: never;
-        delays: never;
-        guards: never;
-        services: never;
-    };
-} & {
-    eventsCausingActions: Record<string, string>;
-    eventsCausingDelays: Record<string, string>;
-    eventsCausingGuards: Record<string, string>;
-    eventsCausingServices: Record<string, string>;
-} & {
-    indexedActions: import("xstate").IndexByType<import("xstate").BaseActionObject>;
-    indexedEvents: Record<string, AuthEvent> & {
-        __XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__: {
-            data: any;
-        };
-    };
-    invokeSrcNameMap: Record<string, "__XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__">;
-}>;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, AuthEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

package/dist/types/machines/authenticator/actors/signIn.d.ts

@@ -6,24 +6,4 @@ export declare type SignInMachineOptions = {
 export declare function signInActor({ services }: SignInMachineOptions): import("xstate").StateMachine<SignInContext, any, AuthEvent, {
     value: any;
     context: SignInContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").TypegenDisabled & {
-    missingImplementations: {
-        actions: never;
-        delays: never;
-        guards: never;
-        services: never;
-    };
-} & {
-    eventsCausingActions: Record<string, string>;
-    eventsCausingDelays: Record<string, string>;
-    eventsCausingGuards: Record<string, string>;
-    eventsCausingServices: Record<string, string>;
-} & {
-    indexedActions: import("xstate").IndexByType<import("xstate").BaseActionObject>;
-    indexedEvents: Record<string, AuthEvent> & {
-        __XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__: {
-            data: any;
-        };
-    };
-    invokeSrcNameMap: Record<string, "__XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__">;
-}>;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, AuthEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

package/dist/types/machines/authenticator/actors/signOut.d.ts

@@ -2,24 +2,4 @@ import { AuthEvent, SignOutContext } from '../../../types';
 export declare const signOutActor: import("xstate").StateMachine<SignOutContext, any, AuthEvent, {
     value: any;
     context: SignOutContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").TypegenDisabled & {
-    missingImplementations: {
-        actions: never;
-        delays: never;
-        guards: never;
-        services: never;
-    };
-} & {
-    eventsCausingActions: Record<string, string>;
-    eventsCausingDelays: Record<string, string>;
-    eventsCausingGuards: Record<string, string>;
-    eventsCausingServices: Record<string, string>;
-} & {
-    indexedActions: import("xstate").IndexByType<import("xstate").BaseActionObject>;
-    indexedEvents: Record<string, AuthEvent> & {
-        __XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__: {
-            data: any;
-        };
-    };
-    invokeSrcNameMap: Record<string, "__XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__">;
-}>;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, AuthEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

package/dist/types/machines/authenticator/index.d.ts

@@ -5,24 +5,4 @@ export declare type AuthenticatorMachineOptions = AuthContext['config'] & {
 export declare function createAuthenticatorMachine(): import("xstate").StateMachine<AuthContext, any, AuthEvent, {
     value: any;
     context: AuthContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").TypegenDisabled & {
-    missingImplementations: {
-        actions: never;
-        delays: never;
-        guards: never;
-        services: never;
-    };
-} & {
-    eventsCausingActions: Record<string, string>;
-    eventsCausingDelays: Record<string, string>;
-    eventsCausingGuards: Record<string, string>;
-    eventsCausingServices: Record<string, string>;
-} & {
-    indexedActions: import("xstate").IndexByType<import("xstate").BaseActionObject>;
-    indexedEvents: Record<string, AuthEvent> & {
-        __XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__: {
-            data: any;
-        };
-    };
-    invokeSrcNameMap: Record<string, "__XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__">;
-}>;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, AuthEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

package/dist/types/machines/authenticator/signUp.d.ts

@@ -6,24 +6,4 @@ export declare type SignUpMachineOptions = {
 export declare function createSignUpMachine({ services }: SignUpMachineOptions): import("xstate").StateMachine<SignUpContext, any, AuthEvent, {
     value: any;
     context: SignUpContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").TypegenDisabled & {
-    missingImplementations: {
-        actions: never;
-        delays: never;
-        guards: never;
-        services: never;
-    };
-} & {
-    eventsCausingActions: Record<string, string>;
-    eventsCausingDelays: Record<string, string>;
-    eventsCausingGuards: Record<string, string>;
-    eventsCausingServices: Record<string, string>;
-} & {
-    indexedActions: import("xstate").IndexByType<import("xstate").BaseActionObject>;
-    indexedEvents: Record<string, AuthEvent> & {
-        __XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__: {
-            data: any;
-        };
-    };
-    invokeSrcNameMap: Record<string, "__XSTATE_ALLOW_ANY_INVOKE_DATA_HACK__">;
-}>;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, AuthEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

package/dist/types/theme/index.d.ts

@@ -2,3 +2,4 @@ export { createTheme } from './createTheme';
 export { defaultTheme } from './defaultTheme';
 export { defaultDarkModeOverride } from './defaultDarkModeOverride';
 export * from './types';
+export { cssNameTransform } from './utils';

package/dist/types/theme/tokens/components/button.d.ts

@@ -1,5 +1,5 @@
 import { AlignItemsValue, BackgroundColorValue, BorderColorValue, BorderRadiusValue, BorderStyleValue, BorderWidthValue, BoxShadowValue, ColorValue, DesignToken, FontSizeValue, FontWeightValue, JustifyContentValue, LineHeightValue, SpaceValue, TransitionDurationValue } from '../types/designToken';
-interface StateTokens {
+export interface StateTokens {
     color: DesignToken<ColorValue>;
     backgroundColor: DesignToken<BackgroundColorValue>;
     borderColor: DesignToken<BorderColorValue>;

package/dist/types/theme/tokens/components/collection.d.ts

@@ -0,0 +1,32 @@
+import { PaginationButtonDisabledTokens, PaginationButtonHoverTokens } from './pagination';
+import { StateTokens } from './button';
+import { BackgroundColorValue, ColorValue, DesignToken } from '../types/designToken';
+interface PaginationTokens {
+    current: {
+        color: DesignToken<ColorValue>;
+        backgroundColor: DesignToken<BackgroundColorValue>;
+    };
+    button: {
+        color: DesignToken<ColorValue>;
+        _hover: PaginationButtonHoverTokens;
+        _disabled: PaginationButtonDisabledTokens;
+    };
+}
+export interface SearchTokens {
+    input: {
+        color: DesignToken<ColorValue>;
+    };
+    button: {
+        color: DesignToken<ColorValue>;
+        _active: StateTokens;
+        _disabled: StateTokens;
+        _focus: StateTokens;
+        _hover: StateTokens;
+    };
+}
+export interface CollectionTokens {
+    pagination: PaginationTokens;
+    search: SearchTokens;
+}
+export declare const collection: CollectionTokens;
+export {};

package/dist/types/theme/tokens/components/index.d.ts

@@ -5,6 +5,7 @@ import { ButtonTokens } from './button';
 import { CardTokens } from './card';
 import { CheckboxTokens } from './checkbox';
 import { CheckboxFieldTokens } from './checkboxField';
+import { CollectionTokens } from './collection';
 import { CopyTokens } from './copy';
 import { CountryCodeSelectTokens } from './countryCodeSelect';
 import { DividerTokens } from './divider';
@@ -21,9 +22,11 @@ import { LinkTokens } from './link';
 import { LoaderTokens } from './loader';
 import { MenuTokens } from './menu';
 import { PaginationTokens } from './pagination';
+import { PasswordFieldTokens } from './passwordField';
 import { PlaceholderTokens } from './placeholder';
 import { RadioTokens } from './radio';
 import { RatingTokens } from './rating';
+import { SearchFieldTokens } from './searchField';
 import { SelectTokens } from './select';
 import { SelectFieldTokens } from './selectField';
 import { SliderFieldTokens } from './sliderField';
@@ -32,6 +35,8 @@ import { SwitchFieldTokens } from './switchField';
 import { TableTokens } from './table';
 import { TabsTokens } from './tabs';
 import { TextTokens } from './text';
+import { TextAreaFieldTokens } from './textAreaField';
+import { TextFieldTokens } from './textField';
 import { ToggleButtonTokens } from './toggleButton';
 import { ToggleButtonGroupTokens } from './toggleButtonGroup';
 export interface ComponentTokens {
@@ -42,6 +47,7 @@ export interface ComponentTokens {
     card: CardTokens;
     checkbox: CheckboxTokens;
     checkboxfield: CheckboxFieldTokens;
+    collection: CollectionTokens;
     copy: CopyTokens;
     countrycodeselect: CountryCodeSelectTokens;
     divider: DividerTokens;
@@ -58,9 +64,11 @@ export interface ComponentTokens {
     loader: LoaderTokens;
     menu: MenuTokens;
     pagination: PaginationTokens;
+    passwordfield: PasswordFieldTokens;
     placeholder: PlaceholderTokens;
     radio: RadioTokens;
     rating: RatingTokens;
+    searchfield: SearchFieldTokens;
     select: SelectTokens;
     selectfield: SelectFieldTokens;
     sliderfield: SliderFieldTokens;
@@ -69,6 +77,8 @@ export interface ComponentTokens {
     table: TableTokens;
     tabs: TabsTokens;
     text: TextTokens;
+    textareafield: TextAreaFieldTokens;
+    textfield: TextFieldTokens;
     togglebutton: ToggleButtonTokens;
     togglebuttongroup: ToggleButtonGroupTokens;
 }

package/dist/types/theme/tokens/components/pagination.d.ts

@@ -15,11 +15,11 @@ interface PaginationButtonTokens {
     hover: PaginationButtonHoverTokens;
     disabled: PaginationButtonDisabledTokens;
 }
-interface PaginationButtonHoverTokens {
+export interface PaginationButtonHoverTokens {
     backgroundColor: DesignToken<BackgroundColorValue>;
     color: DesignToken<ColorValue>;
 }
-interface PaginationButtonDisabledTokens {
+export interface PaginationButtonDisabledTokens {
     color: DesignToken<ColorValue>;
 }
 interface PaginationEllipsisTokens {

package/dist/types/theme/tokens/components/passwordField.d.ts

@@ -0,0 +1,15 @@
+import { ColorValue, DesignToken } from '../types/designToken';
+import { StateTokens } from './button';
+interface ButtonTokens {
+    color: DesignToken<ColorValue>;
+    _active: StateTokens;
+    _disabled: StateTokens;
+    _focus: StateTokens;
+    _hover: StateTokens;
+}
+export interface PasswordFieldTokens {
+    color: DesignToken<ColorValue>;
+    button: ButtonTokens;
+}
+export declare const passwordfield: PasswordFieldTokens;
+export {};

package/dist/types/theme/tokens/components/searchField.d.ts

@@ -0,0 +1,15 @@
+import { ColorValue, DesignToken } from '../types/designToken';
+import { StateTokens } from './button';
+interface SearchTokens {
+    color: DesignToken<ColorValue>;
+    _active: StateTokens;
+    _disabled: StateTokens;
+    _focus: StateTokens;
+    _hover: StateTokens;
+}
+export interface SearchFieldTokens {
+    color: DesignToken<ColorValue>;
+    button: SearchTokens;
+}
+export declare const searchfield: SearchFieldTokens;
+export {};

package/dist/types/theme/tokens/components/textAreaField.d.ts

@@ -0,0 +1,11 @@
+import { ColorValue, DesignToken, BorderColorValue } from '../types/designToken';
+interface TextAreaFieldStateToken {
+    borderColor: DesignToken<BorderColorValue>;
+}
+export interface TextAreaFieldTokens {
+    color: DesignToken<ColorValue>;
+    borderColor: DesignToken<BorderColorValue>;
+    _focus: TextAreaFieldStateToken;
+}
+export declare const textareafield: TextAreaFieldTokens;
+export {};