@eightshift/ui-components 1.7.1 → 1.8.0

package/dist/assets/wp-ui-enhancements.css

@@ -1 +1 @@
-.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:-webkit-any(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:-moz-any(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:is(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.components-input-control__container,.components-combobox-control__suggestions-container,.components-checkbox-control__input,button.components-toggle-group-control-option-base,.editor-post-visibility__password-input{border-radius:.25rem!important}.components-button-group .components-button:first-child{border-top-left-radius:.375rem!important;border-bottom-left-radius:.375rem!important}.components-button-group .components-button:last-child{border-top-right-radius:.375rem!important;border-bottom-right-radius:.375rem!important}.components-popover__content,.components-guide{border-radius:.5rem!important}.block-editor-inserter__search{border-top-left-radius:.5rem!important;border-top-right-radius:.5rem!important}.media-menu-item.active{border-top-left-radius:.375rem!important;border-top-right-radius:.375rem!important}.components-base-control__label,.components-input-control__label,.components-custom-select-control__label{text-transform:none!important;letter-spacing:0!important;font-size:13px!important;font-weight:400!important}.edit-post-sidebar,.interface-interface-skeleton__sidebar:not(:empty)>.interface-complementary-area__fill[style="width: 280px;"],.interface-complementary-area.editor-sidebar{width:20rem!important}.block-editor-block-list__block-crash-warning{--tw-shadow:var(--tw-shadow-colored)!important;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;--tw-shadow-color:#b91c1c1a!important;border-color:#b91c1c26!important;border-radius:.5rem!important}.block-editor-block-list__block-crash-warning .block-editor-warning__message{--tw-text-opacity:1!important;color:rgb(69 10 10/var(--tw-text-opacity))!important}.wp-block-missing div.block-editor-warning{--tw-border-opacity:1!important;border-color:rgb(212 212 216/var(--tw-border-opacity))!important;--tw-shadow:var(--tw-shadow-colored)!important;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;--tw-shadow-color:#3f3f4633!important;background-color:#fafafabf!important;border-radius:.5rem!important}.wp-block-missing div.block-editor-warning .block-editor-warning__message{--tw-text-opacity:1!important;color:rgb(9 9 11/var(--tw-text-opacity))!important}.block-editor-block-contextual-toolbar,.block-editor-block-parent-selector__button{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item{border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item:after{content:var(--tw-content)!important;border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item svg{--tw-scale-x:1.25;--tw-scale-y:1.25;transform:translate(var(--tw-translate-x),var(--tw-translate-y))rotate(var(--tw-rotate))skewX(var(--tw-skew-x))skewY(var(--tw-skew-y))scaleX(var(--tw-scale-x))scaleY(var(--tw-scale-y))}.block-editor-list-view-tree .block-editor-block-icon{border-radius:.25rem!important}.block-editor-list-view-tree .block-editor-list-view-leaf>:first-child{border-top-left-radius:.5rem!important;border-bottom-left-radius:.5rem!important}.block-editor-list-view-tree .block-editor-list-view-leaf>:last-child{border-top-right-radius:.5rem!important;border-bottom-right-radius:.5rem!important}.block-editor-block-inspector .block-editor-block-card .block-editor-block-icon{border-radius:.25rem!important}.block-editor-inserter__toggle{border-radius:.375rem!important}:is(.edit-post-header__toolbar,.edit-post-header__settings,.editor-document-tools__left,.editor-header__center,.editor-header__settings) .components-button{min-height:2.25rem!important}:is(.edit-post-header__toolbar,.edit-post-header__settings,.editor-document-tools__left,.editor-header__center,.editor-header__settings) .components-button{min-width:2.25rem!important}.editor-styles-wrapper .wp-block:not(:-webkit-any(.editor-post-title,.block-list-appender)){max-width:100%!important}.editor-styles-wrapper .wp-block:not(:-moz-any(.editor-post-title,.block-list-appender)){max-width:100%!important}.editor-styles-wrapper .wp-block:not(:is(.editor-post-title,.block-list-appender)){max-width:100%!important}.components-tooltip{--tw-border-opacity:1;border-width:1px;border-color:rgb(31 41 55/var(--tw-border-opacity));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity));--tw-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);--tw-backdrop-blur:blur(24px);--tw-backdrop-brightness:brightness(1.05);--tw-backdrop-saturate:saturate(1.5);-webkit-backdrop-filter:var(--tw-backdrop-blur)var(--tw-backdrop-brightness)var(--tw-backdrop-contrast)var(--tw-backdrop-grayscale)var(--tw-backdrop-hue-rotate)var(--tw-backdrop-invert)var(--tw-backdrop-opacity)var(--tw-backdrop-saturate)var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur)var(--tw-backdrop-brightness)var(--tw-backdrop-contrast)var(--tw-backdrop-grayscale)var(--tw-backdrop-hue-rotate)var(--tw-backdrop-invert)var(--tw-backdrop-opacity)var(--tw-backdrop-saturate)var(--tw-backdrop-sepia);background-color:#030712b3;padding:.125rem .25rem;border-radius:.375rem!important}.components-tooltip:has(>:first-child){--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity));--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity));background-color:#fffc}
+.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:-webkit-any(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:-moz-any(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.edit-post-header__toolbar .components-button,.edit-post-header__settings .components-button,.editor-document-tools__left .components-button,.editor-header__center .components-button,.editor-header__settings .components-button,.edit-post-sidebar .components-button:not(:is(.components-panel__body-toggle,.editor-post-last-revision__title)),.components-snackbar,.components-toggle-group-control,.editor-post-publish-panel .components-button,.edit-post-text-editor__toolbar .components-button,.edit-post-text-editor__body .components-textarea-control__input,.media-modal-content,.media-modal-content .components-button,.components-guide__container .components-button,.components-notice__content .components-button,.editor-post-featured-image__toggle.components-button{border-radius:.375rem!important}.components-input-control__container,.components-combobox-control__suggestions-container,.components-checkbox-control__input,button.components-toggle-group-control-option-base,.editor-post-visibility__password-input{border-radius:.25rem!important}.components-button-group .components-button:first-child{border-top-left-radius:.375rem!important;border-bottom-left-radius:.375rem!important}.components-button-group .components-button:last-child{border-top-right-radius:.375rem!important;border-bottom-right-radius:.375rem!important}.components-popover__content,.components-guide{border-radius:.5rem!important}.block-editor-inserter__search{border-top-left-radius:.5rem!important;border-top-right-radius:.5rem!important}.media-menu-item.active{border-top-left-radius:.375rem!important;border-top-right-radius:.375rem!important}.components-base-control__label,.components-input-control__label,.components-custom-select-control__label{text-transform:none!important;letter-spacing:0!important;font-size:13px!important;font-weight:400!important}.edit-post-sidebar,.interface-interface-skeleton__sidebar:not(:empty)>.interface-complementary-area__fill[style="width: 280px;"],.interface-complementary-area.editor-sidebar{width:20rem!important}.block-editor-block-list__block-crash-warning{--tw-shadow:var(--tw-shadow-colored)!important;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;--tw-shadow-color:#b91c1c1a!important;border-color:#b91c1c26!important;border-radius:.5rem!important}.block-editor-block-list__block-crash-warning .block-editor-warning__message{--tw-text-opacity:1!important;color:rgb(69 10 10/var(--tw-text-opacity,1))!important}.wp-block-missing div.block-editor-warning{--tw-border-opacity:1!important;border-color:rgb(212 212 216/var(--tw-border-opacity,1))!important;--tw-shadow:var(--tw-shadow-colored)!important;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;--tw-shadow-color:#3f3f4633!important;background-color:#fafafabf!important;border-radius:.5rem!important}.wp-block-missing div.block-editor-warning .block-editor-warning__message{--tw-text-opacity:1!important;color:rgb(9 9 11/var(--tw-text-opacity,1))!important}.block-editor-block-contextual-toolbar,.block-editor-block-parent-selector__button{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item{border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item:after{content:var(--tw-content)!important;border-radius:.5rem!important}.block-editor-block-types-list .block-editor-block-types-list__item svg{--tw-scale-x:1.25;--tw-scale-y:1.25;transform:translate(var(--tw-translate-x),var(--tw-translate-y))rotate(var(--tw-rotate))skewX(var(--tw-skew-x))skewY(var(--tw-skew-y))scaleX(var(--tw-scale-x))scaleY(var(--tw-scale-y))}.block-editor-list-view-tree .block-editor-block-icon{border-radius:.25rem!important}.block-editor-list-view-tree .block-editor-list-view-leaf>:first-child{border-top-left-radius:.5rem!important;border-bottom-left-radius:.5rem!important}.block-editor-list-view-tree .block-editor-list-view-leaf>:last-child{border-top-right-radius:.5rem!important;border-bottom-right-radius:.5rem!important}.block-editor-block-inspector .block-editor-block-card .block-editor-block-icon{border-radius:.25rem!important}.block-editor-inserter__toggle{border-radius:.375rem!important}:is(.edit-post-header__toolbar,.edit-post-header__settings,.editor-document-tools__left,.editor-header__center,.editor-header__settings) .components-button{min-height:2.25rem!important}:is(.edit-post-header__toolbar,.edit-post-header__settings,.editor-document-tools__left,.editor-header__center,.editor-header__settings) .components-button{min-width:2.25rem!important}.editor-styles-wrapper .wp-block:not(:-webkit-any(.editor-post-title,.block-list-appender)){max-width:100%!important}.editor-styles-wrapper .wp-block:not(:-moz-any(.editor-post-title,.block-list-appender)){max-width:100%!important}.editor-styles-wrapper .wp-block:not(:is(.editor-post-title,.block-list-appender)){max-width:100%!important}.components-tooltip{--tw-border-opacity:1;border-width:1px;border-color:rgb(31 41 55/var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);--tw-backdrop-blur:blur(24px);--tw-backdrop-brightness:brightness(1.05);--tw-backdrop-saturate:saturate(1.5);-webkit-backdrop-filter:var(--tw-backdrop-blur)var(--tw-backdrop-brightness)var(--tw-backdrop-contrast)var(--tw-backdrop-grayscale)var(--tw-backdrop-hue-rotate)var(--tw-backdrop-invert)var(--tw-backdrop-opacity)var(--tw-backdrop-saturate)var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur)var(--tw-backdrop-brightness)var(--tw-backdrop-contrast)var(--tw-backdrop-grayscale)var(--tw-backdrop-hue-rotate)var(--tw-backdrop-invert)var(--tw-backdrop-opacity)var(--tw-backdrop-saturate)var(--tw-backdrop-sepia);background-color:#030712b3;padding:.125rem .25rem;border-radius:.375rem!important}.components-tooltip:has(>:first-child){--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1));background-color:#fffc}

package/dist/components/animated-visibility/animated-visibility.js

@@ -1135,12 +1135,28 @@ class BaseAnimation {
   then(resolve, reject) {
     return this.currentFinishedPromise.then(resolve, reject);
   }
+  flatten() {
+    this.options.type = "keyframes";
+    this.options.ease = "linear";
+  }
   updateFinishedPromise() {
     this.currentFinishedPromise = new Promise((resolve) => {
       this.resolveFinishedPromise = resolve;
     });
   }
 }
+const progress = (from, to, value) => {
+  const toFromDifference = to - from;
+  return toFromDifference === 0 ? 1 : (value - from) / toFromDifference;
+};
+const generateLinearEasing = (easing, duration, resolution = 10) => {
+  let points = "";
+  const numPoints = Math.max(Math.round(duration / resolution), 2);
+  for (let i = 0; i < numPoints; i++) {
+    points += easing(progress(0, numPoints - 1, i)) + ", ";
+  }
+  return `linear(${points.substring(0, points.length - 2)})`;
+};
 function velocityPerSecond(velocity, frameDuration) {
   return frameDuration ? velocity * (1e3 / frameDuration) : 0;
 }
@@ -1149,18 +1165,43 @@ function calcGeneratorVelocity(resolveValue, t, current) {
   const prevT = Math.max(t - velocitySampleDuration, 0);
   return velocityPerSecond(current - resolveValue(prevT), t - prevT);
 }
+const springDefaults = {
+  // Default spring physics
+  stiffness: 100,
+  damping: 10,
+  mass: 1,
+  velocity: 0,
+  // Default duration/bounce-based options
+  duration: 800,
+  // in ms
+  bounce: 0.3,
+  visualDuration: 0.3,
+  // in seconds
+  // Rest thresholds
+  restSpeed: {
+    granular: 0.01,
+    default: 2
+  },
+  restDelta: {
+    granular: 5e-3,
+    default: 0.5
+  },
+  // Limits
+  minDuration: 0.01,
+  // in seconds
+  maxDuration: 10,
+  // in seconds
+  minDamping: 0.05,
+  maxDamping: 1
+};
 const safeMin = 1e-3;
-const minDuration = 0.01;
-const maxDuration$1 = 10;
-const minDamping = 0.05;
-const maxDamping = 1;
-function findSpring({ duration = 800, bounce = 0.25, velocity = 0, mass = 1 }) {
+function findSpring({ duration = springDefaults.duration, bounce = springDefaults.bounce, velocity = springDefaults.velocity, mass = springDefaults.mass }) {
   let envelope;
   let derivative;
-  warning(duration <= secondsToMilliseconds(maxDuration$1), "Spring duration must be 10 seconds or less");
+  warning(duration <= secondsToMilliseconds(springDefaults.maxDuration), "Spring duration must be 10 seconds or less");
   let dampingRatio = 1 - bounce;
-  dampingRatio = clamp(minDamping, maxDamping, dampingRatio);
-  duration = clamp(minDuration, maxDuration$1, millisecondsToSeconds(duration));
+  dampingRatio = clamp(springDefaults.minDamping, springDefaults.maxDamping, dampingRatio);
+  duration = clamp(springDefaults.minDuration, springDefaults.maxDuration, millisecondsToSeconds(duration));
   if (dampingRatio < 1) {
     envelope = (undampedFreq2) => {
       const exponentialDecay = undampedFreq2 * dampingRatio;
@@ -1197,8 +1238,8 @@ function findSpring({ duration = 800, bounce = 0.25, velocity = 0, mass = 1 }) {
   duration = secondsToMilliseconds(duration);
   if (isNaN(undampedFreq)) {
     return {
-      stiffness: 100,
-      damping: 10,
+      stiffness: springDefaults.stiffness,
+      damping: springDefaults.damping,
       duration
     };
   } else {
@@ -1221,6 +1262,17 @@ function approximateRoot(envelope, derivative, initialGuess) {
 function calcAngularFreq(undampedFreq, dampingRatio) {
   return undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
 }
+const maxGeneratorDuration = 2e4;
+function calcGeneratorDuration(generator) {
+  let duration = 0;
+  const timeStep = 50;
+  let state = generator.next(duration);
+  while (!state.done && duration < maxGeneratorDuration) {
+    duration += timeStep;
+    state = generator.next(duration);
+  }
+  return duration >= maxGeneratorDuration ? Infinity : duration;
+}
 const durationKeys = ["duration", "bounce"];
 const physicsKeys = ["stiffness", "damping", "mass"];
 function isSpringType(options, keys) {
@@ -1228,27 +1280,46 @@ function isSpringType(options, keys) {
 }
 function getSpringOptions(options) {
   let springOptions = {
-    velocity: 0,
-    stiffness: 100,
-    damping: 10,
-    mass: 1,
+    velocity: springDefaults.velocity,
+    stiffness: springDefaults.stiffness,
+    damping: springDefaults.damping,
+    mass: springDefaults.mass,
     isResolvedFromDuration: false,
     ...options
   };
   if (!isSpringType(options, physicsKeys) && isSpringType(options, durationKeys)) {
-    const derived = findSpring(options);
-    springOptions = {
-      ...springOptions,
-      ...derived,
-      mass: 1
-    };
-    springOptions.isResolvedFromDuration = true;
+    if (options.visualDuration) {
+      const visualDuration = options.visualDuration;
+      const root = 2 * Math.PI / (visualDuration * 1.2);
+      const stiffness = root * root;
+      const damping = 2 * clamp(0.05, 1, 1 - options.bounce) * Math.sqrt(stiffness);
+      springOptions = {
+        ...springOptions,
+        mass: springDefaults.mass,
+        stiffness,
+        damping
+      };
+    } else {
+      const derived = findSpring(options);
+      springOptions = {
+        ...springOptions,
+        ...derived,
+        mass: springDefaults.mass
+      };
+      springOptions.isResolvedFromDuration = true;
+    }
   }
   return springOptions;
 }
-function spring({ keyframes: keyframes2, restDelta, restSpeed, ...options }) {
-  const origin = keyframes2[0];
-  const target = keyframes2[keyframes2.length - 1];
+function spring(optionsOrVisualDuration = springDefaults.visualDuration, bounce = springDefaults.bounce) {
+  const options = typeof optionsOrVisualDuration !== "object" ? {
+    visualDuration: optionsOrVisualDuration,
+    keyframes: [0, 1],
+    bounce
+  } : optionsOrVisualDuration;
+  let { restSpeed, restDelta } = options;
+  const origin = options.keyframes[0];
+  const target = options.keyframes[options.keyframes.length - 1];
   const state = { done: false, value: origin };
   const { stiffness, damping, mass, duration, velocity, isResolvedFromDuration } = getSpringOptions({
     ...options,
@@ -1259,8 +1330,8 @@ function spring({ keyframes: keyframes2, restDelta, restSpeed, ...options }) {
   const initialDelta = target - origin;
   const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass));
   const isGranularScale = Math.abs(initialDelta) < 5;
-  restSpeed || (restSpeed = isGranularScale ? 0.01 : 2);
-  restDelta || (restDelta = isGranularScale ? 5e-3 : 0.5);
+  restSpeed || (restSpeed = isGranularScale ? springDefaults.restSpeed.granular : springDefaults.restSpeed.default);
+  restDelta || (restDelta = isGranularScale ? springDefaults.restDelta.granular : springDefaults.restDelta.default);
   let resolveSpring;
   if (dampingRatio < 1) {
     const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
@@ -1278,7 +1349,7 @@ function spring({ keyframes: keyframes2, restDelta, restSpeed, ...options }) {
       return target - envelope * ((initialVelocity + dampingRatio * undampedAngularFreq * initialDelta) * Math.sinh(freqForT) + dampedAngularFreq * initialDelta * Math.cosh(freqForT)) / dampedAngularFreq;
     };
   }
-  return {
+  const generator = {
     calculatedDuration: isResolvedFromDuration ? duration || null : null,
     next: (t) => {
       const current = resolveSpring(t);
@@ -1295,8 +1366,14 @@ function spring({ keyframes: keyframes2, restDelta, restSpeed, ...options }) {
       }
       state.value = state.done ? target : current;
       return state;
+    },
+    toString: () => {
+      const calculatedDuration = Math.min(calcGeneratorDuration(generator), maxGeneratorDuration);
+      const easing = generateLinearEasing((progress2) => generator.next(calculatedDuration * progress2).value, calculatedDuration, 30);
+      return calculatedDuration + "ms " + easing;
     }
   };
+  return generator;
 }
 function inertia({ keyframes: keyframes2, velocity = 0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed }) {
   const origin = keyframes2[0];
@@ -1393,10 +1470,6 @@ const easingDefinitionToFunction = (definition) => {
 };
 const combineFunctions = (a, b) => (v) => b(a(v));
 const pipe = (...transformers) => transformers.reduce(combineFunctions);
-const progress = (from, to, value) => {
-  const toFromDifference = to - from;
-  return toFromDifference === 0 ? 1 : (value - from) / toFromDifference;
-};
 const mixNumber$1 = (from, to, progress2) => {
   return from + (to - from) * progress2;
 };
@@ -1638,17 +1711,6 @@ function keyframes({ duration = 300, keyframes: keyframeValues, times, ease: eas
     }
   };
 }
-const maxGeneratorDuration = 2e4;
-function calcGeneratorDuration(generator) {
-  let duration = 0;
-  const timeStep = 50;
-  let state = generator.next(duration);
-  while (!state.done && duration < maxGeneratorDuration) {
-    duration += timeStep;
-    state = generator.next(duration);
-  }
-  return duration >= maxGeneratorDuration ? Infinity : duration;
-}
 const frameloopDriver = (update) => {
   const passTimestamp = ({ timestamp }) => update(timestamp);
   return {
@@ -1694,6 +1756,12 @@ class MainThreadAnimation extends BaseAnimation {
     this.resolver = new KeyframeResolver$1(keyframes2, onResolved, name, motionValue2, element);
     this.resolver.scheduleResolve();
   }
+  flatten() {
+    super.flatten();
+    if (this._resolved) {
+      Object.assign(this._resolved, this.initPlayback(this._resolved.keyframes));
+    }
+  }
   initPlayback(keyframes$1) {
     const { type = "keyframes", repeat = 0, repeatDelay = 0, repeatType, velocity = 0 } = this.options;
     const generatorFactory = isGenerator(type) ? type : generators[type] || keyframes;
@@ -1924,15 +1992,6 @@ const acceleratedValues = /* @__PURE__ */ new Set([
   // or until we implement support for linear() easing.
   // "background-color"
 ]);
-const resolution = 10;
-const generateLinearEasing = (easing, duration) => {
-  let points = "";
-  const numPoints = Math.max(Math.round(duration / resolution), 2);
-  for (let i = 0; i < numPoints; i++) {
-    points += easing(progress(0, numPoints - 1, i)) + ", ";
-  }
-  return `linear(${points.substring(0, points.length - 2)})`;
-};
 function memo(callback) {
   let result;
   return () => {
@@ -1987,7 +2046,7 @@ function mapEasingToNativeEasing(easing, duration) {
     return supportedWaapiEasing[easing];
   }
 }
-function startWaapiAnimation(element, valueName, keyframes2, { delay: delay2 = 0, duration = 300, repeat = 0, repeatType = "loop", ease: ease2, times } = {}) {
+function startWaapiAnimation(element, valueName, keyframes2, { delay: delay2 = 0, duration = 300, repeat = 0, repeatType = "loop", ease: ease2 = "easeInOut", times } = {}) {
   const keyframeOptions = { [valueName]: keyframes2 };
   if (times)
     keyframeOptions.offset = times;
@@ -2292,6 +2351,9 @@ class GroupPlaybackControls {
   runAll(methodName) {
     this.animations.forEach((controls) => controls[methodName]());
   }
+  flatten() {
+    this.runAll("flatten");
+  }
   play() {
     this.runAll("play");
   }
@@ -2426,7 +2488,7 @@ class MotionValue {
    * @internal
    */
   constructor(init, options = {}) {
-    this.version = "11.11.4";
+    this.version = "11.12.0";
     this.canTrackVelocity = null;
     this.events = {};
     this.updateAndNotify = (v, render = true) => {
@@ -2704,22 +2766,10 @@ const isMotionValue = (value) => Boolean(value && value.getVelocity);
 function isWillChangeMotionValue(value) {
   return Boolean(isMotionValue(value) && value.add);
 }
-function getWillChangeName(name) {
-  if (transformProps.has(name)) {
-    return "transform";
-  } else if (acceleratedValues.has(name)) {
-    return camelToDash(name);
-  }
-}
 function addValueToWillChange(visualElement, key) {
-  var _a;
-  if (!visualElement.applyWillChange)
-    return;
   const willChange = visualElement.getValue("willChange");
   if (isWillChangeMotionValue(willChange)) {
     return willChange.add(key);
-  } else if (!((_a = visualElement.props.style) === null || _a === void 0 ? void 0 : _a.willChange) && getWillChangeName(key)) {
-    visualElement.setStaticValue("willChange", "transform");
   }
 }
 function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
@@ -5835,14 +5885,18 @@ function useVisualElement(Component2, visualState, props, createVisualElement, P
   if (visualElement && !visualElement.projection && ProjectionNodeConstructor && (visualElement.type === "html" || visualElement.type === "svg")) {
     createProjectionNode(visualElementRef.current, props, ProjectionNodeConstructor, initialLayoutGroupConfig);
   }
+  const isMounted = useRef(false);
   useInsertionEffect(() => {
-    visualElement && visualElement.update(props, presenceContext);
+    if (visualElement && isMounted.current) {
+      visualElement.update(props, presenceContext);
+    }
   });
   const optimisedAppearId = props[optimizedAppearDataAttribute];
   const wantsHandoff = useRef(Boolean(optimisedAppearId) && !((_a = window.MotionHandoffIsComplete) === null || _a === void 0 ? void 0 : _a.call(window, optimisedAppearId)) && ((_b = window.MotionHasOptimisedAnimation) === null || _b === void 0 ? void 0 : _b.call(window, optimisedAppearId)));
   useIsomorphicLayoutEffect(() => {
     if (!visualElement)
       return;
+    isMounted.current = true;
     window.MotionIsMounted = true;
     visualElement.updateFeatures();
     microtask.render(visualElement.render);
@@ -6123,9 +6177,6 @@ function scrapeMotionValuesFromProps$1(props, prevProps, visualElement) {
       newValues[key] = style[key];
     }
   }
-  if (visualElement && style && typeof style.willChange === "string") {
-    visualElement.applyWillChange = false;
-  }
   return newValues;
 }
 function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
@@ -6145,9 +6196,9 @@ function useConstant(init) {
   }
   return ref.current;
 }
-function makeState({ applyWillChange = false, scrapeMotionValuesFromProps: scrapeMotionValuesFromProps2, createRenderState, onMount }, props, context, presenceContext, isStatic) {
+function makeState({ scrapeMotionValuesFromProps: scrapeMotionValuesFromProps2, createRenderState, onMount }, props, context, presenceContext) {
   const state = {
-    latestValues: makeLatestValues(props, context, presenceContext, isStatic ? false : applyWillChange, scrapeMotionValuesFromProps2),
+    latestValues: makeLatestValues(props, context, presenceContext, scrapeMotionValuesFromProps2),
     renderState: createRenderState()
   };
   if (onMount) {
@@ -6158,23 +6209,11 @@ function makeState({ applyWillChange = false, scrapeMotionValuesFromProps: scrap
 const makeUseVisualState = (config) => (props, isStatic) => {
   const context = useContext(MotionContext);
   const presenceContext = useContext(PresenceContext);
-  const make = () => makeState(config, props, context, presenceContext, isStatic);
+  const make = () => makeState(config, props, context, presenceContext);
   return isStatic ? make() : useConstant(make);
 };
-function forEachDefinition(props, definition, callback) {
-  const list = Array.isArray(definition) ? definition : [definition];
-  for (let i = 0; i < list.length; i++) {
-    const resolved = resolveVariantFromProps(props, list[i]);
-    if (resolved) {
-      const { transitionEnd, transition, ...target } = resolved;
-      callback(target, transitionEnd);
-    }
-  }
-}
-function makeLatestValues(props, context, presenceContext, shouldApplyWillChange, scrapeMotionValues) {
-  var _a;
+function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
   const values = {};
-  let applyWillChange = shouldApplyWillChange && ((_a = props.style) === null || _a === void 0 ? void 0 : _a.willChange) === void 0;
   const motionValues = scrapeMotionValues(props, {});
   for (const key in motionValues) {
     values[key] = resolveMotionValue(motionValues[key]);
@@ -6192,33 +6231,25 @@ function makeLatestValues(props, context, presenceContext, shouldApplyWillChange
   isInitialAnimationBlocked = isInitialAnimationBlocked || initial === false;
   const variantToSet = isInitialAnimationBlocked ? animate : initial;
   if (variantToSet && typeof variantToSet !== "boolean" && !isAnimationControls(variantToSet)) {
-    forEachDefinition(props, variantToSet, (target, transitionEnd) => {
-      for (const key in target) {
-        let valueTarget = target[key];
-        if (Array.isArray(valueTarget)) {
-          const index = isInitialAnimationBlocked ? valueTarget.length - 1 : 0;
-          valueTarget = valueTarget[index];
-        }
-        if (valueTarget !== null) {
-          values[key] = valueTarget;
-        }
-      }
-      for (const key in transitionEnd) {
-        values[key] = transitionEnd[key];
-      }
-    });
-  }
-  if (applyWillChange) {
-    if (animate && initial !== false && !isAnimationControls(animate)) {
-      forEachDefinition(props, animate, (target) => {
+    const list = Array.isArray(variantToSet) ? variantToSet : [variantToSet];
+    for (let i = 0; i < list.length; i++) {
+      const resolved = resolveVariantFromProps(props, list[i]);
+      if (resolved) {
+        const { transitionEnd, transition, ...target } = resolved;
         for (const key in target) {
-          const willChangeName = getWillChangeName(key);
-          if (willChangeName) {
-            values.willChange = "transform";
-            return;
+          let valueTarget = target[key];
+          if (Array.isArray(valueTarget)) {
+            const index = isInitialAnimationBlocked ? valueTarget.length - 1 : 0;
+            valueTarget = valueTarget[index];
+          }
+          if (valueTarget !== null) {
+            values[key] = valueTarget;
           }
         }
-      });
+        for (const key in transitionEnd) {
+          values[key] = transitionEnd[key];
+        }
+      }
     }
   }
   return values;
@@ -6402,7 +6433,6 @@ const svgMotionConfig = {
 };
 const htmlMotionConfig = {
   useVisualState: makeUseVisualState({
-    applyWillChange: true,
     scrapeMotionValuesFromProps: scrapeMotionValuesFromProps$1,
     createRenderState: createHtmlRenderState
   })
@@ -6565,7 +6595,7 @@ function updateMotionValuesFromProps(element, next, prev) {
     if (isMotionValue(nextValue)) {
       element.addValue(key, nextValue);
       if (process.env.NODE_ENV === "development") {
-        warnOnce(nextValue.version === "11.11.4", `Attempting to mix Framer Motion versions ${nextValue.version} with 11.11.4 may not work as expected.`);
+        warnOnce(nextValue.version === "11.12.0", `Attempting to mix Motion versions ${nextValue.version} with 11.12.0 may not work as expected.`);
       }
     } else if (isMotionValue(prevValue)) {
       element.addValue(key, motionValue(nextValue, { owner: element }));
@@ -6613,7 +6643,6 @@ class VisualElement {
     return {};
   }
   constructor({ parent, props, presenceContext, reducedMotionConfig, blockInitialAnimation, visualState }, options = {}) {
-    this.applyWillChange = false;
     this.current = null;
     this.children = /* @__PURE__ */ new Set();
     this.isVariantNode = false;
@@ -6964,7 +6993,6 @@ class HTMLVisualElement extends DOMVisualElement {
   constructor() {
     super(...arguments);
     this.type = "html";
-    this.applyWillChange = true;
     this.renderInstance = renderHTML;
   }
   readValueFromInstance(instance, key) {

package/dist/components/base-control/base-control.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-BVIXT8qq.js";
+import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-DImhB4rT.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 /**

package/dist/components/button/button.js

@@ -1,13 +1,13 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { a as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-VbCAu4hd.js";
-import { j as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, b as $64fa3d84918910a7$export$4d86445c2cf5e3, c as $3ef42575df84b30b$export$9d1611c77c2fe928, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-BCJajCwh.js";
-import { a as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-CtCX0OGo.js";
-import React__default, { useState, useRef, forwardRef, createContext } from "react";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-Cs-ZD1nu.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-Xa6Ny0p_.js";
+import { k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, b as $64fa3d84918910a7$export$4d86445c2cf5e3, d as $3ef42575df84b30b$export$9d1611c77c2fe928, m as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-BSxcP7tv.js";
+import { a as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-uV-xoRHT.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
+import React__default, { useState, useRef, forwardRef, createContext } from "react";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BI3VdU0Z.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
-import { T as Tooltip } from "../../tooltip-eKaARDoV.js";
-import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
+import { Tooltip } from "../tooltip/tooltip.js";
+import { _ as __ } from "../../default-i18n-CM1-Xvzf.js";
 function $2680b1829e803644$export$fa142eb1681c520(props, ref) {
   const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, orientation = "horizontal" } = props;
   let [isInToolbar, setInToolbar] = useState(false);
@@ -51,6 +51,9 @@ function $2680b1829e803644$export$fa142eb1681c520(props, ref) {
   };
   return {
     toolbarProps: {
+      ...$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
+        labelable: true
+      }),
       role: !isInToolbar ? "toolbar" : "group",
       "aria-orientation": orientation,
       "aria-label": ariaLabel,

package/dist/components/checkbox/checkbox.js

@@ -1,15 +1,16 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { a as $4e85f108e88277b8$export$b085522c77523c51 } from "../../RSPContexts-2lR5GG9p.js";
-import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, b as $64fa3d84918910a7$export$4d86445c2cf5e3, c as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../../utils-BCJajCwh.js";
+import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, m as $df56164dff5785e2$export$4338b53315abf666, n as $5dc95899b306f630$export$c9058316764c140e, i as $64fa3d84918910a7$export$ef03459518577ad4, b as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-BSxcP7tv.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
 import React__default, { useEffect, useRef, forwardRef, useContext, createContext } from "react";
-import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$dad6ae84456c676a, c as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../../useFormValidationState-BjMhz_VI.js";
-import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-BmltE9Zr.js";
-import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-DZXLEnA_.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-BMOTWmOx.js";
-import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-CgFLw4FA.js";
-import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-WhC7vZaL.js";
+import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$a763b9476acd3eb, c as $e5be200c675c3b3a$export$dad6ae84456c676a } from "../../useFormValidation-BNBrliSj.js";
+import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-BG9At5Lb.js";
+import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-QlyoyPYv.js";
+import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-C1mnFRiI.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-DKxoCzVD.js";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-Cl9cN7Qx.js";
+import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-wryJF4qQ.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { AnimatedVisibility } from "../animated-visibility/animated-visibility.js";
 import { icons } from "../../icons/icons.js";
@@ -29,8 +30,16 @@ function $406796ff087fe49b$export$e375f10ce42261c5(props, state, inputRef) {
   useEffect(() => {
     if (inputRef.current) inputRef.current.indeterminate = !!isIndeterminate;
   });
+  let { pressProps } = $f6c31cce2adf654f$export$45712eceda6fad21({
+    isDisabled: isDisabled || isReadOnly,
+    onPress() {
+      let { [$e5be200c675c3b3a$export$a763b9476acd3eb]: groupValidationState } = props;
+      let { commitValidation } = groupValidationState ? groupValidationState : validationState;
+      commitValidation();
+    }
+  });
   return {
-    labelProps,
+    labelProps: $3ef42575df84b30b$export$9d1611c77c2fe928(labelProps, pressProps),
     inputProps: {
       ...inputProps,
       checked: isSelected,
@@ -115,7 +124,7 @@ function $bc237834342dbd75$var$Checkbox(props, ref) {
   let groupState = useContext($bc237834342dbd75$export$139c5b8563afc1fc);
   let inputRef = $df56164dff5785e2$export$4338b53315abf666($5dc95899b306f630$export$c9058316764c140e(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
   let { labelProps, inputProps, isSelected, isDisabled, isReadOnly, isPressed, isInvalid } = groupState ? $fba3e38d5ca8983f$export$353b32fc6898d37d({
-    ...props,
+    ...$64fa3d84918910a7$export$ef03459518577ad4(props),
     // Value is optional for standalone checkboxes, but required for CheckboxGroup items;
     // it's passed explicitly here to avoid typescript error (requires ignore).
     // @ts-ignore
@@ -123,7 +132,7 @@ function $bc237834342dbd75$var$Checkbox(props, ref) {
     // ReactNode type doesn't allow function children.
     children: typeof props.children === "function" ? true : props.children
   }, groupState, inputRef) : $406796ff087fe49b$export$e375f10ce42261c5({
-    ...props,
+    ...$64fa3d84918910a7$export$ef03459518577ad4(props),
     children: typeof props.children === "function" ? true : props.children,
     validationBehavior
   }, $3017fa7ffdddec74$export$8042c6c013fd5226(props), inputRef);
@@ -134,7 +143,6 @@ function $bc237834342dbd75$var$Checkbox(props, ref) {
     isDisabled: isInteractionDisabled
   });
   let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
-    // TODO: should data attrs go on the label or on the <input>? useCheckbox passes them to the input...
     ...props,
     defaultClassName: "react-aria-Checkbox",
     values: {

package/dist/components/color-pickers/color-picker.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
+import { _ as __ } from "../../default-i18n-CM1-Xvzf.js";
 import { Menu, MenuItem, MenuSeparator, MenuSection } from "../menu/menu.js";
 import { ColorSwatch } from "./color-swatch.js";
 import { RichLabel } from "../rich-label/rich-label.js";

package/dist/components/color-pickers/color-swatch.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
-import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-CinC14s3.js";
-import { $ as $799cddbef784668f$export$6e865ea70d7724f } from "../../Color-BpLubxWI.js";
+import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-xOFAZO_h.js";
+import { $ as $799cddbef784668f$export$6e865ea70d7724f } from "../../Color-VsesNqCf.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
-import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
+import { _ as __ } from "../../default-i18n-CM1-Xvzf.js";
 /**
  * A simple color/gradient swatch.
  *

package/dist/components/color-pickers/gradient-editor.js

@@ -1,12 +1,12 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { _ as __, s as sprintf } from "../../default-i18n-DRnM8y4w.js";
+import { _ as __, s as sprintf } from "../../default-i18n-CM1-Xvzf.js";
 import { useMemo, useState } from "react";
 import { Button, ButtonGroup } from "../button/button.js";
 import { icons } from "../../icons/icons.js";
 import { SolidColorPicker } from "./solid-color-picker.js";
 import { Slider } from "../slider/slider.js";
 import { NumberPicker } from "../number-picker/number-picker.js";
-import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-CinC14s3.js";
+import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-xOFAZO_h.js";
 import { Menu, MenuItem } from "../menu/menu.js";
 import { MatrixAlign } from "../matrix-align/matrix-align.js";
 import { Spacer } from "../spacer/spacer.js";