@flamingo-stack/openframe-frontend-core 0.0.775 → 0.0.777

package/dist/components/features/use-file-playback.js

@@ -31,6 +31,7 @@ function useMediaEvent(mediaRef, type, handler) {
     return () => onLiveElement(() => element.removeEventListener?.(type, listener));
   }, [mediaRef, type, handlerRef]);
 }
+const INTERRUPTED_PLAY_RETRIES = 2;
 async function play(element) {
   try {
     await element.play?.();
@@ -47,12 +48,16 @@ function usePlaybackSound(mediaRef, { autoPlay, autoPlayUnmuted, startMuted, onM
     const started = play(element);
     setBlocked(false);
     setMutedFallback(true);
-    if (await started !== "playing" && wanted()) setBlocked(true);
+    const outcome = await started;
+    if (outcome !== "playing" && wanted()) setBlocked(true);
+    return outcome;
   }, []);
   const playWithSound = useCallback(
     async (element, muted, wanted = always) => {
       onLiveElement(() => Object.assign(element, { muted }));
-      if (await play(element) === "refused" && wanted()) await playMuted(element, wanted);
+      const outcome = await play(element);
+      if (outcome === "refused" && wanted()) return playMuted(element, wanted);
+      return outcome;
     },
     [playMuted]
   );
@@ -174,11 +179,15 @@ function useHoverPlayback(mediaRef, sound, { playOnHover, playWhenHovered, muted
     onLiveElement(() => {
       element.volume = SOUND_VOLUME;
     });
-    if (hasUserInteracted()) {
-      void playWithSound(element, hostMutedRef.current, wanted);
-      return;
-    }
-    void playMuted(element, wanted);
+    const attempt = (retriesLeft) => {
+      const played = hasUserInteracted() ? playWithSound(element, hostMutedRef.current, wanted) : playMuted(element, wanted);
+      void played.then((outcome) => {
+        if (outcome === "interrupted" && hovered && element.paused !== false && retriesLeft > 0)
+          attempt(retriesLeft - 1);
+      });
+    };
+    attempt(INTERRUPTED_PLAY_RETRIES);
+    if (hasUserInteracted()) return;
     const onFirstGesture = () => {
       if (!hovered) return;
       onLiveElement(() => {