remotion 4.0.514 → 4.0.515

package/dist/cjs/internals.d.ts

@@ -27,6 +27,15 @@ export type { EffectChainState } from './effects/run-effect-chain.js';
 export declare const Internals: {
     readonly AbsoluteFillElement: import("react").ForwardRefExoticComponent<Omit<import("./AbsoluteFillElement.js").AbsoluteFillElementProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     readonly MaxMediaCacheSizeContext: import("react").Context<number | null>;
+    readonly getMediabunnyInputResourceKey: ({ src, credentials, requestInitFingerprint, revision, }: {
+        src: string;
+        credentials: RequestCredentials | null;
+        requestInitFingerprint: unknown;
+        revision: string | null;
+    }) => string;
+    readonly globalMediaResourceManager: import("./media-resource-manager.js").MediaResourceManager;
+    readonly makeMediaResourceManager: () => import("./media-resource-manager.js").MediaResourceManager;
+    readonly MEDIABUNNY_DURATION_VALUE_KEY: "mediabunny-duration";
     readonly makeRenderResourceManager: () => import("./render-resource-manager.js").RenderResourceManager;
     readonly RenderResourceManagerContext: import("react").Context<import("./render-resource-manager.js").RenderResourceManager | null>;
     readonly useUnsafeVideoConfig: () => import("./video-config.js").VideoConfig | null;

package/dist/cjs/internals.js

@@ -70,6 +70,7 @@ const is_player_js_1 = require("./is-player.js");
 const log_level_context_js_1 = require("./log-level-context.js");
 const log_js_1 = require("./log.js");
 const max_video_cache_size_js_1 = require("./max-video-cache-size.js");
+const media_resource_manager_js_1 = require("./media-resource-manager.js");
 const nonce_js_1 = require("./nonce.js");
 const playback_logging_js_1 = require("./playback-logging.js");
 const portal_node_js_1 = require("./portal-node.js");
@@ -126,6 +127,10 @@ const compositionSelectorRef = (0, react_1.createRef)();
 exports.Internals = {
     AbsoluteFillElement: AbsoluteFillElement_js_1.AbsoluteFillElement,
     MaxMediaCacheSizeContext: max_video_cache_size_js_1.MaxMediaCacheSizeContext,
+    getMediabunnyInputResourceKey: media_resource_manager_js_1.getMediabunnyInputResourceKey,
+    globalMediaResourceManager: media_resource_manager_js_1.globalMediaResourceManager,
+    makeMediaResourceManager: media_resource_manager_js_1.makeMediaResourceManager,
+    MEDIABUNNY_DURATION_VALUE_KEY: media_resource_manager_js_1.MEDIABUNNY_DURATION_VALUE_KEY,
     makeRenderResourceManager: render_resource_manager_js_1.makeRenderResourceManager,
     RenderResourceManagerContext: render_resource_manager_js_1.RenderResourceManagerContext,
     useUnsafeVideoConfig: use_unsafe_video_config_js_1.useUnsafeVideoConfig,

package/dist/cjs/interpolate-translate.d.ts

@@ -0,0 +1,8 @@
+import { type InterpolateOptions } from './interpolate.js';
+export type InterpolateTranslateOptions = InterpolateOptions;
+export declare const interpolateTranslate: (input: number, inputRange: readonly number[], outputRange: readonly string[], options?: Partial<{
+    easing: import("./interpolate.js").EasingFunction | readonly import("./interpolate.js").EasingFunction[];
+    extrapolateLeft: import("./interpolate.js").ExtrapolateType;
+    extrapolateRight: import("./interpolate.js").ExtrapolateType;
+    posterize: number;
+}> | undefined) => string;

package/dist/cjs/interpolate-translate.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.interpolateTranslate = void 0;
+const interpolate_js_1 = require("./interpolate.js");
+const pixelValueRegex = /^([+-]?(?:\d+\.?\d*|\.\d+))px$/;
+const parseTranslate = (value) => {
+    if (typeof value !== 'string') {
+        throw new TypeError(`outputRange must contain only strings, but got ${typeof value}`);
+    }
+    const parts = value.trim().split(/\s+/);
+    if (parts.length < 1 || parts.length > 3 || parts[0] === '') {
+        throw new TypeError(`translate values must contain 1 to 3 pixel values, but got "${value}"`);
+    }
+    return parts.map((part) => {
+        const match = pixelValueRegex.exec(part);
+        if (match === null) {
+            throw new TypeError(`interpolateTranslate() only supports px values, but got "${part}" in "${value}"`);
+        }
+        return Number(match[1]);
+    });
+};
+/*
+ * @description Allows you to map a range of values to CSS translate values using pixel units.
+ * @see [Documentation](https://remotion.dev/docs/interpolate-translate)
+ */
+const interpolateTranslate = (input, inputRange, outputRange, options) => {
+    var _a;
+    if (typeof input === 'undefined') {
+        throw new TypeError('input can not be undefined');
+    }
+    if (typeof inputRange === 'undefined') {
+        throw new TypeError('inputRange can not be undefined');
+    }
+    if (typeof outputRange === 'undefined') {
+        throw new TypeError('outputRange can not be undefined');
+    }
+    if (inputRange.length !== outputRange.length) {
+        throw new TypeError('inputRange (' +
+            inputRange.length +
+            ' values provided) and outputRange (' +
+            outputRange.length +
+            ' values provided) must have the same length');
+    }
+    const parsedOutputRange = outputRange.map((translateValue) => parseTranslate(translateValue));
+    const firstValueLength = (_a = parsedOutputRange[0]) === null || _a === void 0 ? void 0 : _a.length;
+    if (firstValueLength === undefined) {
+        throw new TypeError('outputRange must have at least 1 element');
+    }
+    for (const parsedTranslate of parsedOutputRange) {
+        if (parsedTranslate.length !== firstValueLength) {
+            throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${parsedTranslate.length}`);
+        }
+    }
+    return new Array(firstValueLength)
+        .fill(true)
+        .map((_, index) => {
+        const outputValues = [];
+        for (const translateValue of parsedOutputRange) {
+            const value = translateValue[index];
+            if (value === undefined) {
+                throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${translateValue.length}`);
+            }
+            outputValues.push(value);
+        }
+        const interpolatedValue = (0, interpolate_js_1.interpolate)(input, inputRange, outputValues, options);
+        return `${interpolatedValue}px`;
+    })
+        .join(' ');
+};
+exports.interpolateTranslate = interpolateTranslate;

package/dist/cjs/media-resource-manager.d.ts

@@ -0,0 +1,25 @@
+export type MediaResourceLease<T> = {
+    resource: T;
+    getOrCreateValue: <Value>(key: string, create: () => Value) => Value;
+    release: () => void;
+};
+export type MediaResourceManager = {
+    acquire: <T>({ key, create }: {
+        key: string;
+        create: () => {
+            resource: T;
+            dispose: () => void;
+        };
+    }) => MediaResourceLease<T>;
+    invalidate: (key: string) => void;
+    dispose: () => void;
+};
+export declare const makeMediaResourceManager: () => MediaResourceManager;
+export declare const getMediabunnyInputResourceKey: ({ src, credentials, requestInitFingerprint, revision, }: {
+    src: string;
+    credentials: RequestCredentials | null;
+    requestInitFingerprint: unknown;
+    revision: string | null;
+}) => string;
+export declare const MEDIABUNNY_DURATION_VALUE_KEY = "mediabunny-duration";
+export declare const globalMediaResourceManager: MediaResourceManager;

package/dist/cjs/media-resource-manager.js

@@ -0,0 +1,112 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.globalMediaResourceManager = exports.MEDIABUNNY_DURATION_VALUE_KEY = exports.getMediabunnyInputResourceKey = exports.makeMediaResourceManager = void 0;
+const disposeResource = (resource) => {
+    if (resource.disposed) {
+        return;
+    }
+    resource.disposed = true;
+    resource.values.clear();
+    resource.dispose();
+};
+const makeMediaResourceManager = () => {
+    const resources = new Map();
+    let disposed = false;
+    return {
+        acquire: ({ key, create, }) => {
+            if (disposed) {
+                throw new Error('Media resource manager has already been disposed');
+            }
+            let entry = resources.get(key);
+            if (!entry) {
+                const created = create();
+                entry = {
+                    resource: created.resource,
+                    dispose: created.dispose,
+                    refCount: 0,
+                    disposeGeneration: 0,
+                    disposed: false,
+                    values: new Map(),
+                };
+                resources.set(key, entry);
+            }
+            entry.refCount++;
+            entry.disposeGeneration++;
+            let released = false;
+            return {
+                resource: entry.resource,
+                getOrCreateValue: (valueKey, createValue) => {
+                    if (entry.values.has(valueKey)) {
+                        return entry.values.get(valueKey);
+                    }
+                    const value = createValue();
+                    entry.values.set(valueKey, value);
+                    return value;
+                },
+                release: () => {
+                    if (released) {
+                        return;
+                    }
+                    released = true;
+                    entry.refCount--;
+                    if (entry.refCount !== 0) {
+                        return;
+                    }
+                    const disposeGeneration = ++entry.disposeGeneration;
+                    queueMicrotask(() => {
+                        if (entry.refCount !== 0 ||
+                            entry.disposeGeneration !== disposeGeneration) {
+                            return;
+                        }
+                        if (resources.get(key) === entry) {
+                            resources.delete(key);
+                        }
+                        disposeResource(entry);
+                    });
+                },
+            };
+        },
+        invalidate: (key) => {
+            const entry = resources.get(key);
+            if (!entry) {
+                return;
+            }
+            resources.delete(key);
+            entry.disposeGeneration++;
+            if (entry.refCount === 0) {
+                disposeResource(entry);
+            }
+        },
+        dispose: () => {
+            if (disposed) {
+                return;
+            }
+            disposed = true;
+            const entries = Array.from(resources.values());
+            resources.clear();
+            let firstError = null;
+            for (const entry of entries) {
+                try {
+                    disposeResource(entry);
+                }
+                catch (error) {
+                    firstError !== null && firstError !== void 0 ? firstError : (firstError = error);
+                }
+            }
+            if (firstError !== null) {
+                throw firstError;
+            }
+        },
+    };
+};
+exports.makeMediaResourceManager = makeMediaResourceManager;
+const getMediabunnyInputResourceKey = ({ src, credentials, requestInitFingerprint, revision, }) => JSON.stringify([
+    'mediabunny-input',
+    src,
+    credentials,
+    requestInitFingerprint,
+    revision,
+]);
+exports.getMediabunnyInputResourceKey = getMediabunnyInputResourceKey;
+exports.MEDIABUNNY_DURATION_VALUE_KEY = 'mediabunny-duration';
+exports.globalMediaResourceManager = (0, exports.makeMediaResourceManager)();

package/dist/cjs/sequence-field-schema.d.ts

@@ -0,0 +1,425 @@
+export type HiddenFieldSchema = {
+    type: 'hidden';
+    keyframable?: boolean;
+};
+export type NumberFieldSchema = {
+    type: 'number';
+    min?: number;
+    max?: number;
+    step?: number;
+    default: number | null | undefined;
+    description?: string;
+    hiddenFromList: boolean;
+    keyframable?: boolean;
+};
+export type BooleanFieldSchema = {
+    type: 'boolean';
+    default: boolean;
+    description?: string;
+    keyframable?: boolean;
+};
+export type RotationCssFieldSchema = {
+    type: 'rotation-css';
+    step?: number;
+    default: string | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type RotationDegreesFieldSchema = {
+    type: 'rotation-degrees';
+    min?: number;
+    max?: number;
+    step?: number;
+    default: number | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type TranslateFieldSchema = {
+    type: 'translate';
+    step?: number;
+    default: string | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type TransformOriginFieldSchema = {
+    type: 'transform-origin';
+    step?: number;
+    default: string | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type ScaleFieldSchema = {
+    type: 'scale';
+    min?: number;
+    max?: number;
+    step?: number;
+    default: number | string | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type UvCoordinateFieldSchema = {
+    type: 'uv-coordinate';
+    min?: number;
+    max?: number;
+    step?: number;
+    lineTo?: string;
+    default: readonly [number, number] | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type ColorFieldSchema = {
+    type: 'color';
+    default: string | undefined;
+    description?: string;
+    keyframable?: boolean;
+};
+export type EnumFieldSchema = {
+    type: 'enum';
+    default: string;
+    description?: string;
+    variants: Record<string, SequenceSchema>;
+    keyframable?: boolean;
+};
+export type NumberArrayItemSchema = Omit<NumberFieldSchema, 'default' | 'description' | 'hiddenFromList' | 'keyframable'>;
+export type BooleanArrayItemSchema = Omit<BooleanFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type RotationCssArrayItemSchema = Omit<RotationCssFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type RotationDegreesArrayItemSchema = Omit<RotationDegreesFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type TranslateArrayItemSchema = Omit<TranslateFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type UvCoordinateArrayItemSchema = Omit<UvCoordinateFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type ColorArrayItemSchema = Omit<ColorFieldSchema, 'default' | 'description' | 'keyframable'>;
+export type EnumArrayItemSchema = {
+    type: 'enum';
+    variants: readonly string[];
+};
+export type ArrayItemFieldSchema = NumberArrayItemSchema | BooleanArrayItemSchema | RotationCssArrayItemSchema | RotationDegreesArrayItemSchema | TranslateArrayItemSchema | UvCoordinateArrayItemSchema | ColorArrayItemSchema | EnumArrayItemSchema;
+export type ArrayFieldSchema = {
+    type: 'array';
+    item: ArrayItemFieldSchema;
+    default: readonly unknown[] | undefined;
+    minLength?: number;
+    maxLength?: number;
+    newItemDefault: unknown;
+    description?: string;
+    keyframable?: false;
+};
+export type VisibleFieldSchema = NumberFieldSchema | BooleanFieldSchema | RotationCssFieldSchema | RotationDegreesFieldSchema | TranslateFieldSchema | TransformOriginFieldSchema | ScaleFieldSchema | UvCoordinateFieldSchema | ColorFieldSchema | ArrayFieldSchema | EnumFieldSchema;
+export type SequenceFieldSchema = VisibleFieldSchema | HiddenFieldSchema;
+export type SequenceSchema = {
+    [key: string]: SequenceFieldSchema;
+};
+export type SchemaKeysRecord<S extends SequenceSchema> = Record<keyof S, unknown>;
+export declare const sequenceVisualStyleSchema: {
+    readonly 'style.transformOrigin': {
+        readonly type: "transform-origin";
+        readonly step: 1;
+        readonly default: "50% 50%";
+        readonly description: "Transform origin";
+    };
+    readonly 'style.translate': {
+        readonly type: "translate";
+        readonly step: 1;
+        readonly default: "0px 0px";
+        readonly description: "Offset";
+    };
+    readonly 'style.scale': {
+        readonly type: "scale";
+        readonly max: 100;
+        readonly step: 0.01;
+        readonly default: 1;
+        readonly description: "Scale";
+    };
+    readonly 'style.rotate': {
+        readonly type: "rotation-css";
+        readonly step: 1;
+        readonly default: "0deg";
+        readonly description: "Rotation";
+    };
+    readonly 'style.opacity': {
+        readonly type: "number";
+        readonly min: 0;
+        readonly max: 1;
+        readonly step: 0.01;
+        readonly default: 1;
+        readonly description: "Opacity";
+        readonly hiddenFromList: false;
+    };
+};
+export declare const sequencePremountSchema: {
+    readonly premountFor: {
+        readonly type: "number";
+        readonly default: 0;
+        readonly description: "Premount For";
+        readonly min: 0;
+        readonly step: 1;
+        readonly hiddenFromList: false;
+    };
+    readonly postmountFor: {
+        readonly type: "number";
+        readonly default: 0;
+        readonly min: 0;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly styleWhilePremounted: {
+        readonly type: "hidden";
+    };
+    readonly styleWhilePostmounted: {
+        readonly type: "hidden";
+    };
+};
+export declare const sequenceStyleSchema: {
+    readonly 'style.transformOrigin': {
+        readonly type: "transform-origin";
+        readonly step: 1;
+        readonly default: "50% 50%";
+        readonly description: "Transform origin";
+    };
+    readonly 'style.translate': {
+        readonly type: "translate";
+        readonly step: 1;
+        readonly default: "0px 0px";
+        readonly description: "Offset";
+    };
+    readonly 'style.scale': {
+        readonly type: "scale";
+        readonly max: 100;
+        readonly step: 0.01;
+        readonly default: 1;
+        readonly description: "Scale";
+    };
+    readonly 'style.rotate': {
+        readonly type: "rotation-css";
+        readonly step: 1;
+        readonly default: "0deg";
+        readonly description: "Rotation";
+    };
+    readonly 'style.opacity': {
+        readonly type: "number";
+        readonly min: 0;
+        readonly max: 1;
+        readonly step: 0.01;
+        readonly default: 1;
+        readonly description: "Opacity";
+        readonly hiddenFromList: false;
+    };
+    readonly premountFor: {
+        readonly type: "number";
+        readonly default: 0;
+        readonly description: "Premount For";
+        readonly min: 0;
+        readonly step: 1;
+        readonly hiddenFromList: false;
+    };
+    readonly postmountFor: {
+        readonly type: "number";
+        readonly default: 0;
+        readonly min: 0;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly styleWhilePremounted: {
+        readonly type: "hidden";
+    };
+    readonly styleWhilePostmounted: {
+        readonly type: "hidden";
+    };
+};
+export declare const hiddenField: SequenceFieldSchema;
+export declare const sequenceNameField: SequenceFieldSchema;
+export declare const extendSchemaWithSequenceName: <S extends SequenceSchema>(schema: S) => S & {
+    name: SequenceFieldSchema;
+};
+export declare const durationInFramesField: {
+    readonly type: "number";
+    readonly default: undefined;
+    readonly min: 1;
+    readonly step: 1;
+    readonly hiddenFromList: true;
+};
+export declare const fromField: {
+    readonly type: "number";
+    readonly default: 0;
+    readonly step: 1;
+    readonly hiddenFromList: true;
+};
+export declare const freezeField: {
+    readonly type: "number";
+    readonly default: null;
+    readonly step: 1;
+    readonly hiddenFromList: true;
+};
+export declare const sequenceSchema: {
+    readonly hidden: BooleanFieldSchema;
+    readonly showInTimeline: HiddenFieldSchema;
+    readonly from: {
+        readonly type: "number";
+        readonly default: 0;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly freeze: {
+        readonly type: "number";
+        readonly default: null;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly durationInFrames: {
+        readonly type: "number";
+        readonly default: undefined;
+        readonly min: 1;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly layout: {
+        readonly type: "enum";
+        readonly default: "absolute-fill";
+        readonly description: "Layout";
+        readonly variants: {
+            readonly 'absolute-fill': {
+                readonly 'style.transformOrigin': {
+                    readonly type: "transform-origin";
+                    readonly step: 1;
+                    readonly default: "50% 50%";
+                    readonly description: "Transform origin";
+                };
+                readonly 'style.translate': {
+                    readonly type: "translate";
+                    readonly step: 1;
+                    readonly default: "0px 0px";
+                    readonly description: "Offset";
+                };
+                readonly 'style.scale': {
+                    readonly type: "scale";
+                    readonly max: 100;
+                    readonly step: 0.01;
+                    readonly default: 1;
+                    readonly description: "Scale";
+                };
+                readonly 'style.rotate': {
+                    readonly type: "rotation-css";
+                    readonly step: 1;
+                    readonly default: "0deg";
+                    readonly description: "Rotation";
+                };
+                readonly 'style.opacity': {
+                    readonly type: "number";
+                    readonly min: 0;
+                    readonly max: 1;
+                    readonly step: 0.01;
+                    readonly default: 1;
+                    readonly description: "Opacity";
+                    readonly hiddenFromList: false;
+                };
+                readonly premountFor: {
+                    readonly type: "number";
+                    readonly default: 0;
+                    readonly description: "Premount For";
+                    readonly min: 0;
+                    readonly step: 1;
+                    readonly hiddenFromList: false;
+                };
+                readonly postmountFor: {
+                    readonly type: "number";
+                    readonly default: 0;
+                    readonly min: 0;
+                    readonly step: 1;
+                    readonly hiddenFromList: true;
+                };
+                readonly styleWhilePremounted: {
+                    readonly type: "hidden";
+                };
+                readonly styleWhilePostmounted: {
+                    readonly type: "hidden";
+                };
+            };
+            readonly none: {};
+        };
+    };
+} & {
+    name: SequenceFieldSchema;
+};
+export declare const sequenceSchemaWithoutFrom: {
+    readonly hidden: BooleanFieldSchema;
+    readonly showInTimeline: HiddenFieldSchema;
+    readonly freeze: {
+        readonly type: "number";
+        readonly default: null;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly durationInFrames: {
+        readonly type: "number";
+        readonly default: undefined;
+        readonly min: 1;
+        readonly step: 1;
+        readonly hiddenFromList: true;
+    };
+    readonly layout: {
+        readonly type: "enum";
+        readonly default: "absolute-fill";
+        readonly description: "Layout";
+        readonly variants: {
+            readonly 'absolute-fill': {
+                readonly 'style.transformOrigin': {
+                    readonly type: "transform-origin";
+                    readonly step: 1;
+                    readonly default: "50% 50%";
+                    readonly description: "Transform origin";
+                };
+                readonly 'style.translate': {
+                    readonly type: "translate";
+                    readonly step: 1;
+                    readonly default: "0px 0px";
+                    readonly description: "Offset";
+                };
+                readonly 'style.scale': {
+                    readonly type: "scale";
+                    readonly max: 100;
+                    readonly step: 0.01;
+                    readonly default: 1;
+                    readonly description: "Scale";
+                };
+                readonly 'style.rotate': {
+                    readonly type: "rotation-css";
+                    readonly step: 1;
+                    readonly default: "0deg";
+                    readonly description: "Rotation";
+                };
+                readonly 'style.opacity': {
+                    readonly type: "number";
+                    readonly min: 0;
+                    readonly max: 1;
+                    readonly step: 0.01;
+                    readonly default: 1;
+                    readonly description: "Opacity";
+                    readonly hiddenFromList: false;
+                };
+                readonly premountFor: {
+                    readonly type: "number";
+                    readonly default: 0;
+                    readonly description: "Premount For";
+                    readonly min: 0;
+                    readonly step: 1;
+                    readonly hiddenFromList: false;
+                };
+                readonly postmountFor: {
+                    readonly type: "number";
+                    readonly default: 0;
+                    readonly min: 0;
+                    readonly step: 1;
+                    readonly hiddenFromList: true;
+                };
+                readonly styleWhilePremounted: {
+                    readonly type: "hidden";
+                };
+                readonly styleWhilePostmounted: {
+                    readonly type: "hidden";
+                };
+            };
+            readonly none: {};
+        };
+    };
+} & {
+    name: SequenceFieldSchema;
+};
+export declare const sequenceSchemaDefaultLayoutNone: SequenceSchema;

package/dist/cjs/sequence-field-schema.js

@@ -0,0 +1,133 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sequenceSchemaDefaultLayoutNone = exports.sequenceSchemaWithoutFrom = exports.sequenceSchema = exports.freezeField = exports.fromField = exports.durationInFramesField = exports.extendSchemaWithSequenceName = exports.sequenceNameField = exports.hiddenField = exports.sequenceStyleSchema = exports.sequencePremountSchema = exports.sequenceVisualStyleSchema = void 0;
+exports.sequenceVisualStyleSchema = {
+    'style.transformOrigin': {
+        type: 'transform-origin',
+        step: 1,
+        default: '50% 50%',
+        description: 'Transform origin',
+    },
+    'style.translate': {
+        type: 'translate',
+        step: 1,
+        default: '0px 0px',
+        description: 'Offset',
+    },
+    'style.scale': {
+        type: 'scale',
+        max: 100,
+        step: 0.01,
+        default: 1,
+        description: 'Scale',
+    },
+    'style.rotate': {
+        type: 'rotation-css',
+        step: 1,
+        default: '0deg',
+        description: 'Rotation',
+    },
+    'style.opacity': {
+        type: 'number',
+        min: 0,
+        max: 1,
+        step: 0.01,
+        default: 1,
+        description: 'Opacity',
+        hiddenFromList: false,
+    },
+};
+exports.sequencePremountSchema = {
+    premountFor: {
+        type: 'number',
+        default: 0,
+        description: 'Premount For',
+        min: 0,
+        step: 1,
+        hiddenFromList: false,
+    },
+    postmountFor: {
+        type: 'number',
+        default: 0,
+        min: 0,
+        step: 1,
+        hiddenFromList: true,
+    },
+    styleWhilePremounted: {
+        type: 'hidden',
+    },
+    styleWhilePostmounted: {
+        type: 'hidden',
+    },
+};
+exports.sequenceStyleSchema = {
+    ...exports.sequenceVisualStyleSchema,
+    ...exports.sequencePremountSchema,
+};
+exports.hiddenField = {
+    type: 'boolean',
+    default: false,
+    description: 'Hidden',
+};
+const showInTimelineField = {
+    type: 'hidden',
+};
+exports.sequenceNameField = {
+    type: 'hidden',
+};
+const extendSchemaWithSequenceName = (schema) => {
+    return {
+        name: exports.sequenceNameField,
+        ...schema,
+    };
+};
+exports.extendSchemaWithSequenceName = extendSchemaWithSequenceName;
+exports.durationInFramesField = {
+    type: 'number',
+    default: undefined,
+    min: 1,
+    step: 1,
+    hiddenFromList: true,
+};
+exports.fromField = {
+    type: 'number',
+    default: 0,
+    step: 1,
+    hiddenFromList: true,
+};
+exports.freezeField = {
+    type: 'number',
+    default: null,
+    step: 1,
+    hiddenFromList: true,
+};
+exports.sequenceSchema = (0, exports.extendSchemaWithSequenceName)({
+    hidden: exports.hiddenField,
+    showInTimeline: showInTimelineField,
+    from: exports.fromField,
+    freeze: exports.freezeField,
+    durationInFrames: exports.durationInFramesField,
+    layout: {
+        type: 'enum',
+        default: 'absolute-fill',
+        description: 'Layout',
+        variants: {
+            'absolute-fill': exports.sequenceStyleSchema,
+            none: {},
+        },
+    },
+});
+exports.sequenceSchemaWithoutFrom = (0, exports.extendSchemaWithSequenceName)({
+    hidden: exports.hiddenField,
+    showInTimeline: showInTimelineField,
+    freeze: exports.freezeField,
+    durationInFrames: exports.durationInFramesField,
+    layout: exports.sequenceSchema.layout,
+});
+exports.sequenceSchemaDefaultLayoutNone = {
+    ...exports.sequenceSchema,
+    layout: {
+        ...exports.sequenceSchema.layout,
+        default: 'none',
+    },
+};

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-export declare const VERSION = "4.0.514";
+export declare const VERSION = "4.0.515";

package/dist/cjs/version.js

@@ -7,4 +7,4 @@ exports.VERSION = void 0;
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-exports.VERSION = '4.0.514';
+exports.VERSION = '4.0.515';

package/dist/cjs/wrap-in-schema.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { SequenceControls } from './CompositionManager.js';
+import { type SequenceSchema } from './sequence-field-schema.js';
+export declare const getNestedValue: (obj: Record<string, unknown>, key: string) => unknown;
+export declare const readValuesFromProps: (props: Record<string, unknown>, keys: string[]) => Record<string, unknown>;
+export declare const selectActiveKeys: (schema: SequenceSchema, values: Record<string, unknown>) => string[];
+export declare const mergeValues: ({ props, valuesDotNotation, schemaKeys, propsToDelete, }: {
+    props: Record<string, unknown>;
+    valuesDotNotation: Record<string, unknown>;
+    schemaKeys: string[];
+    propsToDelete: Set<string>;
+}) => Record<string, unknown>;
+export declare const wrapInSchema: <S extends SequenceSchema, Props extends object>({ Component, componentIdentity, schema, supportsEffects, }: {
+    Component: React.ComponentType<Props & {
+        readonly _experimentalControls: SequenceControls | undefined;
+    }>;
+    componentIdentity: string | null;
+    schema: S;
+    supportsEffects: boolean;
+}) => React.ComponentType<Props>;

package/dist/cjs/wrap-in-schema.js

@@ -0,0 +1,203 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wrapInSchema = exports.mergeValues = exports.selectActiveKeys = exports.readValuesFromProps = exports.getNestedValue = void 0;
+const react_1 = __importStar(require("react"));
+const delete_nested_key_js_1 = require("./delete-nested-key.js");
+const use_memoized_effects_js_1 = require("./effects/use-memoized-effects.js");
+const flatten_schema_js_1 = require("./flatten-schema.js");
+const sequence_field_schema_js_1 = require("./sequence-field-schema.js");
+const sequence_node_path_js_1 = require("./sequence-node-path.js");
+const SequenceManager_js_1 = require("./SequenceManager.js");
+const use_current_frame_js_1 = require("./use-current-frame.js");
+const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
+const use_schema_js_1 = require("./use-schema.js");
+const getNestedValue = (obj, key) => {
+    const parts = key.split('.');
+    let current = obj;
+    for (const part of parts) {
+        if (current === null ||
+            current === undefined ||
+            typeof current !== 'object')
+            return undefined;
+        current = current[part];
+    }
+    return current;
+};
+exports.getNestedValue = getNestedValue;
+const readValuesFromProps = (props, keys) => {
+    const out = {};
+    for (const key of keys) {
+        out[key] = (0, exports.getNestedValue)(props, key);
+    }
+    return out;
+};
+exports.readValuesFromProps = readValuesFromProps;
+const selectActiveKeys = (schema, values) => {
+    return Object.keys((0, flatten_schema_js_1.flattenActiveSchema)(schema, (key) => values[key]));
+};
+exports.selectActiveKeys = selectActiveKeys;
+const mergeValues = ({ props, valuesDotNotation, schemaKeys, propsToDelete, }) => {
+    const merged = { ...props };
+    for (const key of schemaKeys) {
+        const value = valuesDotNotation[key];
+        const parts = key.split('.');
+        if (parts.length === 1) {
+            merged[key] = value;
+            continue;
+        }
+        // For dot-notation keys like 'style.opacity',
+        // clone and set the nested path
+        let current = merged;
+        for (let i = 0; i < parts.length - 1; i++) {
+            const part = parts[i];
+            if (typeof current[part] === 'object' && current[part] !== null) {
+                current[part] = { ...current[part] };
+            }
+            else {
+                current[part] = {};
+            }
+            current = current[part];
+        }
+        current[parts[parts.length - 1]] = value;
+    }
+    (0, delete_nested_key_js_1.deleteNestedKey)(merged, propsToDelete);
+    return merged;
+};
+exports.mergeValues = mergeValues;
+const stackToOverrideMap = {};
+const wrapInSchema = ({ Component, componentIdentity, schema, supportsEffects, }) => {
+    // Schema is static for a component, so we move this outside
+    const schemaWithSequenceName = (0, sequence_field_schema_js_1.extendSchemaWithSequenceName)(schema);
+    const flatSchema = (0, flatten_schema_js_1.getFlatSchemaWithAllKeys)(schemaWithSequenceName);
+    const flatKeys = Object.keys(flatSchema);
+    const Wrapped = (0, react_1.forwardRef)((props, ref) => {
+        var _a;
+        const env = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
+        if (!env.isStudio || env.isReadOnlyStudio || env.isRendering) {
+            return react_1.default.createElement(Component, {
+                ...props,
+                _experimentalControls: null,
+                ref,
+            });
+        }
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const { propStatuses } = (0, react_1.useContext)(SequenceManager_js_1.VisualModePropStatusesContext);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const { getDragOverrides } = (0, react_1.useContext)(SequenceManager_js_1.VisualModeDragOverridesContext);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const nodePathMapping = (0, react_1.useContext)(sequence_node_path_js_1.OverrideIdsToNodePathsGettersContext);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const frame = (0, use_current_frame_js_1.useCurrentFrame)();
+        // If the parent has passed `_experimentalControls`, we should not override it.
+        // @ts-expect-error
+        if (props._experimentalControls) {
+            return react_1.default.createElement(Component, {
+                ...props,
+                ref,
+            });
+        }
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const [overrideId] = (0, react_1.useState)(() => {
+            const { stack } = props;
+            if (!stack) {
+                return String(Math.random());
+            }
+            const existingOverrideId = stackToOverrideMap[stack];
+            if (existingOverrideId) {
+                return existingOverrideId;
+            }
+            const newOverrideId = String(Math.random());
+            stackToOverrideMap[stack] = newOverrideId;
+            return newOverrideId;
+        });
+        const nodePath = (_a = nodePathMapping.overrideIdToNodePathMappings[overrideId]) !== null && _a !== void 0 ? _a : null;
+        // Read the runtime values for every flat key from the JSX props,
+        // memoized on the leaf values so the object reference is stable
+        // when nothing changed — otherwise downstream `useMemo`s churn and
+        // effects (e.g. Sequence registration) re-fire every render.
+        const runtimeValues = flatKeys.map((k) => (0, exports.getNestedValue)(props, k));
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const currentRuntimeValueDotNotation = (0, react_1.useMemo)(() => (0, exports.readValuesFromProps)(props, flatKeys), 
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+        runtimeValues);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const controls = (0, react_1.useMemo)(() => {
+            return {
+                schema: schemaWithSequenceName,
+                currentRuntimeValueDotNotation,
+                overrideId,
+                supportsEffects,
+                componentIdentity,
+            };
+        }, [currentRuntimeValueDotNotation, overrideId]);
+        // 3. Apply drag/code overrides on top of the runtime values.
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const { merged: valuesDotNotation, propsToDelete } = (0, react_1.useMemo)(() => {
+            return (0, use_schema_js_1.computeEffectiveSchemaValuesDotNotation)({
+                schema: schemaWithSequenceName,
+                currentValue: currentRuntimeValueDotNotation,
+                overrideValues: nodePath === null ? {} : getDragOverrides(nodePath),
+                propStatus: nodePath === null
+                    ? undefined
+                    : (0, use_memoized_effects_js_1.getPropStatusesCtx)(propStatuses, nodePath),
+                frame,
+            });
+        }, [
+            currentRuntimeValueDotNotation,
+            getDragOverrides,
+            nodePath,
+            propStatuses,
+            frame,
+        ]);
+        // 4. Eliminate values forbidden by the resolved discriminated union.
+        const activeKeys = (0, exports.selectActiveKeys)(schemaWithSequenceName, valuesDotNotation);
+        // 5. Apply the active values back onto the props.
+        const mergedProps = (0, exports.mergeValues)({
+            props: props,
+            valuesDotNotation,
+            schemaKeys: activeKeys,
+            propsToDelete,
+        });
+        return react_1.default.createElement(Component, {
+            ...mergedProps,
+            _experimentalControls: controls,
+            ref,
+        });
+    });
+    Wrapped.displayName = `wrapInSchema(${Component.displayName || Component.name || 'Component'})`;
+    return Wrapped;
+};
+exports.wrapInSchema = wrapInSchema;

package/dist/esm/index.mjs

@@ -1352,7 +1352,7 @@ var getSingleChildComponent = (children) => {
 };
 
 // src/version.ts
-var VERSION = "4.0.514";
+var VERSION = "4.0.515";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -11870,6 +11870,121 @@ var getPreviewDomElement = () => {
 import React33 from "react";
 var MaxMediaCacheSizeContext = React33.createContext(null);
 
+// src/media-resource-manager.ts
+var disposeResource = (resource) => {
+  if (resource.disposed) {
+    return;
+  }
+  resource.disposed = true;
+  resource.values.clear();
+  resource.dispose();
+};
+var makeMediaResourceManager = () => {
+  const resources = new Map;
+  let disposed = false;
+  return {
+    acquire: ({
+      key,
+      create
+    }) => {
+      if (disposed) {
+        throw new Error("Media resource manager has already been disposed");
+      }
+      let entry = resources.get(key);
+      if (!entry) {
+        const created = create();
+        entry = {
+          resource: created.resource,
+          dispose: created.dispose,
+          refCount: 0,
+          disposeGeneration: 0,
+          disposed: false,
+          values: new Map
+        };
+        resources.set(key, entry);
+      }
+      entry.refCount++;
+      entry.disposeGeneration++;
+      let released = false;
+      return {
+        resource: entry.resource,
+        getOrCreateValue: (valueKey, createValue) => {
+          if (entry.values.has(valueKey)) {
+            return entry.values.get(valueKey);
+          }
+          const value = createValue();
+          entry.values.set(valueKey, value);
+          return value;
+        },
+        release: () => {
+          if (released) {
+            return;
+          }
+          released = true;
+          entry.refCount--;
+          if (entry.refCount !== 0) {
+            return;
+          }
+          const disposeGeneration = ++entry.disposeGeneration;
+          queueMicrotask(() => {
+            if (entry.refCount !== 0 || entry.disposeGeneration !== disposeGeneration) {
+              return;
+            }
+            if (resources.get(key) === entry) {
+              resources.delete(key);
+            }
+            disposeResource(entry);
+          });
+        }
+      };
+    },
+    invalidate: (key) => {
+      const entry = resources.get(key);
+      if (!entry) {
+        return;
+      }
+      resources.delete(key);
+      entry.disposeGeneration++;
+      if (entry.refCount === 0) {
+        disposeResource(entry);
+      }
+    },
+    dispose: () => {
+      if (disposed) {
+        return;
+      }
+      disposed = true;
+      const entries = Array.from(resources.values());
+      resources.clear();
+      let firstError = null;
+      for (const entry of entries) {
+        try {
+          disposeResource(entry);
+        } catch (error2) {
+          firstError ??= error2;
+        }
+      }
+      if (firstError !== null) {
+        throw firstError;
+      }
+    }
+  };
+};
+var getMediabunnyInputResourceKey = ({
+  src,
+  credentials,
+  requestInitFingerprint,
+  revision
+}) => JSON.stringify([
+  "mediabunny-input",
+  src,
+  credentials,
+  requestInitFingerprint,
+  revision
+]);
+var MEDIABUNNY_DURATION_VALUE_KEY = "mediabunny-duration";
+var globalMediaResourceManager = makeMediaResourceManager();
+
 // src/register-root.ts
 var Root = null;
 var listeners = [];
@@ -13172,6 +13287,10 @@ var compositionSelectorRef = createRef3();
 var Internals = {
   AbsoluteFillElement,
   MaxMediaCacheSizeContext,
+  getMediabunnyInputResourceKey,
+  globalMediaResourceManager,
+  makeMediaResourceManager,
+  MEDIABUNNY_DURATION_VALUE_KEY,
   makeRenderResourceManager,
   RenderResourceManagerContext,
   useUnsafeVideoConfig,

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.514";
+var VERSION = "4.0.515";
 export {
   VERSION
 };

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
 	},
 	"name": "remotion",
-	"version": "4.0.514",
+	"version": "4.0.515",
 	"description": "Make videos programmatically",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
@@ -35,7 +35,7 @@
 		"react-dom": "19.2.3",
 		"webpack": "5.105.0",
 		"zod": "4.4.3",
-		"@remotion/eslint-config-internal": "4.0.514",
+		"@remotion/eslint-config-internal": "4.0.515",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},