remotion 4.0.430 → 4.0.432
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.
- package/README.md +0 -1
- package/dist/cjs/Img.js +14 -5
- package/dist/cjs/RemotionRoot.d.ts +1 -0
- package/dist/cjs/RemotionRoot.js +2 -2
- package/dist/cjs/Sequence.js +3 -4
- package/dist/cjs/SequenceManager.d.ts +10 -5
- package/dist/cjs/SequenceManager.js +50 -18
- package/dist/cjs/TimelineContext.d.ts +1 -0
- package/dist/cjs/TimelineContext.js +15 -2
- package/dist/cjs/audio/shared-audio-tags.d.ts +20 -1
- package/dist/cjs/audio/shared-audio-tags.js +73 -0
- package/dist/cjs/get-effective-visual-mode-value.d.ts +7 -0
- package/dist/cjs/get-effective-visual-mode-value.js +19 -0
- package/dist/cjs/internals.d.ts +21 -3
- package/dist/cjs/internals.js +7 -1
- package/dist/cjs/sequence-field-schema.d.ts +3 -2
- package/dist/cjs/sequence-stack-traces.d.ts +0 -4
- package/dist/cjs/sequence-stack-traces.js +1 -4
- package/dist/cjs/timeline-position-state.d.ts +1 -0
- package/dist/cjs/timeline-position-state.js +11 -3
- package/dist/cjs/use-schema.d.ts +9 -2
- package/dist/cjs/use-schema.js +43 -14
- package/dist/cjs/use-sequence-control-override.js +1 -1
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/index.mjs +256 -77
- package/dist/esm/version.mjs +1 -1
- package/package.json +3 -3
package/dist/esm/index.mjs
CHANGED
|
@@ -61,7 +61,7 @@ function truthy(value) {
|
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
// src/version.ts
|
|
64
|
-
var VERSION = "4.0.
|
|
64
|
+
var VERSION = "4.0.432";
|
|
65
65
|
|
|
66
66
|
// src/multiple-versions-warning.ts
|
|
67
67
|
var checkMultipleRemotionVersions = () => {
|
|
@@ -258,6 +258,7 @@ __export(exports_timeline_position_state, {
|
|
|
258
258
|
useTimelineSetFrame: () => useTimelineSetFrame,
|
|
259
259
|
useTimelinePosition: () => useTimelinePosition,
|
|
260
260
|
usePlayingState: () => usePlayingState,
|
|
261
|
+
useAbsoluteTimelinePosition: () => useAbsoluteTimelinePosition,
|
|
261
262
|
persistCurrentFrame: () => persistCurrentFrame,
|
|
262
263
|
getInitialFrameState: () => getInitialFrameState,
|
|
263
264
|
getFrameForComposition: () => getFrameForComposition
|
|
@@ -701,9 +702,8 @@ var getFrameForComposition = (composition) => {
|
|
|
701
702
|
}
|
|
702
703
|
return window.remotion_initialFrame ?? 0;
|
|
703
704
|
};
|
|
704
|
-
var
|
|
705
|
+
var useTimelinePositionFromContext = (state) => {
|
|
705
706
|
const videoConfig = useVideo();
|
|
706
|
-
const state = useContext5(TimelineContext);
|
|
707
707
|
const env = useRemotionEnvironment();
|
|
708
708
|
if (!videoConfig) {
|
|
709
709
|
return typeof window === "undefined" ? 0 : window.remotion_initialFrame ?? 0;
|
|
@@ -711,6 +711,14 @@ var useTimelinePosition = () => {
|
|
|
711
711
|
const unclamped = state.frame[videoConfig.id] ?? (env.isPlayer ? 0 : getFrameForComposition(videoConfig.id));
|
|
712
712
|
return Math.min(videoConfig.durationInFrames - 1, unclamped);
|
|
713
713
|
};
|
|
714
|
+
var useTimelinePosition = () => {
|
|
715
|
+
const state = useContext5(TimelineContext);
|
|
716
|
+
return useTimelinePositionFromContext(state);
|
|
717
|
+
};
|
|
718
|
+
var useAbsoluteTimelinePosition = () => {
|
|
719
|
+
const state = useContext5(AbsoluteTimeContext);
|
|
720
|
+
return useTimelinePositionFromContext(state);
|
|
721
|
+
};
|
|
714
722
|
var useTimelineSetFrame = () => {
|
|
715
723
|
const { setFrame } = useContext5(SetTimelineContext);
|
|
716
724
|
return setFrame;
|
|
@@ -1018,6 +1026,19 @@ var TimelineContext = createContext9({
|
|
|
1018
1026
|
},
|
|
1019
1027
|
audioAndVideoTags: { current: [] }
|
|
1020
1028
|
});
|
|
1029
|
+
var AbsoluteTimeContext = createContext9({
|
|
1030
|
+
frame: {},
|
|
1031
|
+
playing: false,
|
|
1032
|
+
playbackRate: 1,
|
|
1033
|
+
rootId: "",
|
|
1034
|
+
imperativePlaying: {
|
|
1035
|
+
current: false
|
|
1036
|
+
},
|
|
1037
|
+
setPlaybackRate: () => {
|
|
1038
|
+
throw new Error("default");
|
|
1039
|
+
},
|
|
1040
|
+
audioAndVideoTags: { current: [] }
|
|
1041
|
+
});
|
|
1021
1042
|
var TimelineContextProvider = ({ children, frameState }) => {
|
|
1022
1043
|
const [playing, setPlaying] = useState2(false);
|
|
1023
1044
|
const imperativePlaying = useRef(false);
|
|
@@ -1070,11 +1091,14 @@ var TimelineContextProvider = ({ children, frameState }) => {
|
|
|
1070
1091
|
setPlaying
|
|
1071
1092
|
};
|
|
1072
1093
|
}, []);
|
|
1073
|
-
return /* @__PURE__ */ jsx4(
|
|
1094
|
+
return /* @__PURE__ */ jsx4(AbsoluteTimeContext.Provider, {
|
|
1074
1095
|
value: timelineContextValue,
|
|
1075
|
-
children: /* @__PURE__ */ jsx4(
|
|
1076
|
-
value:
|
|
1077
|
-
children
|
|
1096
|
+
children: /* @__PURE__ */ jsx4(TimelineContext.Provider, {
|
|
1097
|
+
value: timelineContextValue,
|
|
1098
|
+
children: /* @__PURE__ */ jsx4(SetTimelineContext.Provider, {
|
|
1099
|
+
value: setTimelineContextValue,
|
|
1100
|
+
children
|
|
1101
|
+
})
|
|
1078
1102
|
})
|
|
1079
1103
|
});
|
|
1080
1104
|
};
|
|
@@ -1288,22 +1312,28 @@ var SequenceVisibilityToggleContext = React8.createContext({
|
|
|
1288
1312
|
throw new Error("SequenceVisibilityToggle not initialized");
|
|
1289
1313
|
}
|
|
1290
1314
|
});
|
|
1291
|
-
var
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
throw new Error("
|
|
1315
|
+
var VisualModeOverridesContext = React8.createContext({
|
|
1316
|
+
dragOverrides: {},
|
|
1317
|
+
setDragOverrides: () => {
|
|
1318
|
+
throw new Error("VisualModeOverridesContext not initialized");
|
|
1295
1319
|
},
|
|
1296
|
-
|
|
1297
|
-
throw new Error("
|
|
1298
|
-
}
|
|
1320
|
+
clearDragOverrides: () => {
|
|
1321
|
+
throw new Error("VisualModeOverridesContext not initialized");
|
|
1322
|
+
},
|
|
1323
|
+
codeValues: {},
|
|
1324
|
+
setCodeValues: () => {
|
|
1325
|
+
throw new Error("VisualModeOverridesContext not initialized");
|
|
1326
|
+
},
|
|
1327
|
+
visualModeEnabled: false
|
|
1299
1328
|
});
|
|
1300
|
-
var SequenceManagerProvider = ({ children }) => {
|
|
1329
|
+
var SequenceManagerProvider = ({ children, visualModeEnabled }) => {
|
|
1301
1330
|
const [sequences, setSequences] = useState4([]);
|
|
1302
1331
|
const [hidden, setHidden] = useState4({});
|
|
1303
|
-
const [
|
|
1304
|
-
const controlOverridesRef = useRef3(
|
|
1305
|
-
controlOverridesRef.current =
|
|
1306
|
-
const
|
|
1332
|
+
const [dragOverrides, setControlOverrides] = useState4({});
|
|
1333
|
+
const controlOverridesRef = useRef3(dragOverrides);
|
|
1334
|
+
controlOverridesRef.current = dragOverrides;
|
|
1335
|
+
const [codeValues, setCodeValuesMapState] = useState4({});
|
|
1336
|
+
const setDragOverrides = useCallback3((sequenceId, key, value) => {
|
|
1307
1337
|
setControlOverrides((prev) => ({
|
|
1308
1338
|
...prev,
|
|
1309
1339
|
[sequenceId]: {
|
|
@@ -1312,7 +1342,7 @@ var SequenceManagerProvider = ({ children }) => {
|
|
|
1312
1342
|
}
|
|
1313
1343
|
}));
|
|
1314
1344
|
}, []);
|
|
1315
|
-
const
|
|
1345
|
+
const clearDragOverrides = useCallback3((sequenceId) => {
|
|
1316
1346
|
setControlOverrides((prev) => {
|
|
1317
1347
|
if (!prev[sequenceId]) {
|
|
1318
1348
|
return prev;
|
|
@@ -1322,6 +1352,22 @@ var SequenceManagerProvider = ({ children }) => {
|
|
|
1322
1352
|
return next;
|
|
1323
1353
|
});
|
|
1324
1354
|
}, []);
|
|
1355
|
+
const setCodeValues = useCallback3((sequenceId, values) => {
|
|
1356
|
+
setCodeValuesMapState((prev) => {
|
|
1357
|
+
if (prev[sequenceId] === values) {
|
|
1358
|
+
return prev;
|
|
1359
|
+
}
|
|
1360
|
+
if (values === null) {
|
|
1361
|
+
if (!(sequenceId in prev)) {
|
|
1362
|
+
return prev;
|
|
1363
|
+
}
|
|
1364
|
+
const next = { ...prev };
|
|
1365
|
+
delete next[sequenceId];
|
|
1366
|
+
return next;
|
|
1367
|
+
}
|
|
1368
|
+
return { ...prev, [sequenceId]: values };
|
|
1369
|
+
});
|
|
1370
|
+
}, []);
|
|
1325
1371
|
const registerSequence = useCallback3((seq) => {
|
|
1326
1372
|
setSequences((seqs) => {
|
|
1327
1373
|
return [...seqs, seq];
|
|
@@ -1345,16 +1391,26 @@ var SequenceManagerProvider = ({ children }) => {
|
|
|
1345
1391
|
}, [hidden]);
|
|
1346
1392
|
const overrideContext = useMemo9(() => {
|
|
1347
1393
|
return {
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1394
|
+
visualModeEnabled,
|
|
1395
|
+
dragOverrides,
|
|
1396
|
+
setDragOverrides,
|
|
1397
|
+
clearDragOverrides,
|
|
1398
|
+
codeValues,
|
|
1399
|
+
setCodeValues
|
|
1351
1400
|
};
|
|
1352
|
-
}, [
|
|
1401
|
+
}, [
|
|
1402
|
+
visualModeEnabled,
|
|
1403
|
+
dragOverrides,
|
|
1404
|
+
setDragOverrides,
|
|
1405
|
+
clearDragOverrides,
|
|
1406
|
+
codeValues,
|
|
1407
|
+
setCodeValues
|
|
1408
|
+
]);
|
|
1353
1409
|
return /* @__PURE__ */ jsx7(SequenceManager.Provider, {
|
|
1354
1410
|
value: sequenceContext,
|
|
1355
1411
|
children: /* @__PURE__ */ jsx7(SequenceVisibilityToggleContext.Provider, {
|
|
1356
1412
|
value: hiddenContext,
|
|
1357
|
-
children: /* @__PURE__ */ jsx7(
|
|
1413
|
+
children: /* @__PURE__ */ jsx7(VisualModeOverridesContext.Provider, {
|
|
1358
1414
|
value: overrideContext,
|
|
1359
1415
|
children
|
|
1360
1416
|
})
|
|
@@ -1524,7 +1580,8 @@ var RegularSequenceRefForwardingFunction = ({
|
|
|
1524
1580
|
};
|
|
1525
1581
|
var RegularSequence = forwardRef2(RegularSequenceRefForwardingFunction);
|
|
1526
1582
|
var PremountedPostmountedSequenceRefForwardingFunction = (props, ref) => {
|
|
1527
|
-
const
|
|
1583
|
+
const parentPremountContext = useContext13(PremountContext);
|
|
1584
|
+
const frame = useCurrentFrame() - parentPremountContext.premountFramesRemaining;
|
|
1528
1585
|
if (props.layout === "none") {
|
|
1529
1586
|
throw new Error('`<Sequence>` with `premountFor` and `postmountFor` props does not support layout="none"');
|
|
1530
1587
|
}
|
|
@@ -1558,9 +1615,8 @@ var PremountedPostmountedSequenceRefForwardingFunction = (props, ref) => {
|
|
|
1558
1615
|
styleWhilePremounted,
|
|
1559
1616
|
styleWhilePostmounted
|
|
1560
1617
|
]);
|
|
1561
|
-
const parentPremountContext = useContext13(PremountContext);
|
|
1562
1618
|
const { playing } = useContext13(TimelineContext);
|
|
1563
|
-
const premountFramesRemaining =
|
|
1619
|
+
const premountFramesRemaining = premountingActive ? from - frame : 0;
|
|
1564
1620
|
const premountContextValue = useMemo10(() => {
|
|
1565
1621
|
return {
|
|
1566
1622
|
premountFramesRemaining,
|
|
@@ -2811,6 +2867,63 @@ var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHin
|
|
|
2811
2867
|
latencyHint: audioLatencyHint,
|
|
2812
2868
|
audioEnabled
|
|
2813
2869
|
});
|
|
2870
|
+
const audioSyncAnchor = useMemo15(() => ({ value: 0 }), []);
|
|
2871
|
+
const prevEndTimes = useRef7({ scheduledEndTime: null, mediaEndTime: null });
|
|
2872
|
+
const scheduleAudioNode = useMemo15(() => {
|
|
2873
|
+
return ({
|
|
2874
|
+
node,
|
|
2875
|
+
mediaTimestamp,
|
|
2876
|
+
targetTime,
|
|
2877
|
+
currentTime,
|
|
2878
|
+
sequenceEndTime,
|
|
2879
|
+
sequenceStartTime,
|
|
2880
|
+
debugAudioScheduling
|
|
2881
|
+
}) => {
|
|
2882
|
+
if (!audioContext) {
|
|
2883
|
+
throw new Error("Audio context not found");
|
|
2884
|
+
}
|
|
2885
|
+
const bufferDuration = node.buffer?.duration ?? 0;
|
|
2886
|
+
const unclampedMediaEndTime = mediaTimestamp + bufferDuration;
|
|
2887
|
+
const needsTrimEnd = unclampedMediaEndTime > sequenceEndTime;
|
|
2888
|
+
const needsTrimStart = mediaTimestamp < sequenceStartTime;
|
|
2889
|
+
const offsetBecauseOfTrim = needsTrimStart ? sequenceStartTime - mediaTimestamp : 0;
|
|
2890
|
+
const offsetBecauseOfTooLate = targetTime < 0 ? -targetTime : 0;
|
|
2891
|
+
const offset = offsetBecauseOfTrim + offsetBecauseOfTooLate;
|
|
2892
|
+
const duration = needsTrimEnd ? bufferDuration - Math.max(0, unclampedMediaEndTime - sequenceEndTime) - offset : bufferDuration - offset;
|
|
2893
|
+
const scheduledTime = targetTime + currentTime + offset;
|
|
2894
|
+
if (offset < 0) {
|
|
2895
|
+
throw new Error("offset < 0: " + JSON.stringify({
|
|
2896
|
+
offset,
|
|
2897
|
+
targetTime,
|
|
2898
|
+
currentTime,
|
|
2899
|
+
offsetBecauseOfTrim,
|
|
2900
|
+
offsetBecauseOfTooLate
|
|
2901
|
+
}));
|
|
2902
|
+
}
|
|
2903
|
+
if (duration > 0) {
|
|
2904
|
+
node.start(scheduledTime, offset, duration);
|
|
2905
|
+
}
|
|
2906
|
+
const scheduledEndTime = scheduledTime + duration / node.playbackRate.value;
|
|
2907
|
+
const mediaTime = mediaTimestamp + offset;
|
|
2908
|
+
const mediaEndTime = mediaTime + duration;
|
|
2909
|
+
const latency = audioContext.baseLatency + audioContext.outputLatency;
|
|
2910
|
+
const timeDiff = scheduledTime - currentTime - latency;
|
|
2911
|
+
const prev = prevEndTimes.current;
|
|
2912
|
+
const scheduledMismatch = prev.scheduledEndTime !== null && Math.abs(scheduledTime - prev.scheduledEndTime) > 0.001;
|
|
2913
|
+
const mediaMismatch = prev.mediaEndTime !== null && Math.abs(mediaTime - prev.mediaEndTime) > 0.001;
|
|
2914
|
+
if (debugAudioScheduling) {
|
|
2915
|
+
Log.info({ logLevel, tag: "audio-scheduling" }, "scheduled %c%s%c %s %c%s%c %s %c%s%c %s %s %s", scheduledMismatch ? "color: red; font-weight: bold" : "", scheduledTime.toFixed(4), "", scheduledEndTime.toFixed(4), mediaMismatch ? "color: red; font-weight: bold" : "", mediaTime.toFixed(4), "", mediaEndTime.toFixed(4), duration < 0 ? "color: red; font-weight: bold" : timeDiff < 0 ? "color: red; font-weight: bold" : "color: blue; font-weight: bold", duration < 0 ? "missed " + Math.abs(offset).toFixed(2) + "s" : Math.abs(timeDiff).toFixed(2) + (timeDiff < 0 ? " delay" : " ahead"), "", "current=" + currentTime.toFixed(4), "offset=" + offset.toFixed(4), "latency=" + latency.toFixed(4), "state=" + audioContext.state);
|
|
2916
|
+
}
|
|
2917
|
+
prev.scheduledEndTime = scheduledEndTime;
|
|
2918
|
+
prev.mediaEndTime = mediaEndTime;
|
|
2919
|
+
return duration > 0 ? {
|
|
2920
|
+
type: "started",
|
|
2921
|
+
scheduledTime
|
|
2922
|
+
} : {
|
|
2923
|
+
type: "not-started"
|
|
2924
|
+
};
|
|
2925
|
+
};
|
|
2926
|
+
}, [audioContext, logLevel]);
|
|
2814
2927
|
const refs = useMemo15(() => {
|
|
2815
2928
|
return new Array(numberOfAudioTags).fill(true).map(() => {
|
|
2816
2929
|
const ref = createRef2();
|
|
@@ -2957,7 +3070,9 @@ var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHin
|
|
|
2957
3070
|
updateAudio,
|
|
2958
3071
|
playAllAudios,
|
|
2959
3072
|
numberOfAudioTags,
|
|
2960
|
-
audioContext
|
|
3073
|
+
audioContext,
|
|
3074
|
+
audioSyncAnchor,
|
|
3075
|
+
scheduleAudioNode
|
|
2961
3076
|
};
|
|
2962
3077
|
}, [
|
|
2963
3078
|
numberOfAudioTags,
|
|
@@ -2965,7 +3080,9 @@ var SharedAudioContextProvider = ({ children, numberOfAudioTags, audioLatencyHin
|
|
|
2965
3080
|
registerAudio,
|
|
2966
3081
|
unregisterAudio,
|
|
2967
3082
|
updateAudio,
|
|
2968
|
-
audioContext
|
|
3083
|
+
audioContext,
|
|
3084
|
+
audioSyncAnchor,
|
|
3085
|
+
scheduleAudioNode
|
|
2969
3086
|
]);
|
|
2970
3087
|
return /* @__PURE__ */ jsxs(SharedAudioContext.Provider, {
|
|
2971
3088
|
value,
|
|
@@ -5483,6 +5600,7 @@ var ImgRefForwarding = ({
|
|
|
5483
5600
|
imageRef.current.setAttribute("src", newSrc);
|
|
5484
5601
|
}, timeout);
|
|
5485
5602
|
}, []);
|
|
5603
|
+
const { delayRender: delayRender2, continueRender: continueRender2, cancelRender: cancelRender2 } = useDelayRender();
|
|
5486
5604
|
const didGetError = useCallback12((e) => {
|
|
5487
5605
|
if (!errors.current) {
|
|
5488
5606
|
return;
|
|
@@ -5498,9 +5616,10 @@ var ImgRefForwarding = ({
|
|
|
5498
5616
|
retryIn(backoff);
|
|
5499
5617
|
return;
|
|
5500
5618
|
}
|
|
5501
|
-
|
|
5502
|
-
|
|
5503
|
-
|
|
5619
|
+
try {
|
|
5620
|
+
cancelRender2("Error loading image with src: " + imageRef.current?.src);
|
|
5621
|
+
} catch {}
|
|
5622
|
+
}, [cancelRender2, maxRetries, onError, retryIn]);
|
|
5504
5623
|
if (typeof window !== "undefined") {
|
|
5505
5624
|
const isPremounting = Boolean(sequenceContext?.premounting);
|
|
5506
5625
|
const isPostmounting = Boolean(sequenceContext?.postmounting);
|
|
@@ -5545,7 +5664,7 @@ var ImgRefForwarding = ({
|
|
|
5545
5664
|
current.src = actualSrc;
|
|
5546
5665
|
current.decode().then(onComplete).catch((err) => {
|
|
5547
5666
|
console.warn(err);
|
|
5548
|
-
if (current.complete) {
|
|
5667
|
+
if (current.complete && current.naturalWidth > 0 && current.naturalHeight > 0) {
|
|
5549
5668
|
onComplete();
|
|
5550
5669
|
} else {
|
|
5551
5670
|
current.addEventListener("load", onComplete);
|
|
@@ -5763,6 +5882,28 @@ var makeDefaultPreviewCSS = (scope, backgroundColor) => {
|
|
|
5763
5882
|
`;
|
|
5764
5883
|
};
|
|
5765
5884
|
|
|
5885
|
+
// src/get-effective-visual-mode-value.ts
|
|
5886
|
+
var getEffectiveVisualModeValue = ({
|
|
5887
|
+
codeValue,
|
|
5888
|
+
runtimeValue,
|
|
5889
|
+
dragOverrideValue,
|
|
5890
|
+
defaultValue
|
|
5891
|
+
}) => {
|
|
5892
|
+
if (dragOverrideValue !== undefined) {
|
|
5893
|
+
return dragOverrideValue;
|
|
5894
|
+
}
|
|
5895
|
+
if (!codeValue) {
|
|
5896
|
+
return runtimeValue;
|
|
5897
|
+
}
|
|
5898
|
+
if (!codeValue.canUpdate) {
|
|
5899
|
+
return runtimeValue;
|
|
5900
|
+
}
|
|
5901
|
+
if (codeValue.codeValue === undefined) {
|
|
5902
|
+
return defaultValue;
|
|
5903
|
+
}
|
|
5904
|
+
return codeValue.codeValue;
|
|
5905
|
+
};
|
|
5906
|
+
|
|
5766
5907
|
// src/get-preview-dom-element.ts
|
|
5767
5908
|
var REMOTION_STUDIO_CONTAINER_ELEMENT = "__remotion-studio-container";
|
|
5768
5909
|
var getPreviewDomElement = () => {
|
|
@@ -5853,7 +5994,8 @@ var RemotionRootContexts = ({
|
|
|
5853
5994
|
videoEnabled,
|
|
5854
5995
|
audioEnabled,
|
|
5855
5996
|
frameState,
|
|
5856
|
-
nonceContextSeed
|
|
5997
|
+
nonceContextSeed,
|
|
5998
|
+
visualModeEnabled
|
|
5857
5999
|
}) => {
|
|
5858
6000
|
const nonceContext = useMemo27(() => {
|
|
5859
6001
|
let counter = 0;
|
|
@@ -5876,6 +6018,7 @@ var RemotionRootContexts = ({
|
|
|
5876
6018
|
children: /* @__PURE__ */ jsx27(EditorPropsProvider, {
|
|
5877
6019
|
children: /* @__PURE__ */ jsx27(PrefetchProvider, {
|
|
5878
6020
|
children: /* @__PURE__ */ jsx27(SequenceManagerProvider, {
|
|
6021
|
+
visualModeEnabled,
|
|
5879
6022
|
children: /* @__PURE__ */ jsx27(SharedAudioContextProvider, {
|
|
5880
6023
|
numberOfAudioTags,
|
|
5881
6024
|
audioLatencyHint,
|
|
@@ -6065,6 +6208,10 @@ var resolveVideoConfigOrCatch = (params) => {
|
|
|
6065
6208
|
}
|
|
6066
6209
|
};
|
|
6067
6210
|
|
|
6211
|
+
// src/sequence-stack-traces.ts
|
|
6212
|
+
import React27 from "react";
|
|
6213
|
+
var SequenceStackTracesUpdateContext = React27.createContext(() => {});
|
|
6214
|
+
|
|
6068
6215
|
// src/setup-env-variables.ts
|
|
6069
6216
|
var getEnvVariables = () => {
|
|
6070
6217
|
if (getRemotionEnvironment().isRendering) {
|
|
@@ -6093,8 +6240,8 @@ var setupEnvVariables = () => {
|
|
|
6093
6240
|
};
|
|
6094
6241
|
|
|
6095
6242
|
// src/use-current-scale.ts
|
|
6096
|
-
import
|
|
6097
|
-
var CurrentScaleContext =
|
|
6243
|
+
import React28, { createContext as createContext21 } from "react";
|
|
6244
|
+
var CurrentScaleContext = React28.createContext(null);
|
|
6098
6245
|
var PreviewSizeContext = createContext21({
|
|
6099
6246
|
setSize: () => {
|
|
6100
6247
|
return;
|
|
@@ -6119,8 +6266,8 @@ var calculateScale = ({
|
|
|
6119
6266
|
return Number(previewSize);
|
|
6120
6267
|
};
|
|
6121
6268
|
var useCurrentScale = (options) => {
|
|
6122
|
-
const hasContext =
|
|
6123
|
-
const zoomContext =
|
|
6269
|
+
const hasContext = React28.useContext(CurrentScaleContext);
|
|
6270
|
+
const zoomContext = React28.useContext(PreviewSizeContext);
|
|
6124
6271
|
const config = useUnsafeVideoConfig();
|
|
6125
6272
|
const env = useRemotionEnvironment();
|
|
6126
6273
|
if (hasContext === null || config === null || zoomContext === null) {
|
|
@@ -6166,37 +6313,65 @@ var useSchema = (schema, currentValue) => {
|
|
|
6166
6313
|
return earlyReturn;
|
|
6167
6314
|
}
|
|
6168
6315
|
const [overrideId] = useState17(() => String(Math.random()));
|
|
6169
|
-
const {
|
|
6170
|
-
|
|
6316
|
+
const {
|
|
6317
|
+
visualModeEnabled,
|
|
6318
|
+
dragOverrides: overrides,
|
|
6319
|
+
codeValues
|
|
6320
|
+
} = useContext32(VisualModeOverridesContext);
|
|
6321
|
+
const controls = useMemo28(() => {
|
|
6322
|
+
if (!visualModeEnabled) {
|
|
6323
|
+
return;
|
|
6324
|
+
}
|
|
6171
6325
|
if (schema === null || currentValue === null) {
|
|
6326
|
+
return;
|
|
6327
|
+
}
|
|
6328
|
+
return {
|
|
6329
|
+
schema,
|
|
6330
|
+
currentValue,
|
|
6331
|
+
overrideId
|
|
6332
|
+
};
|
|
6333
|
+
}, [schema, currentValue, overrideId, visualModeEnabled]);
|
|
6334
|
+
return useMemo28(() => {
|
|
6335
|
+
if (controls === undefined || currentValue === null || schema === null || !visualModeEnabled) {
|
|
6172
6336
|
return {
|
|
6173
6337
|
controls: undefined,
|
|
6174
6338
|
values: currentValue ?? {}
|
|
6175
6339
|
};
|
|
6176
6340
|
}
|
|
6177
6341
|
const overrideValues = overrides[overrideId] ?? {};
|
|
6178
|
-
const
|
|
6179
|
-
|
|
6180
|
-
|
|
6181
|
-
|
|
6182
|
-
|
|
6342
|
+
const propStatus = codeValues[overrideId];
|
|
6343
|
+
const currentValueKeys = Object.keys(currentValue);
|
|
6344
|
+
const keysToUpdate = new Set(currentValueKeys).values();
|
|
6345
|
+
const merged = {};
|
|
6346
|
+
for (const key of keysToUpdate) {
|
|
6347
|
+
const codeValueStatus = propStatus?.[key] ?? null;
|
|
6348
|
+
merged[key] = getEffectiveVisualModeValue({
|
|
6349
|
+
codeValue: codeValueStatus,
|
|
6350
|
+
runtimeValue: currentValue[key],
|
|
6351
|
+
dragOverrideValue: overrideValues[key],
|
|
6352
|
+
defaultValue: schema[key]?.default
|
|
6353
|
+
});
|
|
6183
6354
|
}
|
|
6184
6355
|
return {
|
|
6185
|
-
controls
|
|
6186
|
-
schema,
|
|
6187
|
-
currentValue,
|
|
6188
|
-
overrideId
|
|
6189
|
-
},
|
|
6356
|
+
controls,
|
|
6190
6357
|
values: merged
|
|
6191
6358
|
};
|
|
6192
|
-
}, [
|
|
6359
|
+
}, [
|
|
6360
|
+
controls,
|
|
6361
|
+
currentValue,
|
|
6362
|
+
overrideId,
|
|
6363
|
+
overrides,
|
|
6364
|
+
codeValues,
|
|
6365
|
+
schema,
|
|
6366
|
+
visualModeEnabled
|
|
6367
|
+
]);
|
|
6193
6368
|
};
|
|
6194
6369
|
|
|
6195
6370
|
// src/use-sequence-control-override.ts
|
|
6196
6371
|
import { useContext as useContext33 } from "react";
|
|
6197
6372
|
var useSequenceControlOverride = (key) => {
|
|
6198
6373
|
const seqContext = useContext33(SequenceContext);
|
|
6199
|
-
const { overrides } = useContext33(
|
|
6374
|
+
const { dragOverrides: overrides } = useContext33(VisualModeOverridesContext);
|
|
6200
6375
|
if (!seqContext) {
|
|
6201
6376
|
return;
|
|
6202
6377
|
}
|
|
@@ -6431,7 +6606,7 @@ var OffthreadVideoForRendering = ({
|
|
|
6431
6606
|
};
|
|
6432
6607
|
|
|
6433
6608
|
// src/video/VideoForPreview.tsx
|
|
6434
|
-
import
|
|
6609
|
+
import React30, {
|
|
6435
6610
|
forwardRef as forwardRef9,
|
|
6436
6611
|
useContext as useContext35,
|
|
6437
6612
|
useEffect as useEffect17,
|
|
@@ -6487,7 +6662,7 @@ var VideoForDevelopmentRefForwardingFunction = (props2, ref) => {
|
|
|
6487
6662
|
ref: videoRef
|
|
6488
6663
|
});
|
|
6489
6664
|
}, [context.audioContext]);
|
|
6490
|
-
const effectToUse =
|
|
6665
|
+
const effectToUse = React30.useInsertionEffect ?? React30.useLayoutEffect;
|
|
6491
6666
|
effectToUse(() => {
|
|
6492
6667
|
return () => {
|
|
6493
6668
|
requestAnimationFrame(() => {
|
|
@@ -6886,21 +7061,21 @@ var watchStaticFile = (fileName, callback) => {
|
|
|
6886
7061
|
};
|
|
6887
7062
|
|
|
6888
7063
|
// src/wrap-remotion-context.tsx
|
|
6889
|
-
import
|
|
7064
|
+
import React32, { useMemo as useMemo31 } from "react";
|
|
6890
7065
|
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
6891
7066
|
function useRemotionContexts() {
|
|
6892
|
-
const compositionManagerCtx =
|
|
6893
|
-
const timelineContext =
|
|
6894
|
-
const setTimelineContext =
|
|
6895
|
-
const sequenceContext =
|
|
6896
|
-
const nonceContext =
|
|
6897
|
-
const canUseRemotionHooksContext =
|
|
6898
|
-
const preloadContext =
|
|
6899
|
-
const resolveCompositionContext =
|
|
6900
|
-
const renderAssetManagerContext =
|
|
6901
|
-
const sequenceManagerContext =
|
|
6902
|
-
const bufferManagerContext =
|
|
6903
|
-
const logLevelContext =
|
|
7067
|
+
const compositionManagerCtx = React32.useContext(CompositionManager);
|
|
7068
|
+
const timelineContext = React32.useContext(TimelineContext);
|
|
7069
|
+
const setTimelineContext = React32.useContext(SetTimelineContext);
|
|
7070
|
+
const sequenceContext = React32.useContext(SequenceContext);
|
|
7071
|
+
const nonceContext = React32.useContext(NonceContext);
|
|
7072
|
+
const canUseRemotionHooksContext = React32.useContext(CanUseRemotionHooks);
|
|
7073
|
+
const preloadContext = React32.useContext(PreloadContext);
|
|
7074
|
+
const resolveCompositionContext = React32.useContext(ResolveCompositionContext);
|
|
7075
|
+
const renderAssetManagerContext = React32.useContext(RenderAssetManager);
|
|
7076
|
+
const sequenceManagerContext = React32.useContext(SequenceManager);
|
|
7077
|
+
const bufferManagerContext = React32.useContext(BufferingContextReact);
|
|
7078
|
+
const logLevelContext = React32.useContext(LogLevelContext);
|
|
6904
7079
|
return useMemo31(() => ({
|
|
6905
7080
|
compositionManagerCtx,
|
|
6906
7081
|
timelineContext,
|
|
@@ -6977,6 +7152,7 @@ var Internals = {
|
|
|
6977
7152
|
useUnsafeVideoConfig,
|
|
6978
7153
|
useFrameForVolumeProp,
|
|
6979
7154
|
useTimelinePosition,
|
|
7155
|
+
useAbsoluteTimelinePosition,
|
|
6980
7156
|
evaluateVolume,
|
|
6981
7157
|
getAbsoluteSrc,
|
|
6982
7158
|
Timeline: exports_timeline_position_state,
|
|
@@ -6986,8 +7162,9 @@ var Internals = {
|
|
|
6986
7162
|
VideoForPreview,
|
|
6987
7163
|
CompositionManager,
|
|
6988
7164
|
CompositionSetters,
|
|
6989
|
-
|
|
7165
|
+
VisualModeOverridesContext,
|
|
6990
7166
|
SequenceManager,
|
|
7167
|
+
SequenceStackTracesUpdateContext,
|
|
6991
7168
|
SequenceVisibilityToggleContext,
|
|
6992
7169
|
useSchema,
|
|
6993
7170
|
useSequenceControlOverride,
|
|
@@ -7071,7 +7248,9 @@ var Internals = {
|
|
|
7071
7248
|
TimelinePosition: exports_timeline_position_state,
|
|
7072
7249
|
DelayRenderContextType,
|
|
7073
7250
|
TimelineContext,
|
|
7074
|
-
|
|
7251
|
+
AbsoluteTimeContext,
|
|
7252
|
+
RenderAssetManagerProvider,
|
|
7253
|
+
getEffectiveVisualModeValue
|
|
7075
7254
|
};
|
|
7076
7255
|
// src/interpolate-colors.ts
|
|
7077
7256
|
var NUMBER = "[-+]?\\d*\\.?\\d+";
|
|
@@ -7440,11 +7619,11 @@ var validateFrame = ({
|
|
|
7440
7619
|
import { Children, forwardRef as forwardRef10, useMemo as useMemo32 } from "react";
|
|
7441
7620
|
|
|
7442
7621
|
// src/series/flatten-children.tsx
|
|
7443
|
-
import
|
|
7622
|
+
import React33 from "react";
|
|
7444
7623
|
var flattenChildren = (children) => {
|
|
7445
|
-
const childrenArray =
|
|
7624
|
+
const childrenArray = React33.Children.toArray(children);
|
|
7446
7625
|
return childrenArray.reduce((flatChildren, child) => {
|
|
7447
|
-
if (child.type ===
|
|
7626
|
+
if (child.type === React33.Fragment) {
|
|
7448
7627
|
return flatChildren.concat(flattenChildren(child.props.children));
|
|
7449
7628
|
}
|
|
7450
7629
|
flatChildren.push(child);
|
|
@@ -7453,7 +7632,7 @@ var flattenChildren = (children) => {
|
|
|
7453
7632
|
};
|
|
7454
7633
|
|
|
7455
7634
|
// src/series/is-inside-series.tsx
|
|
7456
|
-
import
|
|
7635
|
+
import React34, { createContext as createContext22 } from "react";
|
|
7457
7636
|
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
7458
7637
|
var IsInsideSeriesContext = createContext22(false);
|
|
7459
7638
|
var IsInsideSeriesContainer = ({ children }) => {
|
|
@@ -7469,7 +7648,7 @@ var IsNotInsideSeriesProvider = ({ children }) => {
|
|
|
7469
7648
|
});
|
|
7470
7649
|
};
|
|
7471
7650
|
var useRequireToBeInsideSeries = () => {
|
|
7472
|
-
const isInsideSeries =
|
|
7651
|
+
const isInsideSeries = React34.useContext(IsInsideSeriesContext);
|
|
7473
7652
|
if (!isInsideSeries) {
|
|
7474
7653
|
throw new Error("This component must be inside a <Series /> component.");
|
|
7475
7654
|
}
|
|
@@ -7884,14 +8063,14 @@ var staticFile = (path) => {
|
|
|
7884
8063
|
return preparsed;
|
|
7885
8064
|
};
|
|
7886
8065
|
// src/Still.tsx
|
|
7887
|
-
import
|
|
8066
|
+
import React36 from "react";
|
|
7888
8067
|
var Still = (props2) => {
|
|
7889
8068
|
const newProps = {
|
|
7890
8069
|
...props2,
|
|
7891
8070
|
durationInFrames: 1,
|
|
7892
8071
|
fps: 1
|
|
7893
8072
|
};
|
|
7894
|
-
return
|
|
8073
|
+
return React36.createElement(Composition, newProps);
|
|
7895
8074
|
};
|
|
7896
8075
|
// src/video/Video.tsx
|
|
7897
8076
|
import { forwardRef as forwardRef12, useCallback as useCallback16, useContext as useContext37 } from "react";
|
package/dist/esm/version.mjs
CHANGED
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.
|
|
6
|
+
"version": "4.0.432",
|
|
7
7
|
"description": "Make videos programmatically",
|
|
8
8
|
"main": "dist/cjs/index.js",
|
|
9
9
|
"types": "dist/cjs/index.d.ts",
|
|
@@ -35,9 +35,9 @@
|
|
|
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.
|
|
38
|
+
"@remotion/eslint-config-internal": "4.0.432",
|
|
39
39
|
"eslint": "9.19.0",
|
|
40
|
-
"@typescript/native-preview": "7.0.0-dev.
|
|
40
|
+
"@typescript/native-preview": "7.0.0-dev.20260301.1"
|
|
41
41
|
},
|
|
42
42
|
"keywords": [
|
|
43
43
|
"video",
|