@flamingo-stack/openframe-frontend-core 0.0.698-2527.7788.1 → 0.0.698

package/dist/{chunk-UVRLSOEJ.js → chunk-TN2RFU6D.js}

@@ -17,9 +17,10 @@ import {
   getHashTargetElement,
   normalizeHashFragment,
   scrollElementIntoView,
+  useAutoplay,
   useDebounce,
   useMediaQuery
-} from "./chunk-AVRVYWCS.js";
+} from "./chunk-CXQTK6W3.js";
 import {
   useRouter,
   useSearchParams
@@ -896,81 +897,8 @@ function useWindowSize() {
 // src/hooks/ui/index.ts
 import { usePreventScroll } from "@react-aria/overlays";
 
-// src/hooks/ui/use-prefers-reduced-motion.ts
-var PREFERS_REDUCED_MOTION_QUERY = "(prefers-reduced-motion: reduce)";
-function usePrefersReducedMotion() {
-  return useMediaQuery(PREFERS_REDUCED_MOTION_QUERY) === true;
-}
-function usePrefersReducedMotionState() {
-  return useMediaQuery(PREFERS_REDUCED_MOTION_QUERY);
-}
-
-// src/hooks/ui/use-in-view.ts
-import { useCallback as useCallback8, useEffect as useEffect10, useRef as useRef8, useState as useState10 } from "react";
-var STEPS = Array.from({ length: 21 }, (_, i) => i / 20);
-function useInView({
-  threshold = 0,
-  rootMargin = "0px"
-} = {}) {
-  const [inView, setInView] = useState10(false);
-  const observerRef = useRef8(null);
-  const disconnect = useCallback8(() => {
-    observerRef.current?.disconnect();
-    observerRef.current = null;
-  }, []);
-  const ref = useCallback8(
-    (node) => {
-      disconnect();
-      if (!node || typeof IntersectionObserver === "undefined") {
-        setInView(false);
-        return;
-      }
-      const observer = new IntersectionObserver(
-        (entries) => {
-          const entry = entries[entries.length - 1];
-          if (!entry) return;
-          const ofElement = entry.intersectionRatio >= threshold;
-          const viewportHeight = entry.rootBounds?.height ?? 0;
-          const ofViewport = viewportHeight > 0 && (entry.intersectionRect?.height ?? 0) >= viewportHeight * threshold;
-          setInView(entry.isIntersecting && (ofElement || ofViewport));
-        },
-        { threshold: STEPS, rootMargin }
-      );
-      observer.observe(node);
-      observerRef.current = observer;
-    },
-    [disconnect, threshold, rootMargin]
-  );
-  useEffect10(() => disconnect, [disconnect]);
-  return { ref, inView };
-}
-
-// src/hooks/ui/use-autoplay.ts
-import { useEffect as useEffect11, useState as useState11 } from "react";
-function useAutoplay(onScreen) {
-  const reducedState = usePrefersReducedMotionState();
-  const [paused, setPaused] = useState11(false);
-  const [tabHidden, setTabHidden] = useState11(false);
-  useEffect11(() => {
-    const sync2 = () => setTabHidden(document.visibilityState === "hidden");
-    sync2();
-    document.addEventListener("visibilitychange", sync2);
-    window.addEventListener("pageshow", sync2);
-    return () => {
-      document.removeEventListener("visibilitychange", sync2);
-      window.removeEventListener("pageshow", sync2);
-    };
-  }, []);
-  return {
-    playing: onScreen && !paused && !tabHidden && reducedState === false,
-    paused,
-    setPaused,
-    reducedMotion: reducedState === true
-  };
-}
-
 // src/hooks/platform/use-platform-config.ts
-import { useState as useState12, useEffect as useEffect12 } from "react";
+import { useState as useState10, useEffect as useEffect10 } from "react";
 
 // src/utils/platform-config.tsx
 import { Globe } from "lucide-react";
@@ -1083,10 +1011,10 @@ function toPlatformConfigs(payload) {
   return configs;
 }
 function usePlatformConfig() {
-  const [platforms, setPlatforms] = useState12(platformCache || []);
-  const [isLoading, setIsLoading] = useState12(!platformCache);
-  const [error, setError] = useState12(null);
-  useEffect12(() => {
+  const [platforms, setPlatforms] = useState10(platformCache || []);
+  const [isLoading, setIsLoading] = useState10(!platformCache);
+  const [error, setError] = useState10(null);
+  useEffect10(() => {
     const commit = (data) => {
       setPlatforms((prev) => prev === data ? prev : data);
       setIsLoading(false);
@@ -1154,7 +1082,7 @@ function useValidatePlatform(value) {
 import { toast as sonnerToast2 } from "sonner";
 
 // src/components/ui/toaster.tsx
-import { useState as useState13 } from "react";
+import { useState as useState11 } from "react";
 import { Toaster as SonnerToaster, toast as sonnerToast } from "sonner";
 import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
 var dotColorByVariant = {
@@ -1270,7 +1198,7 @@ function CommandApprovalToast({
   defaultExpanded = false,
   className
 }) {
-  const [expanded, setExpanded] = useState13(defaultExpanded);
+  const [expanded, setExpanded] = useState11(defaultExpanded);
   const handleApprove = () => {
     onApprove?.();
     sonnerToast.dismiss(id);
@@ -1470,15 +1398,15 @@ var useToast = () => ({
 });
 
 // src/hooks/use-contact-submission.ts
-import { useState as useState14, useCallback as useCallback9, useEffect as useEffect13 } from "react";
+import { useState as useState12, useCallback as useCallback8, useEffect as useEffect11 } from "react";
 function useContactSubmission(options = {}) {
   const { userId, successRedirectUrl, successToastMessage, onSuccess } = options;
   const { toast: toast2 } = useToast();
   const router = useRouter();
   const { contactUrl } = useRequiredEndpointsRuntime();
-  const [isSubmitting, setIsSubmitting] = useState14(false);
-  const [isSuccess, setIsSuccess] = useState14(false);
-  const submit = useCallback9(
+  const [isSubmitting, setIsSubmitting] = useState12(false);
+  const [isSuccess, setIsSuccess] = useState12(false);
+  const submit = useCallback8(
     async (formData) => {
       if (isSubmitting) return;
       setIsSubmitting(true);
@@ -1516,7 +1444,7 @@ function useContactSubmission(options = {}) {
     },
     [isSubmitting, toast2, userId, successToastMessage, contactUrl]
   );
-  useEffect13(() => {
+  useEffect11(() => {
     if (!isSuccess || !successRedirectUrl) return void 0;
     console.log("\u{1F680} Contact submission successful, redirecting to:", successRedirectUrl);
     const timer = setTimeout(() => {
@@ -1529,7 +1457,7 @@ function useContactSubmission(options = {}) {
     }, 1500);
     return () => clearTimeout(timer);
   }, [isSuccess, successRedirectUrl, router]);
-  useEffect13(() => {
+  useEffect11(() => {
     if (isSuccess && onSuccess) {
       onSuccess();
     }
@@ -1538,7 +1466,7 @@ function useContactSubmission(options = {}) {
 }
 
 // src/hooks/use-copy-to-clipboard.ts
-import { useCallback as useCallback10, useState as useState15 } from "react";
+import { useCallback as useCallback9, useState as useState13 } from "react";
 function useCopyToClipboard({
   successTitle = "Copied",
   successDescription = "Copied to clipboard",
@@ -1547,8 +1475,8 @@ function useCopyToClipboard({
   resetDelay = 2e3
 } = {}) {
   const { toast: toast2 } = useToast();
-  const [copied, setCopied] = useState15(false);
-  const copy = useCallback10(
+  const [copied, setCopied] = useState13(false);
+  const copy = useCallback9(
     async (text) => {
       try {
         await navigator.clipboard.writeText(text);
@@ -1565,7 +1493,7 @@ function useCopyToClipboard({
 }
 
 // src/hooks/use-batch-images.ts
-import { useEffect as useEffect14, useMemo as useMemo3, useState as useState16, useRef as useRef9 } from "react";
+import { useEffect as useEffect12, useMemo as useMemo3, useState as useState14, useRef as useRef8 } from "react";
 var globalBatchImageConfig = {};
 function configureBatchImageFetch(config) {
   globalBatchImageConfig = { ...globalBatchImageConfig, ...config };
@@ -1638,17 +1566,17 @@ async function batchFetchAuthenticatedImages(imageUrls, config) {
   return results;
 }
 function useBatchImages(imageUrls, config) {
-  const [fetchedImages, setFetchedImages] = useState16({});
+  const [fetchedImages, setFetchedImages] = useState14({});
   const uniqueUrls = useMemo3(
     () => Array.from(new Set(imageUrls.filter((url) => Boolean(url)))),
     [imageUrls]
   );
-  const requestedUrls = useRef9(/* @__PURE__ */ new Set());
-  const fetchedImagesRef = useRef9(fetchedImages);
-  useEffect14(() => {
+  const requestedUrls = useRef8(/* @__PURE__ */ new Set());
+  const fetchedImagesRef = useRef8(fetchedImages);
+  useEffect12(() => {
     fetchedImagesRef.current = fetchedImages;
   }, [fetchedImages]);
-  useEffect14(
+  useEffect12(
     () => () => {
       Object.values(fetchedImagesRef.current).forEach((blobUrl) => {
         if (blobUrl && blobUrl.startsWith("blob:")) {
@@ -1658,7 +1586,7 @@ function useBatchImages(imageUrls, config) {
     },
     []
   );
-  useEffect14(() => {
+  useEffect12(() => {
     const urlsToFetch = uniqueUrls.filter((url) => !requestedUrls.current.has(url));
     if (urlsToFetch.length === 0) {
       return;
@@ -1676,7 +1604,7 @@ function useBatchImages(imageUrls, config) {
 }
 
 // src/hooks/use-authenticated-image.ts
-import { useEffect as useEffect15, useState as useState17, useRef as useRef10 } from "react";
+import { useEffect as useEffect13, useState as useState15, useRef as useRef9 } from "react";
 var globalImageConfig = {};
 var imageCache = /* @__PURE__ */ new Map();
 var pendingRequests = /* @__PURE__ */ new Map();
@@ -1705,8 +1633,8 @@ function getImageConfig() {
   };
 }
 function useAuthenticatedImage(imageUrl, refreshKey, config) {
-  const [settled, setSettled] = useState17(null);
-  const currentCacheKeyRef = useRef10(null);
+  const [settled, setSettled] = useState15(null);
+  const currentCacheKeyRef = useRef9(null);
   const { tenantHostUrl, enableDevMode, accessTokenKey } = {
     ...getImageConfig(),
     ...config
@@ -1724,7 +1652,7 @@ function useAuthenticatedImage(imageUrl, refreshKey, config) {
     }
   }
   const cacheKey = fullImageUrl === null ? null : refreshKey ? `${fullImageUrl}?v=${refreshKey}` : fullImageUrl;
-  useEffect15(() => {
+  useEffect13(() => {
     if (cacheKey === null) {
       if (currentCacheKeyRef.current) {
         const entry = imageCache.get(currentCacheKeyRef.current);
@@ -1801,7 +1729,7 @@ function useAuthenticatedImage(imageUrl, refreshKey, config) {
     });
     pendingRequests.set(cacheKey, fetchPromise2);
   }, [cacheKey, fullImageUrl, refreshKey, enableDevMode, accessTokenKey]);
-  useEffect15(() => {
+  useEffect13(() => {
     return () => {
       if (currentCacheKeyRef.current) {
         const entry = imageCache.get(currentCacheKeyRef.current);
@@ -1822,7 +1750,7 @@ function useAuthenticatedImage(imageUrl, refreshKey, config) {
 }
 
 // src/hooks/state/use-query-params.ts
-import { useEffect as useEffect16, useState as useState18, useMemo as useMemo4, useCallback as useCallback11, useRef as useRef11 } from "react";
+import { useEffect as useEffect14, useState as useState16, useMemo as useMemo4, useCallback as useCallback10, useRef as useRef10 } from "react";
 
 // src/hooks/state/flatten-schema.ts
 function flattenQueryVariables(queryVariables, introspector2) {
@@ -2273,26 +2201,26 @@ function validateVariables(variables, schema) {
 function useQueryParams(query, options = {}) {
   const router = useRouter();
   const searchParams = useSearchParams();
-  const [isLoading, setIsLoading] = useState18(true);
-  const [isReady, setIsReady] = useState18(false);
-  const [error, setError] = useState18(null);
-  const [schema, setSchema] = useState18({});
+  const [isLoading, setIsLoading] = useState16(true);
+  const [isReady, setIsReady] = useState16(false);
+  const [error, setError] = useState16(null);
+  const [schema, setSchema] = useState16({});
   const defaultValues = useMemo4(() => options.defaultValues || {}, [options.defaultValues]);
   const skipIntrospection = options.skipIntrospection || false;
   const debug = options.debug || false;
-  const initSourceRef = useRef11({
+  const initSourceRef = useRef10({
     introspectionHeaders: options.introspectionHeaders,
     paramMapping: options.paramMapping,
     defaultValues
   });
-  useEffect16(() => {
+  useEffect14(() => {
     initSourceRef.current = {
       introspectionHeaders: options.introspectionHeaders,
       paramMapping: options.paramMapping,
       defaultValues
     };
   });
-  useEffect16(() => {
+  useEffect14(() => {
     let cancelled = false;
     async function initialize() {
       try {
@@ -2369,7 +2297,7 @@ function useQueryParams(query, options = {}) {
     });
     return result;
   }, [searchParams]);
-  const updateUrl = useCallback11(
+  const updateUrl = useCallback10(
     (newParams) => {
       const url = newParams.toString() ? `?${newParams.toString()}` : window.location.pathname;
       if (debug) {
@@ -2379,7 +2307,7 @@ function useQueryParams(query, options = {}) {
     },
     [router, debug]
   );
-  const setParam = useCallback11(
+  const setParam = useCallback10(
     (key, value) => {
       if (!isReady) {
         console.warn("[useQueryParams] Schema not ready, cannot set param");
@@ -2395,7 +2323,7 @@ function useQueryParams(query, options = {}) {
     },
     [variables, schema, isReady, updateUrl]
   );
-  const setParams = useCallback11(
+  const setParams = useCallback10(
     (updates) => {
       if (!isReady) {
         console.warn("[useQueryParams] Schema not ready, cannot set params");
@@ -2411,7 +2339,7 @@ function useQueryParams(query, options = {}) {
     },
     [variables, schema, isReady, updateUrl]
   );
-  const clearParamsHandler = useCallback11(
+  const clearParamsHandler = useCallback10(
     (keys) => {
       if (!isReady) {
         console.warn("[useQueryParams] Schema not ready, cannot clear params");
@@ -2427,7 +2355,7 @@ function useQueryParams(query, options = {}) {
     },
     [variables, schema, isReady, updateUrl]
   );
-  const resetParams = useCallback11(() => {
+  const resetParams = useCallback10(() => {
     if (debug) {
       console.log("[useQueryParams] Resetting params");
     }
@@ -2462,9 +2390,9 @@ function applyParamMapping(schema, mapping) {
 }
 
 // src/hooks/state/use-api-params.ts
-import { useCallback as useCallback12, useEffect as useEffect17, useMemo as useMemo5, useRef as useRef12, useState as useState19 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect15, useMemo as useMemo5, useRef as useRef11, useState as useState17 } from "react";
 function useContentStable(value, key) {
-  const [cached, setCached] = useState19({ value, key });
+  const [cached, setCached] = useState17({ value, key });
   if (cached.key !== key) setCached({ value, key });
   return cached.key === key ? cached.value : value;
 }
@@ -2491,9 +2419,9 @@ function useApiParams(schema, options = {}) {
   const searchParamsLive = useSearchParams();
   const debug = options.debug || false;
   const searchString = searchParamsLive.toString();
-  const pendingRef = useRef12([]);
-  const [pendingTail, setPendingTail] = useState19(void 0);
-  const syncPendingTail = useCallback12(() => {
+  const pendingRef = useRef11([]);
+  const [pendingTail, setPendingTail] = useState17(void 0);
+  const syncPendingTail = useCallback11(() => {
     setPendingTail(pendingRef.current[pendingRef.current.length - 1]);
   }, []);
   const schemaKey = useMemo5(() => JSON.stringify(schema), [schema]);
@@ -2521,14 +2449,14 @@ function useApiParams(schema, options = {}) {
     }
     return result;
   }, [searchString, debug, stableSchema, options.absent]);
-  const [paramsCache, setParamsCache] = useState19(() => ({ src: rawParams, value: rawParams }));
+  const [paramsCache, setParamsCache] = useState17(() => ({ src: rawParams, value: rawParams }));
   let stableParams = paramsCache.value;
   if (paramsCache.src !== rawParams) {
     stableParams = reuseArrayRefs(paramsCache.value, rawParams);
     setParamsCache({ src: rawParams, value: stableParams });
   }
   const params = stableParams;
-  const addParamToSearchParams = useCallback12((searchParams, key, value) => {
+  const addParamToSearchParams = useCallback11((searchParams, key, value) => {
     for (const [k, v] of createSearchParams({ [key]: value })) searchParams.append(k, v);
   }, []);
   const urlSearchParams = useMemo5(() => {
@@ -2543,7 +2471,7 @@ function useApiParams(schema, options = {}) {
     }
     return newParams;
   }, [params, flattenedSchema, addParamToSearchParams, stableSchema]);
-  const updateUrl = useCallback12(
+  const updateUrl = useCallback11(
     (newParams, keysToRemove = []) => {
       const base = pendingRef.current[pendingRef.current.length - 1] ?? searchString;
       const finalParams = new URLSearchParams(base);
@@ -2578,14 +2506,14 @@ function useApiParams(schema, options = {}) {
     },
     [router, debug, searchString, stableSchema, syncPendingTail]
   );
-  useEffect17(() => {
+  useEffect15(() => {
     const queue = pendingRef.current;
     if (queue.length === 0) return;
     const hit = queue.indexOf(searchString);
     pendingRef.current = hit === -1 ? [] : queue.slice(hit + 1);
     syncPendingTail();
   }, [searchString, syncPendingTail]);
-  const setParam = useCallback12(
+  const setParam = useCallback11(
     (key, value) => {
       const config = stableSchema[key];
       if (!config) {
@@ -2602,7 +2530,7 @@ function useApiParams(schema, options = {}) {
     },
     [updateUrl, addParamToSearchParams, stableSchema]
   );
-  const setParams = useCallback12(
+  const setParams = useCallback11(
     (updates) => {
       const newParams = new URLSearchParams();
       const keysToRemove = [];
@@ -2622,14 +2550,14 @@ function useApiParams(schema, options = {}) {
     },
     [updateUrl, addParamToSearchParams, stableSchema, flattenedSchema]
   );
-  const clearParams2 = useCallback12(
+  const clearParams2 = useCallback11(
     (keys) => {
       const newParams = new URLSearchParams();
       updateUrl(newParams, keys);
     },
     [updateUrl]
   );
-  const resetParams = useCallback12(() => {
+  const resetParams = useCallback11(() => {
     if (debug) {
       console.log("[useApiParams] Resetting params");
     }
@@ -2653,7 +2581,7 @@ function useApiParams(schema, options = {}) {
 }
 
 // src/hooks/state/use-cursor-pagination-state.ts
-import { useCallback as useCallback13, useEffect as useEffect18, useRef as useRef13, useState as useState20 } from "react";
+import { useCallback as useCallback12, useEffect as useEffect16, useRef as useRef12, useState as useState18 } from "react";
 var urlSchema = {
   search: { type: "string", default: "" },
   cursor: { type: "string", default: "" }
@@ -2661,21 +2589,21 @@ var urlSchema = {
 function useCursorPaginationState(options) {
   const { onInitialLoad, onSearchChange } = options;
   const { params, setParam, setParams } = useApiParams(urlSchema);
-  const [searchInput, setSearchInput] = useState20(params.search || "");
-  const [hasLoadedBeyondFirst, setHasLoadedBeyondFirst] = useState20(false);
-  const [initialLoadCount, setInitialLoadCount] = useState20(0);
-  const lastSearchRef = useRef13(null);
-  const isSyncingFromUrl = useRef13(false);
-  const isInitialLoadInProgress = useRef13(true);
-  const searchInputRef = useRef13(searchInput);
-  const onInitialLoadRef = useRef13(onInitialLoad);
-  const paramsRef = useRef13(params);
-  useEffect18(() => {
+  const [searchInput, setSearchInput] = useState18(params.search || "");
+  const [hasLoadedBeyondFirst, setHasLoadedBeyondFirst] = useState18(false);
+  const [initialLoadCount, setInitialLoadCount] = useState18(0);
+  const lastSearchRef = useRef12(null);
+  const isSyncingFromUrl = useRef12(false);
+  const isInitialLoadInProgress = useRef12(true);
+  const searchInputRef = useRef12(searchInput);
+  const onInitialLoadRef = useRef12(onInitialLoad);
+  const paramsRef = useRef12(params);
+  useEffect16(() => {
     searchInputRef.current = searchInput;
     onInitialLoadRef.current = onInitialLoad;
     paramsRef.current = params;
   });
-  useEffect18(() => {
+  useEffect16(() => {
     if (isInitialLoadInProgress.current) return;
     const urlSearch = params.search || "";
     if (urlSearch !== searchInputRef.current) {
@@ -2686,7 +2614,7 @@ function useCursorPaginationState(options) {
       }, 0);
     }
   }, [params.search, initialLoadCount]);
-  useEffect18(() => {
+  useEffect16(() => {
     if (isInitialLoadInProgress.current) return;
     if (isSyncingFromUrl.current) return;
     if (searchInput !== params.search) {
@@ -2697,7 +2625,7 @@ function useCursorPaginationState(options) {
       });
     }
   }, [searchInput, params.search, setParams, initialLoadCount]);
-  useEffect18(() => {
+  useEffect16(() => {
     if (initialLoadCount === 0) {
       const cursor = paramsRef.current.cursor || null;
       const search = paramsRef.current.search || "";
@@ -2713,7 +2641,7 @@ function useCursorPaginationState(options) {
       });
     }
   }, [initialLoadCount]);
-  useEffect18(() => {
+  useEffect16(() => {
     if (isInitialLoadInProgress.current) return;
     if (initialLoadCount === 0) return;
     const currentSearch = params.search || "";
@@ -2725,7 +2653,7 @@ function useCursorPaginationState(options) {
       });
     }
   }, [params.search, onSearchChange, initialLoadCount]);
-  const handleNextPage = useCallback13(
+  const handleNextPage = useCallback12(
     async (endCursor, fetchFn) => {
       setParam("cursor", endCursor);
       await fetchFn();
@@ -2733,7 +2661,7 @@ function useCursorPaginationState(options) {
     },
     [setParam]
   );
-  const handleResetToFirstPage = useCallback13(
+  const handleResetToFirstPage = useCallback12(
     async (fetchFn) => {
       setParam("cursor", "");
       await fetchFn();
@@ -2755,22 +2683,22 @@ function useCursorPaginationState(options) {
 }
 
 // src/hooks/nats/use-nats-client.ts
-import { useEffect as useEffect19, useMemo as useMemo6, useState as useState21 } from "react";
+import { useEffect as useEffect17, useMemo as useMemo6, useState as useState19 } from "react";
 function useNatsClient(clientOptions, options = {}) {
   const { autoConnect = true } = options;
   const client = useMemo6(() => {
     if (!clientOptions) return null;
     return createNatsClient(clientOptions);
   }, [clientOptions]);
-  const [status, setStatus] = useState21("disconnected");
-  const [lastError, setLastError] = useState21(null);
-  const [statusClient, setStatusClient] = useState21(client);
+  const [status, setStatus] = useState19("disconnected");
+  const [lastError, setLastError] = useState19(null);
+  const [statusClient, setStatusClient] = useState19(client);
   if (statusClient !== client) {
     setStatusClient(client);
     setStatus("disconnected");
     setLastError(null);
   }
-  useEffect19(() => {
+  useEffect17(() => {
     if (!client) return void 0;
     const off = client.onStatus((event) => {
       setStatus(event.status);
@@ -2797,7 +2725,8 @@ function useNatsClient(clientOptions, options = {}) {
 }
 
 // src/hooks/use-scenario-player.ts
-import { useCallback as useCallback14, useEffect as useEffect20, useState as useState22 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect18, useRef as useRef13, useState as useState20 } from "react";
+var START_MS = 300;
 function useScenarioPlayer({
   scenarioCount,
   lastStep: lastStepOption,
@@ -2809,14 +2738,20 @@ function useScenarioPlayer({
 }) {
   const auto = useAutoplay(enabled);
   const { reducedMotion, paused, setPaused } = auto;
-  const [scenario, setScenario] = useState22(initialScenario);
-  const [rawStep, setRawStep] = useState22(startAtEnd ? Number.MAX_SAFE_INTEGER : 0);
+  const [scenario, setScenario] = useState20(initialScenario);
+  const [rawStep, setRawStep] = useState20(startAtEnd ? Number.MAX_SAFE_INTEGER : 0);
   const lastStep = typeof lastStepOption === "function" ? lastStepOption(scenario) : lastStepOption;
   const step = reducedMotion ? lastStep : Math.min(rawStep, lastStep);
   const playing = auto.playing && scenarioCount > 0;
-  useEffect20(() => {
+  const starting = useRef13(false);
+  const wasPlaying = useRef13(false);
+  useEffect18(() => {
+    if (playing && !wasPlaying.current) starting.current = true;
+    wasPlaying.current = playing;
     if (!playing) return void 0;
     const atEnd = rawStep >= lastStep;
+    const quickStart = starting.current && !atEnd;
+    starting.current = false;
     const timer = setTimeout(
       () => {
         if (atEnd) {
@@ -2826,18 +2761,18 @@ function useScenarioPlayer({
           setRawStep((current) => Math.min(current, lastStep) + 1);
         }
       },
-      atEnd ? holdMs : stepMs
+      atEnd ? holdMs : quickStart ? Math.min(START_MS, stepMs) : stepMs
     );
     return () => clearTimeout(timer);
   }, [playing, rawStep, lastStep, stepMs, holdMs, scenario, scenarioCount]);
-  const setStep = useCallback14(
+  const setStep = useCallback13(
     (next) => {
       setRawStep(Math.max(0, Math.min(lastStep, next)));
       setPaused(false);
     },
     [lastStep, setPaused]
   );
-  const go = useCallback14(
+  const go = useCallback13(
     (next) => {
       setScenario(next);
       setRawStep(0);
@@ -2951,7 +2886,7 @@ function useAccessCodeIntegration() {
 }
 
 // src/hooks/use-claude-mirror-src.ts
-import { useEffect as useEffect21, useState as useState23 } from "react";
+import { useEffect as useEffect19, useState as useState21 } from "react";
 
 // src/utils/embed-url-converters.ts
 function toGoogleSheetsEmbedUrl(url) {
@@ -3041,9 +2976,9 @@ async function revalidateMirror(mirrorPath) {
 function useClaudeMirrorSrc(url) {
   const endpoints = useEndpointsRuntime();
   const mirrorPath = toClaudeMirrorPath(url, endpoints?.storageViewBaseUrl);
-  const [resolved, setResolved] = useState23(null);
+  const [resolved, setResolved] = useState21(null);
   const state = resolved && resolved.key === mirrorPath ? resolved.value : { src: null, status: mirrorPath ? "probing" : "absent" };
-  useEffect21(() => {
+  useEffect19(() => {
     if (!mirrorPath) return void 0;
     let cancelled = false;
     const settle = (value) => {
@@ -3070,11 +3005,11 @@ function useClaudeMirrorSrc(url) {
 }
 
 // src/hooks/use-scroll-to-hash.ts
-import { useEffect as useEffect22 } from "react";
+import { useEffect as useEffect20 } from "react";
 var MAX_POLL_FRAMES = 60;
 function useScrollToHash(readyDep = true, options) {
   const headerOffset = options?.headerOffset ?? 0;
-  useEffect22(() => {
+  useEffect20(() => {
     if (typeof window === "undefined") return void 0;
     if (readyDep === null || readyDep === false) return void 0;
     let rafId = null;
@@ -3114,7 +3049,7 @@ function useScrollToHash(readyDep = true, options) {
 }
 
 // src/hooks/use-humanity-signals.ts
-import { useCallback as useCallback15, useRef as useRef14, useState as useState24 } from "react";
+import { useCallback as useCallback14, useRef as useRef14, useState as useState22 } from "react";
 
 // src/utils/humanity-signals.ts
 var HONEYPOT_FIELD = "form_extra_note";
@@ -3177,16 +3112,16 @@ var splitCsvEnv = (s) => s?.split(",").map((t) => t.trim()).filter(Boolean) ?? [
 // src/hooks/use-humanity-signals.ts
 function useHumanitySignals() {
   const ref = useRef14(null);
-  const [mountedAt] = useState24(() => typeof performance !== "undefined" ? performance.now() : 0);
+  const [mountedAt] = useState22(() => typeof performance !== "undefined" ? performance.now() : 0);
   const startedAtRef = useRef14(mountedAt);
-  const getSignals = useCallback15(
+  const getSignals = useCallback14(
     () => ({
       [HONEYPOT_FIELD]: ref.current?.value ?? "",
       [ELAPSED_MS_FIELD]: typeof performance !== "undefined" ? Math.round(performance.now() - startedAtRef.current) : 0
     }),
     []
   );
-  const resetSignals = useCallback15(() => {
+  const resetSignals = useCallback14(() => {
     if (ref.current) ref.current.value = "";
     if (typeof performance !== "undefined") startedAtRef.current = performance.now();
   }, []);
@@ -3194,7 +3129,7 @@ function useHumanitySignals() {
 }
 
 // src/hooks/use-form-rescue.ts
-import { useCallback as useCallback16, useEffect as useEffect23, useMemo as useMemo7, useRef as useRef15 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect21, useMemo as useMemo7, useRef as useRef15 } from "react";
 
 // src/utils/form-rescue.ts
 var FORM_ID_PATTERN = /^[a-z][a-z0-9_]{1,47}$/;
@@ -3419,16 +3354,16 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
   const fieldNamesRef = useRef15(fieldNames);
   const onRestoreRef = useRef15(onRestore);
   const getSignalsRef = useRef15(getSignals);
-  useEffect23(() => {
+  useEffect21(() => {
     fieldNamesRef.current = fieldNames;
     onRestoreRef.current = onRestore;
     getSignalsRef.current = getSignals;
   });
-  const attemptId = useCallback16(() => {
+  const attemptId = useCallback15(() => {
     if (!attemptIdRef.current) attemptIdRef.current = newAttemptId();
     return attemptIdRef.current;
   }, []);
-  const send = useCallback16(
+  const send = useCallback15(
     (keepalive) => {
       if (!formId || !draftsUrl || !dirtyRef.current || completedRef.current || !latestRef.current) return;
       dirtyRef.current = false;
@@ -3459,7 +3394,7 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
     },
     [attemptId, draftsUrl, formId]
   );
-  useEffect23(() => {
+  useEffect21(() => {
     if (!formId || typeof window === "undefined") return void 0;
     let cancelled = false;
     const token = new URLSearchParams(window.location.search).get(FORM_RESCUE_RESUME_PARAM);
@@ -3489,7 +3424,7 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
       cancelled = true;
     };
   }, [attemptId, draftsUrl, formId]);
-  useEffect23(() => {
+  useEffect21(() => {
     if (!formId || typeof document === "undefined") return void 0;
     const onHide = () => {
       if (completedRef.current || !startedRef.current) return;
@@ -3516,7 +3451,7 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
       if (timerRef.current) clearTimeout(timerRef.current);
     };
   }, [attemptId, formId, send]);
-  const track = useCallback16(
+  const track = useCallback15(
     (values, lastField) => {
       if (!formId || completedRef.current) return;
       const names = fieldNamesRef.current;
@@ -3549,14 +3484,14 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
     },
     [attemptId, formId, send]
   );
-  const submitFields = useCallback16(() => {
+  const submitFields = useCallback15(() => {
     if (!formId) return {};
     return {
       [FORM_RESCUE_ATTEMPT_FIELD]: attemptId(),
       ...resumeTokenRef.current ? { [FORM_RESCUE_RESUME_FIELD]: resumeTokenRef.current } : {}
     };
   }, [attemptId, formId]);
-  const complete = useCallback16(() => {
+  const complete = useCallback15(() => {
     if (!formId) return;
     if (timerRef.current) {
       clearTimeout(timerRef.current);
@@ -3574,7 +3509,7 @@ function useFormRescue({ form, fieldNames, onRestore, getSignals }) {
 }
 
 // src/hooks/use-rescued-form.ts
-import { useEffect as useEffect24 } from "react";
+import { useEffect as useEffect22 } from "react";
 function flattenOneLevel(values) {
   const flat = {};
   for (const [key, value] of Object.entries(values)) {
@@ -3598,7 +3533,7 @@ function useRescuedForm(form, { rescue, fields, getSignals, fieldPath }) {
       }
     }
   });
-  useEffect24(() => {
+  useEffect22(() => {
     const subscription = watch((values, { name }) => {
       handle.track(flattenOneLevel(values), name ? name.split(".").pop() ?? null : null);
     });
@@ -3623,11 +3558,6 @@ export {
   useTablePagination,
   useThrottle,
   useWindowSize,
-  PREFERS_REDUCED_MOTION_QUERY,
-  usePrefersReducedMotion,
-  usePrefersReducedMotionState,
-  useInView,
-  useAutoplay,
   usePreventScroll,
   platformIcons,
   transformPlatformConfigsToOptions,
@@ -3728,4 +3658,4 @@ export {
   useFormRescue,
   useRescuedForm
 };
-//# sourceMappingURL=chunk-UVRLSOEJ.js.map
+//# sourceMappingURL=chunk-TN2RFU6D.js.map