@remotion/gif 4.0.402 → 4.0.403

package/dist/cjs/GifForRendering.js

@@ -10,7 +10,7 @@ const is_cors_error_1 = require("./is-cors-error");
 const react_tools_1 = require("./react-tools");
 const resolve_gif_source_1 = require("./resolve-gif-source");
 const useCurrentGifIndex_1 = require("./useCurrentGifIndex");
-exports.GifForRendering = (0, react_1.forwardRef)(({ src, width, height, onLoad, onError, loopBehavior = 'loop', playbackRate = 1, fit = 'fill', ...props }, ref) => {
+exports.GifForRendering = (0, react_1.forwardRef)(({ src, width, height, onLoad, onError, loopBehavior = 'loop', playbackRate = 1, fit = 'fill', delayRenderTimeoutInMilliseconds, ...props }, ref) => {
     const resolvedSrc = (0, resolve_gif_source_1.resolveGifSource)(src);
     const { delayRender, continueRender } = (0, remotion_1.useDelayRender)();
     const [state, update] = (0, react_1.useState)(() => {
@@ -26,7 +26,9 @@ exports.GifForRendering = (0, react_1.forwardRef)(({ src, width, height, onLoad,
         return parsedGif;
     });
     const [error, setError] = (0, react_1.useState)(null);
-    const [renderHandle] = (0, react_1.useState)(() => delayRender(`Rendering <Gif/> with src="${resolvedSrc}"`));
+    const [renderHandle] = (0, react_1.useState)(() => delayRender(`Rendering <Gif/> with src="${resolvedSrc}"`, {
+        timeoutInMilliseconds: delayRenderTimeoutInMilliseconds,
+    }));
     const logLevel = remotion_1.Internals.useLogLevel();
     (0, react_1.useEffect)(() => {
         return () => {
@@ -46,7 +48,9 @@ exports.GifForRendering = (0, react_1.forwardRef)(({ src, width, height, onLoad,
         const controller = new AbortController();
         let done = false;
         let aborted = false;
-        const newHandle = delayRender('Loading <Gif /> with src=' + resolvedSrc);
+        const newHandle = delayRender('Loading <Gif /> with src=' + resolvedSrc, {
+            timeoutInMilliseconds: delayRenderTimeoutInMilliseconds,
+        });
         remotion_1.Internals.Log.verbose({ logLevel, tag: null }, 'Loading GIF with source', resolvedSrc);
         const time = Date.now();
         (0, react_tools_1.parseGif)({ controller, src: resolvedSrc })
@@ -81,7 +85,14 @@ exports.GifForRendering = (0, react_1.forwardRef)(({ src, width, height, onLoad,
             continueRender(newHandle);
             continueRender(renderHandle);
         };
-    }, [renderHandle, logLevel, resolvedSrc, delayRender, continueRender]);
+    }, [
+        renderHandle,
+        logLevel,
+        resolvedSrc,
+        delayRender,
+        continueRender,
+        delayRenderTimeoutInMilliseconds,
+    ]);
     if (error) {
         remotion_1.Internals.Log.error({ logLevel, tag: null }, error.stack);
         if ((0, is_cors_error_1.isCorsError)(error)) {

package/dist/cjs/props.d.ts

@@ -15,6 +15,7 @@ export type RemotionGifProps = {
     style?: React.CSSProperties;
     loopBehavior?: GifLoopBehavior;
     id?: string;
+    delayRenderTimeoutInMilliseconds?: number;
 };
 export type GifState = {
     delays: number[];

package/dist/esm/index.mjs

@@ -1133,6 +1133,7 @@ var GifForRendering = forwardRef3(({
   loopBehavior = "loop",
   playbackRate = 1,
   fit = "fill",
+  delayRenderTimeoutInMilliseconds,
   ...props
 }, ref) => {
   const resolvedSrc = resolveGifSource(src2);
@@ -1150,7 +1151,9 @@ var GifForRendering = forwardRef3(({
     return parsedGif;
   });
   const [error, setError] = useState4(null);
-  const [renderHandle] = useState4(() => delayRender(`Rendering <Gif/> with src="${resolvedSrc}"`));
+  const [renderHandle] = useState4(() => delayRender(`Rendering <Gif/> with src="${resolvedSrc}"`, {
+    timeoutInMilliseconds: delayRenderTimeoutInMilliseconds
+  }));
   const logLevel = Internals.useLogLevel();
   useEffect4(() => {
     return () => {
@@ -1170,7 +1173,9 @@ var GifForRendering = forwardRef3(({
     const controller = new AbortController;
     let done = false;
     let aborted = false;
-    const newHandle = delayRender("Loading <Gif /> with src=" + resolvedSrc);
+    const newHandle = delayRender("Loading <Gif /> with src=" + resolvedSrc, {
+      timeoutInMilliseconds: delayRenderTimeoutInMilliseconds
+    });
     Internals.Log.verbose({ logLevel, tag: null }, "Loading GIF with source", resolvedSrc);
     const time = Date.now();
     parseGif({ controller, src: resolvedSrc }).then((parsed) => {
@@ -1201,7 +1206,14 @@ var GifForRendering = forwardRef3(({
       continueRender(newHandle);
       continueRender(renderHandle);
     };
-  }, [renderHandle, logLevel, resolvedSrc, delayRender, continueRender]);
+  }, [
+    renderHandle,
+    logLevel,
+    resolvedSrc,
+    delayRender,
+    continueRender,
+    delayRenderTimeoutInMilliseconds
+  ]);
   if (error) {
     Internals.Log.error({ logLevel, tag: null }, error.stack);
     if (isCorsError(error)) {

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/gif"
 	},
 	"name": "@remotion/gif",
-	"version": "4.0.402",
+	"version": "4.0.403",
 	"description": "Embed GIFs in a Remotion video",
 	"sideEffects": false,
 	"bugs": {
@@ -29,14 +29,14 @@
 		}
 	},
 	"dependencies": {
-		"remotion": "4.0.402"
+		"remotion": "4.0.403"
 	},
 	"devDependencies": {
 		"esbuild": "0.25.0",
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"webpack": "5.96.1",
-		"@remotion/eslint-config-internal": "4.0.402",
+		"@remotion/eslint-config-internal": "4.0.403",
 		"eslint": "9.19.0"
 	},
 	"peerDependencies": {