@wordpress/components 29.1.1 → 29.2.0

package/build-style/style.css

@@ -114,14 +114,10 @@
   }
 }
 
-.components-animate__appear {
-  animation: components-animate__appear-animation 0.1s cubic-bezier(0, 0, 0.2, 1) 0s;
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-animate__appear {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: components-animate__appear-animation 0.1s cubic-bezier(0, 0, 0.2, 1) 0s;
+    animation-fill-mode: forwards;
   }
 }
 .components-animate__appear.is-from-top, .components-animate__appear.is-from-top.is-from-left {
@@ -145,21 +141,17 @@
     transform: translateY(0%) scaleY(1) scaleX(1);
   }
 }
-.components-animate__slide-in {
-  animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1);
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-animate__slide-in {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1);
+    animation-fill-mode: forwards;
+  }
+  .components-animate__slide-in.is-from-left {
+    transform: translateX(100%);
+  }
+  .components-animate__slide-in.is-from-right {
+    transform: translateX(-100%);
   }
-}
-.components-animate__slide-in.is-from-left {
-  transform: translateX(100%);
-}
-.components-animate__slide-in.is-from-right {
-  transform: translateX(-100%);
 }
 
 @keyframes components-animate__slide-in-animation {
@@ -167,8 +159,10 @@
     transform: translateX(0%);
   }
 }
-.components-animate__loading {
-  animation: components-animate__loading 1.6s ease-in-out infinite;
+@media not (prefers-reduced-motion) {
+  .components-animate__loading {
+    animation: components-animate__loading 1.6s ease-in-out infinite;
+  }
 }
 
 @keyframes components-animate__loading {
@@ -291,7 +285,6 @@
   cursor: pointer;
   -webkit-appearance: none;
   background: none;
-  transition: box-shadow 0.1s linear;
   height: 36px;
   align-items: center;
   box-sizing: border-box;
@@ -317,10 +310,9 @@
    * Link buttons.
    */
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-button {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 .components-button.is-next-40px-default-size {
@@ -455,15 +447,13 @@ p + .components-button.is-tertiary {
   text-align: left;
   color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
   text-decoration: underline;
-  transition-property: border, background, color;
-  transition-duration: 0.05s;
-  transition-timing-function: ease-in-out;
   height: auto;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-button.is-link {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition-property: border, background, color;
+    transition-duration: 0.05s;
+    transition-timing-function: ease-in-out;
   }
 }
 .components-button.is-link:focus {
@@ -480,15 +470,14 @@ p + .components-button.is-tertiary {
   color: #949494;
 }
 .components-button.is-busy, .components-button.is-secondary.is-busy, .components-button.is-secondary.is-busy:disabled, .components-button.is-secondary.is-busy[aria-disabled=true] {
-  animation: components-button__busy-animation 2500ms infinite linear;
   background-size: 100px 100%;
   /* stylelint-disable -- Disable reason: This function call looks nicer when each argument is on its own line. */
   background-image: linear-gradient(-45deg, #fafafa 33%, #e0e0e0 33%, #e0e0e0 70%, #fafafa 70%);
   /* stylelint-enable */
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-button.is-busy, .components-button.is-secondary.is-busy, .components-button.is-secondary.is-busy:disabled, .components-button.is-secondary.is-busy[aria-disabled=true] {
-    animation-duration: 0s;
+    animation: components-button__busy-animation 2500ms infinite linear;
   }
 }
 .components-button.is-compact {
@@ -585,7 +574,6 @@ p + .components-button.is-tertiary {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -610,12 +598,10 @@ p + .components-button.is-tertiary {
   width: var(--checkbox-input-size);
   height: var(--checkbox-input-size);
   appearance: none;
-  transition: 0.1s border-color ease-in-out;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-checkbox-control__input[type=checkbox] {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -688,10 +674,9 @@ p + .components-button.is-tertiary {
   cursor: default;
   opacity: 1;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-checkbox-control__input[type=checkbox] {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.1s border-color ease-in-out;
   }
 }
 .components-checkbox-control__input[type=checkbox]:focus {
@@ -776,13 +761,11 @@ svg.components-checkbox-control__indeterminate {
   width: 28px;
   vertical-align: top;
   transform: scale(1);
-  transition: 100ms transform ease;
-  will-change: transform;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-circular-option-picker__option-wrapper {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 100ms transform ease;
+    will-change: transform;
   }
 }
 .components-circular-option-picker__option-wrapper:hover {
@@ -815,13 +798,11 @@ svg.components-checkbox-control__indeterminate {
   border-radius: 50%;
   background: transparent;
   box-shadow: inset 0 0 0 14px;
-  transition: 100ms box-shadow ease;
   cursor: pointer;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-circular-option-picker__option {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 100ms box-shadow ease;
   }
 }
 .components-circular-option-picker__option:hover {
@@ -931,7 +912,6 @@ input.components-combobox-control__input[type=text]:focus {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -944,10 +924,9 @@ input.components-combobox-control__input[type=text]:focus {
   width: 100%;
   padding: 0;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-combobox-control__suggestions-container {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -1191,21 +1170,19 @@ body.is-dragging-components-draggable {
 }
 .components-drop-zone.is-active.is-dragging-over-element .components-drop-zone__content {
   opacity: 1;
-  transition: opacity 0.2s ease-in-out;
 }
-@media (prefers-reduced-motion) {
+@media not (prefers-reduced-motion) {
   .components-drop-zone.is-active.is-dragging-over-element .components-drop-zone__content {
-    transition: none;
+    transition: opacity 0.2s ease-in-out;
   }
 }
 .components-drop-zone.is-active.is-dragging-over-element .components-drop-zone__content-inner {
   opacity: 1;
   transform: scale(1);
-  transition: opacity 0.1s ease-in-out 0.1s, transform 0.1s ease-in-out 0.1s;
 }
-@media (prefers-reduced-motion) {
+@media not (prefers-reduced-motion) {
   .components-drop-zone.is-active.is-dragging-over-element .components-drop-zone__content-inner {
-    transition: none;
+    transition: opacity 0.1s ease-in-out 0.1s, transform 0.1s ease-in-out 0.1s;
   }
 }
 
@@ -1371,13 +1348,11 @@ body.is-dragging-components-draggable {
   width: 32px;
   height: 16px;
   border-radius: 8px;
-  transition: 0.2s background-color ease, 0.2s border-color ease;
   overflow: hidden;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-toggle .components-form-toggle__track {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.2s background-color ease, 0.2s border-color ease;
   }
 }
 .components-form-toggle .components-form-toggle__track::after {
@@ -1386,13 +1361,11 @@ body.is-dragging-components-draggable {
   inset: 0;
   box-sizing: border-box;
   border-top: 16px solid transparent;
-  transition: 0.2s opacity ease;
   opacity: 0;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-toggle .components-form-toggle__track::after {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.2s opacity ease;
   }
 }
 .components-form-toggle .components-form-toggle__thumb {
@@ -1404,15 +1377,13 @@ body.is-dragging-components-draggable {
   width: 12px;
   height: 12px;
   border-radius: 50%;
-  transition: 0.2s transform ease, 0.2s background-color ease-out;
   background-color: #1e1e1e;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02), 0 3px 3px rgba(0, 0, 0, 0.02), 0 4px 4px rgba(0, 0, 0, 0.01);
   border: 6px solid transparent;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-toggle .components-form-toggle__thumb {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.2s transform ease, 0.2s background-color ease-out;
   }
 }
 .components-form-toggle.is-checked .components-form-toggle__track {
@@ -1462,7 +1433,6 @@ body.is-dragging-components-draggable {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -1473,10 +1443,9 @@ body.is-dragging-components-draggable {
   padding: 0;
   cursor: text;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-token-field__input-container {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -1591,15 +1560,11 @@ body.is-dragging-components-draggable {
   height: auto;
   background: #ddd;
   min-width: unset;
-  transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1);
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-token-field__token-text,
 .components-form-token-field__remove-token.components-button {
-    transition-duration: 0s;
-    transition-delay: 0s;
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1);
   }
 }
 
@@ -1627,16 +1592,14 @@ body.is-dragging-components-draggable {
   min-width: 100%;
   max-height: 128px;
   overflow-y: auto;
-  transition: all 0.15s ease-in-out;
   list-style: none;
   box-shadow: inset 0 1px 0 0 #949494;
   margin: 0;
   padding: 0;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-form-token-field__suggestions-list {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: all 0.15s ease-in-out;
   }
 }
 
@@ -1927,8 +1890,6 @@ body.is-dragging-components-draggable {
   background-color: rgba(0, 0, 0, 0.35);
   z-index: 100000;
   display: flex;
-  animation: __wp-base-styles-fade-in 0.08s linear 0s;
-  animation-fill-mode: forwards;
 }
 @keyframes __wp-base-styles-fade-in {
   from {
@@ -1938,16 +1899,12 @@ body.is-dragging-components-draggable {
     opacity: 1;
   }
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-modal__screen-overlay {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: __wp-base-styles-fade-in 0.08s linear 0s;
+    animation-fill-mode: forwards;
   }
 }
-.components-modal__screen-overlay.is-animating-out {
-  animation: __wp-base-styles-fade-out 0.08s linear 80ms;
-  animation-fill-mode: forwards;
-}
 @keyframes __wp-base-styles-fade-out {
   from {
     opacity: 1;
@@ -1956,10 +1913,10 @@ body.is-dragging-components-draggable {
     opacity: 0;
   }
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-modal__screen-overlay.is-animating-out {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: __wp-base-styles-fade-out 0.08s linear 80ms;
+    animation-fill-mode: forwards;
   }
 }
 
@@ -1973,7 +1930,6 @@ body.is-dragging-components-draggable {
   overflow: hidden;
   display: flex;
   animation-name: components-modal__appear-animation;
-  animation-duration: var(--modal-frame-animation-duration);
   animation-fill-mode: forwards;
   animation-timing-function: cubic-bezier(0.29, 0, 0, 1);
 }
@@ -1982,10 +1938,9 @@ body.is-dragging-components-draggable {
 .components-modal__frame *::after {
   box-sizing: inherit;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-modal__frame {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation-duration: var(--modal-frame-animation-duration);
   }
 }
 .components-modal__screen-overlay.is-animating-out .components-modal__frame {
@@ -2255,12 +2210,10 @@ body.is-dragging-components-draggable {
   font-size: inherit;
   margin-top: 0;
   margin-bottom: 0;
-  transition: 0.1s background ease-in-out;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-panel__body > .components-panel__body-title {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.1s background ease-in-out;
   }
 }
 
@@ -2284,15 +2237,13 @@ body.is-dragging-components-draggable {
   color: #1e1e1e;
   border: none;
   box-shadow: none;
-  transition: 0.1s background ease-in-out;
   height: auto;
   /* rtl:begin:ignore */
   /* rtl:end:ignore */
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-panel__body-toggle.components-button {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.1s background ease-in-out;
   }
 }
 .components-panel__body-toggle.components-button:focus {
@@ -2306,12 +2257,10 @@ body.is-dragging-components-draggable {
   transform: translateY(-50%);
   color: #1e1e1e;
   fill: currentColor;
-  transition: 0.1s color ease-in-out;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-panel__body-toggle.components-button .components-panel__arrow {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: 0.1s color ease-in-out;
   }
 }
 body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right {
@@ -2437,7 +2386,6 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -2446,10 +2394,9 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   line-height: normal;
   flex: 1 1 auto;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-placeholder__input[type=url] {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -2532,14 +2479,12 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
 .components-placeholder.has-illustration .components-button {
   opacity: 0;
   pointer-events: none;
-  transition: opacity 0.1s linear;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-placeholder.has-illustration .components-placeholder__label,
 .components-placeholder.has-illustration .components-placeholder__instructions,
 .components-placeholder.has-illustration .components-button {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: opacity 0.1s linear;
   }
 }
 .is-selected > .components-placeholder.has-illustration .components-placeholder__label,
@@ -2726,7 +2671,6 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -2748,10 +2692,9 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   appearance: none;
   cursor: pointer;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-radio-control__input[type=radio] {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -2892,14 +2835,12 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   position: absolute;
   top: calc(50% - 1px);
   right: calc(50% - 1px);
-  transition: transform 0.1s ease-in;
-  will-change: transform;
   opacity: 0;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-resizable-box__side-handle::before {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: transform 0.1s ease-in;
+    will-change: transform;
   }
 }
 
@@ -2931,37 +2872,23 @@ body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right
   border-bottom: 0;
 }
 
-.components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
-  animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s;
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s;
+    animation-fill-mode: forwards;
   }
 }
 
-.components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
-.components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
-  animation: components-resizable-box__left-right-animation 0.1s ease-out 0s;
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
 .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: components-resizable-box__left-right-animation 0.1s ease-out 0s;
+    animation-fill-mode: forwards;
   }
 }
 
@@ -3169,12 +3096,10 @@ body.lockscroll {
   background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
   height: calc(0 * var(--wp-admin-border-width-focus));
   border-radius: 0;
-  transition: all 0.1s linear;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-tab-panel__tabs-item::after {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: all 0.1s linear;
   }
 }
 .components-tab-panel__tabs-item.is-active::after {
@@ -3192,12 +3117,10 @@ body.lockscroll {
   pointer-events: none;
   box-shadow: 0 0 0 0 transparent;
   border-radius: 2px;
-  transition: all 0.1s linear;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-tab-panel__tabs-item::before {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: all 0.1s linear;
   }
 }
 .components-tab-panel__tabs-item:focus-visible::before {
@@ -3235,7 +3158,6 @@ body.lockscroll {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
-  transition: box-shadow 0.1s linear;
   border-radius: 2px;
   border: 1px solid #949494;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -3243,7 +3165,7 @@ body.lockscroll {
   /* Override core line-height. To be reviewed. */
   line-height: normal;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-text-control__input,
 .components-text-control__input[type=text],
 .components-text-control__input[type=tel],
@@ -3258,8 +3180,7 @@ body.lockscroll {
 .components-text-control__input[type=email],
 .components-text-control__input[type=month],
 .components-text-control__input[type=number] {
-    transition-duration: 0s;
-    transition-delay: 0s;
+    transition: box-shadow 0.1s linear;
   }
 }
 @media (min-width: 600px) {
@@ -3439,14 +3360,12 @@ body.lockscroll {
   left: 8px;
   right: 8px;
   z-index: -1;
-  animation: components-button__appear-animation 0.1s ease;
-  animation-fill-mode: forwards;
 }
-@media (prefers-reduced-motion: reduce) {
+@media not (prefers-reduced-motion) {
   .components-accessible-toolbar .components-button::before,
 .components-toolbar .components-button::before {
-    animation-duration: 1ms;
-    animation-delay: 0s;
+    animation: components-button__appear-animation 0.1s ease;
+    animation-fill-mode: forwards;
   }
 }
 .components-accessible-toolbar .components-button svg,

package/build-types/badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/badge/index.tsx"],"names":[],"mappings":"AAUA;;GAEG;AACH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAG1D,iBAAS,KAAK,CAAE,EACf,SAAS,EACT,MAAkB,EAClB,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,uBAAuB,CAAE,UAAU,EAAE,MAAM,EAAE,KAAK,CAAE,+BA0CtD;AAED,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/badge/index.tsx"],"names":[],"mappings":"AAUA;;GAEG;AACH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAuB1D,iBAAS,KAAK,CAAE,EACf,SAAS,EACT,MAAkB,EAClB,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,uBAAuB,CAAE,UAAU,EAAE,MAAM,EAAE,KAAK,CAAE,+BAuBtD;AAED,eAAe,KAAK,CAAC"}

package/build-types/circular-option-picker/circular-option-picker-option.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"circular-option-picker-option.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/circular-option-picker-option.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA4D3C,wBAAgB,MAAM,CAAE,EACvB,SAAS,EACT,UAAU,EACV,iBAAsB,EACtB,WAAW,EACX,GAAG,eAAe,EAClB,EAAE,WAAW,+BAoCb"}
+{"version":3,"file":"circular-option-picker-option.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/circular-option-picker-option.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAgE3C,wBAAgB,MAAM,CAAE,EACvB,SAAS,EACT,UAAU,EACV,iBAAsB,EACtB,WAAW,EACX,GAAG,eAAe,EAClB,EAAE,WAAW,+BAwCb"}

package/build-types/circular-option-picker/circular-option-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"circular-option-picker.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/circular-option-picker.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EACX,yBAAyB,EAGzB,MAAM,SAAS,CAAC;AA4HjB,iBAAS,oBAAoB,CAAE,KAAK,EAAE,yBAAyB,+BA2C9D;kBA3CQ,oBAAoB;;;;;;AAkD7B,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"circular-option-picker.d.ts","sourceRoot":"","sources":["../../src/circular-option-picker/circular-option-picker.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EACX,yBAAyB,EAGzB,MAAM,SAAS,CAAC;AA2HjB,iBAAS,oBAAoB,CAAE,KAAK,EAAE,yBAAyB,+BA2C9D;kBA3CQ,oBAAoB;;;;;;AAkD7B,eAAe,oBAAoB,CAAC"}

package/build-types/circular-option-picker/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/circular-option-picker/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,kBAAkB,CAAC;AAKtD;;GAEG;AACH,OAAO,oBAAoB,MAAM,IAAI,CAAC;AAOtC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,oBAAoB,CA6C5C,CAAC;AACF,eAAe,IAAI,CAAC;AAiDpB,eAAO,MAAM,OAAO,mIAAsB,CAAC;AAM3C,eAAO,MAAM,SAAS,mIAAsB,CAAC;AAM7C,eAAO,MAAM,mBAAmB,mIAAsB,CAAC;AAiBvD,eAAO,MAAM,gBAAgB,mIAAsB,CAAC;AAOpD,eAAO,MAAM,sBAAsB,mIAAsB,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/circular-option-picker/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,kBAAkB,CAAC;AAKtD;;GAEG;AACH,OAAO,oBAAoB,MAAM,IAAI,CAAC;AAOtC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,oBAAoB,CA6C5C,CAAC;AACF,eAAe,IAAI,CAAC;AAgDpB,eAAO,MAAM,OAAO,mIAAsB,CAAC;AAM3C,eAAO,MAAM,SAAS,mIAAsB,CAAC;AAM7C,eAAO,MAAM,mBAAmB,mIAAsB,CAAC;AAiBvD,eAAO,MAAM,gBAAgB,mIAAsB,CAAC;AAOpD,eAAO,MAAM,sBAAsB,mIAAsB,CAAC"}

package/build-types/color-palette/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-palette/index.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAEX,iBAAiB,EACjB,8BAA8B,EAI9B,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AA2G1D,wBAAgB,yBAAyB,CAAE,EAC1C,mBAAmB,EACnB,YAAY,EAAE,oBAAoB,EAClC,GAAG,KAAK,EACR,EAAE,8BAA8B,+BAgChC;AA8LD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,YAAY,mIAAwC,CAAC;AAElE,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-palette/index.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAEX,iBAAiB,EACjB,8BAA8B,EAI9B,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAoG1D,wBAAgB,yBAAyB,CAAE,EAC1C,mBAAmB,EACnB,YAAY,EAAE,oBAAoB,EAClC,GAAG,KAAK,EACR,EAAE,8BAA8B,+BAgChC;AA8LD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,YAAY,mIAAwC,CAAC;AAElE,eAAe,YAAY,CAAC"}

package/build-types/higher-order/with-focus-return/index.d.ts

@@ -9,7 +9,7 @@
  *                describing the component and the
  *                focus return characteristics.
  *
- * @return Higher Order Component with the focus restauration behaviour.
+ * @return Higher Order Component with the focus restoration behaviour.
  */
 declare const _default: (Inner: import("react").ComponentType<any>) => import("react").ComponentType<any>;
 export default _default;