remotion 4.0.534 → 4.0.535

package/dist/cjs/SequenceManager.js

@@ -32,64 +32,34 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
+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.SequenceManagerProvider = exports.VisualModeBatchSettersContext = exports.VisualModeSettersContext = exports.useEffectDragOverridesForNodePath = exports.useActiveFromDragOverrideKeys = exports.useDragOverridesForNodePath = exports.VisualModeDragOverridesContext = exports.VisualModePropStatusesRefContext = exports.VisualModePropStatusesContext = exports.makeSequencePropsSubscriptionKey = exports.VisualModeDragOverridesSubscriptionContext = exports.DisableSequenceRegistrationProvider = exports.DisableSequenceRegistrationContext = exports.SequenceRegistrationContext = exports.SequenceManagerRefContext = exports.useSequenceManagerSequences = exports.SequenceManager = exports.SequenceManagerActionsContext = void 0;
+exports.SequenceManagerProvider = exports.VisualModeBatchSettersContext = exports.VisualModeSettersContext = exports.useEffectDragOverridesForNodePath = exports.useActiveFromDragOverrideKeys = exports.useDragOverridesForNodePath = exports.VisualModeDragOverridesRefContext = exports.VisualModeDragOverridesContext = exports.VisualModePropStatusesRefContext = exports.VisualModePropStatusesContext = exports.makeSequencePropsSubscriptionKey = exports.VisualModeDragOverridesSubscriptionContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
-const sequence_order_marker_js_1 = require("./sequence-order-marker.js");
+__exportStar(require("./sequence-registry-context.js"), exports);
+const sequence_activity_context_js_1 = require("./sequence-activity-context.js");
+const sequence_registry_context_js_1 = require("./sequence-registry-context.js");
+const SequenceActivityBudget_js_1 = require("./SequenceActivityBudget.js");
+const SequenceRegistryProvider_js_1 = require("./SequenceRegistryProvider.js");
 const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
 const use_sync_external_store_js_1 = require("./use-sync-external-store.js");
 const useIsomorphicLayoutEffect = typeof window === 'undefined' ? react_1.default.useEffect : react_1.default.useLayoutEffect;
-const defaultSequenceManager = {
-    registerSequence: () => {
-        throw new Error('SequenceManagerContext not initialized');
-    },
-    updateSequence: null,
-    unregisterSequence: () => {
-        throw new Error('SequenceManagerContext not initialized');
-    },
-    sequences: [],
-};
-exports.SequenceManagerActionsContext = react_1.default.createContext({
-    registerSequence: defaultSequenceManager.registerSequence,
-    updateSequence: defaultSequenceManager.updateSequence,
-    unregisterSequence: defaultSequenceManager.unregisterSequence,
-});
-exports.SequenceManager = react_1.default.createContext(defaultSequenceManager);
-const NativeSequenceManagerProvider = exports.SequenceManager.Provider;
-const SequenceManagerProviderWithActions = ({ value, children }) => {
-    const actions = (0, react_1.useMemo)(() => ({
-        registerSequence: value.registerSequence,
-        updateSequence: value.updateSequence,
-        unregisterSequence: value.unregisterSequence,
-    }), [value.registerSequence, value.updateSequence, value.unregisterSequence]);
-    return (jsx_runtime_1.jsx(exports.SequenceManagerActionsContext.Provider, { value: actions, children: jsx_runtime_1.jsx(NativeSequenceManagerProvider, { value: value, children: children }) }));
-};
-// Keep custom SequenceManager.Provider trees in sync with the stable actions
-// context while preserving the legacy reactive sequence-list context.
-Object.defineProperty(exports.SequenceManager, 'Provider', {
-    value: SequenceManagerProviderWithActions,
-});
-const useSequenceManagerSequences = () => {
-    return (0, react_1.useContext)(exports.SequenceManager).sequences;
-};
-exports.useSequenceManagerSequences = useSequenceManagerSequences;
-exports.SequenceManagerRefContext = react_1.default.createContext({
-    current: [],
-});
-exports.SequenceRegistrationContext = react_1.default.createContext(false);
-exports.DisableSequenceRegistrationContext = react_1.default.createContext(false);
-const DisableSequenceRegistrationProvider = ({ children }) => {
-    return react_1.default.createElement(exports.DisableSequenceRegistrationContext.Provider, { value: true }, children);
-};
-exports.DisableSequenceRegistrationProvider = DisableSequenceRegistrationProvider;
 exports.VisualModeDragOverridesSubscriptionContext = react_1.default.createContext(null);
 const ActiveFromDragOverrideKeysContext = react_1.default.createContext(null);
 const SequenceManagerScopeProviders = ({ children, dragOverridesSubscription, fromKeys }) => {
-    const manager = (0, react_1.useContext)(exports.SequenceManagerActionsContext);
+    const { isStudio } = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
+    const activitySettings = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivitySettingsContext);
+    const commitRegistrationEnabled = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceCommitRegistrationContext);
+    const manager = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceManagerActionsContext);
     const scopedDragOverridesSubscription = (0, react_1.useMemo)(() => ({ ...dragOverridesSubscription, manager }), [dragOverridesSubscription, manager]);
     const activeFromDragOverrideKeys = (0, react_1.useMemo)(() => ({ manager, keys: fromKeys }), [fromKeys, manager]);
-    return (jsx_runtime_1.jsx(ActiveFromDragOverrideKeysContext.Provider, { value: activeFromDragOverrideKeys, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesSubscriptionContext.Provider, { value: scopedDragOverridesSubscription, children: children }) }));
+    return (jsx_runtime_1.jsx(ActiveFromDragOverrideKeysContext.Provider, { value: activeFromDragOverrideKeys, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesSubscriptionContext.Provider, { value: scopedDragOverridesSubscription, children: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivityContext.Provider, { value: (activitySettings === null || activitySettings === void 0 ? void 0 : activitySettings.enabled) === true &&
+                    isStudio &&
+                    commitRegistrationEnabled &&
+                    typeof react_1.default.Activity !== 'undefined', children: jsx_runtime_1.jsx(SequenceActivityBudget_js_1.SequenceActivityBudgetProvider, { children: children }) }) }) }));
 };
 const emptyDragOverrides = {};
 const emptyFromOverrideKeys = new Set();
@@ -104,24 +74,20 @@ exports.VisualModePropStatusesContext = react_1.default.createContext({
 exports.VisualModePropStatusesRefContext = react_1.default.createContext({
     current: {},
 });
-exports.VisualModeDragOverridesContext = react_1.default.createContext({
+const defaultVisualModeDragOverrides = {
     getDragOverrides: () => {
         throw new Error('VisualModeDragOverridesContext not initialized');
     },
     getEffectDragOverrides: () => {
         throw new Error('VisualModeDragOverridesContext not initialized');
     },
-});
-/* eslint-disable react-hooks/rules-of-hooks */
+};
+exports.VisualModeDragOverridesContext = react_1.default.createContext(defaultVisualModeDragOverrides);
+exports.VisualModeDragOverridesRefContext = react_1.default.createContext({ current: defaultVisualModeDragOverrides });
 const useDragOverridesForNodePath = (nodePath) => {
     const subscription = (0, react_1.useContext)(exports.VisualModeDragOverridesSubscriptionContext);
-    const manager = (0, react_1.useContext)(exports.SequenceManagerActionsContext);
+    const manager = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceManagerActionsContext);
     const scopedSubscription = (subscription === null || subscription === void 0 ? void 0 : subscription.manager) === manager ? subscription : null;
-    // Legacy providers only supply VisualModeDragOverridesContext. Its presence is
-    // fixed for the lifetime of a mounted tree.
-    const legacy = scopedSubscription === null
-        ? (0, react_1.useContext)(exports.VisualModeDragOverridesContext)
-        : null;
     const key = nodePath === null ? null : (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
     const subscribe = (0, react_1.useCallback)((listener) => {
         var _a;
@@ -131,27 +97,19 @@ const useDragOverridesForNodePath = (nodePath) => {
         var _a;
         return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getSnapshot(key)) !== null && _a !== void 0 ? _a : emptyDragOverrides;
     }, [key, scopedSubscription]);
-    const overrides = (0, use_sync_external_store_js_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
-    return legacy !== null && nodePath !== null
-        ? legacy.getDragOverrides(nodePath)
-        : overrides;
+    return (0, use_sync_external_store_js_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
 };
 exports.useDragOverridesForNodePath = useDragOverridesForNodePath;
 const useActiveFromDragOverrideKeys = () => {
     const snapshot = (0, react_1.useContext)(ActiveFromDragOverrideKeysContext);
-    const manager = (0, react_1.useContext)(exports.SequenceManagerActionsContext);
+    const manager = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceManagerActionsContext);
     return (snapshot === null || snapshot === void 0 ? void 0 : snapshot.manager) === manager ? snapshot.keys : emptyFromOverrideKeys;
 };
 exports.useActiveFromDragOverrideKeys = useActiveFromDragOverrideKeys;
-const useEffectDragOverridesForNodePath = (nodePath, effectCount) => {
+const useEffectDragOverridesForNodePath = (nodePath) => {
     const subscription = (0, react_1.useContext)(exports.VisualModeDragOverridesSubscriptionContext);
-    const manager = (0, react_1.useContext)(exports.SequenceManagerActionsContext);
+    const manager = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceManagerActionsContext);
     const scopedSubscription = (subscription === null || subscription === void 0 ? void 0 : subscription.manager) === manager ? subscription : null;
-    // Legacy providers only supply VisualModeDragOverridesContext. Its presence is
-    // fixed for the lifetime of a mounted tree.
-    const legacy = scopedSubscription === null
-        ? (0, react_1.useContext)(exports.VisualModeDragOverridesContext)
-        : null;
     const key = nodePath === null ? null : (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
     const subscribe = (0, react_1.useCallback)((listener) => {
         var _a;
@@ -161,18 +119,9 @@ const useEffectDragOverridesForNodePath = (nodePath, effectCount) => {
         var _a;
         return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getEffectSnapshot(key)) !== null && _a !== void 0 ? _a : emptyEffectDragOverrides;
     }, [key, scopedSubscription]);
-    const overrides = (0, use_sync_external_store_js_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
-    if (legacy !== null && nodePath !== null) {
-        const legacyOverrides = {};
-        for (let index = 0; index < effectCount; index++) {
-            legacyOverrides[index] = legacy.getEffectDragOverrides(nodePath, index);
-        }
-        return legacyOverrides;
-    }
-    return overrides;
+    return (0, use_sync_external_store_js_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
 };
 exports.useEffectDragOverridesForNodePath = useEffectDragOverridesForNodePath;
-/* eslint-enable react-hooks/rules-of-hooks */
 exports.VisualModeSettersContext = react_1.default.createContext({
     setDragOverrides: () => {
         throw new Error('VisualModeSettersContext not initialized');
@@ -196,13 +145,6 @@ exports.VisualModeSettersContext = react_1.default.createContext({
 exports.VisualModeBatchSettersContext = react_1.default.createContext(null);
 const effectDragOverridesKey = (nodePath, effectIndex) => `${(0, exports.makeSequencePropsSubscriptionKey)(nodePath)}.effects.${effectIndex}`;
 const SequenceManagerProvider = ({ children }) => {
-    const { isStudio } = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
-    const [sequenceManagerId] = (0, react_1.useState)(() => String(Math.random()));
-    const committedOrderRef = (0, react_1.useRef)(null);
-    const committedOrderIdsRef = (0, react_1.useRef)(null);
-    const [sequences, setSequences] = (0, react_1.useState)([]);
-    const sequencesRef = (0, react_1.useRef)(sequences);
-    sequencesRef.current = sequences;
     const [dragOverrideState, setDragOverrideState] = (0, react_1.useState)(() => ({
         overrides: {},
         fromKeys: new Set(),
@@ -220,7 +162,9 @@ const SequenceManagerProvider = ({ children }) => {
     });
     const [propStatuses, setPropStatusesMapState] = (0, react_1.useState)({});
     const propStatusesRef = (0, react_1.useRef)(propStatuses);
-    propStatusesRef.current = propStatuses;
+    useIsomorphicLayoutEffect(() => {
+        propStatusesRef.current = propStatuses;
+    }, [propStatuses]);
     const setDragOverridesBatch = (0, react_1.useCallback)((overrides) => {
         setDragOverrideState((prevState) => {
             var _a;
@@ -436,114 +380,6 @@ const SequenceManagerProvider = ({ children }) => {
             return next;
         });
     }, []);
-    useIsomorphicLayoutEffect(() => {
-        if (!isStudio) {
-            return;
-        }
-        let unmounted = false;
-        const onCommitOrder = (event) => {
-            const { detail } = event;
-            const managerOrder = detail.sequenceManagers.find((item) => item.managerId === sequenceManagerId);
-            if (!managerOrder) {
-                return;
-            }
-            const previousOrder = committedOrderIdsRef.current;
-            if (previousOrder !== null &&
-                previousOrder.length === managerOrder.sequenceIds.length &&
-                previousOrder.every((sequenceId, index) => sequenceId === managerOrder.sequenceIds[index])) {
-                return;
-            }
-            const order = new Map(managerOrder.sequenceIds.map((sequenceId, index) => [
-                sequenceId,
-                index,
-            ]));
-            committedOrderIdsRef.current = managerOrder.sequenceIds;
-            committedOrderRef.current = order;
-            queueMicrotask(() => {
-                if (unmounted) {
-                    return;
-                }
-                setSequences((currentSequences) => {
-                    let changed = false;
-                    const nextSequences = currentSequences.map((sequence) => {
-                        var _a;
-                        const timelineOrder = (_a = order.get(sequence.id)) !== null && _a !== void 0 ? _a : null;
-                        if (sequence.timelineOrder === timelineOrder) {
-                            return sequence;
-                        }
-                        changed = true;
-                        return { ...sequence, timelineOrder };
-                    });
-                    return changed ? nextSequences : currentSequences;
-                });
-            });
-        };
-        window.addEventListener(sequence_order_marker_js_1.COMMIT_ORDER_EVENT, onCommitOrder);
-        return () => {
-            unmounted = true;
-            window.removeEventListener(sequence_order_marker_js_1.COMMIT_ORDER_EVENT, onCommitOrder);
-        };
-    }, [isStudio, sequenceManagerId]);
-    const registerSequence = (0, react_1.useCallback)((seq) => {
-        setSequences((seqs) => {
-            var _a;
-            var _b;
-            return [
-                ...seqs,
-                {
-                    ...seq,
-                    timelineOrder: (_b = (_a = committedOrderRef.current) === null || _a === void 0 ? void 0 : _a.get(seq.id)) !== null && _b !== void 0 ? _b : null,
-                },
-            ];
-        });
-    }, []);
-    const updateSequence = (0, react_1.useCallback)((seq) => {
-        setSequences((seqs) => {
-            var _a;
-            var _b;
-            const index = seqs.findIndex((item) => item.id === seq.id);
-            if (index === -1) {
-                return seqs;
-            }
-            const previousSequence = seqs[index];
-            const timelineOrder = (_b = (_a = committedOrderRef.current) === null || _a === void 0 ? void 0 : _a.get(seq.id)) !== null && _b !== void 0 ? _b : null;
-            // A new registration getter does not necessarily change the metadata.
-            let unchanged = Object.is(previousSequence.timelineOrder, timelineOrder);
-            // The manager adds timelineOrder even if the incoming object omits it.
-            let keyCount = 1;
-            if (unchanged) {
-                for (const key in seq) {
-                    if (key === 'timelineOrder' ||
-                        !Object.prototype.hasOwnProperty.call(seq, key)) {
-                        continue;
-                    }
-                    keyCount++;
-                    if (!Object.prototype.hasOwnProperty.call(previousSequence, key) ||
-                        !Object.is(previousSequence[key], seq[key])) {
-                        unchanged = false;
-                        break;
-                    }
-                }
-            }
-            if (unchanged && Object.keys(previousSequence).length === keyCount) {
-                return seqs;
-            }
-            const next = [...seqs];
-            next[index] = { ...seq, timelineOrder };
-            return next;
-        });
-    }, []);
-    const unregisterSequence = (0, react_1.useCallback)((seq) => {
-        setSequences((seqs) => seqs.filter((s) => s.id !== seq));
-    }, []);
-    const sequenceContext = (0, react_1.useMemo)(() => {
-        return {
-            registerSequence,
-            sequences,
-            updateSequence,
-            unregisterSequence,
-        };
-    }, [registerSequence, sequences, unregisterSequence, updateSequence]);
     const dragOverridesSubscription = (0, react_1.useMemo)(() => ({
         subscribe: subscribeDragOverrides,
         getSnapshot: getDragOverridesSnapshot,
@@ -574,6 +410,11 @@ const SequenceManagerProvider = ({ children }) => {
             getEffectDragOverrides,
         };
     }, [getDragOverrides, getEffectDragOverrides]);
+    const dragOverridesRef = (0, react_1.useRef)(dragOverridesContext);
+    useIsomorphicLayoutEffect(() => {
+        // Interaction handlers read the latest committed overrides without subscribing.
+        dragOverridesRef.current = dragOverridesContext;
+    }, [dragOverridesContext]);
     const settersContext = (0, react_1.useMemo)(() => {
         return {
             setDragOverrides,
@@ -592,7 +433,6 @@ const SequenceManagerProvider = ({ children }) => {
         remapPropStatuses,
     ]);
     const batchSettersContext = (0, react_1.useMemo)(() => ({ setDragOverridesBatch, setEffectDragOverridesBatch }), [setDragOverridesBatch, setEffectDragOverridesBatch]);
-    const providers = (jsx_runtime_1.jsx(exports.SequenceManagerRefContext.Provider, { value: sequencesRef, children: jsx_runtime_1.jsx(exports.SequenceManager.Provider, { value: sequenceContext, children: jsx_runtime_1.jsx(exports.VisualModePropStatusesRefContext.Provider, { value: propStatusesRef, children: jsx_runtime_1.jsx(exports.VisualModePropStatusesContext.Provider, { value: propStatusesContext, children: jsx_runtime_1.jsx(SequenceManagerScopeProviders, { dragOverridesSubscription: dragOverridesSubscription, fromKeys: dragOverrideState.fromKeys, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesContext.Provider, { value: dragOverridesContext, children: jsx_runtime_1.jsx(exports.VisualModeSettersContext.Provider, { value: settersContext, children: jsx_runtime_1.jsx(exports.VisualModeBatchSettersContext.Provider, { value: batchSettersContext, children: children }) }) }) }) }) }) }) }));
-    return isStudio ? (jsx_runtime_1.jsx(sequence_order_marker_js_1.SequenceManagerOrderMarker, { managerId: sequenceManagerId, children: providers })) : (providers);
+    return (jsx_runtime_1.jsx(SequenceRegistryProvider_js_1.SequenceRegistryProvider, { children: jsx_runtime_1.jsx(exports.VisualModePropStatusesRefContext.Provider, { value: propStatusesRef, children: jsx_runtime_1.jsx(exports.VisualModePropStatusesContext.Provider, { value: propStatusesContext, children: jsx_runtime_1.jsx(SequenceManagerScopeProviders, { dragOverridesSubscription: dragOverridesSubscription, fromKeys: dragOverrideState.fromKeys, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesContext.Provider, { value: dragOverridesContext, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesRefContext.Provider, { value: dragOverridesRef, children: jsx_runtime_1.jsx(exports.VisualModeSettersContext.Provider, { value: settersContext, children: jsx_runtime_1.jsx(exports.VisualModeBatchSettersContext.Provider, { value: batchSettersContext, children: children }) }) }) }) }) }) }) }));
 };
 exports.SequenceManagerProvider = SequenceManagerProvider;

package/dist/cjs/SequenceRegistryProvider.d.ts

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

package/dist/cjs/SequenceRegistryProvider.js

@@ -0,0 +1,292 @@
+"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.SequenceRegistryProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const committed_metadata_js_1 = require("./committed-metadata.js");
+const registry_store_js_1 = require("./registry-store.js");
+const sequence_registry_context_js_1 = require("./sequence-registry-context.js");
+const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
+const useIsomorphicLayoutEffect = typeof window === 'undefined' ? react_1.default.useEffect : react_1.default.useLayoutEffect;
+const SequenceManagerRefProvider = (0, committed_metadata_js_1.withCommittedMetadata)(sequence_registry_context_js_1.SequenceManagerRefContext.Provider);
+const SequenceRegistryProvider = ({ children }) => {
+    const { isStudio } = (0, use_remotion_environment_js_1.useRemotionEnvironment)();
+    const sequenceRegistrationEnabled = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceRegistrationContext);
+    const shouldObserveCommits = isStudio || sequenceRegistrationEnabled;
+    const [sequenceManagerId] = (0, react_1.useState)(() => String(Math.random()));
+    const [commitRegistrationEnabled, setCommitRegistrationEnabled] = (0, react_1.useState)(() => shouldObserveCommits && (0, committed_metadata_js_1.isCommitRegistrationObserverInstalled)());
+    const observedCommitRef = (0, react_1.useRef)(false);
+    const rootObservationFailedRef = (0, react_1.useRef)(false);
+    const committedRegistrationIdsRef = (0, react_1.useRef)(new Set());
+    const committedDescriptorsRef = (0, react_1.useRef)(new Map());
+    const pendingCommittedSequencesRef = (0, react_1.useRef)(new Map());
+    const committedScopesRef = (0, react_1.useRef)(new Map([
+        [sequenceManagerId, { sequences: [], sequenceIds: [] }],
+    ]));
+    const registrationObserverFailedRef = (0, react_1.useRef)(false);
+    const registrationUnmountedRef = (0, react_1.useRef)(false);
+    const committedOrderRef = (0, react_1.useRef)(null);
+    const committedOrderIdsRef = (0, react_1.useRef)(null);
+    const [registry] = (0, react_1.useState)(() => (0, registry_store_js_1.createRegistryStore)([]));
+    const setSequences = registry.setSnapshot;
+    const sequencesRef = (0, react_1.useMemo)(() => ({
+        get current() {
+            return registry.getSnapshot();
+        },
+    }), [registry]);
+    const onCommitSequences = (0, react_1.useCallback)((scopeId, snapshot, sequenceIds) => {
+        var _a;
+        if (registrationObserverFailedRef.current ||
+            registrationUnmountedRef.current) {
+            return;
+        }
+        const previousSnapshot = (_a = pendingCommittedSequencesRef.current.get(scopeId)) !== null && _a !== void 0 ? _a : committedScopesRef.current.get(scopeId);
+        if ((previousSnapshot === null || previousSnapshot === void 0 ? void 0 : previousSnapshot.sequences) === snapshot &&
+            previousSnapshot.sequenceIds === sequenceIds) {
+            return;
+        }
+        const alreadyPending = pendingCommittedSequencesRef.current.size > 0;
+        pendingCommittedSequencesRef.current.set(scopeId, {
+            sequences: snapshot,
+            sequenceIds,
+        });
+        if (alreadyPending) {
+            return;
+        }
+        // Publish after React finishes committing, and coalesce successive snapshots.
+        queueMicrotask(() => {
+            const pending = pendingCommittedSequencesRef.current;
+            pendingCommittedSequencesRef.current = new Map();
+            if (pending.size === 0 ||
+                registrationObserverFailedRef.current ||
+                registrationUnmountedRef.current) {
+                return;
+            }
+            const previousIds = committedRegistrationIdsRef.current;
+            const previousDescriptors = committedDescriptorsRef.current;
+            for (const [id, scope] of pending) {
+                if (id !== sequenceManagerId && scope.sequenceIds.length === 0) {
+                    committedScopesRef.current.delete(id);
+                }
+                else {
+                    committedScopesRef.current.set(id, scope);
+                }
+            }
+            // A forwarded renderer owns only its fragment. Publishing or removing it
+            // must never replace the descriptors committed by the other roots.
+            const scopes = [...committedScopesRef.current.values()];
+            const sequences = scopes.flatMap((scope) => scope.sequences);
+            const ids = scopes.flatMap((scope) => scope.sequenceIds);
+            committedDescriptorsRef.current = new Map(sequences.map((sequence) => [sequence.id, sequence]));
+            const nextIds = new Set(sequences.map((sequence) => sequence.id));
+            const order = new Map(ids.map((id, index) => [id, index]));
+            committedOrderIdsRef.current = ids;
+            committedOrderRef.current = order;
+            committedRegistrationIdsRef.current = nextIds;
+            setSequences((current) => (0, registry_store_js_1.reconcileRegistryEntries)({
+                current,
+                entries: sequences,
+                previousDescriptors,
+                previousKeys: previousIds,
+                nextKeys: nextIds,
+                getKey: (sequence) => sequence.id,
+                order,
+                orderProperty: 'timelineOrder',
+            }));
+        });
+    }, [sequenceManagerId, setSequences]);
+    const onCommitRootSequences = (0, react_1.useCallback)((sequences, sequenceIds) => {
+        if (!rootObservationFailedRef.current) {
+            observedCommitRef.current = true;
+            onCommitSequences(sequenceManagerId, sequences, sequenceIds);
+        }
+    }, [onCommitSequences, sequenceManagerId]);
+    const registryScope = (0, react_1.useMemo)(() => ({
+        onCommitSequences,
+        commitRegistrationRequested: shouldObserveCommits,
+    }), [onCommitSequences, shouldObserveCommits]);
+    useIsomorphicLayoutEffect(() => {
+        if (!shouldObserveCommits) {
+            return;
+        }
+        let unmounted = false;
+        registrationUnmountedRef.current = false;
+        const onRegistrationError = () => {
+            if (registrationObserverFailedRef.current) {
+                return;
+            }
+            registrationObserverFailedRef.current = true;
+            pendingCommittedSequencesRef.current.clear();
+            queueMicrotask(() => {
+                if (registrationUnmountedRef.current) {
+                    return;
+                }
+                const previousIds = committedRegistrationIdsRef.current;
+                committedRegistrationIdsRef.current = new Set();
+                committedScopesRef.current.clear();
+                setSequences((current) => current.filter((sequence) => !previousIds.has(sequence.id)));
+                setCommitRegistrationEnabled(false);
+            });
+        };
+        const onCommitOrder = (event) => {
+            const { detail } = event;
+            const managerOrder = detail.sequenceManagers.find((item) => item.managerId === sequenceManagerId);
+            if (!managerOrder) {
+                return;
+            }
+            if (commitRegistrationEnabled) {
+                return;
+            }
+            const previousOrder = committedOrderIdsRef.current;
+            if (previousOrder === managerOrder.sequenceIds ||
+                (previousOrder !== null &&
+                    previousOrder.length === managerOrder.sequenceIds.length &&
+                    previousOrder.every((sequenceId, index) => sequenceId === managerOrder.sequenceIds[index]))) {
+                return;
+            }
+            const order = new Map(managerOrder.sequenceIds.map((sequenceId, index) => [
+                sequenceId,
+                index,
+            ]));
+            committedOrderIdsRef.current = managerOrder.sequenceIds;
+            committedOrderRef.current = order;
+            queueMicrotask(() => {
+                if (unmounted) {
+                    return;
+                }
+                setSequences((currentSequences) => {
+                    let changed = false;
+                    const nextSequences = currentSequences.map((sequence) => {
+                        var _a;
+                        const timelineOrder = (_a = order.get(sequence.id)) !== null && _a !== void 0 ? _a : null;
+                        if (sequence.timelineOrder === timelineOrder) {
+                            return sequence;
+                        }
+                        changed = true;
+                        return { ...sequence, timelineOrder };
+                    });
+                    return changed ? nextSequences : currentSequences;
+                });
+            });
+        };
+        window.addEventListener(committed_metadata_js_1.COMMIT_ORDER_EVENT, onCommitOrder);
+        window.addEventListener(committed_metadata_js_1.COMMIT_REGISTRATION_ERROR_EVENT, onRegistrationError);
+        if (commitRegistrationEnabled) {
+            // React invokes its commit hook after layout effects. Installation alone
+            // does not prove this renderer connected to the hook during initialization.
+            queueMicrotask(() => {
+                if (unmounted ||
+                    observedCommitRef.current ||
+                    registrationObserverFailedRef.current) {
+                    return;
+                }
+                rootObservationFailedRef.current = true;
+                onCommitSequences(sequenceManagerId, [], []);
+                setCommitRegistrationEnabled(false);
+            });
+        }
+        return () => {
+            unmounted = true;
+            registrationUnmountedRef.current = true;
+            // Effect replay must not discard a snapshot already collected by React.
+            window.removeEventListener(committed_metadata_js_1.COMMIT_ORDER_EVENT, onCommitOrder);
+            window.removeEventListener(committed_metadata_js_1.COMMIT_REGISTRATION_ERROR_EVENT, onRegistrationError);
+        };
+    }, [
+        shouldObserveCommits,
+        sequenceManagerId,
+        setSequences,
+        commitRegistrationEnabled,
+        onCommitSequences,
+    ]);
+    const registerSequence = (0, react_1.useCallback)((seq) => {
+        setSequences((seqs) => {
+            var _a;
+            var _b;
+            return [
+                ...seqs,
+                {
+                    ...seq,
+                    timelineOrder: (_b = (_a = committedOrderRef.current) === null || _a === void 0 ? void 0 : _a.get(seq.id)) !== null && _b !== void 0 ? _b : null,
+                },
+            ];
+        });
+    }, [setSequences]);
+    const updateSequence = (0, react_1.useCallback)((seq) => {
+        setSequences((seqs) => {
+            var _a;
+            var _b;
+            const index = seqs.findIndex((item) => item.id === seq.id);
+            if (index === -1) {
+                return seqs;
+            }
+            const updatedSequence = {
+                ...seq,
+                timelineOrder: (_b = (_a = committedOrderRef.current) === null || _a === void 0 ? void 0 : _a.get(seq.id)) !== null && _b !== void 0 ? _b : null,
+            };
+            if ((0, registry_store_js_1.areRegistryEntriesEqual)(seqs[index], updatedSequence)) {
+                return seqs;
+            }
+            const next = [...seqs];
+            next[index] = updatedSequence;
+            return next;
+        });
+    }, [setSequences]);
+    const unregisterSequence = (0, react_1.useCallback)((seq) => {
+        setSequences((seqs) => seqs.filter((s) => s.id !== seq));
+    }, [setSequences]);
+    const actions = (0, react_1.useMemo)(() => {
+        return {
+            registerSequence,
+            updateSequence,
+            unregisterSequence,
+        };
+    }, [registerSequence, unregisterSequence, updateSequence]);
+    const metadata = (0, react_1.useMemo)(() => shouldObserveCommits
+        ? {
+            type: 'sequence-manager',
+            id: sequenceManagerId,
+            onCommit: commitRegistrationEnabled ? onCommitRootSequences : null,
+        }
+        : null, [
+        commitRegistrationEnabled,
+        onCommitRootSequences,
+        sequenceManagerId,
+        shouldObserveCommits,
+    ]);
+    return (jsx_runtime_1.jsx(SequenceManagerRefProvider, { value: sequencesRef, _remotionCommitMetadata: metadata, children: jsx_runtime_1.jsx(sequence_registry_context_js_1.SequenceRegistryScopeContext.Provider, { value: registryScope, children: jsx_runtime_1.jsx(sequence_registry_context_js_1.SequenceManagerActionsContext.Provider, { value: actions, children: jsx_runtime_1.jsx(sequence_registry_context_js_1.SequenceRegistryContext.Provider, { value: registry, children: jsx_runtime_1.jsx(sequence_registry_context_js_1.SequenceCommitRegistrationContext.Provider, { value: commitRegistrationEnabled, children: children }) }) }) }) }));
+};
+exports.SequenceRegistryProvider = SequenceRegistryProvider;

package/dist/cjs/Track.d.ts

@@ -1,6 +1,13 @@
 import React from 'react';
-import { type SequenceProps } from './Sequence.js';
-export type TrackProps = Pick<SequenceProps, 'children' | 'name' | 'from' | 'durationInFrames' | 'hidden' | 'showInTimeline'>;
-export declare const TrackWithoutSchema: React.FC<SequenceProps>;
+import { type AbsoluteFillLayout, type SequenceProps } from './Sequence.js';
+export type TrackProps = Omit<SequenceProps, keyof AbsoluteFillLayout | 'cropLeft' | 'cropRight' | 'cropTop' | 'cropBottom' | `_remotionInternal${string}` | 'outlineRef'>;
+export type TrackWithoutSchemaProps = Omit<SequenceProps, keyof AbsoluteFillLayout> & ((AbsoluteFillLayout & {
+    layout: 'absolute-fill';
+}) | ({
+    layout?: 'none';
+} & {
+    [Key in Exclude<keyof AbsoluteFillLayout, 'layout'>]?: never;
+}));
+export declare const TrackWithoutSchema: React.FC<TrackWithoutSchemaProps>;
 /** Groups clips on one Studio timeline row and applies Sequence timing. */
 export declare const Track: React.ComponentType<TrackProps>;