import { ComputedRef, Ref } from 'vue';
import { ResizableDirection, ResizablePanelState } from '../resizable_constants';
import { ResizeHandler } from './useResizableCalculations';
export type DragState = DragStateIdle | DragStateActive;
export interface DragStateIdle {
    isActive: false;
    handleId: null;
    beforePanelId: null;
    afterPanelId: null;
    proposedBeforeSize: 0;
    proposedAfterSize: 0;
}
export interface DragStateActive {
    isActive: true;
    handleId: string;
    beforePanelId: string;
    afterPanelId: string;
    proposedBeforeSize: number;
    proposedAfterSize: number;
}
export interface UseResizableDragOptions {
    direction: ComputedRef<ResizableDirection>;
    containerRef: Ref<HTMLElement | null>;
    panels: ComputedRef<ResizablePanelState[]> | Ref<ResizablePanelState[]>;
    containerSize: ComputedRef<number> | Ref<number>;
    resizeHandler: ResizeHandler;
    onDragEnd: (beforePanelId: string, afterPanelId: string, beforeSize: number, afterSize: number, sizesChanged: boolean) => void;
    onDragStart?: (handleId: string) => void;
}
export declare function findPanelsForHandle(handleId: string, panels: ResizablePanelState[]): {
    beforePanel: ResizablePanelState | null;
    afterPanel: ResizablePanelState | null;
};
export declare function useResizableDrag(options: UseResizableDragOptions): {
    dragState: import('vue').Reactive<DragState>;
    startDrag: (handleId: string) => void;
    onDragMove: (event: PointerEvent) => void;
    commitDrag: () => void;
    cancelDrag: () => void;
    cleanup: () => void;
};
//# sourceMappingURL=useResizableDrag.d.ts.map