@remotion/promo-pages 4.0.394 → 4.0.396

package/dist/Homepage.js

@@ -755,7 +755,7 @@ var __defProp2, __export2 = (target, all) => {
   });
 }, useIsPlayer = () => {
   return useContext(IsPlayerContext);
-}, VERSION = "4.0.394", checkMultipleRemotionVersions = () => {
+}, VERSION = "4.0.396", checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
   }
@@ -2929,11 +2929,15 @@ Check that all your Remotion packages are on the same version. If your dependenc
   });
 }, getCrossOriginValue = ({
   crossOrigin,
-  requestsVideoFrame
+  requestsVideoFrame,
+  isClientSideRendering
 }) => {
   if (crossOrigin !== undefined && crossOrigin !== null) {
     return crossOrigin;
   }
+  if (isClientSideRendering) {
+    return "anonymous";
+  }
   if (requestsVideoFrame) {
     return "anonymous";
   }
@@ -3638,8 +3642,17 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const [blocks, setBlocks] = useState13([]);
   const [onBufferingCallbacks, setOnBufferingCallbacks] = useState13([]);
   const [onResumeCallbacks, setOnResumeCallbacks] = useState13([]);
+  const env = useRemotionEnvironment();
+  const rendering = env.isRendering;
   const buffering = useRef9(false);
   const addBlock = useCallback8((block) => {
+    if (rendering) {
+      return {
+        unblock: () => {
+          return;
+        }
+      };
+    }
     setBlocks((b) => [...b, block]);
     return {
       unblock: () => {
@@ -3652,7 +3665,7 @@ Check that all your Remotion packages are on the same version. If your dependenc
         });
       }
     };
-  }, []);
+  }, [rendering]);
   const listenForBuffering = useCallback8((callback) => {
     setOnBufferingCallbacks((c) => [...c, callback]);
     return {
@@ -3670,6 +3683,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
     };
   }, []);
   useEffect7(() => {
+    if (rendering) {
+      return;
+    }
     if (blocks.length > 0) {
       onBufferingCallbacks.forEach((c) => c());
       playbackLogging({
@@ -3682,6 +3698,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [blocks]);
   if (typeof window !== "undefined") {
     useLayoutEffect6(() => {
+      if (rendering) {
+        return;
+      }
       if (blocks.length === 0) {
         onResumeCallbacks.forEach((c) => c());
         playbackLogging({
@@ -4465,7 +4484,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   warnAboutTooHighVolume(userPreferredVolume);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering: false
   });
   const propsToPass = useMemo21(() => {
     return {
@@ -5202,9 +5222,11 @@ Check that all your Remotion packages are on the same version. If your dependenc
       delayRender2
     ]);
   }
+  const { isClientSideRendering } = useRemotionEnvironment();
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering
   });
   return /* @__PURE__ */ jsx25("img", {
     ...props2,
@@ -5929,7 +5951,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [isSequenceHidden, style]);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: Boolean(onVideoFrame)
+    requestsVideoFrame: Boolean(onVideoFrame),
+    isClientSideRendering: false
   });
   return /* @__PURE__ */ jsx30("video", {
     ref: videoRef,
@@ -20323,7 +20346,7 @@ var GitHubStars = () => {
             width: "45px"
           }),
           /* @__PURE__ */ jsx47(StatItemContent, {
-            content: "24k",
+            content: "25k",
             width: "80px",
             fontSize: "2.5rem",
             fontWeight: "bold"
@@ -21877,6 +21900,15 @@ var usePlayer = () => {
       play(e);
     }
   }, [imperativePlaying, pause, play]);
+  const isPlaying = useCallback28(() => {
+    return imperativePlaying.current;
+  }, [imperativePlaying]);
+  const getCurrentFrame = useCallback28(() => {
+    return frameRef.current;
+  }, [frameRef]);
+  const isBuffering = useCallback28(() => {
+    return buffering.current;
+  }, [buffering]);
   const returnValue = useMemo42(() => {
     return {
       frameBack,
@@ -21888,28 +21920,29 @@ var usePlayer = () => {
       pause,
       seek: seek2,
       isFirstFrame,
-      getCurrentFrame: () => frameRef.current,
-      isPlaying: () => imperativePlaying.current,
-      isBuffering: () => buffering.current,
+      getCurrentFrame,
+      isPlaying,
+      isBuffering,
       pauseAndReturnToPlayStart,
       hasPlayed,
       toggle
     };
   }, [
-    buffering,
     emitter,
     frameBack,
     frameForward,
     hasPlayed,
-    imperativePlaying,
     isFirstFrame,
     isLastFrame,
+    getCurrentFrame,
     pause,
     pauseAndReturnToPlayStart,
     play,
     playing,
     seek2,
-    toggle
+    toggle,
+    isPlaying,
+    isBuffering
   ]);
   return returnValue;
 };
@@ -22078,7 +22111,7 @@ var usePlayback = ({
 }) => {
   const config = Internals.useUnsafeVideoConfig();
   const frame = Internals.Timeline.useTimelinePosition();
-  const { playing, pause, emitter } = usePlayer();
+  const { playing, pause, emitter, isPlaying } = usePlayer();
   const setFrame = Internals.Timeline.useTimelineSetFrame();
   const isBackgroundedRef = useIsBackgrounded();
   const lastTimeUpdateEvent = useRef42(null);
@@ -22119,6 +22152,9 @@ var usePlayback = ({
       if (hasBeenStopped) {
         return;
       }
+      if (!isPlaying()) {
+        return;
+      }
       const time = performance.now() - startedTime;
       const actualLastFrame = outFrame ?? config.durationInFrames - 1;
       const actualFirstFrame = inFrame ?? 0;
@@ -22190,7 +22226,8 @@ var usePlayback = ({
     moveToBeginningWhenEnded,
     isBackgroundedRef,
     getCurrentFrame,
-    context
+    context,
+    isPlaying
   ]);
   useEffect52(() => {
     const interval = setInterval(() => {
@@ -26413,7 +26450,7 @@ var Cards = ({
 // src/components/homepage/Demo/Comp.tsx
 import { jsx as jsx75, jsxs as jsxs27 } from "react/jsx-runtime";
 var getDataAndProps = async () => {
-  const location = await fetch("https://bugs-git-homepage-player-remotion.vercel.app/api/location").then((res) => res.json());
+  const location = await fetch("https://bugs-five.vercel.app/api/location").then((res) => res.json());
   const trending = await fetch(`https://bugs.remotion.dev/trending?lat=${location.latitude}&lng=${location.longitude}&country=${location.country}`).then((res) => res.json()).then((data) => {
     return {
       repos: data.trending.repos.slice(0, 3),
@@ -28992,7 +29029,7 @@ var FEATURED_TEMPLATES = [
     contributedBy: null
   },
   {
-    homePageLabel: "Prompt to Motion graphics",
+    homePageLabel: "Prompt to Motion Graphics",
     shortName: "Prompt to Motion Graphics (Next.js)",
     org: "remotion-dev",
     repoName: "template-prompt-to-motion-graphics",
@@ -30063,7 +30100,7 @@ var GithubButton = () => {
       " ",
       /* @__PURE__ */ jsx151("div", {
         className: "text-xs inline-block ml-2 leading-none mt-[3px] self-center",
-        children: "24k"
+        children: "25k"
       })
     ]
   });

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/Homepage.js

@@ -755,7 +755,7 @@ var __defProp2, __export2 = (target, all) => {
   });
 }, useIsPlayer = () => {
   return useContext(IsPlayerContext);
-}, VERSION = "4.0.394", checkMultipleRemotionVersions = () => {
+}, VERSION = "4.0.396", checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
   }
@@ -2929,11 +2929,15 @@ Check that all your Remotion packages are on the same version. If your dependenc
   });
 }, getCrossOriginValue = ({
   crossOrigin,
-  requestsVideoFrame
+  requestsVideoFrame,
+  isClientSideRendering
 }) => {
   if (crossOrigin !== undefined && crossOrigin !== null) {
     return crossOrigin;
   }
+  if (isClientSideRendering) {
+    return "anonymous";
+  }
   if (requestsVideoFrame) {
     return "anonymous";
   }
@@ -3638,8 +3642,17 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const [blocks, setBlocks] = useState13([]);
   const [onBufferingCallbacks, setOnBufferingCallbacks] = useState13([]);
   const [onResumeCallbacks, setOnResumeCallbacks] = useState13([]);
+  const env = useRemotionEnvironment();
+  const rendering = env.isRendering;
   const buffering = useRef9(false);
   const addBlock = useCallback8((block) => {
+    if (rendering) {
+      return {
+        unblock: () => {
+          return;
+        }
+      };
+    }
     setBlocks((b) => [...b, block]);
     return {
       unblock: () => {
@@ -3652,7 +3665,7 @@ Check that all your Remotion packages are on the same version. If your dependenc
         });
       }
     };
-  }, []);
+  }, [rendering]);
   const listenForBuffering = useCallback8((callback) => {
     setOnBufferingCallbacks((c) => [...c, callback]);
     return {
@@ -3670,6 +3683,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
     };
   }, []);
   useEffect7(() => {
+    if (rendering) {
+      return;
+    }
     if (blocks.length > 0) {
       onBufferingCallbacks.forEach((c) => c());
       playbackLogging({
@@ -3682,6 +3698,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [blocks]);
   if (typeof window !== "undefined") {
     useLayoutEffect6(() => {
+      if (rendering) {
+        return;
+      }
       if (blocks.length === 0) {
         onResumeCallbacks.forEach((c) => c());
         playbackLogging({
@@ -4465,7 +4484,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   warnAboutTooHighVolume(userPreferredVolume);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering: false
   });
   const propsToPass = useMemo21(() => {
     return {
@@ -5202,9 +5222,11 @@ Check that all your Remotion packages are on the same version. If your dependenc
       delayRender2
     ]);
   }
+  const { isClientSideRendering } = useRemotionEnvironment();
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering
   });
   return /* @__PURE__ */ jsx25("img", {
     ...props2,
@@ -5929,7 +5951,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [isSequenceHidden, style]);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: Boolean(onVideoFrame)
+    requestsVideoFrame: Boolean(onVideoFrame),
+    isClientSideRendering: false
   });
   return /* @__PURE__ */ jsx30("video", {
     ref: videoRef,
@@ -20323,7 +20346,7 @@ var GitHubStars = () => {
             width: "45px"
           }),
           /* @__PURE__ */ jsx47(StatItemContent, {
-            content: "24k",
+            content: "25k",
             width: "80px",
             fontSize: "2.5rem",
             fontWeight: "bold"
@@ -21877,6 +21900,15 @@ var usePlayer = () => {
       play(e);
     }
   }, [imperativePlaying, pause, play]);
+  const isPlaying = useCallback28(() => {
+    return imperativePlaying.current;
+  }, [imperativePlaying]);
+  const getCurrentFrame = useCallback28(() => {
+    return frameRef.current;
+  }, [frameRef]);
+  const isBuffering = useCallback28(() => {
+    return buffering.current;
+  }, [buffering]);
   const returnValue = useMemo42(() => {
     return {
       frameBack,
@@ -21888,28 +21920,29 @@ var usePlayer = () => {
       pause,
       seek: seek2,
       isFirstFrame,
-      getCurrentFrame: () => frameRef.current,
-      isPlaying: () => imperativePlaying.current,
-      isBuffering: () => buffering.current,
+      getCurrentFrame,
+      isPlaying,
+      isBuffering,
       pauseAndReturnToPlayStart,
       hasPlayed,
       toggle
     };
   }, [
-    buffering,
     emitter,
     frameBack,
     frameForward,
     hasPlayed,
-    imperativePlaying,
     isFirstFrame,
     isLastFrame,
+    getCurrentFrame,
     pause,
     pauseAndReturnToPlayStart,
     play,
     playing,
     seek2,
-    toggle
+    toggle,
+    isPlaying,
+    isBuffering
   ]);
   return returnValue;
 };
@@ -22078,7 +22111,7 @@ var usePlayback = ({
 }) => {
   const config = Internals.useUnsafeVideoConfig();
   const frame = Internals.Timeline.useTimelinePosition();
-  const { playing, pause, emitter } = usePlayer();
+  const { playing, pause, emitter, isPlaying } = usePlayer();
   const setFrame = Internals.Timeline.useTimelineSetFrame();
   const isBackgroundedRef = useIsBackgrounded();
   const lastTimeUpdateEvent = useRef42(null);
@@ -22119,6 +22152,9 @@ var usePlayback = ({
       if (hasBeenStopped) {
         return;
       }
+      if (!isPlaying()) {
+        return;
+      }
       const time = performance.now() - startedTime;
       const actualLastFrame = outFrame ?? config.durationInFrames - 1;
       const actualFirstFrame = inFrame ?? 0;
@@ -22190,7 +22226,8 @@ var usePlayback = ({
     moveToBeginningWhenEnded,
     isBackgroundedRef,
     getCurrentFrame,
-    context
+    context,
+    isPlaying
   ]);
   useEffect52(() => {
     const interval = setInterval(() => {
@@ -26413,7 +26450,7 @@ var Cards = ({
 // src/components/homepage/Demo/Comp.tsx
 import { jsx as jsx75, jsxs as jsxs27 } from "react/jsx-runtime";
 var getDataAndProps = async () => {
-  const location = await fetch("https://bugs-git-homepage-player-remotion.vercel.app/api/location").then((res) => res.json());
+  const location = await fetch("https://bugs-five.vercel.app/api/location").then((res) => res.json());
   const trending = await fetch(`https://bugs.remotion.dev/trending?lat=${location.latitude}&lng=${location.longitude}&country=${location.country}`).then((res) => res.json()).then((data) => {
     return {
       repos: data.trending.repos.slice(0, 3),
@@ -28992,7 +29029,7 @@ var FEATURED_TEMPLATES = [
     contributedBy: null
   },
   {
-    homePageLabel: "Prompt to Motion graphics",
+    homePageLabel: "Prompt to Motion Graphics",
     shortName: "Prompt to Motion Graphics (Next.js)",
     org: "remotion-dev",
     repoName: "template-prompt-to-motion-graphics",
@@ -30063,7 +30100,7 @@ var GithubButton = () => {
       " ",
       /* @__PURE__ */ jsx151("div", {
         className: "text-xs inline-block ml-2 leading-none mt-[3px] self-center",
-        children: "24k"
+        children: "25k"
       })
     ]
   });

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/design.js

@@ -755,7 +755,7 @@ var __defProp2, __export2 = (target, all) => {
   });
 }, useIsPlayer = () => {
   return useContext(IsPlayerContext);
-}, VERSION = "4.0.394", checkMultipleRemotionVersions = () => {
+}, VERSION = "4.0.396", checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
   }
@@ -2929,11 +2929,15 @@ Check that all your Remotion packages are on the same version. If your dependenc
   });
 }, getCrossOriginValue = ({
   crossOrigin,
-  requestsVideoFrame
+  requestsVideoFrame,
+  isClientSideRendering
 }) => {
   if (crossOrigin !== undefined && crossOrigin !== null) {
     return crossOrigin;
   }
+  if (isClientSideRendering) {
+    return "anonymous";
+  }
   if (requestsVideoFrame) {
     return "anonymous";
   }
@@ -3638,8 +3642,17 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const [blocks, setBlocks] = useState13([]);
   const [onBufferingCallbacks, setOnBufferingCallbacks] = useState13([]);
   const [onResumeCallbacks, setOnResumeCallbacks] = useState13([]);
+  const env = useRemotionEnvironment();
+  const rendering = env.isRendering;
   const buffering = useRef9(false);
   const addBlock = useCallback8((block) => {
+    if (rendering) {
+      return {
+        unblock: () => {
+          return;
+        }
+      };
+    }
     setBlocks((b) => [...b, block]);
     return {
       unblock: () => {
@@ -3652,7 +3665,7 @@ Check that all your Remotion packages are on the same version. If your dependenc
         });
       }
     };
-  }, []);
+  }, [rendering]);
   const listenForBuffering = useCallback8((callback) => {
     setOnBufferingCallbacks((c) => [...c, callback]);
     return {
@@ -3670,6 +3683,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
     };
   }, []);
   useEffect7(() => {
+    if (rendering) {
+      return;
+    }
     if (blocks.length > 0) {
       onBufferingCallbacks.forEach((c) => c());
       playbackLogging({
@@ -3682,6 +3698,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [blocks]);
   if (typeof window !== "undefined") {
     useLayoutEffect6(() => {
+      if (rendering) {
+        return;
+      }
       if (blocks.length === 0) {
         onResumeCallbacks.forEach((c) => c());
         playbackLogging({
@@ -4465,7 +4484,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   warnAboutTooHighVolume(userPreferredVolume);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering: false
   });
   const propsToPass = useMemo21(() => {
     return {
@@ -5202,9 +5222,11 @@ Check that all your Remotion packages are on the same version. If your dependenc
       delayRender2
     ]);
   }
+  const { isClientSideRendering } = useRemotionEnvironment();
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering
   });
   return /* @__PURE__ */ jsx25("img", {
     ...props2,
@@ -5929,7 +5951,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [isSequenceHidden, style]);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: Boolean(onVideoFrame)
+    requestsVideoFrame: Boolean(onVideoFrame),
+    isClientSideRendering: false
   });
   return /* @__PURE__ */ jsx30("video", {
     ref: videoRef,

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/homepage/Pricing.js

@@ -755,7 +755,7 @@ var __defProp2, __export2 = (target, all) => {
   });
 }, useIsPlayer = () => {
   return useContext(IsPlayerContext);
-}, VERSION = "4.0.394", checkMultipleRemotionVersions = () => {
+}, VERSION = "4.0.396", checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
   }
@@ -2929,11 +2929,15 @@ Check that all your Remotion packages are on the same version. If your dependenc
   });
 }, getCrossOriginValue = ({
   crossOrigin,
-  requestsVideoFrame
+  requestsVideoFrame,
+  isClientSideRendering
 }) => {
   if (crossOrigin !== undefined && crossOrigin !== null) {
     return crossOrigin;
   }
+  if (isClientSideRendering) {
+    return "anonymous";
+  }
   if (requestsVideoFrame) {
     return "anonymous";
   }
@@ -3638,8 +3642,17 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const [blocks, setBlocks] = useState13([]);
   const [onBufferingCallbacks, setOnBufferingCallbacks] = useState13([]);
   const [onResumeCallbacks, setOnResumeCallbacks] = useState13([]);
+  const env = useRemotionEnvironment();
+  const rendering = env.isRendering;
   const buffering = useRef9(false);
   const addBlock = useCallback8((block) => {
+    if (rendering) {
+      return {
+        unblock: () => {
+          return;
+        }
+      };
+    }
     setBlocks((b) => [...b, block]);
     return {
       unblock: () => {
@@ -3652,7 +3665,7 @@ Check that all your Remotion packages are on the same version. If your dependenc
         });
       }
     };
-  }, []);
+  }, [rendering]);
   const listenForBuffering = useCallback8((callback) => {
     setOnBufferingCallbacks((c) => [...c, callback]);
     return {
@@ -3670,6 +3683,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
     };
   }, []);
   useEffect7(() => {
+    if (rendering) {
+      return;
+    }
     if (blocks.length > 0) {
       onBufferingCallbacks.forEach((c) => c());
       playbackLogging({
@@ -3682,6 +3698,9 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [blocks]);
   if (typeof window !== "undefined") {
     useLayoutEffect6(() => {
+      if (rendering) {
+        return;
+      }
       if (blocks.length === 0) {
         onResumeCallbacks.forEach((c) => c());
         playbackLogging({
@@ -4465,7 +4484,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   warnAboutTooHighVolume(userPreferredVolume);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering: false
   });
   const propsToPass = useMemo21(() => {
     return {
@@ -5202,9 +5222,11 @@ Check that all your Remotion packages are on the same version. If your dependenc
       delayRender2
     ]);
   }
+  const { isClientSideRendering } = useRemotionEnvironment();
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: false
+    requestsVideoFrame: false,
+    isClientSideRendering
   });
   return /* @__PURE__ */ jsx25("img", {
     ...props2,
@@ -5929,7 +5951,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [isSequenceHidden, style]);
   const crossOriginValue = getCrossOriginValue({
     crossOrigin,
-    requestsVideoFrame: Boolean(onVideoFrame)
+    requestsVideoFrame: Boolean(onVideoFrame),
+    isClientSideRendering: false
   });
   return /* @__PURE__ */ jsx30("video", {
     ref: videoRef,