@remotion/studio-server 4.0.438 → 4.0.440

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

@@ -1,9 +1,44 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.canUpdateDefaultPropsHandler = exports.checkIfTypeScriptFile = void 0;
+exports.computeCanUpdateDefaultProps = exports.computeCanUpdateDefaultPropsFromContent = exports.checkIfTypeScriptFile = void 0;
 const node_fs_1 = require("node:fs");
-const update_default_props_1 = require("../../codemods/update-default-props");
+const recast = __importStar(require("recast"));
+const parse_ast_1 = require("../../codemods/parse-ast");
 const project_info_1 = require("../project-info");
+const can_update_sequence_props_1 = require("./can-update-sequence-props");
 const checkIfTypeScriptFile = (file) => {
     if (!file.endsWith('.tsx') &&
         !file.endsWith('.ts') &&
@@ -13,28 +48,118 @@ const checkIfTypeScriptFile = (file) => {
     }
 };
 exports.checkIfTypeScriptFile = checkIfTypeScriptFile;
-const canUpdateDefaultPropsHandler = async ({ input: { compositionId }, remotionRoot, entryPoint }) => {
+const extractDefaultPropsFromSource = (input, compositionId) => {
+    const ast = (0, parse_ast_1.parseAst)(input);
+    let result = null;
+    recast.types.visit(ast, {
+        visitJSXElement(path) {
+            var _a;
+            const { openingElement } = path.node;
+            const openingName = openingElement.name;
+            if (openingName.type !== 'JSXIdentifier' &&
+                openingName.type !== 'JSXNamespacedName') {
+                this.traverse(path);
+                return;
+            }
+            if (openingName.name !== 'Composition' && openingName.name !== 'Still') {
+                this.traverse(path);
+                return;
+            }
+            if (!((_a = openingElement.attributes) === null || _a === void 0 ? void 0 : _a.some((attr) => {
+                if (attr.type === 'JSXSpreadAttribute') {
+                    return;
+                }
+                if (!attr.value) {
+                    return;
+                }
+                if (attr.value.type === 'JSXElement') {
+                    return;
+                }
+                if (attr.value.type === 'JSXExpressionContainer') {
+                    return;
+                }
+                if (attr.value.type === 'JSXFragment') {
+                    return;
+                }
+                return attr.name.name === 'id' && attr.value.value === compositionId;
+            }))) {
+                this.traverse(path);
+                return;
+            }
+            const defaultPropsAttr = openingElement.attributes.find((attr) => {
+                if (attr.type === 'JSXSpreadAttribute') {
+                    return;
+                }
+                return attr.name.name === 'defaultProps';
+            });
+            if (!defaultPropsAttr || defaultPropsAttr.type === 'JSXSpreadAttribute') {
+                this.traverse(path);
+                return;
+            }
+            if (!defaultPropsAttr.value ||
+                defaultPropsAttr.value.type !== 'JSXExpressionContainer') {
+                this.traverse(path);
+                return;
+            }
+            const { expression } = defaultPropsAttr.value;
+            if (expression.type === 'JSXEmptyExpression') {
+                this.traverse(path);
+                return;
+            }
+            if ((0, can_update_sequence_props_1.isStaticValue)(expression)) {
+                const value = (0, can_update_sequence_props_1.extractStaticValue)(expression);
+                if (value !== null &&
+                    typeof value === 'object' &&
+                    !Array.isArray(value)) {
+                    result = value;
+                }
+            }
+            this.traverse(path);
+        },
+    });
+    return result;
+};
+const computeCanUpdateDefaultPropsFromContent = (content, compositionId) => {
+    try {
+        const currentDefaultProps = extractDefaultPropsFromSource(content, compositionId);
+        if (currentDefaultProps === null) {
+            throw new Error(`Could not find or extract defaultProps for composition "${compositionId}"`);
+        }
+        return {
+            canUpdate: true,
+            currentDefaultProps,
+        };
+    }
+    catch (err) {
+        return {
+            canUpdate: false,
+            reason: err.message,
+        };
+    }
+};
+exports.computeCanUpdateDefaultPropsFromContent = computeCanUpdateDefaultPropsFromContent;
+const computeCanUpdateDefaultProps = async ({ compositionId, remotionRoot, entryPoint, }) => {
     try {
         const projectInfo = await (0, project_info_1.getProjectInfo)(remotionRoot, entryPoint);
         if (!projectInfo.rootFile) {
             throw new Error('Cannot find root file in project');
         }
         (0, exports.checkIfTypeScriptFile)(projectInfo.rootFile);
-        await (0, update_default_props_1.updateDefaultProps)({
-            compositionId,
-            input: (0, node_fs_1.readFileSync)(projectInfo.rootFile, 'utf-8'),
-            newDefaultProps: {},
-            enumPaths: [],
-        });
+        const input = (0, node_fs_1.readFileSync)(projectInfo.rootFile, 'utf-8');
+        const result = (0, exports.computeCanUpdateDefaultPropsFromContent)(input, compositionId);
         return {
-            canUpdate: true,
+            result,
+            rootFile: projectInfo.rootFile,
         };
     }
     catch (err) {
         return {
-            canUpdate: false,
-            reason: err.message,
+            result: {
+                canUpdate: false,
+                reason: err.message,
+            },
+            rootFile: null,
         };
     }
 };
-exports.canUpdateDefaultPropsHandler = canUpdateDefaultPropsHandler;
+exports.computeCanUpdateDefaultProps = computeCanUpdateDefaultProps;

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

@@ -52,6 +52,8 @@ const isStaticValue = (node) => {
             return ((node.operator === '-' ||
                 node.operator === '+') &&
                 node.argument.type === 'NumericLiteral');
+        case 'TSAsExpression':
+            return (0, exports.isStaticValue)(node.expression);
         case 'ArrayExpression':
             return node.elements.every((el) => el !== null && el.type !== 'SpreadElement' && (0, exports.isStaticValue)(el));
         case 'ObjectExpression':
@@ -78,6 +80,8 @@ const extractStaticValue = (node) => {
             }
             return undefined;
         }
+        case 'TSAsExpression':
+            return (0, exports.extractStaticValue)(node.expression);
         case 'ArrayExpression':
             return node.elements.map((el) => {
                 if (el === null || el.type === 'SpreadElement') {

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

@@ -1,3 +1,11 @@
+export declare const warnAboutPrettierOnce: (logLevel: "error" | "info" | "trace" | "verbose" | "warn") => void;
+export declare const normalizeQuotes: (str: string) => string;
+export declare const formatPropChange: ({ key, oldValueString, newValueString, defaultValueString, }: {
+    key: string;
+    oldValueString: string;
+    newValueString: string;
+    defaultValueString: string | null;
+}) => string;
 export declare const logUpdate: ({ absolutePath, fileRelativeToRoot, key, oldValueString, newValueString, defaultValueString, formatted, logLevel, }: {
     absolutePath: string;
     fileRelativeToRoot: string;

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

@@ -1,9 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.logUpdate = void 0;
+exports.logUpdate = exports.formatPropChange = exports.normalizeQuotes = exports.warnAboutPrettierOnce = void 0;
 const renderer_1 = require("@remotion/renderer");
 const make_link_1 = require("../../hyperlinks/make-link");
 let warnedAboutPrettier = false;
+const warnAboutPrettierOnce = (logLevel) => {
+    if (warnedAboutPrettier) {
+        return;
+    }
+    warnedAboutPrettier = true;
+    renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.yellow('Could not format with Prettier. File will need to be formatted manually.'));
+};
+exports.warnAboutPrettierOnce = warnAboutPrettierOnce;
 const normalizeQuotes = (str) => {
     if (str.length >= 2 &&
         ((str.startsWith("'") && str.endsWith("'")) ||
@@ -12,45 +20,71 @@ const normalizeQuotes = (str) => {
     }
     return str;
 };
-const formatValueChange = ({ oldValueString, newValueString, defaultValueString, }) => {
-    // Changed to default value (prop gets deleted) → show only old value in red
-    if (defaultValueString !== null && newValueString === defaultValueString) {
-        return renderer_1.RenderInternals.chalk.red(oldValueString);
+exports.normalizeQuotes = normalizeQuotes;
+// 24-bit ANSI helpers
+const fg = (r, g, b, str) => `\u001b[38;2;${r};${g};${b}m${str}\u001b[39m`;
+const bg = (r, g, b, str) => `\u001b[48;2;${r};${g};${b}m${str}\u001b[49m`;
+// Monokai-inspired syntax colors
+const attrName = (str) => fg(166, 226, 46, str);
+const equals = (str) => fg(249, 38, 114, str);
+const punctuation = (str) => fg(248, 248, 242, str);
+const stringValue = (str) => fg(230, 219, 116, str);
+const numberValue = (str) => fg(174, 129, 255, str);
+const colorValue = (str) => {
+    if ((str.startsWith("'") && str.endsWith("'")) ||
+        (str.startsWith('"') && str.endsWith('"'))) {
+        return stringValue(str);
     }
-    // Changed from default value (prop gets added) → show only new value in green
-    if (defaultValueString !== null && oldValueString === defaultValueString) {
-        return renderer_1.RenderInternals.chalk.green(newValueString);
+    if (/^-?\d+(\.\d+)?$/.test(str)) {
+        return numberValue(str);
     }
-    return `${renderer_1.RenderInternals.chalk.red(oldValueString)} \u2192 ${renderer_1.RenderInternals.chalk.green(newValueString)}`;
+    return punctuation(str);
+};
+// Subtle background tints
+const removedBg = (str) => bg(80, 20, 20, str);
+const addedBg = (str) => bg(30, 80, 30, str);
+const colorEnabled = () => renderer_1.RenderInternals.chalk.enabled();
+// Format key={value} with Monokai syntax highlighting
+const formatSimpleProp = (key, value) => {
+    return `${attrName(key)}${equals('=')}${punctuation('{')}${colorValue(value)}${punctuation('}')}`;
+};
+// Format parentKey={{childKey: value}} with Monokai syntax highlighting
+const formatNestedProp = (parentKey, childKey, value) => {
+    return `${attrName(parentKey)}${equals('=')}${punctuation('{{')}${punctuation(childKey)}${punctuation(':')} ${colorValue(value)}${punctuation('}}')}`;
 };
 const formatPropChange = ({ key, oldValueString, newValueString, defaultValueString, }) => {
+    if (!colorEnabled()) {
+        const dotIdx = key.indexOf('.');
+        if (dotIdx === -1) {
+            return `${key}={${oldValueString}} \u2192 ${key}={${newValueString}}`;
+        }
+        const parent = key.slice(0, dotIdx);
+        const child = key.slice(dotIdx + 1);
+        return `${parent}={{${child}: ${oldValueString}}} \u2192 ${parent}={{${child}: ${newValueString}}}`;
+    }
     const isResetToDefault = defaultValueString !== null && newValueString === defaultValueString;
     const isChangeFromDefault = defaultValueString !== null && oldValueString === defaultValueString;
-    const valueChange = formatValueChange({
-        oldValueString,
-        newValueString,
-        defaultValueString,
-    });
     const dotIndex = key.indexOf('.');
     if (dotIndex === -1) {
         if (isResetToDefault) {
-            return renderer_1.RenderInternals.chalk.red(`${key}={${oldValueString}}`);
+            return removedBg(formatSimpleProp(key, oldValueString));
         }
         if (isChangeFromDefault) {
-            return renderer_1.RenderInternals.chalk.green(`${key}={${newValueString}}`);
+            return addedBg(formatSimpleProp(key, newValueString));
         }
-        return `${key}={${valueChange}}`;
+        return `${removedBg(formatSimpleProp(key, oldValueString))} \u2192 ${addedBg(formatSimpleProp(key, newValueString))}`;
     }
     const parentKey = key.slice(0, dotIndex);
     const childKey = key.slice(dotIndex + 1);
     if (isResetToDefault) {
-        return `${parentKey}={{${renderer_1.RenderInternals.chalk.red(`${childKey}: ${oldValueString}`)}}}`;
+        return removedBg(formatNestedProp(parentKey, childKey, oldValueString));
     }
     if (isChangeFromDefault) {
-        return `${parentKey}={{${renderer_1.RenderInternals.chalk.green(`${childKey}: ${newValueString}`)}}}`;
+        return addedBg(formatNestedProp(parentKey, childKey, newValueString));
     }
-    return `${parentKey}={{${childKey}: ${valueChange}}}`;
+    return `${removedBg(formatNestedProp(parentKey, childKey, oldValueString))} \u2192 ${addedBg(formatNestedProp(parentKey, childKey, newValueString))}`;
 };
+exports.formatPropChange = formatPropChange;
 const logUpdate = ({ absolutePath, fileRelativeToRoot, key, oldValueString, newValueString, defaultValueString, formatted, logLevel, }) => {
     const locationLabel = `${fileRelativeToRoot}`;
     const fileLink = (0, make_link_1.makeHyperlink)({
@@ -58,16 +92,15 @@ const logUpdate = ({ absolutePath, fileRelativeToRoot, key, oldValueString, newV
         text: locationLabel,
         fallback: locationLabel,
     });
-    const propChange = formatPropChange({
+    const propChange = (0, exports.formatPropChange)({
         key,
-        oldValueString: normalizeQuotes(oldValueString),
-        newValueString: normalizeQuotes(newValueString),
-        defaultValueString: defaultValueString !== null ? normalizeQuotes(defaultValueString) : null,
+        oldValueString: (0, exports.normalizeQuotes)(oldValueString),
+        newValueString: (0, exports.normalizeQuotes)(newValueString),
+        defaultValueString: defaultValueString !== null ? (0, exports.normalizeQuotes)(defaultValueString) : null,
     });
     renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${renderer_1.RenderInternals.chalk.blueBright(`${fileLink}:`)} ${propChange}`);
-    if (!formatted && !warnedAboutPrettier) {
-        warnedAboutPrettier = true;
-        renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.yellow('Could not format with Prettier. File will need to be formatted manually.'));
+    if (!formatted) {
+        (0, exports.warnAboutPrettierOnce)(logLevel);
     }
 };
 exports.logUpdate = logUpdate;

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

@@ -6,11 +6,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 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 update_sequence_props_1 = require("../../codemods/update-sequence-props");
-const hmr_suppression_1 = require("../hmr-suppression");
+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_sequence_props_1 = require("./can-update-sequence-props");
 const log_update_1 = require("./log-update");
-const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, value, defaultValue }, remotionRoot, logLevel, }) => {
+const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, value, defaultValue, observedKeys }, remotionRoot, logLevel, }) => {
     try {
+        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);
         if (fileRelativeToRoot.startsWith('..')) {
@@ -24,28 +29,65 @@ const saveSequencePropsHandler = async ({ input: { fileName, nodePath, key, valu
             value: JSON.parse(value),
             defaultValue: defaultValue !== null ? JSON.parse(defaultValue) : null,
         });
-        (0, hmr_suppression_1.suppressHmrForFile)(absolutePath);
-        (0, node_fs_1.writeFileSync)(absolutePath, output);
         const newValueString = JSON.stringify(JSON.parse(value));
         const parsedDefault = defaultValue !== null ? JSON.parse(defaultValue) : null;
+        const defaultValueString = parsedDefault !== null ? JSON.stringify(parsedDefault) : null;
+        const normalizedOld = (0, log_update_1.normalizeQuotes)(oldValueString);
+        const normalizedNew = (0, log_update_1.normalizeQuotes)(newValueString);
+        const normalizedDefault = defaultValueString !== null ? (0, log_update_1.normalizeQuotes)(defaultValueString) : null;
+        const undoPropChange = (0, log_update_1.formatPropChange)({
+            key,
+            oldValueString: normalizedNew,
+            newValueString: normalizedOld,
+            defaultValueString: normalizedDefault,
+        });
+        const redoPropChange = (0, log_update_1.formatPropChange)({
+            key,
+            oldValueString: normalizedOld,
+            newValueString: normalizedNew,
+            defaultValueString: normalizedDefault,
+        });
+        (0, undo_stack_1.pushToUndoStack)({
+            filePath: absolutePath,
+            oldContents: fileContents,
+            logLevel,
+            remotionRoot,
+            description: {
+                undoMessage: `Undid ${undoPropChange}`,
+                redoMessage: `Redid ${redoPropChange}`,
+            },
+            entryType: 'sequence-props',
+        });
+        (0, undo_stack_1.suppressUndoStackInvalidation)(absolutePath);
+        (0, watch_ignore_next_change_1.suppressBundlerUpdateForFile)(absolutePath);
+        (0, file_watcher_1.writeFileAndNotifyFileWatchers)(absolutePath, output);
         (0, log_update_1.logUpdate)({
             absolutePath,
             fileRelativeToRoot,
             key,
             oldValueString,
             newValueString,
-            defaultValueString: parsedDefault !== null ? JSON.stringify(parsedDefault) : null,
+            defaultValueString,
             formatted,
             logLevel,
         });
+        (0, undo_stack_1.printUndoHint)(logLevel);
+        const newStatus = (0, can_update_sequence_props_1.computeSequencePropsStatus)({
+            fileName,
+            keys: observedKeys,
+            nodePath,
+            remotionRoot,
+        });
         return {
             success: true,
+            newStatus,
         };
     }
     catch (err) {
         return {
             success: false,
             reason: err.message,
+            stack: err.stack,
         };
     }
 };

package/dist/preview-server/routes/update-default-props.js

@@ -1,24 +1,61 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateDefaultPropsHandler = void 0;
 const node_fs_1 = require("node:fs");
+const node_path_1 = __importDefault(require("node:path"));
+const renderer_1 = require("@remotion/renderer");
 const update_default_props_1 = require("../../codemods/update-default-props");
+const file_watcher_1 = require("../../file-watcher");
+const make_link_1 = require("../../hyperlinks/make-link");
 const project_info_1 = require("../project-info");
+const undo_stack_1 = require("../undo-stack");
+const watch_ignore_next_change_1 = require("../watch-ignore-next-change");
 const can_update_default_props_1 = require("./can-update-default-props");
-const updateDefaultPropsHandler = async ({ input: { compositionId, defaultProps, enumPaths }, remotionRoot, entryPoint, }) => {
+const log_update_1 = require("./log-update");
+const updateDefaultPropsHandler = async ({ input: { compositionId, defaultProps, enumPaths }, remotionRoot, entryPoint, logLevel, }) => {
     try {
+        renderer_1.RenderInternals.Log.trace({ indent: false, logLevel }, `[update-default-props] Received request for compositionId="${compositionId}"`);
         const projectInfo = await (0, project_info_1.getProjectInfo)(remotionRoot, entryPoint);
         if (!projectInfo.rootFile) {
             throw new Error('Cannot find root file in project');
         }
         (0, can_update_default_props_1.checkIfTypeScriptFile)(projectInfo.rootFile);
-        const updated = await (0, update_default_props_1.updateDefaultProps)({
+        const fileContents = (0, node_fs_1.readFileSync)(projectInfo.rootFile, 'utf-8');
+        const { output, formatted } = await (0, update_default_props_1.updateDefaultProps)({
             compositionId,
-            input: (0, node_fs_1.readFileSync)(projectInfo.rootFile, 'utf-8'),
+            input: fileContents,
             newDefaultProps: JSON.parse(defaultProps),
             enumPaths,
         });
-        (0, node_fs_1.writeFileSync)(projectInfo.rootFile, updated);
+        (0, undo_stack_1.pushToUndoStack)({
+            filePath: projectInfo.rootFile,
+            oldContents: fileContents,
+            logLevel,
+            remotionRoot,
+            description: {
+                undoMessage: `Undid default props update for "${compositionId}"`,
+                redoMessage: `Redid default props update for "${compositionId}"`,
+            },
+            entryType: 'default-props',
+        });
+        (0, undo_stack_1.suppressUndoStackInvalidation)(projectInfo.rootFile);
+        (0, watch_ignore_next_change_1.suppressBundlerUpdateForFile)(projectInfo.rootFile);
+        (0, file_watcher_1.writeFileAndNotifyFileWatchers)(projectInfo.rootFile, output);
+        const fileRelativeToRoot = node_path_1.default.relative(remotionRoot, projectInfo.rootFile);
+        const locationLabel = `${fileRelativeToRoot}`;
+        const fileLink = (0, make_link_1.makeHyperlink)({
+            url: `file://${projectInfo.rootFile}`,
+            text: locationLabel,
+            fallback: locationLabel,
+        });
+        renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${renderer_1.RenderInternals.chalk.blueBright(`${fileLink}:`)} Updated default props for "${compositionId}"`);
+        if (!formatted) {
+            (0, log_update_1.warnAboutPrettierOnce)(logLevel);
+        }
+        (0, undo_stack_1.printUndoHint)(logLevel);
         return {
             success: true,
         };

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

@@ -33,18 +33,13 @@ const subscribeToSequencePropsWatchers = ({ fileName, line, keys, remotionRoot,
     }
     const { unwatch } = (0, file_watcher_1.installFileWatcher)({
         file: absolutePath,
-        onChange: (type) => {
-            if (type === 'deleted') {
+        onChange: (event) => {
+            if (event.type === 'deleted') {
                 return;
             }
-            const result = (0, can_update_sequence_props_1.computeSequencePropsStatus)({
-                fileName,
-                nodePath,
-                keys,
-                remotionRoot,
-            });
+            const result = (0, can_update_sequence_props_1.computeSequencePropsStatusFromContent)(event.content, nodePath, keys);
             (0, live_events_1.waitForLiveEventsListener)().then((listener) => {
-                listener.sendEventToClient({
+                listener.sendEventToClientId(clientId, {
                     type: 'sequence-props-updated',
                     fileName,
                     nodePath,

package/dist/preview-server/start-server.js

@@ -12,6 +12,8 @@ const routes_1 = require("../routes");
 const dev_middleware_1 = require("./dev-middleware");
 const hot_middleware_1 = require("./hot-middleware");
 const live_events_1 = require("./live-events");
+const undo_stack_1 = require("./undo-stack");
+const watch_ignore_next_change_1 = require("./watch-ignore-next-change");
 const startServer = async (options) => {
     var _a, _b, _c;
     const desiredPort = (_b = (_a = options === null || options === void 0 ? void 0 : options.port) !== null && _a !== void 0 ? _a : (process.env.PORT ? Number(process.env.PORT) : undefined)) !== null && _b !== void 0 ? _b : undefined;
@@ -26,6 +28,9 @@ const startServer = async (options) => {
             });
             return detection.type === 'match' ? 'stop' : 'continue';
         };
+    const watchIgnorePlugin = new bundler_1.WatchIgnoreNextChangePlugin((...args) => {
+        renderer_1.RenderInternals.Log.trace({ indent: false, logLevel: options.logLevel }, ...args);
+    });
     const configArgs = {
         entry: options.entry,
         userDefinedComponent: options.userDefinedComponent,
@@ -40,6 +45,7 @@ const startServer = async (options) => {
         poll: options.poll,
         bufferStateDelayInMilliseconds: options.bufferStateDelayInMilliseconds,
         askAIEnabled: options.askAIEnabled,
+        extraPlugins: [watchIgnorePlugin],
     };
     let compiler;
     if (options.rspack) {
@@ -50,9 +56,17 @@ const startServer = async (options) => {
         const [, webpackConf] = await bundler_1.BundlerInternals.webpackConfig(configArgs);
         compiler = (0, bundler_1.webpack)(webpackConf);
     }
+    (0, watch_ignore_next_change_1.setWatchIgnoreNextChangePlugin)(watchIgnorePlugin);
     const wdmMiddleware = (0, dev_middleware_1.wdm)(compiler, options.logLevel);
-    const whm = (0, hot_middleware_1.webpackHotMiddleware)(compiler, options.logLevel);
-    const liveEventsServer = (0, live_events_1.makeLiveEventsRouter)(options.logLevel);
+    const liveEventsServer = (0, live_events_1.makeLiveEventsRouter)(options.logLevel, () => {
+        const undoStack = (0, undo_stack_1.getUndoStack)();
+        const redoStack = (0, undo_stack_1.getRedoStack)();
+        return {
+            undoFile: undoStack.length > 0 ? undoStack[undoStack.length - 1].filePath : null,
+            redoFile: redoStack.length > 0 ? redoStack[redoStack.length - 1].filePath : null,
+        };
+    });
+    (0, hot_middleware_1.setupWebpackHmr)(compiler, options.logLevel, liveEventsServer);
     const server = node_http_1.default.createServer((request, response) => {
         if (options.enableCrossSiteIsolation) {
             response.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
@@ -62,13 +76,6 @@ const startServer = async (options) => {
             wdmMiddleware(request, response, () => {
                 resolve();
             });
-        })
-            .then(() => {
-            return new Promise((resolve) => {
-                whm(request, response, () => {
-                    resolve();
-                });
-            });
         })
             .then(() => {
             return (0, routes_1.handleRoutes)({

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

@@ -1,10 +1,30 @@
 import type { LogLevel } from '@remotion/renderer';
-interface UndoEntry {
+export interface UndoEntryDescription {
+    undoMessage: string;
+    redoMessage: string;
+}
+type UndoEntryType = 'visual-control' | 'default-props' | 'sequence-props';
+type UndoEntry = {
     filePath: string;
     oldContents: string;
-}
-export declare function pushToUndoStack(filePath: string, oldContents: string, logLevel: LogLevel): void;
-export declare function pushToRedoStack(filePath: string, oldContents: string): void;
+    description: UndoEntryDescription;
+} & ({
+    entryType: 'visual-control';
+} | {
+    entryType: 'default-props';
+} | {
+    entryType: 'sequence-props';
+});
+export declare function pushToUndoStack({ filePath, oldContents, logLevel, remotionRoot, description, entryType }: {
+    filePath: string;
+    oldContents: string;
+    logLevel: LogLevel;
+    remotionRoot: string;
+    description: UndoEntryDescription;
+    entryType: UndoEntryType;
+}): void;
+export declare function printUndoHint(logLevel: LogLevel): void;
+export declare function pushToRedoStack(filePath: string, oldContents: string, description: UndoEntryDescription, entryType: UndoEntryType): void;
 export declare function suppressUndoStackInvalidation(filePath: string): void;
 export declare function popUndo(): {
     success: true;