@remotion/gif 4.0.213 → 4.0.215

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+
2
+ > @remotion/gif@4.0.214 make /Users/jonathanburger/remotion/packages/gif
3
+ > node build.mjs && bun --env-file=../.env.bundle bundle.ts
4
+
package/dist/cjs/Gif.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { RemotionGifProps } from './props';
3
2
  /**
4
3
  * @description Displays a GIF that synchronizes with Remotions useCurrentFrame().
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import type { RemotionGifProps } from './props';
3
2
  export declare const GifForDevelopment: import("react").ForwardRefExoticComponent<RemotionGifProps & import("react").RefAttributes<HTMLCanvasElement>>;
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import type { RemotionGifProps } from './props';
3
2
  export declare const GifForRendering: import("react").ForwardRefExoticComponent<RemotionGifProps & import("react").RefAttributes<HTMLCanvasElement>>;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { GifFillMode } from './props';
3
2
  type Props = {
4
3
  index: number;
@@ -1,4 +1,4 @@
1
- export { Gif } from './Gif';
2
1
  export { getGifDurationInSeconds } from './get-gif-duration-in-seconds';
2
+ export { Gif } from './Gif';
3
3
  export { preloadGif } from './preload-gif';
4
4
  export { GifFillMode, RemotionGifProps } from './props';
package/dist/cjs/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.preloadGif = exports.getGifDurationInSeconds = exports.Gif = void 0;
4
- var Gif_1 = require("./Gif");
5
- Object.defineProperty(exports, "Gif", { enumerable: true, get: function () { return Gif_1.Gif; } });
3
+ exports.preloadGif = exports.Gif = exports.getGifDurationInSeconds = void 0;
6
4
  var get_gif_duration_in_seconds_1 = require("./get-gif-duration-in-seconds");
7
5
  Object.defineProperty(exports, "getGifDurationInSeconds", { enumerable: true, get: function () { return get_gif_duration_in_seconds_1.getGifDurationInSeconds; } });
6
+ var Gif_1 = require("./Gif");
7
+ Object.defineProperty(exports, "Gif", { enumerable: true, get: function () { return Gif_1.Gif; } });
8
8
  var preload_gif_1 = require("./preload-gif");
9
9
  Object.defineProperty(exports, "preloadGif", { enumerable: true, get: function () { return preload_gif_1.preloadGif; } });
@@ -1,6 +1,6 @@
1
1
  import type { ParsedGif } from '../gifuct/types';
2
2
  import type { Stream } from './uint8-parser';
3
- export declare const GIF: (((stream: Stream, result: ParsedGif, parent: ParsedGif, parseFn: (st: Stream, schema: unknown, result: ParsedGif, parent: ParsedGif) => void) => void) | {
3
+ export declare const GIF: (((stream: Stream, result: ParsedGif, parent: ParsedGif, parseFn: (st: Stream, schema: import("./parser").GifSchema, result: ParsedGif, parent: ParsedGif) => void) => void) | {
4
4
  header: ({
5
5
  signature: (stream: Stream) => string;
6
6
  version?: undefined;
@@ -45,7 +45,7 @@ export declare const GIF: (((stream: Stream, result: ParsedGif, parent: ParsedGi
45
45
  header?: undefined;
46
46
  frames?: undefined;
47
47
  } | {
48
- frames: (stream: Stream, result: unknown, parent: unknown, _parse: (st: Stream, schema: unknown, result: unknown, parent: unknown) => void) => unknown[];
48
+ frames: (stream: Stream, result: unknown, parent: unknown, _parse: (st: Stream, schema: import("./parser").GifSchema, result: unknown, parent: unknown) => void) => unknown[];
49
49
  header?: undefined;
50
50
  lsd?: undefined;
51
51
  })[];
@@ -1,6 +1,6 @@
1
1
  import type { GifState } from './props';
2
2
  export declare const parse: (src: string, { signal, }: {
3
- signal: AbortController['signal'];
3
+ signal: AbortController["signal"];
4
4
  }) => Promise<{
5
5
  loaded: boolean;
6
6
  delays: number[];
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export type GifLoopBehavior = 'loop' | 'pause-after-finish' | 'unmount-after-finish';
3
2
  export type RemotionGifProps = {
4
3
  src: string;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useCurrentGifIndex = void 0;
3
+ exports.useCurrentGifIndex = useCurrentGifIndex;
4
4
  const react_1 = require("react");
5
5
  const remotion_1 = require("remotion");
6
6
  function useCurrentGifIndex({ delays, loopBehavior, playbackRate, }) {
@@ -33,4 +33,3 @@ function useCurrentGifIndex({ delays, loopBehavior, playbackRate, }) {
33
33
  }
34
34
  return 0;
35
35
  }
36
- exports.useCurrentGifIndex = useCurrentGifIndex;
@@ -1,181 +1,5 @@
1
- // src/Gif.tsx
2
- import {forwardRef as forwardRef4} from "react";
3
- import {getRemotionEnvironment} from "remotion";
4
-
5
- // src/GifForDevelopment.tsx
6
- import {forwardRef as forwardRef2, useEffect as useEffect3, useRef as useRef2, useState as useState3} from "react";
7
- import {continueRender, delayRender} from "remotion";
8
-
9
- // src/canvas.tsx
10
- import {
11
- forwardRef,
12
- useEffect as useEffect2,
13
- useImperativeHandle,
14
- useRef,
15
- useState as useState2
16
- } from "react";
17
-
18
- // src/use-element-size.ts
19
- import {useCallback, useEffect, useMemo, useState} from "react";
20
- var elementSizeHooks = [];
21
- var useElementSize = (ref) => {
22
- const [size, setSize] = useState(null);
23
- const observer = useMemo(() => {
24
- if (typeof ResizeObserver === "undefined") {
25
- return null;
26
- }
27
- return new ResizeObserver((entries) => {
28
- const { contentRect } = entries[0];
29
- const newSize = entries[0].target.getClientRects();
30
- if (!newSize?.[0]) {
31
- setSize(null);
32
- return;
33
- }
34
- const probableCssParentScale = newSize[0].width / contentRect.width;
35
- const width = newSize[0].width * (1 / probableCssParentScale);
36
- const height = newSize[0].height * (1 / probableCssParentScale);
37
- setSize({
38
- width,
39
- height
40
- });
41
- });
42
- }, []);
43
- const updateSize = useCallback(() => {
44
- if (!ref.current) {
45
- return;
46
- }
47
- const rect = ref.current.getClientRects();
48
- if (!rect[0]) {
49
- setSize(null);
50
- return;
51
- }
52
- setSize({
53
- width: rect[0].width,
54
- height: rect[0].height
55
- });
56
- }, [ref]);
57
- useEffect(() => {
58
- if (!observer) {
59
- return;
60
- }
61
- updateSize();
62
- const { current } = ref;
63
- if (ref.current) {
64
- observer.observe(ref.current);
65
- }
66
- return () => {
67
- if (current) {
68
- observer.unobserve(current);
69
- }
70
- };
71
- }, [observer, ref, updateSize]);
72
- useEffect(() => {
73
- elementSizeHooks.push(updateSize);
74
- return () => {
75
- elementSizeHooks = elementSizeHooks.filter((e) => e !== updateSize);
76
- };
77
- }, [updateSize]);
78
- return size;
79
- };
80
-
81
- // src/canvas.tsx
82
- import {
83
- jsx
84
- } from "react/jsx-runtime";
85
- var calcArgs = (fit, frameSize, canvasSize) => {
86
- switch (fit) {
87
- case "fill": {
88
- return [
89
- 0,
90
- 0,
91
- frameSize.width,
92
- frameSize.height,
93
- 0,
94
- 0,
95
- canvasSize.width,
96
- canvasSize.height
97
- ];
98
- }
99
- case "contain": {
100
- const ratio = Math.min(canvasSize.width / frameSize.width, canvasSize.height / frameSize.height);
101
- const centerX = (canvasSize.width - frameSize.width * ratio) / 2;
102
- const centerY = (canvasSize.height - frameSize.height * ratio) / 2;
103
- return [
104
- 0,
105
- 0,
106
- frameSize.width,
107
- frameSize.height,
108
- centerX,
109
- centerY,
110
- frameSize.width * ratio,
111
- frameSize.height * ratio
112
- ];
113
- }
114
- case "cover": {
115
- const ratio = Math.max(canvasSize.width / frameSize.width, canvasSize.height / frameSize.height);
116
- const centerX = (canvasSize.width - frameSize.width * ratio) / 2;
117
- const centerY = (canvasSize.height - frameSize.height * ratio) / 2;
118
- return [
119
- 0,
120
- 0,
121
- frameSize.width,
122
- frameSize.height,
123
- centerX,
124
- centerY,
125
- frameSize.width * ratio,
126
- frameSize.height * ratio
127
- ];
128
- }
129
- default:
130
- throw new Error("Unknown fit: " + fit);
131
- }
132
- };
133
- var makeCanvas = () => {
134
- if (typeof document === "undefined") {
135
- return null;
136
- }
137
- const canvas = document.createElement("canvas");
138
- const ctx = canvas.getContext("2d");
139
- canvas.width = 0;
140
- canvas.height = 0;
141
- return ctx;
142
- };
143
- var Canvas = forwardRef(({ index, frames, width, height, fit, className, style }, ref) => {
144
- const canvasRef = useRef(null);
145
- const [tempCtx] = useState2(() => {
146
- return makeCanvas();
147
- });
148
- const size = useElementSize(canvasRef);
149
- useImperativeHandle(ref, () => {
150
- return canvasRef.current;
151
- }, []);
152
- useEffect2(() => {
153
- if (!size) {
154
- return;
155
- }
156
- const imageData = frames[index];
157
- const ctx = canvasRef.current?.getContext("2d");
158
- if (imageData && tempCtx && ctx) {
159
- if (tempCtx.canvas.width < imageData.width || tempCtx.canvas.height < imageData.height) {
160
- tempCtx.canvas.width = imageData.width;
161
- tempCtx.canvas.height = imageData.height;
162
- }
163
- if (size.width > 0 && size.height > 0) {
164
- ctx.clearRect(0, 0, size.width, size.height);
165
- tempCtx.clearRect(0, 0, tempCtx.canvas.width, tempCtx.canvas.height);
166
- }
167
- tempCtx.putImageData(imageData, 0, 0);
168
- ctx.drawImage(tempCtx.canvas, ...calcArgs(fit, imageData, { width: size.width, height: size.height }));
169
- }
170
- }, [index, frames, fit, tempCtx, size]);
171
- return /* @__PURE__ */ jsx("canvas", {
172
- ref: canvasRef,
173
- className,
174
- style,
175
- width: width ?? size?.width,
176
- height: height ?? size?.height
177
- });
178
- });
1
+ // src/get-gif-duration-in-seconds.ts
2
+ import { getRemotionEnvironment } from "remotion";
179
3
 
180
4
  // src/lru/index.ts
181
5
  class QuickLRU {
@@ -411,11 +235,6 @@ class QuickLRU {
411
235
  var volatileGifCache = new QuickLRU({ maxSize: 30 });
412
236
  var manuallyManagedGifCache = new Map;
413
237
 
414
- // src/is-cors-error.ts
415
- var isCorsError = (error) => {
416
- return error.message.includes("Failed to fetch") || error.message.includes("Load failed") || error.message.includes("NetworkError when attempting to fetch resource");
417
- };
418
-
419
238
  // src/js-binary-schema-parser/parser.ts
420
239
  var parse = (stream, schema, result = {}, parent = result) => {
421
240
  if (Array.isArray(schema)) {
@@ -816,9 +635,9 @@ var decompressFrames = (parsedGif) => {
816
635
  };
817
636
 
818
637
  // src/parse-generate.ts
819
- var validateAndFix = (gif2) => {
638
+ var validateAndFix = (gif) => {
820
639
  let currentGce = null;
821
- for (const frame of gif2.frames) {
640
+ for (const frame of gif.frames) {
822
641
  currentGce = frame.gce ? frame.gce : currentGce;
823
642
  if ("image" in frame && !("gce" in frame) && currentGce !== null) {
824
643
  frame.gce = currentGce;
@@ -868,12 +687,12 @@ var parse2 = (src, {
868
687
  if (!resp.headers.get("Content-Type")?.includes("image/gif"))
869
688
  throw Error(`Wrong content type: "${resp.headers.get("Content-Type")}"`);
870
689
  return resp.arrayBuffer();
871
- }).then((buffer) => parseGIF(buffer)).then((gif2) => {
872
- validateAndFix(gif2);
873
- return gif2;
874
- }).then((gif2) => Promise.all([
875
- decompressFrames(gif2),
876
- { width: gif2.lsd.width, height: gif2.lsd.height }
690
+ }).then((buffer) => parseGIF(buffer)).then((gif) => {
691
+ validateAndFix(gif);
692
+ return gif;
693
+ }).then((gif) => Promise.all([
694
+ decompressFrames(gif),
695
+ { width: gif.lsd.width, height: gif.lsd.height }
877
696
  ])).then(([frames, options]) => {
878
697
  const readyFrames = [];
879
698
  const size = options.width * options.height * 4;
@@ -940,7 +759,7 @@ var parseGif = async ({
940
759
  return generate(raw);
941
760
  };
942
761
  var parseWithWorker = (src2) => {
943
- const worker2 = makeWorker();
762
+ const worker = makeWorker();
944
763
  let handler = null;
945
764
  const prom = new Promise((resolve, reject) => {
946
765
  handler = (e) => {
@@ -951,31 +770,236 @@ var parseWithWorker = (src2) => {
951
770
  } else {
952
771
  const data = message.error ? message : generate(message);
953
772
  resolve(data);
954
- worker2.terminate();
773
+ worker.terminate();
955
774
  }
956
775
  }
957
776
  };
958
- worker2.addEventListener("message", handler);
959
- worker2.postMessage({ src: src2, type: "parse" });
777
+ worker.addEventListener("message", handler);
778
+ worker.postMessage({ src: src2, type: "parse" });
960
779
  });
961
780
  return {
962
781
  prom,
963
782
  cancel: () => {
964
- worker2.postMessage({ src: src2, type: "cancel" });
965
- worker2.removeEventListener("message", handler);
966
- worker2.terminate();
783
+ worker.postMessage({ src: src2, type: "cancel" });
784
+ worker.removeEventListener("message", handler);
785
+ worker.terminate();
967
786
  }
968
787
  };
969
788
  };
970
789
 
790
+ // src/get-gif-duration-in-seconds.ts
791
+ var calcDuration = (parsed) => {
792
+ return parsed.delays.reduce((sum, delay) => sum + delay, 0) / 1000;
793
+ };
794
+ var getGifDurationInSeconds = async (src2) => {
795
+ const resolvedSrc = new URL(src2, window.origin).href;
796
+ const inCache = volatileGifCache.get(resolvedSrc) ?? manuallyManagedGifCache.get(resolvedSrc);
797
+ if (inCache) {
798
+ return calcDuration(inCache);
799
+ }
800
+ if (getRemotionEnvironment().isRendering) {
801
+ const renderingParsed = parseWithWorker(resolvedSrc);
802
+ const resolved = await renderingParsed.prom;
803
+ volatileGifCache.set(resolvedSrc, resolved);
804
+ return calcDuration(resolved);
805
+ }
806
+ const parsed = await parseGif({
807
+ src: resolvedSrc,
808
+ controller: new AbortController
809
+ });
810
+ volatileGifCache.set(resolvedSrc, parsed);
811
+ return calcDuration(parsed);
812
+ };
813
+ // src/Gif.tsx
814
+ import { forwardRef as forwardRef4 } from "react";
815
+ import { getRemotionEnvironment as getRemotionEnvironment2 } from "remotion";
816
+
817
+ // src/GifForDevelopment.tsx
818
+ import { forwardRef as forwardRef2, useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
819
+ import { continueRender, delayRender } from "remotion";
820
+
821
+ // src/canvas.tsx
822
+ import {
823
+ forwardRef,
824
+ useEffect as useEffect2,
825
+ useImperativeHandle,
826
+ useRef,
827
+ useState as useState2
828
+ } from "react";
829
+
830
+ // src/use-element-size.ts
831
+ import { useCallback, useEffect, useMemo, useState } from "react";
832
+ var elementSizeHooks = [];
833
+ var useElementSize = (ref) => {
834
+ const [size, setSize] = useState(null);
835
+ const observer = useMemo(() => {
836
+ if (typeof ResizeObserver === "undefined") {
837
+ return null;
838
+ }
839
+ return new ResizeObserver((entries) => {
840
+ const { contentRect } = entries[0];
841
+ const newSize = entries[0].target.getClientRects();
842
+ if (!newSize?.[0]) {
843
+ setSize(null);
844
+ return;
845
+ }
846
+ const probableCssParentScale = newSize[0].width / contentRect.width;
847
+ const width = newSize[0].width * (1 / probableCssParentScale);
848
+ const height = newSize[0].height * (1 / probableCssParentScale);
849
+ setSize({
850
+ width,
851
+ height
852
+ });
853
+ });
854
+ }, []);
855
+ const updateSize = useCallback(() => {
856
+ if (!ref.current) {
857
+ return;
858
+ }
859
+ const rect = ref.current.getClientRects();
860
+ if (!rect[0]) {
861
+ setSize(null);
862
+ return;
863
+ }
864
+ setSize({
865
+ width: rect[0].width,
866
+ height: rect[0].height
867
+ });
868
+ }, [ref]);
869
+ useEffect(() => {
870
+ if (!observer) {
871
+ return;
872
+ }
873
+ updateSize();
874
+ const { current } = ref;
875
+ if (ref.current) {
876
+ observer.observe(ref.current);
877
+ }
878
+ return () => {
879
+ if (current) {
880
+ observer.unobserve(current);
881
+ }
882
+ };
883
+ }, [observer, ref, updateSize]);
884
+ useEffect(() => {
885
+ elementSizeHooks.push(updateSize);
886
+ return () => {
887
+ elementSizeHooks = elementSizeHooks.filter((e) => e !== updateSize);
888
+ };
889
+ }, [updateSize]);
890
+ return size;
891
+ };
892
+
893
+ // src/canvas.tsx
894
+ import { jsx } from "react/jsx-runtime";
895
+ var calcArgs = (fit, frameSize, canvasSize) => {
896
+ switch (fit) {
897
+ case "fill": {
898
+ return [
899
+ 0,
900
+ 0,
901
+ frameSize.width,
902
+ frameSize.height,
903
+ 0,
904
+ 0,
905
+ canvasSize.width,
906
+ canvasSize.height
907
+ ];
908
+ }
909
+ case "contain": {
910
+ const ratio = Math.min(canvasSize.width / frameSize.width, canvasSize.height / frameSize.height);
911
+ const centerX = (canvasSize.width - frameSize.width * ratio) / 2;
912
+ const centerY = (canvasSize.height - frameSize.height * ratio) / 2;
913
+ return [
914
+ 0,
915
+ 0,
916
+ frameSize.width,
917
+ frameSize.height,
918
+ centerX,
919
+ centerY,
920
+ frameSize.width * ratio,
921
+ frameSize.height * ratio
922
+ ];
923
+ }
924
+ case "cover": {
925
+ const ratio = Math.max(canvasSize.width / frameSize.width, canvasSize.height / frameSize.height);
926
+ const centerX = (canvasSize.width - frameSize.width * ratio) / 2;
927
+ const centerY = (canvasSize.height - frameSize.height * ratio) / 2;
928
+ return [
929
+ 0,
930
+ 0,
931
+ frameSize.width,
932
+ frameSize.height,
933
+ centerX,
934
+ centerY,
935
+ frameSize.width * ratio,
936
+ frameSize.height * ratio
937
+ ];
938
+ }
939
+ default:
940
+ throw new Error("Unknown fit: " + fit);
941
+ }
942
+ };
943
+ var makeCanvas = () => {
944
+ if (typeof document === "undefined") {
945
+ return null;
946
+ }
947
+ const canvas = document.createElement("canvas");
948
+ const ctx = canvas.getContext("2d");
949
+ canvas.width = 0;
950
+ canvas.height = 0;
951
+ return ctx;
952
+ };
953
+ var Canvas = forwardRef(({ index, frames, width, height, fit, className, style }, ref) => {
954
+ const canvasRef = useRef(null);
955
+ const [tempCtx] = useState2(() => {
956
+ return makeCanvas();
957
+ });
958
+ const size = useElementSize(canvasRef);
959
+ useImperativeHandle(ref, () => {
960
+ return canvasRef.current;
961
+ }, []);
962
+ useEffect2(() => {
963
+ if (!size) {
964
+ return;
965
+ }
966
+ const imageData = frames[index];
967
+ const ctx = canvasRef.current?.getContext("2d");
968
+ if (imageData && tempCtx && ctx) {
969
+ if (tempCtx.canvas.width < imageData.width || tempCtx.canvas.height < imageData.height) {
970
+ tempCtx.canvas.width = imageData.width;
971
+ tempCtx.canvas.height = imageData.height;
972
+ }
973
+ if (size.width > 0 && size.height > 0) {
974
+ ctx.clearRect(0, 0, size.width, size.height);
975
+ tempCtx.clearRect(0, 0, tempCtx.canvas.width, tempCtx.canvas.height);
976
+ }
977
+ tempCtx.putImageData(imageData, 0, 0);
978
+ ctx.drawImage(tempCtx.canvas, ...calcArgs(fit, imageData, { width: size.width, height: size.height }));
979
+ }
980
+ }, [index, frames, fit, tempCtx, size]);
981
+ return /* @__PURE__ */ jsx("canvas", {
982
+ ref: canvasRef,
983
+ className,
984
+ style,
985
+ width: width ?? size?.width,
986
+ height: height ?? size?.height
987
+ });
988
+ });
989
+
990
+ // src/is-cors-error.ts
991
+ var isCorsError = (error) => {
992
+ return error.message.includes("Failed to fetch") || error.message.includes("Load failed") || error.message.includes("NetworkError when attempting to fetch resource");
993
+ };
994
+
971
995
  // src/resolve-gif-source.ts
972
996
  var resolveGifSource = (src2) => {
973
997
  return new URL(src2, typeof window === "undefined" ? undefined : window.origin).href;
974
998
  };
975
999
 
976
1000
  // src/useCurrentGifIndex.tsx
977
- import {useMemo as useMemo2} from "react";
978
- import {useCurrentFrame, useVideoConfig} from "remotion";
1001
+ import { useMemo as useMemo2 } from "react";
1002
+ import { useCurrentFrame, useVideoConfig } from "remotion";
979
1003
  function useCurrentGifIndex({
980
1004
  delays,
981
1005
  loopBehavior,
@@ -1012,9 +1036,7 @@ function useCurrentGifIndex({
1012
1036
  }
1013
1037
 
1014
1038
  // src/GifForDevelopment.tsx
1015
- import {
1016
- jsx as jsx2
1017
- } from "react/jsx-runtime";
1039
+ import { jsx as jsx2 } from "react/jsx-runtime";
1018
1040
  var GifForDevelopment = forwardRef2(({
1019
1041
  src: src2,
1020
1042
  width,
@@ -1103,11 +1125,9 @@ var GifForDevelopment = forwardRef2(({
1103
1125
  });
1104
1126
 
1105
1127
  // src/GifForRendering.tsx
1106
- import {forwardRef as forwardRef3, useEffect as useEffect4, useRef as useRef3, useState as useState4} from "react";
1107
- import {continueRender as continueRender2, delayRender as delayRender2} from "remotion";
1108
- import {
1109
- jsx as jsx3
1110
- } from "react/jsx-runtime";
1128
+ import { forwardRef as forwardRef3, useEffect as useEffect4, useRef as useRef3, useState as useState4 } from "react";
1129
+ import { continueRender as continueRender2, delayRender as delayRender2 } from "remotion";
1130
+ import { jsx as jsx3 } from "react/jsx-runtime";
1111
1131
  var GifForRendering = forwardRef3(({
1112
1132
  src: src2,
1113
1133
  width,
@@ -1201,11 +1221,9 @@ var GifForRendering = forwardRef3(({
1201
1221
  });
1202
1222
 
1203
1223
  // src/Gif.tsx
1204
- import {
1205
- jsx as jsx4
1206
- } from "react/jsx-runtime";
1224
+ import { jsx as jsx4 } from "react/jsx-runtime";
1207
1225
  var Gif = forwardRef4((props, ref) => {
1208
- const env = getRemotionEnvironment();
1226
+ const env = getRemotionEnvironment2();
1209
1227
  if (env.isRendering) {
1210
1228
  return /* @__PURE__ */ jsx4(GifForRendering, {
1211
1229
  ...props,
@@ -1217,30 +1235,6 @@ var Gif = forwardRef4((props, ref) => {
1217
1235
  ref
1218
1236
  });
1219
1237
  });
1220
- // src/get-gif-duration-in-seconds.ts
1221
- import {getRemotionEnvironment as getRemotionEnvironment2} from "remotion";
1222
- var calcDuration = (parsed) => {
1223
- return parsed.delays.reduce((sum, delay) => sum + delay, 0) / 1000;
1224
- };
1225
- var getGifDurationInSeconds = async (src2) => {
1226
- const resolvedSrc = new URL(src2, window.origin).href;
1227
- const inCache = volatileGifCache.get(resolvedSrc) ?? manuallyManagedGifCache.get(resolvedSrc);
1228
- if (inCache) {
1229
- return calcDuration(inCache);
1230
- }
1231
- if (getRemotionEnvironment2().isRendering) {
1232
- const renderingParsed = parseWithWorker(resolvedSrc);
1233
- const resolved = await renderingParsed.prom;
1234
- volatileGifCache.set(resolvedSrc, resolved);
1235
- return calcDuration(resolved);
1236
- }
1237
- const parsed = await parseGif({
1238
- src: resolvedSrc,
1239
- controller: new AbortController
1240
- });
1241
- volatileGifCache.set(resolvedSrc, parsed);
1242
- return calcDuration(parsed);
1243
- };
1244
1238
  // src/preload-gif.ts
1245
1239
  var preloadGif = (src2) => {
1246
1240
  const resolvedSrc = resolveGifSource(src2);
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "url": "https://github.com/remotion-dev/remotion/tree/main/packages/gif"
4
4
  },
5
5
  "name": "@remotion/gif",
6
- "version": "4.0.213",
6
+ "version": "4.0.215",
7
7
  "description": "Embed GIFs in a Remotion video",
8
8
  "sideEffects": false,
9
9
  "bugs": {
@@ -24,7 +24,7 @@
24
24
  }
25
25
  },
26
26
  "dependencies": {
27
- "remotion": "4.0.213"
27
+ "remotion": "4.0.215"
28
28
  },
29
29
  "devDependencies": {
30
30
  "esbuild": "0.18.6",
@@ -50,6 +50,6 @@
50
50
  "scripts": {
51
51
  "formatting": "prettier src --check",
52
52
  "lint": "eslint src --ext ts,tsx",
53
- "build": "node build.mjs && bun --env-file=../.env.bundle bundle.ts"
53
+ "make": "node build.mjs && bun --env-file=../.env.bundle bundle.ts"
54
54
  }
55
55
  }
@@ -1,4 +0,0 @@
1
-
2
- > @remotion/gif@4.0.213 build /Users/jonathanburger/remotion/packages/gif
3
- > node build.mjs && bun --env-file=../.env.bundle bundle.ts
4
-
@@ -1,6 +0,0 @@
1
-
2
- > @remotion/gif@4.0.211 formatting /Users/jonathanburger/remotion/packages/gif
3
- > prettier src --check
4
-
5
- Checking formatting...
6
- src/canvas.tsxsrc/get-gif-duration-in-seconds.tssrc/gif-cache.tssrc/Gif.tsxsrc/GifForDevelopment.tsxsrc/GifForRendering.tsxsrc/gifuct/deinterlace.tssrc/gifuct/index.tssrc/gifuct/lzw.tssrc/gifuct/types.tssrc/index.tssrc/is-cors-error.tssrc/js-binary-schema-parser/gif.tssrc/js-binary-schema-parser/parser.tssrc/js-binary-schema-parser/uint8-parser.tssrc/lru/index.tssrc/parse-generate.tssrc/parser/decompress-frames.tssrc/preload-gif.tssrc/props.tssrc/react-tools.tssrc/resolve-gif-source.tssrc/use-element-size.tssrc/useCurrentGifIndex.tsxsrc/worker/index.tssrc/worker/source.tssrc/worker/worker.tsAll matched files use Prettier code style!
@@ -1,4 +0,0 @@
1
-
2
- > @remotion/gif@4.0.211 lint /Users/jonathanburger/remotion/packages/gif
3
- > eslint src --ext ts,tsx
4
-