@linker-design-plus/timeline-track 2.0.20 → 2.0.22

package/README.md

@@ -1,6 +1,6 @@
 # @linker-design-plus/timeline-track
 
-基于 TypeScript、Konva 和 Vue demo 的时间线编辑组件库，对外以 `TimelineManager` 为统一入口，提供多轨片段编辑、拖拽/拉伸/分割、撤销重做、选中态同步、封面渲染和预览挂载能力。
+基于 TypeScript、Konva 和 Vue demo 的时间线编辑组件库，对外以 `TimelineManager` 为统一入口，提供多轨片段编辑、拖拽/拉伸/分割、撤销重做、选中态同步、封面渲染和预览挂载能力。时间轴主体仍由 Konva 驱动，播放指针使用独立的 SVG/DOM 覆盖层渲染。
 
 ## 当前状态
 
@@ -188,7 +188,7 @@ flowchart TB
   FACADE --> TRACKS["Tracks\nTrackManager / Bridge / Collection"]
   FACADE --> PRESENTATION["Presentation\nTimelinePresentationAdapter"]
   FACADE --> PREVIEW["Preview\nDomPreviewBackend"]
-  FACADE --> COMPONENTS["Konva Views\nTimeline / Track / Clip / Playhead / Panels"]
+  FACADE --> COMPONENTS["Presentation Views\nTimeline / Track / Clip / Panels / ManagedPlayhead"]
 ```
 
 当前最值得关注的热点：
@@ -202,7 +202,7 @@ flowchart TB
 
 ```text
 src/
-  components/   Konva 组件与交互 helper
+  components/   时间轴视图、SVG/DOM 覆盖层与交互 helper
   core/         stores / commands / controllers / facade / models
   utils/        渲染、时间和日志工具
   styles/       样式入口

package/dist/components/panel/ClipConfigPanel.d.ts

@@ -13,6 +13,17 @@ export interface ClipConfigPanelTheme {
     buttonActiveBorder: string;
     buttonActiveText: string;
 }
+export type ClipConfigPanelGroupKind = 'video' | 'audio' | 'text' | 'mixed' | 'empty';
+export interface ClipConfigPanelSelectionState {
+    primaryClip: Clip | null;
+    selectedClips: Clip[];
+    selectionCount: number;
+    groupKind: ClipConfigPanelGroupKind;
+    supportsVoiceBatch: boolean;
+    supportsTextContentBatch: boolean;
+    supportsVisualBatch: boolean;
+    supportsVolumeBatch: boolean;
+}
 export declare const defaultDarkTheme: ClipConfigPanelTheme;
 export interface ClipConfigPanelConfig {
     container: HTMLElement;
@@ -75,6 +86,7 @@ export declare class ClipConfigPanel {
     private readonly onGenerateVoice?;
     private readonly voiceCatalog;
     private currentClip;
+    private selectionState;
     private activeTab;
     private readonly iconCache;
     private pendingPreferredTab;
@@ -91,13 +103,15 @@ export declare class ClipConfigPanel {
     private previewingVoiceId;
     constructor(config: ClipConfigPanelConfig);
     setClip(clip: Clip | null): void;
+    setSelectionState(selectionState: ClipConfigPanelSelectionState): void;
     setPreferredTab(tab: 'voice' | null): void;
     setVoiceGenerationBusy(isBusy: boolean): void;
     destroy(): void;
     private render;
     private getAvailableTabs;
+    private getEmptyStateMessage;
     private resetVoiceState;
-    private syncVoiceStateForClip;
+    private syncVoiceStateForSelection;
     private syncActiveTab;
     private supportsVoicePanel;
     private ensureVoiceFilters;

package/dist/components/panel/ClipConfigPanelRenderer.d.ts

@@ -1,7 +1,7 @@
 import { type TemplateResult } from 'lit';
 import { type Clip, type VoiceOption } from '../../core/models';
 import { LitDomRenderer } from '../../core/renderers/domRenderer';
-import type { ClipConfigPanelTheme } from './ClipConfigPanel';
+import type { ClipConfigPanelSelectionState, ClipConfigPanelTheme } from './ClipConfigPanel';
 export type ClipConfigPanelTabKey = 'visual' | 'audio' | 'text' | 'voice';
 export interface ClipConfigPanelCallbacks {
     onTabChange: (tab: ClipConfigPanelTabKey) => void;
@@ -18,9 +18,12 @@ export interface ClipConfigPanelCallbacks {
 }
 export interface ClipConfigPanelViewModel {
     clip: Clip | null;
+    selectionState: ClipConfigPanelSelectionState;
     activeTab: ClipConfigPanelTabKey;
+    availableTabs: ClipConfigPanelTabKey[];
     theme: ClipConfigPanelTheme;
-    emptyStateIconSvg: string;
+    emptyStateMessage: string | null;
+    isTextContentEditable: boolean;
     loadingIconSvg: string;
     selectedIconSvg: string;
     textDraftContent: string;
@@ -107,7 +110,6 @@ export declare class ClipConfigPanelRenderer extends LitDomRenderer<ClipConfigPa
     private renderLabeledNumberInput;
     private getContainerStyle;
     private getSliderStyle;
-    private getAvailableTabs;
     private supportsVoicePanel;
     private getTransform;
     private calculatePresetPosition;

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

@@ -1,6 +1,5 @@
 import Konva from 'konva';
 import { Clip as ClipType, ClipStateUpdate, TrackConfig, TimeMs, Theme, TrackType } from '../../core/models';
-import { type TrackPointerOperation } from './trackInteractionState';
 import type { MultiDragMoveRequest } from '../../core/tracks/timelineTrackBridge';
 export declare class Track {
     private static readonly DEFAULT_DRAG_ACTIVATION_THRESHOLD;
@@ -28,7 +27,6 @@ export declare class Track {
     private multiDragOriginalPositions;
     private promotedClipParents;
     private interactionState;
-    private legacyInteractionSnapshot?;
     private isVisualUpdate;
     private onClipUpdate;
     private onClipAdd;
@@ -58,37 +56,8 @@ export declare class Track {
     private handleGlobalPointerMove;
     private handleGlobalPointerEnd;
     private handleWindowBlur;
-    get hasDragMoved(): boolean;
-    set hasDragMoved(value: boolean);
-    get activePointerOperation(): TrackPointerOperation | null;
-    set activePointerOperation(value: TrackPointerOperation | null);
-    get originalClipsState(): ClipType[];
-    set originalClipsState(value: ClipType[]);
-    get nonDraggedClips(): ClipType[];
-    set nonDraggedClips(value: ClipType[]);
-    get snapCandidateClips(): ClipType[];
-    set snapCandidateClips(value: ClipType[]);
-    get dragStartY(): number;
-    set dragStartY(value: number);
-    get dragTargetTrackY(): number;
-    set dragTargetTrackY(value: number);
-    get crossTrackDragOffsetY(): number;
-    set crossTrackDragOffsetY(value: number);
-    get crossTrackDragStartX(): number;
-    set crossTrackDragStartX(value: number);
-    get dragStartScrollLeft(): number;
-    set dragStartScrollLeft(value: number);
-    get dragGestureStartClientX(): number | null;
-    set dragGestureStartClientX(value: number | null);
-    get dragGestureStartClientY(): number | null;
-    set dragGestureStartClientY(value: number | null);
-    get lastDragClientX(): number | null;
-    set lastDragClientX(value: number | null);
-    get lastDragClientY(): number | null;
-    set lastDragClientY(value: number | null);
     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, originalClip?: ClipType | null) => 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 getLegacyInteractionSnapshot;
     private ensureDropPreviewGroup;
     private createDropPreviewRect;
     private showDropPreview;
@@ -113,8 +82,6 @@ export declare class Track {
     private finishPointerInteraction;
     private resolveDraggedClipForInteraction;
     private applyInteractionTransition;
-    private resolveInteractionState;
-    private syncLegacyInteractionMirror;
     private handleClipMoveEnd;
     private updateAllClips;
     private buildAndSendUpdates;
@@ -166,7 +133,7 @@ export declare class Track {
     private buildPreviewClip;
     private constrainResizePreviewToTrackBounds;
     private getResizeLeftBoundaryStart;
-    private getResizeRightBoundaryEnd;
+    private computeResizeRightPushFollowers;
     private buildResizeLeftPreviewClip;
     private buildResizeRightPreviewClip;
     private applyClipSnap;

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

@@ -22,6 +22,8 @@ export interface TimelinePreviewBackendCallbacks {
     onAspectRatioChange?: (aspectRatio: PreviewAspectRatio) => void;
     onPreviewClipSelect?: (clipId: string) => void;
     onVisualTransformCommit?: (clipId: string, visualTransform: ClipVisualTransform) => void;
+    onTextFontSizeCommit?: (clipId: string, fontSize: number) => void;
+    onTextRotationCommit?: (clipId: string, rotation: number) => void;
     onPendingPreviewRetry?: () => void;
     onRuntimeError?: (error: unknown) => void;
 }

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

@@ -6,15 +6,24 @@ export interface PreviewTransformOverlayState {
     frameSize: PreviewFrameSize;
     baseRect: PreviewRect;
     displayRect: PreviewRect;
+    clipType?: 'text' | 'video';
+    currentFontSize?: number;
+    currentRotation?: number;
 }
 interface PreviewTransformOverlayCallbacks {
     onPreviewTransformChange?: (clipId: string, transform: ClipVisualTransform | null) => void;
     onPreviewTransformCommit?: (clipId: string, transform: ClipVisualTransform) => void;
+    onFontSizeChange?: (clipId: string, fontSize: number | null) => void;
+    onFontSizeCommit?: (clipId: string, fontSize: number) => void;
+    onRotationChange?: (clipId: string, rotation: number | null) => void;
+    onRotationCommit?: (clipId: string, rotation: number) => void;
 }
 export declare class PreviewTransformOverlay {
     private frameElement;
     private overlayElement;
     private boxElement;
+    private rotateHandleElement;
+    private rotateHandlePointerDownHandler;
     private readonly handleElements;
     private readonly handlePointerDownHandlers;
     private state;
@@ -28,6 +37,8 @@ export declare class PreviewTransformOverlay {
     attach(frameElement: HTMLElement): void;
     detach(): void;
     sync(state: PreviewTransformOverlayState | null): void;
+    private createRotateHandle;
+    private getRotateHandlePointerDown;
     private createHandle;
     private readonly handleMovePointerDown;
     private getHandlePointerDown;

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

@@ -3,6 +3,7 @@ export interface TimelineClipConfigControllerConfig {
     container: HTMLElement;
     theme: Theme;
     getPrimarySelectedClip: () => Clip | null;
+    getSelectedClips: () => Clip[];
     voiceCatalog: VoiceOption[];
     updateClip: (clipId: string, updates: Partial<Clip>) => void;
     onGenerateVoice?: (clip: Clip, voice: VoiceOption, followTextUpdates: boolean) => Promise<void>;
@@ -10,6 +11,7 @@ export interface TimelineClipConfigControllerConfig {
 export declare class TimelineClipConfigController {
     private panel;
     private config;
+    private currentSelectionState;
     private isInternalUpdate;
     init(config: TimelineClipConfigControllerConfig): void;
     update(): void;
@@ -17,5 +19,7 @@ export declare class TimelineClipConfigController {
     destroy(): void;
     setPreferredTab(tab: 'voice' | null): void;
     setVoiceGenerationBusy(isBusy: boolean): void;
+    private buildSelectionState;
+    private resolveUpdateTargets;
     private convertTheme;
 }

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

@@ -11,6 +11,8 @@ interface TimelinePreviewSessionCallbacks {
     onAspectRatioChange?: (aspectRatio: PreviewAspectRatio) => void;
     onPreviewClipSelect?: (clipId: string) => void;
     onVisualTransformCommit?: (clipId: string, visualTransform: ClipVisualTransform) => void;
+    onTextFontSizeCommit?: (clipId: string, fontSize: number) => void;
+    onTextRotationCommit?: (clipId: string, rotation: number) => void;
     onPendingPreviewRetry?: () => void;
 }
 interface TimelinePreviewSessionDependencies {
@@ -59,6 +61,8 @@ export declare class TimelinePreviewSession {
     private lastSettledSyncRequestId;
     private primarySelectedClipId;
     private transientVisualTransform;
+    private transientFontSize;
+    private transientRotation;
     private textPreviewDragState;
     private textPreviewFontStyleElement;
     private textPreviewFontSignature;

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

@@ -81,6 +81,7 @@ export declare class TimelineManager {
     private lastSteadyPlaybackPreviewSyncAt;
     private previewSyncInteractionMode;
     private readonly resourceCacheManager;
+    private voiceLinkedTextRegenerationTimer;
     constructor(config?: Partial<TimelineConfig>);
     private createPlaybackAttemptId;
     private refreshPlaybackAttempt;
@@ -176,7 +177,6 @@ export declare class TimelineManager {
     removeTrack(trackId: string): boolean;
     renameTrack(trackId: string, newName: string): boolean;
     getTracks(): any[];
-    initTrackInfoPanel(container: HTMLElement): void;
     updateTrackInfoPanel(): void;
     muteTrack(trackId: string, isMuted: boolean): boolean;
     isTrackMuted(trackId: string): boolean;
@@ -357,6 +357,7 @@ export declare class TimelineManager {
     private relocateClipIfNeeded;
     private regenerateVoiceLinkedAudioClips;
     private getSelectedTextClipsForVoiceGeneration;
+    private getSelectedTtsAudioClipsForVoiceGeneration;
     private handleVoiceGenerateAction;
     private primeOrLoadClipThumbnails;
     private markClipThumbnailLoadCompleted;
@@ -575,5 +576,7 @@ export declare class TimelineManager {
     private resolveSelectedClipSnapshot;
     private resolveSelectionChangeData;
     private commitPreviewVisualTransform;
+    private commitPreviewTextFontSize;
+    private commitPreviewTextRotation;
     clearAllTracksAndClips(): void;
 }

package/dist/core/layout/timelineManagerDom.d.ts

@@ -1,6 +1,6 @@
 import type { Theme } from '../models/types';
 import { type TimelineManagerLayoutElements } from './TimelineManagerLayoutRenderer';
-export declare const TIMELINE_MANAGER_LEFT_PANEL_WIDTH = 200;
+export declare const TIMELINE_MANAGER_LEFT_PANEL_WIDTH = 80;
 export declare const TIMELINE_MANAGER_SCROLLBAR_SIZE = 8;
 export type { TimelineManagerLayoutElements };
 export interface CreateTimelineManagerLayoutOptions {