@remotion/studio-server 4.0.501 → 4.0.502

package/dist/helpers/resolve-composition-component.js

@@ -248,9 +248,6 @@ const findReExportTargets = ({ ast, exportName, }) => {
         visitExportNamedDeclaration(astPath) {
             var _a;
             const node = astPath.node;
-            if (typeof ((_a = node.source) === null || _a === void 0 ? void 0 : _a.value) !== 'string') {
-                return false;
-            }
             for (const specifier of node.specifiers) {
                 if (specifier.type !== 'ExportSpecifier') {
                     continue;
@@ -263,6 +260,18 @@ const findReExportTargets = ({ ast, exportName, }) => {
                 if (!localName) {
                     continue;
                 }
+                // Support barrel files that import a component and export it in a
+                // separate declaration. See https://github.com/remotion-dev/remotion/issues/9172.
+                if (typeof ((_a = node.source) === null || _a === void 0 ? void 0 : _a.value) !== 'string') {
+                    const importTarget = findImportTarget({
+                        ast,
+                        componentName: localName,
+                    });
+                    if (importTarget) {
+                        targets.push(importTarget);
+                    }
+                    continue;
+                }
                 targets.push({
                     importPath: node.source.value,
                     exportName: localName === 'default' ? 'default' : localName,
@@ -314,6 +323,9 @@ const locationFromNode = (node) => {
 };
 const findLocalSymbolLocation = ({ ast, name, }) => {
     let location = null;
+    // Recast can omit the declaration location for exported functions and
+    // classes, including components resolved through barrel files. The identifier
+    // keeps its location. See https://github.com/remotion-dev/remotion/issues/9172.
     recast.types.visit(ast, {
         visitVariableDeclarator(astPath) {
             if (location) {
@@ -321,7 +333,7 @@ const findLocalSymbolLocation = ({ ast, name, }) => {
             }
             const { node } = astPath;
             if (node.id.type === 'Identifier' && node.id.name === name) {
-                location = locationFromNode(node);
+                location = locationFromNode(node.id);
                 return false;
             }
             this.traverse(astPath);
@@ -334,7 +346,7 @@ const findLocalSymbolLocation = ({ ast, name, }) => {
             }
             const { node } = astPath;
             if (((_a = node.id) === null || _a === void 0 ? void 0 : _a.name) === name) {
-                location = locationFromNode(node);
+                location = locationFromNode(node.id);
                 return false;
             }
             this.traverse(astPath);
@@ -347,7 +359,7 @@ const findLocalSymbolLocation = ({ ast, name, }) => {
             }
             const { node } = astPath;
             if (((_a = node.id) === null || _a === void 0 ? void 0 : _a.name) === name) {
-                location = locationFromNode(node);
+                location = locationFromNode(node.id);
                 return false;
             }
             this.traverse(astPath);

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

@@ -1,4 +1,5 @@
 export declare const ELEMENT_INSTALL_TARGET_MAX_AGE = 5000;
+export declare const STUDIO_PROTOCOL_TARGET_MAX_AGE = 4000;
 export type ElementInstallTarget = {
     requestId: string | null;
     clientId: string;
@@ -10,6 +11,21 @@ export type ElementInstallTarget = {
     studioUrl: string;
     updatedAt: number;
 };
+type StudioProtocolTarget = {
+    readonly id: string;
+    readonly target: ElementInstallTarget;
+    readonly expiresAt: number;
+};
 export declare const updateElementInstallTarget: (newTarget: Omit<ElementInstallTarget, "updatedAt">) => void;
+export declare const getElementInstallTargetByClientId: (clientId: string) => ElementInstallTarget | null;
 export declare const getElementInstallTarget: (requestId: string | null) => ElementInstallTarget | null;
+export declare const issueStudioProtocolTarget: ({ now, target, }: {
+    readonly now: number;
+    readonly target: ElementInstallTarget;
+}) => StudioProtocolTarget;
+export declare const consumeStudioProtocolTarget: ({ now, targetId, }: {
+    readonly now: number;
+    readonly targetId: string;
+}) => ElementInstallTarget | null;
 export declare const clearElementInstallStateForTests: () => void;
+export {};

package/dist/preview-server/element-install-state.js

@@ -1,8 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.clearElementInstallStateForTests = exports.getElementInstallTarget = exports.updateElementInstallTarget = exports.ELEMENT_INSTALL_TARGET_MAX_AGE = void 0;
+exports.clearElementInstallStateForTests = exports.consumeStudioProtocolTarget = exports.issueStudioProtocolTarget = exports.getElementInstallTarget = exports.getElementInstallTargetByClientId = exports.updateElementInstallTarget = exports.STUDIO_PROTOCOL_TARGET_MAX_AGE = exports.ELEMENT_INSTALL_TARGET_MAX_AGE = void 0;
+const node_crypto_1 = require("node:crypto");
 exports.ELEMENT_INSTALL_TARGET_MAX_AGE = 5000;
+exports.STUDIO_PROTOCOL_TARGET_MAX_AGE = 4000;
 const targetsByClientId = new Map();
+const studioProtocolTargets = new Map();
 const compareTargets = (a, b) => {
     var _a, _b;
     const aFocusedAt = (_a = a.lastFocusedAt) !== null && _a !== void 0 ? _a : 0;
@@ -19,6 +22,11 @@ const updateElementInstallTarget = (newTarget) => {
     });
 };
 exports.updateElementInstallTarget = updateElementInstallTarget;
+const getElementInstallTargetByClientId = (clientId) => {
+    var _a;
+    return (_a = targetsByClientId.get(clientId)) !== null && _a !== void 0 ? _a : null;
+};
+exports.getElementInstallTargetByClientId = getElementInstallTargetByClientId;
 const getElementInstallTarget = (requestId) => {
     const now = Date.now();
     let bestTarget = null;
@@ -37,7 +45,41 @@ const getElementInstallTarget = (requestId) => {
     return bestTarget;
 };
 exports.getElementInstallTarget = getElementInstallTarget;
+const issueStudioProtocolTarget = ({ now, target, }) => {
+    for (const [id, existing] of studioProtocolTargets) {
+        if (existing.expiresAt <= now) {
+            studioProtocolTargets.delete(id);
+        }
+    }
+    const issued = {
+        id: (0, node_crypto_1.randomUUID)(),
+        target: { ...target },
+        expiresAt: now + exports.STUDIO_PROTOCOL_TARGET_MAX_AGE,
+    };
+    studioProtocolTargets.set(issued.id, issued);
+    return issued;
+};
+exports.issueStudioProtocolTarget = issueStudioProtocolTarget;
+const consumeStudioProtocolTarget = ({ now, targetId, }) => {
+    const issued = studioProtocolTargets.get(targetId);
+    studioProtocolTargets.delete(targetId);
+    if (issued === undefined || issued.expiresAt <= now) {
+        return null;
+    }
+    const current = (0, exports.getElementInstallTargetByClientId)(issued.target.clientId);
+    if (current === null ||
+        now - current.updatedAt >= exports.ELEMENT_INSTALL_TARGET_MAX_AGE ||
+        !current.canInstall ||
+        current.readOnly ||
+        current.compositionFile !== issued.target.compositionFile ||
+        current.compositionId !== issued.target.compositionId) {
+        return null;
+    }
+    return issued.target;
+};
+exports.consumeStudioProtocolTarget = consumeStudioProtocolTarget;
 const clearElementInstallStateForTests = () => {
     targetsByClientId.clear();
+    studioProtocolTargets.clear();
 };
 exports.clearElementInstallStateForTests = clearElementInstallStateForTests;

package/dist/preview-server/handler.js

@@ -13,7 +13,7 @@ const handleRequest = async ({ remotionRoot, request, response, entryPoint, hand
     response.setHeader('content-type', 'application/json');
     response.writeHead(200);
     try {
-        const body = (await (0, parse_body_1.parseRequestBody)(request));
+        const body = (await (0, parse_body_1.parseRequestBody)(request, { maxBytes: null }));
         const outputData = await handler({
             entryPoint,
             remotionRoot,

package/dist/preview-server/parse-body.d.ts

@@ -1,2 +1,7 @@
 import type { IncomingMessage } from 'node:http';
-export declare const parseRequestBody: (req: IncomingMessage) => Promise<unknown>;
+export declare class RequestBodyTooLargeError extends Error {
+    constructor(maxBytes: number);
+}
+export declare const parseRequestBody: (req: IncomingMessage, { maxBytes, }: {
+    readonly maxBytes: number | null;
+}) => Promise<unknown>;

package/dist/preview-server/parse-body.js

@@ -1,15 +1,66 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseRequestBody = void 0;
-const parseRequestBody = async (req) => {
-    const body = await new Promise((_resolve) => {
+exports.parseRequestBody = exports.RequestBodyTooLargeError = void 0;
+class RequestBodyTooLargeError extends Error {
+    constructor(maxBytes) {
+        super(`Request body exceeds the limit of ${maxBytes} bytes`);
+        this.name = 'RequestBodyTooLargeError';
+    }
+}
+exports.RequestBodyTooLargeError = RequestBodyTooLargeError;
+const parseRequestBody = async (req, { maxBytes, }) => {
+    const body = await new Promise((resolve, reject) => {
+        const decoder = new TextDecoder();
+        const encoder = new TextEncoder();
         let data = '';
-        req.on('data', (chunk) => {
-            data += chunk;
-        });
-        req.on('end', () => {
-            _resolve(data.toString());
-        });
+        let receivedBytes = 0;
+        let settled = false;
+        const cleanup = () => {
+            req.off('aborted', onAborted);
+            req.off('data', onData);
+            req.off('end', onEnd);
+            req.off('error', onError);
+        };
+        const rejectOnce = (error) => {
+            if (settled) {
+                return;
+            }
+            settled = true;
+            cleanup();
+            reject(error);
+        };
+        const onAborted = () => rejectOnce(new Error('Request body was aborted'));
+        const onData = (chunk) => {
+            receivedBytes +=
+                typeof chunk === 'string'
+                    ? encoder.encode(chunk).byteLength
+                    : chunk.byteLength;
+            if (maxBytes !== null && receivedBytes > maxBytes) {
+                rejectOnce(new RequestBodyTooLargeError(maxBytes));
+                // Discard the rest without buffering it. Keep request stream errors from
+                // becoming unhandled after the parser listeners have been removed.
+                req.on('error', () => undefined);
+                req.resume();
+                return;
+            }
+            data +=
+                typeof chunk === 'string'
+                    ? decoder.decode() + chunk
+                    : decoder.decode(chunk, { stream: true });
+        };
+        const onEnd = () => {
+            if (settled) {
+                return;
+            }
+            settled = true;
+            cleanup();
+            resolve(data + decoder.decode());
+        };
+        const onError = (error) => rejectOnce(error);
+        req.on('aborted', onAborted);
+        req.on('data', onData);
+        req.on('end', onEnd);
+        req.on('error', onError);
     });
     return JSON.parse(body);
 };

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

@@ -1,6 +1,6 @@
 import type { CanUpdateDefaultPropsResponse } from '@remotion/studio-shared';
+export { computeCanUpdateDefaultPropsFromContent } from '@remotion/studio-codemods';
 export declare const checkIfTypeScriptFile: (file: string) => void;
-export declare const computeCanUpdateDefaultPropsFromContent: (content: string, compositionId: string) => CanUpdateDefaultPropsResponse;
 export declare const computeCanUpdateDefaultProps: ({ compositionId, remotionRoot, entryPoint, }: {
     compositionId: string;
     remotionRoot: string;

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

@@ -1,44 +1,11 @@
 "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.computeCanUpdateDefaultProps = exports.computeCanUpdateDefaultPropsFromContent = exports.checkIfTypeScriptFile = void 0;
+exports.computeCanUpdateDefaultProps = exports.checkIfTypeScriptFile = exports.computeCanUpdateDefaultPropsFromContent = void 0;
 const node_fs_1 = require("node:fs");
-const recast = __importStar(require("recast"));
-const parse_ast_1 = require("../../codemods/parse-ast");
+const studio_codemods_1 = require("@remotion/studio-codemods");
 const project_info_1 = require("../project-info");
-const can_update_sequence_props_1 = require("./can-update-sequence-props");
+const studio_codemods_2 = require("@remotion/studio-codemods");
+Object.defineProperty(exports, "computeCanUpdateDefaultPropsFromContent", { enumerable: true, get: function () { return studio_codemods_2.computeCanUpdateDefaultPropsFromContent; } });
 const checkIfTypeScriptFile = (file) => {
     if (!file.endsWith('.tsx') &&
         !file.endsWith('.ts') &&
@@ -48,100 +15,6 @@ const checkIfTypeScriptFile = (file) => {
     }
 };
 exports.checkIfTypeScriptFile = checkIfTypeScriptFile;
-const extractDefaultPropsFromSource = (input, compositionId) => {
-    const ast = (0, parse_ast_1.parseAst)(input);
-    let result = null;
-    recast.types.visit(ast, {
-        visitJSXElement(path) {
-            var _a;
-            const { openingElement } = path.node;
-            const openingName = openingElement.name;
-            if (openingName.type !== 'JSXIdentifier' &&
-                openingName.type !== 'JSXNamespacedName') {
-                this.traverse(path);
-                return;
-            }
-            if (openingName.name !== 'Composition' && openingName.name !== 'Still') {
-                this.traverse(path);
-                return;
-            }
-            if (!((_a = openingElement.attributes) === null || _a === void 0 ? void 0 : _a.some((attr) => {
-                if (attr.type === 'JSXSpreadAttribute') {
-                    return;
-                }
-                if (!attr.value) {
-                    return;
-                }
-                if (attr.value.type === 'JSXElement') {
-                    return;
-                }
-                if (attr.value.type === 'JSXExpressionContainer') {
-                    return;
-                }
-                if (attr.value.type === 'JSXFragment') {
-                    return;
-                }
-                return attr.name.name === 'id' && attr.value.value === compositionId;
-            }))) {
-                this.traverse(path);
-                return;
-            }
-            const defaultPropsAttr = openingElement.attributes.find((attr) => {
-                if (attr.type === 'JSXSpreadAttribute') {
-                    return;
-                }
-                return attr.name.name === 'defaultProps';
-            });
-            if (!defaultPropsAttr || defaultPropsAttr.type === 'JSXSpreadAttribute') {
-                this.traverse(path);
-                return;
-            }
-            if (!defaultPropsAttr.value ||
-                defaultPropsAttr.value.type !== 'JSXExpressionContainer') {
-                this.traverse(path);
-                return;
-            }
-            const { expression } = defaultPropsAttr.value;
-            if (expression.type === 'JSXEmptyExpression') {
-                this.traverse(path);
-                return;
-            }
-            if ((0, can_update_sequence_props_1.isStaticValue)(expression, {
-                allowSpecialValues: true,
-            })) {
-                const value = (0, can_update_sequence_props_1.extractStaticValue)(expression, {
-                    allowSpecialValues: true,
-                });
-                if (value !== null &&
-                    typeof value === 'object' &&
-                    !Array.isArray(value)) {
-                    result = value;
-                }
-            }
-            this.traverse(path);
-        },
-    });
-    return result;
-};
-const computeCanUpdateDefaultPropsFromContent = (content, compositionId) => {
-    try {
-        const currentDefaultProps = extractDefaultPropsFromSource(content, compositionId);
-        if (currentDefaultProps === null) {
-            throw new Error(`Could not find or extract defaultProps for composition "${compositionId}"`);
-        }
-        return {
-            canUpdate: true,
-            currentDefaultProps,
-        };
-    }
-    catch (err) {
-        return {
-            canUpdate: false,
-            reason: err.message,
-        };
-    }
-};
-exports.computeCanUpdateDefaultPropsFromContent = computeCanUpdateDefaultPropsFromContent;
 const computeCanUpdateDefaultProps = async ({ compositionId, remotionRoot, entryPoint, }) => {
     try {
         const projectInfo = await (0, project_info_1.getProjectInfo)(remotionRoot, entryPoint);
@@ -150,7 +23,7 @@ const computeCanUpdateDefaultProps = async ({ compositionId, remotionRoot, entry
         }
         (0, exports.checkIfTypeScriptFile)(projectInfo.rootFile);
         const input = (0, node_fs_1.readFileSync)(projectInfo.rootFile, 'utf-8');
-        const result = (0, exports.computeCanUpdateDefaultPropsFromContent)(input, compositionId);
+        const result = (0, studio_codemods_1.computeCanUpdateDefaultPropsFromContent)(input, compositionId);
         return {
             result,
             rootFile: projectInfo.rootFile,

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

@@ -22,7 +22,7 @@ export declare const getStaticJsxChildrenAttribute: (jsxElement: JSXOpeningEleme
 export declare const hasJsxChildrenAttribute: (jsxElement: JSXOpeningElement) => boolean;
 export declare const getStaticJsxTextContent: (jsxElement: JSXElement) => StaticJsxTextContent | null;
 export declare const findNodePathForJsxElement: (ast: File, target: JSXOpeningElement) => SequenceNodePath | null;
-export declare const lineColumnToNodePath: (ast: File, targetLine: number) => SequenceNodePath | null;
+export declare const lineColumnToNodePath: (ast: File, targetLine: number, targetColumn?: number | undefined, fileContents?: string | undefined) => SequenceNodePath | null;
 export declare const computeSequencePropsStatusFromContent: ({ fileContents, nodePath, componentIdentity, keys, assetKeys, effects, videoConfigValues, }: {
     fileContents: string;
     nodePath: SequenceNodePath;
@@ -42,9 +42,10 @@ export declare const computeSequencePropsStatus: ({ fileName, nodePath, componen
     remotionRoot: string;
     videoConfigValues: VideoConfigValues | null;
 }) => CanUpdateSequencePropsResponseTrue;
-export declare const computeSequencePropsStatusFromFilenameByLine: ({ fileName, line, componentIdentity, keys, assetKeys, effects, remotionRoot, logLevel, videoConfigValues, }: {
+export declare const computeSequencePropsStatusFromFilenameByLocation: ({ fileName, line, column, componentIdentity, keys, assetKeys, effects, remotionRoot, logLevel, videoConfigValues, }: {
     fileName: string;
     line: number;
+    column: number;
     componentIdentity: string | null;
     keys: string[];
     assetKeys?: string[] | undefined;

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

@@ -33,7 +33,7 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.computeSequencePropsStatusFromFilenameByLine = exports.computeSequencePropsStatus = exports.computeSequencePropsStatusFromContent = exports.lineColumnToNodePath = exports.findNodePathForJsxElement = exports.getStaticJsxTextContent = exports.hasJsxChildrenAttribute = exports.getStaticJsxChildrenAttribute = exports.findJsxElementNodeAtNodePath = exports.findJsxElementAtNodePath = exports.findJsxElementPathAtNodePath = exports.getComputedStatus = exports.extractStaticValue = exports.isStaticValue = void 0;
+exports.computeSequencePropsStatusFromFilenameByLocation = exports.computeSequencePropsStatus = exports.computeSequencePropsStatusFromContent = exports.lineColumnToNodePath = exports.findNodePathForJsxElement = exports.getStaticJsxTextContent = exports.hasJsxChildrenAttribute = exports.getStaticJsxChildrenAttribute = exports.findJsxElementNodeAtNodePath = exports.findJsxElementAtNodePath = exports.findJsxElementPathAtNodePath = exports.getComputedStatus = exports.extractStaticValue = exports.isStaticValue = void 0;
 const node_fs_1 = require("node:fs");
 const renderer_1 = require("@remotion/renderer");
 const studio_shared_1 = require("@remotion/studio-shared");
@@ -642,19 +642,51 @@ const findNodePathForJsxElement = (ast, target) => {
     return foundPath;
 };
 exports.findNodePathForJsxElement = findNodePathForJsxElement;
-const lineColumnToNodePath = (ast, targetLine) => {
-    let foundPath = null;
+const RECAST_TAB_WIDTH = 4;
+const sourceColumnToRecastColumn = ({ fileContents, line, column, }) => {
+    const sourceLine = fileContents.split('\n')[line - 1];
+    if (sourceLine === undefined) {
+        return column;
+    }
+    let recastColumn = 0;
+    for (let index = 0; index < column; index++) {
+        if (sourceLine[index] === '\t') {
+            recastColumn += RECAST_TAB_WIDTH - (recastColumn % RECAST_TAB_WIDTH);
+        }
+        else {
+            recastColumn++;
+        }
+    }
+    return recastColumn;
+};
+const lineColumnToNodePath = (ast, targetLine, targetColumn, fileContents) => {
+    var _a;
+    const lineMatches = [];
+    const exactMatches = [];
+    const recastTargetColumn = targetColumn === undefined || fileContents === undefined
+        ? targetColumn
+        : sourceColumnToRecastColumn({
+            fileContents,
+            line: targetLine,
+            column: targetColumn,
+        });
     recast.types.visit(ast, {
         visitJSXOpeningElement(p) {
             const { node } = p;
             if (node.loc && node.loc.start.line === targetLine) {
-                foundPath = getNodePathForRecastPath(p, ast);
-                return false;
+                const nodePath = getNodePathForRecastPath(p, ast);
+                lineMatches.push(nodePath);
+                if (node.loc.start.column === recastTargetColumn) {
+                    exactMatches.push(nodePath);
+                }
             }
             return this.traverse(p);
         },
     });
-    return foundPath;
+    if (exactMatches.length === 1) {
+        return exactMatches[0];
+    }
+    return (_a = lineMatches.at(-1)) !== null && _a !== void 0 ? _a : null;
 };
 exports.lineColumnToNodePath = lineColumnToNodePath;
 const PIXEL_VALUE_REGEX = /^-?\d+(\.\d+)?px$/;
@@ -944,7 +976,7 @@ const computeSequencePropsStatus = ({ fileName, nodePath, componentIdentity, key
     });
 };
 exports.computeSequencePropsStatus = computeSequencePropsStatus;
-const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, componentIdentity, keys, assetKeys = [], effects, remotionRoot, logLevel, videoConfigValues, }) => {
+const computeSequencePropsStatusFromFilenameByLocation = ({ fileName, line, column, componentIdentity, keys, assetKeys = [], effects, remotionRoot, logLevel, videoConfigValues, }) => {
     try {
         const { absolutePath } = (0, resolve_file_inside_project_1.resolveFileInsideProject)({
             remotionRoot,
@@ -953,7 +985,7 @@ const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, componen
         });
         const fileContents = (0, node_fs_1.readFileSync)(absolutePath, 'utf-8');
         const ast = (0, parse_ast_1.parseAst)(fileContents);
-        const resolvedNodePath = (0, exports.lineColumnToNodePath)(ast, line);
+        const resolvedNodePath = (0, exports.lineColumnToNodePath)(ast, line, column, fileContents);
         if (!resolvedNodePath) {
             return {
                 status: {
@@ -985,6 +1017,16 @@ const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, componen
         };
     }
     catch (err) {
+        if (err instanceof jsx_component_identity_1.JsxElementIdentityMismatchError ||
+            err instanceof jsx_element_not_found_at_location_error_1.JsxElementNotFoundAtLocationError) {
+            return {
+                status: {
+                    canUpdate: false,
+                    reason: 'not-found',
+                },
+                success: false,
+            };
+        }
         renderer_1.RenderInternals.Log.error({ indent: false, logLevel }, err);
         return {
             status: {
@@ -995,4 +1037,4 @@ const computeSequencePropsStatusFromFilenameByLine = ({ fileName, line, componen
         };
     }
 };
-exports.computeSequencePropsStatusFromFilenameByLine = computeSequencePropsStatusFromFilenameByLine;
+exports.computeSequencePropsStatusFromFilenameByLocation = computeSequencePropsStatusFromFilenameByLocation;

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

@@ -6,8 +6,8 @@ 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 drag_and_drop_1 = require("@remotion/drag-and-drop");
 const renderer_1 = require("@remotion/renderer");
+const studio_protocol_1 = require("@remotion/studio-protocol");
 const file_watcher_1 = require("../../file-watcher");
 const resolve_composition_component_1 = require("../../helpers/resolve-composition-component");
 const format_log_file_location_1 = require("../format-log-file-location");
@@ -56,7 +56,7 @@ const validateDimensions = (dimensions) => {
     }
 };
 const validateElement = (element) => {
-    if (drag_and_drop_1.DragAndDropInternals.makeElementFileNameFromSlug(element.slug) === null) {
+    if (studio_protocol_1.StudioProtocolInternals.makeElementFileNameFromSlug(element.slug) === null) {
         throw new Error('Element slug must produce a safe lowercase .tsx file name');
     }
     if (typeof element.sourceCode !== 'string' ||
@@ -64,7 +64,7 @@ const validateElement = (element) => {
         element.sourceCode.length > 200000) {
         throw new Error('Unsupported Element source code');
     }
-    if (drag_and_drop_1.DragAndDropInternals.getElementComponentNameFromSourceCode(element.sourceCode) === null) {
+    if (studio_protocol_1.StudioProtocolInternals.getElementComponentNameFromSourceCode(element.sourceCode) === null) {
         throw new Error('Element source must export exactly one named component');
     }
     validateDimensions(element.dimensions);
@@ -77,7 +77,7 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
             (!Number.isInteger(from) || !Number.isFinite(from) || from < 0)) {
             throw new Error('from must be a non-negative integer');
         }
-        const componentName = drag_and_drop_1.DragAndDropInternals.getElementComponentNameFromSourceCode(element.sourceCode);
+        const componentName = studio_protocol_1.StudioProtocolInternals.getElementComponentNameFromSourceCode(element.sourceCode);
         if (componentName === null) {
             throw new Error('Element source must export exactly one named component');
         }
@@ -90,7 +90,7 @@ const insertElementHandler = ({ input: { compositionFile, compositionId, element
         if (!location.canAddSequence) {
             throw new Error('Cannot insert Element into this composition component');
         }
-        const derivedElementFileName = drag_and_drop_1.DragAndDropInternals.makeElementFileNameFromSlug(element.slug);
+        const derivedElementFileName = studio_protocol_1.StudioProtocolInternals.makeElementFileNameFromSlug(element.slug);
         if (derivedElementFileName === null) {
             throw new Error('Element slug must produce a safe lowercase .tsx file name');
         }

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

@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.insertJsxElementHandler = void 0;
 const node_path_1 = __importDefault(require("node:path"));
-const drag_and_drop_1 = require("@remotion/drag-and-drop");
 const renderer_1 = require("@remotion/renderer");
+const studio_protocol_1 = require("@remotion/studio-protocol");
 const studio_shared_1 = require("@remotion/studio-shared");
 const file_watcher_1 = require("../../file-watcher");
 const resolve_composition_component_1 = require("../../helpers/resolve-composition-component");
@@ -79,16 +79,16 @@ const validateElement = (element, remotionRoot) => {
         return;
     }
     if (element.type === 'component') {
-        if (!drag_and_drop_1.DragAndDropInternals.isComponentIdentifier(element.componentName)) {
+        if (!studio_protocol_1.StudioProtocolInternals.isComponentIdentifier(element.componentName)) {
             throw new Error('Unsupported component name');
         }
-        if (!drag_and_drop_1.DragAndDropInternals.isComponentIdentifier(element.importName)) {
+        if (!studio_protocol_1.StudioProtocolInternals.isComponentIdentifier(element.importName)) {
             throw new Error('Unsupported component import name');
         }
-        if (!drag_and_drop_1.DragAndDropInternals.isComponentImportPath(element.importPath)) {
+        if (!studio_protocol_1.StudioProtocolInternals.isComponentImportPath(element.importPath)) {
             throw new Error('Unsupported component import path');
         }
-        if (!drag_and_drop_1.DragAndDropInternals.areComponentProps(element.props)) {
+        if (!studio_protocol_1.StudioProtocolInternals.areComponentProps(element.props)) {
             throw new Error('Unsupported component props');
         }
         return;

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

@@ -85,9 +85,10 @@ const getSequencePropsStatus = ({ fileName, line, column, preferredNodePath, com
             };
         }
     }
-    const status = (0, can_update_sequence_props_1.computeSequencePropsStatusFromFilenameByLine)({
+    const status = (0, can_update_sequence_props_1.computeSequencePropsStatusFromFilenameByLocation)({
         fileName,
         line,
+        column,
         componentIdentity,
         keys,
         assetKeys,

package/dist/preview-server/studio-protocol/handle-discovery.d.ts

@@ -0,0 +1,11 @@
+import type { IncomingMessage, ServerResponse } from 'node:http';
+import type { GitSource } from '@remotion/studio-shared';
+import type { LiveEventsServer } from '../live-events';
+export declare const ELEMENT_INSTALL_TARGET_RESPONSE_WAIT = 250;
+export declare const handleStudioProtocolDiscovery: ({ gitSource, liveEventsServer, remotionRoot, request, response, }: {
+    readonly gitSource: GitSource | null;
+    readonly liveEventsServer: LiveEventsServer;
+    readonly remotionRoot: string;
+    readonly request: IncomingMessage;
+    readonly response: ServerResponse<IncomingMessage>;
+}) => Promise<void>;