@remotion/studio-server 4.0.533 → 4.0.535

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

@@ -439,7 +439,7 @@ const getInterpolationKeyframes = (node, ast, videoConfigValues) => {
             return undefined;
         }
         keyframes.push({
-            frame: frameExpression.value,
+            frame: no_react_1.NoReactInternals.evaluateSourceNumericValue(frameExpression, null),
             value: (0, exports.extractStaticValue)(outputElement),
             ...(frameExpression.type === 'literal' ? {} : { frameExpression }),
         });
@@ -521,8 +521,7 @@ const findNodePath = (ast, target) => {
     return found;
 };
 const getJsxNumericAttribute = ({ openingElement, name, defaultValue, videoConfigValues, }) => {
-    var _a, _b;
-    var _c;
+    var _a;
     if (openingElement.attributes.some((attribute) => attribute.type === 'JSXSpreadAttribute')) {
         return null;
     }
@@ -537,10 +536,13 @@ const getJsxNumericAttribute = ({ openingElement, name, defaultValue, videoConfi
             attribute.value.expression.type === 'JSXEmptyExpression') {
             return null;
         }
-        return ((_c = (_b = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
+        const numericExpression = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
             node: attribute.value.expression,
             videoConfigValues,
-        })) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : null);
+        });
+        return numericExpression === null
+            ? null
+            : no_react_1.NoReactInternals.evaluateSourceNumericValue(numericExpression, null);
     }
     return defaultValue;
 };
@@ -975,7 +977,7 @@ const resolveSequencePropsNodePathsFromFilename = ({ fileName, targets, remotion
     });
 };
 exports.resolveSequencePropsNodePathsFromFilename = resolveSequencePropsNodePathsFromFilename;
-const computeSequencePropsStatusFromContent = ({ fileContents, nodePath, componentIdentity, keys, assetKeys = [], effects, videoConfigValues, }) => {
+const computeSequencePropsStatusFromContent = ({ fileContents, nodePath, componentIdentity, keys, assetKeys = [], effects, }) => {
     try {
         return (0, codemods_1.getNodeProps)({
             project: { rootDir: '/', files: { 'source.tsx': fileContents } },
@@ -984,7 +986,6 @@ const computeSequencePropsStatusFromContent = ({ fileContents, nodePath, compone
             keys,
             assetKeys,
             effectKeys: effects,
-            videoConfig: videoConfigValues !== null && videoConfigValues !== void 0 ? videoConfigValues : undefined,
         });
     }
     catch (error) {
@@ -998,7 +999,7 @@ const computeSequencePropsStatusFromContent = ({ fileContents, nodePath, compone
     }
 };
 exports.computeSequencePropsStatusFromContent = computeSequencePropsStatusFromContent;
-const computeSequencePropsStatus = ({ fileName, nodePath, componentIdentity, keys, assetKeys = [], effects, remotionRoot, videoConfigValues, }) => {
+const computeSequencePropsStatus = ({ fileName, nodePath, componentIdentity, keys, assetKeys = [], effects, remotionRoot, }) => {
     const { absolutePath } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
         remotionRoot,
         fileName,
@@ -1012,11 +1013,10 @@ const computeSequencePropsStatus = ({ fileName, nodePath, componentIdentity, key
         keys,
         assetKeys,
         effects,
-        videoConfigValues,
     });
 };
 exports.computeSequencePropsStatus = computeSequencePropsStatus;
-const computeSequencePropsStatusFromFilenameByLocation = ({ fileName, line, column, componentIdentity, keys, assetKeys = [], effects, remotionRoot, logLevel, videoConfigValues, }) => {
+const computeSequencePropsStatusFromFilenameByLocation = ({ fileName, line, column, componentIdentity, keys, assetKeys = [], effects, remotionRoot, logLevel, }) => {
     try {
         const { absolutePath } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
             remotionRoot,
@@ -1046,14 +1046,13 @@ const computeSequencePropsStatusFromFilenameByLocation = ({ fileName, line, colu
                 assetKeys,
                 effects,
                 remotionRoot,
-                videoConfigValues,
             }),
             nodePath: {
                 absolutePath,
                 nodePath: resolvedNodePath,
                 sequenceKeys: keys,
                 effectKeys: effects,
-                videoConfigValues,
+                videoConfigValues: null,
             },
             success: true,
         };

package/dist/preview-server/routes/default-coding-agent.d.ts

@@ -1,4 +1,3 @@
-import type { GetDefaultCodingAgentInfoRequest, GetDefaultCodingAgentInfoResponse, OpenInCodingAgentRequest, OpenInCodingAgentResponse } from '@remotion/studio-shared';
+import type { GetDefaultCodingAgentInfoRequest, GetDefaultCodingAgentInfoResponse } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
 export declare const getDefaultCodingAgentInfoHandler: ApiHandler<GetDefaultCodingAgentInfoRequest, GetDefaultCodingAgentInfoResponse>;
-export declare const openInCodingAgentHandler: ApiHandler<OpenInCodingAgentRequest, OpenInCodingAgentResponse>;

package/dist/preview-server/routes/default-coding-agent.js

@@ -1,15 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.openInCodingAgentHandler = exports.getDefaultCodingAgentInfoHandler = void 0;
-const coding_agent_registry_1 = require("../../helpers/coding-agent-registry");
+exports.getDefaultCodingAgentInfoHandler = void 0;
+const app_discovery_1 = require("../../helpers/app-discovery");
 const git_client_registry_1 = require("../../helpers/git-client-registry");
+const recently_used_apps_1 = require("../../helpers/recently-used-apps");
 const terminal_registry_1 = require("../../helpers/terminal-registry");
-const getDefaultCodingAgentInfoHandler = async ({ getDefaultCodingAgent }) => {
-    const installedCodingAgents = await (0, coding_agent_registry_1.getAvailableCodingAgents)();
+const getDefaultCodingAgentInfoHandler = async ({ getDefaultCodingAgent, input, remotionRoot }) => {
+    await (0, recently_used_apps_1.getRecentlyUsedApps)({
+        remotionRoot,
+        type: 'coding-agent',
+        recentlyUsedIds: input.recentlyUsedIds,
+    });
+    const { installedCodingAgents, runningCodingAgents } = await (0, app_discovery_1.getAppDiscovery)();
     const installedTerminals = await (0, terminal_registry_1.getAvailableTerminals)();
     const installedGitClients = await (0, git_client_registry_1.getAvailableGitClients)();
     return {
         defaultCodingAgent: getDefaultCodingAgent(),
+        runningCodingAgents,
         installedCodingAgents: installedCodingAgents.map(({ id, name, nameWithType }) => ({
             id,
             name,
@@ -20,18 +27,3 @@ const getDefaultCodingAgentInfoHandler = async ({ getDefaultCodingAgent }) => {
     };
 };
 exports.getDefaultCodingAgentInfoHandler = getDefaultCodingAgentInfoHandler;
-const openInCodingAgentHandler = async ({ input, logLevel, remotionRoot }) => {
-    const codingAgent = (await (0, coding_agent_registry_1.getAvailableCodingAgents)()).find((agent) => agent.id === input.codingAgentId);
-    if (!codingAgent) {
-        return { success: false };
-    }
-    return {
-        success: await (0, coding_agent_registry_1.launchCodingAgent)({
-            codingAgent,
-            projectPath: remotionRoot,
-            logLevel,
-            prompt: input.prompt,
-        }),
-    };
-};
-exports.openInCodingAgentHandler = openInCodingAgentHandler;

package/dist/preview-server/routes/default-editor.js

@@ -1,34 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getDefaultEditorInfoHandler = void 0;
-const custom_editor_1 = require("../../helpers/custom-editor");
-const editor_registry_1 = require("../../helpers/editor-registry");
-const getDefaultEditorInfoHandler = async ({ getDefaultEditor }) => {
-    const installedEditors = await (0, editor_registry_1.getAvailableEditors)();
-    const configuredEditor = getDefaultEditor();
-    const customEditor = configuredEditor &&
-        typeof configuredEditor === 'object' &&
-        (0, custom_editor_1.resolveCustomEditorExecutable)(configuredEditor)
-        ? configuredEditor
-        : null;
-    return {
-        defaultEditor: typeof configuredEditor === 'object' ? 'custom' : configuredEditor,
-        installedEditors: [
-            ...installedEditors.map(({ id, name, nameWithType }) => ({
-                id,
-                name,
-                nameWithType,
-            })),
-            ...(customEditor
-                ? [
-                    {
-                        id: 'custom',
-                        name: customEditor.name,
-                        nameWithType: customEditor.name,
-                    },
-                ]
-                : []),
-        ],
-    };
+const app_discovery_1 = require("../../helpers/app-discovery");
+const recently_used_apps_1 = require("../../helpers/recently-used-apps");
+const getDefaultEditorInfoHandler = async ({ getDefaultEditor, input, remotionRoot }) => {
+    await (0, recently_used_apps_1.getRecentlyUsedApps)({
+        remotionRoot,
+        type: 'editor',
+        recentlyUsedIds: input.recentlyUsedIds,
+    });
+    return (0, app_discovery_1.getEditorInfo)(getDefaultEditor());
 };
 exports.getDefaultEditorInfoHandler = getDefaultEditorInfoHandler;

package/dist/preview-server/routes/delete-keyframes.d.ts

@@ -1,4 +1,4 @@
-import type { DeleteEffectKeyframe, DeleteKeyframesRequest, DeleteKeyframesResponse, DeleteSequenceKeyframe, SaveSequencePropsResult } from '@remotion/studio-shared';
+import type { DeleteEffectKeyframe, DeleteKeyframesRequest, DeleteKeyframesResponse, DeleteSequenceKeyframe, SaveEffectPropsResponse, SaveSequencePropsResult } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
 export declare const deleteKeyframes: ({ sequenceKeyframes, effectKeyframes, clientId, remotionRoot, logLevel, }: {
     sequenceKeyframes: DeleteSequenceKeyframe[];
@@ -8,6 +8,6 @@ export declare const deleteKeyframes: ({ sequenceKeyframes, effectKeyframes, cli
     logLevel: "error" | "info" | "trace" | "verbose" | "warn";
 }) => Promise<{
     sequenceResults: SaveSequencePropsResult[];
-    effectResults: import("remotion").CanUpdateEffectPropsResponse[];
+    effectResults: SaveEffectPropsResponse[];
 }>;
 export declare const deleteKeyframesHandler: ApiHandler<DeleteKeyframesRequest, DeleteKeyframesResponse>;

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

@@ -239,7 +239,6 @@ const deleteKeyframes = async ({ sequenceKeyframes, effectKeyframes, clientId, r
             nodePath: keyframe.nodePath.nodePath,
             componentIdentity: null,
             effects: [],
-            videoConfigValues: keyframe.nodePath.videoConfigValues,
         });
         return {
             fileName: keyframe.fileName,

package/dist/preview-server/routes/element-install-plan.js

@@ -74,6 +74,11 @@ const getExpectedFileState = (existingSource) => {
 const getElementInstallPlan = async ({ destination, element, installationName, entryPoint, remotionRoot, }) => {
     var _a;
     (0, exports.validateElementForInstallation)(element);
+    if (destination.type === 'selected-media' &&
+        (element.isCaptionStyle !== true ||
+            element.installationMode !== 'component-owned-sequence')) {
+        throw new Error('The Element must be a component-owned caption style');
+    }
     const componentName = studio_protocol_1.StudioProtocolInternals.getElementComponentNameFromSourceCode(element.sourceCode);
     if (componentName === null) {
         throw new Error('Element source must export exactly one named component');

package/dist/preview-server/routes/insert-basic-captions.js

@@ -45,6 +45,7 @@ const insertBasicCaptionsHandler = ({ input: { fileName, nodePath, captions, dur
             },
         });
         const { output, logLine, nodePathRemappings } = insertBasicCaptions({
+            element: null,
             input: fileContents,
             nodePath,
             captions,

package/dist/preview-server/routes/insert-element.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.insertElementHandler = void 0;
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importDefault(require("node:path"));
+const codemods_1 = require("@remotion/codemods");
 const renderer_1 = require("@remotion/renderer");
 const studio_protocol_1 = require("@remotion/studio-protocol");
 const add_composition_to_file_1 = require("../../codemods/add-composition-to-file");
@@ -33,10 +34,18 @@ const hasExpectedFileState = ({ expected, actual, }) => {
     }
     return actual.sourceHash === expected.sourceHash;
 };
-const insertElementHandler = async ({ input: { compositionFile, compositionId, element, installationName, expectedFileState, from, premountFor, position, overwriteExisting, undoRedoNavigation, newComposition, }, entryPoint, remotionRoot, logLevel, publicDir, }) => {
+const insertElementHandler = async ({ input: { compositionFile, compositionId, captionTarget, element, installationName, expectedFileState, from, premountFor, position, overwriteExisting, undoRedoNavigation, newComposition, }, entryPoint, remotionRoot, logLevel, publicDir, }) => {
     var _a;
     let resolvedAssets;
     try {
+        if (captionTarget !== null &&
+            (element.isCaptionStyle !== true ||
+                element.installationMode !== 'component-owned-sequence' ||
+                newComposition !== null ||
+                compositionFile !== null ||
+                compositionId !== null)) {
+            throw new Error('Invalid caption style installation target');
+        }
         studio_protocol_1.StudioProtocolInternals.assertElementAssets(element.assets);
         studio_protocol_1.StudioProtocolInternals.assertElementAssetReferences(element);
         resolvedAssets = await studio_protocol_1.StudioProtocolInternals.resolveElementAssets({
@@ -54,7 +63,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
     }
     return (0, source_file_write_queue_1.withSourceFileWriteQueue)(async () => {
         var _a, _b, _c, _d, _e, _f;
-        var _g, _h, _j, _k;
+        var _g, _h, _j;
         const createdAssets = [];
         const changedSources = [];
         let undoEntryPushed = false;
@@ -132,16 +141,21 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                     [componentFilePath, componentFileContents],
                 ]);
             }
-            const installDestination = newComposition === null
+            const installDestination = captionTarget !== null
                 ? {
-                    type: 'current-composition',
-                    compositionFile,
-                    compositionId,
+                    type: 'selected-media',
+                    compositionFile: captionTarget.fileName,
                 }
-                : {
-                    type: 'new-composition',
-                    compositionFile,
-                };
+                : newComposition === null
+                    ? {
+                        type: 'current-composition',
+                        compositionFile,
+                        compositionId,
+                    }
+                    : {
+                        type: 'new-composition',
+                        compositionFile,
+                    };
             const plan = await (0, element_install_plan_1.getElementInstallPlan)({
                 installationName,
                 destination: installDestination,
@@ -187,6 +201,13 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                 throw new Error('Element source file conflicts with the new composition file');
             }
             const shouldWriteElementFile = !plan.elementFileExists || elementSourcesDiffer;
+            const initialProps = { ...element.initialProps };
+            if (componentOwnsSequence && element.dimensions !== null) {
+                initialProps.style = {
+                    ...element.dimensions,
+                    ...(typeof initialProps.style === 'object' ? initialProps.style : {}),
+                };
+            }
             const insertionInput = {
                 remotionRoot,
                 compositionFile,
@@ -197,7 +218,10 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                     importName: plan.componentName,
                     importPath: plan.importPath,
                     props: [
-                        ...Object.entries((_h = element.initialProps) !== null && _h !== void 0 ? _h : {}).map(([name, value]) => ({ name, value })),
+                        ...Object.entries(initialProps).map(([name, value]) => ({
+                            name,
+                            value,
+                        })),
                         ...(componentOwnsSequence && element.durationInFrames !== null
                             ? [
                                 {
@@ -225,10 +249,29 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                         position,
                     },
             };
-            const inserted = await (0, resolve_composition_component_1.insertJsxElementIntoComposition)({
-                ...insertionInput,
-                sourceFileOverrides,
-            });
+            let inserted;
+            if (captionTarget === null) {
+                inserted = await (0, resolve_composition_component_1.insertJsxElementIntoComposition)({
+                    ...insertionInput,
+                    compositionFile,
+                    compositionId,
+                    sourceFileOverrides,
+                });
+            }
+            else {
+                const fileName = plan.safePaths.compositionFileName;
+                const oldContents = (0, node_fs_1.readFileSync)(fileName, 'utf-8');
+                inserted = {
+                    ...codemods_1.CodemodsInternals.insertBasicCaptions({
+                        ...captionTarget,
+                        input: oldContents,
+                        importPath: plan.importPath,
+                        element: { componentName: plan.componentName, initialProps },
+                    }),
+                    fileName,
+                    oldContents,
+                };
+            }
             if (compositionCreation !== null &&
                 inserted.fileName !== compositionCreation.componentFilePath) {
                 throw new Error('New composition component does not match installation target');
@@ -289,7 +332,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                     try {
                         (0, node_fs_1.unlinkSync)(asset.absolutePath);
                     }
-                    catch (_l) {
+                    catch (_k) {
                         // Keep the original write error.
                     }
                     throw error;
@@ -328,7 +371,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                                 filePath: compositionCreation.registrationFilePath,
                                 oldContents: compositionCreation.registrationFileOldContents,
                                 newContents: compositionCreation.registrationFileNewContents,
-                                logLine: (_j = (_e = newComposition === null || newComposition === void 0 ? void 0 : newComposition.symbolicatedStack) === null || _e === void 0 ? void 0 : _e.originalLineNumber) !== null && _j !== void 0 ? _j : 1,
+                                logLine: (_h = (_e = newComposition === null || newComposition === void 0 ? void 0 : newComposition.symbolicatedStack) === null || _e === void 0 ? void 0 : _e.originalLineNumber) !== null && _h !== void 0 ? _h : 1,
                                 nodePathRemappings: null,
                             },
                         ]),
@@ -397,7 +440,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                 renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, `${(0, source_file_write_queue_1.getCodemodTimingPrefix)(logLevel)}${renderer_1.RenderInternals.chalk.blueBright((0, format_log_file_location_1.formatLogFileLocation)({
                     remotionRoot,
                     absolutePath: compositionCreation.registrationFilePath,
-                    line: (_k = (_f = newComposition.symbolicatedStack) === null || _f === void 0 ? void 0 : _f.originalLineNumber) !== null && _k !== void 0 ? _k : 1,
+                    line: (_j = (_f = newComposition.symbolicatedStack) === null || _f === void 0 ? void 0 : _f.originalLineNumber) !== null && _j !== void 0 ? _j : 1,
                 }))} Created composition "${compositionId}"`);
             }
             const compositionLocationLabel = (0, format_log_file_location_1.formatLogFileLocation)({
@@ -441,7 +484,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                         });
                     }
                 }
-                catch (_m) {
+                catch (_l) {
                     // Preserve subsequent user changes and the original installation error.
                 }
             }
@@ -451,7 +494,7 @@ const insertElementHandler = async ({ input: { compositionFile, compositionId, e
                         (0, node_fs_1.unlinkSync)(asset.absolutePath);
                     }
                 }
-                catch (_o) {
+                catch (_m) {
                     // Preserve subsequent user changes and the original installation error.
                 }
             }

package/dist/preview-server/routes/install-remotion-skill.d.ts

@@ -1,4 +1,5 @@
-import type { GetRemotionSkillsInfoResponse, InstallRemotionSkillRequest, RemoveRemotionSkillRequest } from '@remotion/studio-shared';
+import type { GetRemotionSkillsInfoResponse, InstallRemotionSkillRequest, RemoveRemotionSkillRequest, UpgradeRemotionSkillRequest } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
 export declare const installRemotionSkillHandler: ApiHandler<InstallRemotionSkillRequest, GetRemotionSkillsInfoResponse>;
 export declare const removeRemotionSkillHandler: ApiHandler<RemoveRemotionSkillRequest, GetRemotionSkillsInfoResponse>;
+export declare const upgradeRemotionSkillHandler: ApiHandler<UpgradeRemotionSkillRequest, GetRemotionSkillsInfoResponse>;

package/dist/preview-server/routes/install-remotion-skill.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.removeRemotionSkillHandler = exports.installRemotionSkillHandler = void 0;
+exports.upgradeRemotionSkillHandler = exports.removeRemotionSkillHandler = exports.installRemotionSkillHandler = void 0;
 const node_child_process_1 = require("node:child_process");
 const renderer_1 = require("@remotion/renderer");
 const package_manager_spawn_options_1 = require("../../helpers/package-manager-spawn-options");
@@ -13,19 +13,28 @@ const changeRemotionSkill = async ({ action, remotionRoot, input: { skill }, log
         throw new Error(`Unknown Remotion skill: ${JSON.stringify(skill)}`);
     }
     if (changingSkillsInProjects.has(remotionRoot)) {
-        throw new Error('A skill is already being installed or removed. Please try again once it finishes.');
+        throw new Error('A skill is already being installed, upgraded, or removed. Please try again once it finishes.');
     }
     changingSkillsInProjects.add(remotionRoot);
     try {
-        const installedSkill = (0, remotion_skills_info_1.getRemotionSkillsInfo)({ remotionRoot }).skills.find(({ name }) => name === skill);
+        const currentInfo = (0, remotion_skills_info_1.getRemotionSkillsInfo)({ remotionRoot });
+        const installedSkill = currentInfo.skills.find(({ name }) => name === skill);
         const removingGlobally = action === 'remove' &&
             (installedSkill === null || installedSkill === void 0 ? void 0 : installedSkill.installedInProject) === false &&
             installedSkill.installedGlobally;
-        if (action === 'remove' &&
-            !removingGlobally &&
-            !(installedSkill === null || installedSkill === void 0 ? void 0 : installedSkill.installedInProject)) {
+        if (action !== 'install' &&
+            !(installedSkill === null || installedSkill === void 0 ? void 0 : installedSkill.installedInProject) &&
+            !(installedSkill === null || installedSkill === void 0 ? void 0 : installedSkill.installedGlobally)) {
             throw new Error(`${skill} is not installed.`);
         }
+        const scopes = action === 'upgrade'
+            ? currentInfo.installations
+                .filter((installation) => installation.name === skill && installation.outdated)
+                .map(({ scope }) => scope)
+            : [removingGlobally ? 'global' : 'project'];
+        if (scopes.length === 0) {
+            throw new Error(`${skill} is already up to date.`);
+        }
         const packageManager = (0, get_package_manager_1.getPackageManager)({
             remotionRoot,
             packageManager: undefined,
@@ -38,61 +47,79 @@ const changeRemotionSkill = async ({ action, remotionRoot, input: { skill }, log
             : process.platform === 'win32'
                 ? 'npx.cmd'
                 : 'npx';
-        const commandArgs = action === 'install'
-            ? ['add', `remotion-dev/skills@${skill}`, '--yes']
-            : ['remove', ...(removingGlobally ? ['--global'] : []), skill, '--yes'];
-        const args = useBunx
-            ? ['--silent', 'skills@1.7.0', ...commandArgs]
-            : ['--yes', '--loglevel=error', 'skills@1.7.0', ...commandArgs];
-        renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray(`╭─  ${executable} ${args.join(' ')}`));
-        const time = Date.now();
-        try {
-            await new Promise((resolve, reject) => {
-                const child = (0, node_child_process_1.spawn)(executable, args, {
-                    cwd: remotionRoot,
-                    env: { ...process.env, DISABLE_TELEMETRY: '1' },
-                    stdio: ['ignore', 'pipe', 'pipe'],
-                    ...(0, package_manager_spawn_options_1.getPackageManagerSpawnOptions)(),
+        for (const scope of scopes) {
+            const commandArgs = action === 'remove'
+                ? [
+                    'remove',
+                    ...(scope === 'global' ? ['--global'] : []),
+                    skill,
+                    '--yes',
+                ]
+                : [
+                    'add',
+                    `remotion-dev/skills@${skill}`,
+                    ...(scope === 'global' ? ['--global'] : []),
+                    '--yes',
+                ];
+            const args = useBunx
+                ? ['--silent', 'skills@1.7.0', ...commandArgs]
+                : ['--yes', '--loglevel=error', 'skills@1.7.0', ...commandArgs];
+            renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray(`╭─  ${executable} ${args.join(' ')}`));
+            const time = Date.now();
+            try {
+                await new Promise((resolve, reject) => {
+                    const child = (0, node_child_process_1.spawn)(executable, args, {
+                        cwd: remotionRoot,
+                        env: { ...process.env, DISABLE_TELEMETRY: '1' },
+                        stdio: ['ignore', 'pipe', 'pipe'],
+                        ...(0, package_manager_spawn_options_1.getPackageManagerSpawnOptions)(),
+                    });
+                    let output = '';
+                    const onData = (data) => {
+                        output = (output + data.toString()).slice(-8000);
+                        data
+                            .toString()
+                            .trim()
+                            .split('\n')
+                            .forEach((line) => renderer_1.RenderInternals.Log.info({ indent: true, logLevel }, line));
+                    };
+                    child.stdout.on('data', onData);
+                    child.stderr.on('data', onData);
+                    child.on('error', reject);
+                    child.on('close', (code, signal) => {
+                        if (code === 0) {
+                            resolve();
+                        }
+                        else {
+                            reject(new Error(`Could not ${action} ${skill} (exit code ${code}, signal ${signal}). ${output.trim()}`));
+                        }
+                    });
                 });
-                let output = '';
-                const onData = (data) => {
-                    output = (output + data.toString()).slice(-8000);
-                    data
-                        .toString()
-                        .trim()
-                        .split('\n')
-                        .forEach((line) => renderer_1.RenderInternals.Log.info({ indent: true, logLevel }, line));
-                };
-                child.stdout.on('data', onData);
-                child.stderr.on('data', onData);
-                child.on('error', reject);
-                child.on('close', (code, signal) => {
-                    if (code === 0) {
-                        resolve();
-                    }
-                    else {
-                        reject(new Error(`Could not ${action} ${skill} (exit code ${code}, signal ${signal}). ${output.trim()}`));
+                const info = (0, remotion_skills_info_1.getRemotionSkillsInfo)({ remotionRoot });
+                const updatedSkill = info.skills.find(({ name }) => name === skill);
+                if (action === 'install' && !(updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedInProject)) {
+                    throw new Error(`The installer finished, but ${skill} was not found in the project. Please try again.`);
+                }
+                if (action === 'upgrade') {
+                    const upgradedInstallation = info.installations.find((installation) => installation.name === skill && installation.scope === scope);
+                    if (!upgradedInstallation || upgradedInstallation.outdated) {
+                        throw new Error(`The installer finished, but ${skill} ${scope === 'global' ? 'globally' : 'in the project'} is still out of date. Please try again.`);
                     }
-                });
-            });
-            const info = (0, remotion_skills_info_1.getRemotionSkillsInfo)({ remotionRoot });
-            const updatedSkill = info.skills.find(({ name }) => name === skill);
-            if (action === 'install' && !(updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedInProject)) {
-                throw new Error(`The installer finished, but ${skill} was not found in the project. Please try again.`);
+                }
+                if (action === 'remove' &&
+                    (removingGlobally
+                        ? updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedGlobally
+                        : updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedInProject)) {
+                    throw new Error(`The remover finished, but ${skill} is still installed ${removingGlobally ? 'globally' : 'in the project'}. Please try again.`);
+                }
+                renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray('╰─ '), `Done in ${Date.now() - time}ms`);
             }
-            if (action === 'remove' &&
-                (removingGlobally
-                    ? updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedGlobally
-                    : updatedSkill === null || updatedSkill === void 0 ? void 0 : updatedSkill.installedInProject)) {
-                throw new Error(`The remover finished, but ${skill} is still installed ${removingGlobally ? 'globally' : 'in the project'}. Please try again.`);
+            catch (error) {
+                renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray('╰─ '), renderer_1.RenderInternals.chalk.red(`Errored in ${Date.now() - time}ms`));
+                throw error;
             }
-            renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray('╰─ '), `Done in ${Date.now() - time}ms`);
-            return info;
-        }
-        catch (error) {
-            renderer_1.RenderInternals.Log.info({ indent: false, logLevel }, renderer_1.RenderInternals.chalk.gray('╰─ '), renderer_1.RenderInternals.chalk.red(`Errored in ${Date.now() - time}ms`));
-            throw error;
         }
+        return (0, remotion_skills_info_1.getRemotionSkillsInfo)({ remotionRoot });
     }
     finally {
         changingSkillsInProjects.delete(remotionRoot);
@@ -106,3 +133,7 @@ const removeRemotionSkillHandler = (input) => {
     return changeRemotionSkill({ ...input, action: 'remove' });
 };
 exports.removeRemotionSkillHandler = removeRemotionSkillHandler;
+const upgradeRemotionSkillHandler = (input) => {
+    return changeRemotionSkill({ ...input, action: 'upgrade' });
+};
+exports.upgradeRemotionSkillHandler = upgradeRemotionSkillHandler;

package/dist/preview-server/routes/open-in-editor.d.ts

@@ -1,4 +1,4 @@
-import { type DefaultEditor } from '@remotion/renderer';
+import type { DefaultEditor } from '@remotion/renderer';
 import type { OpenInEditorRequest, OpenInEditorResponse } from '@remotion/studio-shared';
 import type { ApiHandler } from '../api-types';
 export declare const getEditorName: ({ getDefaultEditor, logLevel, }: {