@linker-design-plus/timeline-track 2.0.2 → 2.0.4

package/README.md

@@ -120,7 +120,7 @@ await timeline.refreshAllClipThumbnails();
 - `setZoom(zoom)` / `getZoom()`
 - `setSpeed(speed)` / `getSpeed()`
 - `addClip(config)` / `addClips(configs)`
-- `updateClip(clipId, updates)` / `removeClip(clipId)`
+- `updateClip(clipId, updates)` / `removeClip(clipId)` / `removeClipsByExternalId(externalId)`
 - `selectClip(clipId)` / `clearSelection()` / `getSelectedClip()`
 - `canSeparateClipAudio(clipId)` / `separateClipAudio(clipId)` / `canRestoreClipAudio(clipId)` / `restoreClipAudio(clipId)`
 - `splitCurrentClip()` / `removeClipGaps()` / `fitZoom()`

package/dist/components/timeline/ManagedPlayhead.d.ts

@@ -1,20 +1,33 @@
 import type { TimeMs, Theme } from '../../core/models/types';
 export declare class ManagedPlayhead {
+    private static readonly SVG_NS;
+    private static readonly VISUAL_WIDTH;
+    private static readonly HANDLE_HEIGHT;
+    private static readonly HANDLE_LINE_START;
+    private static readonly LINE_WIDTH;
+    private static readonly LINE_HIT_WIDTH;
+    private static readonly END_CAP_WIDTH;
+    private static readonly END_CAP_HEIGHT;
+    private static readonly AUTO_SCROLL_EDGE_THRESHOLD;
+    private static readonly AUTO_SCROLL_MAX_SPEED;
     private readonly container;
-    private readonly lineElement;
-    private readonly handleElement;
+    private readonly visualElement;
+    private readonly lineHitAreaElement;
     private readonly theme;
     private readonly onTimeChange;
+    private readonly onHorizontalAutoScroll?;
     private currentTime;
     private zoom;
     private scrollLeft;
     private height;
     private isDragging;
     private hasBoundGlobalPointerListeners;
+    private edgeAutoScrollAnimationFrameId;
+    private lastPointerClientX;
     private handleGlobalPointerMove;
     private handleGlobalPointerEnd;
     private handleVisibilityChange;
-    constructor(container: HTMLElement, initialTime: TimeMs, zoom: number, height: number, theme: Theme, onTimeChange: (time: TimeMs, mode?: 'seek' | 'scrub') => void);
+    constructor(container: HTMLElement, initialTime: TimeMs, zoom: number, height: number, theme: Theme, onTimeChange: (time: TimeMs, mode?: 'seek' | 'scrub') => void, onHorizontalAutoScroll?: (nextScrollLeft: number) => number);
     setCurrentTime(time: TimeMs): void;
     setTime(time: TimeMs): void;
     setZoom(zoom: number): void;
@@ -26,5 +39,16 @@ export declare class ManagedPlayhead {
     private bindGlobalPointerListeners;
     private unbindGlobalPointerListeners;
     private updateTimeFromClientX;
+    private updateEdgeAutoScrollState;
+    private calculateHorizontalAutoScrollVelocity;
+    private startEdgeAutoScroll;
+    private stopEdgeAutoScroll;
+    private readonly handleEdgeAutoScrollFrame;
     private render;
+    private renderVisual;
+    private createHandleShadowPath;
+    private createHandleBadgePath;
+    private createGripLines;
+    private createMainLine;
+    private createEndCap;
 }

package/dist/components/track/Track.d.ts

@@ -1,5 +1,6 @@
 import Konva from 'konva';
 import { Clip as ClipType, ClipStateUpdate, TrackConfig, TimeMs, Theme, TrackType } from '../../core/models';
+import type { MultiDragMoveRequest } from '../../core/tracks/timelineTrackBridge';
 export declare class Track {
     private static readonly DEFAULT_DRAG_ACTIVATION_THRESHOLD;
     private static readonly DEFAULT_CLIP_SNAP_THRESHOLD;
@@ -7,7 +8,9 @@ export declare class Track {
     private static readonly AUTO_SCROLL_MAX_SPEED;
     private layer;
     private trackGroup;
+    private dragOverlayLayer;
     private dropPreviewGroup;
+    private dropPreviewClips;
     private config;
     private theme;
     private trackType;
@@ -19,6 +22,9 @@ export declare class Track {
     private trackHeight;
     private selectedClip;
     private hasSelectedClip;
+    private selectedClipIds;
+    private multiDragOriginalPositions;
+    private promotedClipParents;
     private interactionState;
     private isVisualUpdate;
     private onClipUpdate;
@@ -37,6 +43,11 @@ export declare class Track {
     private onClearDropPreview?;
     private onClearSelection?;
     private onSnapGuideChange?;
+    private onClipToggleSelection?;
+    private onSetSingleSelection?;
+    private getMultiDragClipIds?;
+    private onMultiDragMove?;
+    private onMultiDragInteractionEnd?;
     private resolveSnapTargetClips?;
     private readonly dragActivationThreshold;
     private enableClipSnap;
@@ -44,9 +55,10 @@ export declare class Track {
     private handleGlobalPointerMove;
     private handleGlobalPointerEnd;
     private handleWindowBlur;
-    constructor(layer: Konva.Layer, config: TrackConfig, trackType: TrackType, zoom: number, trackY: number, trackHeight: number, theme: Theme, onClipUpdate: (clip: ClipType, originalClip?: ClipType, clipUpdates?: ClipStateUpdate[]) => void, onClipAdd: (clip: ClipType) => void, onClipRemove: (clipId: string) => void, onClipSplit: (clip1: ClipType, clip2: ClipType) => void, onClipSelect: (clip: ClipType) => void, onTimeJump: (time: TimeMs) => void, onHorizontalDragAutoScroll?: (nextScrollLeft: number) => number, onClipOverlap?: (clip: ClipType, currentTrackId: string) => void, onClipCrossTrackPreview?: (clip: ClipType, targetTrackY: number, currentTrackId: string) => 'self' | 'external' | 'clear', onClipCrossTrack?: (clip: ClipType, originalClip: ClipType | null, targetTrackY: number, currentTrackId: string) => boolean | void, onClearDropPreview?: () => void, onClearSelection?: () => void, onSnapGuideChange?: (guideTime: TimeMs | null) => void, dragActivationThreshold?: number, enableClipSnap?: boolean, clipSnapThreshold?: number);
+    constructor(layer: Konva.Layer, config: TrackConfig, trackType: TrackType, zoom: number, trackY: number, trackHeight: number, theme: Theme, onClipUpdate: (clip: ClipType, originalClip?: ClipType, clipUpdates?: ClipStateUpdate[]) => void, onClipAdd: (clip: ClipType) => void, onClipRemove: (clipId: string) => void, onClipSplit: (clip1: ClipType, clip2: ClipType) => void, onClipSelect: (clip: ClipType) => void, onTimeJump: (time: TimeMs) => void, onHorizontalDragAutoScroll?: (nextScrollLeft: number) => number, onClipOverlap?: (clip: ClipType, currentTrackId: string) => void, onClipCrossTrackPreview?: (clip: ClipType, targetTrackY: number, currentTrackId: string) => 'self' | 'external' | 'clear', onClipCrossTrack?: (clip: ClipType, originalClip: ClipType | null, targetTrackY: number, currentTrackId: string) => boolean | void, onClearDropPreview?: () => void, onClearSelection?: () => void, onSnapGuideChange?: (guideTime: TimeMs | null) => void, onClipToggleSelection?: (clipId: string) => void, onSetSingleSelection?: (clipId: string) => void, getMultiDragClipIds?: (clipId: string) => string[] | null, onMultiDragMove?: (request: MultiDragMoveRequest) => boolean | void, onMultiDragInteractionEnd?: () => void, dragActivationThreshold?: number, enableClipSnap?: boolean, clipSnapThreshold?: number);
     private initClips;
     private ensureDropPreviewGroup;
+    private createDropPreviewRect;
     private showDropPreview;
     private hideDropPreview;
     private initEventListeners;
@@ -55,6 +67,8 @@ export declare class Track {
     private handleVisibilityChange;
     private readonly handleEdgeAutoScrollFrame;
     private handleTrackBackgroundClick;
+    private handleTrackBackgroundMouseDown;
+    updateClipSelection(clipId: string, isSelected: boolean): void;
     private createClipGroup;
     private handleClipClick;
     private handleClipMouseDown;
@@ -85,6 +99,10 @@ export declare class Track {
     setScrollLeft(scrollLeft: number): void;
     private updateClipVisibility;
     setTrackY(trackY: number): void;
+    setTrackStackOrder(order: number): void;
+    setDragOverlayLayer(layer: Konva.Layer | null): void;
+    setClipsDragOverlayActive(clipIds: string[], isActive: boolean): void;
+    clearClipDragOverlay(): void;
     getTrackType(): TrackType;
     render(shouldBatchDraw?: boolean): void;
     private getTrackBackgroundFill;
@@ -94,12 +112,16 @@ export declare class Track {
     updateSelectionVisual(selectedClipId: string | null): void;
     selectClip(clipId: string): void;
     private applySelectionVisual;
+    private syncSelectionState;
     splitSelectedClip(time: TimeMs): void;
     removeClipGaps(): void;
     getTrackGroup(): Konva.Group;
     getId(): string;
+    updateClipPosition(clipId: string, newStartTime: TimeMs, isFinal: boolean, previewOffsetY?: number): void;
+    updateClipPositionFinal(clipId: string, newStartTime: TimeMs): void;
     setTrackHeight(height: number): void;
     showClipDropPreview(clip: ClipType): void;
+    showClipDropPreviews(clips: ClipType[]): void;
     clearClipDropPreview(): void;
     getRole(): 'primary' | 'normal';
     setClipSnapEnabled(enabled: boolean): void;
@@ -113,6 +135,9 @@ export declare class Track {
     private buildResizeRightPreviewClip;
     private applyClipSnap;
     private applyPreviewClipState;
+    private setClipDragOverlayActive;
+    private resolveClipRenderY;
+    private getPromotedClipParents;
     private updateSnapGuideLine;
     private updateEdgeAutoScrollState;
     private calculateHorizontalAutoScrollVelocity;

package/dist/components/track/trackInteractionState.d.ts

@@ -35,7 +35,21 @@ export interface DraggingResizeRightTrackInteractionState {
     kind: 'draggingResizeRight';
     context: TrackInteractionContext;
 }
-export type TrackInteractionState = IdleTrackInteractionState | PressedTrackInteractionState | DraggingMoveTrackInteractionState | DraggingResizeLeftTrackInteractionState | DraggingResizeRightTrackInteractionState;
+export interface BoxSelectingTrackInteractionState {
+    kind: 'boxSelecting';
+    context: {
+        startClientX: number;
+        startClientY: number;
+        startLocalX: number;
+        startLocalY: number;
+        currentClientX: number;
+        currentClientY: number;
+        currentLocalX: number;
+        currentLocalY: number;
+        additive: boolean;
+    };
+}
+export type TrackInteractionState = IdleTrackInteractionState | PressedTrackInteractionState | DraggingMoveTrackInteractionState | DraggingResizeLeftTrackInteractionState | DraggingResizeRightTrackInteractionState | BoxSelectingTrackInteractionState;
 export type TrackInteractionEvent = {
     type: 'POINTER_DOWN';
     operation: TrackPointerOperation;
@@ -58,6 +72,21 @@ export type TrackInteractionEvent = {
     type: 'SCROLL_LEFT_CHANGED';
 } | {
     type: 'POINTER_UP' | 'VISIBILITY_HIDDEN' | 'WINDOW_BLUR' | 'CANCEL';
+} | {
+    type: 'BOX_SELECT_START';
+    clientX: number;
+    clientY: number;
+    localX: number;
+    localY: number;
+    additive: boolean;
+} | {
+    type: 'BOX_SELECT_MOVE';
+    clientX: number;
+    clientY: number;
+    localX: number;
+    localY: number;
+} | {
+    type: 'BOX_SELECT_END';
 };
 export interface TrackInteractionTransitionEffects {
     bindGlobalListeners?: boolean;
@@ -77,3 +106,10 @@ export declare function getTrackInteractionContext(state: TrackInteractionState
 export declare function getTrackInteractionOperation(state: TrackInteractionState | null | undefined): TrackPointerOperation | null;
 export declare function getTrackInteractionCursor(state: TrackInteractionState | null | undefined): 'ew-resize' | 'grabbing' | null;
 export declare function transitionTrackInteraction(state: TrackInteractionState, event: TrackInteractionEvent): TrackInteractionTransitionResult;
+export declare function isBoxSelecting(state: TrackInteractionState | null | undefined): boolean;
+export declare function getBoxSelectRect(state: TrackInteractionState | null | undefined): {
+    x1: number;
+    y1: number;
+    x2: number;
+    y2: number;
+} | null;

package/dist/core/controllers/timelineDurationController.d.ts

@@ -8,6 +8,7 @@ interface SyncTrackDurationChangeOptions {
     setTimelineDuration: (duration: TimeMs) => void;
     emitTrackDurationChange: (duration: TimeMs) => void;
 }
+export declare function calculateTrackTimelineExtent(clips: Pick<Clip, 'startTime' | 'duration'>[]): TimeMs;
 export declare function calculateTrackTotalDuration(clips: Pick<Clip, 'startTime' | 'duration'>[]): TimeMs;
 export declare function calculateTimelineDuration(trackDuration: TimeMs): TimeMs;
 export declare function syncTrackDurationChange(options: SyncTrackDurationChangeOptions): TimeMs;

package/dist/core/controllers/timelineTrackMutationController.d.ts

@@ -29,6 +29,7 @@ interface ClipMutationSideEffectHandlers {
     updateCanPlayState?: () => void;
     updateTrackInfoPanel?: () => void;
     handleClipChange?: () => void;
+    cleanupEmptyTracks?: () => void;
 }
 interface ClipMoveSideEffectHandlers {
     notifySelectionChange: () => void;

package/dist/core/facade/timelineManager.d.ts

@@ -18,7 +18,13 @@ export declare class TimelineManager {
     private headerLayer;
     private backgroundLayer;
     private trackLayer;
+    private dragOverlayLayer;
     private snapGuideLayer;
+    private selectionBoxLayer;
+    private selectionBoxRect;
+    private isBoxSelecting;
+    private boxSelectStartX;
+    private boxSelectStartY;
     private resizeObserver;
     private rootContainer;
     private layout;
@@ -31,6 +37,7 @@ export declare class TimelineManager {
     private verticalScrollbar;
     private isExecutingHistoryAction;
     private lastTrackDuration;
+    private lastEffectiveTrackDuration;
     private thumbnailProvider;
     private canPlay;
     private sourceLoadingCount;
@@ -57,6 +64,9 @@ export declare class TimelineManager {
     private readonly rootWheelListener;
     private mountManager;
     private pendingDraftData;
+    private selectionStore;
+    private multiDragSession;
+    private clipRemovalBatchDepth;
     constructor(config?: Partial<TimelineConfig>);
     private getTimelineStore;
     private getTimelineCommands;
@@ -136,6 +146,7 @@ export declare class TimelineManager {
     private cleanupEmptyTracks;
     private clearAllTrackDropPreviews;
     private showClipDropPreview;
+    private showClipDropPreviews;
     private ensureTrackInsertionPreviewLine;
     private refreshTrackInsertionPreview;
     private showTrackInsertionPreview;
@@ -237,6 +248,7 @@ export declare class TimelineManager {
     addClips(clipConfigs: ClipConfig[]): Promise<string[]>;
     private addClipInternal;
     removeClip(clipId: string): void;
+    removeClipsByExternalId(externalId: string): boolean;
     updateClip(clipId: string, updates: Partial<Clip>): void;
     splitClip(clipId: string, time: TimeMs): void;
     splitCurrentClip(): void;
@@ -307,11 +319,22 @@ export declare class TimelineManager {
      * @param clipId 目标片段的 ID
      */
     private notifySelectionChange;
+    private syncPrimarySelectionFromSelectionStore;
     selectClip(clipId: string, clip?: any): void;
     /**
      * 清空所有轨道的选中状态
      */
     clearSelection(): void;
+    getSelectedClipIds(): string[];
+    addToSelection(clipId: string): void;
+    removeFromSelection(clipId: string): void;
+    toggleSelection(clipId: string): void;
+    isClipSelected(clipId: string): boolean;
+    deleteSelectedClips(): void;
+    separateSelectedClipsAudio(): void;
+    selectAllClips(): void;
+    private emitSelectionChangeEvent;
+    private updateAllTracksSelectionVisual;
     /**
      * 滚动到指定片段
      * @param clipId 目标片段的 ID
@@ -330,6 +353,11 @@ export declare class TimelineManager {
      * @returns 当前选中的 clip，如果没有则返回 null
      */
     getSelectedClip(): Clip | null;
+    getSelectedClips(): Clip[];
+    canDeleteSelectedClips(): boolean;
+    getSelectedClipAudioAction(): 'separate' | 'restore' | null;
+    canToggleSelectedClipsAudio(): boolean;
+    toggleSelectedClipsAudio(): Promise<boolean>;
     getCurrentActiveClips(): ActiveClipPlaybackInfo[];
     getCurrentPlaybackPlan(): ResolvedPlaybackPlan;
     getPlaybackPlanAtTime(time: TimeMs): ResolvedPlaybackPlan;
@@ -349,10 +377,13 @@ export declare class TimelineManager {
      * @returns 是否成功删除了选中的 clip
      */
     removeSelectedClip(): boolean;
+    removeSelectedClips(): boolean;
     canSeparateClipAudio(clipId: string): boolean;
     canRestoreClipAudio(clipId: string): boolean;
+    private resolvePreferredSeparatedAudioTrackId;
     separateClipAudio(clipId: string): Promise<string | null>;
     restoreClipAudio(clipId: string): boolean;
+    private applySelectedClipAudioAction;
     /**
      * 将片段从一个轨道移动到另一个轨道
      * @param clipId 要移动的片段 ID
@@ -362,17 +393,60 @@ export declare class TimelineManager {
     moveClipToTrack(clipId: string, targetTrackId: string): boolean;
     private moveClipToTrackWithHistorySnapshot;
     /**
-     * 获取轨道内的总时长（包含空隙）
-     * @returns 从0到最后一个clip结束时间的总时长（毫秒）
+     * 获取轨道内的有效总时长（去除首尾空白）
+     * @returns 最早 clip 起点到最晚 clip 终点的时长（毫秒）
      */
     getTrackTotalDuration(): TimeMs;
     destroy(): void;
     /** 清除历史堆栈 */
     clearHistory(): void;
     private handleClipChange;
+    private withClipRemovalBatch;
+    private resolveClipIdsForExternalIdRemoval;
+    private shouldClearSelectionForClipIds;
+    private resolveSelectedClipAtTime;
+    private handleClipToggleSelection;
+    private handleSetSingleSelection;
+    private getMultiDragClipIds;
+    private handleMultiDragMove;
+    private normalizeTrackGroupStackOrder;
+    private elevateMultiDragTrackGroups;
+    private resolveMultiDragSessionTrackIds;
+    private resetMultiDragSession;
+    private handleMultiDragInteractionEnd;
+    private syncMultiDragOverlayState;
+    private clearMultiDragOverlayState;
+    private ensureMultiDragSession;
+    private haveSameClipIds;
+    private restoreDraggedClipSnapshot;
+    private syncMultiDragPeerClips;
+    private previewMultiDragCrossTrack;
+    private finalizeMultiDragCrossTrack;
+    private resolveTrackIndexDelta;
+    private resolveMultiDragTargetTrackId;
+    private resolveMultiDragPreviewTargetTrackId;
+    private buildMovedClipSnapshot;
+    private appendPreviewClip;
+    private resolveCrossTrackMoveDestination;
+    private resolveCrossTrackPreviewDestination;
+    private ensureTrackIdByRelativeIndex;
+    private findTrackIdByRelativeIndex;
+    private getTrackIdsByType;
+    private updateClipPositionWithHistory;
+    private updateClipPositionSilently;
+    private ensureSelectionBoxRect;
+    private showSelectionBoxRect;
+    private hideSelectionBoxRect;
+    private handleStageMouseDown;
+    private handleBoxSelectMove;
+    private handleBoxSelectEnd;
+    private isPointOnClip;
+    private getClipsIntersectingBox;
     private addClipToTrack;
     private cloneTrackSnapshot;
     private ensureTrackFromHistorySnapshot;
+    private getTrackRestoreAnchor;
+    private resolveTrackInsertionFromRestoreAnchor;
     private resolveTrackIdByClipId;
     private findTrackByClipId;
     /**

package/dist/core/history/history.d.ts

@@ -1,4 +1,4 @@
-import { Action, Clip, ClipStateUpdate, HistoryState, MoveClipBetweenTracksAction, MoveClipAction, MultiClipUpdateAction, RemoveClipAction, RemoveGapsAction, RestoreClipAudioAction, ResizeClipAction, SeparateClipAudioAction, SetTimeAction, SplitClipAction, Track, UpdateClipAction, AddClipAction } from '../models/types';
+import { Action, Clip, ClipStateUpdate, CompoundAction, HistoryState, MoveClipBetweenTracksAction, MoveClipAction, MultiClipUpdateAction, RemoveClipAction, RemoveGapsAction, RestoreClipAudioAction, ResizeClipAction, SeparateClipAudioAction, SetTimeAction, SplitClipAction, Track, TrackRestoreAnchor, UpdateClipAction, AddClipAction } from '../models/types';
 export declare class HistoryManager {
     private state;
     private maxHistorySize;
@@ -42,6 +42,7 @@ export declare class HistoryManager {
      * 创建移除片段操作
      */
     createRemoveClipAction(clip: Clip): RemoveClipAction;
+    createRemoveClipActionWithTrackSnapshot(clip: Clip, sourceTrackId: string | null, sourceTrackSnapshot: Track | null, sourceTrackRestoreAnchor?: TrackRestoreAnchor | null): RemoveClipAction;
     /**
      * 创建更新片段操作
      */
@@ -76,4 +77,5 @@ export declare class HistoryManager {
     createMoveClipBetweenTracksAction(clipId: string, sourceTrackId: string, targetTrackId: string, clipBefore: Clip, clipAfter: Clip, sourceTrackSnapshot: Track | null, targetTrackSnapshot: Track | null): MoveClipBetweenTracksAction;
     createSeparateClipAudioAction(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): SeparateClipAudioAction;
     createRestoreClipAudioAction(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): RestoreClipAudioAction;
+    createCompoundAction(actions: Action[], label?: string): CompoundAction;
 }

package/dist/core/history/timelineHistoryExecutor.d.ts

@@ -1,4 +1,4 @@
-import type { Action, Clip, Track } from '../models/types';
+import type { Action, Clip, Track, TrackRestoreAnchor } from '../models/types';
 export interface TimelineHistoryExecutionTrack {
     addClip(clip: Clip): void;
 }
@@ -7,7 +7,7 @@ export interface TimelineHistoryExecutionTarget {
     addClipToTrack(trackId: string, clip: Clip): boolean;
     updateClip(clipId: string, updates: Partial<Clip>): void;
     moveClipToTrack(clipId: string, targetTrackId: string): boolean;
-    ensureTrackFromHistorySnapshot(trackSnapshot: Track): string | null;
+    ensureTrackFromHistorySnapshot(trackSnapshot: Track, restoreAnchor?: TrackRestoreAnchor | null): string | null;
     removeClipGaps(): void;
     getClips(): Clip[];
     findTrackByClipId(clipId: string): TimelineHistoryExecutionTrack | null;
@@ -19,5 +19,10 @@ export declare class TimelineHistoryExecutor {
     constructor(target: TimelineHistoryExecutionTarget);
     executeUndo(action: Action): void;
     executeRedo(action: Action): void;
+    private executeUndoInternal;
+    private executeRedoInternal;
     private restoreMovedClip;
+    private normalizeRemoveClipActionData;
+    private resolveTrackIdForHistorySnapshot;
+    private resolveRestoreAnchor;
 }

package/dist/core/history/timelineHistoryRecorder.d.ts

@@ -1,15 +1,19 @@
 import { HistoryManager } from '../history/history';
-import type { Action, Clip, ClipStateUpdate, Track } from '../models/types';
+import type { Action, Clip, ClipStateUpdate, Track, TrackRestoreAnchor } from '../models/types';
 export declare class TimelineHistoryRecorder {
     private readonly history;
     constructor(history: HistoryManager);
     recordAddClip(clip: Clip): Action;
-    recordRemoveClip(clip: Clip): Action;
+    createRemoveClipAction(clip: Clip, sourceTrackId?: string | null, sourceTrackSnapshot?: Track | null, sourceTrackRestoreAnchor?: TrackRestoreAnchor | null): Action;
+    recordRemoveClip(clip: Clip, sourceTrackId?: string | null, sourceTrackSnapshot?: Track | null, sourceTrackRestoreAnchor?: TrackRestoreAnchor | null): Action;
     recordClipUpdate(clip: Clip, originalClip?: Clip, clipUpdates?: ClipStateUpdate[]): Action | null;
     recordSplitClip(clip1: Clip, clip2: Clip): Action;
     recordRemoveGaps(clipsBefore: Clip[]): Action | null;
     recordMoveClipBetweenTracks(clipId: string, sourceTrackId: string, targetTrackId: string, clipBefore: Clip, clipAfter: Clip, sourceTrackSnapshot: Track | null, targetTrackSnapshot: Track | null): Action;
     recordSeparateClipAudio(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): Action;
     recordRestoreClipAudio(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): Action;
+    createSeparateClipAudioAction(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): Action;
+    createRestoreClipAudioAction(videoClipBefore: Clip, videoClipAfter: Clip, audioClip: Clip | null, audioTrackId: string | null): Action;
+    recordCompoundAction(actions: Action[], label?: string): Action | null;
     private createClipUpdateAction;
 }

package/dist/core/models/types.d.ts

@@ -203,9 +203,18 @@ export interface AddClipAction {
 }
 export interface RemoveClipAction {
     type: 'remove_clip';
-    data: Clip;
+    data: {
+        clip: Clip;
+        sourceTrackId: string | null;
+        sourceTrackSnapshot: Track | null;
+        sourceTrackRestoreAnchor: TrackRestoreAnchor | null;
+    };
     timestamp: number;
 }
+export interface TrackRestoreAnchor {
+    previousTrackId: string | null;
+    nextTrackId: string | null;
+}
 export interface UpdateClipAction {
     type: 'update_clip';
     data: {
@@ -299,7 +308,15 @@ export interface RestoreClipAudioAction {
     };
     timestamp: number;
 }
-export type Action = AddClipAction | RemoveClipAction | UpdateClipAction | SplitClipAction | MoveClipAction | ResizeClipAction | SetTimeAction | RemoveGapsAction | MultiClipUpdateAction | MoveClipBetweenTracksAction | SeparateClipAudioAction | RestoreClipAudioAction;
+export interface CompoundAction {
+    type: 'compound';
+    data: {
+        actions: Action[];
+        label?: string;
+    };
+    timestamp: number;
+}
+export type Action = AddClipAction | RemoveClipAction | UpdateClipAction | SplitClipAction | MoveClipAction | ResizeClipAction | SetTimeAction | RemoveGapsAction | MultiClipUpdateAction | MoveClipBetweenTracksAction | SeparateClipAudioAction | RestoreClipAudioAction | CompoundAction;
 export type ActionType = Action['type'];
 export interface Position {
     x: number;
@@ -313,7 +330,7 @@ export interface HistoryState {
     past: Action[];
     future: Action[];
 }
-export type TimelineEvent = 'time_change' | 'play_state_change' | 'clip_added' | 'clip_removed' | 'clip_updated' | 'zoom_change' | 'history_change' | 'track_duration_change' | 'clip_selected' | 'selected_clip_change' | 'speed_change' | 'can_play_change' | 'buffering_state_change' | 'source_loading_change' | 'preview_aspect_ratio_change' | 'draft_loaded';
+export type TimelineEvent = 'time_change' | 'play_state_change' | 'clip_added' | 'clip_removed' | 'clip_updated' | 'zoom_change' | 'history_change' | 'track_duration_change' | 'clip_selected' | 'selected_clip_change' | 'speed_change' | 'can_play_change' | 'buffering_state_change' | 'source_loading_change' | 'preview_aspect_ratio_change' | 'draft_loaded' | 'selection_change';
 export interface TimeChangeData {
     time: TimeMs;
 }
@@ -352,6 +369,10 @@ export interface DraftLoadedData {
         error: unknown;
     }>;
 }
+export interface MultiSelectionChangeData {
+    selectedClipIds: string[];
+    previousSelectedClipIds: string[];
+}
 export interface EventListener {
     (event: TimelineEvent, data?: any): void;
 }

package/dist/core/presentation/timelinePresentationAdapter.d.ts

@@ -17,6 +17,6 @@ export declare class TimelinePresentationAdapter {
     syncZoom(timeline: TimelineZoomView | null, playhead: TimelineZoomView | null, tracks: TimelineTrackCollection, zoom: number): void;
     syncScrollLeft(playhead: TimelineScrollView | null, tracks: TimelineTrackCollection, scrollLeft: number): void;
     syncScrollTop(panel: TimelineVerticalScrollView | null, scrollbar: TimelineVerticalScrollView | null, scrollTop: number): void;
-    syncSelection(tracks: TimelineTrackCollection, selectedClipId: string | null): void;
+    syncSelection(tracks: TimelineTrackCollection, selectedClipId: string | null, selectedClipIds?: string[]): void;
     findSelectedClip(tracks: TimelineTrackCollection): Clip | null;
 }

package/dist/core/stores/selectionStore.d.ts

@@ -1,7 +1,14 @@
 export declare class SelectionStore {
-    private selectedClipId;
+    private selectedClipIds;
     getSelectedClipId(): string | null;
+    getSelectedClipIds(): string[];
+    addToSelection(clipId: string): void;
+    removeFromSelection(clipId: string): void;
+    toggleSelection(clipId: string): void;
+    setSelection(clipIds: string[]): void;
     setSelectedClipId(clipId: string | null): void;
     clear(): void;
     hasSelection(): boolean;
+    isSelected(clipId: string): boolean;
+    getSelectionCount(): number;
 }

package/dist/core/tracks/index.d.ts

@@ -1,3 +1,4 @@
 export { TimelineTrackBridge } from './timelineTrackBridge';
+export type { MultiDragMoveRequest } from './timelineTrackBridge';
 export { TimelineTrackCollection } from './timelineTrackCollection';
 export { TrackManager } from './trackManager';

package/dist/core/tracks/timelineTrackBridge.d.ts

@@ -1,6 +1,14 @@
 import Konva from 'konva';
 import { Track } from '../../components/track/Track';
 import type { Clip, ClipStateUpdate, Theme, TimeMs, TrackConfig, TrackType } from '../models/types';
+export interface MultiDragMoveRequest {
+    draggedClipId: string;
+    deltaTime: TimeMs;
+    targetTrackY: number;
+    currentTrackId: string;
+    crossTrackOffsetY: number;
+    isFinal: boolean;
+}
 export interface TimelineTrackBridgeHandlers {
     onClipUpdate: (clip: Clip, originalClip?: Clip, clipUpdates?: ClipStateUpdate[]) => void;
     onClipAdd: (clip: Clip) => void;
@@ -15,6 +23,11 @@ export interface TimelineTrackBridgeHandlers {
     onClearDropPreview?: () => void;
     onClearSelection?: () => void;
     onSnapGuideChange?: (guideTime: TimeMs | null) => void;
+    onClipToggleSelection?: (clipId: string) => void;
+    onSetSingleSelection?: (clipId: string) => void;
+    getMultiDragClipIds?: (clipId: string) => string[] | null;
+    onMultiDragMove?: (request: MultiDragMoveRequest) => boolean | void;
+    onMultiDragInteractionEnd?: () => void;
 }
 export interface TimelineTrackBridgeCreateOptions {
     layer: Konva.Layer;
@@ -28,7 +41,7 @@ export interface TimelineTrackBridgeCreateOptions {
     enableClipSnap?: boolean;
     clipSnapThreshold?: number;
 }
-export type TimelineTrackConstructor<TTrack = Track> = new (layer: Konva.Layer, config: TrackConfig, trackType: TrackType, zoom: number, trackY: number, trackHeight: number, theme: Theme, onClipUpdate: (clip: Clip, originalClip?: Clip, clipUpdates?: ClipStateUpdate[]) => void, onClipAdd: (clip: Clip) => void, onClipRemove: (clipId: string) => void, onClipSplit: (clip1: Clip, clip2: Clip) => void, onClipSelect: (clip: Clip) => void, onTimeJump: (time: TimeMs) => void, onHorizontalDragAutoScroll?: (nextScrollLeft: number) => number, onClipOverlap?: (clip: Clip, currentTrackId: string) => void, onClipCrossTrackPreview?: (clip: Clip, targetTrackY: number, currentTrackId: string) => 'self' | 'external' | 'clear', onClipCrossTrack?: (clip: Clip, originalClip: Clip | null, targetTrackY: number, currentTrackId: string) => boolean | void, onClearDropPreview?: () => void, onClearSelection?: () => void, onSnapGuideChange?: (guideTime: TimeMs | null) => void, dragActivationThreshold?: number, enableClipSnap?: boolean, clipSnapThreshold?: number) => TTrack;
+export type TimelineTrackConstructor<TTrack = Track> = new (layer: Konva.Layer, config: TrackConfig, trackType: TrackType, zoom: number, trackY: number, trackHeight: number, theme: Theme, onClipUpdate: (clip: Clip, originalClip?: Clip, clipUpdates?: ClipStateUpdate[]) => void, onClipAdd: (clip: Clip) => void, onClipRemove: (clipId: string) => void, onClipSplit: (clip1: Clip, clip2: Clip) => void, onClipSelect: (clip: Clip) => void, onTimeJump: (time: TimeMs) => void, onHorizontalDragAutoScroll?: (nextScrollLeft: number) => number, onClipOverlap?: (clip: Clip, currentTrackId: string) => void, onClipCrossTrackPreview?: (clip: Clip, targetTrackY: number, currentTrackId: string) => 'self' | 'external' | 'clear', onClipCrossTrack?: (clip: Clip, originalClip: Clip | null, targetTrackY: number, currentTrackId: string) => boolean | void, onClearDropPreview?: () => void, onClearSelection?: () => void, onSnapGuideChange?: (guideTime: TimeMs | null) => void, onClipToggleSelection?: (clipId: string) => void, onSetSingleSelection?: (clipId: string) => void, getMultiDragClipIds?: (clipId: string) => string[] | null, onMultiDragMove?: (request: MultiDragMoveRequest) => boolean | void, onMultiDragInteractionEnd?: () => void, dragActivationThreshold?: number, enableClipSnap?: boolean, clipSnapThreshold?: number) => TTrack;
 export declare class TimelineTrackBridge<TTrack = Track> {
     private readonly handlers;
     private readonly TrackCtor;

package/dist/core/tracks/timelineTrackCollection.d.ts

@@ -1,24 +1,32 @@
 import type { Clip, TimeMs } from '../models/types';
+import type Konva from 'konva';
 import type { TimelineTrackView } from '../commands/timelineCommands';
 export interface TimelineTrackCollectionItem extends TimelineTrackView {
     getRole?(): 'primary' | 'normal';
     showClipDropPreview?(clip: Clip): void;
+    showClipDropPreviews?(clips: Clip[]): void;
     clearClipDropPreview?(): void;
     setCurrentTime?(time: TimeMs): void;
     setZoom?(zoom: number): void;
     setScrollLeft?(scrollLeft: number): void;
     setScrollTop?(scrollTop: number): void;
     updateClip?(clipId: string, updates: Partial<Clip>): void;
+    updateClipPosition?(clipId: string, newStartTime: TimeMs, isFinal: boolean, previewOffsetY?: number): void;
     removeClipGaps?(): void;
     updateSelectionVisual?(selectedClipId: string | null): void;
     clearSelection?(): void;
     getSelectedClip?(): Clip | null;
     selectClip?(clipId: string): void;
     setTrackY?(y: number): void;
+    setTrackStackOrder?(order: number): void;
     setTrackHeight?(height: number): void;
+    setDragOverlayLayer?(layer: Konva.Layer | null): void;
+    setClipsDragOverlayActive?(clipIds: string[], isActive: boolean): void;
+    clearClipDragOverlay?(): void;
     getTrackGroup?(): {
         destroy(): void;
     };
+    updateClipSelection?(clipId: string, isSelected: boolean): void;
 }
 export declare class TimelineTrackCollection {
     private readonly tracks;