remotion 3.3.53 → 3.3.54

package/dist/get-preview-dom-element.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPreviewDomElement = void 0;
+const getPreviewDomElement = () => {
+    return document.getElementById('container');
+};
+exports.getPreviewDomElement = getPreviewDomElement;

package/dist/get-static-files.d.ts

@@ -0,0 +1,17 @@
+export declare const getStaticFiles: () => StaticFile[];
+export declare type StaticFile = {
+    /**
+     * A string that you can pass to the `src` attribute of an `<Audio>`, `<Img>` and `<Video>` element.
+     */
+    src: string;
+    /**
+     * The filepath of the file, relative to the public folder.
+     * Example: `subfolder/image.png`
+     */
+    name: string;
+    sizeInBytes: number;
+    /**
+     * UNIX timestamp in milliseconds
+     */
+    lastModified: number;
+};

package/dist/get-static-files.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStaticFiles = void 0;
+let warnedServer = false;
+let warnedPlayer = false;
+const warnServerOnce = () => {
+    if (warnedServer) {
+        return;
+    }
+    warnedServer = true;
+    console.warn('Called getStaticFiles() on the server. The API is only available in the browser. An empty array was returned.');
+};
+const warnPlayerOnce = () => {
+    if (warnedPlayer) {
+        return;
+    }
+    warnedPlayer = true;
+    console.warn('Called getStaticFiles() while using the Remotion Player. The API is only available while using the Remotion Preview. An empty array was returned.');
+};
+const getStaticFiles = () => {
+    if (typeof document === 'undefined') {
+        warnServerOnce();
+        return [];
+    }
+    if (window.remotion_isPlayer) {
+        warnPlayerOnce();
+        return [];
+    }
+    return window.remotion_staticFiles;
+};
+exports.getStaticFiles = getStaticFiles;

package/dist/get-timeline-clip-name.d.ts

@@ -0,0 +1 @@
+export declare const getTimelineClipName: (children: React.ReactNode) => string;

package/dist/get-timeline-clip-name.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTimelineClipName = void 0;
+const react_1 = require("react");
+const HIDDEN_NAMES = ['__WEBPACK_DEFAULT_EXPORT__'];
+const getTimelineClipName = (children) => {
+    var _a;
+    const tree = (_a = react_1.Children.map(children, (ch) => {
+        if (!(0, react_1.isValidElement)(ch)) {
+            return null;
+        }
+        // Must be name, not ID
+        const name = typeof ch.type !== 'string' && ch.type.name;
+        if (name && !HIDDEN_NAMES.includes(name)) {
+            return name;
+        }
+        if (ch.props.children) {
+            const chName = (0, exports.getTimelineClipName)(ch.props.children);
+            return chName;
+        }
+        return null;
+    })) === null || _a === void 0 ? void 0 : _a.filter(Boolean);
+    return (tree === null || tree === void 0 ? void 0 : tree.length) ? tree[0] : '';
+};
+exports.getTimelineClipName = getTimelineClipName;

package/dist/index.d.ts

@@ -0,0 +1,89 @@
+import './asset-types';
+import type { TAsset, TCompMetadata } from './CompositionManager';
+import type { StaticFile } from './get-static-files';
+import type { ClipRegion } from './NativeLayers';
+declare global {
+    interface Window {
+        ready: boolean;
+        getStaticCompositions: () => TCompMetadata[];
+        setBundleMode: (bundleMode: BundleState) => void;
+        remotion_staticBase: string;
+        remotion_staticFiles: StaticFile[];
+        remotion_editorName: string | null;
+        remotion_numberOfAudioTags: number;
+        remotion_projectName: string;
+        remotion_cwd: string;
+        remotion_previewServerCommand: string;
+        remotion_setFrame: (frame: number) => void;
+        remotion_initialFrame: number;
+        remotion_proxyPort: number;
+        remotion_audioEnabled: boolean;
+        remotion_videoEnabled: boolean;
+        remotion_puppeteerTimeout: number;
+        remotion_inputProps: string;
+        remotion_envVariables: string;
+        remotion_collectAssets: () => TAsset[];
+        remotion_getClipRegion: () => ClipRegion | null;
+        remotion_isPlayer: boolean;
+        remotion_isBuilding: undefined | (() => void);
+        remotion_finishedBuilding: undefined | (() => void);
+        siteVersion: '4';
+        remotion_version: string;
+        remotion_imported: string | boolean;
+    }
+}
+export declare type BundleState = {
+    type: 'index';
+} | {
+    type: 'evaluation';
+} | {
+    type: 'composition';
+    compositionName: string;
+    compositionDefaultProps: unknown;
+    compositionHeight: number;
+    compositionDurationInFrames: number;
+    compositionWidth: number;
+    compositionFps: number;
+};
+export * from './AbsoluteFill';
+export * from './audio';
+export * from './Composition';
+export { SmallTCompMetadata, TAsset, TCompMetadata } from './CompositionManager';
+export { Config, ConfigType } from './config';
+export { getInputProps } from './config/input-props';
+export * from './delay-render';
+export * from './easing';
+export * from './Folder';
+export * from './freeze';
+export { getStaticFiles, StaticFile } from './get-static-files';
+export * from './IFrame';
+export * from './Img';
+export * from './internals';
+export * from './interpolate';
+export { interpolateColors } from './interpolate-colors';
+export { Loop } from './loop';
+export { ClipRegion } from './NativeLayers';
+export { prefetch } from './prefetch';
+export { random, RandomSeed } from './random';
+export { registerRoot } from './register-root';
+export { Sequence } from './Sequence';
+export { Series } from './series';
+export * from './spring';
+export { staticFile } from './static-file';
+export * from './Still';
+export type { PlayableMediaTag } from './timeline-position-state';
+export { useCurrentFrame } from './use-current-frame';
+export * from './use-video-config';
+export * from './version';
+export * from './video';
+export * from './video-config';
+export declare const Experimental: {
+    Clipper: import("react").FC<{
+        width: number;
+        height: number;
+        x: number;
+        y: number;
+    }>;
+    Null: import("react").FC<{}>;
+    useIsPlayer: () => boolean;
+};

package/dist/index.js

@@ -0,0 +1,69 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Experimental = exports.useCurrentFrame = exports.staticFile = exports.Series = exports.Sequence = exports.registerRoot = exports.random = exports.prefetch = exports.Loop = exports.interpolateColors = exports.getStaticFiles = exports.getInputProps = exports.Config = void 0;
+require("./asset-types");
+const Clipper_1 = require("./Clipper");
+const is_player_1 = require("./is-player");
+const multiple_versions_warning_1 = require("./multiple-versions-warning");
+const Null_1 = require("./Null");
+(0, multiple_versions_warning_1.checkMultipleRemotionVersions)();
+__exportStar(require("./AbsoluteFill"), exports);
+__exportStar(require("./audio"), exports);
+__exportStar(require("./Composition"), exports);
+var config_1 = require("./config");
+Object.defineProperty(exports, "Config", { enumerable: true, get: function () { return config_1.Config; } });
+var input_props_1 = require("./config/input-props");
+Object.defineProperty(exports, "getInputProps", { enumerable: true, get: function () { return input_props_1.getInputProps; } });
+__exportStar(require("./delay-render"), exports);
+__exportStar(require("./easing"), exports);
+__exportStar(require("./Folder"), exports);
+__exportStar(require("./freeze"), exports);
+var get_static_files_1 = require("./get-static-files");
+Object.defineProperty(exports, "getStaticFiles", { enumerable: true, get: function () { return get_static_files_1.getStaticFiles; } });
+__exportStar(require("./IFrame"), exports);
+__exportStar(require("./Img"), exports);
+__exportStar(require("./internals"), exports);
+__exportStar(require("./interpolate"), exports);
+var interpolate_colors_1 = require("./interpolate-colors");
+Object.defineProperty(exports, "interpolateColors", { enumerable: true, get: function () { return interpolate_colors_1.interpolateColors; } });
+var loop_1 = require("./loop");
+Object.defineProperty(exports, "Loop", { enumerable: true, get: function () { return loop_1.Loop; } });
+var prefetch_1 = require("./prefetch");
+Object.defineProperty(exports, "prefetch", { enumerable: true, get: function () { return prefetch_1.prefetch; } });
+var random_1 = require("./random");
+Object.defineProperty(exports, "random", { enumerable: true, get: function () { return random_1.random; } });
+var register_root_1 = require("./register-root");
+Object.defineProperty(exports, "registerRoot", { enumerable: true, get: function () { return register_root_1.registerRoot; } });
+var Sequence_1 = require("./Sequence");
+Object.defineProperty(exports, "Sequence", { enumerable: true, get: function () { return Sequence_1.Sequence; } });
+var series_1 = require("./series");
+Object.defineProperty(exports, "Series", { enumerable: true, get: function () { return series_1.Series; } });
+__exportStar(require("./spring"), exports);
+var static_file_1 = require("./static-file");
+Object.defineProperty(exports, "staticFile", { enumerable: true, get: function () { return static_file_1.staticFile; } });
+__exportStar(require("./Still"), exports);
+var use_current_frame_1 = require("./use-current-frame");
+Object.defineProperty(exports, "useCurrentFrame", { enumerable: true, get: function () { return use_current_frame_1.useCurrentFrame; } });
+__exportStar(require("./use-video-config"), exports);
+__exportStar(require("./version"), exports);
+__exportStar(require("./video"), exports);
+__exportStar(require("./video-config"), exports);
+exports.Experimental = {
+    Clipper: Clipper_1.Clipper,
+    Null: Null_1.Null,
+    useIsPlayer: is_player_1.useIsPlayer,
+};

package/dist/internals.d.ts

@@ -0,0 +1,100 @@
+import type { Configuration } from 'webpack';
+import type { CompProps } from './Composition';
+import type { CompositionManagerContext, TAsset, TCompMetadata, TComposition, TSequence } from './CompositionManager';
+import * as CSSUtils from './default-css';
+import type { RemotionEnvironment } from './get-environment';
+import type { SetTimelineContextValue, TimelineContextValue } from './timeline-position-state';
+import * as TimelinePosition from './timeline-position-state';
+import { truthy } from './truthy';
+import type { MediaVolumeContextValue, SetMediaVolumeContextValue } from './volume-position-state';
+import { useRemotionContexts } from './wrap-remotion-context';
+declare const Timeline: typeof TimelinePosition;
+export declare const Internals: {
+    useUnsafeVideoConfig: () => import("./video-config").VideoConfig | null;
+    Timeline: typeof TimelinePosition;
+    CompositionManager: import("react").Context<CompositionManagerContext>;
+    RemotionRoot: import("react").FC<{
+        children: import("react").ReactNode;
+        numberOfAudioTags: number;
+    }>;
+    useVideo: () => {
+        height: number;
+        width: number;
+        fps: number;
+        durationInFrames: number;
+        defaultProps: unknown;
+        id: string;
+        folderName: string | null;
+        parentFolderName: string | null;
+        component: import("react").LazyExoticComponent<import("react").ComponentType<unknown>>;
+        nonce: number;
+    } | null;
+    getRoot: () => import("react").FC<{}> | null;
+    useMediaVolumeState: () => readonly [number, (u: number) => void];
+    useMediaMutedState: () => readonly [boolean, (u: import("react").SetStateAction<boolean>) => void];
+    useLazyComponent: <T>(compProps: CompProps<T>) => import("react").ExoticComponent<(import("react").PropsWithoutRef<T> & import("react").RefAttributes<import("react").Component<T, any, any>>) | import("react").PropsWithRef<T>> & {
+        readonly _result: import("react").ComponentType<T>;
+    };
+    truthy: typeof truthy;
+    SequenceContext: import("react").Context<import("./Sequence").SequenceContextType | null>;
+    useRemotionContexts: typeof useRemotionContexts;
+    RemotionContextProvider: (props: import("./wrap-remotion-context").RemotionContextProviderProps) => JSX.Element;
+    CSSUtils: typeof CSSUtils;
+    setupEnvVariables: () => void;
+    ENV_VARIABLES_ENV_NAME: "ENV_VARIABLES";
+    MediaVolumeContext: import("react").Context<MediaVolumeContextValue>;
+    SetMediaVolumeContext: import("react").Context<SetMediaVolumeContextValue>;
+    validateDurationInFrames: (durationInFrames: number, component: string) => void;
+    validateFps: (fps: number, location: string, isGif: boolean) => void;
+    validateDimension: (amount: number, nameOfProp: string, location: string) => void;
+    getRemotionEnvironment: () => RemotionEnvironment;
+    SharedAudioContext: import("react").Context<{
+        registerAudio: (aud: import("./audio").RemotionAudioProps, audioId: string) => {
+            id: number;
+            props: import("./audio").RemotionAudioProps;
+            el: import("react").RefObject<HTMLAudioElement>;
+            audioId: string;
+        };
+        unregisterAudio: (id: number) => void;
+        updateAudio: (options: {
+            id: number;
+            aud: import("./audio").RemotionAudioProps;
+            audioId: string;
+        }) => void;
+        playAllAudios: () => void;
+        numberOfAudioTags: number;
+    } | null>;
+    SharedAudioContextProvider: import("react").FC<{
+        numberOfAudioTags: number;
+        children: import("react").ReactNode;
+    }>;
+    invalidCompositionErrorMessage: string;
+    isCompositionIdValid: (id: string) => RegExpMatchArray | null;
+    getPreviewDomElement: () => HTMLElement | null;
+    compositionsRef: import("react").RefObject<{
+        getCompositions: () => TCompMetadata[];
+    }>;
+    DELAY_RENDER_CALLSTACK_TOKEN: string;
+    portalNode: () => HTMLElement;
+    waitForRoot: (fn: (comp: import("react").FC<{}>) => void) => () => void;
+    validateOffthreadVideoImageFormat: (input: unknown) => void;
+    CanUseRemotionHooksProvider: import("react").FC<{
+        children: import("react").ReactNode;
+    }>;
+    CanUseRemotionHooks: import("react").Context<boolean>;
+    enableLegacyRemotionConfig: () => void;
+    PrefetchProvider: import("react").FC<{
+        children: import("react").ReactNode;
+    }>;
+    DurationsContextProvider: import("react").FC<{
+        children: import("react").ReactNode;
+    }>;
+    IsPlayerContextProvider: import("react").FC<{
+        children?: import("react").ReactNode;
+    }>;
+    useIsPlayer: () => boolean;
+    useRemotionEnvironment: () => RemotionEnvironment;
+};
+declare type WebpackConfiguration = Configuration;
+declare type WebpackOverrideFn = (currentConfiguration: WebpackConfiguration) => WebpackConfiguration;
+export type { TComposition, Timeline, TCompMetadata, TSequence, WebpackOverrideFn, WebpackConfiguration, TAsset, TimelineContextValue, SetTimelineContextValue, CompProps, CompositionManagerContext, MediaVolumeContextValue, SetMediaVolumeContextValue, RemotionEnvironment, };

package/dist/internals.js

@@ -0,0 +1,99 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Internals = void 0;
+const config_1 = require("./config");
+const shared_audio_tags_1 = require("./audio/shared-audio-tags");
+const CanUseRemotionHooks_1 = require("./CanUseRemotionHooks");
+const CompositionManager_1 = require("./CompositionManager");
+const CSSUtils = __importStar(require("./default-css"));
+const delay_render_1 = require("./delay-render");
+const get_environment_1 = require("./get-environment");
+const get_preview_dom_element_1 = require("./get-preview-dom-element");
+const is_player_1 = require("./is-player");
+const portal_node_1 = require("./portal-node");
+const prefetch_state_1 = require("./prefetch-state");
+const register_root_1 = require("./register-root");
+const RemotionRoot_1 = require("./RemotionRoot");
+const Sequence_1 = require("./Sequence");
+const setup_env_variables_1 = require("./setup-env-variables");
+const TimelinePosition = __importStar(require("./timeline-position-state"));
+const truthy_1 = require("./truthy");
+const use_lazy_component_1 = require("./use-lazy-component");
+const use_unsafe_video_config_1 = require("./use-unsafe-video-config");
+const use_video_1 = require("./use-video");
+const validate_composition_id_1 = require("./validation/validate-composition-id");
+const validate_dimensions_1 = require("./validation/validate-dimensions");
+const validate_duration_in_frames_1 = require("./validation/validate-duration-in-frames");
+const validate_fps_1 = require("./validation/validate-fps");
+const validate_offthreadvideo_image_format_1 = require("./validation/validate-offthreadvideo-image-format");
+const duration_state_1 = require("./video/duration-state");
+const volume_position_state_1 = require("./volume-position-state");
+const wrap_remotion_context_1 = require("./wrap-remotion-context");
+const Timeline = TimelinePosition;
+// Mark them as Internals so use don't assume this is public
+// API and are less likely to use it
+exports.Internals = {
+    useUnsafeVideoConfig: use_unsafe_video_config_1.useUnsafeVideoConfig,
+    Timeline,
+    CompositionManager: CompositionManager_1.CompositionManager,
+    RemotionRoot: RemotionRoot_1.RemotionRoot,
+    useVideo: use_video_1.useVideo,
+    getRoot: register_root_1.getRoot,
+    useMediaVolumeState: volume_position_state_1.useMediaVolumeState,
+    useMediaMutedState: volume_position_state_1.useMediaMutedState,
+    useLazyComponent: use_lazy_component_1.useLazyComponent,
+    truthy: truthy_1.truthy,
+    SequenceContext: Sequence_1.SequenceContext,
+    useRemotionContexts: wrap_remotion_context_1.useRemotionContexts,
+    RemotionContextProvider: wrap_remotion_context_1.RemotionContextProvider,
+    CSSUtils,
+    setupEnvVariables: setup_env_variables_1.setupEnvVariables,
+    ENV_VARIABLES_ENV_NAME: setup_env_variables_1.ENV_VARIABLES_ENV_NAME,
+    MediaVolumeContext: volume_position_state_1.MediaVolumeContext,
+    SetMediaVolumeContext: volume_position_state_1.SetMediaVolumeContext,
+    validateDurationInFrames: validate_duration_in_frames_1.validateDurationInFrames,
+    validateFps: validate_fps_1.validateFps,
+    validateDimension: validate_dimensions_1.validateDimension,
+    getRemotionEnvironment: get_environment_1.getRemotionEnvironment,
+    SharedAudioContext: shared_audio_tags_1.SharedAudioContext,
+    SharedAudioContextProvider: shared_audio_tags_1.SharedAudioContextProvider,
+    invalidCompositionErrorMessage: validate_composition_id_1.invalidCompositionErrorMessage,
+    isCompositionIdValid: validate_composition_id_1.isCompositionIdValid,
+    getPreviewDomElement: get_preview_dom_element_1.getPreviewDomElement,
+    compositionsRef: CompositionManager_1.compositionsRef,
+    DELAY_RENDER_CALLSTACK_TOKEN: delay_render_1.DELAY_RENDER_CALLSTACK_TOKEN,
+    portalNode: portal_node_1.portalNode,
+    waitForRoot: register_root_1.waitForRoot,
+    validateOffthreadVideoImageFormat: validate_offthreadvideo_image_format_1.validateOffthreadVideoImageFormat,
+    CanUseRemotionHooksProvider: CanUseRemotionHooks_1.CanUseRemotionHooksProvider,
+    CanUseRemotionHooks: CanUseRemotionHooks_1.CanUseRemotionHooks,
+    enableLegacyRemotionConfig: config_1.enableLegacyRemotionConfig,
+    PrefetchProvider: prefetch_state_1.PrefetchProvider,
+    DurationsContextProvider: duration_state_1.DurationsContextProvider,
+    IsPlayerContextProvider: is_player_1.IsPlayerContextProvider,
+    useIsPlayer: is_player_1.useIsPlayer,
+    useRemotionEnvironment: get_environment_1.useRemotionEnvironment,
+};

package/dist/interpolate-colors.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Copied from:
+ * https://github.com/software-mansion/react-native-reanimated/blob/master/src/reanimated2/Colors.ts
+ */
+export declare const interpolateColors: (input: number, inputRange: readonly number[], outputRange: readonly string[]) => string;