@remotion/studio-server 4.0.490 → 4.0.492

package/dist/helpers/video-config-numeric-expression.js

@@ -0,0 +1,152 @@
+"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.updateVideoConfigNumericExpression = exports.parseVideoConfigNumericExpression = void 0;
+const recast = __importStar(require("recast"));
+const b = recast.types.builders;
+const getNumericLiteral = (node) => {
+    if (node.type === 'NumericLiteral') {
+        return Number.isFinite(node.value) ? node.value : null;
+    }
+    if (node.type === 'UnaryExpression' &&
+        (node.operator === '-' || node.operator === '+') &&
+        node.argument.type === 'NumericLiteral') {
+        const value = node.operator === '-' ? -node.argument.value : node.argument.value;
+        return Number.isFinite(value) ? value : null;
+    }
+    if (node.type === 'TSAsExpression') {
+        return getNumericLiteral(node.expression);
+    }
+    return null;
+};
+const getVideoConfigValue = ({ node, videoConfigValues, }) => {
+    if (node.type === 'TSAsExpression') {
+        return getVideoConfigValue({
+            node: node.expression,
+            videoConfigValues,
+        });
+    }
+    if (node.type !== 'Identifier') {
+        return null;
+    }
+    const value = videoConfigValues[node.name];
+    if (value === undefined || !Number.isFinite(value)) {
+        return null;
+    }
+    return { identifier: node.name, value };
+};
+const parseVideoConfigNumericExpression = ({ node, videoConfigValues, }) => {
+    if (node.type === 'TSAsExpression') {
+        return (0, exports.parseVideoConfigNumericExpression)({
+            node: node.expression,
+            videoConfigValues,
+        });
+    }
+    const literal = getNumericLiteral(node);
+    if (literal !== null) {
+        return { type: 'literal', value: literal };
+    }
+    const videoConfigValue = getVideoConfigValue({ node, videoConfigValues });
+    if (videoConfigValue !== null) {
+        return { type: 'video-config-value', ...videoConfigValue };
+    }
+    if (node.type !== 'BinaryExpression' || node.operator !== '*') {
+        return null;
+    }
+    const left = node.left;
+    const right = node.right;
+    const leftNumber = getNumericLiteral(left);
+    const rightNumber = getNumericLiteral(right);
+    const leftVideoConfig = getVideoConfigValue({
+        node: left,
+        videoConfigValues,
+    });
+    const rightVideoConfig = getVideoConfigValue({
+        node: right,
+        videoConfigValues,
+    });
+    const factorPosition = leftNumber !== null && rightVideoConfig !== null
+        ? 'left'
+        : rightNumber !== null && leftVideoConfig !== null
+            ? 'right'
+            : null;
+    if (factorPosition === null) {
+        return null;
+    }
+    const multiplier = factorPosition === 'left' ? leftNumber : rightNumber;
+    const configValue = factorPosition === 'left' ? rightVideoConfig : leftVideoConfig;
+    const value = multiplier * configValue.value;
+    if (!Number.isFinite(value)) {
+        return null;
+    }
+    return {
+        type: 'video-config-multiplication',
+        identifier: configValue.identifier,
+        multiplier,
+        multiplicand: configValue.value,
+        factorPosition,
+        value,
+    };
+};
+exports.parseVideoConfigNumericExpression = parseVideoConfigNumericExpression;
+const numericExpression = (value) => {
+    if (value < 0) {
+        return b.unaryExpression('-', b.numericLiteral(-value), true);
+    }
+    return b.numericLiteral(value);
+};
+const updateVideoConfigNumericExpression = ({ expression, value, }) => {
+    if (!Number.isFinite(value)) {
+        return numericExpression(value);
+    }
+    if (expression.type === 'video-config-value') {
+        return value === expression.value
+            ? b.identifier(expression.identifier)
+            : numericExpression(value);
+    }
+    if (expression.type !== 'video-config-multiplication' || value === 0) {
+        return numericExpression(value);
+    }
+    const multiplier = value / expression.multiplicand;
+    if (!Number.isFinite(multiplier) || multiplier === 0) {
+        return numericExpression(value);
+    }
+    const factor = numericExpression(multiplier);
+    const identifier = b.identifier(expression.identifier);
+    return expression.factorPosition === 'left'
+        ? b.binaryExpression('*', factor, identifier)
+        : b.binaryExpression('*', identifier, factor);
+};
+exports.updateVideoConfigNumericExpression = updateVideoConfigNumericExpression;

package/dist/helpers/video-config-values.d.ts

@@ -0,0 +1,7 @@
+import type { File } from '@babel/types';
+import type { VideoConfigValues } from 'remotion';
+export type VideoConfigIdentifierValues = Record<string, number>;
+export declare const getVideoConfigIdentifierValues: ({ ast, videoConfigValues, }: {
+    ast: File;
+    videoConfigValues: VideoConfigValues | null;
+}) => VideoConfigIdentifierValues;

package/dist/helpers/video-config-values.js

@@ -0,0 +1,84 @@
+"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.getVideoConfigIdentifierValues = void 0;
+const recast = __importStar(require("recast"));
+const getVideoConfigIdentifierValues = ({ ast, videoConfigValues, }) => {
+    if (videoConfigValues === null) {
+        return {};
+    }
+    const candidates = new Map();
+    const otherDeclarations = new Set();
+    recast.types.visit(ast, {
+        visitVariableDeclarator(path) {
+            const { id, init } = path.node;
+            const isVideoConfigDeclaration = id.type === 'ObjectPattern' &&
+                (init === null || init === void 0 ? void 0 : init.type) === 'CallExpression' &&
+                init.callee.type === 'Identifier' &&
+                init.callee.name === 'useVideoConfig' &&
+                init.arguments.length === 0;
+            if (isVideoConfigDeclaration) {
+                for (const property of id.properties) {
+                    if (property.type !== 'ObjectProperty' ||
+                        property.computed ||
+                        property.value.type !== 'Identifier') {
+                        continue;
+                    }
+                    const configKey = property.key.type === 'Identifier'
+                        ? property.key.name
+                        : property.key.type === 'StringLiteral'
+                            ? property.key.value
+                            : null;
+                    if (configKey === null || !(configKey in videoConfigValues)) {
+                        continue;
+                    }
+                    const value = videoConfigValues[configKey];
+                    if (Number.isFinite(value)) {
+                        candidates.set(property.value.name, value);
+                    }
+                }
+            }
+            else if (id.type === 'Identifier') {
+                otherDeclarations.add(id.name);
+            }
+            this.traverse(path);
+        },
+    });
+    for (const identifier of otherDeclarations) {
+        candidates.delete(identifier);
+    }
+    return Object.fromEntries(candidates);
+};
+exports.getVideoConfigIdentifierValues = getVideoConfigIdentifierValues;

package/dist/index.d.ts

@@ -2,7 +2,7 @@ export { ApiRoutes, CopyStillToClipboardRequest, getDefaultOutLocation, OpenInFi
 export type { AggregateRenderProgress, BundlingState, CopyingState, DownloadProgress, HotMiddlewareOptions, JobProgressCallback, ModuleMap, PackageManager, ProjectInfo, RenderingProgressInput, RenderJob, RenderJobWithCleanup, RequiredChromiumOptions, StitchingProgressInput, UiOpenGlOptions, } from '@remotion/studio-shared';
 import { AnsiDiff } from './ansi-diff';
 export declare const StudioServerInternals: {
-    startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, experimentalClientSideRenderingEnabled, relativePublicDir, webpackOverride, poll, getRenderDefaults, getRenderQueue, numberOfAudioTags, queueMethods, previewEntry, gitSource, bufferStateDelayInMilliseconds, binariesDirectory, forceIPv4, audioLatencyHint, previewSampleRate, enableCrossSiteIsolation, askAIEnabled, interactivityEnabled, forceNew, rspack, getStudioRuntimeConfig, }: {
+    startStudio: ({ browserArgs, browserFlag, shouldOpenBrowser, fullEntryPath, logLevel, getCurrentInputProps, getEnvVariables, desiredPort, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, relativePublicDir, webpackOverride, poll, getRenderDefaults, getRenderQueue, numberOfAudioTags, queueMethods, previewEntry, gitSource, bufferStateDelayInMilliseconds, binariesDirectory, forceIPv4, audioLatencyHint, previewSampleRate, enableCrossSiteIsolation, askAIEnabled, interactivityEnabled, forceNew, rspack, getStudioRuntimeConfig, }: {
         browserArgs: string;
         browserFlag: string;
         logLevel: "error" | "info" | "trace" | "verbose" | "warn";
@@ -15,7 +15,6 @@ export declare const StudioServerInternals: {
         bufferStateDelayInMilliseconds: number | null;
         remotionRoot: string;
         keyboardShortcutsEnabled: boolean;
-        experimentalClientSideRenderingEnabled: boolean;
         relativePublicDir: string | null;
         webpackOverride: import("@remotion/bundler").WebpackOverrideFn;
         poll: number | null;

package/dist/preview-server/element-install-state.d.ts

@@ -7,6 +7,7 @@ export type ElementInstallTarget = {
     canInstall: boolean;
     lastFocusedAt: number | null;
     readOnly: boolean;
+    studioUrl: string;
     updatedAt: number;
 };
 export declare const updateElementInstallTarget: (newTarget: Omit<ElementInstallTarget, "updatedAt">) => void;

package/dist/preview-server/routes/add-effect-keyframe.js

@@ -8,6 +8,7 @@ const parse_ast_1 = require("../../codemods/parse-ast");
 const update_keyframes_1 = require("../../codemods/update-keyframes/update-keyframes");
 const file_watcher_1 = require("../../file-watcher");
 const resolve_file_inside_project_1 = require("../../helpers/resolve-file-inside-project");
+const video_config_values_1 = require("../../helpers/video-config-values");
 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");
@@ -28,6 +29,7 @@ const addEffectKeyframeHandler = ({ input: { fileName, sequenceNodePath, effectI
         sequenceNodePath: sequenceNodePath.nodePath,
         effectIndex,
         schema,
+        videoConfigValues: sequenceNodePath.videoConfigValues,
         updates: [
             {
                 key,
@@ -88,6 +90,10 @@ const addEffectKeyframeHandler = ({ input: { fileName, sequenceNodePath, effectI
         jsx,
         effectIndex,
         keys: (0, studio_shared_1.getAllSchemaKeys)(schema),
+        videoConfigValues: (0, video_config_values_1.getVideoConfigIdentifierValues)({
+            ast,
+            videoConfigValues: sequenceNodePath.videoConfigValues,
+        }),
     });
 });
 exports.addEffectKeyframeHandler = addEffectKeyframeHandler;

package/dist/preview-server/routes/add-keyframes.js

@@ -95,6 +95,7 @@ const addKeyframes = async ({ sequenceKeyframes, effectKeyframes, clientId, remo
                 input: output,
                 nodePath: firstSequenceKeyframe.nodePath.nodePath,
                 schema: firstSequenceKeyframe.schema,
+                videoConfigValues: firstSequenceKeyframe.nodePath.videoConfigValues,
                 updates: keyframeGroup.map((keyframe) => ({
                     key: keyframe.key,
                     operation: {
@@ -127,6 +128,7 @@ const addKeyframes = async ({ sequenceKeyframes, effectKeyframes, clientId, remo
                 sequenceNodePath: firstEffectKeyframe.sequenceNodePath.nodePath,
                 effectIndex: firstEffectKeyframe.effectIndex,
                 schema: firstEffectKeyframe.schema,
+                videoConfigValues: firstEffectKeyframe.sequenceNodePath.videoConfigValues,
                 updates: keyframeGroup.map((keyframe) => ({
                     key: keyframe.key,
                     operation: {

package/dist/preview-server/routes/add-sequence-keyframe.js

@@ -25,6 +25,7 @@ const addSequenceKeyframeHandler = ({ input: { fileName, nodePath, key, frame, v
         input: fileContents,
         nodePath: nodePath.nodePath,
         schema,
+        videoConfigValues: nodePath.videoConfigValues,
         updates: [
             {
                 key,
@@ -76,6 +77,7 @@ const addSequenceKeyframeHandler = ({ input: { fileName, nodePath, key, frame, v
         nodePath: updatedNodePath,
         componentIdentity: null,
         effects: [],
+        videoConfigValues: nodePath.videoConfigValues,
     });
     const updatedSubscriptionKey = { ...nodePath, nodePath: updatedNodePath };
     return {

package/dist/preview-server/routes/apply-codemod.d.ts

@@ -1,3 +1,4 @@
 import type { ApplyCodemodRequest, ApplyCodemodResponse } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
+export declare const getCodemodLogMessage: (codemod: import("@remotion/studio-shared").RecastCodemod) => string;
 export declare const applyCodemodHandler: ApiHandler<ApplyCodemodRequest, ApplyCodemodResponse>;

package/dist/preview-server/routes/apply-codemod.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.applyCodemodHandler = void 0;
+exports.applyCodemodHandler = exports.getCodemodLogMessage = void 0;
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
 const renderer_1 = require("@remotion/renderer");
@@ -11,6 +11,7 @@ const apply_codemod_to_file_1 = require("../../codemods/apply-codemod-to-file");
 const duplicate_composition_1 = require("../../codemods/duplicate-composition");
 const simple_diff_1 = require("../../codemods/simple-diff");
 const file_watcher_1 = require("../../file-watcher");
+const format_log_file_location_1 = require("../format-log-file-location");
 const project_info_1 = require("../project-info");
 const undo_stack_1 = require("../undo-stack");
 const can_update_default_props_1 = require("./can-update-default-props");
@@ -23,6 +24,50 @@ export const ${componentName}: React.FC = () => {
 };
 `);
 };
+const getFolderPath = (parentName, folderName) => {
+    return parentName ? `${parentName}/${folderName}` : folderName;
+};
+const getCodemodLogMessage = (codemod) => {
+    if (codemod.type === 'new-composition') {
+        const destination = codemod.folderName
+            ? ` in folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`
+            : '';
+        return `Created composition "${codemod.newId}"${destination}`;
+    }
+    if (codemod.type === 'duplicate-composition') {
+        return `Duplicated composition "${codemod.idToDuplicate}" to "${codemod.newId}"`;
+    }
+    if (codemod.type === 'rename-composition') {
+        return `Renamed composition "${codemod.idToRename}" to "${codemod.newId}"`;
+    }
+    if (codemod.type === 'delete-composition') {
+        return `Deleted composition "${codemod.idToDelete}"`;
+    }
+    if (codemod.type === 'move-composition-to-folder') {
+        const destination = codemod.folderName
+            ? `into folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`
+            : 'to root';
+        return `Moved composition "${codemod.idToMove}" ${destination}`;
+    }
+    if (codemod.type === 'rename-folder') {
+        const oldName = getFolderPath(codemod.parentName, codemod.folderName);
+        const newName = getFolderPath(codemod.parentName, codemod.newName);
+        return `Renamed folder "${oldName}" to "${newName}"`;
+    }
+    if (codemod.type === 'new-folder') {
+        return `Created folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`;
+    }
+    if (codemod.type === 'delete-folder') {
+        return `Deleted folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`;
+    }
+    if (codemod.changes.length === 1) {
+        return `Updated visual control "${codemod.changes[0].id}"`;
+    }
+    return `Updated visual controls ${codemod.changes
+        .map((change) => `"${change.id}"`)
+        .join(', ')}`;
+};
+exports.getCodemodLogMessage = getCodemodLogMessage;
 const getCodemodUndoDescription = (codemod) => {
     if (codemod.type === 'delete-composition') {
         return {
@@ -50,7 +95,7 @@ const getCodemodUndoDescription = (codemod) => {
     if (codemod.type === 'move-composition-to-folder') {
         const destination = codemod.folderName === null
             ? 'to root'
-            : `into folder "${codemod.parentName ? `${codemod.parentName}/` : ''}${codemod.folderName}"`;
+            : `into folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`;
         const label = `composition "${codemod.idToMove}" ${destination}`;
         return {
             undoMessage: `↩️  Move of ${label}`,
@@ -66,7 +111,7 @@ const getCodemodUndoDescription = (codemod) => {
         };
     }
     if (codemod.type === 'delete-folder') {
-        const label = `folder "${codemod.parentName ? `${codemod.parentName}/` : ''}${codemod.folderName}"`;
+        const label = `folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`;
         return {
             undoMessage: `↩️  Deletion of ${label}`,
             redoMessage: `↪️  Deletion of ${label}`,
@@ -74,7 +119,7 @@ const getCodemodUndoDescription = (codemod) => {
         };
     }
     if (codemod.type === 'new-folder') {
-        const label = `folder "${codemod.parentName ? `${codemod.parentName}/` : ''}${codemod.folderName}"`;
+        const label = `folder "${getFolderPath(codemod.parentName, codemod.folderName)}"`;
         return {
             undoMessage: `↩️  Creation of ${label}`,
             redoMessage: `↪️  Creation of ${label}`,
@@ -82,8 +127,8 @@ const getCodemodUndoDescription = (codemod) => {
         };
     }
     if (codemod.type === 'rename-folder') {
-        const oldName = `${codemod.parentName ? `${codemod.parentName}/` : ''}${codemod.folderName}`;
-        const newName = `${codemod.parentName ? `${codemod.parentName}/` : ''}${codemod.newName}`;
+        const oldName = getFolderPath(codemod.parentName, codemod.folderName);
+        const newName = getFolderPath(codemod.parentName, codemod.newName);
         const label = `folder "${oldName}" to "${newName}"`;
         return {
             undoMessage: `↩️  Rename of ${label}`,
@@ -99,9 +144,9 @@ const getCodemodUndoDescription = (codemod) => {
 };
 const applyCodemodHandler = ({ input: { codemod, dryRun, symbolicatedStack }, logLevel, remotionRoot, entryPoint, }) => {
     return (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
-        var _a, _b;
+        var _a;
         try {
-            const time = Date.now();
+            const logLine = (_a = symbolicatedStack === null || symbolicatedStack === void 0 ? void 0 : symbolicatedStack.originalLineNumber) !== null && _a !== void 0 ? _a : 1;
             const filePath = symbolicatedStack
                 ? (0, apply_codemod_to_file_1.resolveFilePathFromSymbolicatedStack)(remotionRoot, symbolicatedStack)
                 : (await (0, project_info_1.getProjectInfo)(remotionRoot, entryPoint)).rootFile;
@@ -133,7 +178,7 @@ const applyCodemodHandler = ({ input: { codemod, dryRun, symbolicatedStack }, lo
                         filePath,
                         oldContents: input,
                         newContents: null,
-                        logLine: (_a = symbolicatedStack === null || symbolicatedStack === void 0 ? void 0 : symbolicatedStack.originalLineNumber) !== null && _a !== void 0 ? _a : 1,
+                        logLine,
                     },
                 ];
                 let componentFilePath = null;
@@ -169,7 +214,7 @@ const applyCodemodHandler = ({ input: { codemod, dryRun, symbolicatedStack }, lo
                         newContents: null,
                         logLevel,
                         remotionRoot,
-                        logLine: (_b = symbolicatedStack === null || symbolicatedStack === void 0 ? void 0 : symbolicatedStack.originalLineNumber) !== null && _b !== void 0 ? _b : 1,
+                        logLine,
                         description: {
                             undoMessage,
                             redoMessage,
@@ -186,9 +231,13 @@ const applyCodemodHandler = ({ input: { codemod, dryRun, symbolicatedStack }, lo
                 if (componentFilePath && componentFileContents !== null) {
                     (0, file_watcher_1.writeFileAndNotifyFileWatchers)(componentFilePath, componentFileContents, undefined);
                 }
-                const end = Date.now() - time;
-                const relativePath = node_path_1.default.relative(remotionRoot, filePath);
-                renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.blue(`Edited ${relativePath} in ${end}ms`));
+                const logMessage = (0, exports.getCodemodLogMessage)(codemod);
+                const editMessage = `${renderer_1.RenderInternals.chalk.blueBright((0, format_log_file_location_1.formatLogFileLocation)({
+                    remotionRoot,
+                    absolutePath: filePath,
+                    line: logLine,
+                }))} ${logMessage}`;
+                renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, editMessage);
                 (0, undo_stack_1.printUndoHint)(logLevel);
             }
             return {

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

@@ -1,21 +1,25 @@
 import type { File, JSXOpeningElement } from '@babel/types';
-import type { CanUpdateEffectPropsResponse, SequenceNodePath, InteractivitySchema } from 'remotion';
-export declare const computeEffectPropStatus: ({ ast, jsx, effectIndex, keys, }: {
+import type { CanUpdateEffectPropsResponse, SequenceNodePath, InteractivitySchema, VideoConfigValues } from 'remotion';
+import { type VideoConfigIdentifierValues } from '../../helpers/video-config-values';
+export declare const computeEffectPropStatus: ({ ast, jsx, effectIndex, keys, videoConfigValues, }: {
     ast: File;
     jsx: JSXOpeningElement;
     effectIndex: number;
     keys: string[];
+    videoConfigValues: VideoConfigIdentifierValues;
 }) => CanUpdateEffectPropsResponse;
-export declare const computeEffectPropsStatusesFromContent: ({ fileContents, sequenceNodePath, effects, keysFor, }: {
+export declare const computeEffectPropsStatusesFromContent: ({ fileContents, sequenceNodePath, effects, keysFor, videoConfigValues, }: {
     fileContents: string;
     sequenceNodePath: SequenceNodePath;
     effects: InteractivitySchema[];
     keysFor: (effect: InteractivitySchema) => string[];
+    videoConfigValues: VideoConfigValues | null;
 }) => CanUpdateEffectPropsResponse[];
-export declare const computeEffectPropsStatusesFromFile: ({ fileName, sequenceNodePath, effects, keysFor, remotionRoot, }: {
+export declare const computeEffectPropsStatusesFromFile: ({ fileName, sequenceNodePath, effects, keysFor, remotionRoot, videoConfigValues, }: {
     fileName: string;
     sequenceNodePath: SequenceNodePath;
     effects: InteractivitySchema[];
     keysFor: (effect: InteractivitySchema) => string[];
     remotionRoot: string;
+    videoConfigValues: VideoConfigValues | null;
 }) => CanUpdateEffectPropsResponse[];

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

@@ -5,6 +5,8 @@ const node_fs_1 = require("node:fs");
 const parse_ast_1 = require("../../codemods/parse-ast");
 const update_effect_props_1 = require("../../codemods/update-effect-props/update-effect-props");
 const resolve_file_inside_project_1 = require("../../helpers/resolve-file-inside-project");
+const video_config_numeric_expression_1 = require("../../helpers/video-config-numeric-expression");
+const video_config_values_1 = require("../../helpers/video-config-values");
 const can_update_sequence_props_1 = require("./can-update-sequence-props");
 const staticStatus = (codeValue) => ({
     status: 'static',
@@ -88,7 +90,7 @@ const resolveEffectImport = ({ ast, call, fallbackCallee, }) => {
     }
     return { callee: fallbackCallee, importPath: null };
 };
-const getPropsFromObjectExpression = ({ ast, objExpr, keys, }) => {
+const getPropsFromObjectExpression = ({ ast, objExpr, keys, videoConfigValues, }) => {
     const out = {};
     for (const key of keys) {
         const prop = objExpr.properties.find((p) => p.type === 'ObjectProperty' &&
@@ -101,7 +103,19 @@ const getPropsFromObjectExpression = ({ ast, objExpr, keys, }) => {
         }
         const valueExpr = prop.value;
         if (!(0, can_update_sequence_props_1.isStaticValue)(valueExpr)) {
-            out[key] = (0, can_update_sequence_props_1.getComputedStatus)(valueExpr, ast);
+            const numericExpression = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
+                node: valueExpr,
+                videoConfigValues,
+            });
+            out[key] = numericExpression
+                ? {
+                    status: 'static',
+                    codeValue: numericExpression.value,
+                    ...(numericExpression.type === 'literal'
+                        ? {}
+                        : { numericExpression }),
+                }
+                : (0, can_update_sequence_props_1.getComputedStatus)(valueExpr, ast, videoConfigValues);
             continue;
         }
         out[key] = {
@@ -111,7 +125,7 @@ const getPropsFromObjectExpression = ({ ast, objExpr, keys, }) => {
     }
     return out;
 };
-const computeEffectPropStatus = ({ ast, jsx, effectIndex, keys, }) => {
+const computeEffectPropStatus = ({ ast, jsx, effectIndex, keys, videoConfigValues, }) => {
     const attr = findEffectsAttr(jsx);
     const elements = getEffectsArrayElements(attr);
     if (!elements) {
@@ -167,6 +181,7 @@ const computeEffectPropStatus = ({ ast, jsx, effectIndex, keys, }) => {
         ast,
         objExpr: firstArg,
         keys,
+        videoConfigValues,
     });
     return {
         canUpdate: true,
@@ -177,8 +192,12 @@ const computeEffectPropStatus = ({ ast, jsx, effectIndex, keys, }) => {
     };
 };
 exports.computeEffectPropStatus = computeEffectPropStatus;
-const computeEffectPropsStatusesFromContent = ({ fileContents, sequenceNodePath, effects, keysFor, }) => {
+const computeEffectPropsStatusesFromContent = ({ fileContents, sequenceNodePath, effects, keysFor, videoConfigValues, }) => {
     const ast = (0, parse_ast_1.parseAst)(fileContents);
+    const videoConfigIdentifierValues = (0, video_config_values_1.getVideoConfigIdentifierValues)({
+        ast,
+        videoConfigValues,
+    });
     const jsx = (0, can_update_sequence_props_1.findJsxElementAtNodePath)(ast, sequenceNodePath);
     if (!jsx) {
         return effects.map((_effect, effectIndex) => ({
@@ -192,10 +211,11 @@ const computeEffectPropsStatusesFromContent = ({ fileContents, sequenceNodePath,
         jsx,
         effectIndex,
         keys: keysFor(effect),
+        videoConfigValues: videoConfigIdentifierValues,
     }));
 };
 exports.computeEffectPropsStatusesFromContent = computeEffectPropsStatusesFromContent;
-const computeEffectPropsStatusesFromFile = ({ fileName, sequenceNodePath, effects, keysFor, remotionRoot, }) => {
+const computeEffectPropsStatusesFromFile = ({ fileName, sequenceNodePath, effects, keysFor, remotionRoot, videoConfigValues, }) => {
     const { absolutePath } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
         remotionRoot,
         fileName,
@@ -207,6 +227,7 @@ const computeEffectPropsStatusesFromFile = ({ fileName, sequenceNodePath, effect
         sequenceNodePath,
         effects,
         keysFor,
+        videoConfigValues,
     });
 };
 exports.computeEffectPropsStatusesFromFile = computeEffectPropsStatusesFromFile;