remotion 4.0.273 → 4.0.274
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.d.ts +1 -1
- package/dist/cjs/Composition.js +17 -8
- package/dist/cjs/CompositionManager.d.ts +3 -1
- package/dist/cjs/CompositionManager.js +12 -12
- package/dist/cjs/CompositionManagerContext.d.ts +8 -5
- package/dist/cjs/CompositionManagerContext.js +8 -6
- package/dist/cjs/Folder.js +1 -1
- package/dist/cjs/RemotionRoot.d.ts +3 -0
- package/dist/cjs/RemotionRoot.js +2 -2
- package/dist/cjs/ResolveCompositionConfig.js +0 -3
- package/dist/cjs/RootLog.d.ts +1 -0
- package/dist/cjs/RootLog.js +8 -0
- package/dist/cjs/audio/Audio.d.ts +1 -1
- package/dist/cjs/delay-render.d.ts +1 -0
- package/dist/cjs/delay-render.js +13 -1
- package/dist/cjs/index.d.ts +19 -7
- package/dist/cjs/internals.d.ts +3 -0
- package/dist/cjs/internals.js +1 -0
- package/dist/cjs/no-react.d.ts +1 -0
- package/dist/cjs/no-react.js +1 -0
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/video/Video.d.ts +1 -1
- package/dist/esm/index.mjs +214 -180
- package/dist/esm/no-react.mjs +2 -0
- package/dist/esm/version.mjs +1 -1
- package/package.json +2 -2
|
@@ -52,5 +52,5 @@ export type CompositionProps<Schema extends AnyZodObject, Props extends Record<s
|
|
|
52
52
|
readonly id: string;
|
|
53
53
|
readonly schema?: Schema;
|
|
54
54
|
} & CompositionCalculateMetadataOrExplicit<Schema, Props> & CompProps<Props> & PropsIfHasProps<Schema, Props>;
|
|
55
|
-
export declare const Composition: <Schema extends AnyZodObject, Props extends Record<string, unknown>>(
|
|
55
|
+
export declare const Composition: <Schema extends AnyZodObject, Props extends Record<string, unknown>>(props: CompositionProps<Schema, Props>) => import("react/jsx-runtime.js").JSX.Element | null;
|
|
56
56
|
export {};
|
package/dist/cjs/Composition.js
CHANGED
|
@@ -26,13 +26,10 @@ const Fallback = () => {
|
|
|
26
26
|
}, []);
|
|
27
27
|
return null;
|
|
28
28
|
};
|
|
29
|
-
|
|
30
|
-
* @description This component is used to register a video to make it renderable and make it show in the sidebar, in dev mode.
|
|
31
|
-
* @see [Documentation](https://remotion.dev/docs/composition)
|
|
32
|
-
*/
|
|
33
|
-
const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, schema, ...compProps }) => {
|
|
29
|
+
const InnerComposition = ({ width, height, fps, durationInFrames, id, defaultProps, schema, ...compProps }) => {
|
|
34
30
|
var _a, _b;
|
|
35
|
-
const
|
|
31
|
+
const compManager = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionSetters);
|
|
32
|
+
const { registerComposition, unregisterComposition } = compManager;
|
|
36
33
|
const video = (0, use_video_js_1.useVideo)();
|
|
37
34
|
const lazy = (0, use_lazy_component_js_1.useLazyComponent)({
|
|
38
35
|
compProps: compProps,
|
|
@@ -83,13 +80,13 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
83
80
|
id,
|
|
84
81
|
folderName,
|
|
85
82
|
defaultProps,
|
|
86
|
-
registerComposition,
|
|
87
|
-
unregisterComposition,
|
|
88
83
|
width,
|
|
89
84
|
nonce,
|
|
90
85
|
parentName,
|
|
91
86
|
schema,
|
|
92
87
|
compProps.calculateMetadata,
|
|
88
|
+
registerComposition,
|
|
89
|
+
unregisterComposition,
|
|
93
90
|
]);
|
|
94
91
|
const resolved = (0, ResolveCompositionConfig_js_1.useResolvedVideoConfig)(id);
|
|
95
92
|
if (environment.isStudio && video && video.component === lazy) {
|
|
@@ -108,4 +105,16 @@ const Composition = ({ width, height, fps, durationInFrames, id, defaultProps, s
|
|
|
108
105
|
}
|
|
109
106
|
return null;
|
|
110
107
|
};
|
|
108
|
+
/*
|
|
109
|
+
* @description This component is used to register a video to make it renderable and make it show in the sidebar, in dev mode.
|
|
110
|
+
* @see [Documentation](https://remotion.dev/docs/composition)
|
|
111
|
+
*/
|
|
112
|
+
const Composition = (props) => {
|
|
113
|
+
const { onlyRenderComposition } = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionSetters);
|
|
114
|
+
if (onlyRenderComposition && onlyRenderComposition !== props.id) {
|
|
115
|
+
return null;
|
|
116
|
+
}
|
|
117
|
+
// @ts-expect-error
|
|
118
|
+
return (0, jsx_runtime_1.jsx)(InnerComposition, { ...props });
|
|
119
|
+
};
|
|
111
120
|
exports.Composition = Composition;
|
|
@@ -2,6 +2,7 @@ import type { ComponentType, LazyExoticComponent } from 'react';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { AnyZodObject } from 'zod';
|
|
4
4
|
import type { CalculateMetadataFunction } from './Composition.js';
|
|
5
|
+
import type { BaseMetadata } from './CompositionManagerContext.js';
|
|
5
6
|
import type { InferProps, PropsIfHasProps } from './props-if-has-props.js';
|
|
6
7
|
export type TComposition<Schema extends AnyZodObject, Props extends Record<string, unknown>> = {
|
|
7
8
|
width: number | undefined;
|
|
@@ -20,7 +21,6 @@ export type AnyComposition = TComposition<AnyZodObject, Record<string, unknown>>
|
|
|
20
21
|
export type TCompMetadataWithCalcFunction<Schema extends AnyZodObject, Props extends Record<string, unknown>> = Pick<TComposition<Schema, Props>, 'id' | 'height' | 'width' | 'fps' | 'durationInFrames' | 'defaultProps' | 'calculateMetadata'>;
|
|
21
22
|
export type TCompMetadata<Schema extends AnyZodObject, Props extends Record<string, unknown>> = Pick<TComposition<Schema, Props>, 'id' | 'height' | 'width' | 'fps' | 'durationInFrames' | 'defaultProps'>;
|
|
22
23
|
export type AnyCompMetadata = TCompMetadata<AnyZodObject, Record<string, unknown>>;
|
|
23
|
-
export type SmallTCompMetadata<T extends AnyZodObject, Props extends Record<string, unknown>> = Pick<TComposition<T, Props>, 'id' | 'height' | 'width' | 'fps' | 'durationInFrames'> & Partial<Pick<TComposition<T, Props>, 'defaultProps'>>;
|
|
24
24
|
type EnhancedTSequenceData = {
|
|
25
25
|
type: 'sequence';
|
|
26
26
|
} | {
|
|
@@ -83,5 +83,7 @@ export declare const compositionsRef: React.RefObject<{
|
|
|
83
83
|
export declare const CompositionManagerProvider: React.FC<{
|
|
84
84
|
readonly children: React.ReactNode;
|
|
85
85
|
readonly numberOfAudioTags: number;
|
|
86
|
+
readonly onlyRenderComposition: string | null;
|
|
87
|
+
readonly currentCompositionMetadata: BaseMetadata | null;
|
|
86
88
|
}>;
|
|
87
89
|
export {};
|
|
@@ -32,14 +32,13 @@ const ResolveCompositionConfig_js_1 = require("./ResolveCompositionConfig.js");
|
|
|
32
32
|
const SequenceManager_js_1 = require("./SequenceManager.js");
|
|
33
33
|
const shared_audio_tags_js_1 = require("./audio/shared-audio-tags.js");
|
|
34
34
|
exports.compositionsRef = react_1.default.createRef();
|
|
35
|
-
const CompositionManagerProvider = ({ children, numberOfAudioTags }) => {
|
|
35
|
+
const CompositionManagerProvider = ({ children, numberOfAudioTags, onlyRenderComposition, currentCompositionMetadata, }) => {
|
|
36
36
|
var _a;
|
|
37
37
|
// Wontfix, expected to have
|
|
38
38
|
const [compositions, setCompositions] = (0, react_1.useState)([]);
|
|
39
39
|
const currentcompositionsRef = (0, react_1.useRef)(compositions);
|
|
40
40
|
const [folders, setFolders] = (0, react_1.useState)([]);
|
|
41
41
|
const [canvasContent, setCanvasContent] = (0, react_1.useState)(null);
|
|
42
|
-
const [currentCompositionMetadata, setCurrentCompositionMetadata] = (0, react_1.useState)(null);
|
|
43
42
|
const updateCompositions = (0, react_1.useCallback)((updateComps) => {
|
|
44
43
|
setCompositions((comps) => {
|
|
45
44
|
const updated = updateComps(comps);
|
|
@@ -104,28 +103,29 @@ const CompositionManagerProvider = ({ children, numberOfAudioTags }) => {
|
|
|
104
103
|
const contextValue = (0, react_1.useMemo)(() => {
|
|
105
104
|
return {
|
|
106
105
|
compositions,
|
|
106
|
+
folders,
|
|
107
|
+
currentCompositionMetadata,
|
|
108
|
+
canvasContent,
|
|
109
|
+
};
|
|
110
|
+
}, [compositions, folders, currentCompositionMetadata, canvasContent]);
|
|
111
|
+
const setters = (0, react_1.useMemo)(() => {
|
|
112
|
+
return {
|
|
107
113
|
registerComposition,
|
|
108
114
|
unregisterComposition,
|
|
109
|
-
folders,
|
|
110
115
|
registerFolder,
|
|
111
116
|
unregisterFolder,
|
|
112
|
-
currentCompositionMetadata,
|
|
113
|
-
setCurrentCompositionMetadata,
|
|
114
|
-
canvasContent,
|
|
115
117
|
setCanvasContent,
|
|
116
118
|
updateCompositionDefaultProps,
|
|
119
|
+
onlyRenderComposition,
|
|
117
120
|
};
|
|
118
121
|
}, [
|
|
119
|
-
compositions,
|
|
120
122
|
registerComposition,
|
|
121
|
-
unregisterComposition,
|
|
122
|
-
folders,
|
|
123
123
|
registerFolder,
|
|
124
|
+
unregisterComposition,
|
|
124
125
|
unregisterFolder,
|
|
125
|
-
currentCompositionMetadata,
|
|
126
|
-
canvasContent,
|
|
127
126
|
updateCompositionDefaultProps,
|
|
127
|
+
onlyRenderComposition,
|
|
128
128
|
]);
|
|
129
|
-
return ((0, jsx_runtime_1.jsx)(CompositionManagerContext_js_1.CompositionManager.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)(SequenceManager_js_1.SequenceManagerProvider, { children: (0, jsx_runtime_1.jsx)(RenderAssetManager_js_1.RenderAssetManagerProvider, { children: (0, jsx_runtime_1.jsx)(ResolveCompositionConfig_js_1.ResolveCompositionConfig, { children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioContextProvider, { numberOfAudioTags: numberOfAudioTags, component: (_a = composition === null || composition === void 0 ? void 0 : composition.component) !== null && _a !== void 0 ? _a : null, children: children }) }) }) }) }));
|
|
129
|
+
return ((0, jsx_runtime_1.jsx)(CompositionManagerContext_js_1.CompositionManager.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)(CompositionManagerContext_js_1.CompositionSetters.Provider, { value: setters, children: (0, jsx_runtime_1.jsx)(SequenceManager_js_1.SequenceManagerProvider, { children: (0, jsx_runtime_1.jsx)(RenderAssetManager_js_1.RenderAssetManagerProvider, { children: (0, jsx_runtime_1.jsx)(ResolveCompositionConfig_js_1.ResolveCompositionConfig, { children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioContextProvider, { numberOfAudioTags: numberOfAudioTags, component: (_a = composition === null || composition === void 0 ? void 0 : composition.component) !== null && _a !== void 0 ? _a : null, children: children }) }) }) }) }) }));
|
|
130
130
|
};
|
|
131
131
|
exports.CompositionManagerProvider = CompositionManagerProvider;
|
|
@@ -14,17 +14,20 @@ export type CanvasContent = {
|
|
|
14
14
|
type: 'output';
|
|
15
15
|
path: string;
|
|
16
16
|
};
|
|
17
|
-
export type
|
|
18
|
-
compositions: AnyComposition[];
|
|
17
|
+
export type CompositionManagerSetters = {
|
|
19
18
|
registerComposition: <Schema extends AnyZodObject, Props extends Record<string, unknown>>(comp: TComposition<Schema, Props>) => void;
|
|
20
|
-
updateCompositionDefaultProps: (id: string, newDefaultProps: Record<string, unknown>) => void;
|
|
21
19
|
unregisterComposition: (name: string) => void;
|
|
22
20
|
registerFolder: (name: string, parent: string | null) => void;
|
|
23
21
|
unregisterFolder: (name: string, parent: string | null) => void;
|
|
24
|
-
|
|
22
|
+
setCanvasContent: React.Dispatch<React.SetStateAction<CanvasContent | null>>;
|
|
23
|
+
updateCompositionDefaultProps: (id: string, newDefaultProps: Record<string, unknown>) => void;
|
|
24
|
+
onlyRenderComposition: string | null;
|
|
25
|
+
};
|
|
26
|
+
export type CompositionManagerContext = {
|
|
27
|
+
compositions: AnyComposition[];
|
|
25
28
|
currentCompositionMetadata: BaseMetadata | null;
|
|
26
29
|
folders: TFolder[];
|
|
27
30
|
canvasContent: CanvasContent | null;
|
|
28
|
-
setCanvasContent: React.Dispatch<React.SetStateAction<CanvasContent | null>>;
|
|
29
31
|
};
|
|
30
32
|
export declare const CompositionManager: React.Context<CompositionManagerContext>;
|
|
33
|
+
export declare const CompositionSetters: React.Context<CompositionManagerSetters>;
|
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.CompositionManager = void 0;
|
|
3
|
+
exports.CompositionSetters = exports.CompositionManager = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
exports.CompositionManager = (0, react_1.createContext)({
|
|
6
6
|
compositions: [],
|
|
7
|
+
folders: [],
|
|
8
|
+
currentCompositionMetadata: null,
|
|
9
|
+
canvasContent: null,
|
|
10
|
+
});
|
|
11
|
+
exports.CompositionSetters = (0, react_1.createContext)({
|
|
7
12
|
registerComposition: () => undefined,
|
|
8
13
|
unregisterComposition: () => undefined,
|
|
9
14
|
registerFolder: () => undefined,
|
|
10
15
|
unregisterFolder: () => undefined,
|
|
11
|
-
setCurrentCompositionMetadata: () => undefined,
|
|
12
|
-
updateCompositionDefaultProps: () => undefined,
|
|
13
|
-
folders: [],
|
|
14
|
-
currentCompositionMetadata: null,
|
|
15
|
-
canvasContent: null,
|
|
16
16
|
setCanvasContent: () => undefined,
|
|
17
|
+
updateCompositionDefaultProps: () => undefined,
|
|
18
|
+
onlyRenderComposition: null,
|
|
17
19
|
});
|
package/dist/cjs/Folder.js
CHANGED
|
@@ -16,7 +16,7 @@ exports.FolderContext = (0, react_1.createContext)({
|
|
|
16
16
|
*/
|
|
17
17
|
const Folder = ({ name, children }) => {
|
|
18
18
|
const parent = (0, react_1.useContext)(exports.FolderContext);
|
|
19
|
-
const { registerFolder, unregisterFolder } = (0, react_1.useContext)(CompositionManagerContext_js_1.
|
|
19
|
+
const { registerFolder, unregisterFolder } = (0, react_1.useContext)(CompositionManagerContext_js_1.CompositionSetters);
|
|
20
20
|
(0, validate_folder_name_js_1.validateFolderName)(name);
|
|
21
21
|
const parentNameArr = [parent.parentName, parent.folderName].filter(truthy_js_1.truthy);
|
|
22
22
|
const parentName = parentNameArr.length === 0 ? null : parentNameArr.join('/');
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { BaseMetadata } from './CompositionManagerContext.js';
|
|
2
3
|
import type { LogLevel } from './log.js';
|
|
3
4
|
export declare const RemotionRoot: React.FC<{
|
|
4
5
|
readonly children: React.ReactNode;
|
|
5
6
|
readonly numberOfAudioTags: number;
|
|
6
7
|
readonly logLevel: LogLevel;
|
|
8
|
+
readonly onlyRenderComposition: string | null;
|
|
9
|
+
readonly currentCompositionMetadata: BaseMetadata | null;
|
|
7
10
|
}>;
|
package/dist/cjs/RemotionRoot.js
CHANGED
|
@@ -13,7 +13,7 @@ const prefetch_state_js_1 = require("./prefetch-state.js");
|
|
|
13
13
|
const random_js_1 = require("./random.js");
|
|
14
14
|
const timeline_position_state_js_1 = require("./timeline-position-state.js");
|
|
15
15
|
const duration_state_js_1 = require("./video/duration-state.js");
|
|
16
|
-
const RemotionRoot = ({ children, numberOfAudioTags, logLevel }) => {
|
|
16
|
+
const RemotionRoot = ({ children, numberOfAudioTags, logLevel, onlyRenderComposition, currentCompositionMetadata, }) => {
|
|
17
17
|
const [remotionRootId] = (0, react_1.useState)(() => String((0, random_js_1.random)(null)));
|
|
18
18
|
const [frame, setFrame] = (0, react_1.useState)(() => (0, timeline_position_state_js_1.getInitialFrameState)());
|
|
19
19
|
const [playing, setPlaying] = (0, react_1.useState)(false);
|
|
@@ -90,6 +90,6 @@ const RemotionRoot = ({ children, numberOfAudioTags, logLevel }) => {
|
|
|
90
90
|
const logging = (0, react_1.useMemo)(() => {
|
|
91
91
|
return { logLevel, mountTime: Date.now() };
|
|
92
92
|
}, [logLevel]);
|
|
93
|
-
return ((0, jsx_runtime_1.jsx)(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: (0, jsx_runtime_1.jsx)(nonce_js_1.NonceContext.Provider, { value: nonceContext, children: (0, jsx_runtime_1.jsx)(timeline_position_state_js_1.TimelineContext.Provider, { value: timelineContextValue, children: (0, jsx_runtime_1.jsx)(timeline_position_state_js_1.SetTimelineContext.Provider, { value: setTimelineContextValue, children: (0, jsx_runtime_1.jsx)(EditorProps_js_1.EditorPropsProvider, { children: (0, jsx_runtime_1.jsx)(prefetch_state_js_1.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(CompositionManager_js_1.CompositionManagerProvider, { numberOfAudioTags: numberOfAudioTags, children: (0, jsx_runtime_1.jsx)(duration_state_js_1.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(buffering_js_1.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }));
|
|
93
|
+
return ((0, jsx_runtime_1.jsx)(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: (0, jsx_runtime_1.jsx)(nonce_js_1.NonceContext.Provider, { value: nonceContext, children: (0, jsx_runtime_1.jsx)(timeline_position_state_js_1.TimelineContext.Provider, { value: timelineContextValue, children: (0, jsx_runtime_1.jsx)(timeline_position_state_js_1.SetTimelineContext.Provider, { value: setTimelineContextValue, children: (0, jsx_runtime_1.jsx)(EditorProps_js_1.EditorPropsProvider, { children: (0, jsx_runtime_1.jsx)(prefetch_state_js_1.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(CompositionManager_js_1.CompositionManagerProvider, { numberOfAudioTags: numberOfAudioTags, onlyRenderComposition: onlyRenderComposition, currentCompositionMetadata: currentCompositionMetadata, children: (0, jsx_runtime_1.jsx)(duration_state_js_1.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(buffering_js_1.BufferingProvider, { children: children }) }) }) }) }) }) }) }) }));
|
|
94
94
|
};
|
|
95
95
|
exports.RemotionRoot = RemotionRoot;
|
|
@@ -317,10 +317,7 @@ const useResolvedVideoConfig = (preferredCompositionId) => {
|
|
|
317
317
|
result: {
|
|
318
318
|
...currentCompositionMetadata,
|
|
319
319
|
id: composition.id,
|
|
320
|
-
props: currentCompositionMetadata.props,
|
|
321
320
|
defaultProps: (_a = composition.defaultProps) !== null && _a !== void 0 ? _a : {},
|
|
322
|
-
defaultCodec: currentCompositionMetadata.defaultCodec,
|
|
323
|
-
defaultOutName: currentCompositionMetadata.defaultOutName,
|
|
324
321
|
},
|
|
325
322
|
};
|
|
326
323
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const RootLog: () => null;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { RemotionMainAudioProps } from './props.js';
|
|
3
|
-
export declare const Audio: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>, "nonce" | "onEnded" | "onResize" | "onResizeCapture" | "
|
|
3
|
+
export declare const Audio: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>, "nonce" | "onEnded" | "onResize" | "onResizeCapture" | "autoPlay" | "controls"> & {
|
|
4
4
|
name?: string;
|
|
5
5
|
volume?: import("../volume-prop.js").VolumeProp;
|
|
6
6
|
playbackRate?: number;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export declare const DELAY_RENDER_CALLSTACK_TOKEN = "The delayRender was called:";
|
|
2
2
|
export declare const DELAY_RENDER_RETRIES_LEFT = "Retries left: ";
|
|
3
3
|
export declare const DELAY_RENDER_RETRY_TOKEN = "- Rendering the frame will be retried.";
|
|
4
|
+
export declare const DELAY_RENDER_CLEAR_TOKEN = "handle was cleared after";
|
|
4
5
|
export type DelayRenderOptions = {
|
|
5
6
|
timeoutInMilliseconds?: number;
|
|
6
7
|
retries?: number;
|
package/dist/cjs/delay-render.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.continueRender = exports.delayRender = exports.DELAY_RENDER_RETRY_TOKEN = exports.DELAY_RENDER_RETRIES_LEFT = exports.DELAY_RENDER_CALLSTACK_TOKEN = void 0;
|
|
3
|
+
exports.continueRender = exports.delayRender = exports.DELAY_RENDER_CLEAR_TOKEN = exports.DELAY_RENDER_RETRY_TOKEN = exports.DELAY_RENDER_RETRIES_LEFT = exports.DELAY_RENDER_CALLSTACK_TOKEN = void 0;
|
|
4
4
|
const cancel_render_js_1 = require("./cancel-render.js");
|
|
5
5
|
const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
|
|
6
|
+
const log_js_1 = require("./log.js");
|
|
6
7
|
const truthy_js_1 = require("./truthy.js");
|
|
7
8
|
if (typeof window !== 'undefined') {
|
|
8
9
|
window.remotion_renderReady = false;
|
|
@@ -14,6 +15,7 @@ if (typeof window !== 'undefined') {
|
|
|
14
15
|
exports.DELAY_RENDER_CALLSTACK_TOKEN = 'The delayRender was called:';
|
|
15
16
|
exports.DELAY_RENDER_RETRIES_LEFT = 'Retries left: ';
|
|
16
17
|
exports.DELAY_RENDER_RETRY_TOKEN = '- Rendering the frame will be retried.';
|
|
18
|
+
exports.DELAY_RENDER_CLEAR_TOKEN = 'handle was cleared after';
|
|
17
19
|
const defaultTimeout = 30000;
|
|
18
20
|
/*
|
|
19
21
|
* @description Call this function to signal that a frame should not be rendered until an asynchronous task (such as data fetching) is complete. Use continueRender(handle) to proceed with rendering once the task is complete.
|
|
@@ -36,6 +38,7 @@ const delayRender = (label, options) => {
|
|
|
36
38
|
const retriesLeft = ((_e = options === null || options === void 0 ? void 0 : options.retries) !== null && _e !== void 0 ? _e : 0) - (window.remotion_attempt - 1);
|
|
37
39
|
window.remotion_delayRenderTimeouts[handle] = {
|
|
38
40
|
label: label !== null && label !== void 0 ? label : null,
|
|
41
|
+
startTime: Date.now(),
|
|
39
42
|
timeout: setTimeout(() => {
|
|
40
43
|
const message = [
|
|
41
44
|
`A delayRender()`,
|
|
@@ -75,6 +78,15 @@ const continueRender = (handle) => {
|
|
|
75
78
|
if (h === handle) {
|
|
76
79
|
if ((0, get_remotion_environment_js_1.getRemotionEnvironment)().isRendering) {
|
|
77
80
|
clearTimeout(window.remotion_delayRenderTimeouts[handle].timeout);
|
|
81
|
+
const { label, startTime } = window.remotion_delayRenderTimeouts[handle];
|
|
82
|
+
const message = [
|
|
83
|
+
label ? `delayRender() "${label}"` : 'A delayRender()',
|
|
84
|
+
exports.DELAY_RENDER_CLEAR_TOKEN,
|
|
85
|
+
`${Date.now() - startTime}ms`,
|
|
86
|
+
]
|
|
87
|
+
.filter(truthy_js_1.truthy)
|
|
88
|
+
.join(' ');
|
|
89
|
+
log_js_1.Log.verbose(window.remotion_logLevel, message);
|
|
78
90
|
delete window.remotion_delayRenderTimeouts[handle];
|
|
79
91
|
}
|
|
80
92
|
return false;
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './_check-rsc.js';
|
|
2
2
|
import './asset-types.js';
|
|
3
3
|
import type { Codec } from './codec.js';
|
|
4
|
-
import type { TRenderAsset } from './CompositionManager.js';
|
|
4
|
+
import type { AnyCompMetadata, AnyComposition, AudioOrVideoAsset, TRenderAsset } from './CompositionManager.js';
|
|
5
5
|
import type { StaticFile } from './get-static-files.js';
|
|
6
6
|
import type { LogLevel } from './log.js';
|
|
7
7
|
import type { VideoConfig } from './video-config.js';
|
|
@@ -16,6 +16,7 @@ declare global {
|
|
|
16
16
|
[key: string]: {
|
|
17
17
|
label: string | null;
|
|
18
18
|
timeout: number | Timer;
|
|
19
|
+
startTime: number;
|
|
19
20
|
};
|
|
20
21
|
};
|
|
21
22
|
remotion_cancelledError: string | undefined;
|
|
@@ -55,11 +56,7 @@ declare global {
|
|
|
55
56
|
remotion_unsavedProps: boolean | undefined;
|
|
56
57
|
}
|
|
57
58
|
}
|
|
58
|
-
export type
|
|
59
|
-
type: 'index';
|
|
60
|
-
} | {
|
|
61
|
-
type: 'evaluation';
|
|
62
|
-
} | {
|
|
59
|
+
export type BundleCompositionState = {
|
|
63
60
|
type: 'composition';
|
|
64
61
|
compositionName: string;
|
|
65
62
|
serializedResolvedPropsWithSchema: string;
|
|
@@ -70,13 +67,19 @@ export type BundleState = {
|
|
|
70
67
|
compositionDefaultCodec: Codec;
|
|
71
68
|
compositionDefaultOutName: string | null;
|
|
72
69
|
};
|
|
70
|
+
export type BundleIndexState = {
|
|
71
|
+
type: 'index';
|
|
72
|
+
};
|
|
73
|
+
export type BundleEvaluationState = {
|
|
74
|
+
type: 'evaluation';
|
|
75
|
+
};
|
|
76
|
+
export type BundleState = BundleIndexState | BundleEvaluationState | BundleCompositionState;
|
|
73
77
|
export * from './AbsoluteFill.js';
|
|
74
78
|
export * from './animated-image/index.js';
|
|
75
79
|
export { Artifact } from './Artifact.js';
|
|
76
80
|
export * from './audio/index.js';
|
|
77
81
|
export { cancelRender } from './cancel-render.js';
|
|
78
82
|
export { CalculateMetadataFunction, Composition, CompositionProps, CompProps, StillProps, } from './Composition.js';
|
|
79
|
-
export { AnyCompMetadata, AnyComposition, AudioOrVideoAsset, SmallTCompMetadata, TCompMetadata, TRenderAsset, } from './CompositionManager.js';
|
|
80
83
|
export type { CanvasContent } from './CompositionManagerContext.js';
|
|
81
84
|
export { getInputProps } from './config/input-props.js';
|
|
82
85
|
export { continueRender, delayRender } from './delay-render.js';
|
|
@@ -122,3 +125,12 @@ export declare const Experimental: {
|
|
|
122
125
|
useIsPlayer: () => boolean;
|
|
123
126
|
};
|
|
124
127
|
export declare const Config: {};
|
|
128
|
+
export type _InternalTypes = {
|
|
129
|
+
AnyComposition: AnyComposition;
|
|
130
|
+
BundleCompositionState: BundleCompositionState;
|
|
131
|
+
BundleState: BundleState;
|
|
132
|
+
VideoConfigWithSerializedProps: VideoConfigWithSerializedProps;
|
|
133
|
+
AnyCompMetadata: AnyCompMetadata;
|
|
134
|
+
AudioOrVideoAsset: AudioOrVideoAsset;
|
|
135
|
+
TRenderAsset: TRenderAsset;
|
|
136
|
+
};
|
package/dist/cjs/internals.d.ts
CHANGED
|
@@ -15,12 +15,15 @@ export declare const Internals: {
|
|
|
15
15
|
readonly useUnsafeVideoConfig: () => import("./video-config.js").VideoConfig | null;
|
|
16
16
|
readonly Timeline: typeof TimelinePosition;
|
|
17
17
|
readonly CompositionManager: import("react").Context<CompositionManagerContext>;
|
|
18
|
+
readonly CompositionSetters: import("react").Context<import("./CompositionManagerContext.js").CompositionManagerSetters>;
|
|
18
19
|
readonly SequenceManager: import("react").Context<import("./SequenceManager.js").SequenceManagerContext>;
|
|
19
20
|
readonly SequenceVisibilityToggleContext: import("react").Context<import("./SequenceManager.js").SequenceVisibilityToggleState>;
|
|
20
21
|
readonly RemotionRoot: import("react").FC<{
|
|
21
22
|
readonly children: import("react").ReactNode;
|
|
22
23
|
readonly numberOfAudioTags: number;
|
|
23
24
|
readonly logLevel: import("./log.js").LogLevel;
|
|
25
|
+
readonly onlyRenderComposition: string | null;
|
|
26
|
+
readonly currentCompositionMetadata: import("./CompositionManagerContext.js").BaseMetadata | null;
|
|
24
27
|
}>;
|
|
25
28
|
readonly useVideo: () => (import("./video-config.js").VideoConfig & {
|
|
26
29
|
component: import("react").LazyExoticComponent<import("react").ComponentType<Record<string, unknown>>>;
|
package/dist/cjs/internals.js
CHANGED
|
@@ -71,6 +71,7 @@ exports.Internals = {
|
|
|
71
71
|
useUnsafeVideoConfig: use_unsafe_video_config_js_1.useUnsafeVideoConfig,
|
|
72
72
|
Timeline: TimelinePosition,
|
|
73
73
|
CompositionManager: CompositionManagerContext_js_1.CompositionManager,
|
|
74
|
+
CompositionSetters: CompositionManagerContext_js_1.CompositionSetters,
|
|
74
75
|
SequenceManager: SequenceManager_js_1.SequenceManager,
|
|
75
76
|
SequenceVisibilityToggleContext: SequenceManager_js_1.SequenceVisibilityToggleContext,
|
|
76
77
|
RemotionRoot: RemotionRoot_js_1.RemotionRoot,
|
package/dist/cjs/no-react.d.ts
CHANGED
|
@@ -29,6 +29,7 @@ export declare const NoReactInternals: {
|
|
|
29
29
|
deserializeJSONWithCustomFields: <T = Record<string, unknown>>(data: string) => T;
|
|
30
30
|
DELAY_RENDER_CALLSTACK_TOKEN: string;
|
|
31
31
|
DELAY_RENDER_RETRY_TOKEN: string;
|
|
32
|
+
DELAY_RENDER_CLEAR_TOKEN: string;
|
|
32
33
|
DELAY_RENDER_ATTEMPT_TOKEN: string;
|
|
33
34
|
getOffthreadVideoSource: ({ src, transparent, currentTime, toneMapped, }: {
|
|
34
35
|
src: string;
|
package/dist/cjs/no-react.js
CHANGED
|
@@ -32,6 +32,7 @@ exports.NoReactInternals = {
|
|
|
32
32
|
deserializeJSONWithCustomFields: input_props_serialization_1.deserializeJSONWithCustomFields,
|
|
33
33
|
DELAY_RENDER_CALLSTACK_TOKEN: delay_render_1.DELAY_RENDER_CALLSTACK_TOKEN,
|
|
34
34
|
DELAY_RENDER_RETRY_TOKEN: delay_render_1.DELAY_RENDER_RETRY_TOKEN,
|
|
35
|
+
DELAY_RENDER_CLEAR_TOKEN: delay_render_1.DELAY_RENDER_CLEAR_TOKEN,
|
|
35
36
|
DELAY_RENDER_ATTEMPT_TOKEN: delay_render_1.DELAY_RENDER_RETRIES_LEFT,
|
|
36
37
|
getOffthreadVideoSource: offthread_video_source_1.getOffthreadVideoSource,
|
|
37
38
|
getExpectedMediaFrameUncorrected: get_current_time_1.getExpectedMediaFrameUncorrected,
|
package/dist/cjs/version.d.ts
CHANGED
package/dist/cjs/version.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { RemotionMainVideoProps } from './props';
|
|
3
|
-
export declare const Video: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, "nonce" | "onError" | "onEnded" | "
|
|
3
|
+
export declare const Video: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, "nonce" | "onError" | "onEnded" | "autoPlay" | "controls" | "disableRemotePlayback"> & {
|
|
4
4
|
name?: string;
|
|
5
5
|
volume?: import("../volume-prop.js").VolumeProp;
|
|
6
6
|
playbackRate?: number;
|
package/dist/esm/index.mjs
CHANGED
|
@@ -104,7 +104,7 @@ function truthy(value) {
|
|
|
104
104
|
}
|
|
105
105
|
|
|
106
106
|
// src/version.ts
|
|
107
|
-
var VERSION = "4.0.
|
|
107
|
+
var VERSION = "4.0.274";
|
|
108
108
|
|
|
109
109
|
// src/multiple-versions-warning.ts
|
|
110
110
|
var checkMultipleRemotionVersions = () => {
|
|
@@ -297,6 +297,11 @@ import { useContext as useContext4, useMemo as useMemo5 } from "react";
|
|
|
297
297
|
import { createContext as createContext5 } from "react";
|
|
298
298
|
var CompositionManager = createContext5({
|
|
299
299
|
compositions: [],
|
|
300
|
+
folders: [],
|
|
301
|
+
currentCompositionMetadata: null,
|
|
302
|
+
canvasContent: null
|
|
303
|
+
});
|
|
304
|
+
var CompositionSetters = createContext5({
|
|
300
305
|
registerComposition: () => {
|
|
301
306
|
return;
|
|
302
307
|
},
|
|
@@ -309,18 +314,13 @@ var CompositionManager = createContext5({
|
|
|
309
314
|
unregisterFolder: () => {
|
|
310
315
|
return;
|
|
311
316
|
},
|
|
312
|
-
|
|
317
|
+
setCanvasContent: () => {
|
|
313
318
|
return;
|
|
314
319
|
},
|
|
315
320
|
updateCompositionDefaultProps: () => {
|
|
316
321
|
return;
|
|
317
322
|
},
|
|
318
|
-
|
|
319
|
-
currentCompositionMetadata: null,
|
|
320
|
-
canvasContent: null,
|
|
321
|
-
setCanvasContent: () => {
|
|
322
|
-
return;
|
|
323
|
-
}
|
|
323
|
+
onlyRenderComposition: null
|
|
324
324
|
});
|
|
325
325
|
|
|
326
326
|
// src/ResolveCompositionConfig.tsx
|
|
@@ -966,10 +966,7 @@ var useResolvedVideoConfig = (preferredCompositionId) => {
|
|
|
966
966
|
result: {
|
|
967
967
|
...currentCompositionMetadata,
|
|
968
968
|
id: composition.id,
|
|
969
|
-
|
|
970
|
-
defaultProps: composition.defaultProps ?? {},
|
|
971
|
-
defaultCodec: currentCompositionMetadata.defaultCodec,
|
|
972
|
-
defaultOutName: currentCompositionMetadata.defaultOutName
|
|
969
|
+
defaultProps: composition.defaultProps ?? {}
|
|
973
970
|
}
|
|
974
971
|
};
|
|
975
972
|
}
|
|
@@ -1482,6 +1479,40 @@ function cancelRender(err) {
|
|
|
1482
1479
|
throw error;
|
|
1483
1480
|
}
|
|
1484
1481
|
|
|
1482
|
+
// src/log.ts
|
|
1483
|
+
var logLevels = ["trace", "verbose", "info", "warn", "error"];
|
|
1484
|
+
var getNumberForLogLevel = (level) => {
|
|
1485
|
+
return logLevels.indexOf(level);
|
|
1486
|
+
};
|
|
1487
|
+
var isEqualOrBelowLogLevel = (currentLevel, level) => {
|
|
1488
|
+
return getNumberForLogLevel(currentLevel) <= getNumberForLogLevel(level);
|
|
1489
|
+
};
|
|
1490
|
+
var Log = {
|
|
1491
|
+
trace: (logLevel, ...args) => {
|
|
1492
|
+
if (isEqualOrBelowLogLevel(logLevel, "trace")) {
|
|
1493
|
+
return console.log(...args);
|
|
1494
|
+
}
|
|
1495
|
+
},
|
|
1496
|
+
verbose: (logLevel, ...args) => {
|
|
1497
|
+
if (isEqualOrBelowLogLevel(logLevel, "verbose")) {
|
|
1498
|
+
return console.log(...args);
|
|
1499
|
+
}
|
|
1500
|
+
},
|
|
1501
|
+
info: (logLevel, ...args) => {
|
|
1502
|
+
if (isEqualOrBelowLogLevel(logLevel, "info")) {
|
|
1503
|
+
return console.log(...args);
|
|
1504
|
+
}
|
|
1505
|
+
},
|
|
1506
|
+
warn: (logLevel, ...args) => {
|
|
1507
|
+
if (isEqualOrBelowLogLevel(logLevel, "warn")) {
|
|
1508
|
+
return console.warn(...args);
|
|
1509
|
+
}
|
|
1510
|
+
},
|
|
1511
|
+
error: (...args) => {
|
|
1512
|
+
return console.error(...args);
|
|
1513
|
+
}
|
|
1514
|
+
};
|
|
1515
|
+
|
|
1485
1516
|
// src/delay-render.ts
|
|
1486
1517
|
if (typeof window !== "undefined") {
|
|
1487
1518
|
window.remotion_renderReady = false;
|
|
@@ -1493,6 +1524,7 @@ if (typeof window !== "undefined") {
|
|
|
1493
1524
|
var DELAY_RENDER_CALLSTACK_TOKEN = "The delayRender was called:";
|
|
1494
1525
|
var DELAY_RENDER_RETRIES_LEFT = "Retries left: ";
|
|
1495
1526
|
var DELAY_RENDER_RETRY_TOKEN = "- Rendering the frame will be retried.";
|
|
1527
|
+
var DELAY_RENDER_CLEAR_TOKEN = "handle was cleared after";
|
|
1496
1528
|
var defaultTimeout = 30000;
|
|
1497
1529
|
var delayRender = (label, options) => {
|
|
1498
1530
|
if (typeof label !== "string" && typeof label !== "undefined") {
|
|
@@ -1507,6 +1539,7 @@ var delayRender = (label, options) => {
|
|
|
1507
1539
|
const retriesLeft = (options?.retries ?? 0) - (window.remotion_attempt - 1);
|
|
1508
1540
|
window.remotion_delayRenderTimeouts[handle] = {
|
|
1509
1541
|
label: label ?? null,
|
|
1542
|
+
startTime: Date.now(),
|
|
1510
1543
|
timeout: setTimeout(() => {
|
|
1511
1544
|
const message = [
|
|
1512
1545
|
`A delayRender()`,
|
|
@@ -1538,6 +1571,13 @@ var continueRender = (handle) => {
|
|
|
1538
1571
|
if (h === handle) {
|
|
1539
1572
|
if (getRemotionEnvironment().isRendering) {
|
|
1540
1573
|
clearTimeout(window.remotion_delayRenderTimeouts[handle].timeout);
|
|
1574
|
+
const { label, startTime } = window.remotion_delayRenderTimeouts[handle];
|
|
1575
|
+
const message = [
|
|
1576
|
+
label ? `delayRender() "${label}"` : "A delayRender()",
|
|
1577
|
+
DELAY_RENDER_CLEAR_TOKEN,
|
|
1578
|
+
`${Date.now() - startTime}ms`
|
|
1579
|
+
].filter(truthy).join(" ");
|
|
1580
|
+
Log.verbose(window.remotion_logLevel, message);
|
|
1541
1581
|
delete window.remotion_delayRenderTimeouts[handle];
|
|
1542
1582
|
}
|
|
1543
1583
|
return false;
|
|
@@ -2113,40 +2153,6 @@ Loop.useLoop = useLoop;
|
|
|
2113
2153
|
// src/prefetch.ts
|
|
2114
2154
|
import { useContext as useContext12 } from "react";
|
|
2115
2155
|
|
|
2116
|
-
// src/log.ts
|
|
2117
|
-
var logLevels = ["trace", "verbose", "info", "warn", "error"];
|
|
2118
|
-
var getNumberForLogLevel = (level) => {
|
|
2119
|
-
return logLevels.indexOf(level);
|
|
2120
|
-
};
|
|
2121
|
-
var isEqualOrBelowLogLevel = (currentLevel, level) => {
|
|
2122
|
-
return getNumberForLogLevel(currentLevel) <= getNumberForLogLevel(level);
|
|
2123
|
-
};
|
|
2124
|
-
var Log = {
|
|
2125
|
-
trace: (logLevel, ...args) => {
|
|
2126
|
-
if (isEqualOrBelowLogLevel(logLevel, "trace")) {
|
|
2127
|
-
return console.log(...args);
|
|
2128
|
-
}
|
|
2129
|
-
},
|
|
2130
|
-
verbose: (logLevel, ...args) => {
|
|
2131
|
-
if (isEqualOrBelowLogLevel(logLevel, "verbose")) {
|
|
2132
|
-
return console.log(...args);
|
|
2133
|
-
}
|
|
2134
|
-
},
|
|
2135
|
-
info: (logLevel, ...args) => {
|
|
2136
|
-
if (isEqualOrBelowLogLevel(logLevel, "info")) {
|
|
2137
|
-
return console.log(...args);
|
|
2138
|
-
}
|
|
2139
|
-
},
|
|
2140
|
-
warn: (logLevel, ...args) => {
|
|
2141
|
-
if (isEqualOrBelowLogLevel(logLevel, "warn")) {
|
|
2142
|
-
return console.warn(...args);
|
|
2143
|
-
}
|
|
2144
|
-
},
|
|
2145
|
-
error: (...args) => {
|
|
2146
|
-
return console.error(...args);
|
|
2147
|
-
}
|
|
2148
|
-
};
|
|
2149
|
-
|
|
2150
2156
|
// src/playback-logging.ts
|
|
2151
2157
|
var playbackLogging = ({
|
|
2152
2158
|
logLevel,
|
|
@@ -4365,7 +4371,7 @@ var FolderContext = createContext17({
|
|
|
4365
4371
|
});
|
|
4366
4372
|
var Folder = ({ name, children }) => {
|
|
4367
4373
|
const parent = useContext24(FolderContext);
|
|
4368
|
-
const { registerFolder, unregisterFolder } = useContext24(
|
|
4374
|
+
const { registerFolder, unregisterFolder } = useContext24(CompositionSetters);
|
|
4369
4375
|
validateFolderName(name);
|
|
4370
4376
|
const parentNameArr = [parent.parentName, parent.folderName].filter(truthy);
|
|
4371
4377
|
const parentName = parentNameArr.length === 0 ? null : parentNameArr.join("/");
|
|
@@ -4535,7 +4541,7 @@ var Fallback = () => {
|
|
|
4535
4541
|
}, []);
|
|
4536
4542
|
return null;
|
|
4537
4543
|
};
|
|
4538
|
-
var
|
|
4544
|
+
var InnerComposition = ({
|
|
4539
4545
|
width,
|
|
4540
4546
|
height,
|
|
4541
4547
|
fps,
|
|
@@ -4545,7 +4551,8 @@ var Composition = ({
|
|
|
4545
4551
|
schema,
|
|
4546
4552
|
...compProps
|
|
4547
4553
|
}) => {
|
|
4548
|
-
const
|
|
4554
|
+
const compManager = useContext25(CompositionSetters);
|
|
4555
|
+
const { registerComposition, unregisterComposition } = compManager;
|
|
4549
4556
|
const video = useVideo();
|
|
4550
4557
|
const lazy = useLazyComponent({
|
|
4551
4558
|
compProps,
|
|
@@ -4594,13 +4601,13 @@ var Composition = ({
|
|
|
4594
4601
|
id,
|
|
4595
4602
|
folderName,
|
|
4596
4603
|
defaultProps,
|
|
4597
|
-
registerComposition,
|
|
4598
|
-
unregisterComposition,
|
|
4599
4604
|
width,
|
|
4600
4605
|
nonce,
|
|
4601
4606
|
parentName,
|
|
4602
4607
|
schema,
|
|
4603
|
-
compProps.calculateMetadata
|
|
4608
|
+
compProps.calculateMetadata,
|
|
4609
|
+
registerComposition,
|
|
4610
|
+
unregisterComposition
|
|
4604
4611
|
]);
|
|
4605
4612
|
const resolved = useResolvedVideoConfig(id);
|
|
4606
4613
|
if (environment.isStudio && video && video.component === lazy) {
|
|
@@ -4633,117 +4640,13 @@ var Composition = ({
|
|
|
4633
4640
|
}
|
|
4634
4641
|
return null;
|
|
4635
4642
|
};
|
|
4636
|
-
|
|
4637
|
-
|
|
4638
|
-
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
} from "react";
|
|
4644
|
-
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
4645
|
-
var compositionsRef = React20.createRef();
|
|
4646
|
-
var CompositionManagerProvider = ({ children, numberOfAudioTags }) => {
|
|
4647
|
-
const [compositions, setCompositions] = useState14([]);
|
|
4648
|
-
const currentcompositionsRef = useRef12(compositions);
|
|
4649
|
-
const [folders, setFolders] = useState14([]);
|
|
4650
|
-
const [canvasContent, setCanvasContent] = useState14(null);
|
|
4651
|
-
const [currentCompositionMetadata, setCurrentCompositionMetadata] = useState14(null);
|
|
4652
|
-
const updateCompositions = useCallback12((updateComps) => {
|
|
4653
|
-
setCompositions((comps) => {
|
|
4654
|
-
const updated = updateComps(comps);
|
|
4655
|
-
currentcompositionsRef.current = updated;
|
|
4656
|
-
return updated;
|
|
4657
|
-
});
|
|
4658
|
-
}, []);
|
|
4659
|
-
const registerComposition = useCallback12((comp) => {
|
|
4660
|
-
updateCompositions((comps) => {
|
|
4661
|
-
if (comps.find((c) => c.id === comp.id)) {
|
|
4662
|
-
throw new Error(`Multiple composition with id ${comp.id} are registered.`);
|
|
4663
|
-
}
|
|
4664
|
-
const value = [...comps, comp].slice().sort((a, b) => a.nonce - b.nonce);
|
|
4665
|
-
return value;
|
|
4666
|
-
});
|
|
4667
|
-
}, [updateCompositions]);
|
|
4668
|
-
const unregisterComposition = useCallback12((id) => {
|
|
4669
|
-
setCompositions((comps) => {
|
|
4670
|
-
return comps.filter((c) => c.id !== id);
|
|
4671
|
-
});
|
|
4672
|
-
}, []);
|
|
4673
|
-
const registerFolder = useCallback12((name, parent) => {
|
|
4674
|
-
setFolders((prevFolders) => {
|
|
4675
|
-
return [
|
|
4676
|
-
...prevFolders,
|
|
4677
|
-
{
|
|
4678
|
-
name,
|
|
4679
|
-
parent
|
|
4680
|
-
}
|
|
4681
|
-
];
|
|
4682
|
-
});
|
|
4683
|
-
}, []);
|
|
4684
|
-
const unregisterFolder = useCallback12((name, parent) => {
|
|
4685
|
-
setFolders((prevFolders) => {
|
|
4686
|
-
return prevFolders.filter((p) => !(p.name === name && p.parent === parent));
|
|
4687
|
-
});
|
|
4688
|
-
}, []);
|
|
4689
|
-
useImperativeHandle7(compositionsRef, () => {
|
|
4690
|
-
return {
|
|
4691
|
-
getCompositions: () => currentcompositionsRef.current
|
|
4692
|
-
};
|
|
4693
|
-
}, []);
|
|
4694
|
-
const composition = compositions.find((c) => canvasContent?.type === "composition" ? c.id === canvasContent.compositionId : null);
|
|
4695
|
-
const updateCompositionDefaultProps = useCallback12((id, newDefaultProps) => {
|
|
4696
|
-
setCompositions((comps) => {
|
|
4697
|
-
const updated = comps.map((c) => {
|
|
4698
|
-
if (c.id === id) {
|
|
4699
|
-
return {
|
|
4700
|
-
...c,
|
|
4701
|
-
defaultProps: newDefaultProps
|
|
4702
|
-
};
|
|
4703
|
-
}
|
|
4704
|
-
return c;
|
|
4705
|
-
});
|
|
4706
|
-
return updated;
|
|
4707
|
-
});
|
|
4708
|
-
}, []);
|
|
4709
|
-
const contextValue = useMemo23(() => {
|
|
4710
|
-
return {
|
|
4711
|
-
compositions,
|
|
4712
|
-
registerComposition,
|
|
4713
|
-
unregisterComposition,
|
|
4714
|
-
folders,
|
|
4715
|
-
registerFolder,
|
|
4716
|
-
unregisterFolder,
|
|
4717
|
-
currentCompositionMetadata,
|
|
4718
|
-
setCurrentCompositionMetadata,
|
|
4719
|
-
canvasContent,
|
|
4720
|
-
setCanvasContent,
|
|
4721
|
-
updateCompositionDefaultProps
|
|
4722
|
-
};
|
|
4723
|
-
}, [
|
|
4724
|
-
compositions,
|
|
4725
|
-
registerComposition,
|
|
4726
|
-
unregisterComposition,
|
|
4727
|
-
folders,
|
|
4728
|
-
registerFolder,
|
|
4729
|
-
unregisterFolder,
|
|
4730
|
-
currentCompositionMetadata,
|
|
4731
|
-
canvasContent,
|
|
4732
|
-
updateCompositionDefaultProps
|
|
4733
|
-
]);
|
|
4734
|
-
return /* @__PURE__ */ jsx23(CompositionManager.Provider, {
|
|
4735
|
-
value: contextValue,
|
|
4736
|
-
children: /* @__PURE__ */ jsx23(SequenceManagerProvider, {
|
|
4737
|
-
children: /* @__PURE__ */ jsx23(RenderAssetManagerProvider, {
|
|
4738
|
-
children: /* @__PURE__ */ jsx23(ResolveCompositionConfig, {
|
|
4739
|
-
children: /* @__PURE__ */ jsx23(SharedAudioContextProvider, {
|
|
4740
|
-
numberOfAudioTags,
|
|
4741
|
-
component: composition?.component ?? null,
|
|
4742
|
-
children
|
|
4743
|
-
})
|
|
4744
|
-
})
|
|
4745
|
-
})
|
|
4746
|
-
})
|
|
4643
|
+
var Composition = (props2) => {
|
|
4644
|
+
const { onlyRenderComposition } = useContext25(CompositionSetters);
|
|
4645
|
+
if (onlyRenderComposition && onlyRenderComposition !== props2.id) {
|
|
4646
|
+
return null;
|
|
4647
|
+
}
|
|
4648
|
+
return /* @__PURE__ */ jsx22(InnerComposition, {
|
|
4649
|
+
...props2
|
|
4747
4650
|
});
|
|
4748
4651
|
};
|
|
4749
4652
|
// src/bezier.ts
|
|
@@ -4960,8 +4863,8 @@ var getStaticFiles = () => {
|
|
|
4960
4863
|
return window.remotion_staticFiles;
|
|
4961
4864
|
};
|
|
4962
4865
|
// src/IFrame.tsx
|
|
4963
|
-
import { forwardRef as forwardRef7, useCallback as
|
|
4964
|
-
import { jsx as
|
|
4866
|
+
import { forwardRef as forwardRef7, useCallback as useCallback12, useState as useState14 } from "react";
|
|
4867
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
4965
4868
|
var IFrameRefForwarding = ({
|
|
4966
4869
|
onLoad,
|
|
4967
4870
|
onError,
|
|
@@ -4969,15 +4872,15 @@ var IFrameRefForwarding = ({
|
|
|
4969
4872
|
delayRenderTimeoutInMilliseconds,
|
|
4970
4873
|
...props2
|
|
4971
4874
|
}, ref) => {
|
|
4972
|
-
const [handle] =
|
|
4875
|
+
const [handle] = useState14(() => delayRender(`Loading <IFrame> with source ${props2.src}`, {
|
|
4973
4876
|
retries: delayRenderRetries ?? undefined,
|
|
4974
4877
|
timeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? undefined
|
|
4975
4878
|
}));
|
|
4976
|
-
const didLoad =
|
|
4879
|
+
const didLoad = useCallback12((e) => {
|
|
4977
4880
|
continueRender(handle);
|
|
4978
4881
|
onLoad?.(e);
|
|
4979
4882
|
}, [handle, onLoad]);
|
|
4980
|
-
const didGetError =
|
|
4883
|
+
const didGetError = useCallback12((e) => {
|
|
4981
4884
|
continueRender(handle);
|
|
4982
4885
|
if (onError) {
|
|
4983
4886
|
onError(e);
|
|
@@ -4985,7 +4888,7 @@ var IFrameRefForwarding = ({
|
|
|
4985
4888
|
console.error("Error loading iframe:", e, "Handle the event using the onError() prop to make this message disappear.");
|
|
4986
4889
|
}
|
|
4987
4890
|
}, [handle, onError]);
|
|
4988
|
-
return /* @__PURE__ */
|
|
4891
|
+
return /* @__PURE__ */ jsx23("iframe", {
|
|
4989
4892
|
...props2,
|
|
4990
4893
|
ref,
|
|
4991
4894
|
onError: didGetError,
|
|
@@ -4996,13 +4899,13 @@ var IFrame = forwardRef7(IFrameRefForwarding);
|
|
|
4996
4899
|
// src/Img.tsx
|
|
4997
4900
|
import {
|
|
4998
4901
|
forwardRef as forwardRef8,
|
|
4999
|
-
useCallback as
|
|
4902
|
+
useCallback as useCallback13,
|
|
5000
4903
|
useContext as useContext26,
|
|
5001
|
-
useImperativeHandle as
|
|
4904
|
+
useImperativeHandle as useImperativeHandle7,
|
|
5002
4905
|
useLayoutEffect as useLayoutEffect4,
|
|
5003
|
-
useRef as
|
|
4906
|
+
useRef as useRef12
|
|
5004
4907
|
} from "react";
|
|
5005
|
-
import { jsx as
|
|
4908
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
5006
4909
|
function exponentialBackoff(errorCount) {
|
|
5007
4910
|
return 1000 * 2 ** (errorCount - 1);
|
|
5008
4911
|
}
|
|
@@ -5016,18 +4919,18 @@ var ImgRefForwarding = ({
|
|
|
5016
4919
|
onImageFrame,
|
|
5017
4920
|
...props2
|
|
5018
4921
|
}, ref) => {
|
|
5019
|
-
const imageRef =
|
|
5020
|
-
const errors =
|
|
4922
|
+
const imageRef = useRef12(null);
|
|
4923
|
+
const errors = useRef12({});
|
|
5021
4924
|
const { delayPlayback } = useBufferState();
|
|
5022
4925
|
const sequenceContext = useContext26(SequenceContext);
|
|
5023
4926
|
if (!src) {
|
|
5024
4927
|
throw new Error('No "src" prop was passed to <Img>.');
|
|
5025
4928
|
}
|
|
5026
|
-
|
|
4929
|
+
useImperativeHandle7(ref, () => {
|
|
5027
4930
|
return imageRef.current;
|
|
5028
4931
|
}, []);
|
|
5029
4932
|
const actualSrc = usePreload(src);
|
|
5030
|
-
const retryIn =
|
|
4933
|
+
const retryIn = useCallback13((timeout) => {
|
|
5031
4934
|
if (!imageRef.current) {
|
|
5032
4935
|
return;
|
|
5033
4936
|
}
|
|
@@ -5044,7 +4947,7 @@ var ImgRefForwarding = ({
|
|
|
5044
4947
|
imageRef.current.setAttribute("src", newSrc);
|
|
5045
4948
|
}, timeout);
|
|
5046
4949
|
}, []);
|
|
5047
|
-
const didGetError =
|
|
4950
|
+
const didGetError = useCallback13((e) => {
|
|
5048
4951
|
if (!errors.current) {
|
|
5049
4952
|
return;
|
|
5050
4953
|
}
|
|
@@ -5130,13 +5033,135 @@ var ImgRefForwarding = ({
|
|
|
5130
5033
|
onImageFrame
|
|
5131
5034
|
]);
|
|
5132
5035
|
}
|
|
5133
|
-
return /* @__PURE__ */
|
|
5036
|
+
return /* @__PURE__ */ jsx24("img", {
|
|
5134
5037
|
...props2,
|
|
5135
5038
|
ref: imageRef,
|
|
5136
5039
|
onError: didGetError
|
|
5137
5040
|
});
|
|
5138
5041
|
};
|
|
5139
5042
|
var Img = forwardRef8(ImgRefForwarding);
|
|
5043
|
+
// src/CompositionManager.tsx
|
|
5044
|
+
import React22, {
|
|
5045
|
+
useCallback as useCallback14,
|
|
5046
|
+
useImperativeHandle as useImperativeHandle8,
|
|
5047
|
+
useMemo as useMemo23,
|
|
5048
|
+
useRef as useRef13,
|
|
5049
|
+
useState as useState15
|
|
5050
|
+
} from "react";
|
|
5051
|
+
import { jsx as jsx25 } from "react/jsx-runtime";
|
|
5052
|
+
var compositionsRef = React22.createRef();
|
|
5053
|
+
var CompositionManagerProvider = ({
|
|
5054
|
+
children,
|
|
5055
|
+
numberOfAudioTags,
|
|
5056
|
+
onlyRenderComposition,
|
|
5057
|
+
currentCompositionMetadata
|
|
5058
|
+
}) => {
|
|
5059
|
+
const [compositions, setCompositions] = useState15([]);
|
|
5060
|
+
const currentcompositionsRef = useRef13(compositions);
|
|
5061
|
+
const [folders, setFolders] = useState15([]);
|
|
5062
|
+
const [canvasContent, setCanvasContent] = useState15(null);
|
|
5063
|
+
const updateCompositions = useCallback14((updateComps) => {
|
|
5064
|
+
setCompositions((comps) => {
|
|
5065
|
+
const updated = updateComps(comps);
|
|
5066
|
+
currentcompositionsRef.current = updated;
|
|
5067
|
+
return updated;
|
|
5068
|
+
});
|
|
5069
|
+
}, []);
|
|
5070
|
+
const registerComposition = useCallback14((comp) => {
|
|
5071
|
+
updateCompositions((comps) => {
|
|
5072
|
+
if (comps.find((c2) => c2.id === comp.id)) {
|
|
5073
|
+
throw new Error(`Multiple composition with id ${comp.id} are registered.`);
|
|
5074
|
+
}
|
|
5075
|
+
const value = [...comps, comp].slice().sort((a2, b2) => a2.nonce - b2.nonce);
|
|
5076
|
+
return value;
|
|
5077
|
+
});
|
|
5078
|
+
}, [updateCompositions]);
|
|
5079
|
+
const unregisterComposition = useCallback14((id) => {
|
|
5080
|
+
setCompositions((comps) => {
|
|
5081
|
+
return comps.filter((c2) => c2.id !== id);
|
|
5082
|
+
});
|
|
5083
|
+
}, []);
|
|
5084
|
+
const registerFolder = useCallback14((name, parent) => {
|
|
5085
|
+
setFolders((prevFolders) => {
|
|
5086
|
+
return [
|
|
5087
|
+
...prevFolders,
|
|
5088
|
+
{
|
|
5089
|
+
name,
|
|
5090
|
+
parent
|
|
5091
|
+
}
|
|
5092
|
+
];
|
|
5093
|
+
});
|
|
5094
|
+
}, []);
|
|
5095
|
+
const unregisterFolder = useCallback14((name, parent) => {
|
|
5096
|
+
setFolders((prevFolders) => {
|
|
5097
|
+
return prevFolders.filter((p) => !(p.name === name && p.parent === parent));
|
|
5098
|
+
});
|
|
5099
|
+
}, []);
|
|
5100
|
+
useImperativeHandle8(compositionsRef, () => {
|
|
5101
|
+
return {
|
|
5102
|
+
getCompositions: () => currentcompositionsRef.current
|
|
5103
|
+
};
|
|
5104
|
+
}, []);
|
|
5105
|
+
const composition = compositions.find((c2) => canvasContent?.type === "composition" ? c2.id === canvasContent.compositionId : null);
|
|
5106
|
+
const updateCompositionDefaultProps = useCallback14((id, newDefaultProps) => {
|
|
5107
|
+
setCompositions((comps) => {
|
|
5108
|
+
const updated = comps.map((c2) => {
|
|
5109
|
+
if (c2.id === id) {
|
|
5110
|
+
return {
|
|
5111
|
+
...c2,
|
|
5112
|
+
defaultProps: newDefaultProps
|
|
5113
|
+
};
|
|
5114
|
+
}
|
|
5115
|
+
return c2;
|
|
5116
|
+
});
|
|
5117
|
+
return updated;
|
|
5118
|
+
});
|
|
5119
|
+
}, []);
|
|
5120
|
+
const contextValue = useMemo23(() => {
|
|
5121
|
+
return {
|
|
5122
|
+
compositions,
|
|
5123
|
+
folders,
|
|
5124
|
+
currentCompositionMetadata,
|
|
5125
|
+
canvasContent
|
|
5126
|
+
};
|
|
5127
|
+
}, [compositions, folders, currentCompositionMetadata, canvasContent]);
|
|
5128
|
+
const setters = useMemo23(() => {
|
|
5129
|
+
return {
|
|
5130
|
+
registerComposition,
|
|
5131
|
+
unregisterComposition,
|
|
5132
|
+
registerFolder,
|
|
5133
|
+
unregisterFolder,
|
|
5134
|
+
setCanvasContent,
|
|
5135
|
+
updateCompositionDefaultProps,
|
|
5136
|
+
onlyRenderComposition
|
|
5137
|
+
};
|
|
5138
|
+
}, [
|
|
5139
|
+
registerComposition,
|
|
5140
|
+
registerFolder,
|
|
5141
|
+
unregisterComposition,
|
|
5142
|
+
unregisterFolder,
|
|
5143
|
+
updateCompositionDefaultProps,
|
|
5144
|
+
onlyRenderComposition
|
|
5145
|
+
]);
|
|
5146
|
+
return /* @__PURE__ */ jsx25(CompositionManager.Provider, {
|
|
5147
|
+
value: contextValue,
|
|
5148
|
+
children: /* @__PURE__ */ jsx25(CompositionSetters.Provider, {
|
|
5149
|
+
value: setters,
|
|
5150
|
+
children: /* @__PURE__ */ jsx25(SequenceManagerProvider, {
|
|
5151
|
+
children: /* @__PURE__ */ jsx25(RenderAssetManagerProvider, {
|
|
5152
|
+
children: /* @__PURE__ */ jsx25(ResolveCompositionConfig, {
|
|
5153
|
+
children: /* @__PURE__ */ jsx25(SharedAudioContextProvider, {
|
|
5154
|
+
numberOfAudioTags,
|
|
5155
|
+
component: composition?.component ?? null,
|
|
5156
|
+
children
|
|
5157
|
+
})
|
|
5158
|
+
})
|
|
5159
|
+
})
|
|
5160
|
+
})
|
|
5161
|
+
})
|
|
5162
|
+
});
|
|
5163
|
+
};
|
|
5164
|
+
|
|
5140
5165
|
// src/default-css.ts
|
|
5141
5166
|
var exports_default_css = {};
|
|
5142
5167
|
__export(exports_default_css, {
|
|
@@ -5234,7 +5259,13 @@ import {
|
|
|
5234
5259
|
useState as useState16
|
|
5235
5260
|
} from "react";
|
|
5236
5261
|
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
5237
|
-
var RemotionRoot = ({
|
|
5262
|
+
var RemotionRoot = ({
|
|
5263
|
+
children,
|
|
5264
|
+
numberOfAudioTags,
|
|
5265
|
+
logLevel,
|
|
5266
|
+
onlyRenderComposition,
|
|
5267
|
+
currentCompositionMetadata
|
|
5268
|
+
}) => {
|
|
5238
5269
|
const [remotionRootId] = useState16(() => String(random(null)));
|
|
5239
5270
|
const [frame, setFrame] = useState16(() => getInitialFrameState());
|
|
5240
5271
|
const [playing, setPlaying] = useState16(false);
|
|
@@ -5318,6 +5349,8 @@ var RemotionRoot = ({ children, numberOfAudioTags, logLevel }) => {
|
|
|
5318
5349
|
children: /* @__PURE__ */ jsx26(PrefetchProvider, {
|
|
5319
5350
|
children: /* @__PURE__ */ jsx26(CompositionManagerProvider, {
|
|
5320
5351
|
numberOfAudioTags,
|
|
5352
|
+
onlyRenderComposition,
|
|
5353
|
+
currentCompositionMetadata,
|
|
5321
5354
|
children: /* @__PURE__ */ jsx26(DurationsContextProvider, {
|
|
5322
5355
|
children: /* @__PURE__ */ jsx26(BufferingProvider, {
|
|
5323
5356
|
children
|
|
@@ -5537,6 +5570,7 @@ var Internals = {
|
|
|
5537
5570
|
useUnsafeVideoConfig,
|
|
5538
5571
|
Timeline: exports_timeline_position_state,
|
|
5539
5572
|
CompositionManager,
|
|
5573
|
+
CompositionSetters,
|
|
5540
5574
|
SequenceManager,
|
|
5541
5575
|
SequenceVisibilityToggleContext,
|
|
5542
5576
|
RemotionRoot,
|
package/dist/esm/no-react.mjs
CHANGED
|
@@ -148,6 +148,7 @@ if (typeof window !== "undefined") {
|
|
|
148
148
|
var DELAY_RENDER_CALLSTACK_TOKEN = "The delayRender was called:";
|
|
149
149
|
var DELAY_RENDER_RETRIES_LEFT = "Retries left: ";
|
|
150
150
|
var DELAY_RENDER_RETRY_TOKEN = "- Rendering the frame will be retried.";
|
|
151
|
+
var DELAY_RENDER_CLEAR_TOKEN = "handle was cleared after";
|
|
151
152
|
|
|
152
153
|
// src/input-props-serialization.ts
|
|
153
154
|
var DATE_TOKEN = "remotion-date:";
|
|
@@ -636,6 +637,7 @@ var NoReactInternals = {
|
|
|
636
637
|
deserializeJSONWithCustomFields,
|
|
637
638
|
DELAY_RENDER_CALLSTACK_TOKEN,
|
|
638
639
|
DELAY_RENDER_RETRY_TOKEN,
|
|
640
|
+
DELAY_RENDER_CLEAR_TOKEN,
|
|
639
641
|
DELAY_RENDER_ATTEMPT_TOKEN: DELAY_RENDER_RETRIES_LEFT,
|
|
640
642
|
getOffthreadVideoSource,
|
|
641
643
|
getExpectedMediaFrameUncorrected,
|
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.274",
|
|
7
7
|
"description": "Make videos programmatically",
|
|
8
8
|
"main": "dist/cjs/index.js",
|
|
9
9
|
"types": "dist/cjs/index.d.ts",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"webpack": "5.96.1",
|
|
29
29
|
"zod": "3.22.3",
|
|
30
30
|
"eslint": "9.19.0",
|
|
31
|
-
"@remotion/eslint-config-internal": "4.0.
|
|
31
|
+
"@remotion/eslint-config-internal": "4.0.274"
|
|
32
32
|
},
|
|
33
33
|
"keywords": [
|
|
34
34
|
"remotion",
|