@remotion/studio 4.0.520 → 4.0.522

package/dist/components/Timeline/TimelineSequenceItem.js

@@ -64,12 +64,14 @@ const use_select_asset_1 = require("../use-select-asset");
 const disable_sequence_interactivity_1 = require("./disable-sequence-interactivity");
 const duplicate_selected_timeline_item_1 = require("./duplicate-selected-timeline-item");
 const get_sequence_context_menu_items_1 = require("./get-sequence-context-menu-items");
+const get_sequence_split_menu_item_1 = require("./get-sequence-split-menu-item");
 const imperative_state_1 = require("./imperative-state");
 const save_sequence_prop_1 = require("./save-sequence-prop");
 const timeline_asset_link_1 = require("./timeline-asset-link");
 const TimelineDuplicateCount_1 = require("./TimelineDuplicateCount");
 const TimelineExpandArrowButton_1 = require("./TimelineExpandArrowButton");
 const TimelineExpandedSection_1 = require("./TimelineExpandedSection");
+const TimelineLayerChildren_1 = require("./TimelineLayerChildren");
 const TimelineLayerEye_1 = require("./TimelineLayerEye");
 const TimelineMediaInfo_1 = require("./TimelineMediaInfo");
 const TimelineRowChrome_1 = require("./TimelineRowChrome");
@@ -704,6 +706,14 @@ const TimelineSequenceItemInner = ({ afterDropLineOffset, connectedCompositions,
                 onDuplicateSelectedSequences,
             });
         }
+        const splitMenuItem = (0, get_sequence_split_menu_item_1.getSequenceSplitMenuItem)({
+            nodePathInfo,
+            sequence,
+            propStatuses: propStatusesForOverride,
+            splitFrame: (0, imperative_state_1.getCurrentFrame)(),
+            canEditSource: previewInteractive && Boolean(validatedLocation === null || validatedLocation === void 0 ? void 0 : validatedLocation.source),
+            hasMultipleSelection: selected && selectedItems.length > 1,
+        });
         const freezeFrameMenuItem = (0, use_sequence_freeze_frame_menu_item_1.getSequenceFreezeFrameMenuItem)({
             clientId: previewInteractive && previewServerState.type === 'connected'
                 ? previewServerState.clientId
@@ -819,6 +829,7 @@ const TimelineSequenceItemInner = ({ afterDropLineOffset, connectedCompositions,
                         subMenu: null,
                         value: 'rename-sequence',
                     },
+                    ...(splitMenuItem ? [splitMenuItem] : []),
                     ...(freezeFrameMenuItem ? [freezeFrameMenuItem] : []),
                 ]
                 : [],
@@ -838,7 +849,7 @@ const TimelineSequenceItemInner = ({ afterDropLineOffset, connectedCompositions,
         isProgrammaticallyDuplicated,
         mediaSrc,
         nodePath,
-        nodePathInfo === null || nodePathInfo === void 0 ? void 0 : nodePathInfo.supportsEffects,
+        nodePathInfo,
         onAddEffect,
         onCrop,
         onRotate,
@@ -858,6 +869,7 @@ const TimelineSequenceItemInner = ({ afterDropLineOffset, connectedCompositions,
         selectAsset,
         selectable,
         selected,
+        selectedItems.length,
         selectedSequenceNodePathInfos,
         sequence,
         sequenceFrameOffset,
@@ -923,7 +935,7 @@ const TimelineSequenceItemInner = ({ afterDropLineOffset, connectedCompositions,
             clientId: previewServerState.clientId,
         });
     }, [canDropEffect, nodePath, previewServerState, validatedLocation]);
-    const trackRow = (jsx_runtime_1.jsx(TimelineRowChrome_1.TimelineRowChrome, { depth: nestedDepth, eye: canToggleVisibility ? (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEye, { type: sequence.type === 'audio' ? 'speaker' : 'eye', hidden: isItemHidden, onInvoked: onToggleVisibility })) : (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEyeSpacer, {})), arrow: jsx_runtime_1.jsx(TimelineExpandArrowButton_1.TimelineExpandArrowSpacer, {}), style: rowStyle, selected: selected, selectable: selectable, onSelect: onSelect, showSelectedBackground: true, containsSelection: containsSelection, hovered: hovered, outerHeight: outerHeight, onDragLeave: canDropEffect ? onEffectDragLeave : undefined, onDragOver: canDropEffect ? onEffectDragOver : undefined, onDrop: canDropEffect ? onEffectDrop : undefined, onDoubleClick: canHandleSequenceDoubleClick ? onSequenceDoubleClick : undefined, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: jsx_runtime_1.jsxs("div", { style: labelContainerStyle, children: [connectedCompositions.length > 0 ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
+    const trackRow = (jsx_runtime_1.jsx(TimelineRowChrome_1.TimelineRowChrome, { depth: nestedDepth, eye: canToggleVisibility ? (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEye, { type: sequence.type === 'audio' ? 'speaker' : 'eye', hidden: isItemHidden, onInvoked: onToggleVisibility })) : (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEyeSpacer, {})), arrow: jsx_runtime_1.jsx(TimelineLayerChildren_1.TimelineLayerChildrenToggle, { sequence: sequence }), style: rowStyle, selected: selected, selectable: selectable, onSelect: onSelect, showSelectedBackground: true, containsSelection: containsSelection, hovered: hovered, outerHeight: outerHeight, onDragLeave: canDropEffect ? onEffectDragLeave : undefined, onDragOver: canDropEffect ? onEffectDragOver : undefined, onDrop: canDropEffect ? onEffectDrop : undefined, onDoubleClick: canHandleSequenceDoubleClick ? onSequenceDoubleClick : undefined, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: jsx_runtime_1.jsxs("div", { style: labelContainerStyle, children: [connectedCompositions.length > 0 ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
                         jsx_runtime_1.jsx(CompositionOrStillIcon_1.CompositionOrStillIcon, { color: (0, TimelineSelection_1.getTimelineColor)(false, false), composition: connectedCompositions[0], style: connectedCompositionIconStyle }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 })
                     ] })) : null, jsx_runtime_1.jsx(TimelineSequenceName_1.TimelineSequenceName, { displayName: timelineDisplayName, fallbackDisplayName: fallbackDisplayName, selected: selected, containsSelection: containsSelection, editing: isRenaming, onCancelEditing: onCancelRenaming, onSaveName: onSaveName }), hasExpandableContent && nodePathInfo !== null ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
                         jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }), jsx_runtime_1.jsx(TimelineSequenceExpandArrow, { disabled: !previewInteractive, isExpanded: isExpanded, nodePathInfo: nodePathInfo, sequence: sequence })

package/dist/components/Timeline/TimelineSequenceRightEdgeDragHandle.d.ts

@@ -7,6 +7,7 @@ export declare const timelineSequenceFromDragSnapThresholdPx = 10;
 export type TimelineSequenceDurationDragTarget = {
     readonly fileName: string;
     readonly initialDuration: number;
+    readonly maximumDuration: number;
     readonly minimumDuration: number;
     readonly nodePath: SequencePropsSubscriptionKey;
     readonly schema: InteractivitySchema;
@@ -24,6 +25,8 @@ export type TimelineSequenceLeftEdgeDragTarget = {
 };
 export type TimelineSequenceFromDragTarget = {
     readonly canSnapToTimelineStart: boolean;
+    readonly minimumDeltaFrames: number;
+    readonly initialTimelineStart: number;
     readonly effectKeyframes: TimelineSequenceEffectKeyframeDragTarget[];
     readonly fileName: string;
     readonly initialFrom: number;
@@ -49,9 +52,10 @@ export declare const canResizeTimelineSequenceDuration: ({ sequence, status, }:
     readonly status: CanUpdateSequencePropStatus | undefined;
 }) => boolean;
 export declare const isTimelineSequenceLeftEdgeDraggable: (sequence: TSequence) => boolean;
-export declare const getTimelineSequenceDurationDragValue: ({ initialDuration, deltaFrames, minimumDuration, }: {
+export declare const getTimelineSequenceDurationDragValue: ({ initialDuration, deltaFrames, maximumDuration, minimumDuration, }: {
     readonly initialDuration: number;
     readonly deltaFrames: number;
+    readonly maximumDuration: number;
     readonly minimumDuration?: number | undefined;
 }) => number;
 export declare const getTimelineSequenceLeftEdgeDragDelta: ({ initialDuration, initialTrimBefore, deltaFrames, playbackRate, minimumDuration, }: {
@@ -85,8 +89,9 @@ export declare const getTimelineSequenceFromDragValue: ({ initialFrom, deltaFram
     readonly initialFrom: number;
     readonly deltaFrames: number;
 }) => number;
-export declare const getTimelineSequenceFromDragDelta: ({ deltaFrames, pxPerFrame, snappingEnabled, targets, }: {
+export declare const getTimelineSequenceFromDragDelta: ({ deltaFrames, timelineDurationInFrames, pxPerFrame, snappingEnabled, targets, }: {
     readonly deltaFrames: number;
+    readonly timelineDurationInFrames: number;
     readonly pxPerFrame: number;
     readonly snappingEnabled: boolean;
     readonly targets: readonly TimelineSequenceFromDragTarget[];
@@ -102,12 +107,13 @@ export declare const getTimelineSequenceFromDragKeyframeMoves: ({ targets, delta
     readonly effectKeyframes: MoveEffectKeyframeChange[];
     readonly sequenceKeyframes: MoveSequenceKeyframeChange[];
 };
-export declare const getTimelineSequenceDurationDragTargets: ({ draggedNodePathInfo, selectedItems, sequences, overrideIdsToNodePaths, propStatuses, }: {
+export declare const getTimelineSequenceDurationDragTargets: ({ draggedNodePathInfo, selectedItems, sequences, overrideIdsToNodePaths, propStatuses, timelineDurationInFrames, }: {
     readonly draggedNodePathInfo: SequenceNodePathInfo;
     readonly selectedItems: readonly import("@remotion/canvas").CanvasSelectionItem[];
     readonly sequences: TSequence[];
     readonly overrideIdsToNodePaths: OverrideIdToNodePaths;
     readonly propStatuses: PropStatuses;
+    readonly timelineDurationInFrames: number;
 }) => TimelineSequenceDurationDragTarget[] | null;
 export declare const getTimelineSequenceLeftEdgeDragTargets: ({ draggedNodePathInfo, selectedItems, sequences, overrideIdsToNodePaths, propStatuses, }: {
     readonly draggedNodePathInfo: SequenceNodePathInfo;
@@ -128,6 +134,8 @@ export declare const TimelineSequenceLeftEdgeDragHandle: React.NamedExoticCompon
     readonly windowWidth: number;
     readonly timelineDurationInFrames: number;
     readonly onDragEnd: (wasDragged: boolean) => void;
+    readonly onSelect: (interaction?: import("@remotion/canvas").CanvasSelectionInteraction | undefined) => void;
+    readonly selected: boolean;
 }>;
 export declare const useTimelineSequenceFromDrag: ({ nodePathInfo, windowWidth, timelineDurationInFrames, onDragEnd, }: {
     readonly nodePathInfo: SequenceNodePathInfo | null;
@@ -142,5 +150,7 @@ export declare const TimelineSequenceRightEdgeDragHandle: React.NamedExoticCompo
     readonly windowWidth: number;
     readonly timelineDurationInFrames: number;
     readonly onDragEnd: (wasDragged: boolean) => void;
+    readonly onSelect: (interaction?: import("@remotion/canvas").CanvasSelectionInteraction | undefined) => void;
+    readonly selected: boolean;
 }>;
 export {};