remotion 4.0.537 → 4.0.539

package/dist/cjs/Interactive.js

@@ -157,7 +157,7 @@ const withSchema = (untypedOptions) => {
             style: premountingStyle,
             componentName,
         });
-        return (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, children: jsx_runtime_1.jsx(Sequence_js_1.SequenceWithoutSchema, { _remotionInternalSingleChildComponent: isCurrentComposition ? null : componentIdentity, layout: layout, ...(layout === 'absolute-fill'
+        return ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, children: (0, jsx_runtime_1.jsx)(Sequence_js_1.SequenceWithoutSchema, { _remotionInternalSingleChildComponent: isCurrentComposition ? null : componentIdentity, layout: layout, ...(layout === 'absolute-fill'
                     ? {
                         width,
                         height,
@@ -228,7 +228,7 @@ const makeInteractiveElement = (tag, displayName, schema) => {
         const callbackRef = (0, react_1.useCallback)((element) => {
             setRef(ref, element);
         }, [ref]);
-        return (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: jsx_runtime_1.jsx(Sequence_js_1.Sequence, { layout: "none", from: from !== null && from !== void 0 ? from : 0, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, durationInFrames: durationInFrames, freeze: freeze, hidden: hidden, name: name !== null && name !== void 0 ? name : displayName, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, controls: controls, _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/interactive", _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: react_1.default.createElement(tag, {
+        return ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: (0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: from !== null && from !== void 0 ? from : 0, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, durationInFrames: durationInFrames, freeze: freeze, hidden: hidden, name: name !== null && name !== void 0 ? name : displayName, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, controls: controls, _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/interactive", _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: react_1.default.createElement(tag, {
                     ...props,
                     style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined,
                     ref: callbackRef,

package/dist/cjs/RemotionRoot.js

@@ -17,6 +17,6 @@ const RemotionRootContexts = ({ children, numberOfAudioTags, logLevel, audioLate
     const logging = (0, react_1.useMemo)(() => {
         return { logLevel, mountTime: Date.now() };
     }, [logLevel]);
-    return (jsx_runtime_1.jsx(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: jsx_runtime_1.jsx(TimelineContext_js_1.TimelineContextProvider, { frameState: frameState, children: jsx_runtime_1.jsx(use_media_enabled_js_1.MediaEnabledProvider, { videoEnabled: videoEnabled, audioEnabled: audioEnabled, children: jsx_runtime_1.jsx(EditorProps_js_1.EditorPropsProvider, { children: jsx_runtime_1.jsx(prefetch_state_js_1.PrefetchProvider, { children: jsx_runtime_1.jsx(SequenceManager_js_1.SequenceManagerProvider, { children: jsx_runtime_1.jsx(duration_state_js_1.DurationsContextProvider, { children: jsx_runtime_1.jsx(buffering_js_1.BufferingProvider, { children: jsx_runtime_1.jsx(shared_audio_tags_js_1.SharedAudioContextProvider, { audioLatencyHint: audioLatencyHint, audioEnabled: audioEnabled, previewSampleRate: previewSampleRate, _experimentalKeepAudioContextAlive: _experimentalKeepAudioContextAlive, children: jsx_runtime_1.jsx(shared_audio_tags_js_1.SharedAudioTagsContextProvider, { numberOfAudioTags: numberOfAudioTags, children: jsx_runtime_1.jsx(use_video_js_1.VideoProvider, { children: children }) }) }) }) }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(log_level_context_js_1.LogLevelContext.Provider, { value: logging, children: (0, jsx_runtime_1.jsx)(TimelineContext_js_1.TimelineContextProvider, { frameState: frameState, children: (0, jsx_runtime_1.jsx)(use_media_enabled_js_1.MediaEnabledProvider, { videoEnabled: videoEnabled, audioEnabled: audioEnabled, children: (0, jsx_runtime_1.jsx)(EditorProps_js_1.EditorPropsProvider, { children: (0, jsx_runtime_1.jsx)(prefetch_state_js_1.PrefetchProvider, { children: (0, jsx_runtime_1.jsx)(SequenceManager_js_1.SequenceManagerProvider, { children: (0, jsx_runtime_1.jsx)(duration_state_js_1.DurationsContextProvider, { children: (0, jsx_runtime_1.jsx)(buffering_js_1.BufferingProvider, { children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioContextProvider, { audioLatencyHint: audioLatencyHint, audioEnabled: audioEnabled, previewSampleRate: previewSampleRate, _experimentalKeepAudioContextAlive: _experimentalKeepAudioContextAlive, children: (0, jsx_runtime_1.jsx)(shared_audio_tags_js_1.SharedAudioTagsContextProvider, { numberOfAudioTags: numberOfAudioTags, children: (0, jsx_runtime_1.jsx)(use_video_js_1.VideoProvider, { children: children }) }) }) }) }) }) }) }) }) }) }));
 };
 exports.RemotionRootContexts = RemotionRootContexts;

package/dist/cjs/RenderAssetManager.js

@@ -52,6 +52,6 @@ const RenderAssetManagerProvider = ({ children, collectAssets }) => {
             renderAssets,
         };
     }, [renderAssets, registerRenderAsset, unregisterRenderAsset]);
-    return (jsx_runtime_1.jsx(exports.RenderAssetManager.Provider, { value: contextValue, children: children }));
+    return ((0, jsx_runtime_1.jsx)(exports.RenderAssetManager.Provider, { value: contextValue, children: children }));
 };
 exports.RenderAssetManagerProvider = RenderAssetManagerProvider;

package/dist/cjs/Sequence.js

@@ -64,6 +64,26 @@ const with_interactivity_schema_js_1 = require("./with-interactivity-schema.js")
 const SeriesContentVisibilityContext = (0, react_1.createContext)(true);
 const SequenceContextProvider = (0, committed_metadata_js_1.withCommittedMetadata)(SequenceContext_js_1.SequenceContext.Provider);
 const EMPTY_EFFECTS = [];
+// Bind explicit arguments instead of capturing render variables. Extracted hooks
+// can be inlined by minifiers and retain children through their shared scope.
+const getSequenceRegistration = (sequence) => {
+    return sequence;
+};
+const getSequenceStack = (stack) => {
+    return stack;
+};
+const getSequenceCurrentFrame = (ref) => {
+    return ref.current;
+};
+const setSequenceWrapperRef = (ref, wrapperRef, node) => {
+    wrapperRef.current = node;
+    if (typeof ref === 'function') {
+        ref(node);
+    }
+    else if (ref) {
+        ref.current = node;
+    }
+};
 const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playbackRate = 1, loop = false, freeze, durationInFrames, children, name, height, width, showInTimeline = true, hidden = false, controls, _remotionInternalEffects, _remotionInternalTimelineTrack: timelineTrackItem, _remotionInternalLoopDisplay: loopDisplay, _remotionInternalStack: stack, _remotionInternalSingleChildComponent: childComponentOverride, _remotionInternalDocumentationLink: documentationLink, _remotionInternalPremountDisplay: premountDisplay, _remotionInternalPostmountDisplay: postmountDisplay, _remotionInternalIsMedia: isMedia, cropLeft, cropRight, cropTop, cropBottom, ...other }, ref) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     const { layout = 'absolute-fill' } = other;
@@ -307,14 +327,14 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
     const registrationStack = controls
         ? ((_f = (_e = (0, enable_sequence_stack_traces_js_1.getStackForControls)(controls)) !== null && _e !== void 0 ? _e : stack) !== null && _f !== void 0 ? _f : null)
         : (stack !== null && stack !== void 0 ? stack : null);
-    const getStack = (0, react_1.useCallback)(() => registrationStack, [registrationStack]);
+    const getStack = (0, react_1.useMemo)(() => getSequenceStack.bind(null, registrationStack), [registrationStack]);
     const registeredFrozenFrame = typeof freeze === 'number' ? freeze : null;
     const currentFrame = registeredFrozenFrame !== null && registeredFrozenFrame !== void 0 ? registeredFrozenFrame : (absoluteFrame - currentSequenceStart) * cumulativePlaybackRate;
     const currentFrameRef = (0, react_1.useRef)(currentFrame);
     (0, react_1.useLayoutEffect)(() => {
         currentFrameRef.current = currentFrame;
     }, [currentFrame]);
-    const getCurrentFrame = (0, react_1.useCallback)(() => currentFrameRef.current, []);
+    const getCurrentFrame = (0, react_1.useMemo)(() => getSequenceCurrentFrame.bind(null, currentFrameRef), [currentFrameRef]);
     const registeredTrimBefore = trimBefore === 0 ? null : trimBefore;
     const parentCumulatedNegativeFrom = (_g = parentSequence === null || parentSequence === void 0 ? void 0 : parentSequence.cumulatedNegativeFrom) !== null && _g !== void 0 ? _g : 0;
     const startMediaFrom = isMedia && isMedia.type !== 'image'
@@ -358,10 +378,7 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
         controlsComponentIdentity ===
             'dev.remotion.transitions.TransitionSeries.Overlay';
     const seriesContentVisible = (0, react_1.useContext)(SeriesContentVisibilityContext);
-    const effectRuntimeValues = (0, react_1.useMemo)(() => {
-        var _a;
-        return (_a = _remotionInternalEffects === null || _remotionInternalEffects === void 0 ? void 0 : _remotionInternalEffects.runtimeValues) !== null && _a !== void 0 ? _a : null;
-    }, [_remotionInternalEffects]);
+    const effectRuntimeValues = (0, react_1.useMemo)(() => { var _a; return (_a = _remotionInternalEffects === null || _remotionInternalEffects === void 0 ? void 0 : _remotionInternalEffects.runtimeValues) !== null && _a !== void 0 ? _a : null; }, [_remotionInternalEffects]);
     const registrationControls = (0, react_1.useMemo)(() => {
         if (controlsSchema === undefined ||
             controlsRuntimeValues === undefined ||
@@ -390,7 +407,7 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
         controlsSchema,
         controlsSupportsEffects,
     ]);
-    const getSequenceForRegistration = (0, react_1.useCallback)(() => {
+    const sequenceForRegistration = (0, react_1.useMemo)(() => {
         var _a, _b, _c;
         const trackRegistration = timelineTrack
             ? {
@@ -527,6 +544,7 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
         frozenMediaFrame,
         singleChildComponent,
     ]);
+    const getSequenceForRegistration = (0, react_1.useMemo)(() => getSequenceRegistration.bind(null, sequenceForRegistration), [sequenceForRegistration]);
     const registration = (0, use_sequence_registration_js_1.useSequenceRegistration)({
         getSequence: env.isStudio || sequenceRegistrationEnabled
             ? getSequenceForRegistration
@@ -569,8 +587,8 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
     const content = (activityEnabled ? renderActivity : contentVisible)
         ? children
         : null;
-    const frozenContent = content === null || typeof freeze === 'undefined' || freeze === null ? (content) : (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freeze, children: content }));
-    const loopedContent = frozenContent === null || loopContextValue === null ? (frozenContent) : (jsx_runtime_1.jsx(loop_context_js_1.LoopContext.Provider, { value: loopContextValue, children: frozenContent }));
+    const frozenContent = content === null || typeof freeze === 'undefined' || freeze === null ? (content) : ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freeze, children: content }));
+    const loopedContent = frozenContent === null || loopContextValue === null ? (frozenContent) : ((0, jsx_runtime_1.jsx)(loop_context_js_1.LoopContext.Provider, { value: loopContextValue, children: frozenContent }));
     const styleIfThere = other.layout === 'none' ? undefined : other.style;
     const cropClipPath = (0, sequence_crop_js_1.getSequenceCropClipPath)({
         left: resolvedCropLeft,
@@ -579,15 +597,7 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
         bottom: resolvedCropBottom,
         style: styleIfThere,
     });
-    const sequenceRef = (0, react_1.useCallback)((node) => {
-        wrapperRefForOutline.current = node;
-        if (typeof ref === 'function') {
-            ref(node);
-        }
-        else if (ref) {
-            ref.current = node;
-        }
-    }, [ref]);
+    const sequenceRef = (0, react_1.useMemo)(() => setSequenceWrapperRef.bind(null, ref, wrapperRefForOutline), [ref, wrapperRefForOutline]);
     const defaultStyle = (0, react_1.useMemo)(() => {
         return {
             flexDirection: undefined,
@@ -613,17 +623,17 @@ const RegularSequenceRefForwardingFunction = ({ from = 0, trimBefore = 0, playba
         }
         : null, [automaticOutlineRef, id, registration, shouldDiscoverOutline]);
     if (hidden) {
-        return shouldDiscoverOutline || registration !== null ? (jsx_runtime_1.jsx(SequenceContextProvider, { value: contextValue, _remotionCommitMetadata: metadata, children: null })) : null;
+        return shouldDiscoverOutline || registration !== null ? ((0, jsx_runtime_1.jsx)(SequenceContextProvider, { value: contextValue, _remotionCommitMetadata: metadata, children: null })) : null;
     }
     // Retain resolved scene registrations so Studio can recover the natural end
     // even when seeking past an explicit wrapper trim. Scene contents stay hidden.
     const retainSeriesRegistration = env.isStudio && canInferDuration;
-    const contentForLayout = renderActivity ? (jsx_runtime_1.jsx(SequenceActivityBoundary_js_1.SequenceActivityContent, { dormant: activityDormant, children: loopedContent })) : (loopedContent);
-    const renderedContent = loopedContent === null ? (retainSeriesRegistration ? (children) : null) : other.layout === 'none' ? (contentForLayout) : (jsx_runtime_1.jsx(AbsoluteFillElement_js_1.AbsoluteFillElement, { ref: sequenceRef, style: defaultStyle, className: other.className, children: contentForLayout }));
-    const activityContent = renderActivity ? (jsx_runtime_1.jsx(SequenceActivityBoundary_js_1.SequenceActivityBoundary, { dormant: activityDormant, frame: firstFrame, children: renderedContent })) : (renderedContent);
-    const sequenceContent = (jsx_runtime_1.jsx(SequenceContextProvider, { value: contextValue, _remotionCommitMetadata: metadata, children: retainSeriesRegistration ? (jsx_runtime_1.jsx(SeriesContentVisibilityContext.Provider, { value: renderActivity || contentVisible, children: activityContent })) : (activityContent) }));
+    const contentForLayout = renderActivity ? ((0, jsx_runtime_1.jsx)(SequenceActivityBoundary_js_1.SequenceActivityContent, { dormant: activityDormant, children: loopedContent })) : (loopedContent);
+    const renderedContent = loopedContent === null ? (retainSeriesRegistration ? (children) : null) : other.layout === 'none' ? (contentForLayout) : ((0, jsx_runtime_1.jsx)(AbsoluteFillElement_js_1.AbsoluteFillElement, { ref: sequenceRef, style: defaultStyle, className: other.className, children: contentForLayout }));
+    const activityContent = renderActivity ? ((0, jsx_runtime_1.jsx)(SequenceActivityBoundary_js_1.SequenceActivityBoundary, { dormant: activityDormant, frame: firstFrame, children: renderedContent })) : (renderedContent);
+    const sequenceContent = ((0, jsx_runtime_1.jsx)(SequenceContextProvider, { value: contextValue, _remotionCommitMetadata: metadata, children: retainSeriesRegistration ? ((0, jsx_runtime_1.jsx)(SeriesContentVisibilityContext.Provider, { value: renderActivity || contentVisible, children: activityContent })) : (activityContent) }));
     // Keep the provider mounted when track grouping changes so clip state survives.
-    const sequence = (jsx_runtime_1.jsx(timeline_track_context_js_1.TimelineTrackContext.Provider, { value: timelineTrackRole === 'track' ||
+    const sequence = ((0, jsx_runtime_1.jsx)(timeline_track_context_js_1.TimelineTrackContext.Provider, { value: timelineTrackRole === 'track' ||
             (timelineTrackRole === 'clip' && !showInTimeline)
             ? timelineTrack
             : null, children: sequenceContent }));
@@ -649,7 +659,7 @@ const PremountedPostmountedSequenceRefForwardingFunction = (props, ref) => {
         styleWhilePostmounted: styleWhilePostmounted !== null && styleWhilePostmounted !== void 0 ? styleWhilePostmounted : null,
         hideWhilePremounted: 'opacity',
     });
-    return (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: jsx_runtime_1.jsx(RegularSequence, { ref: ref, from: from, durationInFrames: durationInFrames, style: premountingStyle !== null && premountingStyle !== void 0 ? premountingStyle : undefined, _remotionInternalPremountDisplay: premountFor, _remotionInternalPostmountDisplay: postmountFor, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, ...otherProps }) }));
+    return ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: (0, jsx_runtime_1.jsx)(RegularSequence, { ref: ref, from: from, durationInFrames: durationInFrames, style: premountingStyle !== null && premountingStyle !== void 0 ? premountingStyle : undefined, _remotionInternalPremountDisplay: premountFor, _remotionInternalPostmountDisplay: postmountFor, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, ...otherProps }) }));
 };
 const PremountedPostmountedSequence = (0, react_1.forwardRef)(PremountedPostmountedSequenceRefForwardingFunction);
 const SequenceRefForwardingFunction = (props, ref) => {
@@ -660,10 +670,10 @@ const SequenceRefForwardingFunction = (props, ref) => {
     if (props.layout !== 'none' && !env.isRendering) {
         const effectivePremountFor = (_a = props.premountFor) !== null && _a !== void 0 ? _a : Math.round(defaultPremountInSeconds * fps);
         if (effectivePremountFor || props.postmountFor) {
-            return (jsx_runtime_1.jsx(PremountedPostmountedSequence, { ref: ref, ...props, premountFor: effectivePremountFor }));
+            return ((0, jsx_runtime_1.jsx)(PremountedPostmountedSequence, { ref: ref, ...props, premountFor: effectivePremountFor }));
         }
     }
-    return jsx_runtime_1.jsx(RegularSequence, { ...props, ref: ref });
+    return (0, jsx_runtime_1.jsx)(RegularSequence, { ...props, ref: ref });
 };
 const SequenceInner = (0, react_1.forwardRef)(SequenceRefForwardingFunction);
 exports.SequenceWithoutSchema = SequenceInner;

package/dist/cjs/SequenceActivityBoundary.js

@@ -96,6 +96,6 @@ const SequenceActivityBoundary = ({ children, dormant, frame }) => {
     // 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 }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceActivityDormantContext.Provider, { value: dormant, children: (0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceActivityTimelineContext.Provider, { value: dormant ? dormantTimeline : null, children: (0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceActivityAbsoluteTimeContext.Provider, { value: dormant ? dormantTimeline : null, children: (0, jsx_runtime_1.jsx)(TimelineContext_js_1.TimelineContext.Provider, { value: dormant ? dormantTimeline : timeline, children: (0, jsx_runtime_1.jsx)(TimelineContext_js_1.AbsoluteTimeContext.Provider, { value: dormant ? dormantTimeline : absoluteTime, children: (0, jsx_runtime_1.jsx)(react_1.default.Activity, { mode: dormant && !parentDormant ? 'hidden' : 'visible', children: (0, jsx_runtime_1.jsx)(SuspendSequenceActivity, { dormant: dormant, children: children }) }) }) }) }) }) }));
 };
 exports.SequenceActivityBoundary = SequenceActivityBoundary;

package/dist/cjs/SequenceActivityBudget.js

@@ -165,7 +165,7 @@ const SequenceActivityBudgetProvider = ({ children }) => {
             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 }) }));
+    return ((0, jsx_runtime_1.jsx)(ActivityBudgetContext.Provider, { value: admitting ? budget : null, children: (0, jsx_runtime_1.jsx)(ActivitySelectionContext.Provider, { value: admitted, children: children }) }));
 };
 exports.SequenceActivityBudgetProvider = SequenceActivityBudgetProvider;
 const useSequenceActivityAdmission = (candidate) => {

package/dist/cjs/SequenceActivitySuspensionProvider.js

@@ -40,6 +40,6 @@ const SequenceActivitySuspensionProvider = ({ children }) => {
             }
         };
     }, [enabled, isPlaying, seek, subscribePlaying]);
-    return (jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivitySuspensionContext.Provider, { value: suspended, children: children }));
+    return ((0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceActivitySuspensionContext.Provider, { value: suspended, children: children }));
 };
 exports.SequenceActivitySuspensionProvider = SequenceActivitySuspensionProvider;

package/dist/cjs/SequenceManager.d.ts

@@ -81,9 +81,15 @@ export type CanUpdateSequencePropsResponse<Numeric = SourceNumericValue> = CanUp
 export declare const makeSequencePropsSubscriptionKey: (key: SequencePropsSubscriptionKey) => string;
 export declare const VisualModePropStatusesContext: React.Context<VisualModePropStatuses>;
 export declare const VisualModePropStatusesRefContext: React.Context<VisualModePropStatusesRef>;
+export type VisualModePropStatusesSubscription = {
+    subscribe: (key: string | null, listener: () => void) => () => void;
+    getSnapshot: (key: string | null) => CanUpdateSequencePropsResponse | null;
+};
+export declare const VisualModePropStatusesSubscriptionContext: React.Context<VisualModePropStatusesSubscription>;
 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 usePropStatusForNodePath: (nodePath: SequencePropsSubscriptionKey | null) => CanUpdateSequencePropsResponse | null;
 export declare const useActiveFromDragOverrideKeys: () => ReadonlySet<string>;
 export declare const useEffectDragOverridesForNodePath: (nodePath: SequencePropsSubscriptionKey | null) => Record<string, Record<string, DragOverrideValue>>;
 export declare const VisualModeSettersContext: React.Context<VisualModeSetters>;

package/dist/cjs/SequenceManager.js

@@ -37,7 +37,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-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;
+exports.SequenceManagerProvider = exports.VisualModeBatchSettersContext = exports.VisualModeSettersContext = exports.useEffectDragOverridesForNodePath = exports.useActiveFromDragOverrideKeys = exports.usePropStatusForNodePath = exports.useDragOverridesForNodePath = exports.VisualModeDragOverridesRefContext = exports.VisualModeDragOverridesContext = exports.VisualModePropStatusesSubscriptionContext = exports.VisualModePropStatusesRefContext = exports.VisualModePropStatusesContext = exports.makeSequencePropsSubscriptionKey = exports.VisualModeDragOverridesSubscriptionContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 __exportStar(require("./sequence-registry-context.js"), exports);
@@ -60,10 +60,10 @@ const SequenceManagerScopeProviders = ({ children, dragOverridesSubscription, fr
     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: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceActivityContext.Provider, { value: ((_a = activitySettings === null || activitySettings === void 0 ? void 0 : activitySettings.limit) !== null && _a !== void 0 ? _a : sequence_activity_context_js_1.DEFAULT_SEQUENCE_ACTIVITY_LIMIT) > 0 &&
+    return ((0, jsx_runtime_1.jsx)(ActiveFromDragOverrideKeysContext.Provider, { value: activeFromDragOverrideKeys, children: (0, jsx_runtime_1.jsx)(exports.VisualModeDragOverridesSubscriptionContext.Provider, { value: scopedDragOverridesSubscription, children: (0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceActivityContext.Provider, { value: ((_a = activitySettings === null || activitySettings === void 0 ? void 0 : activitySettings.limit) !== null && _a !== void 0 ? _a : sequence_activity_context_js_1.DEFAULT_SEQUENCE_ACTIVITY_LIMIT) > 0 &&
                     isStudio &&
                     commitRegistrationEnabled &&
-                    typeof react_1.default.Activity !== 'undefined', children: jsx_runtime_1.jsx(SequenceActivitySuspensionProvider_js_1.SequenceActivitySuspensionProvider, { children: jsx_runtime_1.jsx(SequenceActivityBudget_js_1.SequenceActivityBudgetProvider, { children: children }) }) }) }) }));
+                    typeof react_1.default.Activity !== 'undefined', children: (0, jsx_runtime_1.jsx)(SequenceActivitySuspensionProvider_js_1.SequenceActivitySuspensionProvider, { children: (0, jsx_runtime_1.jsx)(SequenceActivityBudget_js_1.SequenceActivityBudgetProvider, { children: children }) }) }) }) }));
 };
 const emptyDragOverrides = {};
 const emptyFromOverrideKeys = new Set();
@@ -78,6 +78,10 @@ exports.VisualModePropStatusesContext = react_1.default.createContext({
 exports.VisualModePropStatusesRefContext = react_1.default.createContext({
     current: {},
 });
+exports.VisualModePropStatusesSubscriptionContext = react_1.default.createContext({
+    subscribe: () => () => undefined,
+    getSnapshot: () => null,
+});
 const defaultVisualModeDragOverrides = {
     getDragOverrides: () => {
         throw new Error('VisualModeDragOverridesContext not initialized');
@@ -88,7 +92,7 @@ const defaultVisualModeDragOverrides = {
 };
 exports.VisualModeDragOverridesContext = react_1.default.createContext(defaultVisualModeDragOverrides);
 exports.VisualModeDragOverridesRefContext = react_1.default.createContext({ current: defaultVisualModeDragOverrides });
-const useDragOverrideSnapshot = (subscribe, getSnapshot) => {
+const useVisualModeSnapshot = (subscribe, getSnapshot) => {
     const dormant = (0, react_1.useContext)(sequence_activity_context_js_1.SequenceActivityDormantContext);
     const [, forceUpdate] = (0, react_1.useState)(0);
     const snapshot = (0, use_sync_external_store_js_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
@@ -107,17 +111,21 @@ const useDragOverridesForNodePath = (nodePath) => {
     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;
     const key = nodePath === null ? null : (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
-    const subscribe = (0, react_1.useCallback)((listener) => {
-        var _a;
-        return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.subscribe(key, listener)) !== null && _a !== void 0 ? _a : (() => undefined);
-    }, [key, scopedSubscription]);
-    const getSnapshot = (0, react_1.useCallback)(() => {
-        var _a;
-        return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getSnapshot(key)) !== null && _a !== void 0 ? _a : emptyDragOverrides;
-    }, [key, scopedSubscription]);
-    return useDragOverrideSnapshot(subscribe, getSnapshot);
+    const subscribe = (0, react_1.useCallback)((listener) => { var _a; return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.subscribe(key, listener)) !== null && _a !== void 0 ? _a : (() => undefined); }, [key, scopedSubscription]);
+    const getSnapshot = (0, react_1.useCallback)(() => { var _a; return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getSnapshot(key)) !== null && _a !== void 0 ? _a : emptyDragOverrides; }, [key, scopedSubscription]);
+    return useVisualModeSnapshot(subscribe, getSnapshot);
 };
 exports.useDragOverridesForNodePath = useDragOverridesForNodePath;
+// Every visual element reads its own status. Subscribing to the whole map would
+// rerender all of them whenever any status in the project changes.
+const usePropStatusForNodePath = (nodePath) => {
+    const subscription = (0, react_1.useContext)(exports.VisualModePropStatusesSubscriptionContext);
+    const key = nodePath === null ? null : (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
+    const subscribe = (0, react_1.useCallback)((listener) => subscription.subscribe(key, listener), [key, subscription]);
+    const getSnapshot = (0, react_1.useCallback)(() => subscription.getSnapshot(key), [key, subscription]);
+    return useVisualModeSnapshot(subscribe, getSnapshot);
+};
+exports.usePropStatusForNodePath = usePropStatusForNodePath;
 const useActiveFromDragOverrideKeys = () => {
     const snapshot = (0, react_1.useContext)(ActiveFromDragOverrideKeysContext);
     const manager = (0, react_1.useContext)(sequence_registry_context_js_1.SequenceManagerActionsContext);
@@ -129,15 +137,9 @@ const useEffectDragOverridesForNodePath = (nodePath) => {
     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;
     const key = nodePath === null ? null : (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
-    const subscribe = (0, react_1.useCallback)((listener) => {
-        var _a;
-        return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.subscribeEffects(key, listener)) !== null && _a !== void 0 ? _a : (() => undefined);
-    }, [key, scopedSubscription]);
-    const getSnapshot = (0, react_1.useCallback)(() => {
-        var _a;
-        return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getEffectSnapshot(key)) !== null && _a !== void 0 ? _a : emptyEffectDragOverrides;
-    }, [key, scopedSubscription]);
-    return useDragOverrideSnapshot(subscribe, getSnapshot);
+    const subscribe = (0, react_1.useCallback)((listener) => { var _a; return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.subscribeEffects(key, listener)) !== null && _a !== void 0 ? _a : (() => undefined); }, [key, scopedSubscription]);
+    const getSnapshot = (0, react_1.useCallback)(() => { var _a; return (_a = scopedSubscription === null || scopedSubscription === void 0 ? void 0 : scopedSubscription.getEffectSnapshot(key)) !== null && _a !== void 0 ? _a : emptyEffectDragOverrides; }, [key, scopedSubscription]);
+    return useVisualModeSnapshot(subscribe, getSnapshot);
 };
 exports.useEffectDragOverridesForNodePath = useEffectDragOverridesForNodePath;
 exports.VisualModeSettersContext = react_1.default.createContext({
@@ -180,8 +182,21 @@ const SequenceManagerProvider = ({ children }) => {
     });
     const [propStatuses, setPropStatusesMapState] = (0, react_1.useState)({});
     const propStatusesRef = (0, react_1.useRef)(propStatuses);
+    // Elements read their own status from the latest requested map, so one that
+    // rerenders together with a status update never renders the previous status.
+    // The layout effect wakes up the elements that did not rerender.
+    const requestedPropStatusesRef = (0, react_1.useRef)(propStatuses);
+    const propStatusListeners = (0, react_1.useRef)(new Map());
     useIsomorphicLayoutEffect(() => {
+        const previous = propStatusesRef.current;
         propStatusesRef.current = propStatuses;
+        for (const [key, listeners] of propStatusListeners.current) {
+            if (previous[key] !== propStatuses[key]) {
+                for (const listener of listeners) {
+                    listener();
+                }
+            }
+        }
     }, [propStatuses]);
     const setDragOverridesBatch = (0, react_1.useCallback)((overrides) => {
         setDragOverrideState((prevState) => {
@@ -372,8 +387,17 @@ const SequenceManagerProvider = ({ children }) => {
             return next;
         });
     }, []);
+    const updatePropStatuses = (0, react_1.useCallback)((update) => {
+        const previous = requestedPropStatusesRef.current;
+        const next = update(previous);
+        if (next === previous) {
+            return;
+        }
+        requestedPropStatusesRef.current = next;
+        setPropStatusesMapState(next);
+    }, []);
     const setPropStatuses = (0, react_1.useCallback)((nodePath, values) => {
-        setPropStatusesMapState((prev) => {
+        updatePropStatuses((prev) => {
             const key = (0, exports.makeSequencePropsSubscriptionKey)(nodePath);
             const prevKey = prev[key];
             const newKey = values(prevKey);
@@ -382,9 +406,9 @@ const SequenceManagerProvider = ({ children }) => {
             }
             return { ...prev, [key]: newKey };
         });
-    }, []);
+    }, [updatePropStatuses]);
     const remapPropStatuses = (0, react_1.useCallback)((remappings) => {
-        setPropStatusesMapState((prev) => {
+        updatePropStatuses((prev) => {
             const next = { ...prev };
             for (const remapping of remappings) {
                 delete next[(0, exports.makeSequencePropsSubscriptionKey)(remapping.previousNodePath)];
@@ -397,7 +421,7 @@ const SequenceManagerProvider = ({ children }) => {
             }
             return next;
         });
-    }, []);
+    }, [updatePropStatuses]);
     const dragOverridesSubscription = (0, react_1.useMemo)(() => ({
         subscribe: subscribeDragOverrides,
         getSnapshot: getDragOverridesSnapshot,
@@ -422,6 +446,26 @@ const SequenceManagerProvider = ({ children }) => {
             propStatuses,
         };
     }, [propStatuses]);
+    const propStatusesSubscription = (0, react_1.useMemo)(() => ({
+        subscribe: (key, listener) => {
+            if (key === null) {
+                return () => undefined;
+            }
+            let listeners = propStatusListeners.current.get(key);
+            if (!listeners) {
+                listeners = new Set();
+                propStatusListeners.current.set(key, listeners);
+            }
+            listeners.add(listener);
+            return () => {
+                listeners.delete(listener);
+                if (listeners.size === 0) {
+                    propStatusListeners.current.delete(key);
+                }
+            };
+        },
+        getSnapshot: (key) => { var _a; return key === null ? null : ((_a = requestedPropStatusesRef.current[key]) !== null && _a !== void 0 ? _a : null); },
+    }), []);
     const dragOverridesContext = (0, react_1.useMemo)(() => {
         return {
             getDragOverrides,
@@ -451,6 +495,6 @@ const SequenceManagerProvider = ({ children }) => {
         remapPropStatuses,
     ]);
     const batchSettersContext = (0, react_1.useMemo)(() => ({ setDragOverridesBatch, setEffectDragOverridesBatch }), [setDragOverridesBatch, setEffectDragOverridesBatch]);
-    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 }) }) }) }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(SequenceRegistryProvider_js_1.SequenceRegistryProvider, { children: (0, jsx_runtime_1.jsx)(exports.VisualModePropStatusesRefContext.Provider, { value: propStatusesRef, children: (0, jsx_runtime_1.jsx)(exports.VisualModePropStatusesSubscriptionContext.Provider, { value: propStatusesSubscription, children: (0, jsx_runtime_1.jsx)(exports.VisualModePropStatusesContext.Provider, { value: propStatusesContext, children: (0, jsx_runtime_1.jsx)(SequenceManagerScopeProviders, { dragOverridesSubscription: dragOverridesSubscription, fromKeys: dragOverrideState.fromKeys, children: (0, jsx_runtime_1.jsx)(exports.VisualModeDragOverridesContext.Provider, { value: dragOverridesContext, children: (0, jsx_runtime_1.jsx)(exports.VisualModeDragOverridesRefContext.Provider, { value: dragOverridesRef, children: (0, jsx_runtime_1.jsx)(exports.VisualModeSettersContext.Provider, { value: settersContext, children: (0, jsx_runtime_1.jsx)(exports.VisualModeBatchSettersContext.Provider, { value: batchSettersContext, children: children }) }) }) }) }) }) }) }) }));
 };
 exports.SequenceManagerProvider = SequenceManagerProvider;

package/dist/cjs/SequenceRegistryProvider.js

@@ -37,6 +37,8 @@ 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 log_level_context_js_1 = require("./log-level-context.js");
+const log_js_1 = require("./log.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");
@@ -44,6 +46,7 @@ const useIsomorphicLayoutEffect = typeof window === 'undefined' ? react_1.defaul
 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 logLevel = (0, log_level_context_js_1.useLogLevel)();
     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()));
@@ -116,6 +119,13 @@ const SequenceRegistryProvider = ({ children }) => {
             committedOrderIdsRef.current = ids;
             committedOrderRef.current = order;
             committedRegistrationIdsRef.current = nextIds;
+            if (isStudio && logLevel === 'trace') {
+                for (const sequence of sequences) {
+                    if (!previousIds.has(sequence.id)) {
+                        log_js_1.Log.trace({ logLevel, tag: null }, `[Sequence registration] Registered "${sequence.displayName}" (${sequence.id}) after commit`, sequence);
+                    }
+                }
+            }
             setSequences((current) => (0, registry_store_js_1.reconcileRegistryEntries)({
                 current,
                 entries: sequences,
@@ -127,7 +137,7 @@ const SequenceRegistryProvider = ({ children }) => {
                 orderProperty: 'timelineOrder',
             }));
         });
-    }, [sequenceManagerId, setSequences]);
+    }, [isStudio, logLevel, sequenceManagerId, setSequences]);
     const onCommitRootSequences = (0, react_1.useCallback)((sequences, sequenceIds) => {
         if (!rootObservationFailedRef.current) {
             observedCommitRef.current = true;
@@ -233,6 +243,9 @@ const SequenceRegistryProvider = ({ children }) => {
         onCommitSequences,
     ]);
     const registerSequence = (0, react_1.useCallback)((seq) => {
+        if (isStudio) {
+            log_js_1.Log.trace({ logLevel, tag: null }, `[Sequence registration] Registered "${seq.displayName}" (${seq.id}) after commit`, seq);
+        }
         setSequences((seqs) => {
             var _a;
             var _b;
@@ -244,7 +257,7 @@ const SequenceRegistryProvider = ({ children }) => {
                 },
             ];
         });
-    }, [setSequences]);
+    }, [isStudio, logLevel, setSequences]);
     const updateSequence = (0, react_1.useCallback)((seq) => {
         setSequences((seqs) => {
             var _a;
@@ -287,6 +300,6 @@ const SequenceRegistryProvider = ({ children }) => {
         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 }) }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(SequenceManagerRefProvider, { value: sequencesRef, _remotionCommitMetadata: metadata, children: (0, jsx_runtime_1.jsx)(sequence_registry_context_js_1.SequenceRegistryScopeContext.Provider, { value: registryScope, children: (0, jsx_runtime_1.jsx)(sequence_registry_context_js_1.SequenceManagerActionsContext.Provider, { value: actions, children: (0, jsx_runtime_1.jsx)(sequence_registry_context_js_1.SequenceRegistryContext.Provider, { value: registry, children: (0, jsx_runtime_1.jsx)(sequence_registry_context_js_1.SequenceCommitRegistrationContext.Provider, { value: commitRegistrationEnabled, children: children }) }) }) }) }));
 };
 exports.SequenceRegistryProvider = SequenceRegistryProvider;

package/dist/cjs/TimelineContext.js

@@ -110,6 +110,6 @@ const TimelineContextProvider = ({ children, frameState }) => {
             audioAndVideoTags,
         };
     }, [bufferingStore, playingStore, readIsBuffering, readIsPlaying, seek]);
-    return (jsx_runtime_1.jsx(exports.AbsoluteTimeContext.Provider, { value: timelineContextValue, children: jsx_runtime_1.jsx(exports.PlaybackRateContext.Provider, { value: playbackRateContextValue, children: jsx_runtime_1.jsx(exports.TimelineContext.Provider, { value: timelineContextValue, children: jsx_runtime_1.jsx(exports.SetTimelineContext.Provider, { value: setTimelineContextValue, children: children }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(exports.AbsoluteTimeContext.Provider, { value: timelineContextValue, children: (0, jsx_runtime_1.jsx)(exports.PlaybackRateContext.Provider, { value: playbackRateContextValue, children: (0, jsx_runtime_1.jsx)(exports.TimelineContext.Provider, { value: timelineContextValue, children: (0, jsx_runtime_1.jsx)(exports.SetTimelineContext.Provider, { value: setTimelineContextValue, children: children }) }) }) }));
 };
 exports.TimelineContextProvider = TimelineContextProvider;

package/dist/cjs/Track.js

@@ -18,12 +18,12 @@ const trackSchema = {
 const TrackWithoutSchema = ({ name = 'Track', children, layout = 'none', ...props }) => {
     const [id] = (0, react_1.useState)(() => String(Math.random()));
     const value = (0, react_1.useMemo)(() => ({ id, name }), [id, name]);
-    return (jsx_runtime_1.jsx(timeline_track_context_js_1.TimelineTrackContext.Provider, { value: value, children: jsx_runtime_1.jsx(Sequence_js_1.SequenceWithoutSchema, { _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/track", ...props, name: name, layout: layout, _remotionInternalTimelineTrack: { role: 'track', seriesOffset: null }, children: children }) }));
+    return ((0, jsx_runtime_1.jsx)(timeline_track_context_js_1.TimelineTrackContext.Provider, { value: value, children: (0, jsx_runtime_1.jsx)(Sequence_js_1.SequenceWithoutSchema, { _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/track", ...props, name: name, layout: layout, _remotionInternalTimelineTrack: { role: 'track', seriesOffset: null }, children: children }) }));
 };
 exports.TrackWithoutSchema = TrackWithoutSchema;
 /** Groups clips on one Studio timeline row and applies Sequence timing. */
 exports.Track = (0, with_interactivity_schema_js_1.withInteractivitySchema)({
-    Component: (props) => jsx_runtime_1.jsx(exports.TrackWithoutSchema, { ...props, layout: "none" }),
+    Component: (props) => (0, jsx_runtime_1.jsx)(exports.TrackWithoutSchema, { ...props, layout: "none" }),
     componentName: '<Track>',
     componentIdentity: 'dev.remotion.remotion.Track',
     schema: trackSchema,