@remotion/studio-server 4.0.461 → 4.0.463

package/dist/preview-server/routes/can-update-sequence-props.js

@@ -36,12 +36,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.computeSequencePropsStatusFromFilenameByLine = exports.computeSequencePropsStatus = exports.computeSequencePropsStatusFromContent = exports.lineColumnToNodePath = exports.findJsxElementAtNodePath = exports.extractStaticValue = exports.isStaticValue = void 0;
+exports.computeSequencePropsStatusFromFilenameByLine = exports.computeSequencePropsStatus = exports.computeSequencePropsStatusFromContent = exports.computeSequencePropsOnlyStatus = exports.lineColumnToNodePath = exports.findJsxElementAtNodePath = exports.extractStaticValue = exports.isStaticValue = void 0;
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
+const renderer_1 = require("@remotion/renderer");
 const recast = __importStar(require("recast"));
 const parse_ast_1 = require("../../codemods/parse-ast");
 const get_ast_node_path_1 = require("../../helpers/get-ast-node-path");
+const can_update_effect_props_1 = require("./can-update-effect-props");
 const isStaticValue = (node) => {
     switch (node.type) {
         case 'NumericLiteral':
@@ -247,12 +249,14 @@ const getNestedPropStatus = (jsxElement, parentKey, childKey) => {
     }
     return { canUpdate: true, codeValue };
 };
-const computeSequencePropsStatusFromContent = (fileContents, nodePath, keys) => {
-    const ast = (0, parse_ast_1.parseAst)(fileContents);
-    const jsxElement = (0, exports.findJsxElementAtNodePath)(ast, nodePath);
-    if (!jsxElement) {
-        throw new Error('Could not find a JSX element at the specified location');
-    }
+const computeEffectsForJsx = ({ jsxElement, effects, }) => {
+    return effects.map((effect, effectIndex) => (0, can_update_effect_props_1.computeEffectPropStatus)({
+        jsx: jsxElement,
+        effectIndex,
+        keys: effect,
+    }));
+};
+const computeSequenceOnlyPropsRecord = ({ jsxElement, keys, }) => {
     const allProps = getPropsStatus(jsxElement);
     const filteredProps = {};
     for (const key of keys) {
@@ -267,23 +271,57 @@ const computeSequencePropsStatusFromContent = (fileContents, nodePath, keys) =>
             filteredProps[key] = { canUpdate: true, codeValue: undefined };
         }
     }
+    return filteredProps;
+};
+const computeSequencePropsOnlyStatus = ({ fileName, nodePath, keys, remotionRoot, }) => {
+    const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
+    const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
+    if (fileRelativeToRoot.startsWith('..')) {
+        throw new Error('Cannot read a file outside the project');
+    }
+    const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
+    const ast = (0, parse_ast_1.parseAst)(fileContents);
+    const jsxElement = (0, exports.findJsxElementAtNodePath)(ast, nodePath);
+    if (!jsxElement) {
+        throw new Error('Cannot compute sequence props: Could not find a JSX element at the specified location');
+    }
+    return {
+        canUpdate: true,
+        props: computeSequenceOnlyPropsRecord({ jsxElement, keys }),
+    };
+};
+exports.computeSequencePropsOnlyStatus = computeSequencePropsOnlyStatus;
+const computeSequencePropsStatusFromContent = ({ fileContents, nodePath, keys, effects, }) => {
+    const ast = (0, parse_ast_1.parseAst)(fileContents);
+    const jsxElement = (0, exports.findJsxElementAtNodePath)(ast, nodePath);
+    if (!jsxElement) {
+        throw new Error('Cannot compute sequence props status: Could not find a JSX element at the specified location');
+    }
+    const filteredProps = computeSequenceOnlyPropsRecord({ jsxElement, keys });
+    const effectsStatuses = computeEffectsForJsx({ jsxElement, effects });
     return {
         canUpdate: true,
         props: filteredProps,
+        effects: effectsStatuses,
     };
 };
 exports.computeSequencePropsStatusFromContent = computeSequencePropsStatusFromContent;
-const computeSequencePropsStatus = ({ fileName, nodePath, keys, remotionRoot, }) => {
+const computeSequencePropsStatus = ({ fileName, nodePath, keys, effects, remotionRoot, }) => {
     const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
     const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
     if (fileRelativeToRoot.startsWith('..')) {
         throw new Error('Cannot read a file outside the project');
     }
     const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
-    return (0, exports.computeSequencePropsStatusFromContent)(fileContents, nodePath, keys);
+    return (0, exports.computeSequencePropsStatusFromContent)({
+        fileContents,
+        nodePath,
+        keys,
+        effects,
+    });
 };
 exports.computeSequencePropsStatus = computeSequencePropsStatus;
-const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, keys, remotionRoot, }) => {
+const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, keys, effects, remotionRoot, logLevel, }) => {
     try {
         const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
         const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
@@ -294,24 +332,37 @@ const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, keys, re
         const ast = (0, parse_ast_1.parseAst)(fileContents);
         const resolvedNodePath = (0, exports.lineColumnToNodePath)(ast, line);
         if (!resolvedNodePath) {
-            throw new Error('Could not find a JSX element at the specified location');
+            return {
+                status: {
+                    canUpdate: false,
+                    reason: 'not-found',
+                },
+                success: false,
+            };
         }
         return {
             status: (0, exports.computeSequencePropsStatus)({
                 fileName,
                 nodePath: resolvedNodePath,
                 keys,
+                effects,
                 remotionRoot,
             }),
-            nodePath: resolvedNodePath,
+            nodePath: {
+                absolutePath,
+                nodePath: resolvedNodePath,
+                sequenceKeys: keys,
+                effectKeys: effects,
+            },
             success: true,
         };
     }
     catch (err) {
+        renderer_1.RenderInternals.Log.error({ indent: false, logLevel }, err);
         return {
             status: {
                 canUpdate: false,
-                reason: err.message,
+                reason: 'error',
             },
             success: false,
         };

package/dist/preview-server/routes/log-updates/format-effect-prop-change.d.ts

@@ -0,0 +1,10 @@
+import { type PropDelta } from './formatting';
+export declare const formatEffectPropChange: ({ effectName, key, oldValueString, newValueString, defaultValueString, removedProps, addedProps, }: {
+    effectName: string;
+    key: string;
+    oldValueString: string;
+    newValueString: string;
+    defaultValueString: string | null;
+    removedProps: PropDelta[];
+    addedProps: PropDelta[];
+}) => string;

package/dist/preview-server/routes/log-updates/format-effect-prop-change.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatEffectPropChange = void 0;
+const format_side_props_1 = require("./format-side-props");
+const formatting_1 = require("./formatting");
+const formatEffectPropBody = (key, valueString) => {
+    return `${(0, formatting_1.punctuation)(key)}${(0, formatting_1.punctuation)(': ')}${(0, formatting_1.colorValue)(valueString)}`;
+};
+const formatEffectCall = (effectName, key, valueString) => {
+    return `${(0, formatting_1.attrName)(effectName)}${(0, formatting_1.punctuation)('(')}${(0, formatting_1.punctuation)('{')}${formatEffectPropBody(key, valueString)}${(0, formatting_1.punctuation)('}')}${(0, formatting_1.punctuation)(')')}`;
+};
+const formatEffectDeletion = ({ effectName, key, valueString, }) => {
+    const inner = formatEffectPropBody(key, valueString);
+    return `${(0, formatting_1.attrName)(effectName)}${(0, formatting_1.punctuation)('(')}${(0, formatting_1.punctuation)('{')}${(0, formatting_1.strikeThroughOrRemovedPrefix)(inner)}${(0, formatting_1.punctuation)('}')}${(0, formatting_1.punctuation)(')')}`;
+};
+const formatEffectAddition = ({ effectName, key, valueString, }) => {
+    return (0, formatting_1.addedPrefixIfNoColor)(formatEffectCall(effectName, key, valueString));
+};
+const formatEffectInnerPropChange = ({ effectName, key, oldValueString, newValueString, defaultValueString, }) => {
+    if (defaultValueString !== null && newValueString === defaultValueString) {
+        return formatEffectDeletion({
+            effectName,
+            key,
+            valueString: oldValueString,
+        });
+    }
+    if (defaultValueString !== null && oldValueString === defaultValueString) {
+        return formatEffectAddition({
+            effectName,
+            key,
+            valueString: newValueString,
+        });
+    }
+    return `${formatEffectCall(effectName, key, oldValueString)} \u2192 ${formatEffectCall(effectName, key, newValueString)}`;
+};
+const formatEffectPropChange = ({ effectName, key, oldValueString, newValueString, defaultValueString, removedProps, addedProps, }) => {
+    const suffix = (0, format_side_props_1.formatSideProps)({ removedProps, addedProps });
+    return [
+        formatEffectInnerPropChange({
+            effectName,
+            key,
+            oldValueString,
+            newValueString,
+            defaultValueString,
+        }),
+        suffix,
+    ]
+        .filter(Boolean)
+        .join(', ');
+};
+exports.formatEffectPropChange = formatEffectPropChange;

package/dist/preview-server/routes/log-updates/log-effect-update.d.ts

@@ -0,0 +1,14 @@
+import type { PropDelta } from './formatting';
+export declare const logEffectUpdate: ({ fileRelativeToRoot, line, effectName, propKey, oldValueString, newValueString, defaultValueString, formatted, logLevel, removedProps, addedProps, }: {
+    fileRelativeToRoot: string;
+    line: number;
+    effectName: string;
+    propKey: string;
+    oldValueString: string;
+    newValueString: string;
+    defaultValueString: string | null;
+    formatted: boolean;
+    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
+    removedProps: PropDelta[];
+    addedProps: PropDelta[];
+}) => void;

package/dist/preview-server/routes/log-updates/log-effect-update.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logEffectUpdate = void 0;
+const renderer_1 = require("@remotion/renderer");
+const format_effect_prop_change_1 = require("./format-effect-prop-change");
+const log_update_1 = require("./log-update");
+const logEffectUpdate = ({ fileRelativeToRoot, line, effectName, propKey, oldValueString, newValueString, defaultValueString, formatted, logLevel, removedProps, addedProps, }) => {
+    const locationLabel = `${fileRelativeToRoot}:${line}`;
+    const propChange = (0, format_effect_prop_change_1.formatEffectPropChange)({
+        effectName,
+        key: propKey,
+        oldValueString: (0, log_update_1.normalizeQuotes)(oldValueString),
+        newValueString: (0, log_update_1.normalizeQuotes)(newValueString),
+        defaultValueString: defaultValueString !== null ? (0, log_update_1.normalizeQuotes)(defaultValueString) : null,
+        removedProps,
+        addedProps,
+    });
+    renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${renderer_1.RenderInternals.chalk.blueBright(`${locationLabel}`)} ${propChange}`);
+    if (!formatted) {
+        (0, log_update_1.warnAboutPrettierOnce)(logLevel);
+    }
+};
+exports.logEffectUpdate = logEffectUpdate;

package/dist/preview-server/routes/save-effect-props.d.ts

@@ -0,0 +1,3 @@
+import type { SaveEffectPropsRequest, SaveEffectPropsResponse } from '@remotion/studio-shared';
+import type { ApiHandler } from '../api-types';
+export declare const saveEffectPropsHandler: ApiHandler<SaveEffectPropsRequest, SaveEffectPropsResponse>;

package/dist/preview-server/routes/save-effect-props.js

@@ -0,0 +1,108 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.saveEffectPropsHandler = void 0;
+const node_fs_1 = require("node:fs");
+const node_path_1 = __importDefault(require("node:path"));
+const renderer_1 = require("@remotion/renderer");
+const studio_shared_1 = require("@remotion/studio-shared");
+const parse_ast_1 = require("../../codemods/parse-ast");
+const update_effect_props_1 = require("../../codemods/update-effect-props/update-effect-props");
+const file_watcher_1 = require("../../file-watcher");
+const undo_stack_1 = require("../undo-stack");
+const watch_ignore_next_change_1 = require("../watch-ignore-next-change");
+const can_update_effect_props_1 = require("./can-update-effect-props");
+const can_update_sequence_props_1 = require("./can-update-sequence-props");
+const format_effect_prop_change_1 = require("./log-updates/format-effect-prop-change");
+const log_effect_update_1 = require("./log-updates/log-effect-update");
+const log_update_1 = require("./log-updates/log-update");
+const save_props_mutex_1 = require("./save-props-mutex");
+const saveEffectPropsHandler = ({ input: { fileName, sequenceNodePath, effectIndex, key, value, defaultValue, schema, }, remotionRoot, logLevel, }) => (0, save_props_mutex_1.withSavePropsLock)(async () => {
+    renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[save-effect-props] Received request for fileName="${fileName}" effectIndex=${effectIndex} key="${key}"`);
+    const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
+    const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
+    if (fileRelativeToRoot.startsWith('..')) {
+        throw new Error('Cannot modify a file outside the project');
+    }
+    const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
+    const parsedDefault = defaultValue !== null ? JSON.parse(defaultValue) : null;
+    const { output, oldValueString, formatted, logLine, effectCallee } = await (0, update_effect_props_1.updateEffectProps)({
+        input: fileContents,
+        sequenceNodePath: sequenceNodePath.nodePath,
+        effectIndex,
+        update: {
+            key,
+            value: JSON.parse(value),
+            defaultValue: parsedDefault,
+        },
+    });
+    const defaultValueString = parsedDefault !== null ? JSON.stringify(parsedDefault) : null;
+    const normalizedOld = (0, log_update_1.normalizeQuotes)(oldValueString);
+    const normalizedNew = (0, log_update_1.normalizeQuotes)(value);
+    const normalizedDefault = defaultValueString !== null ? (0, log_update_1.normalizeQuotes)(defaultValueString) : null;
+    const undoPropChange = (0, format_effect_prop_change_1.formatEffectPropChange)({
+        effectName: effectCallee,
+        key,
+        oldValueString: normalizedNew,
+        newValueString: normalizedOld,
+        defaultValueString: normalizedDefault,
+        removedProps: [],
+        addedProps: [],
+    });
+    const redoPropChange = (0, format_effect_prop_change_1.formatEffectPropChange)({
+        effectName: effectCallee,
+        key,
+        oldValueString: normalizedOld,
+        newValueString: normalizedNew,
+        defaultValueString: normalizedDefault,
+        removedProps: [],
+        addedProps: [],
+    });
+    (0, undo_stack_1.pushToUndoStack)({
+        filePath: absolutePath,
+        oldContents: fileContents,
+        logLevel,
+        remotionRoot,
+        logLine,
+        description: {
+            undoMessage: `↩️  ${undoPropChange}`,
+            redoMessage: `↪️  ${redoPropChange}`,
+        },
+        entryType: 'effect-props',
+        suppressHmrOnFileRestore: true,
+    });
+    (0, undo_stack_1.suppressUndoStackInvalidation)(absolutePath);
+    (0, watch_ignore_next_change_1.suppressBundlerUpdateForFile)(absolutePath);
+    (0, file_watcher_1.writeFileAndNotifyFileWatchers)(absolutePath, output);
+    (0, log_effect_update_1.logEffectUpdate)({
+        fileRelativeToRoot,
+        line: logLine,
+        effectName: effectCallee,
+        propKey: key,
+        oldValueString,
+        newValueString: value,
+        defaultValueString,
+        formatted,
+        logLevel,
+        removedProps: [],
+        addedProps: [],
+    });
+    (0, undo_stack_1.printUndoHint)(logLevel);
+    const ast = (0, parse_ast_1.parseAst)((0, node_fs_1.readFileSync)(absolutePath, 'utf-8'));
+    const jsx = (0, can_update_sequence_props_1.findJsxElementAtNodePath)(ast, sequenceNodePath.nodePath);
+    if (!jsx) {
+        return {
+            canUpdate: false,
+            effectIndex,
+            reason: 'not-found',
+        };
+    }
+    return (0, can_update_effect_props_1.computeEffectPropStatus)({
+        jsx,
+        effectIndex,
+        keys: (0, studio_shared_1.getAllSchemaKeys)(schema),
+    });
+});
+exports.saveEffectPropsHandler = saveEffectPropsHandler;

package/dist/preview-server/routes/save-props-mutex.d.ts

@@ -0,0 +1 @@
+export declare const withSavePropsLock: <T>(fn: () => Promise<T>) => Promise<T>;

package/dist/preview-server/routes/save-props-mutex.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withSavePropsLock = void 0;
+let chain = Promise.resolve();
+const withSavePropsLock = (fn) => {
+    const run = () => fn();
+    const next = chain.then(run, run);
+    chain = next.then(() => undefined, () => undefined);
+    return next;
+};
+exports.withSavePropsLock = withSavePropsLock;

package/dist/preview-server/routes/save-sequence-props.d.ts

@@ -1,4 +1,3 @@
-import type { SaveSequencePropsRequest } from '@remotion/studio-shared';
-import type { CanUpdateSequencePropsResponse } from 'remotion';
+import type { SaveSequencePropsRequest, SaveSequencePropsResponse } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
-export declare const saveSequencePropsHandler: ApiHandler<SaveSequencePropsRequest, CanUpdateSequencePropsResponse>;
+export declare const saveSequencePropsHandler: ApiHandler<SaveSequencePropsRequest, SaveSequencePropsResponse>;

package/dist/preview-server/routes/save-sequence-props.js

@@ -7,8 +7,8 @@ exports.saveSequencePropsHandler = void 0;
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
 const renderer_1 = require("@remotion/renderer");
-const remotion_1 = require("remotion");
-const get_all_schema_keys_1 = require("../../codemods/get-all-schema-keys");
+const studio_shared_1 = require("@remotion/studio-shared");
+const no_react_1 = require("remotion/no-react");
 const update_sequence_props_1 = require("../../codemods/update-sequence-props/update-sequence-props");
 const file_watcher_1 = require("../../file-watcher");
 const undo_stack_1 = require("../undo-stack");
@@ -16,7 +16,8 @@ const watch_ignore_next_change_1 = require("../watch-ignore-next-change");
 const can_update_sequence_props_1 = require("./can-update-sequence-props");
 const format_prop_change_1 = require("./log-updates/format-prop-change");
 const log_update_1 = require("./log-updates/log-update");
-const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, value, defaultValue, schema }, remotionRoot, logLevel, }) => {
+const save_props_mutex_1 = require("./save-props-mutex");
+const saveSequencePropsHandler = ({ input: { fileName, nodePath, key, value, defaultValue, schema }, remotionRoot, logLevel, }) => (0, save_props_mutex_1.withSavePropsLock)(async () => {
     renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[save-sequence-props] Received request for fileName="${fileName}" key="${key}"`);
     const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
     const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
@@ -26,7 +27,7 @@ const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, valu
     const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
     const { output, oldValueStrings, formatted, logLine, removedProps } = await (0, update_sequence_props_1.updateSequenceProps)({
         input: fileContents,
-        nodePath,
+        nodePath: nodePath.nodePath,
         updates: [
             {
                 key,
@@ -34,7 +35,7 @@ const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, valu
                 defaultValue: defaultValue !== null ? JSON.parse(defaultValue) : null,
             },
         ],
-        schema: remotion_1.Internals.sequenceSchema,
+        schema: no_react_1.NoReactInternals.sequenceSchema,
     });
     const oldValueString = oldValueStrings[0];
     const newValueString = JSON.stringify(JSON.parse(value));
@@ -88,12 +89,12 @@ const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, valu
         addedProps: [],
     });
     (0, undo_stack_1.printUndoHint)(logLevel);
-    const newStatus = (0, can_update_sequence_props_1.computeSequencePropsStatus)({
+    const newStatus = (0, can_update_sequence_props_1.computeSequencePropsOnlyStatus)({
         fileName,
-        keys: (0, get_all_schema_keys_1.getAllSchemaKeys)(schema),
-        nodePath,
+        keys: (0, studio_shared_1.getAllSchemaKeys)(schema),
+        nodePath: nodePath.nodePath,
         remotionRoot,
     });
     return newStatus;
-};
+});
 exports.saveSequencePropsHandler = saveSequencePropsHandler;

package/dist/preview-server/routes/subscribe-to-sequence-props.js

@@ -1,16 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.subscribeToSequenceProps = void 0;
-const get_all_schema_keys_1 = require("../../codemods/get-all-schema-keys");
 const sequence_props_watchers_1 = require("../sequence-props-watchers");
-const subscribeToSequenceProps = ({ input: { fileName, line, column, schema, clientId }, remotionRoot }) => {
+const subscribeToSequenceProps = ({ input: { fileName, line, column, keys, effects, clientId }, remotionRoot, logLevel, }) => {
     const result = (0, sequence_props_watchers_1.subscribeToSequencePropsWatchers)({
         fileName,
         line,
         column,
-        keys: (0, get_all_schema_keys_1.getAllSchemaKeys)(schema),
+        keys,
+        effects,
         remotionRoot,
         clientId,
+        logLevel,
     });
     return Promise.resolve(result);
 };

package/dist/preview-server/routes/unsubscribe-from-sequence-props.js

@@ -2,12 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.unsubscribeFromSequenceProps = void 0;
 const sequence_props_watchers_1 = require("../sequence-props-watchers");
-const unsubscribeFromSequenceProps = ({ input: { fileName, nodePath, clientId }, remotionRoot }) => {
+const unsubscribeFromSequenceProps = ({ input: { fileName, nodePath, clientId, sequenceKeys, effectKeys }, remotionRoot, }) => {
     (0, sequence_props_watchers_1.unsubscribeFromSequencePropsWatchers)({
         fileName,
-        nodePath,
+        nodePath: nodePath.nodePath,
         remotionRoot,
         clientId,
+        sequenceKeys,
+        effectKeys,
     });
     return Promise.resolve(undefined);
 };

package/dist/preview-server/sequence-props-watchers.d.ts

@@ -1,17 +1,21 @@
-import type { SubscribeToSequencePropsResponse } from '@remotion/studio-shared';
+import { type SubscribeToSequencePropsResponse } from '@remotion/studio-shared';
 import type { SequenceNodePath } from 'remotion';
-export declare const subscribeToSequencePropsWatchers: ({ fileName, line, column, keys, remotionRoot, clientId, }: {
+export declare const subscribeToSequencePropsWatchers: ({ fileName, line, column, keys, effects, remotionRoot, clientId, logLevel, }: {
     fileName: string;
     line: number;
     column: number;
     keys: string[];
+    effects: string[][];
     remotionRoot: string;
     clientId: string;
+    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
 }) => SubscribeToSequencePropsResponse;
-export declare const unsubscribeFromSequencePropsWatchers: ({ fileName, nodePath, remotionRoot, clientId, }: {
+export declare const unsubscribeFromSequencePropsWatchers: ({ fileName, nodePath, remotionRoot, clientId, sequenceKeys, effectKeys, }: {
     fileName: string;
     nodePath: SequenceNodePath;
     remotionRoot: string;
     clientId: string;
+    sequenceKeys: string[];
+    effectKeys: string[][];
 }) => void;
 export declare const unsubscribeClientSequencePropsWatchers: (clientId: string) => void;

package/dist/preview-server/sequence-props-watchers.js

@@ -5,15 +5,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.unsubscribeClientSequencePropsWatchers = exports.unsubscribeFromSequencePropsWatchers = exports.subscribeToSequencePropsWatchers = void 0;
 const node_path_1 = __importDefault(require("node:path"));
+const renderer_1 = require("@remotion/renderer");
+const studio_shared_1 = require("@remotion/studio-shared");
 const file_watcher_1 = require("../file-watcher");
 const live_events_1 = require("./live-events");
 const node_path_cache_1 = require("./node-path-cache");
 const can_update_sequence_props_1 = require("./routes/can-update-sequence-props");
 const sequencePropsWatchers = {};
-const makeWatcherKey = ({ absolutePath, nodePath, }) => {
-    return `${absolutePath}:${JSON.stringify(nodePath)}`;
-};
-const getSequencePropsStatus = ({ fileName, line, column, keys, remotionRoot, }) => {
+const getSequencePropsStatus = ({ fileName, line, column, keys, effects, remotionRoot, logLevel, }) => {
     // Try cached nodePath first (handles stale source maps after suppressed rebuilds)
     const cachedNodePath = (0, node_path_cache_1.getCachedNodePath)(fileName, line, column);
     if (cachedNodePath) {
@@ -21,37 +20,51 @@ const getSequencePropsStatus = ({ fileName, line, column, keys, remotionRoot, })
             fileName,
             nodePath: cachedNodePath,
             keys,
+            effects,
             remotionRoot,
         });
         if (cachedResult.canUpdate) {
-            return { status: cachedResult, nodePath: cachedNodePath, success: true };
+            return {
+                status: cachedResult,
+                nodePath: {
+                    absolutePath: node_path_1.default.resolve(remotionRoot, fileName),
+                    nodePath: cachedNodePath,
+                    sequenceKeys: keys,
+                    effectKeys: effects,
+                },
+                success: true,
+            };
         }
     }
     const status = (0, can_update_sequence_props_1.computeSequencePropsStatusFromFilenameByLine)({
         fileName,
         line,
         keys,
+        effects,
         remotionRoot,
+        logLevel,
     });
     return status;
 };
-const subscribeToSequencePropsWatchers = ({ fileName, line, column, keys, remotionRoot, clientId, }) => {
+const subscribeToSequencePropsWatchers = ({ fileName, line, column, keys, effects, remotionRoot, clientId, logLevel, }) => {
     var _a;
     const initialResult = getSequencePropsStatus({
         fileName,
         line,
         column,
         keys,
+        effects,
         remotionRoot,
+        logLevel,
     });
     if (!initialResult.success) {
         return initialResult;
     }
     const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
     // Cache the resolved nodePath for future lookups with stale source maps
-    (0, node_path_cache_1.setCachedNodePath)(fileName, line, column, initialResult.nodePath);
+    (0, node_path_cache_1.setCachedNodePath)(fileName, line, column, initialResult.nodePath.nodePath);
     const { nodePath } = initialResult;
-    const watcherKey = makeWatcherKey({ absolutePath, nodePath });
+    const watcherKey = (0, studio_shared_1.stringifySequenceSubscriptionKey)(nodePath);
     // If a watcher already exists for this key, just bump the ref count
     if ((_a = sequencePropsWatchers[clientId]) === null || _a === void 0 ? void 0 : _a[watcherKey]) {
         sequencePropsWatchers[clientId][watcherKey].refCount++;
@@ -64,21 +77,32 @@ const subscribeToSequencePropsWatchers = ({ fileName, line, column, keys, remoti
             if (event.type === 'deleted') {
                 return;
             }
-            let result;
             try {
-                result = (0, can_update_sequence_props_1.computeSequencePropsStatusFromContent)(event.content, nodePath, keys);
+                const result = (0, can_update_sequence_props_1.computeSequencePropsStatusFromContent)({
+                    fileContents: event.content,
+                    nodePath: nodePath.nodePath,
+                    keys,
+                    effects,
+                });
+                const previousEffectChain = result.effects.map((effect) => effect.canUpdate && effect.callee);
+                const newEffectChain = initialResult.success &&
+                    initialResult.status.effects.map((effect) => effect.canUpdate && effect.callee);
+                if (previousEffectChain.join(',') !== newEffectChain.join(',')) {
+                    renderer_1.RenderInternals.Log.verbose({ indent: false, logLevel }, 'Effect chain changed, not sending "sequence-props-updated" event');
+                    return;
+                }
+                (0, live_events_1.waitForLiveEventsListener)().then((listener) => {
+                    listener.sendEventToClientId(clientId, {
+                        type: 'sequence-props-updated',
+                        fileName,
+                        nodePath,
+                        result,
+                    });
+                });
             }
-            catch (_a) {
-                return;
+            catch (error) {
+                renderer_1.RenderInternals.Log.error({ indent: false, logLevel }, error);
             }
-            (0, live_events_1.waitForLiveEventsListener)().then((listener) => {
-                listener.sendEventToClientId(clientId, {
-                    type: 'sequence-props-updated',
-                    fileName,
-                    nodePath,
-                    result,
-                });
-            });
         },
     });
     if (!sequencePropsWatchers[clientId]) {
@@ -88,9 +112,14 @@ const subscribeToSequencePropsWatchers = ({ fileName, line, column, keys, remoti
     return initialResult;
 };
 exports.subscribeToSequencePropsWatchers = subscribeToSequencePropsWatchers;
-const unsubscribeFromSequencePropsWatchers = ({ fileName, nodePath, remotionRoot, clientId, }) => {
+const unsubscribeFromSequencePropsWatchers = ({ fileName, nodePath, remotionRoot, clientId, sequenceKeys, effectKeys, }) => {
     const absolutePath = node_path_1.default.resolve(remotionRoot, fileName);
-    const watcherKey = makeWatcherKey({ absolutePath, nodePath });
+    const watcherKey = (0, studio_shared_1.stringifySequenceSubscriptionKey)({
+        absolutePath,
+        nodePath,
+        sequenceKeys,
+        effectKeys,
+    });
     if (!sequencePropsWatchers[clientId] ||
         !sequencePropsWatchers[clientId][watcherKey]) {
         return;

package/dist/preview-server/undo-stack.d.ts

@@ -3,7 +3,7 @@ export interface UndoEntryDescription {
     undoMessage: string;
     redoMessage: string;
 }
-type UndoEntryType = 'visual-control' | 'default-props' | 'sequence-props' | 'delete-jsx-node' | 'duplicate-jsx-node';
+type UndoEntryType = 'visual-control' | 'default-props' | 'sequence-props' | 'effect-props' | 'delete-jsx-node' | 'duplicate-jsx-node';
 type UndoEntry = {
     filePath: string;
     oldContents: string;
@@ -18,6 +18,8 @@ type UndoEntry = {
     entryType: 'default-props';
 } | {
     entryType: 'sequence-props';
+} | {
+    entryType: 'effect-props';
 } | {
     entryType: 'delete-jsx-node';
 } | {