@remotion/studio 4.0.472 → 4.0.473

package/dist/components/Timeline/apply-effect-response-to-code-values.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyEffectResponseToCodeValues = void 0;
+const applyEffectResponseToCodeValues = ({ previous, response, }) => {
+    if (!previous.canUpdate) {
+        return previous;
+    }
+    const targetIndex = previous.effects.findIndex((effect) => effect.effectIndex === response.effectIndex);
+    if (targetIndex === -1) {
+        return previous;
+    }
+    const effects = [...previous.effects];
+    effects[targetIndex] = response;
+    return {
+        ...previous,
+        effects,
+    };
+};
+exports.applyEffectResponseToCodeValues = applyEffectResponseToCodeValues;

package/dist/components/Timeline/call-add-keyframe.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.callAddEffectKeyframe = exports.callAddSequenceKeyframe = void 0;
 const studio_shared_1 = require("@remotion/studio-shared");
 const call_api_1 = require("../call-api");
+const apply_effect_response_to_code_values_1 = require("./apply-effect-response-to-code-values");
 const save_prop_queue_1 = require("./save-prop-queue");
 const callAddSequenceKeyframe = ({ fileName, nodePath, fieldKey, sourceFrame, value, schema, setCodeValues, clientId, }) => {
     return (0, save_prop_queue_1.enqueueSavePropChange)({
@@ -40,6 +41,7 @@ const callAddEffectKeyframe = ({ fileName, nodePath, effectIndex, fieldKey, sour
             value,
             schema,
         }),
+        applyServerResponse: (prev, response) => (0, apply_effect_response_to_code_values_1.applyEffectResponseToCodeValues)({ previous: prev, response }),
         apiCall: () => (0, call_api_1.callApi)('/api/add-effect-keyframe', {
             fileName,
             sequenceNodePath: nodePath,

package/dist/components/Timeline/call-move-keyframe.d.ts

@@ -0,0 +1,19 @@
+import type { SequencePropsSubscriptionKey, SequenceSchema } from 'remotion';
+import type { SetCodeValues } from './save-sequence-prop';
+export type MoveSequenceKeyframeChange = {
+    fileName: string;
+    nodePath: SequencePropsSubscriptionKey;
+    fieldKey: string;
+    fromFrame: number;
+    toFrame: number;
+    schema: SequenceSchema;
+};
+export type MoveEffectKeyframeChange = MoveSequenceKeyframeChange & {
+    effectIndex: number;
+};
+export declare const callMoveKeyframes: ({ sequenceKeyframes, effectKeyframes, setCodeValues, clientId, }: {
+    sequenceKeyframes: MoveSequenceKeyframeChange[];
+    effectKeyframes: MoveEffectKeyframeChange[];
+    setCodeValues: SetCodeValues;
+    clientId: string;
+}) => Promise<void>;

package/dist/components/Timeline/call-move-keyframe.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.callMoveKeyframes = void 0;
+const studio_shared_1 = require("@remotion/studio-shared");
+const call_api_1 = require("../call-api");
+const groupByNodePath = (keyframes) => {
+    var _a;
+    const groups = new Map();
+    for (const keyframe of keyframes) {
+        const key = JSON.stringify(keyframe.nodePath);
+        const group = (_a = groups.get(key)) !== null && _a !== void 0 ? _a : [];
+        group.push(keyframe);
+        groups.set(key, group);
+    }
+    return [...groups.values()];
+};
+const callMoveKeyframes = ({ sequenceKeyframes, effectKeyframes, setCodeValues, clientId, }) => {
+    if (sequenceKeyframes.length === 0 && effectKeyframes.length === 0) {
+        return Promise.resolve();
+    }
+    for (const keyframes of groupByNodePath(sequenceKeyframes)) {
+        const [firstKeyframe] = keyframes;
+        if (!firstKeyframe) {
+            continue;
+        }
+        setCodeValues(firstKeyframe.nodePath, (prev) => (0, studio_shared_1.optimisticMoveSequenceKeyframes)({
+            previous: prev,
+            keyframes: keyframes.map((keyframe) => ({
+                fieldKey: keyframe.fieldKey,
+                fromFrame: keyframe.fromFrame,
+                toFrame: keyframe.toFrame,
+            })),
+        }));
+    }
+    for (const keyframes of groupByNodePath(effectKeyframes)) {
+        const [firstKeyframe] = keyframes;
+        if (!firstKeyframe) {
+            continue;
+        }
+        setCodeValues(firstKeyframe.nodePath, (prev) => (0, studio_shared_1.optimisticMoveEffectKeyframes)({
+            previous: prev,
+            keyframes: keyframes.map((keyframe) => ({
+                effectIndex: keyframe.effectIndex,
+                fieldKey: keyframe.fieldKey,
+                fromFrame: keyframe.fromFrame,
+                toFrame: keyframe.toFrame,
+            })),
+        }));
+    }
+    return (0, call_api_1.callApi)('/api/move-keyframes', {
+        sequenceKeyframes: sequenceKeyframes.map((keyframe) => ({
+            fileName: keyframe.fileName,
+            nodePath: keyframe.nodePath,
+            key: keyframe.fieldKey,
+            fromFrame: keyframe.fromFrame,
+            toFrame: keyframe.toFrame,
+            schema: keyframe.schema,
+        })),
+        effectKeyframes: effectKeyframes.map((keyframe) => ({
+            fileName: keyframe.fileName,
+            sequenceNodePath: keyframe.nodePath,
+            effectIndex: keyframe.effectIndex,
+            key: keyframe.fieldKey,
+            fromFrame: keyframe.fromFrame,
+            toFrame: keyframe.toFrame,
+            schema: keyframe.schema,
+        })),
+        clientId,
+    }).then(() => undefined);
+};
+exports.callMoveKeyframes = callMoveKeyframes;

package/dist/components/Timeline/call-update-keyframe-settings.d.ts

@@ -0,0 +1,22 @@
+import { type KeyframeSettings } from '@remotion/studio-shared';
+import type { SequencePropsSubscriptionKey, SequenceSchema } from 'remotion';
+import type { SetCodeValues } from './save-sequence-prop';
+export declare const callUpdateSequenceKeyframeSettings: ({ fileName, nodePath, fieldKey, settings, schema, setCodeValues, clientId, }: {
+    fileName: string;
+    nodePath: SequencePropsSubscriptionKey;
+    fieldKey: string;
+    settings: KeyframeSettings;
+    schema: SequenceSchema;
+    setCodeValues: SetCodeValues;
+    clientId: string;
+}) => Promise<void>;
+export declare const callUpdateEffectKeyframeSettings: ({ fileName, nodePath, effectIndex, fieldKey, settings, schema, setCodeValues, clientId, }: {
+    fileName: string;
+    nodePath: SequencePropsSubscriptionKey;
+    effectIndex: number;
+    fieldKey: string;
+    settings: KeyframeSettings;
+    schema: SequenceSchema;
+    setCodeValues: SetCodeValues;
+    clientId: string;
+}) => Promise<void>;

package/dist/components/Timeline/call-update-keyframe-settings.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.callUpdateEffectKeyframeSettings = exports.callUpdateSequenceKeyframeSettings = void 0;
+const studio_shared_1 = require("@remotion/studio-shared");
+const call_api_1 = require("../call-api");
+const apply_effect_response_to_code_values_1 = require("./apply-effect-response-to-code-values");
+const save_prop_queue_1 = require("./save-prop-queue");
+const callUpdateSequenceKeyframeSettings = ({ fileName, nodePath, fieldKey, settings, schema, setCodeValues, clientId, }) => {
+    return (0, save_prop_queue_1.enqueueSavePropChange)({
+        nodePath,
+        setCodeValues,
+        applyOptimistic: (prev) => (0, studio_shared_1.optimisticUpdateSequenceKeyframeSettings)({
+            previous: prev,
+            fieldKey,
+            settings,
+        }),
+        apiCall: () => (0, call_api_1.callApi)('/api/update-sequence-keyframe-settings', {
+            fileName,
+            nodePath,
+            key: fieldKey,
+            settings,
+            schema,
+            clientId,
+        }),
+        errorLabel: 'Could not update keyframe settings',
+    });
+};
+exports.callUpdateSequenceKeyframeSettings = callUpdateSequenceKeyframeSettings;
+const callUpdateEffectKeyframeSettings = ({ fileName, nodePath, effectIndex, fieldKey, settings, schema, setCodeValues, clientId, }) => {
+    return (0, save_prop_queue_1.enqueueSavePropChange)({
+        nodePath,
+        setCodeValues,
+        applyOptimistic: (prev) => (0, studio_shared_1.optimisticUpdateEffectKeyframeSettings)({
+            previous: prev,
+            effectIndex,
+            fieldKey,
+            settings,
+        }),
+        applyServerResponse: (prev, response) => (0, apply_effect_response_to_code_values_1.applyEffectResponseToCodeValues)({ previous: prev, response }),
+        apiCall: () => (0, call_api_1.callApi)('/api/update-effect-keyframe-settings', {
+            fileName,
+            sequenceNodePath: nodePath,
+            effectIndex,
+            key: fieldKey,
+            settings,
+            schema,
+            clientId,
+        }),
+        errorLabel: 'Could not update keyframe settings',
+    });
+};
+exports.callUpdateEffectKeyframeSettings = callUpdateEffectKeyframeSettings;

package/dist/components/Timeline/delete-selected-timeline-item.d.ts

@@ -1,17 +1,20 @@
 import type { OverrideIdToNodePaths, TSequence } from 'remotion';
+import type { ConfirmationDialogFunction } from '../ConfirmationDialog-types';
 import type { SetCodeValues } from './save-sequence-prop';
 import type { TimelineSelection } from './TimelineSelection';
-export declare const deleteSelectedTimelineItem: ({ selection, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }: {
+export declare const deleteSelectedTimelineItem: ({ selection, sequences, overrideIdsToNodePaths, setCodeValues, clientId, confirm, }: {
     selection: TimelineSelection;
     sequences: TSequence[];
     overrideIdsToNodePaths: OverrideIdToNodePaths;
     setCodeValues: SetCodeValues;
     clientId: string;
-}) => Promise<void> | null;
-export declare const deleteSelectedTimelineItems: ({ selections, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }: {
+    confirm: ConfirmationDialogFunction;
+}) => Promise<boolean> | null;
+export declare const deleteSelectedTimelineItems: ({ selections, sequences, overrideIdsToNodePaths, setCodeValues, clientId, confirm, }: {
     selections: readonly TimelineSelection[];
     sequences: TSequence[];
     overrideIdsToNodePaths: OverrideIdToNodePaths;
     setCodeValues: SetCodeValues;
     clientId: string;
-}) => Promise<void> | null;
+    confirm: ConfirmationDialogFunction;
+}) => Promise<boolean> | null;

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

@@ -4,27 +4,31 @@ exports.deleteSelectedTimelineItems = exports.deleteSelectedTimelineItem = void
 const call_api_1 = require("../call-api");
 const NotificationCenter_1 = require("../Notifications/NotificationCenter");
 const delete_selected_keyframe_1 = require("./delete-selected-keyframe");
-const confirmDeletingDuplicatedSequences = (nodePathInfos) => {
+const confirmDeletingDuplicatedSequences = (nodePathInfos, confirm) => {
     const duplicatedNodePathInfos = nodePathInfos.filter((nodePathInfo) => nodePathInfo.numberOfSequencesWithThisNodePath > 1);
     if (duplicatedNodePathInfos.length === 0) {
-        return true;
+        return Promise.resolve(true);
     }
     if (duplicatedNodePathInfos.length === 1) {
         const [nodePathInfo] = duplicatedNodePathInfos;
-        const singleDuplicatedSequenceMessage = 'This sequence is programmatically duplicated ' +
-            nodePathInfo.numberOfSequencesWithThisNodePath +
-            ' times in the code. Deleting removes all instances. Continue?';
-        // eslint-disable-next-line no-alert -- native confirm before deleting all instances of a duplicated sequence
-        return window.confirm(singleDuplicatedSequenceMessage);
+        return confirm({
+            title: 'Delete sequence?',
+            message: 'This sequence is programmatically duplicated ' +
+                nodePathInfo.numberOfSequencesWithThisNodePath +
+                ' times in the code. Deleting removes all instances. Continue?',
+            confirmLabel: 'Delete',
+        });
     }
-    const multipleDuplicatedSequencesMessage = duplicatedNodePathInfos.length +
-        ' selected sequences are programmatically duplicated in the code. Deleting removes all instances. Continue?';
-    // eslint-disable-next-line no-alert -- native confirm before deleting all instances of duplicated sequences
-    return window.confirm(multipleDuplicatedSequencesMessage);
+    return confirm({
+        title: 'Delete sequences?',
+        message: duplicatedNodePathInfos.length +
+            ' selected sequences are programmatically duplicated in the code. Deleting removes all instances. Continue?',
+        confirmLabel: 'Delete',
+    });
 };
-const deleteSequences = (nodePathInfos) => {
-    if (!confirmDeletingDuplicatedSequences(nodePathInfos)) {
-        return Promise.resolve();
+const deleteSequences = async (nodePathInfos, confirm) => {
+    if (!(await confirmDeletingDuplicatedSequences(nodePathInfos, confirm))) {
+        return false;
     }
     return (0, call_api_1.callApi)('/api/delete-jsx-node', {
         nodes: nodePathInfos.map((nodePathInfo) => {
@@ -44,14 +48,16 @@ const deleteSequences = (nodePathInfos) => {
         else {
             (0, NotificationCenter_1.showNotification)(result.reason, 4000);
         }
+        return true;
     })
         .catch((err) => {
         (0, NotificationCenter_1.showNotification)(err.message, 4000);
+        return true;
     });
 };
 const deleteEffects = (effects) => {
     if (effects.length === 0) {
-        return Promise.resolve();
+        return Promise.resolve(false);
     }
     return (0, call_api_1.callApi)('/api/delete-effect', effects.map((effect) => {
         const nodePath = effect.nodePathInfo.sequenceSubscriptionKey;
@@ -80,14 +86,17 @@ const deleteEffects = (effects) => {
         else {
             (0, NotificationCenter_1.showNotification)(result.reason, 4000);
         }
+        return true;
     })
         .catch((err) => {
         (0, NotificationCenter_1.showNotification)(err.message, 4000);
+        return true;
     });
 };
-const deleteSelectedTimelineItem = ({ selection, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }) => {
+const deleteSelectedTimelineItem = ({ selection, sequences, overrideIdsToNodePaths, setCodeValues, clientId, confirm, }) => {
+    var _a;
     if (selection.type === 'keyframe') {
-        return (0, delete_selected_keyframe_1.deleteSelectedKeyframe)({
+        const promise = (0, delete_selected_keyframe_1.deleteSelectedKeyframe)({
             nodePathInfo: selection.nodePathInfo,
             frame: selection.frame,
             sequences,
@@ -95,10 +104,11 @@ const deleteSelectedTimelineItem = ({ selection, sequences, overrideIdsToNodePat
             setCodeValues,
             clientId,
         });
+        return (_a = promise === null || promise === void 0 ? void 0 : promise.then(() => true)) !== null && _a !== void 0 ? _a : null;
     }
     switch (selection.type) {
         case 'sequence':
-            return deleteSequences([selection.nodePathInfo]);
+            return deleteSequences([selection.nodePathInfo], confirm);
         case 'sequence-effect':
             return deleteEffects([
                 {
@@ -134,7 +144,8 @@ const assertTimelineSelectionsHaveSameType = (selections) => {
         }
     }
 };
-const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodePaths, setCodeValues, clientId, }) => {
+const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodePaths, setCodeValues, clientId, confirm, }) => {
+    var _a;
     const firstSelection = selections[0];
     if (!firstSelection) {
         return null;
@@ -144,7 +155,7 @@ const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodeP
         case 'sequence':
             return deleteSequences(selections
                 .filter(isSequenceRowSelection)
-                .map((selection) => selection.nodePathInfo));
+                .map((selection) => selection.nodePathInfo), confirm);
         case 'sequence-effect':
             return deleteEffects(selections.filter(isSequenceEffectSelection).map((selection) => ({
                 type: 'single-effect',
@@ -152,7 +163,7 @@ const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodeP
                 effectIndex: selection.i,
             })));
         case 'keyframe': {
-            return (0, delete_selected_keyframe_1.deleteSelectedKeyframes)({
+            const promise = (0, delete_selected_keyframe_1.deleteSelectedKeyframes)({
                 keyframes: selections.filter(isKeyframeSelection).map((selection) => ({
                     nodePathInfo: selection.nodePathInfo,
                     frame: selection.frame,
@@ -162,6 +173,7 @@ const deleteSelectedTimelineItems = ({ selections, sequences, overrideIdsToNodeP
                 setCodeValues,
                 clientId,
             });
+            return (_a = promise === null || promise === void 0 ? void 0 : promise.then(() => true)) !== null && _a !== void 0 ? _a : null;
         }
         case 'sequence-prop':
         case 'sequence-effect-prop':

package/dist/components/Timeline/duplicate-selected-timeline-item.d.ts

@@ -1,6 +1,7 @@
 import type { SequenceNodePathInfo } from '../../helpers/get-timeline-sequence-sort-key';
+import type { ConfirmationDialogFunction } from '../ConfirmationDialog-types';
 import type { TimelineSelection } from './TimelineSelection';
-export declare const duplicateSequencesFromSource: (nodePathInfos: readonly SequenceNodePathInfo[]) => Promise<void>;
+export declare const duplicateSequencesFromSource: (nodePathInfos: readonly SequenceNodePathInfo[], confirm: ConfirmationDialogFunction) => Promise<void>;
 export declare const isDuplicatableSequenceRowSelection: (selection: TimelineSelection) => selection is {
     readonly nodePathInfo: SequenceNodePathInfo;
 } & {
@@ -8,6 +9,7 @@ export declare const isDuplicatableSequenceRowSelection: (selection: TimelineSel
 } & {
     type: "sequence";
 };
-export declare const duplicateSelectedTimelineItems: ({ selections, }: {
+export declare const duplicateSelectedTimelineItems: ({ selections, confirm, }: {
     selections: readonly TimelineSelection[];
+    confirm: ConfirmationDialogFunction;
 }) => Promise<void> | null;

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

@@ -3,22 +3,26 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.duplicateSelectedTimelineItems = exports.isDuplicatableSequenceRowSelection = exports.duplicateSequencesFromSource = void 0;
 const call_api_1 = require("../call-api");
 const NotificationCenter_1 = require("../Notifications/NotificationCenter");
-const confirmDuplicatingProgrammaticallyDuplicatedSequences = (nodePathInfos) => {
+const confirmDuplicatingProgrammaticallyDuplicatedSequences = (nodePathInfos, confirm) => {
     if (nodePathInfos.length === 0) {
-        return true;
+        return Promise.resolve(true);
     }
     if (nodePathInfos.length === 1) {
         const [nodePathInfo] = nodePathInfos;
-        const singleDuplicatedSequenceMessage = 'This sequence is programmatically duplicated ' +
-            nodePathInfo.numberOfSequencesWithThisNodePath +
-            ' times in the code. Duplicating inserts another copy. Continue?';
-        // eslint-disable-next-line no-alert -- native confirm before applying duplicate codemod in .map callbacks
-        return window.confirm(singleDuplicatedSequenceMessage);
+        return confirm({
+            title: 'Duplicate sequence?',
+            message: 'This sequence is programmatically duplicated ' +
+                nodePathInfo.numberOfSequencesWithThisNodePath +
+                ' times in the code. Duplicating inserts another copy. Continue?',
+            confirmLabel: 'Duplicate',
+        });
     }
-    const multipleDuplicatedSequencesMessage = nodePathInfos.length +
-        ' selected sequences are programmatically duplicated in the code. Duplicating inserts another copy of each. Continue?';
-    // eslint-disable-next-line no-alert -- native confirm before applying duplicate codemod in .map callbacks
-    return window.confirm(multipleDuplicatedSequencesMessage);
+    return confirm({
+        title: 'Duplicate sequences?',
+        message: nodePathInfos.length +
+            ' selected sequences are programmatically duplicated in the code. Duplicating inserts another copy of each. Continue?',
+        confirmLabel: 'Duplicate',
+    });
 };
 const duplicateSequence = (nodePathInfo) => {
     const nodePath = nodePathInfo.sequenceSubscriptionKey;
@@ -27,40 +31,41 @@ const duplicateSequence = (nodePathInfo) => {
         nodePath: nodePath.nodePath,
     });
 };
-const duplicateSequencesFromSource = (nodePathInfos) => {
+const duplicateSequencesFromSource = (nodePathInfos, confirm) => {
     const programmaticallyDuplicated = nodePathInfos.filter((nodePathInfo) => nodePathInfo.numberOfSequencesWithThisNodePath > 1);
     const regular = nodePathInfos.filter((nodePathInfo) => nodePathInfo.numberOfSequencesWithThisNodePath <= 1);
-    const toDuplicate = [...regular];
-    if (programmaticallyDuplicated.length === 0 ||
-        confirmDuplicatingProgrammaticallyDuplicatedSequences(programmaticallyDuplicated)) {
-        toDuplicate.push(...programmaticallyDuplicated);
-    }
-    if (toDuplicate.length === 0) {
-        return Promise.resolve();
-    }
-    return Promise.all(toDuplicate.map(duplicateSequence))
-        .then((results) => {
-        const failedResult = results.find((result) => !result.success);
-        if (failedResult && !failedResult.success) {
-            (0, NotificationCenter_1.showNotification)(failedResult.reason, 4000);
-            return;
+    return confirmDuplicatingProgrammaticallyDuplicatedSequences(programmaticallyDuplicated, confirm).then((shouldDuplicateProgrammaticSequences) => {
+        const toDuplicate = [...regular];
+        if (shouldDuplicateProgrammaticSequences) {
+            toDuplicate.push(...programmaticallyDuplicated);
+        }
+        if (toDuplicate.length === 0) {
+            return Promise.resolve();
         }
-        (0, NotificationCenter_1.showNotification)(toDuplicate.length === 1
-            ? 'Duplicated sequence in source file'
-            : 'Duplicated sequences in source files', 2000);
-    })
-        .catch((err) => {
-        (0, NotificationCenter_1.showNotification)(err.message, 4000);
+        return Promise.all(toDuplicate.map(duplicateSequence))
+            .then((results) => {
+            const failedResult = results.find((result) => !result.success);
+            if (failedResult && !failedResult.success) {
+                (0, NotificationCenter_1.showNotification)(failedResult.reason, 4000);
+                return;
+            }
+            (0, NotificationCenter_1.showNotification)(toDuplicate.length === 1
+                ? 'Duplicated sequence in source file'
+                : 'Duplicated sequences in source files', 2000);
+        })
+            .catch((err) => {
+            (0, NotificationCenter_1.showNotification)(err.message, 4000);
+        });
     });
 };
 exports.duplicateSequencesFromSource = duplicateSequencesFromSource;
 const isDuplicatableSequenceRowSelection = (selection) => selection.type === 'sequence';
 exports.isDuplicatableSequenceRowSelection = isDuplicatableSequenceRowSelection;
-const duplicateSelectedTimelineItems = ({ selections, }) => {
+const duplicateSelectedTimelineItems = ({ selections, confirm, }) => {
     const sequenceSelections = selections.filter(exports.isDuplicatableSequenceRowSelection);
     if (sequenceSelections.length === 0) {
         return null;
     }
-    return (0, exports.duplicateSequencesFromSource)(sequenceSelections.map((selection) => selection.nodePathInfo));
+    return (0, exports.duplicateSequencesFromSource)(sequenceSelections.map((selection) => selection.nodePathInfo), confirm);
 };
 exports.duplicateSelectedTimelineItems = duplicateSelectedTimelineItems;

package/dist/components/Timeline/get-bounded-keyframe-drag-delta.d.ts

@@ -0,0 +1,8 @@
+export type TimelineKeyframeDragBoundsTarget = {
+    readonly displayFrame: number;
+};
+export declare const getBoundedKeyframeDragDelta: ({ delta, durationInFrames, targets, }: {
+    readonly delta: number;
+    readonly durationInFrames: number;
+    readonly targets: readonly TimelineKeyframeDragBoundsTarget[];
+}) => number;

package/dist/components/Timeline/get-bounded-keyframe-drag-delta.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getBoundedKeyframeDragDelta = void 0;
+const getBoundedKeyframeDragDelta = ({ delta, durationInFrames, targets, }) => {
+    if (targets.length === 0 || durationInFrames <= 0) {
+        return 0;
+    }
+    const minDelta = Math.max(...targets.map((target) => -target.displayFrame));
+    const maxDelta = Math.min(...targets.map((target) => durationInFrames - 1 - target.displayFrame));
+    return Math.min(Math.max(delta, minDelta), maxDelta);
+};
+exports.getBoundedKeyframeDragDelta = getBoundedKeyframeDragDelta;

package/dist/components/Timeline/get-keyframe-navigation.d.ts

@@ -1,9 +1,9 @@
 export declare const getPreviousKeyframeDisplayFrame: (keyframes: readonly {
     frame: number;
-}[], currentDisplayFrame: number) => number | null;
+}[], currentDisplayFrame: number, durationInFrames: number) => number | null;
 export declare const getNextKeyframeDisplayFrame: (keyframes: readonly {
     frame: number;
-}[], currentDisplayFrame: number) => number | null;
+}[], currentDisplayFrame: number, durationInFrames: number) => number | null;
 export declare const hasKeyframeAtSourceFrame: (keyframes: readonly {
     frame: number;
 }[], sourceFrame: number) => boolean;

package/dist/components/Timeline/get-keyframe-navigation.js

@@ -1,23 +1,31 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.hasKeyframeAtSourceFrame = exports.getNextKeyframeDisplayFrame = exports.getPreviousKeyframeDisplayFrame = void 0;
-const getPreviousKeyframeDisplayFrame = (keyframes, currentDisplayFrame) => {
+const isKeyframeInTimelineRange = (frame, durationInFrames) => {
+    return frame >= 0 && frame < durationInFrames;
+};
+const getPreviousKeyframeDisplayFrame = (keyframes, currentDisplayFrame, durationInFrames) => {
     let previous = null;
     for (const keyframe of keyframes) {
-        if (keyframe.frame < currentDisplayFrame) {
+        if (isKeyframeInTimelineRange(keyframe.frame, durationInFrames) &&
+            keyframe.frame < currentDisplayFrame &&
+            (previous === null || keyframe.frame > previous)) {
             previous = keyframe.frame;
         }
     }
     return previous;
 };
 exports.getPreviousKeyframeDisplayFrame = getPreviousKeyframeDisplayFrame;
-const getNextKeyframeDisplayFrame = (keyframes, currentDisplayFrame) => {
+const getNextKeyframeDisplayFrame = (keyframes, currentDisplayFrame, durationInFrames) => {
+    let next = null;
     for (const keyframe of keyframes) {
-        if (keyframe.frame > currentDisplayFrame) {
-            return keyframe.frame;
+        if (isKeyframeInTimelineRange(keyframe.frame, durationInFrames) &&
+            keyframe.frame > currentDisplayFrame &&
+            (next === null || keyframe.frame < next)) {
+            next = keyframe.frame;
         }
     }
-    return null;
+    return next;
 };
 exports.getNextKeyframeDisplayFrame = getNextKeyframeDisplayFrame;
 const hasKeyframeAtSourceFrame = (keyframes, sourceFrame) => {

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

@@ -132,14 +132,15 @@ const resetSelectedTimelineProps = ({ selections, sequences, overrideIdsToNodePa
             clientId,
             undoLabel: sequencePropTargets.length > 1
                 ? 'Reset selected sequence props'
-                : null,
+                : 'Reset sequence prop',
             redoLabel: sequencePropTargets.length > 1
                 ? 'Reapply selected sequence props'
-                : null,
+                : 'Reapply sequence prop',
         }));
     }
     for (const target of effectPropTargets) {
         resetPromises.push((0, save_effect_prop_1.saveEffectProp)({
+            type: 'value',
             fileName: target.fileName,
             nodePath: target.nodePath,
             effectIndex: target.effectIndex,

package/dist/components/Timeline/save-effect-prop.d.ts

@@ -1,13 +1,24 @@
+import { type EffectClipboardParam } from '@remotion/studio-shared';
 import type { SequencePropsSubscriptionKey, SequenceSchema } from 'remotion';
 import type { SetCodeValues } from './save-sequence-prop';
-export declare const saveEffectProp: ({ fileName, nodePath, effectIndex, fieldKey, value, defaultValue, schema, setCodeValues, clientId, }: {
+type SaveEffectPropBase = {
     fileName: string;
     nodePath: SequencePropsSubscriptionKey;
     effectIndex: number;
     fieldKey: string;
-    value: unknown;
     defaultValue: string | null;
     schema: SequenceSchema;
     setCodeValues: SetCodeValues;
     clientId: string;
-}) => Promise<void>;
+};
+type SaveEffectPropValue = SaveEffectPropBase & {
+    type: 'value';
+    value: unknown;
+};
+type SaveEffectPropEffectParam = SaveEffectPropBase & {
+    type: 'effect-param';
+    effectParam: EffectClipboardParam;
+};
+type SaveEffectPropInput = SaveEffectPropValue | SaveEffectPropEffectParam;
+export declare const saveEffectProp: (input: SaveEffectPropInput) => Promise<void>;
+export {};