@remotion/studio-server 4.0.471 → 4.0.473

package/dist/codemods/recast-mods.js

@@ -8,7 +8,7 @@ const applyCodemod = ({ file, codeMod, }) => {
         return (0, apply_visual_control_1.applyVisualControl)({ file, transformation: codeMod, changesMade });
     }
     const body = file.program.body.map((node) => {
-        return mapAll(node, codeMod, changesMade);
+        return mapAll(node, codeMod, changesMade, null);
     });
     return {
         newAst: {
@@ -22,9 +22,9 @@ const applyCodemod = ({ file, codeMod, }) => {
     };
 };
 exports.applyCodemod = applyCodemod;
-const mapAll = (node, transformation, changesMade) => {
+const mapAll = (node, transformation, changesMade, parentFolderName) => {
     if (isRecognizedType(node)) {
-        return mapRecognizedType(node, transformation, changesMade);
+        return mapRecognizedType(node, transformation, changesMade, parentFolderName);
     }
     return node;
 };
@@ -40,33 +40,33 @@ const isRecognizedType = (t) => {
         t.type === 'ExportNamedDeclaration' ||
         t.type === 'ExportDefaultDeclaration');
 };
-const mapVariableDeclarator = (variableDeclarator, transformation, changesMade) => {
+const mapVariableDeclarator = (variableDeclarator, transformation, changesMade, parentFolderName) => {
     return {
         ...variableDeclarator,
         init: variableDeclarator.init
-            ? mapAll(variableDeclarator.init, transformation, changesMade)
+            ? mapAll(variableDeclarator.init, transformation, changesMade, parentFolderName)
             : variableDeclarator.init,
     };
 };
-const mapBlockStatement = (blockStatement, transformation, changesMade) => {
+const mapBlockStatement = (blockStatement, transformation, changesMade, parentFolderName) => {
     return {
         ...blockStatement,
         body: blockStatement.body.map((a) => {
-            return mapAll(a, transformation, changesMade);
+            return mapAll(a, transformation, changesMade, parentFolderName);
         }),
     };
 };
-const mapReturnStatement = (statement, transformation, changesMade) => {
+const mapReturnStatement = (statement, transformation, changesMade, parentFolderName) => {
     if (!statement.argument) {
         return statement;
     }
-    const replacement = transformLoneJsxElement(statement.argument, transformation, changesMade);
+    const replacement = transformLoneJsxElement(statement.argument, transformation, changesMade, parentFolderName);
     if (replacement !== null) {
         return { ...statement, argument: replacement };
     }
     return {
         ...statement,
-        argument: mapAll(statement.argument, transformation, changesMade),
+        argument: mapAll(statement.argument, transformation, changesMade, parentFolderName),
     };
 };
 const nullLiteral = () => ({ type: 'NullLiteral' });
@@ -86,40 +86,68 @@ const wrapInJsxFragment = (children) => ({
     type: 'JSXFragment',
     openingFragment: { type: 'JSXOpeningFragment' },
     closingFragment: { type: 'JSXClosingFragment' },
-    children: children.map(stripParenthesizedExtra),
+    children: children.map((child) => {
+        if (child.type === 'JSXElement' || child.type === 'JSXFragment') {
+            return stripParenthesizedExtra(child);
+        }
+        return child;
+    }),
 });
+const isJsxExpression = (child) => {
+    return child.type === 'JSXElement' || child.type === 'JSXFragment';
+};
+const isMeaningfulJsxChild = (child) => {
+    return child.type !== 'JSXText' || child.value.trim() !== '';
+};
 // When a <Composition> JSX element appears in a position where it cannot
 // simply be removed from a parent's children list (e.g. as the sole return
 // value of a wrapper component or as the concise body of an arrow function),
 // we still want delete/rename/duplicate codemods to work. This helper detects
 // that case and produces a structurally-valid replacement expression.
-const transformLoneJsxElement = (expression, transformation, changesMade) => {
+const transformLoneJsxElement = (expression, transformation, changesMade, parentFolderName) => {
     if (expression.type !== 'JSXElement') {
         return null;
     }
     const compId = getCompositionIdFromJSXElement(expression);
+    const folderName = getFolderNameFromJSXElement(expression);
     if (compId === null) {
-        return null;
+        const isFolderMatch = folderName !== null &&
+            ((transformation.type === 'delete-folder' &&
+                folderName === transformation.folderName &&
+                parentFolderName === transformation.parentName) ||
+                (transformation.type === 'rename-folder' &&
+                    folderName === transformation.folderName &&
+                    parentFolderName === transformation.parentName));
+        if (!isFolderMatch) {
+            return null;
+        }
     }
     const isMatch = (transformation.type === 'delete-composition' &&
         compId === transformation.idToDelete) ||
         (transformation.type === 'rename-composition' &&
             compId === transformation.idToRename) ||
         (transformation.type === 'duplicate-composition' &&
-            compId === transformation.idToDuplicate);
+            compId === transformation.idToDuplicate) ||
+        (transformation.type === 'delete-folder' &&
+            folderName === transformation.folderName &&
+            parentFolderName === transformation.parentName) ||
+        (transformation.type === 'rename-folder' &&
+            folderName === transformation.folderName &&
+            parentFolderName === transformation.parentName);
     if (!isMatch) {
         return null;
     }
-    const transformed = mapJsxChild(expression, transformation, changesMade);
-    if (transformed.length === 0) {
+    const transformed = mapJsxChild(expression, transformation, changesMade, parentFolderName);
+    const meaningful = transformed.filter(isMeaningfulJsxChild);
+    if (meaningful.length === 0) {
         return nullLiteral();
     }
-    if (transformed.length === 1) {
-        return transformed[0];
+    if (meaningful.length === 1 && isJsxExpression(meaningful[0])) {
+        return meaningful[0];
     }
     return wrapInJsxFragment(transformed);
 };
-const mapJsxElementOrFragment = (jsxFragment, transformation, changesMade) => {
+const mapJsxElementOrFragment = (jsxFragment, transformation, changesMade, parentFolderName) => {
     return {
         ...jsxFragment,
         children: jsxFragment.children
@@ -127,13 +155,17 @@ const mapJsxElementOrFragment = (jsxFragment, transformation, changesMade) => {
             if (c.type !== 'JSXElement') {
                 return c;
             }
-            return mapJsxChild(c, transformation, changesMade);
+            return mapJsxChild(c, transformation, changesMade, parentFolderName);
         })
             .flat(1),
     };
 };
-const mapJsxChild = (c, transformation, changesMade) => {
+const getChildFolderParentName = ({ folderName, parentFolderName, }) => {
+    return [parentFolderName, folderName].filter(Boolean).join('/');
+};
+const mapJsxChild = (c, transformation, changesMade, parentFolderName) => {
     const compId = getCompositionIdFromJSXElement(c);
+    const folderName = getFolderNameFromJSXElement(c);
     if (transformation === null) {
         return [c];
     }
@@ -175,17 +207,39 @@ const mapJsxChild = (c, transformation, changesMade) => {
         });
         return [];
     }
-    return [mapAll(c, transformation, changesMade)];
+    if (transformation.type === 'rename-folder' &&
+        folderName === transformation.folderName &&
+        parentFolderName === transformation.parentName) {
+        return [
+            changeFolderName({
+                jsxElement: c,
+                newFolderName: transformation.newName,
+                changesMade,
+            }),
+        ];
+    }
+    if (transformation.type === 'delete-folder' &&
+        folderName === transformation.folderName &&
+        parentFolderName === transformation.parentName) {
+        changesMade.push({
+            description: 'Deleted folder',
+        });
+        return c.children;
+    }
+    const childParentFolderName = folderName
+        ? getChildFolderParentName({ folderName, parentFolderName })
+        : parentFolderName;
+    return [mapAll(c, transformation, changesMade, childParentFolderName)];
 };
-const mapRecognizedType = (expression, transformation, changesMade) => {
+const mapRecognizedType = (expression, transformation, changesMade, parentFolderName) => {
     if (expression.type === 'JSXFragment' || expression.type === 'JSXElement') {
-        return mapJsxElementOrFragment(expression, transformation, changesMade);
+        return mapJsxElementOrFragment(expression, transformation, changesMade, parentFolderName);
     }
     if (expression.type === 'ArrowFunctionExpression' ||
         expression.type === 'FunctionExpression') {
         if (expression.type === 'ArrowFunctionExpression' &&
             expression.body.type === 'JSXElement') {
-            const replacement = transformLoneJsxElement(expression.body, transformation, changesMade);
+            const replacement = transformLoneJsxElement(expression.body, transformation, changesMade, parentFolderName);
             if (replacement !== null) {
                 return {
                     ...expression,
@@ -195,19 +249,19 @@ const mapRecognizedType = (expression, transformation, changesMade) => {
         }
         return {
             ...expression,
-            body: mapAll(expression.body, transformation, changesMade),
+            body: mapAll(expression.body, transformation, changesMade, parentFolderName),
         };
     }
     if (expression.type === 'VariableDeclaration') {
         const declarations = expression.declarations.map((d) => {
-            return mapVariableDeclarator(d, transformation, changesMade);
+            return mapVariableDeclarator(d, transformation, changesMade, parentFolderName);
         });
         return { ...expression, declarations };
     }
     if (expression.type === 'FunctionDeclaration') {
         return {
             ...expression,
-            body: mapBlockStatement(expression.body, transformation, changesMade),
+            body: mapBlockStatement(expression.body, transformation, changesMade, parentFolderName),
         };
     }
     if (expression.type === 'ExportNamedDeclaration' ||
@@ -217,14 +271,14 @@ const mapRecognizedType = (expression, transformation, changesMade) => {
         }
         return {
             ...expression,
-            declaration: mapAll(expression.declaration, transformation, changesMade),
+            declaration: mapAll(expression.declaration, transformation, changesMade, parentFolderName),
         };
     }
     if (expression.type === 'ReturnStatement') {
-        return mapReturnStatement(expression, transformation, changesMade);
+        return mapReturnStatement(expression, transformation, changesMade, parentFolderName);
     }
     if (expression.type === 'BlockStatement') {
-        return mapBlockStatement(expression, transformation, changesMade);
+        return mapBlockStatement(expression, transformation, changesMade, parentFolderName);
     }
     return expression;
 };
@@ -266,6 +320,99 @@ const getCompositionIdFromJSXElement = (jsxElement) => {
         .filter(Boolean);
     return id[0];
 };
+const getFolderNameFromJSXElement = (jsxElement) => {
+    if (jsxElement.type !== 'JSXElement') {
+        return null;
+    }
+    const { openingElement } = jsxElement;
+    const { name } = openingElement;
+    if (name.type !== 'JSXIdentifier') {
+        return null;
+    }
+    if (name.name !== 'Folder') {
+        return null;
+    }
+    const folderName = openingElement.attributes
+        .map((attribute) => {
+        if (attribute.type === 'JSXSpreadAttribute') {
+            return null;
+        }
+        if (attribute.name.type === 'JSXNamespacedName') {
+            return null;
+        }
+        if (attribute.name.name !== 'name') {
+            return null;
+        }
+        if (!attribute.value) {
+            return null;
+        }
+        if (attribute.value.type === 'StringLiteral') {
+            return attribute.value.value;
+        }
+        if (attribute.value.type === 'JSXExpressionContainer' &&
+            attribute.value.expression.type === 'StringLiteral') {
+            return attribute.value.expression.value;
+        }
+        return null;
+    })
+        .filter(Boolean);
+    return folderName[0];
+};
+const changeFolderName = ({ jsxElement, newFolderName, changesMade, }) => {
+    const { openingElement } = jsxElement;
+    const { name } = openingElement;
+    if (name.type !== 'JSXIdentifier') {
+        return jsxElement;
+    }
+    if (name.name !== 'Folder') {
+        return jsxElement;
+    }
+    const attributes = openingElement.attributes.map((attribute) => {
+        if (attribute.type === 'JSXSpreadAttribute') {
+            return attribute;
+        }
+        if (attribute.name.type === 'JSXNamespacedName') {
+            return attribute;
+        }
+        if (attribute.name.name === 'name' &&
+            attribute.value &&
+            attribute.value.type === 'StringLiteral') {
+            changesMade.push({
+                description: 'Replaced folder name',
+            });
+            return {
+                ...attribute,
+                value: { ...attribute.value, value: newFolderName },
+            };
+        }
+        if (attribute.name.name === 'name' &&
+            attribute.value &&
+            attribute.value.type === 'JSXExpressionContainer' &&
+            attribute.value.expression.type === 'StringLiteral') {
+            changesMade.push({
+                description: 'Replaced folder name',
+            });
+            return {
+                ...attribute,
+                value: {
+                    ...attribute.value,
+                    expression: {
+                        ...attribute.value.expression,
+                        value: newFolderName,
+                    },
+                },
+            };
+        }
+        return attribute;
+    });
+    return {
+        ...jsxElement,
+        openingElement: {
+            ...jsxElement.openingElement,
+            attributes,
+        },
+    };
+};
 const changeComposition = ({ jsxElement, newCompositionId, newCompositionFps, newCompositionDurationInFrames, newCompositionHeight, newCompositionWidth, changesMade, newTagToUse, }) => {
     const { openingElement } = jsxElement;
     const { name } = openingElement;

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

@@ -0,0 +1,14 @@
+import type { ReorderSequencePosition } from '@remotion/studio-shared';
+import type { SequenceNodePath } from 'remotion';
+export declare const reorderSequence: ({ input, sourceNodePath, targetNodePath, position, prettierConfigOverride, }: {
+    input: string;
+    sourceNodePath: SequenceNodePath;
+    targetNodePath: SequenceNodePath;
+    position: ReorderSequencePosition;
+    prettierConfigOverride?: Record<string, unknown> | null | undefined;
+}) => Promise<{
+    output: string;
+    formatted: boolean;
+    sequenceLabel: string;
+    logLine: number;
+}>;

package/dist/codemods/reorder-sequence.js

@@ -0,0 +1,109 @@
+"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.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 parse_ast_1 = require("./parse-ast");
+const { namedTypes } = recast.types;
+const getJsxChildrenParent = (path) => {
+    var _a;
+    const parent = (_a = path.parentPath) === null || _a === void 0 ? void 0 : _a.node;
+    if (!parent) {
+        return null;
+    }
+    if (namedTypes.JSXElement.check(parent)) {
+        return parent;
+    }
+    if (namedTypes.JSXFragment.check(parent)) {
+        return parent;
+    }
+    return null;
+};
+const reorderSequence = async ({ input, sourceNodePath, targetNodePath, position, prettierConfigOverride, }) => {
+    var _a, _b;
+    var _c, _d;
+    const ast = (0, parse_ast_1.parseAst)(input);
+    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');
+    }
+    const targetPath = (0, delete_jsx_node_1.findJsxElementPathForDeletion)(ast, targetNodePath);
+    if (!targetPath) {
+        throw new Error('Could not find a JSX element at the target location to reorder sequence');
+    }
+    const sourceParent = getJsxChildrenParent(sourcePath);
+    const targetParent = getJsxChildrenParent(targetPath);
+    if (!sourceParent || !targetParent || sourceParent !== targetParent) {
+        throw new Error('Cannot reorder sequence: source and target are not JSX siblings');
+    }
+    const sourceElement = sourcePath.node;
+    const targetElement = targetPath.node;
+    if (sourceElement === targetElement) {
+        throw new Error('Cannot reorder sequence: source and target are identical');
+    }
+    const { children } = sourceParent;
+    const sourceIndex = children.indexOf(sourceElement);
+    const targetIndex = children.indexOf(targetElement);
+    if (sourceIndex === -1 || targetIndex === -1) {
+        throw new Error('Cannot reorder sequence: JSX sibling was not found');
+    }
+    const sequenceLabel = (0, delete_jsx_node_1.getJsxElementTagLabel)(sourceElement);
+    const logLine = (_d = (_c = (_a = sourceElement.openingElement.loc) === null || _a === void 0 ? void 0 : _a.start.line) !== null && _c !== void 0 ? _c : (_b = sourceElement.loc) === null || _b === void 0 ? void 0 : _b.start.line) !== null && _d !== void 0 ? _d : 1;
+    const [moved] = children.splice(sourceIndex, 1);
+    if (!moved) {
+        throw new Error('Cannot reorder sequence: source sequence was not found');
+    }
+    const targetIndexAfterRemoval = children.indexOf(targetElement);
+    if (targetIndexAfterRemoval === -1) {
+        throw new Error('Cannot reorder sequence: target sequence was not found');
+    }
+    children.splice(position === 'before'
+        ? targetIndexAfterRemoval
+        : targetIndexAfterRemoval + 1, 0, moved);
+    const finalFile = (0, parse_ast_1.serializeAst)(ast);
+    const { output, formatted } = await (0, format_file_content_1.formatFileContent)({
+        input: finalFile,
+        prettierConfigOverride,
+    });
+    return {
+        output,
+        formatted,
+        sequenceLabel,
+        logLine,
+    };
+};
+exports.reorderSequence = reorderSequence;

package/dist/codemods/update-effect-props/update-effect-props.d.ts

@@ -1,14 +1,20 @@
 import type { ArrayExpression, CallExpression, JSXAttribute } from '@babel/types';
+import type { EffectClipboardParam } from '@remotion/studio-shared';
 import type { SequenceNodePath, SequenceSchema } from 'remotion';
 export type EffectPropUpdate = {
     key: string;
     value: unknown;
     defaultValue: unknown | null;
+} | {
+    key: string;
+    effectParam: EffectClipboardParam;
+    defaultValue: unknown | null;
 };
 export type UpdateEffectPropsResult = {
     output: string;
     formatted: boolean;
     oldValueString: string;
+    newValueString: string;
     logLine: number;
     effectCallee: string;
     removedProps: PropDelta[];
@@ -47,6 +53,7 @@ export declare const updateEffectPropsAst: ({ input, sequenceNodePath, effectInd
 }) => {
     serialized: string;
     oldValueString: string;
+    newValueString: string;
     logLine: number;
     effectCallee: string;
     removedProps: PropDelta[];

package/dist/codemods/update-effect-props/update-effect-props.js

@@ -34,23 +34,16 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateEffectProps = exports.updateEffectPropsAst = exports.findEffectCallExpression = exports.enumerateEffectArrayElements = exports.findEffectsAttr = void 0;
-const studio_shared_1 = require("@remotion/studio-shared");
 const recast = __importStar(require("recast"));
 const no_react_1 = require("remotion/no-react");
+const get_ast_node_path_1 = require("../../helpers/get-ast-node-path");
 const can_update_sequence_props_1 = require("../../preview-server/routes/can-update-sequence-props");
+const effect_param_expression_1 = require("../effect-param-expression");
 const format_file_content_1 = require("../format-file-content");
 const parse_ast_1 = require("../parse-ast");
+const ensure_imports_and_frame_hook_1 = require("../update-keyframes/ensure-imports-and-frame-hook");
+const update_nested_prop_1 = require("../update-nested-prop");
 const b = recast.types.builders;
-const parseValueExpression = (value) => {
-    const code = `a = ${(0, studio_shared_1.stringifyDefaultProps)({ props: value, enumPaths: [] })}`;
-    const ast = (0, parse_ast_1.parseAst)(code);
-    const stmt = ast.program.body[0];
-    if (stmt.type !== 'ExpressionStatement' ||
-        stmt.expression.type !== 'AssignmentExpression') {
-        throw new Error('Failed to parse effect prop value expression');
-    }
-    return stmt.expression.right;
-};
 const findEffectsAttr = (attrs) => {
     for (const attr of attrs) {
         if (attr.type !== 'JSXAttribute') {
@@ -138,6 +131,47 @@ const printObjectPropertyValue = (prop) => recast
     .code.replace(/[\n\r\t]+/g, ' ')
     .replace(/,(\s*[}\]])/g, '$1')
     .trim();
+const updateHasEffectParam = (update) => 'effectParam' in update;
+const getStaticUpdateValue = (update) => {
+    if (updateHasEffectParam(update)) {
+        return update.effectParam.type === 'static'
+            ? update.effectParam.value
+            : null;
+    }
+    return update.value;
+};
+const ensureClipboardParamImports = ({ ast, sequenceNodePath, param, }) => {
+    var _a;
+    const requiredImports = (0, effect_param_expression_1.getRequiredRemotionImportsForEffectParams)([param]);
+    const remotionLocalNames = (0, effect_param_expression_1.ensureRemotionImportLocalNames)({
+        ast,
+        requiredImports,
+    });
+    if (requiredImports.has('useCurrentFrame')) {
+        const targetJsxPath = (0, get_ast_node_path_1.getAstNodePath)(ast, sequenceNodePath);
+        if (targetJsxPath) {
+            const fnPath = (0, ensure_imports_and_frame_hook_1.findEnclosingFunctionPath)(targetJsxPath);
+            if (fnPath) {
+                (0, ensure_imports_and_frame_hook_1.ensureUseCurrentFrameHook)(fnPath, (_a = remotionLocalNames.useCurrentFrame) !== null && _a !== void 0 ? _a : 'useCurrentFrame');
+            }
+        }
+    }
+    return remotionLocalNames;
+};
+const makeUpdateValueExpression = ({ ast, sequenceNodePath, update, }) => {
+    if (!updateHasEffectParam(update)) {
+        return (0, update_nested_prop_1.parseValueExpression)(update.value);
+    }
+    const remotionLocalNames = ensureClipboardParamImports({
+        ast,
+        sequenceNodePath,
+        param: update.effectParam,
+    });
+    return (0, effect_param_expression_1.makeParamExpression)({
+        param: update.effectParam,
+        remotionLocalNames,
+    });
+};
 const removeObjectProperty = ({ objExpr, propertyName, }) => {
     const { propIndex, prop } = findObjectProperty(objExpr, propertyName);
     if (!prop || propIndex === -1) {
@@ -170,7 +204,8 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
         throw new Error(`Cannot update effect prop: ${found.reason}`);
     }
     const { call, callee: effectCallee } = found;
-    const isDefault = update.defaultValue !== null &&
+    const isDefault = !updateHasEffectParam(update) &&
+        update.defaultValue !== null &&
         JSON.stringify(update.value) === JSON.stringify(update.defaultValue);
     let objExpr;
     if (call.arguments.length === 0) {
@@ -178,6 +213,7 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
             return {
                 serialized: (0, parse_ast_1.serializeAst)(ast),
                 oldValueString: '',
+                newValueString: JSON.stringify(update.defaultValue),
                 logLine: (_g = (_f = (_a = call.loc) === null || _a === void 0 ? void 0 : _a.start.line) !== null && _f !== void 0 ? _f : (_b = jsx.loc) === null || _b === void 0 ? void 0 : _b.start.line) !== null && _g !== void 0 ? _g : 1,
                 effectCallee,
                 removedProps: [],
@@ -201,7 +237,9 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
     else if (update.defaultValue !== null) {
         oldValueString = JSON.stringify(update.defaultValue);
     }
+    let newValueString = '';
     if (isDefault) {
+        newValueString = JSON.stringify(update.defaultValue);
         if (prop) {
             const idx = objExpr.properties.indexOf(prop);
             if (idx !== -1) {
@@ -210,7 +248,12 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
         }
     }
     else {
-        const newValueExpr = parseValueExpression(update.value);
+        const newValueExpr = makeUpdateValueExpression({
+            ast,
+            sequenceNodePath,
+            update,
+        });
+        newValueString = recast.print(newValueExpr).code;
         if (prop) {
             prop.value = newValueExpr;
         }
@@ -219,11 +262,14 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
         }
     }
     const fieldSchema = schema[update.key];
-    if (fieldSchema && fieldSchema.type === 'enum') {
+    const staticUpdateValue = getStaticUpdateValue(update);
+    if (fieldSchema &&
+        fieldSchema.type === 'enum' &&
+        staticUpdateValue !== null) {
         const propsToDelete = no_react_1.NoReactInternals.findPropsToDelete({
             schema,
             key: update.key,
-            value: update.value,
+            value: staticUpdateValue,
         });
         for (const propToDelete of propsToDelete) {
             const removed = removeObjectProperty({
@@ -239,6 +285,7 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
     return {
         serialized: (0, parse_ast_1.serializeAst)(ast),
         oldValueString,
+        newValueString,
         logLine,
         effectCallee,
         removedProps,
@@ -246,7 +293,7 @@ const updateEffectPropsAst = ({ input, sequenceNodePath, effectIndex, update, sc
 };
 exports.updateEffectPropsAst = updateEffectPropsAst;
 const updateEffectProps = async ({ input, sequenceNodePath, effectIndex, update, schema, prettierConfigOverride, }) => {
-    const { serialized, oldValueString, logLine, effectCallee, removedProps } = (0, exports.updateEffectPropsAst)({
+    const { serialized, oldValueString, newValueString, logLine, effectCallee, removedProps, } = (0, exports.updateEffectPropsAst)({
         input,
         sequenceNodePath,
         effectIndex,
@@ -260,6 +307,7 @@ const updateEffectProps = async ({ input, sequenceNodePath, effectIndex, update,
     return {
         output,
         oldValueString,
+        newValueString,
         formatted,
         logLine,
         effectCallee,

package/dist/codemods/update-keyframes/ensure-imports-and-frame-hook.d.ts

@@ -1,4 +1,4 @@
 import type { File } from '@babel/types';
 export declare const findEnclosingFunctionPath: (path: import("ast-types/lib/node-path").NodePath<N, V>) => import("ast-types/lib/node-path").NodePath<N, V> | null;
 export declare const ensureRemotionImports: (ast: File, names: ReadonlySet<string>) => void;
-export declare const ensureUseCurrentFrameHook: (functionPath: import("ast-types/lib/node-path").NodePath<N, V>) => void;
+export declare const ensureUseCurrentFrameHook: (functionPath: import("ast-types/lib/node-path").NodePath<N, V>, hookName?: string) => void;