import { TimelineTrackDropGuard } from "../tracks/useTimelineTrackDropTargets.mjs"; import { ClipViewportRect, TimelineClipDropFeedback, TimelineClipMoveResult, TimelineCommandResult, TimelineInteractionGeometry } from "@techsquidtv/canvas-timeline-core"; //#region src/hooks/clips/useTimelineClipDrag.d.ts /** Pointer data needed to begin a clip body drag. */ interface TimelineClipDragStartInput { /** Clip being dragged. */ clipId: string; /** Pointer client X captured at drag start. */ clientX: number; /** Pointer Y in timeline viewport coordinates, including the ruler area. */ viewportY: number; /** Optional clip rect from the initiating hit test. */ clipRect?: ClipViewportRect; } /** Pointer data needed to update a clip body drag. */ interface TimelineClipDragMoveInput { /** Current pointer client X. */ clientX: number; /** Current pointer Y in timeline viewport coordinates, including the ruler area. */ viewportY: number; } /** * Options accepted by `useTimelineClipDrag`. * * @remarks * * Pass renderer-aligned geometry so pointer Y coordinates resolve to the same * track rows users see on screen. `canDropClipOnTrack` lets applications enforce * domain rules such as preventing audio clips from moving to visual tracks * unless a modifier key or tool mode allows it. * * * @see {@link useTimelineTrackDropTargets} * @see {@link https://canvastimeline.com/docs/tracks-and-clips | Tracks and clips} */ interface UseTimelineClipDragOptions extends TimelineInteractionGeometry { /** Portion of another track the pointer must enter before snapping vertically. Defaults to 0.3. */ verticalSnapThreshold?: number; /** Minimum vertical pixels required before snapping vertically. Defaults to 8. */ minVerticalSnapPixels?: number; /** Optional viewport width used for track row geometry. */ viewportWidth?: number; /** Optional app policy for accepting, rejecting, or expanding drop targets. */ canDropClipOnTrack?: TimelineTrackDropGuard; } /** Result returned by `useTimelineClipDrag`. */ interface UseTimelineClipDragResult { /** Whether a clip body drag is currently active. */ dragging: boolean; /** Current transient drop feedback snapshot. Use `useTimelineClipDropFeedback` for live updates. */ dropFeedback: TimelineClipDropFeedback; /** Starts a clip body drag. */ startClipDrag: (input: TimelineClipDragStartInput) => TimelineCommandResult; /** Updates the active clip body drag preview. */ moveClipDrag: (input: TimelineClipDragMoveInput) => TimelineCommandResult; /** Ends the active clip body drag and settles history. */ endClipDrag: () => TimelineCommandResult; /** Cancels the active drag and discards its preview. */ cancelClipDrag: () => TimelineCommandResult; } /** * Headless clip body drag behavior shared by canvas and custom timeline UIs. * * @remarks * * Use this when building a custom interaction layer around canvas-painted clips. * The hook handles drag lifecycle, snapping preparation, cross-track drop * policy, transient drop feedback, and commit/settle behavior. Package * consumers using the standard DOM chrome can render `Timeline.ClipInteractionLayer` * instead. * * @param options - Drag geometry, vertical snap sensitivity, and optional drop policy. * @returns Clip drag state and commands for pointer-driven body moves. * * @example * ```tsx * import { useTimelineClipDrag } from '@techsquidtv/canvas-timeline-react'; * * export function CustomClipDragHandle({ clipId }: { clipId: string }) { * const drag = useTimelineClipDrag(); * * return ( * * ); * } * ``` * * @see {@link useTimelineClipDropFeedback} * @see {@link useTimelineTrackDropTargets} * @see {@link https://canvastimeline.com/demos/basic-editor-surface | Basic editor surface demo} */ declare function useTimelineClipDrag(options?: UseTimelineClipDragOptions): UseTimelineClipDragResult; //#endregion export { TimelineClipDragMoveInput, TimelineClipDragStartInput, UseTimelineClipDragOptions, UseTimelineClipDragResult, useTimelineClipDrag }; //# sourceMappingURL=useTimelineClipDrag.d.mts.map