@lime-bundles/react 7.3.0 → 7.3.1

package/dist/index.cjs

@@ -3066,6 +3066,8 @@ function normalizeText2(str) {
   return str.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
 }
 var FILTERS_ALL2 = "__all__";
+var STEP_CASCADE_MS = 500;
+var AUTO_ADVANCE_HOLD_MS = 160;
 function MultiStepPicker({
   bundle,
   currency,
@@ -3089,6 +3091,8 @@ function MultiStepPicker({
   const closeBtnRef = (0, import_react15.useRef)(null);
   const listRef = (0, import_react15.useRef)(null);
   const mouseDownTarget = (0, import_react15.useRef)(null);
+  const cascadeTimer = (0, import_react15.useRef)(null);
+  const autoAdvanceTimer = (0, import_react15.useRef)(null);
   const [open, setOpen] = (0, import_react15.useState)(false);
   const [stepIndex, setStepIndex] = (0, import_react15.useState)(
     () => Math.max(0, Math.min(steps.length - 1, initialStep))
@@ -3124,6 +3128,14 @@ function MultiStepPicker({
     const id = requestAnimationFrame(() => setOpen(true));
     return () => cancelAnimationFrame(id);
   }, []);
+  (0, import_react15.useEffect)(() => {
+    return () => {
+      if (cascadeTimer.current !== null) clearTimeout(cascadeTimer.current);
+      if (autoAdvanceTimer.current !== null) {
+        clearTimeout(autoAdvanceTimer.current);
+      }
+    };
+  }, []);
   useScrollLock(true);
   useFocusTrap({
     active: true,
@@ -3152,12 +3164,36 @@ function MultiStepPicker({
     lastSeen.current = { step: stepIndex, units: unitsInStep };
     if (!autoAdvance || isLastStep || prev.step !== stepIndex) return;
     if (unitsInStep <= prev.units) return;
-    if ((0, import_core13.stepHeadroom)(step?.maxQuantity ?? null, unitsInStep) === 0) {
-      goToStep(stepIndex + 1);
+    if ((0, import_core13.stepHeadroom)(step?.maxQuantity ?? null, unitsInStep) !== 0) return;
+    const from = stepIndex;
+    if (autoAdvanceTimer.current !== null) {
+      clearTimeout(autoAdvanceTimer.current);
     }
+    autoAdvanceTimer.current = setTimeout(() => {
+      autoAdvanceTimer.current = null;
+      goToStep(from + 1);
+    }, AUTO_ADVANCE_HOLD_MS);
   });
   function goToStep(i) {
     const clamped = Math.max(0, Math.min(steps.length - 1, i));
+    if (autoAdvanceTimer.current !== null) {
+      clearTimeout(autoAdvanceTimer.current);
+      autoAdvanceTimer.current = null;
+    }
+    const dialog = dialogRef.current;
+    if (dialog && clamped !== stepIndex) {
+      if (cascadeTimer.current !== null) clearTimeout(cascadeTimer.current);
+      dialog.removeAttribute("data-step-transition");
+      void dialog.offsetHeight;
+      dialog.setAttribute(
+        "data-step-transition",
+        clamped > stepIndex ? "forward" : "back"
+      );
+      cascadeTimer.current = setTimeout(() => {
+        cascadeTimer.current = null;
+        dialog.removeAttribute("data-step-transition");
+      }, STEP_CASCADE_MS);
+    }
     setStepIndex(clamped);
     setQuery("");
     setActiveType(FILTERS_ALL2);