@aws-amplify/ui-react 5.3.2 → 6.0.1

package/dist/styles/StorageManager.css

@@ -0,0 +1,138 @@
+.amplify-storagemanager__dropzone {
+  background-color: var(--amplify-components-storagemanager-dropzone-background-color);
+  border-color: var(--amplify-components-storagemanager-dropzone-border-color);
+  border-radius: var(--amplify-components-storagemanager-dropzone-border-radius);
+  border-style: var(--amplify-components-storagemanager-dropzone-border-style);
+  border-width: var(--amplify-components-storagemanager-dropzone-border-width);
+  text-align: var(--amplify-components-storagemanager-dropzone-text-align);
+  padding-block: var(--amplify-components-storagemanager-dropzone-padding-block);
+  padding-inline: var(--amplify-components-storagemanager-dropzone-padding-inline);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--amplify-components-storagemanager-dropzone-gap);
+}
+.amplify-storagemanager__dropzone--small {
+  flex-direction: row;
+  justify-content: center;
+}
+.amplify-storagemanager__dropzone--active {
+  border-color: var(--amplify-components-storagemanager-dropzone-active-border-color);
+  border-width: var(--amplify-components-storagemanager-dropzone-active-border-width);
+  background-color: var(--amplify-components-storagemanager-dropzone-active-background-color);
+}
+.amplify-storagemanager__dropzone__icon {
+  font-size: var(--amplify-components-storagemanager-dropzone-icon-font-size);
+  color: var(--amplify-components-storagemanager-dropzone-icon-color);
+}
+.amplify-storagemanager__dropzone__text {
+  color: var(--amplify-components-storagemanager-dropzone-text-color);
+  font-size: var(--amplify-components-storagemanager-dropzone-text-font-size);
+  font-weight: var(--amplify-components-storagemanager-dropzone-text-font-weight);
+}
+.amplify-storagemanager__file__list {
+  display: flex;
+  flex-direction: var(--amplify-components-storagemanager-filelist-flex-direction);
+  gap: var(--amplify-components-storagemanager-filelist-gap);
+}
+.amplify-storagemanager__file {
+  position: relative;
+  border-width: var(--amplify-components-storagemanager-file-border-width);
+  border-style: var(--amplify-components-storagemanager-file-border-style);
+  border-color: var(--amplify-components-storagemanager-file-border-color);
+  border-radius: var(--amplify-components-storagemanager-file-border-radius);
+  display: flex;
+  flex-direction: column;
+  padding-inline: var(--amplify-components-storagemanager-file-padding-inline);
+  padding-block: var(--amplify-components-storagemanager-file-padding-block);
+  align-items: var(--amplify-components-storagemanager-file-align-items);
+}
+.amplify-storagemanager__file__wrapper {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: var(--amplify-components-storagemanager-file-gap);
+}
+.amplify-storagemanager__file__name {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-weight: var(--amplify-components-storagemanager-file-name-font-weight);
+  font-size: var(--amplify-components-storagemanager-file-name-font-size);
+  color: var(--amplify-components-storagemanager-file-name-color);
+}
+.amplify-storagemanager__file__size {
+  font-weight: var(--amplify-components-storagemanager-file-size-font-weight);
+  font-size: var(--amplify-components-storagemanager-file-size-font-size);
+  color: var(--amplify-components-storagemanager-file-size-color);
+}
+.amplify-storagemanager__file__main {
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+}
+.amplify-storagemanager__file__image {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--amplify-components-storagemanager-file-image-width);
+  height: var(--amplify-components-storagemanager-file-image-height);
+  background-color: var(--amplify-components-storagemanager-file-image-background-color);
+  border-radius: var(--amplify-components-storagemanager-file-image-border-radius);
+  color: var(--amplify-components-storagemanager-file-image-color);
+}
+.amplify-storagemanager__file__image img {
+  max-height: 100%;
+}
+.amplify-storagemanager__file__status--error {
+  color: var(--amplify-colors-font-error);
+  font-size: var(--amplify-components-storagemanager-file-size-font-size);
+}
+.amplify-storagemanager__file__status--success {
+  color: var(--amplify-colors-font-success);
+}
+.amplify-storagemanager__loader {
+  stroke-linecap: var(--amplify-components-storagemanager-loader-stroke-linecap);
+  stroke: var(--amplify-components-storagemanager-loader-stroke-empty);
+  stroke-width: var(--amplify-components-storagemanager-loader-stroke-width);
+  height: var(--amplify-components-storagemanager-loader-stroke-width);
+  --amplify-components-loader-linear-stroke-filled: var(
+    --amplify-components-storagemanager-loader-stroke-filled
+  );
+  overflow: hidden;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+}
+.amplify-storagemanager__previewer {
+  display: flex;
+  flex-direction: column;
+  max-width: var(--amplify-components-storagemanager-previewer-max-width);
+  max-height: var(--amplify-components-storagemanager-previewer-max-height);
+  overflow: auto;
+  gap: var(--amplify-components-storagemanager-previewer-body-gap);
+  padding-inline: var(--amplify-components-storagemanager-previewer-body-padding-inline);
+  padding-block: var(--amplify-components-storagemanager-previewer-body-padding-block);
+  background-color: var(--amplify-components-storagemanager-previewer-background-color);
+  border-width: var(--amplify-components-storagemanager-previewer-border-width);
+  border-style: var(--amplify-components-storagemanager-previewer-border-style);
+  border-color: var(--amplify-components-storagemanager-previewer-border-color);
+  border-radius: var(--amplify-components-storagemanager-previewer-border-radius);
+}
+.amplify-storagemanager__previewer__text {
+  font-weight: var(--amplify-components-storagemanager-previewer-text-font-weight);
+  font-size: var(--amplify-components-storagemanager-previewer-text-font-size);
+  color: var(--amplify-components-storagemanager-previewer-text-color);
+}
+.amplify-storagemanager__previewer__footer {
+  display: flex;
+  flex-direction: row;
+  justify-content: var(--amplify-components-storagemanager-previewer-footer-justify-content);
+}
+.amplify-storagemanager__previewer__actions {
+  display: flex;
+  flex-direction: row;
+  gap: var(--amplify-space-small);
+}

package/dist/styles/StorageManager.layer.css

@@ -0,0 +1,140 @@
+@layer amplify.components {
+.amplify-storagemanager__dropzone {
+  background-color: var(--amplify-components-storagemanager-dropzone-background-color);
+  border-color: var(--amplify-components-storagemanager-dropzone-border-color);
+  border-radius: var(--amplify-components-storagemanager-dropzone-border-radius);
+  border-style: var(--amplify-components-storagemanager-dropzone-border-style);
+  border-width: var(--amplify-components-storagemanager-dropzone-border-width);
+  text-align: var(--amplify-components-storagemanager-dropzone-text-align);
+  padding-block: var(--amplify-components-storagemanager-dropzone-padding-block);
+  padding-inline: var(--amplify-components-storagemanager-dropzone-padding-inline);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--amplify-components-storagemanager-dropzone-gap);
+}
+.amplify-storagemanager__dropzone--small {
+  flex-direction: row;
+  justify-content: center;
+}
+.amplify-storagemanager__dropzone--active {
+  border-color: var(--amplify-components-storagemanager-dropzone-active-border-color);
+  border-width: var(--amplify-components-storagemanager-dropzone-active-border-width);
+  background-color: var(--amplify-components-storagemanager-dropzone-active-background-color);
+}
+.amplify-storagemanager__dropzone__icon {
+  font-size: var(--amplify-components-storagemanager-dropzone-icon-font-size);
+  color: var(--amplify-components-storagemanager-dropzone-icon-color);
+}
+.amplify-storagemanager__dropzone__text {
+  color: var(--amplify-components-storagemanager-dropzone-text-color);
+  font-size: var(--amplify-components-storagemanager-dropzone-text-font-size);
+  font-weight: var(--amplify-components-storagemanager-dropzone-text-font-weight);
+}
+.amplify-storagemanager__file__list {
+  display: flex;
+  flex-direction: var(--amplify-components-storagemanager-filelist-flex-direction);
+  gap: var(--amplify-components-storagemanager-filelist-gap);
+}
+.amplify-storagemanager__file {
+  position: relative;
+  border-width: var(--amplify-components-storagemanager-file-border-width);
+  border-style: var(--amplify-components-storagemanager-file-border-style);
+  border-color: var(--amplify-components-storagemanager-file-border-color);
+  border-radius: var(--amplify-components-storagemanager-file-border-radius);
+  display: flex;
+  flex-direction: column;
+  padding-inline: var(--amplify-components-storagemanager-file-padding-inline);
+  padding-block: var(--amplify-components-storagemanager-file-padding-block);
+  align-items: var(--amplify-components-storagemanager-file-align-items);
+}
+.amplify-storagemanager__file__wrapper {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: var(--amplify-components-storagemanager-file-gap);
+}
+.amplify-storagemanager__file__name {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-weight: var(--amplify-components-storagemanager-file-name-font-weight);
+  font-size: var(--amplify-components-storagemanager-file-name-font-size);
+  color: var(--amplify-components-storagemanager-file-name-color);
+}
+.amplify-storagemanager__file__size {
+  font-weight: var(--amplify-components-storagemanager-file-size-font-weight);
+  font-size: var(--amplify-components-storagemanager-file-size-font-size);
+  color: var(--amplify-components-storagemanager-file-size-color);
+}
+.amplify-storagemanager__file__main {
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+}
+.amplify-storagemanager__file__image {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--amplify-components-storagemanager-file-image-width);
+  height: var(--amplify-components-storagemanager-file-image-height);
+  background-color: var(--amplify-components-storagemanager-file-image-background-color);
+  border-radius: var(--amplify-components-storagemanager-file-image-border-radius);
+  color: var(--amplify-components-storagemanager-file-image-color);
+}
+.amplify-storagemanager__file__image img {
+  max-height: 100%;
+}
+.amplify-storagemanager__file__status--error {
+  color: var(--amplify-colors-font-error);
+  font-size: var(--amplify-components-storagemanager-file-size-font-size);
+}
+.amplify-storagemanager__file__status--success {
+  color: var(--amplify-colors-font-success);
+}
+.amplify-storagemanager__loader {
+  stroke-linecap: var(--amplify-components-storagemanager-loader-stroke-linecap);
+  stroke: var(--amplify-components-storagemanager-loader-stroke-empty);
+  stroke-width: var(--amplify-components-storagemanager-loader-stroke-width);
+  height: var(--amplify-components-storagemanager-loader-stroke-width);
+  --amplify-components-loader-linear-stroke-filled: var(
+    --amplify-components-storagemanager-loader-stroke-filled
+  );
+  overflow: hidden;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+}
+.amplify-storagemanager__previewer {
+  display: flex;
+  flex-direction: column;
+  max-width: var(--amplify-components-storagemanager-previewer-max-width);
+  max-height: var(--amplify-components-storagemanager-previewer-max-height);
+  overflow: auto;
+  gap: var(--amplify-components-storagemanager-previewer-body-gap);
+  padding-inline: var(--amplify-components-storagemanager-previewer-body-padding-inline);
+  padding-block: var(--amplify-components-storagemanager-previewer-body-padding-block);
+  background-color: var(--amplify-components-storagemanager-previewer-background-color);
+  border-width: var(--amplify-components-storagemanager-previewer-border-width);
+  border-style: var(--amplify-components-storagemanager-previewer-border-style);
+  border-color: var(--amplify-components-storagemanager-previewer-border-color);
+  border-radius: var(--amplify-components-storagemanager-previewer-border-radius);
+}
+.amplify-storagemanager__previewer__text {
+  font-weight: var(--amplify-components-storagemanager-previewer-text-font-weight);
+  font-size: var(--amplify-components-storagemanager-previewer-text-font-size);
+  color: var(--amplify-components-storagemanager-previewer-text-color);
+}
+.amplify-storagemanager__previewer__footer {
+  display: flex;
+  flex-direction: row;
+  justify-content: var(--amplify-components-storagemanager-previewer-footer-justify-content);
+}
+.amplify-storagemanager__previewer__actions {
+  display: flex;
+  flex-direction: row;
+  gap: var(--amplify-space-small);
+}
+}

package/dist/styles/_fieldControl.layer.css

@@ -0,0 +1,3 @@
+@layer amplify.components {
+
+}

package/dist/styles/accordion.css

@@ -0,0 +1,64 @@
+.amplify-accordion {
+  display: block;
+  background-color: var(--amplify-components-accordion-background-color);
+  border-radius: var(--amplify-components-accordion-item-border-radius);
+}
+
+.amplify-accordion__item {
+  display: block;
+  position: relative;
+  border-width: var(--amplify-components-accordion-item-border-width);
+  border-style: var(--amplify-components-accordion-item-border-style);
+  border-color: var(--amplify-components-accordion-item-border-color);
+}
+.amplify-accordion__item + .amplify-accordion__item {
+  margin-block-start: calc(-1 * var(--amplify-components-accordion-item-border-width));
+}
+.amplify-accordion__item:where(:first-of-type) {
+  border-start-end-radius: var(--amplify-components-accordion-item-border-radius);
+  border-start-start-radius: var(--amplify-components-accordion-item-border-radius);
+}
+.amplify-accordion__item:where(:last-of-type) {
+  border-end-end-radius: var(--amplify-components-accordion-item-border-radius);
+  border-end-start-radius: var(--amplify-components-accordion-item-border-radius);
+}
+.amplify-accordion__item__trigger {
+  cursor: pointer;
+  display: flex;
+  position: relative;
+  color: var(--amplify-components-accordion-item-trigger-color);
+  border-radius: var(--amplify-components-accordion-item-border-radius);
+  padding-inline: var(--amplify-components-accordion-item-trigger-padding-inline);
+  padding-block: var(--amplify-components-accordion-item-trigger-padding-block);
+  gap: var(--amplify-components-accordion-item-trigger-gap);
+  align-items: var(--amplify-components-accordion-item-trigger-align-items);
+  justify-content: var(--amplify-components-accordion-item-trigger-justify-content);
+}
+.amplify-accordion__item__trigger:hover {
+  background-color: var(--amplify-components-accordion-item-trigger-hover-background-color);
+  color: var(--amplify-components-accordion-item-trigger-hover-color);
+}
+.amplify-accordion__item__trigger:focus {
+  box-shadow: var(--amplify-components-accordion-item-trigger-focus-box-shadow);
+  border-color: var(--amplify-components-accordion-item-trigger-focus-border-color);
+  z-index: 2;
+}
+.amplify-accordion__item__trigger::-webkit-details-marker {
+  display: none;
+}
+.amplify-accordion__item__content {
+  display: block;
+  color: var(--amplify-components-accordion-item-content-color);
+  padding-block-end: var(--amplify-components-accordion-item-content-padding-block-end);
+  padding-block-start: var(--amplify-components-accordion-item-content-padding-block-start);
+  padding-inline: var(--amplify-components-accordion-item-content-padding-inline);
+}
+.amplify-accordion__item__icon {
+  color: var(--amplify-components-accordion-item-icon-color);
+  transition-property: transform;
+  transition-duration: var(--amplify-components-accordion-item-icon-transition-duration);
+  transition-timing-function: var(--amplify-components-accordion-item-icon-transition-timing-function);
+}
+[open] .amplify-accordion__item__icon {
+  transform: rotate(180deg);
+}

package/dist/styles/accordion.layer.css

@@ -0,0 +1,66 @@
+@layer amplify.components {
+.amplify-accordion {
+  display: block;
+  background-color: var(--amplify-components-accordion-background-color);
+  border-radius: var(--amplify-components-accordion-item-border-radius);
+}
+
+.amplify-accordion__item {
+  display: block;
+  position: relative;
+  border-width: var(--amplify-components-accordion-item-border-width);
+  border-style: var(--amplify-components-accordion-item-border-style);
+  border-color: var(--amplify-components-accordion-item-border-color);
+}
+.amplify-accordion__item + .amplify-accordion__item {
+  margin-block-start: calc(-1 * var(--amplify-components-accordion-item-border-width));
+}
+.amplify-accordion__item:where(:first-of-type) {
+  border-start-end-radius: var(--amplify-components-accordion-item-border-radius);
+  border-start-start-radius: var(--amplify-components-accordion-item-border-radius);
+}
+.amplify-accordion__item:where(:last-of-type) {
+  border-end-end-radius: var(--amplify-components-accordion-item-border-radius);
+  border-end-start-radius: var(--amplify-components-accordion-item-border-radius);
+}
+.amplify-accordion__item__trigger {
+  cursor: pointer;
+  display: flex;
+  position: relative;
+  color: var(--amplify-components-accordion-item-trigger-color);
+  border-radius: var(--amplify-components-accordion-item-border-radius);
+  padding-inline: var(--amplify-components-accordion-item-trigger-padding-inline);
+  padding-block: var(--amplify-components-accordion-item-trigger-padding-block);
+  gap: var(--amplify-components-accordion-item-trigger-gap);
+  align-items: var(--amplify-components-accordion-item-trigger-align-items);
+  justify-content: var(--amplify-components-accordion-item-trigger-justify-content);
+}
+.amplify-accordion__item__trigger:hover {
+  background-color: var(--amplify-components-accordion-item-trigger-hover-background-color);
+  color: var(--amplify-components-accordion-item-trigger-hover-color);
+}
+.amplify-accordion__item__trigger:focus {
+  box-shadow: var(--amplify-components-accordion-item-trigger-focus-box-shadow);
+  border-color: var(--amplify-components-accordion-item-trigger-focus-border-color);
+  z-index: 2;
+}
+.amplify-accordion__item__trigger::-webkit-details-marker {
+  display: none;
+}
+.amplify-accordion__item__content {
+  display: block;
+  color: var(--amplify-components-accordion-item-content-color);
+  padding-block-end: var(--amplify-components-accordion-item-content-padding-block-end);
+  padding-block-start: var(--amplify-components-accordion-item-content-padding-block-start);
+  padding-inline: var(--amplify-components-accordion-item-content-padding-inline);
+}
+.amplify-accordion__item__icon {
+  color: var(--amplify-components-accordion-item-icon-color);
+  transition-property: transform;
+  transition-duration: var(--amplify-components-accordion-item-icon-transition-duration);
+  transition-timing-function: var(--amplify-components-accordion-item-icon-transition-timing-function);
+}
+[open] .amplify-accordion__item__icon {
+  transform: rotate(180deg);
+}
+}

package/dist/styles/alert.css

@@ -0,0 +1,44 @@
+.amplify-alert {
+  align-items: var(--amplify-components-alert-align-items);
+  background-color: var(--amplify-components-alert-background-color);
+  color: var(--amplify-components-alert-color);
+  justify-content: var(--amplify-components-alert-justify-content);
+  padding-block: var(--amplify-components-alert-padding-block);
+  padding-inline: var(--amplify-components-alert-padding-inline);
+}
+.amplify-alert--info {
+  color: var(--amplify-components-alert-info-color);
+  background-color: var(--amplify-components-alert-info-background-color);
+}
+.amplify-alert--error {
+  color: var(--amplify-components-alert-error-color);
+  background-color: var(--amplify-components-alert-error-background-color);
+}
+.amplify-alert--warning {
+  color: var(--amplify-components-alert-warning-color);
+  background-color: var(--amplify-components-alert-warning-background-color);
+}
+.amplify-alert--success {
+  color: var(--amplify-components-alert-success-color);
+  background-color: var(--amplify-components-alert-success-background-color);
+}
+
+.amplify-alert__icon {
+  font-size: var(--amplify-components-alert-icon-size);
+  line-height: 1;
+}
+
+.amplify-alert__heading {
+  display: block;
+  font-weight: var(--amplify-components-alert-heading-font-weight);
+  font-size: var(--amplify-components-alert-heading-font-size);
+}
+
+.amplify-alert__body {
+  color: inherit;
+  display: block;
+}
+
+.amplify-alert__dismiss {
+  color: inherit;
+}

package/dist/styles/alert.layer.css

@@ -0,0 +1,46 @@
+@layer amplify.components {
+.amplify-alert {
+  align-items: var(--amplify-components-alert-align-items);
+  background-color: var(--amplify-components-alert-background-color);
+  color: var(--amplify-components-alert-color);
+  justify-content: var(--amplify-components-alert-justify-content);
+  padding-block: var(--amplify-components-alert-padding-block);
+  padding-inline: var(--amplify-components-alert-padding-inline);
+}
+.amplify-alert--info {
+  color: var(--amplify-components-alert-info-color);
+  background-color: var(--amplify-components-alert-info-background-color);
+}
+.amplify-alert--error {
+  color: var(--amplify-components-alert-error-color);
+  background-color: var(--amplify-components-alert-error-background-color);
+}
+.amplify-alert--warning {
+  color: var(--amplify-components-alert-warning-color);
+  background-color: var(--amplify-components-alert-warning-background-color);
+}
+.amplify-alert--success {
+  color: var(--amplify-components-alert-success-color);
+  background-color: var(--amplify-components-alert-success-background-color);
+}
+
+.amplify-alert__icon {
+  font-size: var(--amplify-components-alert-icon-size);
+  line-height: 1;
+}
+
+.amplify-alert__heading {
+  display: block;
+  font-weight: var(--amplify-components-alert-heading-font-weight);
+  font-size: var(--amplify-components-alert-heading-font-size);
+}
+
+.amplify-alert__body {
+  color: inherit;
+  display: block;
+}
+
+.amplify-alert__dismiss {
+  color: inherit;
+}
+}

package/dist/styles/authenticator.css

@@ -0,0 +1,72 @@
+/* Center by default */
+[data-amplify-authenticator] {
+  display: grid;
+}
+[data-amplify-authenticator][data-variation=modal] {
+  overflow-y: auto;
+  width: var(--amplify-components-authenticator-modal-width);
+  height: var(--amplify-components-authenticator-modal-height);
+  background-color: var(--amplify-components-authenticator-modal-background-color);
+  position: fixed;
+  top: var(--amplify-components-authenticator-modal-top);
+  left: var(--amplify-components-authenticator-modal-left);
+  /* Having a z-index at least "wins" by default */
+  z-index: 1;
+}
+[data-amplify-authenticator] [data-amplify-container] {
+  place-self: center;
+}
+@media (min-width: 30rem) {
+  [data-amplify-authenticator] [data-amplify-container] {
+    width: var(--amplify-components-authenticator-container-width-max);
+  }
+}
+[data-amplify-authenticator] [data-amplify-router] {
+  background-color: var(--amplify-components-authenticator-router-background-color);
+  box-shadow: var(--amplify-components-authenticator-router-box-shadow);
+  border-color: var(--amplify-components-authenticator-router-border-color);
+  border-width: var(--amplify-components-authenticator-router-border-width);
+  border-style: var(--amplify-components-authenticator-router-border-style);
+}
+[data-amplify-authenticator] [data-amplify-footer] {
+  padding-bottom: var(--amplify-components-authenticator-footer-padding-bottom);
+  text-align: center;
+}
+[data-amplify-authenticator] [data-amplify-form] {
+  padding: var(--amplify-components-authenticator-form-padding);
+}
+[data-amplify-authenticator] [data-state=inactive] {
+  background-color: var(--amplify-components-authenticator-state-inactive-background-color);
+}
+@media (max-width: 26rem) {
+  [data-amplify-authenticator] [data-amplify-sign-up-errors] {
+    font-size: 0.688rem;
+  }
+}
+
+.amplify-authenticator__column {
+  display: flex;
+  flex-direction: column;
+}
+
+.amplify-authenticator__subtitle {
+  margin-bottom: var(--amplify-space-medium);
+}
+
+.amplify-authenticator__heading {
+  font-size: var(--amplify-font-sizes-xl);
+}
+
+.amplify-authenticator__federated-text {
+  align-self: center;
+}
+
+.amplify-authenticator__federated-buttons {
+  flex-direction: column;
+  padding-block-end: var(--amplify-space-medium);
+}
+
+.amplify-authenticator__federated-button {
+  font-weight: normal;
+  gap: var(--amplify-space-medium);
+}

package/dist/styles/authenticator.layer.css

@@ -0,0 +1,74 @@
+@layer amplify.components {
+/* Center by default */
+[data-amplify-authenticator] {
+  display: grid;
+}
+[data-amplify-authenticator][data-variation=modal] {
+  overflow-y: auto;
+  width: var(--amplify-components-authenticator-modal-width);
+  height: var(--amplify-components-authenticator-modal-height);
+  background-color: var(--amplify-components-authenticator-modal-background-color);
+  position: fixed;
+  top: var(--amplify-components-authenticator-modal-top);
+  left: var(--amplify-components-authenticator-modal-left);
+  /* Having a z-index at least "wins" by default */
+  z-index: 1;
+}
+[data-amplify-authenticator] [data-amplify-container] {
+  place-self: center;
+}
+@media (min-width: 30rem) {
+  [data-amplify-authenticator] [data-amplify-container] {
+    width: var(--amplify-components-authenticator-container-width-max);
+  }
+}
+[data-amplify-authenticator] [data-amplify-router] {
+  background-color: var(--amplify-components-authenticator-router-background-color);
+  box-shadow: var(--amplify-components-authenticator-router-box-shadow);
+  border-color: var(--amplify-components-authenticator-router-border-color);
+  border-width: var(--amplify-components-authenticator-router-border-width);
+  border-style: var(--amplify-components-authenticator-router-border-style);
+}
+[data-amplify-authenticator] [data-amplify-footer] {
+  padding-bottom: var(--amplify-components-authenticator-footer-padding-bottom);
+  text-align: center;
+}
+[data-amplify-authenticator] [data-amplify-form] {
+  padding: var(--amplify-components-authenticator-form-padding);
+}
+[data-amplify-authenticator] [data-state=inactive] {
+  background-color: var(--amplify-components-authenticator-state-inactive-background-color);
+}
+@media (max-width: 26rem) {
+  [data-amplify-authenticator] [data-amplify-sign-up-errors] {
+    font-size: 0.688rem;
+  }
+}
+
+.amplify-authenticator__column {
+  display: flex;
+  flex-direction: column;
+}
+
+.amplify-authenticator__subtitle {
+  margin-bottom: var(--amplify-space-medium);
+}
+
+.amplify-authenticator__heading {
+  font-size: var(--amplify-font-sizes-xl);
+}
+
+.amplify-authenticator__federated-text {
+  align-self: center;
+}
+
+.amplify-authenticator__federated-buttons {
+  flex-direction: column;
+  padding-block-end: var(--amplify-space-medium);
+}
+
+.amplify-authenticator__federated-button {
+  font-weight: normal;
+  gap: var(--amplify-space-medium);
+}
+}