@remotion/studio-shared 4.0.470 → 4.0.471

package/dist/api-requests.d.ts

@@ -188,6 +188,7 @@ export type SubscribeToSequencePropsRequest = {
     fileName: string;
     line: number;
     column: number;
+    nodePath: SequenceNodePath | null;
     keys: string[];
     effects: string[][];
     clientId: string;
@@ -245,15 +246,42 @@ export type SaveEffectPropsRequest = {
     clientId: string;
 };
 export type SaveEffectPropsResponse = CanUpdateEffectPropsResponse;
-export type DeleteSequenceKeyframeRequest = {
+export type AddEffectRequest = {
+    fileName: string;
+    sequenceNodePath: SequencePropsSubscriptionKey;
+    effectName: string;
+    effectImportPath: string;
+    effectConfig: Record<string, unknown>;
+    clientId: string;
+};
+export type AddEffectResponse = {
+    success: true;
+} | {
+    success: false;
+    reason: string;
+    stack: string;
+};
+export type ReorderEffectRequest = {
+    fileName: string;
+    sequenceNodePath: SequencePropsSubscriptionKey;
+    fromIndex: number;
+    toIndex: number;
+    clientId: string;
+};
+export type ReorderEffectResponse = {
+    success: true;
+} | {
+    success: false;
+    reason: string;
+    stack: string;
+};
+export type DeleteSequenceKeyframe = {
     fileName: string;
     nodePath: SequencePropsSubscriptionKey;
     key: string;
     frame: number;
     schema: SequenceSchema;
-    clientId: string;
 };
-export type DeleteSequenceKeyframeResponse = SaveSequencePropsResponse;
 export type AddSequenceKeyframeRequest = {
     fileName: string;
     nodePath: SequencePropsSubscriptionKey;
@@ -264,16 +292,22 @@ export type AddSequenceKeyframeRequest = {
     clientId: string;
 };
 export type AddSequenceKeyframeResponse = SaveSequencePropsResponse;
-export type DeleteEffectKeyframeRequest = {
+export type DeleteEffectKeyframe = {
     fileName: string;
     sequenceNodePath: SequencePropsSubscriptionKey;
     effectIndex: number;
     key: string;
     frame: number;
     schema: SequenceSchema;
+};
+export type DeleteKeyframesRequest = {
+    sequenceKeyframes: DeleteSequenceKeyframe[];
+    effectKeyframes: DeleteEffectKeyframe[];
     clientId: string;
 };
-export type DeleteEffectKeyframeResponse = SaveEffectPropsResponse;
+export type DeleteKeyframesResponse = {
+    success: true;
+};
 export type AddEffectKeyframeRequest = {
     fileName: string;
     sequenceNodePath: SequencePropsSubscriptionKey;
@@ -328,6 +362,23 @@ export type DuplicateJsxNodeResponse = {
     reason: string;
     stack: string;
 };
+export type InsertableCompositionElement = {
+    type: 'solid';
+    width: number;
+    height: number;
+};
+export type InsertJsxElementRequest = {
+    compositionFile: string;
+    compositionId: string;
+    element: InsertableCompositionElement;
+};
+export type InsertJsxElementResponse = {
+    success: true;
+} | {
+    success: false;
+    reason: string;
+    stack: string;
+};
 export type UpdateAvailableRequest = {};
 export type UpdateAvailableResponse = {
     currentVersion: string;
@@ -381,13 +432,15 @@ export type ApiRoutes = {
     '/api/unsubscribe-from-sequence-props': ReqAndRes<UnsubscribeFromSequencePropsRequest, undefined>;
     '/api/save-sequence-props': ReqAndRes<SaveSequencePropsRequest, SaveSequencePropsResponse>;
     '/api/save-effect-props': ReqAndRes<SaveEffectPropsRequest, SaveEffectPropsResponse>;
-    '/api/delete-sequence-keyframe': ReqAndRes<DeleteSequenceKeyframeRequest, DeleteSequenceKeyframeResponse>;
+    '/api/add-effect': ReqAndRes<AddEffectRequest, AddEffectResponse>;
+    '/api/reorder-effect': ReqAndRes<ReorderEffectRequest, ReorderEffectResponse>;
+    '/api/delete-keyframes': ReqAndRes<DeleteKeyframesRequest, DeleteKeyframesResponse>;
     '/api/add-sequence-keyframe': ReqAndRes<AddSequenceKeyframeRequest, AddSequenceKeyframeResponse>;
-    '/api/delete-effect-keyframe': ReqAndRes<DeleteEffectKeyframeRequest, DeleteEffectKeyframeResponse>;
     '/api/add-effect-keyframe': ReqAndRes<AddEffectKeyframeRequest, AddEffectKeyframeResponse>;
     '/api/delete-effect': ReqAndRes<DeleteEffectRequest, DeleteEffectResponse>;
     '/api/delete-jsx-node': ReqAndRes<DeleteJsxNodeRequest, DeleteJsxNodeResponse>;
     '/api/duplicate-jsx-node': ReqAndRes<DuplicateJsxNodeRequest, DuplicateJsxNodeResponse>;
+    '/api/insert-jsx-element': ReqAndRes<InsertJsxElementRequest, InsertJsxElementResponse>;
     '/api/update-available': ReqAndRes<UpdateAvailableRequest, UpdateAvailableResponse>;
     '/api/apply-codemod': ReqAndRes<ApplyCodemodRequest, ApplyCodemodResponse>;
     '/api/project-info': ReqAndRes<ProjectInfoRequest, ProjectInfoResponse>;

package/dist/effect-drag-data.d.ts

@@ -0,0 +1,11 @@
+export declare const EFFECT_DRAG_MIME_TYPE = "application/vnd.remotion.effect+json";
+export type EffectDragData = {
+    type: 'remotion-effect';
+    version: 1;
+    effect: {
+        name: string;
+        importPath: string;
+        config: Record<string, unknown>;
+    };
+};
+export declare const parseEffectDragData: (value: string) => EffectDragData | null;

package/dist/effect-drag-data.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseEffectDragData = exports.EFFECT_DRAG_MIME_TYPE = void 0;
+exports.EFFECT_DRAG_MIME_TYPE = 'application/vnd.remotion.effect+json';
+const isRecord = (value) => {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+};
+const parseEffectDragData = (value) => {
+    try {
+        const parsed = JSON.parse(value);
+        if (!isRecord(parsed)) {
+            return null;
+        }
+        if (parsed.type !== 'remotion-effect' || parsed.version !== 1) {
+            return null;
+        }
+        if (!isRecord(parsed.effect)) {
+            return null;
+        }
+        const { name, importPath, config } = parsed.effect;
+        if (typeof name !== 'string' ||
+            typeof importPath !== 'string' ||
+            !isRecord(config)) {
+            return null;
+        }
+        return {
+            type: 'remotion-effect',
+            version: 1,
+            effect: {
+                name,
+                importPath,
+                config,
+            },
+        };
+    }
+    catch (_a) {
+        return null;
+    }
+};
+exports.parseEffectDragData = parseEffectDragData;

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 export { splitAnsi, stripAnsi } from './ansi';
-export { AddEffectKeyframeRequest, AddEffectKeyframeResponse, AddRenderRequest, AddSequenceKeyframeRequest, AddSequenceKeyframeResponse, ApiRoutes, ApplyCodemodRequest, ApplyCodemodResponse, ApplyVisualControlRequest, ApplyVisualControlResponse, CanUpdateDefaultPropsResponse, CanUpdateSequencePropsRequest, CancelRenderRequest, CancelRenderResponse, CompositionComponentInfoRequest, CompositionComponentInfoResponse, CopyStillToClipboardRequest, DeleteEffectKeyframeRequest, DeleteEffectKeyframeResponse, DeleteEffectRequest, DeleteEffectRequestItem, DeleteEffectResponse, DeleteJsxNodeRequest, DeleteJsxNodeRequestItem, DeleteJsxNodeResponse, DeleteSequenceKeyframeRequest, DeleteSequenceKeyframeResponse, DeleteStaticFileRequest, DeleteStaticFileResponse, DuplicateJsxNodeRequest, DuplicateJsxNodeResponse, InstallPackageRequest, InstallPackageResponse, OpenInEditorRequest, OpenInEditorResponse, OpenInFileExplorerRequest, ProjectInfoRequest, ProjectInfoResponse, RedoRequest, RedoResponse, RemoveRenderRequest, RestartStudioRequest, RestartStudioResponse, SaveEffectPropsRequest, SaveEffectPropsResponse, SaveSequencePropEdit, SaveSequencePropsRequest, SaveSequencePropsResponse, SaveSequencePropsResult, SimpleDiff, SubscribeToDefaultPropsRequest, SubscribeToDefaultPropsResponse, SubscribeToFileExistenceRequest, SubscribeToFileExistenceResponse, SubscribeToSequencePropsRequest, SubscribeToSequencePropsResponse, UndoRequest, UndoResponse, UnsubscribeFromDefaultPropsRequest, UnsubscribeFromFileExistenceRequest, UnsubscribeFromSequencePropsRequest, UpdateAvailableRequest, UpdateAvailableResponse, UpdateDefaultPropsRequest, UpdateDefaultPropsResponse, } from './api-requests';
+export { AddEffectRequest, AddEffectResponse, AddEffectKeyframeRequest, AddEffectKeyframeResponse, AddRenderRequest, AddSequenceKeyframeRequest, AddSequenceKeyframeResponse, ApiRoutes, ApplyCodemodRequest, ApplyCodemodResponse, ApplyVisualControlRequest, ApplyVisualControlResponse, CanUpdateDefaultPropsResponse, CanUpdateSequencePropsRequest, CancelRenderRequest, CancelRenderResponse, CompositionComponentInfoRequest, CompositionComponentInfoResponse, CopyStillToClipboardRequest, DeleteEffectKeyframe, DeleteEffectRequest, DeleteEffectRequestItem, DeleteEffectResponse, DeleteJsxNodeRequest, DeleteJsxNodeRequestItem, DeleteJsxNodeResponse, DeleteKeyframesRequest, DeleteKeyframesResponse, DeleteSequenceKeyframe, DeleteStaticFileRequest, DeleteStaticFileResponse, DuplicateJsxNodeRequest, DuplicateJsxNodeResponse, InstallPackageRequest, InstallPackageResponse, InsertableCompositionElement, InsertJsxElementRequest, InsertJsxElementResponse, OpenInEditorRequest, OpenInEditorResponse, OpenInFileExplorerRequest, ProjectInfoRequest, ProjectInfoResponse, RedoRequest, RedoResponse, RemoveRenderRequest, ReorderEffectRequest, ReorderEffectResponse, RestartStudioRequest, RestartStudioResponse, SaveEffectPropsRequest, SaveEffectPropsResponse, SaveSequencePropEdit, SaveSequencePropsRequest, SaveSequencePropsResponse, SaveSequencePropsResult, SimpleDiff, SubscribeToDefaultPropsRequest, SubscribeToDefaultPropsResponse, SubscribeToFileExistenceRequest, SubscribeToFileExistenceResponse, SubscribeToSequencePropsRequest, SubscribeToSequencePropsResponse, UndoRequest, UndoResponse, UnsubscribeFromDefaultPropsRequest, UnsubscribeFromFileExistenceRequest, UnsubscribeFromSequencePropsRequest, UpdateAvailableRequest, UpdateAvailableResponse, UpdateDefaultPropsRequest, UpdateDefaultPropsResponse, } from './api-requests';
 export type { ApplyVisualControlCodemod, RecastCodemod } from './codemods';
 export { DEFAULT_BUFFER_STATE_DELAY_IN_MILLISECONDS } from './default-buffer-state-delay-in-milliseconds';
+export { EFFECT_DRAG_MIME_TYPE, parseEffectDragData, type EffectDragData, } from './effect-drag-data';
 export { EventSourceEvent } from './event-source-event';
 export { formatBytes } from './format-bytes';
 export { getAllSchemaKeys } from './get-all-keys';
@@ -23,7 +24,7 @@ export { ScriptLine, SomeStackFrame, StackFrame, SymbolicatedStackFrame, } from
 export { EnumPath, stringifyDefaultProps } from './stringify-default-props';
 export type { VisualControlChange } from './codemods';
 export { optimisticAddEffectKeyframe, optimisticAddSequenceKeyframe, } from './optimistic-add-keyframe';
-export { optimisticDeleteEffectKeyframe, optimisticDeleteSequenceKeyframe, } from './optimistic-delete-keyframe';
+export { optimisticDeleteEffectKeyframe, optimisticDeleteEffectKeyframes, optimisticDeleteSequenceKeyframe, optimisticDeleteSequenceKeyframes, } from './optimistic-delete-keyframe';
 export { optimisticUpdateForCodeValues } from './optimistic-update-for-code-values';
 export { optimisticUpdateForEffectCodeValues } from './optimistic-update-for-effect-code-values';
 export { stringifySequenceExpandedRowKey, stringifySequenceSubscriptionKey, } from './stringify-sequence-subscription-key';

package/dist/index.js

@@ -1,11 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.stringifySequenceSubscriptionKey = exports.stringifySequenceExpandedRowKey = exports.optimisticUpdateForEffectCodeValues = exports.optimisticUpdateForCodeValues = exports.optimisticDeleteSequenceKeyframe = exports.optimisticDeleteEffectKeyframe = exports.optimisticAddSequenceKeyframe = exports.optimisticAddEffectKeyframe = exports.stringifyDefaultProps = exports.getFieldsToShow = exports.getEffectFieldsToShow = exports.SCHEMA_FIELD_ROW_HEIGHT = exports.packages = exports.installableMap = exports.extraPackages = exports.descriptions = exports.apiDocs = exports.DEFAULT_TIMELINE_TRACKS = exports.hotMiddlewareOptions = exports.getProjectName = exports.getLocationFromBuildError = exports.getDefaultOutLocation = exports.getAllSchemaKeys = exports.formatBytes = exports.DEFAULT_BUFFER_STATE_DELAY_IN_MILLISECONDS = exports.stripAnsi = exports.splitAnsi = void 0;
+exports.stringifySequenceSubscriptionKey = exports.stringifySequenceExpandedRowKey = exports.optimisticUpdateForEffectCodeValues = exports.optimisticUpdateForCodeValues = exports.optimisticDeleteSequenceKeyframes = exports.optimisticDeleteSequenceKeyframe = exports.optimisticDeleteEffectKeyframes = exports.optimisticDeleteEffectKeyframe = exports.optimisticAddSequenceKeyframe = exports.optimisticAddEffectKeyframe = exports.stringifyDefaultProps = exports.getFieldsToShow = exports.getEffectFieldsToShow = exports.SCHEMA_FIELD_ROW_HEIGHT = exports.packages = exports.installableMap = exports.extraPackages = exports.descriptions = exports.apiDocs = exports.DEFAULT_TIMELINE_TRACKS = exports.hotMiddlewareOptions = exports.getProjectName = exports.getLocationFromBuildError = exports.getDefaultOutLocation = exports.getAllSchemaKeys = exports.formatBytes = exports.parseEffectDragData = exports.EFFECT_DRAG_MIME_TYPE = exports.DEFAULT_BUFFER_STATE_DELAY_IN_MILLISECONDS = exports.stripAnsi = exports.splitAnsi = void 0;
 const ansi_1 = require("./ansi");
 Object.defineProperty(exports, "splitAnsi", { enumerable: true, get: function () { return ansi_1.splitAnsi; } });
 Object.defineProperty(exports, "stripAnsi", { enumerable: true, get: function () { return ansi_1.stripAnsi; } });
 const default_buffer_state_delay_in_milliseconds_1 = require("./default-buffer-state-delay-in-milliseconds");
 Object.defineProperty(exports, "DEFAULT_BUFFER_STATE_DELAY_IN_MILLISECONDS", { enumerable: true, get: function () { return default_buffer_state_delay_in_milliseconds_1.DEFAULT_BUFFER_STATE_DELAY_IN_MILLISECONDS; } });
+const effect_drag_data_1 = require("./effect-drag-data");
+Object.defineProperty(exports, "EFFECT_DRAG_MIME_TYPE", { enumerable: true, get: function () { return effect_drag_data_1.EFFECT_DRAG_MIME_TYPE; } });
+Object.defineProperty(exports, "parseEffectDragData", { enumerable: true, get: function () { return effect_drag_data_1.parseEffectDragData; } });
 const format_bytes_1 = require("./format-bytes");
 Object.defineProperty(exports, "formatBytes", { enumerable: true, get: function () { return format_bytes_1.formatBytes; } });
 const get_all_keys_1 = require("./get-all-keys");
@@ -37,7 +40,9 @@ Object.defineProperty(exports, "optimisticAddEffectKeyframe", { enumerable: true
 Object.defineProperty(exports, "optimisticAddSequenceKeyframe", { enumerable: true, get: function () { return optimistic_add_keyframe_1.optimisticAddSequenceKeyframe; } });
 const optimistic_delete_keyframe_1 = require("./optimistic-delete-keyframe");
 Object.defineProperty(exports, "optimisticDeleteEffectKeyframe", { enumerable: true, get: function () { return optimistic_delete_keyframe_1.optimisticDeleteEffectKeyframe; } });
+Object.defineProperty(exports, "optimisticDeleteEffectKeyframes", { enumerable: true, get: function () { return optimistic_delete_keyframe_1.optimisticDeleteEffectKeyframes; } });
 Object.defineProperty(exports, "optimisticDeleteSequenceKeyframe", { enumerable: true, get: function () { return optimistic_delete_keyframe_1.optimisticDeleteSequenceKeyframe; } });
+Object.defineProperty(exports, "optimisticDeleteSequenceKeyframes", { enumerable: true, get: function () { return optimistic_delete_keyframe_1.optimisticDeleteSequenceKeyframes; } });
 const optimistic_update_for_code_values_1 = require("./optimistic-update-for-code-values");
 Object.defineProperty(exports, "optimisticUpdateForCodeValues", { enumerable: true, get: function () { return optimistic_update_for_code_values_1.optimisticUpdateForCodeValues; } });
 const optimistic_update_for_effect_code_values_1 = require("./optimistic-update-for-effect-code-values");

package/dist/optimistic-add-keyframe.js

@@ -10,18 +10,12 @@ const addKeyframeToPropStatus = ({ status, frame, value, }) => {
     var _a;
     if (status.canUpdate) {
         const staticValue = (_a = status.codeValue) !== null && _a !== void 0 ? _a : value;
-        const initialKeyframes = frame === 0
-            ? [{ frame, value }]
-            : [
-                { frame: 0, value: staticValue },
-                { frame, value },
-            ];
         return {
             canUpdate: false,
             reason: 'keyframed',
             interpolationFunction: getInterpolationFunction(staticValue, value),
-            keyframes: initialKeyframes,
-            easing: frame === 0 ? [] : ['linear'],
+            keyframes: [{ frame, value }],
+            easing: [],
             clamping: { left: 'extend', right: 'extend' },
             posterize: undefined,
         };

package/dist/optimistic-delete-keyframe.d.ts

@@ -4,9 +4,24 @@ export declare const optimisticDeleteSequenceKeyframe: ({ previous, fieldKey, fr
     fieldKey: string;
     frame: number;
 }) => CanUpdateSequencePropsResponse;
+export declare const optimisticDeleteSequenceKeyframes: ({ previous, keyframes, }: {
+    previous: CanUpdateSequencePropsResponse;
+    keyframes: {
+        fieldKey: string;
+        frame: number;
+    }[];
+}) => CanUpdateSequencePropsResponse;
 export declare const optimisticDeleteEffectKeyframe: ({ previous, effectIndex, fieldKey, frame, }: {
     previous: CanUpdateSequencePropsResponse;
     effectIndex: number;
     fieldKey: string;
     frame: number;
 }) => CanUpdateSequencePropsResponse;
+export declare const optimisticDeleteEffectKeyframes: ({ previous, keyframes, }: {
+    previous: CanUpdateSequencePropsResponse;
+    keyframes: {
+        effectIndex: number;
+        fieldKey: string;
+        frame: number;
+    }[];
+}) => CanUpdateSequencePropsResponse;

package/dist/optimistic-delete-keyframe.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.optimisticDeleteEffectKeyframe = exports.optimisticDeleteSequenceKeyframe = void 0;
+exports.optimisticDeleteEffectKeyframes = exports.optimisticDeleteEffectKeyframe = exports.optimisticDeleteSequenceKeyframes = exports.optimisticDeleteSequenceKeyframe = void 0;
 const removeKeyframeFromPropStatus = ({ status, frame, }) => {
     if (status.canUpdate) {
         return status;
@@ -13,6 +13,12 @@ const removeKeyframeFromPropStatus = ({ status, frame, }) => {
         return status;
     }
     const keyframes = status.keyframes.filter((_, i) => i !== index);
+    if (keyframes.length === 0) {
+        return {
+            canUpdate: true,
+            codeValue: status.keyframes[index].value,
+        };
+    }
     // Easing holds one segment per gap between consecutive keyframes
     // (keyframes.length - 1 entries). Drop the segment adjacent to the removed
     // keyframe so the invariant keeps holding until the server responds.
@@ -44,6 +50,14 @@ const optimisticDeleteSequenceKeyframe = ({ previous, fieldKey, frame, }) => {
     };
 };
 exports.optimisticDeleteSequenceKeyframe = optimisticDeleteSequenceKeyframe;
+const optimisticDeleteSequenceKeyframes = ({ previous, keyframes, }) => {
+    return keyframes.reduce((current, keyframe) => (0, exports.optimisticDeleteSequenceKeyframe)({
+        previous: current,
+        fieldKey: keyframe.fieldKey,
+        frame: keyframe.frame,
+    }), previous);
+};
+exports.optimisticDeleteSequenceKeyframes = optimisticDeleteSequenceKeyframes;
 const optimisticDeleteEffectKeyframe = ({ previous, effectIndex, fieldKey, frame, }) => {
     if (!previous.canUpdate) {
         return previous;
@@ -75,3 +89,12 @@ const optimisticDeleteEffectKeyframe = ({ previous, effectIndex, fieldKey, frame
     };
 };
 exports.optimisticDeleteEffectKeyframe = optimisticDeleteEffectKeyframe;
+const optimisticDeleteEffectKeyframes = ({ previous, keyframes, }) => {
+    return keyframes.reduce((current, keyframe) => (0, exports.optimisticDeleteEffectKeyframe)({
+        previous: current,
+        effectIndex: keyframe.effectIndex,
+        fieldKey: keyframe.fieldKey,
+        frame: keyframe.frame,
+    }), previous);
+};
+exports.optimisticDeleteEffectKeyframes = optimisticDeleteEffectKeyframes;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio-shared"
 	},
 	"name": "@remotion/studio-shared",
-	"version": "4.0.470",
+	"version": "4.0.471",
 	"description": "Internal package for shared objects between the Studio backend and frontend",
 	"main": "dist",
 	"scripts": {
@@ -20,11 +20,11 @@
 		"url": "https://github.com/remotion-dev/remotion/issues"
 	},
 	"dependencies": {
-		"remotion": "4.0.470"
+		"remotion": "4.0.471"
 	},
 	"devDependencies": {
-		"@remotion/renderer": "4.0.470",
-		"@remotion/eslint-config-internal": "4.0.470",
+		"@remotion/renderer": "4.0.471",
+		"@remotion/eslint-config-internal": "4.0.471",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},