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.
@@ -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 get_environment_js_1 = require("./get-environment.js");
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 environment = (0, get_environment_js_1.useRemotionEnvironment)();
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 (environment === 'player-development' ||
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 === 'preview' && video && video.component === lazy) {
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 === 'rendering' && video && video.component === lazy) {
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 get_environment_js_1 = require("./get-environment.js");
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, get_environment_js_1.getRemotionEnvironment)() === 'player-development' ||
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
  },
@@ -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 get_environment_js_1 = require("./get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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 !== 'preview') {
71
+ if (!environment.isStudio) {
72
72
  return;
73
73
  }
74
74
  registerSequence({
@@ -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 get_environment_js_1 = require("../get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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, { _remotionInternalNeedsDurationCalculation: true, ...propsOtherThanLoop, ref: ref }) }));
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 === 'rendering') {
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 get_environment_js_1 = require("../get-environment.js");
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, get_environment_js_1.getRemotionEnvironment)() === 'player-development' ||
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;
@@ -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 get_environment_js_1 = require("./get-environment.js");
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, get_environment_js_1.getRemotionEnvironment)() === 'rendering') {
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, get_environment_js_1.getRemotionEnvironment)() === 'rendering') {
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;
@@ -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);
@@ -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;
@@ -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: get_environment_js_1.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,
@@ -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 get_environment_js_1 = require("./get-environment.js");
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, get_environment_js_1.getRemotionEnvironment)() === 'rendering') {
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 get_environment_js_1 = require("./get-environment.js");
4
+ const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
5
5
  const getEnvVariables = () => {
6
- if ((0, get_environment_js_1.getRemotionEnvironment)() === 'rendering') {
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, get_environment_js_1.getRemotionEnvironment)() === 'preview') {
14
- // For the Preview, we already set the environment variables in index-html.ts.
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 get_environment_js_1 = require("./get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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 !== 'preview' && process.env.NODE_ENV !== 'test') {
70
+ if (!environment.isStudio && process.env.NODE_ENV !== 'test') {
71
71
  return;
72
72
  }
73
73
  registerSequence({
@@ -1 +1 @@
1
- export declare const VERSION = "4.0.23";
1
+ export declare const VERSION = "4.0.25";
@@ -2,4 +2,4 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.VERSION = void 0;
4
4
  // Automatically generated on publish
5
- exports.VERSION = '4.0.23';
5
+ exports.VERSION = '4.0.25';
@@ -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 get_environment_js_1 = require("../get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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 === 'rendering') {
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;
@@ -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 get_environment_js_1 = require("../get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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 === 'rendering') {
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 get_environment_js_1 = require("../get-environment.js");
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, get_environment_js_1.useRemotionEnvironment)();
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 === 'rendering') {
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') {
@@ -59,7 +59,7 @@ function truthy(value) {
59
59
  }
60
60
 
61
61
  // Automatically generated on publish
62
- const VERSION = '4.0.23';
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 'player-production';
190
+ return {
191
+ isStudio: false,
192
+ isRendering: false,
193
+ isPlayer: true,
194
+ };
187
195
  }
188
- return 'rendering';
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 'rendering';
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 'player-development';
198
- }
199
- return 'preview';
200
- };
201
- const useRemotionEnvironment = () => {
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 getRemotionEnvironment();
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() === 'player-development' ||
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() === 'player-development' ||
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 = useRemotionEnvironment();
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 !== 'preview') {
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() === 'rendering') {
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 = useRemotionEnvironment();
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 !== 'preview' && process.env.NODE_ENV !== 'test') {
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() === 'rendering') {
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() === 'rendering') {
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 = useRemotionEnvironment();
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, { _remotionInternalNeedsDurationCalculation: true, ...propsOtherThanLoop, ref: ref }) }));
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 === 'rendering') {
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 environment = useRemotionEnvironment();
2715
+ const isPlayer = useIsPlayer();
2716
+ const environment = getRemotionEnvironment();
2706
2717
  const canUseComposition = useContext(CanUseRemotionHooks);
2707
2718
  if (canUseComposition) {
2708
- if (environment === 'player-development' ||
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 === 'preview' && video && video.component === lazy) {
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 === 'rendering' && video && video.component === lazy) {
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() === 'rendering') {
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() === 'preview') {
3793
- // For the Preview, we already set the environment variables in index-html.ts.
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 = useRemotionEnvironment();
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 === 'rendering') {
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 = useRemotionEnvironment();
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 === 'rendering') {
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 = useRemotionEnvironment();
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 === 'rendering') {
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 };
@@ -1,4 +1,4 @@
1
1
  // Automatically generated on publish
2
- const VERSION = '4.0.23';
2
+ const VERSION = '4.0.25';
3
3
 
4
4
  export { VERSION };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remotion",
3
- "version": "4.0.23",
3
+ "version": "4.0.25",
4
4
  "description": "Render videos in React",
5
5
  "main": "dist/cjs/index.js",
6
6
  "types": "dist/cjs/index.d.ts",
@@ -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
- }>;
@@ -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;