remotion 4.0.485 → 4.0.487

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.
@@ -1291,7 +1291,7 @@ var addSequenceStackTraces = (component) => {
1291
1291
  };
1292
1292
 
1293
1293
  // src/version.ts
1294
- var VERSION = "4.0.485";
1294
+ var VERSION = "4.0.487";
1295
1295
 
1296
1296
  // src/multiple-versions-warning.ts
1297
1297
  var checkMultipleRemotionVersions = () => {
@@ -1756,6 +1756,12 @@ var textSchema = {
1756
1756
  default: undefined,
1757
1757
  description: "Color"
1758
1758
  },
1759
+ "style.fontFamily": {
1760
+ type: "font-family",
1761
+ default: undefined,
1762
+ description: "Font family",
1763
+ keyframable: false
1764
+ },
1759
1765
  "style.fontSize": {
1760
1766
  type: "number",
1761
1767
  default: undefined,
@@ -7452,7 +7458,8 @@ var useBufferManager = (logLevel, mountTime) => {
7452
7458
  if (rendering) {
7453
7459
  return;
7454
7460
  }
7455
- if (blocks.length > 0) {
7461
+ if (blocks.length > 0 && !buffering.current) {
7462
+ buffering.current = true;
7456
7463
  onBufferingCallbacks.forEach((c2) => c2());
7457
7464
  playbackLogging({
7458
7465
  logLevel,
@@ -7467,7 +7474,8 @@ var useBufferManager = (logLevel, mountTime) => {
7467
7474
  if (rendering) {
7468
7475
  return;
7469
7476
  }
7470
- if (blocks.length === 0) {
7477
+ if (blocks.length === 0 && buffering.current) {
7478
+ buffering.current = false;
7471
7479
  onResumeCallbacks.forEach((c2) => c2());
7472
7480
  playbackLogging({
7473
7481
  logLevel,
@@ -7500,15 +7508,11 @@ var useIsPlayerBuffering = (bufferManager) => {
7500
7508
  const onResume = () => {
7501
7509
  setIsBuffering(false);
7502
7510
  };
7503
- bufferManager.listenForBuffering(onBuffer);
7504
- bufferManager.listenForResume(onResume);
7511
+ const buffer = bufferManager.listenForBuffering(onBuffer);
7512
+ const resume = bufferManager.listenForResume(onResume);
7505
7513
  return () => {
7506
- bufferManager.listenForBuffering(() => {
7507
- return;
7508
- });
7509
- bufferManager.listenForResume(() => {
7510
- return;
7511
- });
7514
+ buffer.remove();
7515
+ resume.remove();
7512
7516
  };
7513
7517
  }, [bufferManager]);
7514
7518
  return isBuffering;
@@ -7637,6 +7641,74 @@ var useBufferUntilFirstFrame = ({
7637
7641
  }, [bufferUntilFirstFrame]);
7638
7642
  };
7639
7643
 
7644
+ // src/get-media-sync-action.ts
7645
+ var getMediaSyncAction = (input) => {
7646
+ const {
7647
+ duration,
7648
+ currentTime,
7649
+ paused,
7650
+ ended,
7651
+ desiredUnclampedTime,
7652
+ mediaTagTime,
7653
+ mediaTagLastUpdate,
7654
+ rvcTime,
7655
+ rvcLastUpdate,
7656
+ isVariableFpsVideo,
7657
+ acceptableTimeShift,
7658
+ lastSeekDueToShift,
7659
+ playing,
7660
+ playbackRate,
7661
+ mediaTagBufferingOrStalled,
7662
+ playerBuffering,
7663
+ absoluteFrame,
7664
+ onlyWarnForMediaSeekingError,
7665
+ isPremounting,
7666
+ isPostmounting,
7667
+ pauseWhenBuffering
7668
+ } = input;
7669
+ const shouldBeTime = !Number.isNaN(duration) && Number.isFinite(duration) ? Math.min(duration, desiredUnclampedTime) : desiredUnclampedTime;
7670
+ const timeShiftMediaTag = Math.abs(shouldBeTime - mediaTagTime);
7671
+ const timeShiftRvcTag = rvcTime ? Math.abs(shouldBeTime - rvcTime) : null;
7672
+ const mostRecentTimeshift = rvcLastUpdate && rvcTime > mediaTagLastUpdate ? timeShiftRvcTag : timeShiftMediaTag;
7673
+ const timeShift = timeShiftRvcTag && !isVariableFpsVideo ? mostRecentTimeshift : timeShiftMediaTag;
7674
+ if (timeShift > acceptableTimeShift && lastSeekDueToShift !== shouldBeTime) {
7675
+ return {
7676
+ type: "seek-due-to-shift",
7677
+ shouldBeTime,
7678
+ why: `because time shift is too big. shouldBeTime = ${shouldBeTime}, isTime = ${mediaTagTime}, requestVideoCallbackTime = ${rvcTime}, timeShift = ${timeShift}${isVariableFpsVideo ? ", isVariableFpsVideo = true" : ""}, isPremounting = ${isPremounting}, isPostmounting = ${isPostmounting}, pauseWhenBuffering = ${pauseWhenBuffering}`,
7679
+ bufferUntilFirstFrame: playing && playbackRate > 0,
7680
+ playReason: playing && paused ? "player is playing but media tag is paused, and just seeked" : null,
7681
+ warnAboutNonSeekable: !onlyWarnForMediaSeekingError
7682
+ };
7683
+ }
7684
+ const seekThreshold = playing ? 0.15 : 0.01;
7685
+ const makesSenseToSeek = Math.abs(currentTime - shouldBeTime) > seekThreshold;
7686
+ const isSomethingElseBuffering = playerBuffering && !mediaTagBufferingOrStalled;
7687
+ if (!playing || isSomethingElseBuffering) {
7688
+ return {
7689
+ type: "seek-if-not-playing",
7690
+ shouldBeTime,
7691
+ why: makesSenseToSeek ? `not playing or something else is buffering. time offset is over seek threshold (${seekThreshold})` : null
7692
+ };
7693
+ }
7694
+ if (!playing || playerBuffering) {
7695
+ return { type: "none" };
7696
+ }
7697
+ const pausedCondition = paused && !ended;
7698
+ const firstFrameCondition = absoluteFrame === 0;
7699
+ if (pausedCondition || firstFrameCondition) {
7700
+ const reason = pausedCondition ? "media tag is paused" : "absolute frame is 0";
7701
+ return {
7702
+ type: "play-and-seek",
7703
+ shouldBeTime,
7704
+ why: makesSenseToSeek ? `is over timeshift threshold (threshold = ${seekThreshold}) and ${reason}` : null,
7705
+ playReason: `player is playing and ${reason}`,
7706
+ bufferUntilFirstFrame: !isVariableFpsVideo && playbackRate > 0
7707
+ };
7708
+ }
7709
+ return { type: "none" };
7710
+ };
7711
+
7640
7712
  // src/media-tag-current-time-timestamp.ts
7641
7713
  import React21 from "react";
7642
7714
  var useCurrentTimeOfMediaTagWithUpdateTimeStamp = (mediaRef) => {
@@ -8072,89 +8144,93 @@ var useMediaPlayback = ({
8072
8144
  if (!src) {
8073
8145
  throw new Error(`No 'src' attribute was passed to the ${tagName} element.`);
8074
8146
  }
8075
- const { duration } = mediaRef.current;
8076
- const shouldBeTime = !Number.isNaN(duration) && Number.isFinite(duration) ? Math.min(duration, desiredUnclampedTime) : desiredUnclampedTime;
8077
- const mediaTagTime = mediaTagCurrentTime.current.time;
8078
- const rvcTime = rvcCurrentTime.current?.time ?? null;
8079
- const isVariableFpsVideo = isVariableFpsVideoMap.current[src];
8080
- const timeShiftMediaTag = Math.abs(shouldBeTime - mediaTagTime);
8081
- const timeShiftRvcTag = rvcTime ? Math.abs(shouldBeTime - rvcTime) : null;
8082
- const mostRecentTimeshift = rvcCurrentTime.current?.lastUpdate && rvcCurrentTime.current.time > mediaTagCurrentTime.current.lastUpdate ? timeShiftRvcTag : timeShiftMediaTag;
8083
- const timeShift = timeShiftRvcTag && !isVariableFpsVideo ? mostRecentTimeshift : timeShiftMediaTag;
8084
- if (timeShift > acceptableTimeShiftButLessThanDuration && lastSeekDueToShift.current !== shouldBeTime) {
8147
+ const { current } = mediaRef;
8148
+ const action = getMediaSyncAction({
8149
+ duration: current.duration,
8150
+ currentTime: current.currentTime,
8151
+ paused: current.paused,
8152
+ ended: current.ended,
8153
+ desiredUnclampedTime,
8154
+ mediaTagTime: mediaTagCurrentTime.current.time,
8155
+ mediaTagLastUpdate: mediaTagCurrentTime.current.lastUpdate,
8156
+ rvcTime: rvcCurrentTime.current?.time ?? null,
8157
+ rvcLastUpdate: rvcCurrentTime.current?.lastUpdate ?? null,
8158
+ isVariableFpsVideo: Boolean(isVariableFpsVideoMap.current[src]),
8159
+ acceptableTimeShift: acceptableTimeShiftButLessThanDuration,
8160
+ lastSeekDueToShift: lastSeekDueToShift.current,
8161
+ playing,
8162
+ playbackRate,
8163
+ mediaTagBufferingOrStalled: isMediaTagBuffering || isBuffering(),
8164
+ playerBuffering: buffering.buffering.current,
8165
+ absoluteFrame,
8166
+ onlyWarnForMediaSeekingError,
8167
+ isPremounting,
8168
+ isPostmounting,
8169
+ pauseWhenBuffering
8170
+ });
8171
+ if (action.type === "none") {
8172
+ return;
8173
+ }
8174
+ if (action.type === "seek-due-to-shift") {
8085
8175
  lastSeek.current = seek({
8086
- mediaRef: mediaRef.current,
8087
- time: shouldBeTime,
8176
+ mediaRef: current,
8177
+ time: action.shouldBeTime,
8088
8178
  logLevel,
8089
- why: `because time shift is too big. shouldBeTime = ${shouldBeTime}, isTime = ${mediaTagTime}, requestVideoCallbackTime = ${rvcTime}, timeShift = ${timeShift}${isVariableFpsVideo ? ", isVariableFpsVideo = true" : ""}, isPremounting = ${isPremounting}, isPostmounting = ${isPostmounting}, pauseWhenBuffering = ${pauseWhenBuffering}`,
8179
+ why: action.why,
8090
8180
  mountTime
8091
8181
  });
8092
8182
  lastSeekDueToShift.current = lastSeek.current;
8093
- if (playing) {
8094
- if (playbackRate > 0) {
8095
- bufferUntilFirstFrame(shouldBeTime);
8096
- }
8097
- if (mediaRef.current.paused) {
8098
- playAndHandleNotAllowedError({
8099
- mediaRef,
8100
- mediaType,
8101
- onAutoPlayError,
8102
- logLevel,
8103
- mountTime,
8104
- reason: "player is playing but media tag is paused, and just seeked",
8105
- isPlayer: env.isPlayer
8106
- });
8107
- }
8108
- }
8109
- if (!onlyWarnForMediaSeekingError) {
8110
- warnAboutNonSeekableMedia(mediaRef.current, onlyWarnForMediaSeekingError ? "console-warning" : "console-error");
8183
+ if (action.bufferUntilFirstFrame) {
8184
+ bufferUntilFirstFrame(action.shouldBeTime);
8111
8185
  }
8112
- return;
8113
- }
8114
- const seekThreshold = playing ? 0.15 : 0.01;
8115
- const makesSenseToSeek = Math.abs(mediaRef.current.currentTime - shouldBeTime) > seekThreshold;
8116
- const isMediaTagBufferingOrStalled = isMediaTagBuffering || isBuffering();
8117
- const isSomethingElseBuffering = buffering.buffering.current && !isMediaTagBufferingOrStalled;
8118
- if (!playing || isSomethingElseBuffering) {
8119
- if (makesSenseToSeek) {
8120
- lastSeek.current = seek({
8121
- mediaRef: mediaRef.current,
8122
- time: shouldBeTime,
8186
+ if (action.playReason !== null) {
8187
+ playAndHandleNotAllowedError({
8188
+ mediaRef,
8189
+ mediaType,
8190
+ onAutoPlayError,
8123
8191
  logLevel,
8124
- why: `not playing or something else is buffering. time offset is over seek threshold (${seekThreshold})`,
8125
- mountTime
8192
+ mountTime,
8193
+ reason: action.playReason,
8194
+ isPlayer: env.isPlayer
8126
8195
  });
8127
8196
  }
8197
+ if (action.warnAboutNonSeekable) {
8198
+ warnAboutNonSeekableMedia(current, "console-error");
8199
+ }
8128
8200
  return;
8129
8201
  }
8130
- if (!playing || buffering.buffering.current) {
8131
- return;
8132
- }
8133
- const pausedCondition = mediaRef.current.paused && !mediaRef.current.ended;
8134
- const firstFrameCondition = absoluteFrame === 0;
8135
- if (pausedCondition || firstFrameCondition) {
8136
- const reason = pausedCondition ? "media tag is paused" : "absolute frame is 0";
8137
- if (makesSenseToSeek) {
8202
+ if (action.type === "seek-if-not-playing") {
8203
+ if (action.why !== null) {
8138
8204
  lastSeek.current = seek({
8139
- mediaRef: mediaRef.current,
8140
- time: shouldBeTime,
8205
+ mediaRef: current,
8206
+ time: action.shouldBeTime,
8141
8207
  logLevel,
8142
- why: `is over timeshift threshold (threshold = ${seekThreshold}) and ${reason}`,
8208
+ why: action.why,
8143
8209
  mountTime
8144
8210
  });
8145
8211
  }
8146
- playAndHandleNotAllowedError({
8147
- mediaRef,
8148
- mediaType,
8149
- onAutoPlayError,
8212
+ return;
8213
+ }
8214
+ if (action.why !== null) {
8215
+ lastSeek.current = seek({
8216
+ mediaRef: current,
8217
+ time: action.shouldBeTime,
8150
8218
  logLevel,
8151
- mountTime,
8152
- reason: `player is playing and ${reason}`,
8153
- isPlayer: env.isPlayer
8219
+ why: action.why,
8220
+ mountTime
8154
8221
  });
8155
- if (!isVariableFpsVideo && playbackRate > 0) {
8156
- bufferUntilFirstFrame(shouldBeTime);
8157
- }
8222
+ }
8223
+ playAndHandleNotAllowedError({
8224
+ mediaRef,
8225
+ mediaType,
8226
+ onAutoPlayError,
8227
+ logLevel,
8228
+ mountTime,
8229
+ reason: action.playReason,
8230
+ isPlayer: env.isPlayer
8231
+ });
8232
+ if (action.bufferUntilFirstFrame) {
8233
+ bufferUntilFirstFrame(action.shouldBeTime);
8158
8234
  }
8159
8235
  }, [
8160
8236
  absoluteFrame,
@@ -9320,8 +9396,8 @@ import {
9320
9396
  forwardRef as forwardRef10,
9321
9397
  useCallback as useCallback17,
9322
9398
  useContext as useContext32,
9323
- useEffect as useEffect17,
9324
9399
  useImperativeHandle as useImperativeHandle7,
9400
+ useLayoutEffect as useLayoutEffect10,
9325
9401
  useMemo as useMemo31,
9326
9402
  useRef as useRef23,
9327
9403
  useState as useState16
@@ -9409,6 +9485,18 @@ var loadImage = ({
9409
9485
  function exponentialBackoff(errorCount) {
9410
9486
  return 1000 * 2 ** (errorCount - 1);
9411
9487
  }
9488
+ var waitForNextFrame = ({
9489
+ onFrame
9490
+ }) => {
9491
+ if (typeof requestAnimationFrame === "undefined") {
9492
+ onFrame();
9493
+ return () => {
9494
+ return;
9495
+ };
9496
+ }
9497
+ const frame = requestAnimationFrame(onFrame);
9498
+ return () => cancelAnimationFrame(frame);
9499
+ };
9412
9500
  var CanvasImageContent = forwardRef10(({
9413
9501
  src,
9414
9502
  width,
@@ -9438,6 +9526,17 @@ var CanvasImageContent = forwardRef10(({
9438
9526
  overrideId: controls?.overrideId ?? null
9439
9527
  });
9440
9528
  const sequenceContext = useContext32(SequenceContext);
9529
+ const pendingLoadDelayRef = useRef23(null);
9530
+ const continuePendingLoadDelay = useCallback17(() => {
9531
+ const pending = pendingLoadDelayRef.current;
9532
+ if (!pending || pending.continued) {
9533
+ return;
9534
+ }
9535
+ pending.continued = true;
9536
+ pending.unblock();
9537
+ continueRender2(pending.handle);
9538
+ pendingLoadDelayRef.current = null;
9539
+ }, [continueRender2]);
9441
9540
  const sourceCanvas = useMemo31(() => {
9442
9541
  if (typeof document === "undefined") {
9443
9542
  return null;
@@ -9455,7 +9554,7 @@ var CanvasImageContent = forwardRef10(({
9455
9554
  ref.current = canvas;
9456
9555
  }
9457
9556
  }, [ref, refForOutline]);
9458
- useEffect17(() => {
9557
+ useLayoutEffect10(() => {
9459
9558
  const isPremounting = Boolean(sequenceContext?.premounting);
9460
9559
  const isPostmounting = Boolean(sequenceContext?.postmounting);
9461
9560
  const handle = delayRender2(`Rendering <CanvasImage> with src="${truncateSrcForLabel(actualSrc)}"`, {
@@ -9467,17 +9566,13 @@ var CanvasImageContent = forwardRef10(({
9467
9566
  };
9468
9567
  const controller = new AbortController;
9469
9568
  let cancelled = false;
9470
- let continued = false;
9471
9569
  let errorCount = 0;
9472
9570
  let timeoutId = null;
9473
9571
  setLoadedImage(null);
9474
- const continueRenderOnce = () => {
9475
- if (continued) {
9476
- return;
9477
- }
9478
- continued = true;
9479
- unblock();
9480
- continueRender2(handle);
9572
+ pendingLoadDelayRef.current = {
9573
+ handle,
9574
+ unblock,
9575
+ continued: false
9481
9576
  };
9482
9577
  const attemptLoad = () => {
9483
9578
  loadImage({ src: actualSrc, signal: controller.signal }).then((image) => {
@@ -9485,13 +9580,9 @@ var CanvasImageContent = forwardRef10(({
9485
9580
  return;
9486
9581
  }
9487
9582
  setLoadedImage(image);
9488
- }).then(() => {
9489
- if (!cancelled) {
9490
- continueRenderOnce();
9491
- }
9492
9583
  }).catch((err) => {
9493
9584
  if (err.name === "AbortError") {
9494
- continueRenderOnce();
9585
+ continuePendingLoadDelay();
9495
9586
  return;
9496
9587
  }
9497
9588
  errorCount++;
@@ -9505,7 +9596,7 @@ var CanvasImageContent = forwardRef10(({
9505
9596
  }, backoff);
9506
9597
  } else if (onError) {
9507
9598
  onError(err);
9508
- continueRenderOnce();
9599
+ continuePendingLoadDelay();
9509
9600
  } else {
9510
9601
  cancelRender2(err);
9511
9602
  }
@@ -9518,12 +9609,12 @@ var CanvasImageContent = forwardRef10(({
9518
9609
  clearTimeout(timeoutId);
9519
9610
  }
9520
9611
  controller.abort();
9521
- continueRenderOnce();
9612
+ continuePendingLoadDelay();
9522
9613
  };
9523
9614
  }, [
9524
9615
  actualSrc,
9525
9616
  cancelRender2,
9526
- continueRender2,
9617
+ continuePendingLoadDelay,
9527
9618
  delayPlayback,
9528
9619
  delayRender2,
9529
9620
  delayRenderRetries,
@@ -9534,13 +9625,16 @@ var CanvasImageContent = forwardRef10(({
9534
9625
  sequenceContext?.postmounting,
9535
9626
  sequenceContext?.premounting
9536
9627
  ]);
9537
- useEffect17(() => {
9628
+ useLayoutEffect10(() => {
9538
9629
  if (!loadedImage || !outputCanvas || !sourceCanvas) {
9539
9630
  return;
9540
9631
  }
9541
9632
  const handle = delayRender2(`Applying effects to <CanvasImage> with src="${truncateSrcForLabel(actualSrc)}"`);
9542
9633
  let cancelled = false;
9543
9634
  let continued = false;
9635
+ let cancelWaitForNextFrame = () => {
9636
+ return;
9637
+ };
9544
9638
  const continueRenderOnce = () => {
9545
9639
  if (continued) {
9546
9640
  return;
@@ -9575,7 +9669,15 @@ var CanvasImageContent = forwardRef10(({
9575
9669
  height: canvasHeight
9576
9670
  }).then((completed) => {
9577
9671
  if (completed && !cancelled) {
9578
- continueRenderOnce();
9672
+ cancelWaitForNextFrame = waitForNextFrame({
9673
+ onFrame: () => {
9674
+ if (cancelled) {
9675
+ return;
9676
+ }
9677
+ continueRenderOnce();
9678
+ continuePendingLoadDelay();
9679
+ }
9680
+ });
9579
9681
  }
9580
9682
  }).catch((err) => {
9581
9683
  if (cancelled) {
@@ -9584,12 +9686,14 @@ var CanvasImageContent = forwardRef10(({
9584
9686
  if (onError) {
9585
9687
  onError(err);
9586
9688
  continueRenderOnce();
9689
+ continuePendingLoadDelay();
9587
9690
  } else {
9588
9691
  cancelRender2(err);
9589
9692
  }
9590
9693
  });
9591
9694
  return () => {
9592
9695
  cancelled = true;
9696
+ cancelWaitForNextFrame();
9593
9697
  continueRenderOnce();
9594
9698
  };
9595
9699
  }, [
@@ -9597,6 +9701,7 @@ var CanvasImageContent = forwardRef10(({
9597
9701
  cancelRender2,
9598
9702
  chainState,
9599
9703
  continueRender2,
9704
+ continuePendingLoadDelay,
9600
9705
  delayRender2,
9601
9706
  fit,
9602
9707
  height,
@@ -9766,7 +9871,7 @@ var IFrameRefForwarding = ({
9766
9871
  };
9767
9872
  var IFrame = forwardRef11(IFrameRefForwarding);
9768
9873
  // src/Img.tsx
9769
- import { useCallback as useCallback19, useContext as useContext33, useLayoutEffect as useLayoutEffect10, useRef as useRef24 } from "react";
9874
+ import { useCallback as useCallback19, useContext as useContext33, useLayoutEffect as useLayoutEffect11, useRef as useRef24 } from "react";
9770
9875
  import { jsx as jsx28 } from "react/jsx-runtime";
9771
9876
  function exponentialBackoff2(errorCount) {
9772
9877
  return 1000 * 2 ** (errorCount - 1);
@@ -9843,7 +9948,7 @@ var ImgContent = ({
9843
9948
  if (typeof window !== "undefined") {
9844
9949
  const isPremounting = Boolean(sequenceContext?.premounting);
9845
9950
  const isPostmounting = Boolean(sequenceContext?.postmounting);
9846
- useLayoutEffect10(() => {
9951
+ useLayoutEffect11(() => {
9847
9952
  if (window.process?.env?.NODE_ENV === "test") {
9848
9953
  if (imageRef.current) {
9849
9954
  imageRef.current.src = actualSrc;
@@ -10813,8 +10918,8 @@ import { useCallback as useCallback24 } from "react";
10813
10918
  import {
10814
10919
  useCallback as useCallback22,
10815
10920
  useContext as useContext36,
10816
- useEffect as useEffect18,
10817
- useLayoutEffect as useLayoutEffect11,
10921
+ useEffect as useEffect17,
10922
+ useLayoutEffect as useLayoutEffect12,
10818
10923
  useMemo as useMemo35,
10819
10924
  useState as useState19
10820
10925
  } from "react";
@@ -10876,7 +10981,7 @@ var OffthreadVideoForRendering = ({
10876
10981
  mediaVolume: 1
10877
10982
  });
10878
10983
  warnAboutTooHighVolume(volume);
10879
- useEffect18(() => {
10984
+ useEffect17(() => {
10880
10985
  if (!src) {
10881
10986
  throw new Error("No src passed");
10882
10987
  }
@@ -10933,7 +11038,7 @@ var OffthreadVideoForRendering = ({
10933
11038
  }, [toneMapped, currentTime, src, transparent]);
10934
11039
  const [imageSrc, setImageSrc] = useState19(null);
10935
11040
  const { delayRender: delayRender2, continueRender: continueRender2 } = useDelayRender();
10936
- useLayoutEffect11(() => {
11041
+ useLayoutEffect12(() => {
10937
11042
  if (!window.remotion_videoEnabled) {
10938
11043
  return;
10939
11044
  }
@@ -11039,7 +11144,7 @@ import React37, {
11039
11144
  forwardRef as forwardRef13,
11040
11145
  useCallback as useCallback23,
11041
11146
  useContext as useContext37,
11042
- useEffect as useEffect20,
11147
+ useEffect as useEffect19,
11043
11148
  useImperativeHandle as useImperativeHandle9,
11044
11149
  useMemo as useMemo36,
11045
11150
  useRef as useRef27,
@@ -11047,12 +11152,12 @@ import React37, {
11047
11152
  } from "react";
11048
11153
 
11049
11154
  // src/video/emit-video-frame.ts
11050
- import { useEffect as useEffect19 } from "react";
11155
+ import { useEffect as useEffect18 } from "react";
11051
11156
  var useEmitVideoFrame = ({
11052
11157
  ref,
11053
11158
  onVideoFrame
11054
11159
  }) => {
11055
- useEffect19(() => {
11160
+ useEffect18(() => {
11056
11161
  const { current } = ref;
11057
11162
  if (!current) {
11058
11163
  return;
@@ -11231,7 +11336,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
11231
11336
  tag: "video",
11232
11337
  mountTime
11233
11338
  }));
11234
- useEffect20(() => {
11339
+ useEffect19(() => {
11235
11340
  const { current } = videoRef;
11236
11341
  if (!current) {
11237
11342
  return;
@@ -11274,7 +11379,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
11274
11379
  const currentOnDurationCallback = useRef27(onDuration);
11275
11380
  currentOnDurationCallback.current = onDuration;
11276
11381
  useEmitVideoFrame({ ref: videoRef, onVideoFrame });
11277
- useEffect20(() => {
11382
+ useEffect19(() => {
11278
11383
  const { current } = videoRef;
11279
11384
  if (!current) {
11280
11385
  return;
@@ -11291,7 +11396,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
11291
11396
  current.removeEventListener("loadedmetadata", onLoadedMetadata);
11292
11397
  };
11293
11398
  }, [src]);
11294
- useEffect20(() => {
11399
+ useEffect19(() => {
11295
11400
  const { current } = videoRef;
11296
11401
  if (!current) {
11297
11402
  return;
@@ -11974,6 +12079,7 @@ var Still = (props2) => {
11974
12079
  };
11975
12080
  return React42.createElement(Composition, newProps);
11976
12081
  };
12082
+ addSequenceStackTraces(Still);
11977
12083
  // src/video/html5-video.tsx
11978
12084
  import { forwardRef as forwardRef16, useCallback as useCallback25, useContext as useContext39 } from "react";
11979
12085
 
@@ -11981,9 +12087,9 @@ import { forwardRef as forwardRef16, useCallback as useCallback25, useContext as
11981
12087
  import {
11982
12088
  forwardRef as forwardRef15,
11983
12089
  useContext as useContext38,
11984
- useEffect as useEffect21,
12090
+ useEffect as useEffect20,
11985
12091
  useImperativeHandle as useImperativeHandle10,
11986
- useLayoutEffect as useLayoutEffect12,
12092
+ useLayoutEffect as useLayoutEffect13,
11987
12093
  useMemo as useMemo39,
11988
12094
  useRef as useRef28
11989
12095
  } from "react";
@@ -12158,7 +12264,7 @@ var VideoForRenderingForwardFunction = ({
12158
12264
  mediaVolume: 1
12159
12265
  });
12160
12266
  warnAboutTooHighVolume(volume);
12161
- useEffect21(() => {
12267
+ useEffect20(() => {
12162
12268
  if (!props2.src) {
12163
12269
  throw new Error("No src passed");
12164
12270
  }
@@ -12202,7 +12308,7 @@ var VideoForRenderingForwardFunction = ({
12202
12308
  return videoRef.current;
12203
12309
  }, []);
12204
12310
  useEmitVideoFrame({ ref: videoRef, onVideoFrame });
12205
- useEffect21(() => {
12311
+ useEffect20(() => {
12206
12312
  if (!window.remotion_videoEnabled) {
12207
12313
  return;
12208
12314
  }
@@ -12292,7 +12398,7 @@ var VideoForRenderingForwardFunction = ({
12292
12398
  ]);
12293
12399
  const { src } = props2;
12294
12400
  if (environment.isRendering) {
12295
- useLayoutEffect12(() => {
12401
+ useLayoutEffect13(() => {
12296
12402
  if (window.process?.env?.NODE_ENV === "test") {
12297
12403
  return;
12298
12404
  }
@@ -1,5 +1,5 @@
1
1
  // src/version.ts
2
- var VERSION = "4.0.485";
2
+ var VERSION = "4.0.487";
3
3
  export {
4
4
  VERSION
5
5
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
4
4
  },
5
5
  "name": "remotion",
6
- "version": "4.0.485",
6
+ "version": "4.0.487",
7
7
  "description": "Make videos programmatically",
8
8
  "main": "dist/cjs/index.js",
9
9
  "types": "dist/cjs/index.d.ts",
@@ -11,7 +11,7 @@
11
11
  "scripts": {
12
12
  "formatting": "oxfmt src --check",
13
13
  "format": "oxfmt src",
14
- "prepublishOnly": "bun ensure-correct-version.ts && cp ../../README.md .",
14
+ "prepublishOnly": "bun ensure-correct-version.ts && cp ../../README.md . && cp ../../LICENSE.md .",
15
15
  "lint": "eslint src",
16
16
  "test": "bun test src/test",
17
17
  "make": "tsgo -d && bun --env-file=../.env.bundle bundle.ts"
@@ -35,7 +35,7 @@
35
35
  "react-dom": "19.2.3",
36
36
  "webpack": "5.105.0",
37
37
  "zod": "4.3.6",
38
- "@remotion/eslint-config-internal": "4.0.485",
38
+ "@remotion/eslint-config-internal": "4.0.487",
39
39
  "eslint": "9.19.0",
40
40
  "@typescript/native-preview": "7.0.0-dev.20260217.1"
41
41
  },