@remotion/studio 4.0.461 → 4.0.463

package/dist/components/Timeline/save-prop-queue.d.ts

@@ -0,0 +1,12 @@
+import type { CanUpdateSequencePropsResponse, SequencePropsSubscriptionKey } from 'remotion';
+type SetCodeValues = (nodePath: SequencePropsSubscriptionKey, values: (prev: CanUpdateSequencePropsResponse) => CanUpdateSequencePropsResponse) => void;
+export type EnqueueSaveOptions<TResponse> = {
+    nodePath: SequencePropsSubscriptionKey;
+    setCodeValues: SetCodeValues;
+    applyOptimistic: (prev: CanUpdateSequencePropsResponse) => CanUpdateSequencePropsResponse;
+    apiCall: () => Promise<TResponse>;
+    mergeServerResponse: (prev: CanUpdateSequencePropsResponse, response: TResponse) => CanUpdateSequencePropsResponse;
+    errorLabel: string;
+};
+export declare const enqueueSavePropChange: <TResponse>({ nodePath, setCodeValues, applyOptimistic, apiCall, mergeServerResponse, errorLabel, }: EnqueueSaveOptions<TResponse>) => Promise<void>;
+export {};

package/dist/components/Timeline/save-prop-queue.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.enqueueSavePropChange = void 0;
+const remotion_1 = require("remotion");
+const NotificationCenter_1 = require("../Notifications/NotificationCenter");
+const queues = new Map();
+const getQueue = (nodePath) => {
+    const key = remotion_1.Internals.makeSequencePropsSubscriptionKey(nodePath);
+    let q = queues.get(key);
+    if (!q) {
+        q = { chain: Promise.resolve(), cancelled: false, committed: null };
+        queues.set(key, q);
+    }
+    return q;
+};
+const dropQueue = (nodePath, q) => {
+    const key = remotion_1.Internals.makeSequencePropsSubscriptionKey(nodePath);
+    if (queues.get(key) === q) {
+        queues.delete(key);
+    }
+};
+const enqueueSavePropChange = ({ nodePath, setCodeValues, applyOptimistic, apiCall, mergeServerResponse, errorLabel, }) => {
+    const q = getQueue(nodePath);
+    if (q.cancelled) {
+        return Promise.resolve();
+    }
+    setCodeValues(nodePath, (prev) => {
+        if (q.committed === null) {
+            q.committed = prev;
+        }
+        return applyOptimistic(prev);
+    });
+    const myQueue = q;
+    const next = myQueue.chain.then(async () => {
+        if (myQueue.cancelled) {
+            return;
+        }
+        try {
+            const response = await apiCall();
+            if (myQueue.cancelled) {
+                return;
+            }
+            setCodeValues(nodePath, (prev) => mergeServerResponse(prev, response));
+            myQueue.committed = mergeServerResponse(myQueue.committed, response);
+            // If nothing more is queued, reset baseline so the next round starts fresh.
+            if (myQueue.chain === next) {
+                dropQueue(nodePath, myQueue);
+            }
+        }
+        catch (err) {
+            myQueue.cancelled = true;
+            const { committed } = myQueue;
+            if (committed !== null) {
+                setCodeValues(nodePath, () => committed);
+            }
+            dropQueue(nodePath, myQueue);
+            (0, NotificationCenter_1.showNotification)(`${errorLabel}: ${err instanceof Error ? err.message : String(err)}`, 4000);
+        }
+    });
+    myQueue.chain = next;
+    return next;
+};
+exports.enqueueSavePropChange = enqueueSavePropChange;

package/dist/components/Timeline/save-sequence-prop.d.ts

@@ -0,0 +1,11 @@
+import type { CanUpdateSequencePropsResponse, SequencePropsSubscriptionKey, SequenceSchema } from 'remotion';
+export type SetCodeValues = (nodePath: SequencePropsSubscriptionKey, values: (prev: CanUpdateSequencePropsResponse) => CanUpdateSequencePropsResponse) => void;
+export declare const saveSequenceProp: ({ fileName, nodePath, fieldKey, value, defaultValue, schema, setCodeValues, }: {
+    fileName: string;
+    nodePath: SequencePropsSubscriptionKey;
+    fieldKey: string;
+    value: unknown;
+    defaultValue: string | null;
+    schema: SequenceSchema;
+    setCodeValues: SetCodeValues;
+}) => Promise<void>;

package/dist/components/Timeline/save-sequence-prop.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.saveSequenceProp = void 0;
+const studio_shared_1 = require("@remotion/studio-shared");
+const call_api_1 = require("../call-api");
+const save_prop_queue_1 = require("./save-prop-queue");
+const saveSequenceProp = ({ fileName, nodePath, fieldKey, value, defaultValue, schema, setCodeValues, }) => {
+    return (0, save_prop_queue_1.enqueueSavePropChange)({
+        nodePath,
+        setCodeValues,
+        applyOptimistic: (prev) => (0, studio_shared_1.optimisticUpdateForCodeValues)({
+            previous: prev,
+            fieldKey,
+            value,
+            schema,
+        }),
+        apiCall: () => (0, call_api_1.callApi)('/api/save-sequence-props', {
+            fileName,
+            nodePath,
+            key: fieldKey,
+            value: JSON.stringify(value),
+            defaultValue,
+            schema,
+        }),
+        mergeServerResponse: (prev, data) => {
+            if (!data.canUpdate) {
+                return data;
+            }
+            return {
+                canUpdate: true,
+                props: data.props,
+                effects: prev.canUpdate ? prev.effects : [],
+            };
+        },
+        errorLabel: 'Could not save sequence prop',
+    });
+};
+exports.saveSequenceProp = saveSequenceProp;

package/dist/components/Timeline/sequence-props-subscription-store.d.ts

@@ -2,11 +2,12 @@ import type { SequenceSchema } from 'remotion';
 import { callApi } from '../call-api';
 type SubscribeResult = Awaited<ReturnType<typeof callApi<'/api/subscribe-to-sequence-props'>>>;
 type ApplyResult = (result: SubscribeResult) => void;
-export declare const acquireSequencePropsSubscription: ({ fileName, line, column, schema, clientId, applyOnce, applyEach, }: {
+export declare const acquireSequencePropsSubscription: ({ fileName, line, column, schema, effects, clientId, applyOnce, applyEach, }: {
     fileName: string;
     line: number;
     column: number;
     schema: SequenceSchema;
+    effects: SequenceSchema[];
     clientId: string;
     applyOnce: ApplyResult;
     applyEach: ApplyResult;

package/dist/components/Timeline/sequence-props-subscription-store.js

@@ -1,19 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.acquireSequencePropsSubscription = void 0;
+const studio_shared_1 = require("@remotion/studio-shared");
 const remotion_1 = require("remotion");
 const call_api_1 = require("../call-api");
-const makeKey = (fileName, line, column) => `${fileName}\0${line}\0${column}`;
+const makeKey = (fileName, line, column, sequenceKeys, effectKeys) => `${fileName}\0${line}\0${column}\0${sequenceKeys.join('\0')}\0${effectKeys.map((keys) => keys.join('\0')).join('\0\0')}`;
 const entries = new Map();
-const acquireSequencePropsSubscription = ({ fileName, line, column, schema, clientId, applyOnce, applyEach, }) => {
-    const key = makeKey(fileName, line, column);
+const acquireSequencePropsSubscription = ({ fileName, line, column, schema, effects, clientId, applyOnce, applyEach, }) => {
+    const sequenceKeys = (0, studio_shared_1.getAllSchemaKeys)(schema);
+    const effectKeys = effects.map((effect) => (0, studio_shared_1.getAllSchemaKeys)(effect));
+    const key = makeKey(fileName, line, column, sequenceKeys, effectKeys);
     let entry = entries.get(key);
     if (!entry) {
         const promise = (0, call_api_1.callApi)('/api/subscribe-to-sequence-props', {
             fileName,
             line,
             column,
-            schema,
+            keys: (0, studio_shared_1.getAllSchemaKeys)(schema),
+            effects: effectKeys,
             clientId,
         });
         const created = {
@@ -72,6 +76,8 @@ const acquireSequencePropsSubscription = ({ fileName, line, column, schema, clie
                     fileName: acquired.fileName,
                     nodePath: result.nodePath,
                     clientId: acquired.clientId,
+                    sequenceKeys,
+                    effectKeys,
                 });
             })
                 .catch(() => {

package/dist/components/Timeline/use-sequence-props-subscription.d.ts

@@ -1,7 +1,8 @@
 import type { SequenceSchema } from 'remotion';
 import type { OriginalPosition } from '../../error-overlay/react-overlay/utils/get-source-map';
-export declare const useSequencePropsSubscription: ({ originalLocation, overrideId, schema, }: {
+export declare const useSequencePropsSubscription: ({ originalLocation, overrideId, schema, effects, }: {
     overrideId: string;
     schema: SequenceSchema;
+    effects: SequenceSchema[];
     originalLocation: OriginalPosition | null;
 }) => void;

package/dist/components/Timeline/use-sequence-props-subscription.js

@@ -5,7 +5,7 @@ const react_1 = require("react");
 const remotion_1 = require("remotion");
 const client_id_1 = require("../../helpers/client-id");
 const sequence_props_subscription_store_1 = require("./sequence-props-subscription-store");
-const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, }) => {
+const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, effects, }) => {
     var _a, _b, _c;
     const { setCodeValues } = (0, react_1.useContext)(remotion_1.Internals.VisualModeSettersContext);
     const { setOverrideIdToNodePath } = (0, react_1.useContext)(remotion_1.Internals.OverrideIdsToNodePathsSettersContext);
@@ -40,6 +40,7 @@ const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, })
             line: locationLine,
             column: locationColumn,
             schema,
+            effects,
             clientId,
             applyOnce: (result) => {
                 if (!result.success) {
@@ -59,6 +60,7 @@ const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, })
         };
     }, [
         clientId,
+        effects,
         locationColumn,
         locationLine,
         locationSource,

package/dist/components/Timeline/use-timeline-height.js

@@ -11,7 +11,7 @@ const TimelineTimeIndicators_1 = require("./TimelineTimeIndicators");
 const useTimelineHeight = ({ shown, hasBeenCut, }) => {
     const { getIsExpanded } = (0, react_1.useContext)(ExpandedTracksProvider_1.ExpandedTracksGetterContext);
     const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
-    const { getCodeValues } = (0, react_1.useContext)(remotion_1.Internals.VisualModeCodeValuesContext);
+    const { codeValues } = (0, react_1.useContext)(remotion_1.Internals.VisualModeCodeValuesContext);
     const previewServerConnected = previewServerState.type === 'connected';
     return (0, react_1.useMemo)(() => {
         const tracksHeight = shown.reduce((acc, track) => {
@@ -25,7 +25,7 @@ const useTimelineHeight = ({ shown, hasBeenCut, }) => {
                     sequence: track.sequence,
                     nodePathInfo: track.nodePathInfo,
                     getIsExpanded,
-                    getCodeValues,
+                    codeValues,
                 }) + timeline_layout_1.TIMELINE_ITEM_BORDER_BOTTOM
                 : 0;
             return acc + layerHeight + expandedHeight;
@@ -34,6 +34,6 @@ const useTimelineHeight = ({ shown, hasBeenCut, }) => {
             timeline_layout_1.TIMELINE_ITEM_BORDER_BOTTOM +
             (hasBeenCut ? MaxTimelineTracks_1.MAX_TIMELINE_TRACKS_NOTICE_HEIGHT : 0) +
             TimelineTimeIndicators_1.TIMELINE_TIME_INDICATOR_HEIGHT);
-    }, [shown, hasBeenCut, previewServerConnected, getIsExpanded, getCodeValues]);
+    }, [shown, hasBeenCut, previewServerConnected, getIsExpanded, codeValues]);
 };
 exports.useTimelineHeight = useTimelineHeight;

package/dist/esm/chunk-5gtx3pza.js

@@ -0,0 +1,9 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+export { __require };