remotion 4.0.534 → 4.0.536

package/dist/cjs/SequenceActivityBoundary.js

@@ -0,0 +1,101 @@
+"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.SequenceActivityBoundary = exports.SequenceActivityContent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const sequence_activity_context_js_1 = require("./sequence-activity-context.js");
+const TimelineContext_js_1 = require("./TimelineContext.js");
+const use_video_config_js_1 = require("./use-video-config.js");
+// Resume through the context update, never through a wakeable callback. React
+// 19.2 can retry an already unmounted Activity with a null Offscreen stateNode.
+// Do not retain retry callbacks either: this token is shared by all activities.
+const suspendedActivity = { then: () => undefined };
+const SuspendSequenceActivity = ({ children, dormant }) => {
+    const suspended = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivitySuspensionContext);
+    if (dormant && suspended) {
+        // The hidden Activity retains its last committed children when suspended,
+        // including the metadata used by Studio's timeline registry.
+        throw suspendedActivity;
+    }
+    return children;
+};
+const areActivityChildrenEqual = (previous, next) => {
+    if (Object.is(previous, next)) {
+        return true;
+    }
+    if (Array.isArray(previous) && Array.isArray(next)) {
+        return (previous.length === next.length &&
+            previous.every((child, index) => areActivityChildrenEqual(child, next[index])));
+    }
+    if (!react_1.default.isValidElement(previous) ||
+        !react_1.default.isValidElement(next) ||
+        previous.type !== next.type ||
+        previous.key !== next.key) {
+        return false;
+    }
+    const keys = Object.keys(previous.props);
+    return (keys.length === Object.keys(next.props).length &&
+        keys.every((key) => Object.prototype.hasOwnProperty.call(next.props, key) &&
+            (key === 'children'
+                ? areActivityChildrenEqual(previous.props.children, next.props.children)
+                : Object.is(previous.props[key], next.props[key]))));
+};
+// Parent frame subscriptions often recreate unchanged JSX. Compare element
+// structure and all props instead of ignoring changes to dormant scene props.
+exports.SequenceActivityContent = react_1.default.memo(({ children }) => children, (previous, next) => previous.dormant &&
+    next.dormant &&
+    areActivityChildrenEqual(previous.children, next.children));
+const SequenceActivityBoundary = ({ children, dormant, frame }) => {
+    const parentDormant = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivityDormantContext);
+    const timeline = (0, react_1.useContext)(parentDormant ? sequence_activity_context_js_1.SequenceActivityTimelineContext : TimelineContext_js_1.TimelineContext);
+    const absoluteTime = (0, react_1.useContext)(parentDormant ? sequence_activity_context_js_1.SequenceActivityAbsoluteTimeContext : TimelineContext_js_1.AbsoluteTimeContext);
+    const { id } = (0, use_video_config_js_1.useVideoConfig)();
+    if (timeline === null) {
+        throw new Error('TimelineContext is missing');
+    }
+    const { audioAndVideoTags } = timeline;
+    const dormantTimeline = (0, react_1.useMemo)(() => ({
+        frame: { [id]: frame },
+        isPlaying: () => false,
+        isInsideFreeze: true,
+        audioAndVideoTags,
+    }), [audioAndVideoTags, frame, id]);
+    // Keep the providers and Activity at the same position when activating a
+    // scene. Unlike Freeze, discovery does not reset SequenceContext origins or
+    // disable Series duration inference.
+    return (jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivityDormantContext.Provider, { value: dormant, children: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivityTimelineContext.Provider, { value: dormant ? dormantTimeline : null, children: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivityAbsoluteTimeContext.Provider, { value: dormant ? dormantTimeline : null, children: jsx_runtime_1.jsx(TimelineContext_js_1.TimelineContext.Provider, { value: dormant ? dormantTimeline : timeline, children: jsx_runtime_1.jsx(TimelineContext_js_1.AbsoluteTimeContext.Provider, { value: dormant ? dormantTimeline : absoluteTime, children: jsx_runtime_1.jsx(react_1.default.Activity, { mode: dormant && !parentDormant ? 'hidden' : 'visible', children: jsx_runtime_1.jsx(SuspendSequenceActivity, { dormant: dormant, children: children }) }) }) }) }) }) }));
+};
+exports.SequenceActivityBoundary = SequenceActivityBoundary;

package/dist/cjs/SequenceActivityBudget.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type ActivityCandidate = {
+    readonly id: string;
+    readonly parent: string | null;
+    readonly compositionId: string;
+    readonly from: number;
+    readonly end: number;
+};
+export declare const SequenceActivityBudgetProvider: React.FC<{
+    readonly children: React.ReactNode;
+}>;
+export declare const useSequenceActivityAdmission: (candidate: ActivityCandidate | null) => boolean;
+export {};

package/dist/cjs/SequenceActivityBudget.js

@@ -0,0 +1,196 @@
+"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;
+    };
+})();
+var _a;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSequenceActivityAdmission = exports.SequenceActivityBudgetProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const registry_store_js_1 = require("./registry-store.js");
+const sequence_activity_context_js_1 = require("./sequence-activity-context.js");
+const TimelineContext_js_1 = require("./TimelineContext.js");
+const use_sync_external_store_js_1 = require("./use-sync-external-store.js");
+// Count nested dormant content too: one admitted scene must not be able to
+// recursively mount another thousand expensive scenes behind its Activity.
+const useCommitEffect = (_a = react_1.default.useInsertionEffect) !== null && _a !== void 0 ? _a : react_1.default.useLayoutEffect;
+const createActivityBudget = () => {
+    const registry = (0, registry_store_js_1.createRegistryStore)(new Set());
+    const candidates = new Map();
+    let frame = {};
+    let limit = sequence_activity_context_js_1.DEFAULT_SEQUENCE_ACTIVITY_LIMIT;
+    let scheduled = false;
+    let suspended = false;
+    const schedule = () => {
+        if (scheduled || suspended) {
+            return;
+        }
+        scheduled = true;
+        // Insertion effects run in hidden Activities too. Publish only after the
+        // whole commit, once all candidates and the root playhead are current.
+        queueMicrotask(() => {
+            scheduled = false;
+            if (suspended) {
+                return;
+            }
+            const ranked = [...candidates.values()]
+                .filter((candidate) => candidate.end > candidate.from)
+                .map((candidate) => {
+                var _a;
+                const currentFrame = (_a = frame[candidate.compositionId]) !== null && _a !== void 0 ? _a : 0;
+                return {
+                    candidate,
+                    distance: Math.max(0, candidate.from - currentFrame, currentFrame - candidate.end),
+                };
+            })
+                .sort((a, b) => a.distance - b.distance);
+            const selected = new Set();
+            for (const { candidate } of ranked) {
+                const ancestors = [];
+                let ancestor = candidate;
+                while (ancestor && !selected.has(ancestor.id)) {
+                    ancestors.push(ancestor.id);
+                    if (selected.size + ancestors.length > limit) {
+                        break;
+                    }
+                    ancestor =
+                        ancestor.parent === null
+                            ? undefined
+                            : candidates.get(ancestor.parent);
+                }
+                if (selected.size + ancestors.length > limit) {
+                    continue;
+                }
+                for (const id of ancestors) {
+                    selected.add(id);
+                }
+                if (selected.size === limit) {
+                    break;
+                }
+            }
+            // Reserve nearby visible trees too, so becoming dormant retains their
+            // state immediately. All other visible trees bypass admission. Reserved
+            // IDs bound dormant content, including during a large seek.
+            registry.setSnapshot((previous) => previous.size === selected.size &&
+                [...previous].every((id) => selected.has(id))
+                ? previous
+                : selected);
+        });
+    };
+    return {
+        ...registry,
+        setSuspended: (next) => {
+            if (suspended !== next) {
+                suspended = next;
+                schedule();
+            }
+        },
+        setLimit: (next) => {
+            if (limit !== next) {
+                limit = next;
+                schedule();
+            }
+        },
+        setFrame: (next) => {
+            frame = next;
+            schedule();
+        },
+        register: (candidate) => {
+            candidates.set(candidate.id, candidate);
+            schedule();
+            return () => {
+                candidates.delete(candidate.id);
+                schedule();
+            };
+        },
+    };
+};
+const ActivityBudgetContext = (0, react_1.createContext)(null);
+const InactiveTimelineContext = (0, react_1.createContext)(null);
+const emptySelection = new Set();
+const ActivitySelectionContext = (0, react_1.createContext)(emptySelection);
+const SequenceActivityBudgetProvider = ({ children }) => {
+    var _a;
+    const enabled = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivityContext);
+    const settings = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivitySettingsContext);
+    const suspended = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivitySuspensionContext);
+    const limit = (_a = settings === null || settings === void 0 ? void 0 : settings.limit) !== null && _a !== void 0 ? _a : sequence_activity_context_js_1.DEFAULT_SEQUENCE_ACTIVITY_LIMIT;
+    const admitting = enabled && limit > 0 && limit !== Infinity;
+    const [budget] = (0, react_1.useState)(createActivityBudget);
+    const timeline = (0, react_1.useContext)(admitting && !suspended ? TimelineContext_js_1.TimelineContext : InactiveTimelineContext);
+    const selected = (0, use_sync_external_store_js_1.useSyncExternalStore)(budget.subscribe, budget.getSnapshot, budget.getSnapshot);
+    // Shrinking the setting must not keep the old, larger selection for a commit
+    // while the budget schedules its new snapshot.
+    const admitted = (0, react_1.useMemo)(() => !admitting
+        ? emptySelection
+        : selected.size > limit
+            ? new Set([...selected].slice(0, limit))
+            : selected, [admitting, limit, selected]);
+    useCommitEffect(() => {
+        // Retain the admitted trees while moving the playhead. Re-ranking would
+        // unmount their suspended content and remove its timeline registrations.
+        budget.setSuspended(suspended);
+        budget.setLimit(admitting ? limit : 0);
+        if (admitting && timeline !== null) {
+            budget.setFrame(timeline.frame);
+        }
+    }, [admitting, budget, limit, suspended, timeline]);
+    return (jsx_runtime_1.jsx(ActivityBudgetContext.Provider, { value: admitting ? budget : null, children: jsx_runtime_1.jsx(ActivitySelectionContext.Provider, { value: admitted, children: children }) }));
+};
+exports.SequenceActivityBudgetProvider = SequenceActivityBudgetProvider;
+const useSequenceActivityAdmission = (candidate) => {
+    var _a, _b, _c, _d, _e, _f;
+    const budget = (0, react_1.useContext)(ActivityBudgetContext);
+    const enabled = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivityContext);
+    const settings = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivitySettingsContext);
+    const unlimited = enabled &&
+        ((_a = settings === null || settings === void 0 ? void 0 : settings.limit) !== null && _a !== void 0 ? _a : sequence_activity_context_js_1.DEFAULT_SEQUENCE_ACTIVITY_LIMIT) === Infinity;
+    const selected = (0, react_1.useContext)(ActivitySelectionContext);
+    const id = (_b = candidate === null || candidate === void 0 ? void 0 : candidate.id) !== null && _b !== void 0 ? _b : null;
+    const parent = (_c = candidate === null || candidate === void 0 ? void 0 : candidate.parent) !== null && _c !== void 0 ? _c : null;
+    const compositionId = (_d = candidate === null || candidate === void 0 ? void 0 : candidate.compositionId) !== null && _d !== void 0 ? _d : null;
+    const from = (_e = candidate === null || candidate === void 0 ? void 0 : candidate.from) !== null && _e !== void 0 ? _e : null;
+    const end = (_f = candidate === null || candidate === void 0 ? void 0 : candidate.end) !== null && _f !== void 0 ? _f : null;
+    const committedCandidate = (0, react_1.useMemo)(() => id !== null && compositionId !== null && from !== null && end !== null
+        ? { id, parent, compositionId, from, end }
+        : null, [id, parent, compositionId, from, end]);
+    useCommitEffect(() => {
+        if (budget !== null && committedCandidate !== null) {
+            return budget.register(committedCandidate);
+        }
+    }, [budget, committedCandidate]);
+    // Unlimited discovery admits children on their first render, without waiting
+    // for their registration and a subsequent budget publication.
+    return id !== null && (unlimited || selected.has(id));
+};
+exports.useSequenceActivityAdmission = useSequenceActivityAdmission;

package/dist/cjs/SequenceActivitySuspensionProvider.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const SequenceActivitySuspensionProvider: React.FC<{
+    readonly children: React.ReactNode;
+}>;

package/dist/cjs/SequenceActivitySuspensionProvider.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SequenceActivitySuspensionProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const sequence_activity_context_js_1 = require("./sequence-activity-context.js");
+const TimelineContext_js_1 = require("./TimelineContext.js");
+const SequenceActivitySuspensionProvider = ({ children }) => {
+    const enabled = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivityContext);
+    const { isPlaying, subscribePlaying, seek } = (0, react_1.useContext)(TimelineContext_js_1.SetTimelineContext);
+    const [suspended, setSuspended] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (!enabled) {
+            setSuspended(false);
+            return;
+        }
+        let timeout = null;
+        const update = () => {
+            setSuspended(isPlaying() || timeout !== null);
+        };
+        const unsubscribePlaying = subscribePlaying(update);
+        const unsubscribeSeek = seek === null || seek === void 0 ? void 0 : seek.subscribe(() => {
+            setSuspended(true);
+            if (timeout !== null) {
+                clearTimeout(timeout);
+            }
+            // Repeated pointer, keyboard, and API seeks keep discovery suspended.
+            // Resume only once navigation settles, using the latest scene props.
+            timeout = setTimeout(() => {
+                timeout = null;
+                update();
+            }, 150);
+        });
+        update();
+        return () => {
+            unsubscribePlaying();
+            unsubscribeSeek === null || unsubscribeSeek === void 0 ? void 0 : unsubscribeSeek();
+            if (timeout !== null) {
+                clearTimeout(timeout);
+            }
+        };
+    }, [enabled, isPlaying, seek, subscribePlaying]);
+    return (jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivitySuspensionContext.Provider, { value: suspended, children: children }));
+};
+exports.SequenceActivitySuspensionProvider = SequenceActivitySuspensionProvider;

package/dist/cjs/SequenceManager.d.ts

@@ -1,28 +1,9 @@
 import React from 'react';
-import type { TSequence } from './CompositionManager.js';
+export * from './sequence-registry-context.js';
+import { type SequenceManagerActions, type SequenceNodePath } from './sequence-registry-context.js';
 import type { CanUpdateSequencePropStatus, DragOverrideValue, GetDragOverrides, GetEffectDragOverrides, PropStatuses } from './use-schema.js';
 import type { SourceNumericValue } from './use-schema.js';
 import type { VideoConfigValues } from './video-config.js';
-export type SequenceManagerContext = {
-    registerSequence: (seq: TSequence) => void;
-    updateSequence: ((seq: TSequence) => void) | null;
-    unregisterSequence: (id: string) => void;
-    sequences: TSequence[];
-};
-export type SequenceManagerRef = {
-    current: TSequence[];
-};
-export type SequenceNodePath = Array<string | number>;
-type SequenceManagerActions = Pick<SequenceManagerContext, 'registerSequence' | 'updateSequence' | 'unregisterSequence'>;
-export declare const SequenceManagerActionsContext: React.Context<SequenceManagerActions>;
-export declare const SequenceManager: React.Context<SequenceManagerContext>;
-export declare const useSequenceManagerSequences: () => TSequence[];
-export declare const SequenceManagerRefContext: React.Context<SequenceManagerRef>;
-export declare const SequenceRegistrationContext: React.Context<boolean>;
-export declare const DisableSequenceRegistrationContext: React.Context<boolean>;
-export declare const DisableSequenceRegistrationProvider: React.FC<{
-    readonly children: React.ReactNode;
-}>;
 export type VisualModePropStatuses = {
     propStatuses: PropStatuses;
 };
@@ -86,6 +67,11 @@ export type CanUpdateSequencePropsResponseTrue<Numeric = SourceNumericValue> = {
     canUpdate: true;
     props: Record<string, CanUpdateSequencePropStatus<Numeric>>;
     effects: CanUpdateEffectPropsResponse<Numeric>[];
+    /** Source ranges also include interpolations outside the editable schema. */
+    durationDependentKeyframes: {
+        readonly scope: SequenceNodePath;
+        readonly inputRanges: readonly (readonly SourceNumericValue[] | null)[];
+    } | null;
 };
 export type CanUpdateSequencePropsResponseFalse = {
     canUpdate: false;
@@ -96,9 +82,10 @@ export declare const makeSequencePropsSubscriptionKey: (key: SequencePropsSubscr
 export declare const VisualModePropStatusesContext: React.Context<VisualModePropStatuses>;
 export declare const VisualModePropStatusesRefContext: React.Context<VisualModePropStatusesRef>;
 export declare const VisualModeDragOverridesContext: React.Context<VisualModeDragOverrides>;
+export declare const VisualModeDragOverridesRefContext: React.Context<React.RefObject<VisualModeDragOverrides>>;
 export declare const useDragOverridesForNodePath: (nodePath: SequencePropsSubscriptionKey | null) => Record<string, DragOverrideValue>;
 export declare const useActiveFromDragOverrideKeys: () => ReadonlySet<string>;
-export declare const useEffectDragOverridesForNodePath: (nodePath: SequencePropsSubscriptionKey | null, effectCount: number) => Record<string, Record<string, DragOverrideValue>>;
+export declare const useEffectDragOverridesForNodePath: (nodePath: SequencePropsSubscriptionKey | null) => Record<string, Record<string, DragOverrideValue>>;
 export declare const VisualModeSettersContext: React.Context<VisualModeSetters>;
 export declare const VisualModeBatchSettersContext: React.Context<VisualModeBatchSetters | null>;
 export type SequencePropsSubscriptionKey = {