remotion 4.0.23 → 4.0.25
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/dist/cjs/Composition.js +7 -6
- package/dist/cjs/ResolveCompositionConfig.js +3 -6
- package/dist/cjs/Sequence.js +3 -3
- package/dist/cjs/audio/Audio.js +7 -7
- package/dist/cjs/audio/AudioForDevelopment.js +1 -1
- package/dist/cjs/audio/AudioForRendering.js +1 -1
- package/dist/cjs/config/input-props.js +2 -3
- package/dist/cjs/delay-render.js +3 -3
- package/dist/cjs/get-remotion-environment.d.ts +10 -0
- package/dist/cjs/get-remotion-environment.js +46 -0
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/index.js +3 -1
- package/dist/cjs/internals.d.ts +1 -2
- package/dist/cjs/internals.js +2 -3
- package/dist/cjs/prefetch.js +2 -2
- package/dist/cjs/setup-env-variables.js +4 -4
- package/dist/cjs/use-media-in-timeline.js +3 -3
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/video/OffthreadVideo.js +3 -3
- package/dist/cjs/video/Video.js +3 -3
- package/dist/cjs/video/VideoForRendering.js +3 -3
- package/dist/esm/index.mjs +63 -54
- package/dist/esm/version.mjs +1 -1
- package/package.json +1 -1
- package/dist/cjs/AssetManager.d.ts +0 -11
- package/dist/cjs/AssetManager.js +0 -40
- package/dist/cjs/use-delay-render.d.ts +0 -7
- package/dist/cjs/use-delay-render.js +0 -16
package/dist/cjs/Composition.js
CHANGED
|
@@ -9,7 +9,8 @@ const CanUseRemotionHooks_js_1 = require("./CanUseRemotionHooks.js");
|
|
|
9
9
|
const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js");
|
|
10
10
|
const delay_render_js_1 = require("./delay-render.js");
|
|
11
11
|
const Folder_js_1 = require("./Folder.js");
|
|
12
|
-
const
|
|
12
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
13
|
+
const is_player_js_1 = require("./is-player.js");
|
|
13
14
|
const loading_indicator_js_1 = require("./loading-indicator.js");
|
|
14
15
|
const NativeLayers_js_1 = require("./NativeLayers.js");
|
|
15
16
|
const nonce_js_1 = require("./nonce.js");
|
|
@@ -36,11 +37,11 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
36
37
|
const video = (0, use_video_js_1.useVideo)();
|
|
37
38
|
const lazy = (0, use_lazy_component_js_1.useLazyComponent)(compProps);
|
|
38
39
|
const nonce = (0, nonce_js_1.useNonce)();
|
|
39
|
-
const
|
|
40
|
+
const isPlayer = (0, is_player_js_1.useIsPlayer)();
|
|
41
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
40
42
|
const canUseComposition = (0, react_1.useContext)(CanUseRemotionHooks_js_1.CanUseRemotionHooks);
|
|
41
43
|
if (canUseComposition) {
|
|
42
|
-
if (
|
|
43
|
-
environment === 'player-production') {
|
|
44
|
+
if (isPlayer) {
|
|
44
45
|
throw new Error('<Composition> was mounted inside the `component` that was passed to the <Player>. See https://remotion.dev/docs/wrong-composition-mount for help.');
|
|
45
46
|
}
|
|
46
47
|
throw new Error('<Composition> mounted inside another composition. See https://remotion.dev/docs/wrong-composition-mount for help.');
|
|
@@ -88,14 +89,14 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
88
89
|
compProps.calculateMetadata,
|
|
89
90
|
]);
|
|
90
91
|
const resolved = (0, ResolveCompositionConfig_js_1.useResolvedVideoConfig)(id);
|
|
91
|
-
if (environment
|
|
92
|
+
if (environment.isStudio && video && video.component === lazy) {
|
|
92
93
|
const Comp = lazy;
|
|
93
94
|
if (resolved === null || resolved.type !== 'success') {
|
|
94
95
|
return null;
|
|
95
96
|
}
|
|
96
97
|
return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(exports.ClipComposition, { children: (0, jsx_runtime_1.jsx)(CanUseRemotionHooks_js_1.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(loading_indicator_js_1.Loading, {}), children: (0, jsx_runtime_1.jsx)(Comp, { ...((_a = resolved.result.props) !== null && _a !== void 0 ? _a : {}) }) }) }) }), (0, portal_node_js_1.portalNode)());
|
|
97
98
|
}
|
|
98
|
-
if (environment
|
|
99
|
+
if (environment.isRendering && video && video.component === lazy) {
|
|
99
100
|
const Comp = lazy;
|
|
100
101
|
if (resolved === null || resolved.type !== 'success') {
|
|
101
102
|
return null;
|
|
@@ -6,7 +6,7 @@ const react_1 = require("react");
|
|
|
6
6
|
const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js");
|
|
7
7
|
const input_props_js_1 = require("./config/input-props.js");
|
|
8
8
|
const EditorProps_js_1 = require("./EditorProps.js");
|
|
9
|
-
const
|
|
9
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
10
10
|
const resolve_video_config_js_1 = require("./resolve-video-config.js");
|
|
11
11
|
exports.ResolveCompositionContext = (0, react_1.createContext)(null);
|
|
12
12
|
exports.resolveCompositionsRef = (0, react_1.createRef)();
|
|
@@ -35,9 +35,7 @@ const ResolveCompositionConfig = ({ children }) => {
|
|
|
35
35
|
if (currentCompositionMetadata) {
|
|
36
36
|
return controller;
|
|
37
37
|
}
|
|
38
|
-
const inputProps = typeof window === 'undefined' ||
|
|
39
|
-
(0, get_environment_js_1.getRemotionEnvironment)() === 'player-development' ||
|
|
40
|
-
(0, get_environment_js_1.getRemotionEnvironment)() === 'player-production'
|
|
38
|
+
const inputProps = typeof window === 'undefined' || (0, get_remotion_environment_js_1.getRemotionEnvironment)().isPlayer
|
|
41
39
|
? {}
|
|
42
40
|
: (_a = (0, input_props_js_1.getInputProps)()) !== null && _a !== void 0 ? _a : {};
|
|
43
41
|
const { signal } = controller;
|
|
@@ -192,8 +190,7 @@ const useResolvedVideoConfig = (preferredCompositionId) => {
|
|
|
192
190
|
...((_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {}),
|
|
193
191
|
...(selectedEditorProps !== null && selectedEditorProps !== void 0 ? selectedEditorProps : {}),
|
|
194
192
|
...(typeof window === 'undefined' ||
|
|
195
|
-
(0,
|
|
196
|
-
(0, get_environment_js_1.getRemotionEnvironment)() === 'player-production'
|
|
193
|
+
(0, get_remotion_environment_js_1.getRemotionEnvironment)().isPlayer
|
|
197
194
|
? {}
|
|
198
195
|
: (_d = (0, input_props_js_1.getInputProps)()) !== null && _d !== void 0 ? _d : {}),
|
|
199
196
|
},
|
package/dist/cjs/Sequence.js
CHANGED
|
@@ -4,7 +4,7 @@ exports.Sequence = void 0;
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const AbsoluteFill_js_1 = require("./AbsoluteFill.js");
|
|
7
|
-
const
|
|
7
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
8
8
|
const get_timeline_clip_name_js_1 = require("./get-timeline-clip-name.js");
|
|
9
9
|
const nonce_js_1 = require("./nonce.js");
|
|
10
10
|
const SequenceContext_js_1 = require("./SequenceContext.js");
|
|
@@ -20,7 +20,7 @@ const SequenceRefForwardingFunction = ({ from = 0, durationInFrames = Infinity,
|
|
|
20
20
|
? parentSequence.cumulatedFrom + parentSequence.relativeFrom
|
|
21
21
|
: 0;
|
|
22
22
|
const nonce = (0, nonce_js_1.useNonce)();
|
|
23
|
-
const environment = (0,
|
|
23
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
24
24
|
if (layout !== 'absolute-fill' && layout !== 'none') {
|
|
25
25
|
throw new TypeError(`The layout prop of <Sequence /> expects either "absolute-fill" or "none", but you passed: ${layout}`);
|
|
26
26
|
}
|
|
@@ -68,7 +68,7 @@ const SequenceRefForwardingFunction = ({ from = 0, durationInFrames = Infinity,
|
|
|
68
68
|
}, [children, name]);
|
|
69
69
|
(0, react_1.useEffect)(() => {
|
|
70
70
|
var _a;
|
|
71
|
-
if (environment
|
|
71
|
+
if (!environment.isStudio) {
|
|
72
72
|
return;
|
|
73
73
|
}
|
|
74
74
|
registerSequence({
|
package/dist/cjs/audio/Audio.js
CHANGED
|
@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const absolute_src_js_1 = require("../absolute-src.js");
|
|
7
7
|
const cancel_render_js_1 = require("../cancel-render.js");
|
|
8
|
-
const
|
|
8
|
+
const get_remotion_environment_js_1 = require("../get-remotion-environment.js");
|
|
9
9
|
const index_js_1 = require("../loop/index.js");
|
|
10
10
|
const Sequence_js_1 = require("../Sequence.js");
|
|
11
11
|
const use_video_config_js_1 = require("../use-video-config.js");
|
|
@@ -21,7 +21,7 @@ const AudioRefForwardingFunction = (props, ref) => {
|
|
|
21
21
|
const { startFrom, endAt, ...otherProps } = props;
|
|
22
22
|
const { loop, ...propsOtherThanLoop } = props;
|
|
23
23
|
const { fps } = (0, use_video_config_js_1.useVideoConfig)();
|
|
24
|
-
const environment = (0,
|
|
24
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
25
25
|
const { durations, setDurations } = (0, react_1.useContext)(duration_state_js_1.DurationsContext);
|
|
26
26
|
if (typeof props.src !== 'string') {
|
|
27
27
|
throw new TypeError(`The \`<Audio>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
|
|
@@ -45,19 +45,19 @@ const AudioRefForwardingFunction = (props, ref) => {
|
|
|
45
45
|
const duration = Math.floor(durations[(0, absolute_src_js_1.getAbsoluteSrc)(props.src)] * fps);
|
|
46
46
|
const playbackRate = (_a = props.playbackRate) !== null && _a !== void 0 ? _a : 1;
|
|
47
47
|
const actualDuration = duration / playbackRate;
|
|
48
|
-
return ((0, jsx_runtime_1.jsx)(index_js_1.Loop, { layout: "none", durationInFrames: Math.floor(actualDuration), children: (0, jsx_runtime_1.jsx)(exports.Audio, {
|
|
48
|
+
return ((0, jsx_runtime_1.jsx)(index_js_1.Loop, { layout: "none", durationInFrames: Math.floor(actualDuration), children: (0, jsx_runtime_1.jsx)(exports.Audio, { ...propsOtherThanLoop, ref: ref }) }));
|
|
49
49
|
}
|
|
50
50
|
if (typeof startFrom !== 'undefined' || typeof endAt !== 'undefined') {
|
|
51
51
|
(0, validate_start_from_props_js_1.validateStartFromProps)(startFrom, endAt);
|
|
52
52
|
const startFromFrameNo = startFrom !== null && startFrom !== void 0 ? startFrom : 0;
|
|
53
53
|
const endAtFrameNo = endAt !== null && endAt !== void 0 ? endAt : Infinity;
|
|
54
|
-
return ((0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: (0, jsx_runtime_1.jsx)(exports.Audio, { ...otherProps, ref: ref }) }));
|
|
54
|
+
return ((0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: (0, jsx_runtime_1.jsx)(exports.Audio, { _remotionInternalNeedsDurationCalculation: Boolean(loop), ...otherProps, ref: ref }) }));
|
|
55
55
|
}
|
|
56
56
|
(0, validate_media_props_js_1.validateMediaProps)(props, 'Audio');
|
|
57
|
-
if (environment
|
|
58
|
-
return ((0, jsx_runtime_1.jsx)(AudioForRendering_js_1.AudioForRendering, { onDuration: onDuration, ...props, ref: ref, onError: onError }));
|
|
57
|
+
if (environment.isRendering) {
|
|
58
|
+
return ((0, jsx_runtime_1.jsx)(AudioForRendering_js_1.AudioForRendering, { onDuration: onDuration, ...props, ref: ref, onError: onError, _remotionInternalNeedsDurationCalculation: Boolean(loop) }));
|
|
59
59
|
}
|
|
60
|
-
return ((0, jsx_runtime_1.jsx)(AudioForDevelopment_js_1.AudioForDevelopment, { shouldPreMountAudioTags: audioContext !== null && audioContext.numberOfAudioTags > 0, ...props, ref: ref, onError: onError, onDuration: onDuration }));
|
|
60
|
+
return ((0, jsx_runtime_1.jsx)(AudioForDevelopment_js_1.AudioForDevelopment, { shouldPreMountAudioTags: audioContext !== null && audioContext.numberOfAudioTags > 0, ...props, ref: ref, onError: onError, onDuration: onDuration, _remotionInternalNeedsDurationCalculation: Boolean(loop) }));
|
|
61
61
|
};
|
|
62
62
|
/**
|
|
63
63
|
* @description With this component, you can add audio to your video. All audio formats which are supported by Chromium are supported by the component.
|
|
@@ -21,7 +21,7 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
|
|
|
21
21
|
const [mediaVolume] = (0, volume_position_state_js_1.useMediaVolumeState)();
|
|
22
22
|
const [mediaMuted] = (0, volume_position_state_js_1.useMediaMutedState)();
|
|
23
23
|
const volumePropFrame = (0, use_audio_frame_js_1.useFrameForVolumeProp)();
|
|
24
|
-
const { volume, muted, playbackRate, shouldPreMountAudioTags, src, onDuration, acceptableTimeShiftInSeconds, ...nativeProps } = props;
|
|
24
|
+
const { volume, muted, playbackRate, shouldPreMountAudioTags, src, onDuration, acceptableTimeShiftInSeconds, _remotionInternalNeedsDurationCalculation, allowAmplificationDuringRender, ...nativeProps } = props;
|
|
25
25
|
if (!src) {
|
|
26
26
|
throw new TypeError("No 'src' was passed to <Audio>.");
|
|
27
27
|
}
|
|
@@ -25,7 +25,7 @@ const AudioForRenderingRefForwardingFunction = (props, ref) => {
|
|
|
25
25
|
var _a;
|
|
26
26
|
return `audio-${(0, random_js_1.random)((_a = props.src) !== null && _a !== void 0 ? _a : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}`;
|
|
27
27
|
}, [props.src, sequenceContext]);
|
|
28
|
-
const { volume: volumeProp, playbackRate, allowAmplificationDuringRender, onDuration, _remotionInternalNeedsDurationCalculation, ...nativeProps } = props;
|
|
28
|
+
const { volume: volumeProp, playbackRate, allowAmplificationDuringRender, onDuration, _remotionInternalNeedsDurationCalculation, acceptableTimeShiftInSeconds, ...nativeProps } = props;
|
|
29
29
|
const volume = (0, volume_prop_js_1.evaluateVolume)({
|
|
30
30
|
volume: volumeProp,
|
|
31
31
|
frame: volumePropFrame,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.getInputProps = void 0;
|
|
4
|
-
const
|
|
4
|
+
const get_remotion_environment_js_1 = require("../get-remotion-environment.js");
|
|
5
5
|
const input_props_serialization_js_1 = require("../input-props-serialization.js");
|
|
6
6
|
let didWarnSSRImport = false;
|
|
7
7
|
const warnOnceSSRImport = () => {
|
|
@@ -18,8 +18,7 @@ const getInputProps = () => {
|
|
|
18
18
|
warnOnceSSRImport();
|
|
19
19
|
return {};
|
|
20
20
|
}
|
|
21
|
-
if ((0,
|
|
22
|
-
(0, get_environment_js_1.getRemotionEnvironment)() === 'player-production') {
|
|
21
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isPlayer) {
|
|
23
22
|
throw new Error('You cannot call `getInputProps()` from a <Player>. Instead, the props are available as React props from component that you passed as `component` prop.');
|
|
24
23
|
}
|
|
25
24
|
const param = window.remotion_inputProps;
|
package/dist/cjs/delay-render.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.continueRender = exports.delayRender = exports.DELAY_RENDER_CALLSTACK_TOKEN = void 0;
|
|
4
|
-
const
|
|
4
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
5
5
|
const truthy_js_1 = require("./truthy.js");
|
|
6
6
|
if (typeof window !== 'undefined') {
|
|
7
7
|
window.remotion_renderReady = false;
|
|
@@ -27,7 +27,7 @@ const delayRender = (label) => {
|
|
|
27
27
|
const handle = Math.random();
|
|
28
28
|
handles.push(handle);
|
|
29
29
|
const called = (_b = (_a = Error().stack) === null || _a === void 0 ? void 0 : _a.replace(/^Error/g, '')) !== null && _b !== void 0 ? _b : '';
|
|
30
|
-
if ((0,
|
|
30
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isRendering) {
|
|
31
31
|
const timeoutToUse = typeof window === 'undefined'
|
|
32
32
|
? defaultTimeout
|
|
33
33
|
: ((_c = window.remotion_puppeteerTimeout) !== null && _c !== void 0 ? _c : defaultTimeout) - 2000;
|
|
@@ -70,7 +70,7 @@ const continueRender = (handle) => {
|
|
|
70
70
|
}
|
|
71
71
|
handles = handles.filter((h) => {
|
|
72
72
|
if (h === handle) {
|
|
73
|
-
if ((0,
|
|
73
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isRendering) {
|
|
74
74
|
clearTimeout(window.remotion_delayRenderTimeouts[handle].timeout);
|
|
75
75
|
delete window.remotion_delayRenderTimeouts[handle];
|
|
76
76
|
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export type RemotionEnvironment = {
|
|
2
|
+
isStudio: boolean;
|
|
3
|
+
isRendering: boolean;
|
|
4
|
+
isPlayer: boolean;
|
|
5
|
+
};
|
|
6
|
+
/**
|
|
7
|
+
* @description Provides information about the Remotion Environment
|
|
8
|
+
* @see [Documentation](https://www.remotion.dev/docs/get-remotion-environment)
|
|
9
|
+
*/
|
|
10
|
+
export declare const getRemotionEnvironment: () => RemotionEnvironment;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getRemotionEnvironment = void 0;
|
|
4
|
+
/**
|
|
5
|
+
* @description Provides information about the Remotion Environment
|
|
6
|
+
* @see [Documentation](https://www.remotion.dev/docs/get-remotion-environment)
|
|
7
|
+
*/
|
|
8
|
+
const getRemotionEnvironment = () => {
|
|
9
|
+
if (process.env.NODE_ENV === 'production') {
|
|
10
|
+
if (typeof window !== 'undefined' && window.remotion_isPlayer) {
|
|
11
|
+
return {
|
|
12
|
+
isStudio: false,
|
|
13
|
+
isRendering: false,
|
|
14
|
+
isPlayer: true,
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
return {
|
|
18
|
+
isStudio: false,
|
|
19
|
+
isRendering: true,
|
|
20
|
+
isPlayer: false,
|
|
21
|
+
};
|
|
22
|
+
}
|
|
23
|
+
// The Vitest framework sets NODE_ENV as test.
|
|
24
|
+
// Right now we don't need to treat it in a special
|
|
25
|
+
// way which is good - defaulting to `rendering`.
|
|
26
|
+
if (process.env.NODE_ENV === 'test') {
|
|
27
|
+
return {
|
|
28
|
+
isStudio: false,
|
|
29
|
+
isRendering: true,
|
|
30
|
+
isPlayer: false,
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
if (typeof window !== 'undefined' && window.remotion_isPlayer) {
|
|
34
|
+
return {
|
|
35
|
+
isStudio: false,
|
|
36
|
+
isRendering: false,
|
|
37
|
+
isPlayer: true,
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
return {
|
|
41
|
+
isStudio: true,
|
|
42
|
+
isRendering: false,
|
|
43
|
+
isPlayer: false,
|
|
44
|
+
};
|
|
45
|
+
};
|
|
46
|
+
exports.getRemotionEnvironment = getRemotionEnvironment;
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -72,6 +72,7 @@ export { continueRender, delayRender } from './delay-render.js';
|
|
|
72
72
|
export * from './easing.js';
|
|
73
73
|
export * from './Folder.js';
|
|
74
74
|
export * from './freeze.js';
|
|
75
|
+
export { getRemotionEnvironment } from './get-remotion-environment.js';
|
|
75
76
|
export { getStaticFiles, StaticFile } from './get-static-files.js';
|
|
76
77
|
export * from './IFrame.js';
|
|
77
78
|
export * from './Img.js';
|
package/dist/cjs/index.js
CHANGED
|
@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
14
14
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.Config = exports.Experimental = exports.useCurrentFrame = exports.staticFile = exports.Series = exports.Sequence = exports.registerRoot = exports.random = exports.prefetch = exports.Loop = exports.interpolate = exports.interpolateColors = exports.getStaticFiles = exports.delayRender = exports.continueRender = exports.getInputProps = exports.Composition = exports.cancelRender = void 0;
|
|
17
|
+
exports.Config = exports.Experimental = exports.useCurrentFrame = exports.staticFile = exports.Series = exports.Sequence = exports.registerRoot = exports.random = exports.prefetch = exports.Loop = exports.interpolate = exports.interpolateColors = exports.getStaticFiles = exports.getRemotionEnvironment = exports.delayRender = exports.continueRender = exports.getInputProps = exports.Composition = exports.cancelRender = void 0;
|
|
18
18
|
require("./asset-types.js");
|
|
19
19
|
const Clipper_js_1 = require("./Clipper.js");
|
|
20
20
|
const is_player_js_1 = require("./is-player.js");
|
|
@@ -35,6 +35,8 @@ Object.defineProperty(exports, "delayRender", { enumerable: true, get: function
|
|
|
35
35
|
__exportStar(require("./easing.js"), exports);
|
|
36
36
|
__exportStar(require("./Folder.js"), exports);
|
|
37
37
|
__exportStar(require("./freeze.js"), exports);
|
|
38
|
+
var get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
39
|
+
Object.defineProperty(exports, "getRemotionEnvironment", { enumerable: true, get: function () { return get_remotion_environment_js_1.getRemotionEnvironment; } });
|
|
38
40
|
var get_static_files_js_1 = require("./get-static-files.js");
|
|
39
41
|
Object.defineProperty(exports, "getStaticFiles", { enumerable: true, get: function () { return get_static_files_js_1.getStaticFiles; } });
|
|
40
42
|
__exportStar(require("./IFrame.js"), exports);
|
package/dist/cjs/internals.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { type CompProps } from './Composition.js';
|
|
|
3
3
|
import type { TCompMetadata, TComposition, TRenderAsset, TSequence } from './CompositionManager.js';
|
|
4
4
|
import type { CompositionManagerContext } from './CompositionManagerContext.js';
|
|
5
5
|
import * as CSSUtils from './default-css.js';
|
|
6
|
-
import type { RemotionEnvironment } from './get-environment.js';
|
|
6
|
+
import type { RemotionEnvironment } from './get-remotion-environment.js';
|
|
7
7
|
import type { SerializedJSONWithCustomFields } from './input-props-serialization.js';
|
|
8
8
|
import { processColor } from './interpolate-colors.js';
|
|
9
9
|
import type { SetTimelineContextValue, TimelineContextValue } from './timeline-position-state.js';
|
|
@@ -90,7 +90,6 @@ export declare const Internals: {
|
|
|
90
90
|
children?: import("react").ReactNode;
|
|
91
91
|
}>;
|
|
92
92
|
readonly useIsPlayer: () => boolean;
|
|
93
|
-
readonly useRemotionEnvironment: () => RemotionEnvironment;
|
|
94
93
|
readonly validateFrame: ({ allowFloats, durationInFrames, frame, }: {
|
|
95
94
|
frame: number;
|
|
96
95
|
durationInFrames: number;
|
package/dist/cjs/internals.js
CHANGED
|
@@ -32,8 +32,8 @@ const CompositionManagerContext_js_1 = require("./CompositionManagerContext.js")
|
|
|
32
32
|
const CSSUtils = __importStar(require("./default-css.js"));
|
|
33
33
|
const delay_render_js_1 = require("./delay-render.js");
|
|
34
34
|
const EditorProps_js_1 = require("./EditorProps.js");
|
|
35
|
-
const get_environment_js_1 = require("./get-environment.js");
|
|
36
35
|
const get_preview_dom_element_js_1 = require("./get-preview-dom-element.js");
|
|
36
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
37
37
|
const input_props_serialization_js_1 = require("./input-props-serialization.js");
|
|
38
38
|
const interpolate_colors_js_1 = require("./interpolate-colors.js");
|
|
39
39
|
const is_player_js_1 = require("./is-player.js");
|
|
@@ -91,7 +91,7 @@ exports.Internals = {
|
|
|
91
91
|
validateFps: validate_fps_js_1.validateFps,
|
|
92
92
|
validateDefaultAndInputProps: validate_default_props_js_1.validateDefaultAndInputProps,
|
|
93
93
|
validateDimension: validate_dimensions_js_1.validateDimension,
|
|
94
|
-
getRemotionEnvironment:
|
|
94
|
+
getRemotionEnvironment: get_remotion_environment_js_1.getRemotionEnvironment,
|
|
95
95
|
SharedAudioContext: shared_audio_tags_js_1.SharedAudioContext,
|
|
96
96
|
SharedAudioContextProvider: shared_audio_tags_js_1.SharedAudioContextProvider,
|
|
97
97
|
invalidCompositionErrorMessage: validate_composition_id_js_1.invalidCompositionErrorMessage,
|
|
@@ -107,7 +107,6 @@ exports.Internals = {
|
|
|
107
107
|
DurationsContextProvider: duration_state_js_1.DurationsContextProvider,
|
|
108
108
|
IsPlayerContextProvider: is_player_js_1.IsPlayerContextProvider,
|
|
109
109
|
useIsPlayer: is_player_js_1.useIsPlayer,
|
|
110
|
-
useRemotionEnvironment: get_environment_js_1.useRemotionEnvironment,
|
|
111
110
|
validateFrame: validate_frame_js_1.validateFrame,
|
|
112
111
|
EditorPropsProvider: EditorProps_js_1.EditorPropsProvider,
|
|
113
112
|
EditorPropsContext: EditorProps_js_1.EditorPropsContext,
|
package/dist/cjs/prefetch.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.prefetch = exports.usePreload = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
-
const
|
|
5
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
6
6
|
const prefetch_state_js_1 = require("./prefetch-state.js");
|
|
7
7
|
const usePreload = (src) => {
|
|
8
8
|
var _a;
|
|
@@ -30,7 +30,7 @@ const blobToBase64 = function (blob) {
|
|
|
30
30
|
const prefetch = (src, options) => {
|
|
31
31
|
var _a;
|
|
32
32
|
const method = (_a = options === null || options === void 0 ? void 0 : options.method) !== null && _a !== void 0 ? _a : 'blob-url';
|
|
33
|
-
if ((0,
|
|
33
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isRendering) {
|
|
34
34
|
return {
|
|
35
35
|
free: () => undefined,
|
|
36
36
|
waitUntilDone: () => Promise.resolve(src),
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.setupEnvVariables = void 0;
|
|
4
|
-
const
|
|
4
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
5
5
|
const getEnvVariables = () => {
|
|
6
|
-
if ((0,
|
|
6
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isRendering) {
|
|
7
7
|
const param = window.remotion_envVariables;
|
|
8
8
|
if (!param) {
|
|
9
9
|
return {};
|
|
10
10
|
}
|
|
11
11
|
return { ...JSON.parse(param), NODE_ENV: process.env.NODE_ENV };
|
|
12
12
|
}
|
|
13
|
-
if ((0,
|
|
14
|
-
// For the
|
|
13
|
+
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isStudio) {
|
|
14
|
+
// For the Studio, we already set the environment variables in index-html.ts.
|
|
15
15
|
// We just add NODE_ENV here.
|
|
16
16
|
return {
|
|
17
17
|
NODE_ENV: 'development',
|
|
@@ -4,7 +4,7 @@ exports.useMediaInTimeline = void 0;
|
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
const use_audio_frame_js_1 = require("./audio/use-audio-frame.js");
|
|
6
6
|
const get_asset_file_name_js_1 = require("./get-asset-file-name.js");
|
|
7
|
-
const
|
|
7
|
+
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
8
8
|
const nonce_js_1 = require("./nonce.js");
|
|
9
9
|
const play_and_handle_not_allowed_error_js_1 = require("./play-and-handle-not-allowed-error.js");
|
|
10
10
|
const SequenceContext_js_1 = require("./SequenceContext.js");
|
|
@@ -37,7 +37,7 @@ const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, pla
|
|
|
37
37
|
? Math.min(parentSequence.durationInFrames, videoConfig.durationInFrames)
|
|
38
38
|
: videoConfig.durationInFrames;
|
|
39
39
|
const doesVolumeChange = typeof volume === 'function';
|
|
40
|
-
const environment = (0,
|
|
40
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
41
41
|
const volumes = (0, react_1.useMemo)(() => {
|
|
42
42
|
if (typeof volume === 'number') {
|
|
43
43
|
return volume;
|
|
@@ -67,7 +67,7 @@ const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, pla
|
|
|
67
67
|
if (!src) {
|
|
68
68
|
throw new Error('No src passed');
|
|
69
69
|
}
|
|
70
|
-
if (environment
|
|
70
|
+
if (!environment.isStudio && process.env.NODE_ENV !== 'test') {
|
|
71
71
|
return;
|
|
72
72
|
}
|
|
73
73
|
registerSequence({
|
package/dist/cjs/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const VERSION = "4.0.
|
|
1
|
+
export declare const VERSION = "4.0.25";
|
package/dist/cjs/version.js
CHANGED
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.OffthreadVideo = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
|
-
const
|
|
6
|
+
const get_remotion_environment_js_1 = require("../get-remotion-environment.js");
|
|
7
7
|
const Sequence_js_1 = require("../Sequence.js");
|
|
8
8
|
const validate_media_props_js_1 = require("../validate-media-props.js");
|
|
9
9
|
const validate_start_from_props_js_1 = require("../validate-start-from-props.js");
|
|
@@ -17,7 +17,7 @@ const OffthreadVideo = (props) => {
|
|
|
17
17
|
// Should only destruct `startFrom` and `endAt` from props,
|
|
18
18
|
// rest gets drilled down
|
|
19
19
|
const { startFrom, endAt, ...otherProps } = props;
|
|
20
|
-
const environment = (0,
|
|
20
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
21
21
|
const onDuration = (0, react_1.useCallback)(() => undefined, []);
|
|
22
22
|
if (typeof props.src !== 'string') {
|
|
23
23
|
throw new TypeError(`The \`<OffthreadVideo>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
|
|
@@ -32,7 +32,7 @@ const OffthreadVideo = (props) => {
|
|
|
32
32
|
return ((0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: (0, jsx_runtime_1.jsx)(exports.OffthreadVideo, { ...otherProps }) }));
|
|
33
33
|
}
|
|
34
34
|
(0, validate_media_props_js_1.validateMediaProps)(props, 'Video');
|
|
35
|
-
if (environment
|
|
35
|
+
if (environment.isRendering) {
|
|
36
36
|
return (0, jsx_runtime_1.jsx)(OffthreadVideoForRendering_js_1.OffthreadVideoForRendering, { ...otherProps });
|
|
37
37
|
}
|
|
38
38
|
const { transparent, ...withoutTransparent } = otherProps;
|
package/dist/cjs/video/Video.js
CHANGED
|
@@ -4,7 +4,7 @@ exports.Video = void 0;
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const absolute_src_js_1 = require("../absolute-src.js");
|
|
7
|
-
const
|
|
7
|
+
const get_remotion_environment_js_1 = require("../get-remotion-environment.js");
|
|
8
8
|
const index_js_1 = require("../loop/index.js");
|
|
9
9
|
const Sequence_js_1 = require("../Sequence.js");
|
|
10
10
|
const use_video_config_js_1 = require("../use-video-config.js");
|
|
@@ -18,7 +18,7 @@ const VideoForwardingFunction = (props, ref) => {
|
|
|
18
18
|
const { startFrom, endAt, ...otherProps } = props;
|
|
19
19
|
const { loop, ...propsOtherThanLoop } = props;
|
|
20
20
|
const { fps } = (0, use_video_config_js_1.useVideoConfig)();
|
|
21
|
-
const environment = (0,
|
|
21
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
22
22
|
const { durations, setDurations } = (0, react_1.useContext)(duration_state_js_1.DurationsContext);
|
|
23
23
|
if (typeof ref === 'string') {
|
|
24
24
|
throw new Error('string refs are not supported');
|
|
@@ -42,7 +42,7 @@ const VideoForwardingFunction = (props, ref) => {
|
|
|
42
42
|
return ((0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: (0, jsx_runtime_1.jsx)(exports.Video, { ...otherProps, ref: ref }) }));
|
|
43
43
|
}
|
|
44
44
|
(0, validate_media_props_js_1.validateMediaProps)(props, 'Video');
|
|
45
|
-
if (environment
|
|
45
|
+
if (environment.isRendering) {
|
|
46
46
|
return ((0, jsx_runtime_1.jsx)(VideoForRendering_js_1.VideoForRendering, { onDuration: onDuration, ...otherProps, ref: ref }));
|
|
47
47
|
}
|
|
48
48
|
return ((0, jsx_runtime_1.jsx)(VideoForDevelopment_js_1.VideoForDevelopment, { onlyWarnForMediaSeekingError: false, ...otherProps, ref: ref, onDuration: onDuration }));
|
|
@@ -6,7 +6,7 @@ const react_1 = require("react");
|
|
|
6
6
|
const absolute_src_js_1 = require("../absolute-src.js");
|
|
7
7
|
const use_audio_frame_js_1 = require("../audio/use-audio-frame.js");
|
|
8
8
|
const delay_render_js_1 = require("../delay-render.js");
|
|
9
|
-
const
|
|
9
|
+
const get_remotion_environment_js_1 = require("../get-remotion-environment.js");
|
|
10
10
|
const is_approximately_the_same_js_1 = require("../is-approximately-the-same.js");
|
|
11
11
|
const random_js_1 = require("../random.js");
|
|
12
12
|
const RenderAssetManager_js_1 = require("../RenderAssetManager.js");
|
|
@@ -25,7 +25,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
|
|
|
25
25
|
const videoRef = (0, react_1.useRef)(null);
|
|
26
26
|
const sequenceContext = (0, react_1.useContext)(SequenceContext_js_1.SequenceContext);
|
|
27
27
|
const mediaStartsAt = (0, use_audio_frame_js_1.useMediaStartsAt)();
|
|
28
|
-
const environment = (0,
|
|
28
|
+
const environment = (0, get_remotion_environment_js_1.getRemotionEnvironment)();
|
|
29
29
|
const { registerRenderAsset, unregisterRenderAsset } = (0, react_1.useContext)(RenderAssetManager_js_1.RenderAssetManager);
|
|
30
30
|
// Generate a string that's as unique as possible for this asset
|
|
31
31
|
// but at the same time the same on all threads
|
|
@@ -175,7 +175,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
|
|
|
175
175
|
]);
|
|
176
176
|
const { src } = props;
|
|
177
177
|
// If video source switches, make new handle
|
|
178
|
-
if (environment
|
|
178
|
+
if (environment.isRendering) {
|
|
179
179
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
180
180
|
(0, react_1.useLayoutEffect)(() => {
|
|
181
181
|
if (process.env.NODE_ENV === 'test') {
|
package/dist/esm/index.mjs
CHANGED
|
@@ -59,7 +59,7 @@ function truthy(value) {
|
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
// Automatically generated on publish
|
|
62
|
-
const VERSION = '4.0.
|
|
62
|
+
const VERSION = '4.0.25';
|
|
63
63
|
|
|
64
64
|
const checkMultipleRemotionVersions = () => {
|
|
65
65
|
if (typeof globalThis === 'undefined') {
|
|
@@ -180,33 +180,47 @@ function cancelRender(err) {
|
|
|
180
180
|
throw error;
|
|
181
181
|
}
|
|
182
182
|
|
|
183
|
+
/**
|
|
184
|
+
* @description Provides information about the Remotion Environment
|
|
185
|
+
* @see [Documentation](https://www.remotion.dev/docs/get-remotion-environment)
|
|
186
|
+
*/
|
|
183
187
|
const getRemotionEnvironment = () => {
|
|
184
188
|
if (process.env.NODE_ENV === 'production') {
|
|
185
189
|
if (typeof window !== 'undefined' && window.remotion_isPlayer) {
|
|
186
|
-
return
|
|
190
|
+
return {
|
|
191
|
+
isStudio: false,
|
|
192
|
+
isRendering: false,
|
|
193
|
+
isPlayer: true,
|
|
194
|
+
};
|
|
187
195
|
}
|
|
188
|
-
return
|
|
196
|
+
return {
|
|
197
|
+
isStudio: false,
|
|
198
|
+
isRendering: true,
|
|
199
|
+
isPlayer: false,
|
|
200
|
+
};
|
|
189
201
|
}
|
|
190
202
|
// The Vitest framework sets NODE_ENV as test.
|
|
191
203
|
// Right now we don't need to treat it in a special
|
|
192
204
|
// way which is good - defaulting to `rendering`.
|
|
193
205
|
if (process.env.NODE_ENV === 'test') {
|
|
194
|
-
return
|
|
206
|
+
return {
|
|
207
|
+
isStudio: false,
|
|
208
|
+
isRendering: true,
|
|
209
|
+
isPlayer: false,
|
|
210
|
+
};
|
|
195
211
|
}
|
|
196
212
|
if (typeof window !== 'undefined' && window.remotion_isPlayer) {
|
|
197
|
-
return
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
const isPlayer = useIsPlayer();
|
|
203
|
-
if (isPlayer) {
|
|
204
|
-
if (process.env.NODE_ENV === 'production') {
|
|
205
|
-
return 'player-production';
|
|
206
|
-
}
|
|
207
|
-
return 'player-development';
|
|
213
|
+
return {
|
|
214
|
+
isStudio: false,
|
|
215
|
+
isRendering: false,
|
|
216
|
+
isPlayer: true,
|
|
217
|
+
};
|
|
208
218
|
}
|
|
209
|
-
return
|
|
219
|
+
return {
|
|
220
|
+
isStudio: true,
|
|
221
|
+
isRendering: false,
|
|
222
|
+
isPlayer: false,
|
|
223
|
+
};
|
|
210
224
|
};
|
|
211
225
|
|
|
212
226
|
const HIDDEN_NAMES = ['__WEBPACK_DEFAULT_EXPORT__'];
|
|
@@ -447,8 +461,7 @@ const getInputProps = () => {
|
|
|
447
461
|
warnOnceSSRImport();
|
|
448
462
|
return {};
|
|
449
463
|
}
|
|
450
|
-
if (getRemotionEnvironment()
|
|
451
|
-
getRemotionEnvironment() === 'player-production') {
|
|
464
|
+
if (getRemotionEnvironment().isPlayer) {
|
|
452
465
|
throw new Error('You cannot call `getInputProps()` from a <Player>. Instead, the props are available as React props from component that you passed as `component` prop.');
|
|
453
466
|
}
|
|
454
467
|
const param = window.remotion_inputProps;
|
|
@@ -640,9 +653,7 @@ const ResolveCompositionConfig = ({ children }) => {
|
|
|
640
653
|
if (currentCompositionMetadata) {
|
|
641
654
|
return controller;
|
|
642
655
|
}
|
|
643
|
-
const inputProps = typeof window === 'undefined' ||
|
|
644
|
-
getRemotionEnvironment() === 'player-development' ||
|
|
645
|
-
getRemotionEnvironment() === 'player-production'
|
|
656
|
+
const inputProps = typeof window === 'undefined' || getRemotionEnvironment().isPlayer
|
|
646
657
|
? {}
|
|
647
658
|
: (_a = getInputProps()) !== null && _a !== void 0 ? _a : {};
|
|
648
659
|
const { signal } = controller;
|
|
@@ -795,8 +806,7 @@ const useResolvedVideoConfig = (preferredCompositionId) => {
|
|
|
795
806
|
...((_c = composition.defaultProps) !== null && _c !== void 0 ? _c : {}),
|
|
796
807
|
...(selectedEditorProps !== null && selectedEditorProps !== void 0 ? selectedEditorProps : {}),
|
|
797
808
|
...(typeof window === 'undefined' ||
|
|
798
|
-
getRemotionEnvironment()
|
|
799
|
-
getRemotionEnvironment() === 'player-production'
|
|
809
|
+
getRemotionEnvironment().isPlayer
|
|
800
810
|
? {}
|
|
801
811
|
: (_d = getInputProps()) !== null && _d !== void 0 ? _d : {}),
|
|
802
812
|
},
|
|
@@ -974,7 +984,7 @@ const SequenceRefForwardingFunction = ({ from = 0, durationInFrames = Infinity,
|
|
|
974
984
|
? parentSequence.cumulatedFrom + parentSequence.relativeFrom
|
|
975
985
|
: 0;
|
|
976
986
|
const nonce = useNonce();
|
|
977
|
-
const environment =
|
|
987
|
+
const environment = getRemotionEnvironment();
|
|
978
988
|
if (layout !== 'absolute-fill' && layout !== 'none') {
|
|
979
989
|
throw new TypeError(`The layout prop of <Sequence /> expects either "absolute-fill" or "none", but you passed: ${layout}`);
|
|
980
990
|
}
|
|
@@ -1022,7 +1032,7 @@ const SequenceRefForwardingFunction = ({ from = 0, durationInFrames = Infinity,
|
|
|
1022
1032
|
}, [children, name]);
|
|
1023
1033
|
useEffect(() => {
|
|
1024
1034
|
var _a;
|
|
1025
|
-
if (environment
|
|
1035
|
+
if (!environment.isStudio) {
|
|
1026
1036
|
return;
|
|
1027
1037
|
}
|
|
1028
1038
|
registerSequence({
|
|
@@ -1259,7 +1269,7 @@ const blobToBase64 = function (blob) {
|
|
|
1259
1269
|
const prefetch = (src, options) => {
|
|
1260
1270
|
var _a;
|
|
1261
1271
|
const method = (_a = options === null || options === void 0 ? void 0 : options.method) !== null && _a !== void 0 ? _a : 'blob-url';
|
|
1262
|
-
if (getRemotionEnvironment()
|
|
1272
|
+
if (getRemotionEnvironment().isRendering) {
|
|
1263
1273
|
return {
|
|
1264
1274
|
free: () => undefined,
|
|
1265
1275
|
waitUntilDone: () => Promise.resolve(src),
|
|
@@ -1491,7 +1501,7 @@ const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, pla
|
|
|
1491
1501
|
? Math.min(parentSequence.durationInFrames, videoConfig.durationInFrames)
|
|
1492
1502
|
: videoConfig.durationInFrames;
|
|
1493
1503
|
const doesVolumeChange = typeof volume === 'function';
|
|
1494
|
-
const environment =
|
|
1504
|
+
const environment = getRemotionEnvironment();
|
|
1495
1505
|
const volumes = useMemo(() => {
|
|
1496
1506
|
if (typeof volume === 'number') {
|
|
1497
1507
|
return volume;
|
|
@@ -1521,7 +1531,7 @@ const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, pla
|
|
|
1521
1531
|
if (!src) {
|
|
1522
1532
|
throw new Error('No src passed');
|
|
1523
1533
|
}
|
|
1524
|
-
if (environment
|
|
1534
|
+
if (!environment.isStudio && process.env.NODE_ENV !== 'test') {
|
|
1525
1535
|
return;
|
|
1526
1536
|
}
|
|
1527
1537
|
registerSequence({
|
|
@@ -2204,7 +2214,7 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
|
|
|
2204
2214
|
const [mediaVolume] = useMediaVolumeState();
|
|
2205
2215
|
const [mediaMuted] = useMediaMutedState();
|
|
2206
2216
|
const volumePropFrame = useFrameForVolumeProp();
|
|
2207
|
-
const { volume, muted, playbackRate, shouldPreMountAudioTags, src, onDuration, acceptableTimeShiftInSeconds, ...nativeProps } = props;
|
|
2217
|
+
const { volume, muted, playbackRate, shouldPreMountAudioTags, src, onDuration, acceptableTimeShiftInSeconds, _remotionInternalNeedsDurationCalculation, allowAmplificationDuringRender, ...nativeProps } = props;
|
|
2208
2218
|
if (!src) {
|
|
2209
2219
|
throw new TypeError("No 'src' was passed to <Audio>.");
|
|
2210
2220
|
}
|
|
@@ -2307,7 +2317,7 @@ const delayRender = (label) => {
|
|
|
2307
2317
|
const handle = Math.random();
|
|
2308
2318
|
handles.push(handle);
|
|
2309
2319
|
const called = (_b = (_a = Error().stack) === null || _a === void 0 ? void 0 : _a.replace(/^Error/g, '')) !== null && _b !== void 0 ? _b : '';
|
|
2310
|
-
if (getRemotionEnvironment()
|
|
2320
|
+
if (getRemotionEnvironment().isRendering) {
|
|
2311
2321
|
const timeoutToUse = typeof window === 'undefined'
|
|
2312
2322
|
? defaultTimeout
|
|
2313
2323
|
: ((_c = window.remotion_puppeteerTimeout) !== null && _c !== void 0 ? _c : defaultTimeout) - 2000;
|
|
@@ -2349,7 +2359,7 @@ const continueRender = (handle) => {
|
|
|
2349
2359
|
}
|
|
2350
2360
|
handles = handles.filter((h) => {
|
|
2351
2361
|
if (h === handle) {
|
|
2352
|
-
if (getRemotionEnvironment()
|
|
2362
|
+
if (getRemotionEnvironment().isRendering) {
|
|
2353
2363
|
clearTimeout(window.remotion_delayRenderTimeouts[handle].timeout);
|
|
2354
2364
|
delete window.remotion_delayRenderTimeouts[handle];
|
|
2355
2365
|
}
|
|
@@ -2410,7 +2420,7 @@ const AudioForRenderingRefForwardingFunction = (props, ref) => {
|
|
|
2410
2420
|
var _a;
|
|
2411
2421
|
return `audio-${random((_a = props.src) !== null && _a !== void 0 ? _a : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}`;
|
|
2412
2422
|
}, [props.src, sequenceContext]);
|
|
2413
|
-
const { volume: volumeProp, playbackRate, allowAmplificationDuringRender, onDuration, _remotionInternalNeedsDurationCalculation, ...nativeProps } = props;
|
|
2423
|
+
const { volume: volumeProp, playbackRate, allowAmplificationDuringRender, onDuration, _remotionInternalNeedsDurationCalculation, acceptableTimeShiftInSeconds, ...nativeProps } = props;
|
|
2414
2424
|
const volume = evaluateVolume({
|
|
2415
2425
|
volume: volumeProp,
|
|
2416
2426
|
frame: volumePropFrame,
|
|
@@ -2505,7 +2515,7 @@ const AudioRefForwardingFunction = (props, ref) => {
|
|
|
2505
2515
|
const { startFrom, endAt, ...otherProps } = props;
|
|
2506
2516
|
const { loop, ...propsOtherThanLoop } = props;
|
|
2507
2517
|
const { fps } = useVideoConfig();
|
|
2508
|
-
const environment =
|
|
2518
|
+
const environment = getRemotionEnvironment();
|
|
2509
2519
|
const { durations, setDurations } = useContext(DurationsContext);
|
|
2510
2520
|
if (typeof props.src !== 'string') {
|
|
2511
2521
|
throw new TypeError(`The \`<Audio>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
|
|
@@ -2529,19 +2539,19 @@ const AudioRefForwardingFunction = (props, ref) => {
|
|
|
2529
2539
|
const duration = Math.floor(durations[getAbsoluteSrc(props.src)] * fps);
|
|
2530
2540
|
const playbackRate = (_a = props.playbackRate) !== null && _a !== void 0 ? _a : 1;
|
|
2531
2541
|
const actualDuration = duration / playbackRate;
|
|
2532
|
-
return (jsx(Loop, { layout: "none", durationInFrames: Math.floor(actualDuration), children: jsx(Audio, {
|
|
2542
|
+
return (jsx(Loop, { layout: "none", durationInFrames: Math.floor(actualDuration), children: jsx(Audio, { ...propsOtherThanLoop, ref: ref }) }));
|
|
2533
2543
|
}
|
|
2534
2544
|
if (typeof startFrom !== 'undefined' || typeof endAt !== 'undefined') {
|
|
2535
2545
|
validateStartFromProps(startFrom, endAt);
|
|
2536
2546
|
const startFromFrameNo = startFrom !== null && startFrom !== void 0 ? startFrom : 0;
|
|
2537
2547
|
const endAtFrameNo = endAt !== null && endAt !== void 0 ? endAt : Infinity;
|
|
2538
|
-
return (jsx(Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: jsx(Audio, { ...otherProps, ref: ref }) }));
|
|
2548
|
+
return (jsx(Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: jsx(Audio, { _remotionInternalNeedsDurationCalculation: Boolean(loop), ...otherProps, ref: ref }) }));
|
|
2539
2549
|
}
|
|
2540
2550
|
validateMediaProps(props, 'Audio');
|
|
2541
|
-
if (environment
|
|
2542
|
-
return (jsx(AudioForRendering, { onDuration: onDuration, ...props, ref: ref, onError: onError }));
|
|
2551
|
+
if (environment.isRendering) {
|
|
2552
|
+
return (jsx(AudioForRendering, { onDuration: onDuration, ...props, ref: ref, onError: onError, _remotionInternalNeedsDurationCalculation: Boolean(loop) }));
|
|
2543
2553
|
}
|
|
2544
|
-
return (jsx(AudioForDevelopment, { shouldPreMountAudioTags: audioContext !== null && audioContext.numberOfAudioTags > 0, ...props, ref: ref, onError: onError, onDuration: onDuration }));
|
|
2554
|
+
return (jsx(AudioForDevelopment, { shouldPreMountAudioTags: audioContext !== null && audioContext.numberOfAudioTags > 0, ...props, ref: ref, onError: onError, onDuration: onDuration, _remotionInternalNeedsDurationCalculation: Boolean(loop) }));
|
|
2545
2555
|
};
|
|
2546
2556
|
/**
|
|
2547
2557
|
* @description With this component, you can add audio to your video. All audio formats which are supported by Chromium are supported by the component.
|
|
@@ -2702,11 +2712,11 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
2702
2712
|
const video = useVideo();
|
|
2703
2713
|
const lazy = useLazyComponent(compProps);
|
|
2704
2714
|
const nonce = useNonce();
|
|
2705
|
-
const
|
|
2715
|
+
const isPlayer = useIsPlayer();
|
|
2716
|
+
const environment = getRemotionEnvironment();
|
|
2706
2717
|
const canUseComposition = useContext(CanUseRemotionHooks);
|
|
2707
2718
|
if (canUseComposition) {
|
|
2708
|
-
if (
|
|
2709
|
-
environment === 'player-production') {
|
|
2719
|
+
if (isPlayer) {
|
|
2710
2720
|
throw new Error('<Composition> was mounted inside the `component` that was passed to the <Player>. See https://remotion.dev/docs/wrong-composition-mount for help.');
|
|
2711
2721
|
}
|
|
2712
2722
|
throw new Error('<Composition> mounted inside another composition. See https://remotion.dev/docs/wrong-composition-mount for help.');
|
|
@@ -2754,14 +2764,14 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
2754
2764
|
compProps.calculateMetadata,
|
|
2755
2765
|
]);
|
|
2756
2766
|
const resolved = useResolvedVideoConfig(id);
|
|
2757
|
-
if (environment
|
|
2767
|
+
if (environment.isStudio && video && video.component === lazy) {
|
|
2758
2768
|
const Comp = lazy;
|
|
2759
2769
|
if (resolved === null || resolved.type !== 'success') {
|
|
2760
2770
|
return null;
|
|
2761
2771
|
}
|
|
2762
2772
|
return createPortal(jsx(ClipComposition, { children: jsx(CanUseRemotionHooksProvider, { children: jsx(Suspense, { fallback: jsx(Loading, {}), children: jsx(Comp, { ...((_a = resolved.result.props) !== null && _a !== void 0 ? _a : {}) }) }) }) }), portalNode());
|
|
2763
2773
|
}
|
|
2764
|
-
if (environment
|
|
2774
|
+
if (environment.isRendering && video && video.component === lazy) {
|
|
2765
2775
|
const Comp = lazy;
|
|
2766
2776
|
if (resolved === null || resolved.type !== 'success') {
|
|
2767
2777
|
return null;
|
|
@@ -3782,15 +3792,15 @@ const RemotionRoot = ({ children, numberOfAudioTags }) => {
|
|
|
3782
3792
|
};
|
|
3783
3793
|
|
|
3784
3794
|
const getEnvVariables = () => {
|
|
3785
|
-
if (getRemotionEnvironment()
|
|
3795
|
+
if (getRemotionEnvironment().isRendering) {
|
|
3786
3796
|
const param = window.remotion_envVariables;
|
|
3787
3797
|
if (!param) {
|
|
3788
3798
|
return {};
|
|
3789
3799
|
}
|
|
3790
3800
|
return { ...JSON.parse(param), NODE_ENV: process.env.NODE_ENV };
|
|
3791
3801
|
}
|
|
3792
|
-
if (getRemotionEnvironment()
|
|
3793
|
-
// For the
|
|
3802
|
+
if (getRemotionEnvironment().isStudio) {
|
|
3803
|
+
// For the Studio, we already set the environment variables in index-html.ts.
|
|
3794
3804
|
// We just add NODE_ENV here.
|
|
3795
3805
|
return {
|
|
3796
3806
|
NODE_ENV: 'development',
|
|
@@ -3917,7 +3927,6 @@ const Internals = {
|
|
|
3917
3927
|
DurationsContextProvider,
|
|
3918
3928
|
IsPlayerContextProvider,
|
|
3919
3929
|
useIsPlayer,
|
|
3920
|
-
useRemotionEnvironment,
|
|
3921
3930
|
validateFrame,
|
|
3922
3931
|
EditorPropsProvider,
|
|
3923
3932
|
EditorPropsContext,
|
|
@@ -4479,7 +4488,7 @@ const OffthreadVideo = (props) => {
|
|
|
4479
4488
|
// Should only destruct `startFrom` and `endAt` from props,
|
|
4480
4489
|
// rest gets drilled down
|
|
4481
4490
|
const { startFrom, endAt, ...otherProps } = props;
|
|
4482
|
-
const environment =
|
|
4491
|
+
const environment = getRemotionEnvironment();
|
|
4483
4492
|
const onDuration = useCallback(() => undefined, []);
|
|
4484
4493
|
if (typeof props.src !== 'string') {
|
|
4485
4494
|
throw new TypeError(`The \`<OffthreadVideo>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
|
|
@@ -4494,7 +4503,7 @@ const OffthreadVideo = (props) => {
|
|
|
4494
4503
|
return (jsx(Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: jsx(OffthreadVideo, { ...otherProps }) }));
|
|
4495
4504
|
}
|
|
4496
4505
|
validateMediaProps(props, 'Video');
|
|
4497
|
-
if (environment
|
|
4506
|
+
if (environment.isRendering) {
|
|
4498
4507
|
return jsx(OffthreadVideoForRendering, { ...otherProps });
|
|
4499
4508
|
}
|
|
4500
4509
|
const { transparent, ...withoutTransparent } = otherProps;
|
|
@@ -4509,7 +4518,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
|
|
|
4509
4518
|
const videoRef = useRef(null);
|
|
4510
4519
|
const sequenceContext = useContext(SequenceContext);
|
|
4511
4520
|
const mediaStartsAt = useMediaStartsAt();
|
|
4512
|
-
const environment =
|
|
4521
|
+
const environment = getRemotionEnvironment();
|
|
4513
4522
|
const { registerRenderAsset, unregisterRenderAsset } = useContext(RenderAssetManager);
|
|
4514
4523
|
// Generate a string that's as unique as possible for this asset
|
|
4515
4524
|
// but at the same time the same on all threads
|
|
@@ -4659,7 +4668,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
|
|
|
4659
4668
|
]);
|
|
4660
4669
|
const { src } = props;
|
|
4661
4670
|
// If video source switches, make new handle
|
|
4662
|
-
if (environment
|
|
4671
|
+
if (environment.isRendering) {
|
|
4663
4672
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
4664
4673
|
useLayoutEffect(() => {
|
|
4665
4674
|
if (process.env.NODE_ENV === 'test') {
|
|
@@ -4696,7 +4705,7 @@ const VideoForwardingFunction = (props, ref) => {
|
|
|
4696
4705
|
const { startFrom, endAt, ...otherProps } = props;
|
|
4697
4706
|
const { loop, ...propsOtherThanLoop } = props;
|
|
4698
4707
|
const { fps } = useVideoConfig();
|
|
4699
|
-
const environment =
|
|
4708
|
+
const environment = getRemotionEnvironment();
|
|
4700
4709
|
const { durations, setDurations } = useContext(DurationsContext);
|
|
4701
4710
|
if (typeof ref === 'string') {
|
|
4702
4711
|
throw new Error('string refs are not supported');
|
|
@@ -4720,7 +4729,7 @@ const VideoForwardingFunction = (props, ref) => {
|
|
|
4720
4729
|
return (jsx(Sequence, { layout: "none", from: 0 - startFromFrameNo, showInTimeline: false, durationInFrames: endAtFrameNo, children: jsx(Video, { ...otherProps, ref: ref }) }));
|
|
4721
4730
|
}
|
|
4722
4731
|
validateMediaProps(props, 'Video');
|
|
4723
|
-
if (environment
|
|
4732
|
+
if (environment.isRendering) {
|
|
4724
4733
|
return (jsx(VideoForRendering, { onDuration: onDuration, ...otherProps, ref: ref }));
|
|
4725
4734
|
}
|
|
4726
4735
|
return (jsx(VideoForDevelopment, { onlyWarnForMediaSeekingError: false, ...otherProps, ref: ref, onDuration: onDuration }));
|
|
@@ -4771,4 +4780,4 @@ const Config = new Proxy(proxyObj, {
|
|
|
4771
4780
|
},
|
|
4772
4781
|
});
|
|
4773
4782
|
|
|
4774
|
-
export { AbsoluteFill, Audio, Composition, Config, Easing, Experimental, Folder, FolderContext, Freeze, IFrame, Img, Internals, Loop, OffthreadVideo, Sequence, Series, Still, VERSION, Video, cancelRender, continueRender, delayRender, getInputProps, getStaticFiles, interpolate, interpolateColors, measureSpring, prefetch, random, registerRoot, spring, staticFile, useCurrentFrame, useVideoConfig };
|
|
4783
|
+
export { AbsoluteFill, Audio, Composition, Config, Easing, Experimental, Folder, FolderContext, Freeze, IFrame, Img, Internals, Loop, OffthreadVideo, Sequence, Series, Still, VERSION, Video, cancelRender, continueRender, delayRender, getInputProps, getRemotionEnvironment, getStaticFiles, interpolate, interpolateColors, measureSpring, prefetch, random, registerRoot, spring, staticFile, useCurrentFrame, useVideoConfig };
|
package/dist/esm/version.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import type { TAsset } from './CompositionManager.js';
|
|
3
|
-
export type AssetManagerContext = {
|
|
4
|
-
registerAsset: (asset: TAsset) => void;
|
|
5
|
-
unregisterAsset: (id: string) => void;
|
|
6
|
-
assets: TAsset[];
|
|
7
|
-
};
|
|
8
|
-
export declare const AssetManager: import("react").Context<AssetManagerContext>;
|
|
9
|
-
export declare const AssetManagerProvider: React.FC<{
|
|
10
|
-
children: React.ReactNode;
|
|
11
|
-
}>;
|
package/dist/cjs/AssetManager.js
DELETED
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.AssetManagerProvider = exports.AssetManager = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
exports.AssetManager = (0, react_1.createContext)({
|
|
7
|
-
registerAsset: () => undefined,
|
|
8
|
-
unregisterAsset: () => undefined,
|
|
9
|
-
assets: [],
|
|
10
|
-
});
|
|
11
|
-
const AssetManagerProvider = ({ children }) => {
|
|
12
|
-
const [assets, setAssets] = (0, react_1.useState)([]);
|
|
13
|
-
const registerAsset = (0, react_1.useCallback)((asset) => {
|
|
14
|
-
setAssets((assts) => {
|
|
15
|
-
return [...assts, asset];
|
|
16
|
-
});
|
|
17
|
-
}, []);
|
|
18
|
-
const unregisterAsset = (0, react_1.useCallback)((id) => {
|
|
19
|
-
setAssets((assts) => {
|
|
20
|
-
return assts.filter((a) => a.id !== id);
|
|
21
|
-
});
|
|
22
|
-
}, []);
|
|
23
|
-
(0, react_1.useLayoutEffect)(() => {
|
|
24
|
-
if (typeof window !== 'undefined') {
|
|
25
|
-
window.remotion_collectAssets = () => {
|
|
26
|
-
setAssets([]); // clear assets at next render
|
|
27
|
-
return assets;
|
|
28
|
-
};
|
|
29
|
-
}
|
|
30
|
-
}, [assets]);
|
|
31
|
-
const contextValue = (0, react_1.useMemo)(() => {
|
|
32
|
-
return {
|
|
33
|
-
registerAsset,
|
|
34
|
-
unregisterAsset,
|
|
35
|
-
assets,
|
|
36
|
-
};
|
|
37
|
-
}, [assets, registerAsset, unregisterAsset]);
|
|
38
|
-
return ((0, jsx_runtime_1.jsx)(exports.AssetManager.Provider, { value: contextValue, children: children }));
|
|
39
|
-
};
|
|
40
|
-
exports.AssetManagerProvider = AssetManagerProvider;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
type ContinueRenderFnBinded = () => void;
|
|
2
|
-
/**
|
|
3
|
-
* @description Same as delayRender(), but as a hook.
|
|
4
|
-
* @see [Documentation](https://remotion.dev/docs/use-delay-render)
|
|
5
|
-
*/
|
|
6
|
-
export declare const useDelayRender: (label?: string) => ContinueRenderFnBinded;
|
|
7
|
-
export {};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useDelayRender = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const delay_render_js_1 = require("./delay-render.js");
|
|
6
|
-
/**
|
|
7
|
-
* @description Same as delayRender(), but as a hook.
|
|
8
|
-
* @see [Documentation](https://remotion.dev/docs/use-delay-render)
|
|
9
|
-
*/
|
|
10
|
-
const useDelayRender = (label) => {
|
|
11
|
-
const [handle] = (0, react_1.useState)(() => (0, delay_render_js_1.delayRender)(label));
|
|
12
|
-
return (0, react_1.useCallback)(() => {
|
|
13
|
-
(0, delay_render_js_1.continueRender)(handle);
|
|
14
|
-
}, [handle]);
|
|
15
|
-
};
|
|
16
|
-
exports.useDelayRender = useDelayRender;
|