@remotion/studio-shared 4.0.471 → 4.0.473

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

@@ -0,0 +1,23 @@
+import type { CanUpdateSequencePropsResponse, CanUpdateSequencePropStatus } from 'remotion';
+export type OptimisticKeyframeMove = {
+    readonly fieldKey: string;
+    readonly fromFrame: number;
+    readonly toFrame: number;
+};
+export declare const canMoveKeyframesWithoutCollisions: ({ status, moves, }: {
+    status: CanUpdateSequencePropStatus;
+    moves: readonly {
+        fromFrame: number;
+        toFrame: number;
+    }[];
+}) => boolean;
+export declare const optimisticMoveSequenceKeyframes: ({ previous, keyframes, }: {
+    previous: CanUpdateSequencePropsResponse;
+    keyframes: readonly OptimisticKeyframeMove[];
+}) => CanUpdateSequencePropsResponse;
+export declare const optimisticMoveEffectKeyframes: ({ previous, keyframes, }: {
+    previous: CanUpdateSequencePropsResponse;
+    keyframes: readonly (OptimisticKeyframeMove & {
+        effectIndex: number;
+    })[];
+}) => CanUpdateSequencePropsResponse;

package/dist/optimistic-move-keyframe.js

@@ -0,0 +1,142 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.optimisticMoveEffectKeyframes = exports.optimisticMoveSequenceKeyframes = exports.canMoveKeyframesWithoutCollisions = void 0;
+const getMoveMap = (moves) => {
+    const moveMap = new Map();
+    for (const move of moves) {
+        if (move.fromFrame === move.toFrame) {
+            continue;
+        }
+        if (moveMap.has(move.fromFrame)) {
+            return null;
+        }
+        moveMap.set(move.fromFrame, move.toFrame);
+    }
+    return moveMap;
+};
+const canMoveKeyframesWithoutCollisions = ({ status, moves, }) => {
+    var _a;
+    if (status.status !== 'keyframed') {
+        return false;
+    }
+    const moveMap = getMoveMap(moves);
+    if (moveMap === null) {
+        return false;
+    }
+    if (moveMap.size === 0) {
+        return true;
+    }
+    const frames = new Set(status.keyframes.map((keyframe) => keyframe.frame));
+    for (const fromFrame of moveMap.keys()) {
+        if (!frames.has(fromFrame)) {
+            return false;
+        }
+    }
+    const nextFrames = new Set();
+    for (const keyframe of status.keyframes) {
+        const frame = (_a = moveMap.get(keyframe.frame)) !== null && _a !== void 0 ? _a : keyframe.frame;
+        if (nextFrames.has(frame)) {
+            return false;
+        }
+        nextFrames.add(frame);
+    }
+    return true;
+};
+exports.canMoveKeyframesWithoutCollisions = canMoveKeyframesWithoutCollisions;
+const moveKeyframesInPropStatus = ({ status, moves, }) => {
+    if (status.status !== 'keyframed') {
+        return status;
+    }
+    if (!(0, exports.canMoveKeyframesWithoutCollisions)({ status, moves })) {
+        return status;
+    }
+    const moveMap = getMoveMap(moves);
+    if (moveMap === null) {
+        return status;
+    }
+    if (moveMap.size === 0) {
+        return status;
+    }
+    return {
+        ...status,
+        keyframes: status.keyframes
+            .map((keyframe) => {
+            var _a;
+            return ({
+                ...keyframe,
+                frame: (_a = moveMap.get(keyframe.frame)) !== null && _a !== void 0 ? _a : keyframe.frame,
+            });
+        })
+            .sort((a, b) => a.frame - b.frame),
+    };
+};
+const optimisticMoveSequenceKeyframes = ({ previous, keyframes, }) => {
+    var _a;
+    if (!previous.canUpdate) {
+        return previous;
+    }
+    const movesByField = new Map();
+    for (const keyframe of keyframes) {
+        const moves = (_a = movesByField.get(keyframe.fieldKey)) !== null && _a !== void 0 ? _a : [];
+        moves.push(keyframe);
+        movesByField.set(keyframe.fieldKey, moves);
+    }
+    const props = { ...previous.props };
+    for (const [fieldKey, moves] of movesByField) {
+        const status = props[fieldKey];
+        if (!status) {
+            continue;
+        }
+        props[fieldKey] = moveKeyframesInPropStatus({ status, moves });
+    }
+    return {
+        ...previous,
+        props,
+    };
+};
+exports.optimisticMoveSequenceKeyframes = optimisticMoveSequenceKeyframes;
+const optimisticMoveEffectKeyframes = ({ previous, keyframes, }) => {
+    var _a;
+    if (!previous.canUpdate) {
+        return previous;
+    }
+    const movesByEffect = new Map();
+    for (const keyframe of keyframes) {
+        const moves = (_a = movesByEffect.get(keyframe.effectIndex)) !== null && _a !== void 0 ? _a : [];
+        moves.push(keyframe);
+        movesByEffect.set(keyframe.effectIndex, moves);
+    }
+    const effects = previous.effects.map((effect) => {
+        var _a;
+        if (!effect.canUpdate) {
+            return effect;
+        }
+        const movesForEffect = movesByEffect.get(effect.effectIndex);
+        if (!movesForEffect) {
+            return effect;
+        }
+        const props = { ...effect.props };
+        const movesByField = new Map();
+        for (const move of movesForEffect) {
+            const moves = (_a = movesByField.get(move.fieldKey)) !== null && _a !== void 0 ? _a : [];
+            moves.push(move);
+            movesByField.set(move.fieldKey, moves);
+        }
+        for (const [fieldKey, moves] of movesByField) {
+            const status = props[fieldKey];
+            if (!status) {
+                continue;
+            }
+            props[fieldKey] = moveKeyframesInPropStatus({ status, moves });
+        }
+        return {
+            ...effect,
+            props,
+        };
+    });
+    return {
+        ...previous,
+        effects,
+    };
+};
+exports.optimisticMoveEffectKeyframes = optimisticMoveEffectKeyframes;

package/dist/optimistic-update-for-code-values.js

@@ -9,7 +9,7 @@ const optimisticUpdateForCodeValues = ({ previous, fieldKey, value, schema, }) =
     }
     const props = {
         ...previous.props,
-        [fieldKey]: { canUpdate: true, codeValue: value },
+        [fieldKey]: { status: 'static', codeValue: value },
     };
     if (((_a = schema[fieldKey]) === null || _a === void 0 ? void 0 : _a.type) === 'enum') {
         const propsToDelete = no_react_1.NoReactInternals.findPropsToDelete({

package/dist/optimistic-update-for-effect-code-values.js

@@ -17,7 +17,7 @@ const optimisticUpdateForEffectCodeValues = ({ previous, effectIndex, fieldKey,
     }
     const props = {
         ...target.props,
-        [fieldKey]: { canUpdate: true, codeValue: value },
+        [fieldKey]: { status: 'static', codeValue: value },
     };
     if (((_a = schema[fieldKey]) === null || _a === void 0 ? void 0 : _a.type) === 'enum') {
         const propsToDelete = no_react_1.NoReactInternals.findPropsToDelete({

package/dist/optimistic-update-keyframe-settings.d.ts

@@ -0,0 +1,13 @@
+import type { CanUpdateSequencePropsResponse } from 'remotion';
+import type { KeyframeSettings } from './api-requests';
+export declare const optimisticUpdateSequenceKeyframeSettings: ({ previous, fieldKey, settings, }: {
+    previous: CanUpdateSequencePropsResponse;
+    fieldKey: string;
+    settings: KeyframeSettings;
+}) => CanUpdateSequencePropsResponse;
+export declare const optimisticUpdateEffectKeyframeSettings: ({ previous, effectIndex, fieldKey, settings, }: {
+    previous: CanUpdateSequencePropsResponse;
+    effectIndex: number;
+    fieldKey: string;
+    settings: KeyframeSettings;
+}) => CanUpdateSequencePropsResponse;

package/dist/optimistic-update-keyframe-settings.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.optimisticUpdateEffectKeyframeSettings = exports.optimisticUpdateSequenceKeyframeSettings = void 0;
+const applySettingsToStatus = (status, settings) => {
+    if (!status || status.status !== 'keyframed') {
+        throw new Error('Expected keyframed status');
+    }
+    return {
+        ...status,
+        ...(settings.clamping ? { clamping: settings.clamping } : {}),
+        posterize: settings.posterize,
+    };
+};
+const optimisticUpdateSequenceKeyframeSettings = ({ previous, fieldKey, settings, }) => {
+    if (!previous.canUpdate) {
+        return previous;
+    }
+    const status = previous.props[fieldKey];
+    if (!status || status.status !== 'keyframed') {
+        return previous;
+    }
+    return {
+        ...previous,
+        props: {
+            ...previous.props,
+            [fieldKey]: applySettingsToStatus(status, settings),
+        },
+    };
+};
+exports.optimisticUpdateSequenceKeyframeSettings = optimisticUpdateSequenceKeyframeSettings;
+const optimisticUpdateEffectKeyframeSettings = ({ previous, effectIndex, fieldKey, settings, }) => {
+    if (!previous.canUpdate) {
+        return previous;
+    }
+    const targetIndex = previous.effects.findIndex((effect) => effect.effectIndex === effectIndex);
+    if (targetIndex === -1) {
+        return previous;
+    }
+    const target = previous.effects[targetIndex];
+    if (!target.canUpdate) {
+        return previous;
+    }
+    const status = target.props[fieldKey];
+    if (!status || status.status !== 'keyframed') {
+        return previous;
+    }
+    const effects = [...previous.effects];
+    effects[targetIndex] = {
+        ...target,
+        props: {
+            ...target.props,
+            [fieldKey]: applySettingsToStatus(status, settings),
+        },
+    };
+    return {
+        ...previous,
+        effects,
+    };
+};
+exports.optimisticUpdateEffectKeyframeSettings = optimisticUpdateEffectKeyframeSettings;

package/dist/required-package.d.ts

@@ -0,0 +1,3 @@
+import type { InsertableCompositionElement } from './api-requests';
+export declare const getRequiredPackageForInsertableElement: (element: InsertableCompositionElement) => string | null;
+export declare const getRequiredPackageForEffectImportPath: (importPath: string) => string | null;

package/dist/required-package.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getRequiredPackageForEffectImportPath = exports.getRequiredPackageForInsertableElement = void 0;
+const getRequiredPackageForInsertableElement = (element) => {
+    if (element.type === 'solid') {
+        return null;
+    }
+    if (element.assetType === 'video' || element.assetType === 'audio') {
+        return '@remotion/media';
+    }
+    if (element.assetType === 'gif') {
+        return '@remotion/gif';
+    }
+    return null;
+};
+exports.getRequiredPackageForInsertableElement = getRequiredPackageForInsertableElement;
+const getRequiredPackageForEffectImportPath = (importPath) => {
+    if (importPath.startsWith('@remotion/effects/')) {
+        return '@remotion/effects';
+    }
+    if (importPath === '@remotion/light-leaks' ||
+        importPath === '@remotion/starburst') {
+        return importPath;
+    }
+    return null;
+};
+exports.getRequiredPackageForEffectImportPath = getRequiredPackageForEffectImportPath;

package/dist/schema-field-info.d.ts

@@ -17,7 +17,7 @@ export type EffectSchemaFieldInfo = SchemaFieldInfo & {
 };
 export type AnySchemaFieldInfo = SequenceSchemaFieldInfo | EffectSchemaFieldInfo;
 export declare const SCHEMA_FIELD_ROW_HEIGHT = 22;
-declare const SUPPORTED_SCHEMA_TYPES: readonly ["number", "boolean", "rotation", "translate", "uv-coordinate", "color", "enum", "hidden"];
+declare const SUPPORTED_SCHEMA_TYPES: readonly ["number", "boolean", "rotation-css", "rotation-degrees", "translate", "scale", "uv-coordinate", "color", "array", "enum", "hidden"];
 type SupportedSchemaType = (typeof SUPPORTED_SCHEMA_TYPES)[number];
 export declare const getFieldsToShow: ({ getDragOverrides, codeValues, nodePath, schema, currentRuntimeValueDotNotation, }: {
     schema: SequenceSchema;

package/dist/schema-field-info.js

@@ -7,13 +7,49 @@ exports.SCHEMA_FIELD_ROW_HEIGHT = 22;
 const SUPPORTED_SCHEMA_TYPES = [
     'number',
     'boolean',
-    'rotation',
+    'rotation-css',
+    'rotation-degrees',
     'translate',
+    'scale',
     'uv-coordinate',
     'color',
+    'array',
     'enum',
     'hidden',
 ];
+const getArrayRowCount = ({ fieldSchema, value, }) => {
+    var _a, _b;
+    const items = Array.isArray(value)
+        ? value
+        : Array.isArray(fieldSchema.default)
+            ? fieldSchema.default
+            : Array.from({ length: (_a = fieldSchema.minLength) !== null && _a !== void 0 ? _a : 0 });
+    const canAdd = items.length < ((_b = fieldSchema.maxLength) !== null && _b !== void 0 ? _b : Infinity);
+    return Math.max(1, items.length + (canAdd ? 1 : 0));
+};
+const getSchemaFieldRowHeight = ({ fieldSchema, value, }) => {
+    if (fieldSchema.type === 'array') {
+        return (getArrayRowCount({
+            fieldSchema,
+            value,
+        }) * exports.SCHEMA_FIELD_ROW_HEIGHT);
+    }
+    return exports.SCHEMA_FIELD_ROW_HEIGHT;
+};
+const getEffectFieldValue = ({ key, dragOverrides, effectStatus, }) => {
+    const dragOverride = remotion_1.Internals.getStaticDragOverrideValue(dragOverrides[key]);
+    if (dragOverride !== undefined) {
+        return dragOverride;
+    }
+    if ((effectStatus === null || effectStatus === void 0 ? void 0 : effectStatus.type) !== 'can-update-effect') {
+        return undefined;
+    }
+    const propStatus = effectStatus.props[key];
+    if ((propStatus === null || propStatus === void 0 ? void 0 : propStatus.status) !== 'static') {
+        return undefined;
+    }
+    return propStatus.codeValue;
+};
 const getFieldsToShow = ({ getDragOverrides, codeValues, nodePath, schema, currentRuntimeValueDotNotation, }) => {
     const { merged: valuesDotNotation } = remotion_1.Internals.computeEffectiveSchemaValuesDotNotation({
         schema,
@@ -32,6 +68,9 @@ const getFieldsToShow = ({ getDragOverrides, codeValues, nodePath, schema, curre
         if (typeName === 'hidden') {
             return null;
         }
+        if (fieldSchema.type === 'number' && fieldSchema.hiddenFromList) {
+            return null;
+        }
         // `hidden` is represented as the eye/speaker icon on the timeline track,
         // so we don't render it as a regular field in the expanded section.
         if (key === 'hidden') {
@@ -42,7 +81,10 @@ const getFieldsToShow = ({ getDragOverrides, codeValues, nodePath, schema, curre
             key,
             description: fieldSchema.description,
             typeName,
-            rowHeight: exports.SCHEMA_FIELD_ROW_HEIGHT,
+            rowHeight: getSchemaFieldRowHeight({
+                fieldSchema,
+                value: valuesDotNotation[key],
+            }),
             fieldSchema,
         };
     })
@@ -59,18 +101,7 @@ const getEffectFieldsToShow = ({ effect, effectIndex, nodePath, codeValues, getE
         });
     const dragOverrides = nodePath === null ? {} : getEffectDragOverrides(nodePath, effectIndex);
     const activeSchema = remotion_1.Internals.flattenActiveSchema(effect.schema, (key) => {
-        const dragOverride = dragOverrides[key];
-        if (dragOverride !== undefined) {
-            return dragOverride;
-        }
-        if ((effectStatus === null || effectStatus === void 0 ? void 0 : effectStatus.type) !== 'can-update-effect') {
-            return undefined;
-        }
-        const propStatus = effectStatus.props[key];
-        if (!propStatus || !propStatus.canUpdate) {
-            return undefined;
-        }
-        return propStatus.codeValue;
+        return getEffectFieldValue({ key, dragOverrides, effectStatus });
     });
     return Object.entries(activeSchema)
         .map(([key, fieldSchema]) => {
@@ -78,6 +109,9 @@ const getEffectFieldsToShow = ({ effect, effectIndex, nodePath, codeValues, getE
         if (typeName === 'hidden') {
             return null;
         }
+        if (fieldSchema.type === 'number' && fieldSchema.hiddenFromList) {
+            return null;
+        }
         // `disabled` is represented as the eye icon on the effect timeline row,
         // so we don't render it as a regular field in the expanded section.
         if (key === 'disabled') {
@@ -91,7 +125,10 @@ const getEffectFieldsToShow = ({ effect, effectIndex, nodePath, codeValues, getE
             key,
             description: fieldSchema.description,
             typeName,
-            rowHeight: exports.SCHEMA_FIELD_ROW_HEIGHT,
+            rowHeight: getSchemaFieldRowHeight({
+                fieldSchema,
+                value: getEffectFieldValue({ key, dragOverrides, effectStatus }),
+            }),
             fieldSchema,
             effectSchema: effect.schema,
             effectIndex,

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.471",
+	"version": "4.0.473",
 	"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.471"
+		"remotion": "4.0.473"
 	},
 	"devDependencies": {
-		"@remotion/renderer": "4.0.471",
-		"@remotion/eslint-config-internal": "4.0.471",
+		"@remotion/renderer": "4.0.473",
+		"@remotion/eslint-config-internal": "4.0.473",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},