@remotion/studio-server 4.0.507 → 4.0.509

package/dist/canvas-capture/generate-canvas-capture-composition.d.ts

@@ -0,0 +1,14 @@
+import type { CanvasCaptureData } from '@remotion/studio-shared';
+export declare const generateCanvasCaptureComposition: ({ componentName, compositionId, data, durationInFrames, fps, height, keyframeFps, videoFileName, videoHeight, videoWidth, width, }: {
+    readonly componentName: string;
+    readonly compositionId: string;
+    readonly data: CanvasCaptureData;
+    readonly durationInFrames: number;
+    readonly fps: number;
+    readonly height: number;
+    readonly keyframeFps: number;
+    readonly videoFileName: string;
+    readonly videoHeight: number;
+    readonly videoWidth: number;
+    readonly width: number;
+}) => Promise<string>;

package/dist/canvas-capture/generate-canvas-capture-composition.js

@@ -0,0 +1,174 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateCanvasCaptureComposition = void 0;
+const duplicate_composition_1 = require("../codemods/duplicate-composition");
+const customCursorRegex = /^\s*url\(/;
+const collapseMouseMovementsByFrame = ({ data, keyframeFps, }) => {
+    const movements = [];
+    for (const movement of data.mouseMovements) {
+        if (movement.canvasX === null || movement.canvasY === null) {
+            continue;
+        }
+        const framedMovement = {
+            ...movement,
+            frame: Math.ceil(movement.timeInSeconds * keyframeFps),
+        };
+        const previous = movements.at(-1);
+        if ((previous === null || previous === void 0 ? void 0 : previous.frame) === framedMovement.frame) {
+            movements[movements.length - 1] = framedMovement;
+        }
+        else {
+            movements.push(framedMovement);
+        }
+    }
+    return movements;
+};
+const getCursorName = (cursor) => {
+    var _a;
+    if (customCursorRegex.test(cursor)) {
+        return 'custom';
+    }
+    return ((_a = cursor.split(',').at(-1)) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()) || 'default';
+};
+const serialize = (value) => JSON.stringify(value);
+const generateCanvasCaptureComposition = ({ componentName, compositionId, data, durationInFrames, fps, height, keyframeFps, videoFileName, videoHeight, videoWidth, width, }) => {
+    var _a;
+    const movements = collapseMouseMovementsByFrame({ data, keyframeFps });
+    if (movements.length === 0) {
+        throw new Error('The Canvas Capture does not contain cursor movements');
+    }
+    const cursorKeyframes = movements.reduce((keyframes, movement) => {
+        var _a;
+        const value = getCursorName(movement.cursor);
+        if (((_a = keyframes.at(-1)) === null || _a === void 0 ? void 0 : _a.value) !== value) {
+            keyframes.push({ frame: movement.frame, value });
+        }
+        return keyframes;
+    }, []);
+    const positionKeyframes = [];
+    for (const movement of movements) {
+        const previous = positionKeyframes.at(-1);
+        if (previous !== undefined && movement.frame - previous.frame > 1) {
+            positionKeyframes.push({
+                frame: movement.frame - 1,
+                value: previous.value,
+            });
+        }
+        positionKeyframes.push({
+            frame: movement.frame,
+            value: `${movement.canvasX}px ${movement.canvasY}px`,
+        });
+    }
+    const scaleKeyframes = [
+        { frame: 0, value: data.captureMetadata.density },
+        ...data.pointerClicks.map((click) => ({
+            frame: Math.ceil(click.timeInSeconds * keyframeFps),
+            value: click.type === 'pointer-down'
+                ? data.captureMetadata.density * 0.9
+                : data.captureMetadata.density,
+        })),
+    ].reduce((keyframes, keyframe) => {
+        var _a, _b;
+        if (((_a = keyframes.at(-1)) === null || _a === void 0 ? void 0 : _a.frame) === keyframe.frame) {
+            keyframes[keyframes.length - 1] = keyframe;
+        }
+        else if (((_b = keyframes.at(-1)) === null || _b === void 0 ? void 0 : _b.value) !== keyframe.value) {
+            keyframes.push(keyframe);
+        }
+        return keyframes;
+    }, []);
+    const customCursor = (_a = movements.find((movement) => customCursorRegex.test(movement.cursor))) === null || _a === void 0 ? void 0 : _a.cursor;
+    const cursorProp = cursorKeyframes.length === 1
+        ? `cursor=${serialize(cursorKeyframes[0].value)}`
+        : `cursor={interpolate(
+					frame,
+					${serialize(cursorKeyframes.map((keyframe) => keyframe.frame))},
+					${serialize(cursorKeyframes.map((keyframe) => keyframe.value))},
+					{
+						easing: Easing.step1,
+						extrapolateLeft: 'clamp',
+						extrapolateRight: 'clamp',
+					},
+				)}`;
+    const scale = scaleKeyframes.length === 1
+        ? serialize(scaleKeyframes[0].value)
+        : `interpolate(
+						frame,
+						${serialize(scaleKeyframes.map((keyframe) => keyframe.frame))},
+						${serialize(scaleKeyframes.map((keyframe) => keyframe.value))},
+						{
+							easing: Easing.step1,
+							extrapolateLeft: 'clamp',
+							extrapolateRight: 'clamp',
+						},
+					)`;
+    const translate = positionKeyframes.length === 1
+        ? serialize(positionKeyframes[0].value)
+        : `interpolate(
+						frame,
+						${serialize(positionKeyframes.map((keyframe) => keyframe.frame))},
+						${serialize(positionKeyframes.map((keyframe) => keyframe.value))},
+						{
+							extrapolateLeft: 'clamp',
+							extrapolateRight: 'clamp',
+						},
+					)`;
+    const previewComponentName = componentName.endsWith('Composition')
+        ? `${componentName.slice(0, -'Composition'.length)}Preview`
+        : `${componentName}Preview`;
+    return (0, duplicate_composition_1.formatOutput)(`import {MacOSCursor} from '@remotion/mac-cursors';
+import {Video} from '@remotion/media';
+import {
+	AbsoluteFill,
+	Composition,
+	Easing,
+	interpolate,
+	staticFile,
+	useCurrentFrame,
+} from 'remotion';
+
+export const ${previewComponentName} = () => {
+	const frame = useCurrentFrame();
+
+	return (
+		<AbsoluteFill
+			style={{
+				width: ${videoWidth},
+				height: ${videoHeight},
+			}}
+		>
+			<Video
+				src={staticFile(${serialize(videoFileName)})}
+				style={{
+					position: 'absolute',
+				}}
+			/>
+			<MacOSCursor
+				${cursorProp}
+${customCursor === undefined ? '' : `\t\t\t\tcustomCursor=${serialize(customCursor)}\n`}				style={{
+					position: 'absolute',
+					left: 0,
+					top: 0,
+					scale: ${scale},
+					translate: ${translate},
+				}}
+			/>
+		</AbsoluteFill>
+	);
+};
+
+export const ${componentName} = () => {
+	return (
+		<Composition
+			id=${serialize(compositionId)}
+			component={${previewComponentName}}
+			width={${width}}
+			height={${height}}
+			fps={${fps}}
+			durationInFrames={${durationInFrames}}
+		/>
+	);
+};
+`);
+};
+exports.generateCanvasCaptureComposition = generateCanvasCaptureComposition;

package/dist/codemods/delete-jsx-node.d.ts

@@ -13,6 +13,10 @@ export declare const deleteJsxNodes: ({ input, nodePaths, prettierConfigOverride
     formatted: boolean;
     nodeLabels: string[];
     logLines: number[];
+    nodePathRemappings: {
+        oldNodePath: SequenceNodePath;
+        newNodePath: SequenceNodePath | null;
+    }[];
 }>;
 export declare const deleteJsxNode: ({ input, nodePath, prettierConfigOverride, }: {
     input: string;

package/dist/codemods/delete-jsx-node.js

@@ -37,6 +37,7 @@ exports.deleteJsxNode = exports.deleteJsxNodes = exports.deleteJsxElementAtPath
 const recast = __importStar(require("recast"));
 const get_ast_node_path_1 = require("../helpers/get-ast-node-path");
 const format_file_content_1 = require("./format-file-content");
+const get_node_path_remappings_1 = require("./get-node-path-remappings");
 const parse_ast_1 = require("./parse-ast");
 const { builders: b, namedTypes } = recast.types;
 /** Recast `builders.nullLiteral()` is typed against ast-types; normalize to Babel `Expression`. */
@@ -292,6 +293,7 @@ const deleteJsxNodes = async ({ input, nodePaths, prettierConfigOverride, }) =>
         throw new Error('No JSX nodes were specified for deletion');
     }
     const ast = (0, parse_ast_1.parseAst)(input);
+    const capturedNodePaths = (0, get_node_path_remappings_1.captureJsxNodePaths)(ast);
     const pathsToDelete = nodePaths.map((nodePath) => {
         var _a, _b;
         var _c, _d;
@@ -314,11 +316,17 @@ const deleteJsxNodes = async ({ input, nodePaths, prettierConfigOverride, }) =>
         input: finalFile,
         prettierConfigOverride,
     });
+    const { nodePathRemappings } = (0, get_node_path_remappings_1.getNodePathRemappings)({
+        ast,
+        captured: capturedNodePaths,
+        output,
+    });
     return {
         output,
         formatted,
         nodeLabels: pathsToDelete.map(({ nodeLabel }) => nodeLabel),
         logLines: pathsToDelete.map(({ logLine }) => logLine),
+        nodePathRemappings,
     };
 };
 exports.deleteJsxNodes = deleteJsxNodes;

package/dist/codemods/duplicate-composition.js

@@ -81,12 +81,14 @@ const parseAndApplyCodemod = ({ input, codeMod, }) => {
         });
     }
     if (codeMod.type === 'new-composition') {
-        (0, imports_1.ensureNamedImport)({
-            ast: newAst,
-            importedName: 'Composition',
-            sourcePath: 'remotion',
-            localName: 'Composition',
-        });
+        if (codeMod.canvasCapture === null) {
+            (0, imports_1.ensureNamedImport)({
+                ast: newAst,
+                importedName: 'Composition',
+                sourcePath: 'remotion',
+                localName: 'Composition',
+            });
+        }
         (0, imports_1.ensureNamedImport)({
             ast: newAst,
             importedName: codeMod.componentName,

package/dist/codemods/duplicate-jsx-node.d.ts

@@ -1,3 +1,4 @@
+import type { SequenceNodePathRemapping } from '@remotion/studio-shared';
 import type { SequenceNodePath } from 'remotion';
 export declare const duplicateJsxElementAtPath: (jsxPath: import("ast-types/lib/node-path").NodePath<N, V>) => void;
 export declare const duplicateJsxNode: ({ input, nodePath, prettierConfigOverride, }: {
@@ -9,4 +10,5 @@ export declare const duplicateJsxNode: ({ input, nodePath, prettierConfigOverrid
     formatted: boolean;
     nodeLabel: string;
     logLine: number;
+    nodePathRemappings: SequenceNodePathRemapping[];
 }>;

package/dist/codemods/duplicate-jsx-node.js

@@ -38,6 +38,7 @@ const types_1 = require("@babel/types");
 const recast = __importStar(require("recast"));
 const delete_jsx_node_1 = require("./delete-jsx-node");
 const format_file_content_1 = require("./format-file-content");
+const get_node_path_remappings_1 = require("./get-node-path-remappings");
 const parse_ast_1 = require("./parse-ast");
 const { namedTypes } = recast.types;
 const makeFragment = (first, second) => ({
@@ -288,6 +289,7 @@ const duplicateJsxNode = async ({ input, nodePath, prettierConfigOverride, }) =>
     var _a, _b;
     var _c, _d;
     const ast = (0, parse_ast_1.parseAst)(input);
+    const capturedNodePaths = (0, get_node_path_remappings_1.captureJsxNodePaths)(ast);
     const jsxPath = (0, delete_jsx_node_1.findJsxElementPathForDeletion)(ast, nodePath);
     if (!jsxPath) {
         throw new Error('Could not find a JSX element at the specified location to duplicate');
@@ -301,11 +303,17 @@ const duplicateJsxNode = async ({ input, nodePath, prettierConfigOverride, }) =>
         input: finalFile,
         prettierConfigOverride,
     });
+    const { nodePathRemappings } = (0, get_node_path_remappings_1.getNodePathRemappings)({
+        ast,
+        captured: capturedNodePaths,
+        output,
+    });
     return {
         output,
         formatted,
         nodeLabel,
         logLine,
+        nodePathRemappings,
     };
 };
 exports.duplicateJsxNode = duplicateJsxNode;

package/dist/codemods/get-node-path-remappings.d.ts

@@ -0,0 +1,16 @@
+import type { File, JSXOpeningElement } from '@babel/types';
+import type { SequenceNodePathRemapping } from '@remotion/studio-shared';
+import type { SequenceNodePath } from 'remotion';
+export type CapturedJsxNodePath = {
+    node: JSXOpeningElement;
+    nodePath: SequenceNodePath;
+};
+export declare const captureJsxNodePaths: (ast: File) => CapturedJsxNodePath[];
+export declare const getNodePathRemappings: ({ ast, captured, output, }: {
+    ast: File;
+    captured: CapturedJsxNodePath[];
+    output: string;
+}) => {
+    nodePathRemappings: SequenceNodePathRemapping[];
+    finalNodePathByNode: Map<JSXOpeningElement, SequenceNodePath>;
+};

package/dist/codemods/get-node-path-remappings.js

@@ -0,0 +1,88 @@
+"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.getNodePathRemappings = exports.captureJsxNodePaths = void 0;
+const recast = __importStar(require("recast"));
+const can_update_sequence_props_1 = require("../preview-server/routes/can-update-sequence-props");
+const parse_ast_1 = require("./parse-ast");
+const captureJsxNodePaths = (ast) => {
+    const captured = [];
+    recast.visit(ast, {
+        visitJSXOpeningElement(path) {
+            captured.push({
+                node: path.node,
+                nodePath: (0, can_update_sequence_props_1.getNodePathForRecastPath)(path, ast),
+            });
+            return this.traverse(path);
+        },
+    });
+    return captured;
+};
+exports.captureJsxNodePaths = captureJsxNodePaths;
+const getNodePathRemappings = ({ ast, captured, output, }) => {
+    const nodesAfterMutation = [];
+    recast.visit(ast, {
+        visitJSXOpeningElement(path) {
+            nodesAfterMutation.push(path.node);
+            return this.traverse(path);
+        },
+    });
+    const finalAst = (0, parse_ast_1.parseAst)(output);
+    const finalNodePaths = [];
+    recast.visit(finalAst, {
+        visitJSXOpeningElement(path) {
+            finalNodePaths.push((0, can_update_sequence_props_1.getNodePathForRecastPath)(path, finalAst));
+            return this.traverse(path);
+        },
+    });
+    if (nodesAfterMutation.length !== finalNodePaths.length) {
+        throw new Error('Could not map JSX node paths after modifying JSX nodes');
+    }
+    const finalNodePathByNode = new Map();
+    for (let i = 0; i < nodesAfterMutation.length; i++) {
+        finalNodePathByNode.set(nodesAfterMutation[i], finalNodePaths[i]);
+    }
+    const nodePathRemappings = captured.flatMap(({ node, nodePath }) => {
+        var _a;
+        const newNodePath = (_a = finalNodePathByNode.get(node)) !== null && _a !== void 0 ? _a : null;
+        if (newNodePath !== null &&
+            JSON.stringify(nodePath) === JSON.stringify(newNodePath)) {
+            return [];
+        }
+        return [{ oldNodePath: nodePath, newNodePath }];
+    });
+    return { finalNodePathByNode, nodePathRemappings };
+};
+exports.getNodePathRemappings = getNodePathRemappings;

package/dist/codemods/recast-mods.js

@@ -164,6 +164,19 @@ const jsxAttributeWithExpression = (name, expression) => ({
     },
 });
 const newCompositionElement = (transformation) => {
+    if (transformation.canvasCapture !== null) {
+        return {
+            type: 'JSXElement',
+            openingElement: {
+                type: 'JSXOpeningElement',
+                name: jsxId(transformation.componentName),
+                attributes: [],
+                selfClosing: true,
+            },
+            closingElement: null,
+            children: [],
+        };
+    }
     return {
         type: 'JSXElement',
         openingElement: {

package/dist/codemods/reorder-sequence.d.ts

@@ -1,4 +1,4 @@
-import type { ReorderSequencePosition } from '@remotion/studio-shared';
+import type { ReorderSequencePosition, SequenceNodePathRemapping } from '@remotion/studio-shared';
 import type { SequenceNodePath } from 'remotion';
 export declare const reorderSequence: ({ input, sourceNodePath, targetNodePath, position, prettierConfigOverride, }: {
     input: string;
@@ -11,4 +11,5 @@ export declare const reorderSequence: ({ input, sourceNodePath, targetNodePath,
     formatted: boolean;
     sequenceLabel: string;
     logLine: number;
+    nodePathRemappings: SequenceNodePathRemapping[];
 }>;

package/dist/codemods/reorder-sequence.js

@@ -37,6 +37,7 @@ exports.reorderSequence = void 0;
 const recast = __importStar(require("recast"));
 const delete_jsx_node_1 = require("./delete-jsx-node");
 const format_file_content_1 = require("./format-file-content");
+const get_node_path_remappings_1 = require("./get-node-path-remappings");
 const parse_ast_1 = require("./parse-ast");
 const { namedTypes } = recast.types;
 const getJsxChildrenParent = (path) => {
@@ -57,6 +58,7 @@ const reorderSequence = async ({ input, sourceNodePath, targetNodePath, position
     var _a, _b;
     var _c, _d;
     const ast = (0, parse_ast_1.parseAst)(input);
+    const capturedNodePaths = (0, get_node_path_remappings_1.captureJsxNodePaths)(ast);
     const sourcePath = (0, delete_jsx_node_1.findJsxElementPathForDeletion)(ast, sourceNodePath);
     if (!sourcePath) {
         throw new Error('Could not find a JSX element at the source location to reorder sequence');
@@ -99,11 +101,17 @@ const reorderSequence = async ({ input, sourceNodePath, targetNodePath, position
         input: finalFile,
         prettierConfigOverride,
     });
+    const { nodePathRemappings } = (0, get_node_path_remappings_1.getNodePathRemappings)({
+        ast,
+        captured: capturedNodePaths,
+        output,
+    });
     return {
         output,
         formatted,
         sequenceLabel,
         logLine,
+        nodePathRemappings,
     };
 };
 exports.reorderSequence = reorderSequence;

package/dist/codemods/split-jsx-sequence.d.ts

@@ -1,3 +1,4 @@
+import type { SequenceNodePathRemapping } from '@remotion/studio-shared';
 import type { SequenceNodePath } from 'remotion';
 export declare const getSplitUnsupportedSequenceTagReason: (tagName: string) => string | null;
 export declare const getIsSplittableSequenceTag: (tagName: string) => boolean;
@@ -11,4 +12,5 @@ export declare const splitJsxSequence: ({ input, nodePath, splitFrame, prettierC
     formatted: boolean;
     nodeLabel: string;
     logLine: number;
+    nodePathRemappings: SequenceNodePathRemapping[];
 }>;

package/dist/codemods/split-jsx-sequence.js

@@ -38,6 +38,7 @@ const types_1 = require("@babel/types");
 const recast = __importStar(require("recast"));
 const delete_jsx_node_1 = require("./delete-jsx-node");
 const format_file_content_1 = require("./format-file-content");
+const get_node_path_remappings_1 = require("./get-node-path-remappings");
 const parse_ast_1 = require("./parse-ast");
 const { builders: b, namedTypes } = recast.types;
 const jsxId = (name) => ({ type: 'JSXIdentifier', name });
@@ -275,6 +276,7 @@ const splitJsxSequence = async ({ input, nodePath, splitFrame, prettierConfigOve
         throw new Error('Split frame must be an integer');
     }
     const ast = (0, parse_ast_1.parseAst)(input);
+    const capturedNodePaths = (0, get_node_path_remappings_1.captureJsxNodePaths)(ast);
     const jsxPath = (0, delete_jsx_node_1.findJsxElementPathForDeletion)(ast, nodePath);
     if (!jsxPath) {
         throw new Error('Could not find a JSX sequence at the specified location to split');
@@ -340,11 +342,17 @@ const splitJsxSequence = async ({ input, nodePath, splitFrame, prettierConfigOve
         input: finalFile,
         prettierConfigOverride,
     });
+    const { nodePathRemappings } = (0, get_node_path_remappings_1.getNodePathRemappings)({
+        ast,
+        captured: capturedNodePaths,
+        output,
+    });
     return {
         output,
         formatted,
         nodeLabel: (0, delete_jsx_node_1.getJsxElementTagLabel)(jsxElement),
         logLine: (_d = (_c = (_a = jsxElement.openingElement.loc) === null || _a === void 0 ? void 0 : _a.start.line) !== null && _c !== void 0 ? _c : (_b = jsxElement.loc) === null || _b === void 0 ? void 0 : _b.start.line) !== null && _d !== void 0 ? _d : 1,
+        nodePathRemappings,
     };
 };
 exports.splitJsxSequence = splitJsxSequence;

package/dist/codemods/update-keyframes/update-keyframes.js

@@ -334,18 +334,16 @@ const getInlineOptionsFromExtraArgs = (extraArgs) => {
     }
     return existingOptions;
 };
-const normalizeEasingAfterAddingKeyframe = ({ extraArgs, previousSegmentCount, nextSegmentCount, insertedKeyframeIndex, nextKeyframeCount, }) => {
-    const options = getInlineOptionsFromExtraArgs(extraArgs);
+const normalizeEasingAfterAddingKeyframe = ({ extraArgs, previousSegmentCount, nextSegmentCount, insertedKeyframeIndex, nextKeyframeCount, defaultEasing, }) => {
+    var _a, _b;
+    const options = (_a = getInlineOptionsFromExtraArgs(extraArgs)) !== null && _a !== void 0 ? _a : (extraArgs.length === 0 ? createEmptyOptionsExpression() : null);
     if (!options) {
         return { extraArgs, needsEasingImport: false };
     }
-    const easing = getExistingEasingArrayOrNull({
+    const easing = (_b = getExistingEasingArrayOrNull({
         options,
         segmentCount: previousSegmentCount,
-    });
-    if (easing === null) {
-        return { extraArgs, needsEasingImport: false };
-    }
+    })) !== null && _b !== void 0 ? _b : Array.from({ length: previousSegmentCount }, () => defaultEasing);
     if (easing.length < nextSegmentCount) {
         const isSplittingExistingSegment = insertedKeyframeIndex > 0 &&
             insertedKeyframeIndex < nextKeyframeCount - 1;
@@ -353,15 +351,16 @@ const normalizeEasingAfterAddingKeyframe = ({ extraArgs, previousSegmentCount, n
             ? Math.min(insertedKeyframeIndex - 1, easing.length - 1)
             : null;
         easing.splice(insertedKeyframeIndex, 0, easingIndexToDuplicate === null
-            ? studio_shared_1.LINEAR_KEYFRAME_EASING
+            ? defaultEasing
             : easing[easingIndexToDuplicate]);
     }
     while (easing.length < nextSegmentCount) {
-        easing.push(studio_shared_1.LINEAR_KEYFRAME_EASING);
+        easing.push(defaultEasing);
     }
+    const needsEasingImport = setEasingOption({ options, easing });
     return {
         extraArgs: getExtraArgsWithOptions({ extraArgs, options }),
-        needsEasingImport: setEasingOption({ options, easing }),
+        needsEasingImport,
     };
 };
 const getEasingIndexToRemove = ({ removedKeyframeIndex, keyframeCountBeforeRemoval, }) => {
@@ -586,6 +585,9 @@ const addKeyframe = ({ expression, key, frame, value, schema, videoConfigValues,
     const existing = getInterpolationExpression(expression, videoConfigValues);
     const newOutput = (0, update_nested_prop_1.parseValueExpression)(value);
     if (existing) {
+        const defaultEasing = (0, studio_shared_1.isSchemaFieldHoldOnly)({ schema, key })
+            ? studio_shared_1.HOLD_KEYFRAME_EASING
+            : studio_shared_1.LINEAR_KEYFRAME_EASING;
         const existingCalleeName = existing.callee.type === 'Identifier'
             ? existing.callee.name
             : 'interpolate';
@@ -619,6 +621,7 @@ const addKeyframe = ({ expression, key, frame, value, schema, videoConfigValues,
                     .sort((first, second) => first.frame - second.frame)
                     .findIndex((keyframe) => keyframe.frame === frame),
                 nextKeyframeCount: nextKeyframes.length,
+                defaultEasing,
             })
             : { extraArgs: existing.extraArgs, needsEasingImport: false };
         return {
@@ -804,6 +807,10 @@ const applyKeyframeOperation = ({ expression, key, operation, schema, videoConfi
         };
     }
     if (operation.type === 'easing') {
+        if ((0, studio_shared_1.isSchemaFieldHoldOnly)({ schema, key }) &&
+            operation.easing.type !== 'step1') {
+            throw new Error(`Cannot update easing: "${key}" only supports Easing.step1`);
+        }
         const updated = updateKeyframeEasing({
             expression,
             segmentIndex: operation.segmentIndex,

package/dist/file-watcher.d.ts

@@ -1,3 +1,12 @@
+export type FileChangeMetadata = {
+    skipSequencePropsUpdate: boolean;
+};
+type WriteFileAndNotifyFileWatchersOptions = {
+    file: string;
+    content: string;
+    originatorClientId: string | undefined;
+    metadata: FileChangeMetadata | null;
+};
 export type FileChangeEvent = {
     type: 'created';
     content: string;
@@ -8,6 +17,7 @@ export type FileChangeEvent = {
     type: 'changed';
     content: string;
     originatorClientId: string | undefined;
+    skipSequencePropsUpdate: boolean;
 };
 type OnChange = (event: FileChangeEvent) => void;
 export type FileWatcherRegistry = {
@@ -25,7 +35,7 @@ export type FileWatcherRegistry = {
         exists: boolean;
         unwatch: () => void;
     };
-    writeFileAndNotifyFileWatchers: (file: string, content: string, originatorClientId: string | undefined) => void;
+    writeFileAndNotifyFileWatchers: (options: WriteFileAndNotifyFileWatchersOptions) => void;
 };
 export declare const createFileWatcherRegistry: () => FileWatcherRegistry;
 export declare const setFileWatcherRegistry: (registry: FileWatcherRegistry) => () => void;