import { type ComponentPropsWithoutRef, type CSSProperties, type DragEvent, type ReactNode } from "react";
export interface SortableItem {
    id: string;
}
type DivPropsBase = Omit<ComponentPropsWithoutRef<"div">, "onChange" | "children" | "onDrop">;
export interface SortableProps<T extends SortableItem> extends DivPropsBase {
    items: T[];
    onChange: (items: T[]) => void;
    renderItem: (item: T, index: number, dragProps: SortableDragProps) => ReactNode;
    /** Direction. Default vertical. */
    direction?: "vertical" | "horizontal";
    /** Disable reorder interactions. */
    disabled?: boolean;
    /** Enable auto-scroll near container edges while dragging. Default true. */
    autoScroll?: boolean;
    /** Auto-scroll trigger zone in pixels from the edge. Default 48. */
    autoScrollEdge?: number;
}
export interface SortableDragProps {
    /** Spread on the drag handle element. */
    dragHandleProps: {
        draggable: boolean;
        onDragStart: (e: DragEvent) => void;
        onDragEnd: () => void;
        onKeyDown: (e: React.KeyboardEvent) => void;
        role: string;
        "aria-roledescription": string;
        /** Non-standard but widely-supported data attribute consumers can
         *  hook into for keyboard-lift styling. ARIA 1.1 deprecated
         *  `aria-grabbed` — the live region inside Sortable announces the
         *  lift state to AT. */
        "data-kb-active"?: boolean;
        tabIndex: number;
    };
    /** Whether THIS item is currently being dragged. */
    isDragging: boolean;
    /** Whether this item is the keyboard-lift source. */
    isKeyboardActive: boolean;
}
export declare function Sortable<T extends SortableItem>({ items, onChange, renderItem, direction, disabled, autoScroll, autoScrollEdge, className, ...rest }: SortableProps<T>): import("react/jsx-runtime").JSX.Element;
export interface DragHandleProps {
    className?: string;
    style?: CSSProperties;
    /** Accessible name. Default "Drag to reorder". */
    "aria-label"?: string;
    /** @deprecated — use `aria-label` (the standard prop name). */
    ariaLabel?: string;
    /** Spread the dragHandleProps from Sortable's renderItem here. */
    dragProps?: SortableDragProps["dragHandleProps"];
}
export declare const DragHandle: import("react").ForwardRefExoticComponent<DragHandleProps & import("react").RefAttributes<HTMLSpanElement>>;
export {};
//# sourceMappingURL=Sortable.d.ts.map