@remotion/studio 4.0.470 → 4.0.471

package/dist/components/Timeline/delete-selected-keyframe.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.deleteSelectedKeyframe = void 0;
+exports.deleteSelectedKeyframes = exports.deleteSelectedKeyframe = void 0;
 const call_delete_keyframe_1 = require("./call-delete-keyframe");
 const find_track_for_node_path_info_1 = require("./find-track-for-node-path-info");
 const parse_keyframe_field_from_node_path_1 = require("./parse-keyframe-field-from-node-path");
-const deleteSelectedKeyframe = ({ nodePathInfo, frame, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }) => {
+const getSelectedKeyframeDeletion = ({ nodePathInfo, frame, sequences, overrideIdsToNodePaths, }) => {
     var _a, _b;
     const field = (0, parse_keyframe_field_from_node_path_1.parseKeyframeFieldFromNodePath)(nodePathInfo.auxiliaryKeys);
     if (field === null) {
@@ -27,25 +27,66 @@ const deleteSelectedKeyframe = ({ nodePathInfo, frame, sequences, overrideIdsToN
         if (!effect) {
             return null;
         }
-        return (0, call_delete_keyframe_1.callDeleteEffectKeyframe)({
+        return {
+            type: 'effect',
             fileName,
             nodePath,
             effectIndex: field.effectIndex,
             fieldKey: field.fieldKey,
             sourceFrame,
             schema: effect.schema,
-            setCodeValues,
-            clientId,
-        });
+        };
     }
-    return (0, call_delete_keyframe_1.callDeleteSequenceKeyframe)({
+    return {
+        type: 'sequence',
         fileName,
         nodePath,
         fieldKey: field.fieldKey,
         sourceFrame,
         schema: sequence.controls.schema,
+    };
+};
+const deleteSelectedKeyframe = ({ nodePathInfo, frame, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }) => {
+    const deletion = getSelectedKeyframeDeletion({
+        nodePathInfo,
+        frame,
+        sequences,
+        overrideIdsToNodePaths,
+    });
+    if (deletion === null) {
+        return null;
+    }
+    if (deletion.type === 'effect') {
+        return (0, call_delete_keyframe_1.callDeleteEffectKeyframe)({
+            ...deletion,
+            setCodeValues,
+            clientId,
+        });
+    }
+    return (0, call_delete_keyframe_1.callDeleteSequenceKeyframe)({
+        ...deletion,
         setCodeValues,
         clientId,
     });
 };
 exports.deleteSelectedKeyframe = deleteSelectedKeyframe;
+const deleteSelectedKeyframes = ({ keyframes, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }) => {
+    const deletions = keyframes
+        .map((keyframe) => getSelectedKeyframeDeletion({
+        nodePathInfo: keyframe.nodePathInfo,
+        frame: keyframe.frame,
+        sequences,
+        overrideIdsToNodePaths,
+    }))
+        .filter((deletion) => deletion !== null);
+    if (deletions.length === 0) {
+        return null;
+    }
+    return (0, call_delete_keyframe_1.callDeleteKeyframes)({
+        sequenceKeyframes: deletions.filter((deletion) => deletion.type === 'sequence'),
+        effectKeyframes: deletions.filter((deletion) => deletion.type === 'effect'),
+        setCodeValues,
+        clientId,
+    });
+};
+exports.deleteSelectedKeyframes = deleteSelectedKeyframes;

package/dist/components/Timeline/delete-selected-timeline-item.js

@@ -152,21 +152,16 @@ const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodeP
                 effectIndex: selection.i,
             })));
         case 'keyframe': {
-            const deletePromises = selections
-                .filter(isKeyframeSelection)
-                .map((selection) => (0, delete_selected_keyframe_1.deleteSelectedKeyframe)({
-                nodePathInfo: selection.nodePathInfo,
-                frame: selection.frame,
+            return (0, delete_selected_keyframe_1.deleteSelectedKeyframes)({
+                keyframes: selections.filter(isKeyframeSelection).map((selection) => ({
+                    nodePathInfo: selection.nodePathInfo,
+                    frame: selection.frame,
+                })),
                 sequences,
                 overrideIdsToNodePaths,
                 setCodeValues,
                 clientId,
-            }))
-                .filter((promise) => promise !== null);
-            if (deletePromises.length === 0) {
-                return null;
-            }
-            return Promise.all(deletePromises).then(() => undefined);
+            });
         }
         case 'sequence-prop':
         case 'sequence-effect-prop':

package/dist/components/Timeline/reset-selected-timeline-props.d.ts

@@ -0,0 +1,38 @@
+import type { CodeValues, OverrideIdToNodePaths, SequencePropsSubscriptionKey, SequenceSchema, TSequence } from 'remotion';
+import type { SetCodeValues } from './save-sequence-prop';
+import type { TimelineSelection } from './TimelineSelection';
+type SequencePropResetTarget = {
+    readonly type: 'sequence-prop';
+    readonly fileName: string;
+    readonly nodePath: SequencePropsSubscriptionKey;
+    readonly fieldKey: string;
+    readonly value: unknown;
+    readonly defaultValue: string | null;
+    readonly schema: SequenceSchema;
+};
+type EffectPropResetTarget = {
+    readonly type: 'effect-prop';
+    readonly fileName: string;
+    readonly nodePath: SequencePropsSubscriptionKey;
+    readonly effectIndex: number;
+    readonly fieldKey: string;
+    readonly value: unknown;
+    readonly defaultValue: string | null;
+    readonly schema: SequenceSchema;
+};
+type TimelinePropResetTarget = SequencePropResetTarget | EffectPropResetTarget;
+export declare const getTimelinePropResetTargets: ({ selections, sequences, overrideIdsToNodePaths, codeValues, }: {
+    readonly selections: readonly TimelineSelection[];
+    readonly sequences: TSequence[];
+    readonly overrideIdsToNodePaths: OverrideIdToNodePaths;
+    readonly codeValues: CodeValues;
+}) => TimelinePropResetTarget[] | null;
+export declare const resetSelectedTimelineProps: ({ selections, sequences, overrideIdsToNodePaths, codeValues, setCodeValues, clientId, }: {
+    readonly selections: readonly TimelineSelection[];
+    readonly sequences: TSequence[];
+    readonly overrideIdsToNodePaths: OverrideIdToNodePaths;
+    readonly codeValues: CodeValues;
+    readonly setCodeValues: SetCodeValues;
+    readonly clientId: string;
+}) => Promise<void> | null;
+export {};

package/dist/components/Timeline/reset-selected-timeline-props.js

@@ -0,0 +1,143 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resetSelectedTimelineProps = exports.getTimelinePropResetTargets = void 0;
+const remotion_1 = require("remotion");
+const find_track_for_node_path_info_1 = require("./find-track-for-node-path-info");
+const save_effect_prop_1 = require("./save-effect-prop");
+const save_sequence_prop_1 = require("./save-sequence-prop");
+const isPropResetSelection = (selection) => selection.type === 'sequence-prop' ||
+    selection.type === 'sequence-effect-prop';
+const isVisibleFieldSchema = (fieldSchema) => fieldSchema !== undefined && fieldSchema.type !== 'hidden';
+const isNonDefaultCodeValue = ({ codeValue, defaultValue, }) => JSON.stringify(codeValue !== null && codeValue !== void 0 ? codeValue : defaultValue) !== JSON.stringify(defaultValue);
+const getDefaultValue = (fieldSchema) => fieldSchema.default !== undefined
+    ? JSON.stringify(fieldSchema.default)
+    : null;
+const getTimelinePropResetTargets = ({ selections, sequences, overrideIdsToNodePaths, codeValues, }) => {
+    var _a;
+    var _b;
+    const firstSelection = selections[0];
+    if (!firstSelection || !isPropResetSelection(firstSelection)) {
+        return null;
+    }
+    const resetTargets = [];
+    for (const selection of selections) {
+        if (!isPropResetSelection(selection)) {
+            throw new Error(`Assertion failed: Cannot reset timeline selections of different types (${firstSelection.type}, ${selection.type})`);
+        }
+        const track = (0, find_track_for_node_path_info_1.findTrackForNodePathInfo)({
+            sequences,
+            overrideIdsToNodePaths,
+            nodePathInfo: selection.nodePathInfo,
+        });
+        const sequence = (_b = track === null || track === void 0 ? void 0 : track.sequence) !== null && _b !== void 0 ? _b : null;
+        if (!sequence) {
+            continue;
+        }
+        const nodePath = selection.nodePathInfo.sequenceSubscriptionKey;
+        if (selection.type === 'sequence-prop') {
+            if (!sequence.controls) {
+                continue;
+            }
+            const sequenceFieldSchema = sequence.controls.schema[selection.key];
+            const sequencePropStatus = (_a = remotion_1.Internals.getCodeValuesCtx(codeValues, nodePath)) === null || _a === void 0 ? void 0 : _a[selection.key];
+            if (!isVisibleFieldSchema(sequenceFieldSchema) ||
+                !(sequencePropStatus === null || sequencePropStatus === void 0 ? void 0 : sequencePropStatus.canUpdate) ||
+                !isNonDefaultCodeValue({
+                    codeValue: sequencePropStatus.codeValue,
+                    defaultValue: sequenceFieldSchema.default,
+                })) {
+                continue;
+            }
+            resetTargets.push({
+                type: 'sequence-prop',
+                fileName: nodePath.absolutePath,
+                nodePath,
+                fieldKey: selection.key,
+                value: sequenceFieldSchema.default,
+                defaultValue: getDefaultValue(sequenceFieldSchema),
+                schema: sequence.controls.schema,
+            });
+            continue;
+        }
+        const effect = sequence.effects[selection.i];
+        const fieldSchema = effect === null || effect === void 0 ? void 0 : effect.schema[selection.key];
+        const effectStatus = remotion_1.Internals.getEffectCodeValuesCtx({
+            codeValues,
+            nodePath,
+            effectIndex: selection.i,
+        });
+        const propStatus = effectStatus.type === 'can-update-effect'
+            ? effectStatus.props[selection.key]
+            : null;
+        if (!effect ||
+            !isVisibleFieldSchema(fieldSchema) ||
+            !(propStatus === null || propStatus === void 0 ? void 0 : propStatus.canUpdate) ||
+            !isNonDefaultCodeValue({
+                codeValue: propStatus.codeValue,
+                defaultValue: fieldSchema.default,
+            })) {
+            continue;
+        }
+        resetTargets.push({
+            type: 'effect-prop',
+            fileName: nodePath.absolutePath,
+            nodePath,
+            effectIndex: selection.i,
+            fieldKey: selection.key,
+            value: fieldSchema.default,
+            defaultValue: getDefaultValue(fieldSchema),
+            schema: effect.schema,
+        });
+    }
+    return resetTargets;
+};
+exports.getTimelinePropResetTargets = getTimelinePropResetTargets;
+const resetSelectedTimelineProps = ({ selections, sequences, overrideIdsToNodePaths, codeValues, setCodeValues, clientId, }) => {
+    const resetTargets = (0, exports.getTimelinePropResetTargets)({
+        selections,
+        sequences,
+        overrideIdsToNodePaths,
+        codeValues,
+    });
+    if (resetTargets === null || resetTargets.length === 0) {
+        return null;
+    }
+    const sequencePropTargets = resetTargets.filter((target) => target.type === 'sequence-prop');
+    const effectPropTargets = resetTargets.filter((target) => target.type === 'effect-prop');
+    const resetPromises = [];
+    if (sequencePropTargets.length > 0) {
+        resetPromises.push((0, save_sequence_prop_1.saveSequenceProps)({
+            changes: sequencePropTargets.map((target) => ({
+                fileName: target.fileName,
+                nodePath: target.nodePath,
+                fieldKey: target.fieldKey,
+                value: target.value,
+                defaultValue: target.defaultValue,
+                schema: target.schema,
+            })),
+            setCodeValues,
+            clientId,
+            undoLabel: sequencePropTargets.length > 1
+                ? 'Reset selected sequence props'
+                : null,
+            redoLabel: sequencePropTargets.length > 1
+                ? 'Reapply selected sequence props'
+                : null,
+        }));
+    }
+    for (const target of effectPropTargets) {
+        resetPromises.push((0, save_effect_prop_1.saveEffectProp)({
+            fileName: target.fileName,
+            nodePath: target.nodePath,
+            effectIndex: target.effectIndex,
+            fieldKey: target.fieldKey,
+            value: target.value,
+            defaultValue: target.defaultValue,
+            schema: target.schema,
+            setCodeValues,
+            clientId,
+        }));
+    }
+    return Promise.all(resetPromises).then(() => undefined);
+};
+exports.resetSelectedTimelineProps = resetSelectedTimelineProps;

package/dist/components/Timeline/sequence-props-subscription-store.d.ts

@@ -1,13 +1,14 @@
-import type { SequenceSchema } from 'remotion';
+import type { SequenceNodePath, SequenceSchema } from 'remotion';
 import { callApi } from '../call-api';
 type SubscribeResult = Awaited<ReturnType<typeof callApi<'/api/subscribe-to-sequence-props'>>>;
 type ApplyResult = (result: SubscribeResult) => void;
-export declare const acquireSequencePropsSubscription: ({ fileName, line, column, schema, effects, clientId, applyOnce, applyEach, }: {
+export declare const acquireSequencePropsSubscription: ({ fileName, line, column, schema, effects, nodePath, clientId, applyOnce, applyEach, }: {
     fileName: string;
     line: number;
     column: number;
     schema: SequenceSchema;
     effects: SequenceSchema[];
+    nodePath: SequenceNodePath | null;
     clientId: string;
     applyOnce: ApplyResult;
     applyEach: ApplyResult;

package/dist/components/Timeline/sequence-props-subscription-store.js

@@ -6,7 +6,7 @@ const remotion_1 = require("remotion");
 const call_api_1 = require("../call-api");
 const makeKey = (fileName, line, column, sequenceKeys, effectKeys) => `${fileName}\0${line}\0${column}\0${sequenceKeys.join('\0')}\0${effectKeys.map((keys) => keys.join('\0')).join('\0\0')}`;
 const entries = new Map();
-const acquireSequencePropsSubscription = ({ fileName, line, column, schema, effects, clientId, applyOnce, applyEach, }) => {
+const acquireSequencePropsSubscription = ({ fileName, line, column, schema, effects, nodePath, clientId, applyOnce, applyEach, }) => {
     const sequenceKeys = (0, studio_shared_1.getAllSchemaKeys)(schema);
     const effectKeys = effects.map((effect) => (0, studio_shared_1.getAllSchemaKeys)(effect));
     const key = makeKey(fileName, line, column, sequenceKeys, effectKeys);
@@ -16,6 +16,7 @@ const acquireSequencePropsSubscription = ({ fileName, line, column, schema, effe
             fileName,
             line,
             column,
+            nodePath,
             keys: (0, studio_shared_1.getAllSchemaKeys)(schema),
             effects: effectKeys,
             clientId,

package/dist/components/Timeline/timeline-scroll-logic.js

@@ -172,7 +172,7 @@ const getFrameIncrement = (durationInFrames) => {
     return (0, exports.getFrameIncrementFromWidth)(durationInFrames, width);
 };
 const getFrameIncrementFromWidth = (durationInFrames, width) => {
-    return (width - timeline_layout_1.TIMELINE_PADDING * 2) / (durationInFrames - 1);
+    return (width - timeline_layout_1.TIMELINE_PADDING * 2) / durationInFrames;
 };
 exports.getFrameIncrementFromWidth = getFrameIncrementFromWidth;
 const getFrameWhileScrollingRight = ({ durationInFrames, width, }) => {
@@ -193,10 +193,10 @@ const getFrameWhileScrollingRight = ({ durationInFrames, width, }) => {
 exports.getFrameWhileScrollingRight = getFrameWhileScrollingRight;
 const getFrameFromX = ({ clientX, durationInFrames, width, extrapolate, }) => {
     const pos = clientX - timeline_layout_1.TIMELINE_PADDING;
-    const frame = Math.round((0, remotion_1.interpolate)(pos, [0, width - timeline_layout_1.TIMELINE_PADDING * 2], [0, durationInFrames - 1], {
+    const frame = Math.min(durationInFrames - 1, Math.round((0, remotion_1.interpolate)(pos, [0, width - timeline_layout_1.TIMELINE_PADDING * 2], [0, durationInFrames], {
         extrapolateLeft: extrapolate,
         extrapolateRight: extrapolate,
-    }));
+    })));
     return frame;
 };
 exports.getFrameFromX = getFrameFromX;

package/dist/components/Timeline/use-sequence-props-subscription.js

@@ -36,7 +36,7 @@ const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, ef
     const locationLine = (_b = validatedLocation === null || validatedLocation === void 0 ? void 0 : validatedLocation.line) !== null && _b !== void 0 ? _b : null;
     const locationColumn = (_c = validatedLocation === null || validatedLocation === void 0 ? void 0 : validatedLocation.column) !== null && _c !== void 0 ? _c : null;
     (0, react_1.useEffect)(() => {
-        var _a;
+        var _a, _b;
         if (!clientId ||
             !locationSource ||
             !locationLine ||
@@ -51,6 +51,7 @@ const useSequencePropsSubscription = ({ originalLocation, overrideId, schema, ef
             column: locationColumn,
             schema,
             effects,
+            nodePath: (_b = nodePathAtResubscribe === null || nodePathAtResubscribe === void 0 ? void 0 : nodePathAtResubscribe.nodePath) !== null && _b !== void 0 ? _b : null,
             clientId,
             applyOnce: (result) => {
                 if (!result.success) {