import * as React from 'react';
/**
 * Drag-to-resize panel layout (IDE-style split panels).
 *
 * @description
 * Creates resizable panel architectures like IDE layouts (collapsible sidebar vs main window).
 * Custom implementation with full touch and mouse support.
 *
 * @ai-rules
 * 1. Always place `<ResizableHandle />` between sibling `<ResizablePanel>` components — it is what separates them.
 * 2. Configure `defaultSize` as a percentage (not pixels): e.g., `defaultSize={50}` for a 50/50 split.
 * 3. Use `minSize` and `maxSize` (also percentages) to constrain draggable bounds.
 */
interface PanelGroupStorage {
    getItem: (name: string) => string | null;
    setItem: (name: string, value: string) => void;
}
declare const ResizablePanelGroup: ({ children, className, direction, id: _id, autoSaveId: _autoSaveId, storage: _storage, onLayout, ...props }: {
    children: React.ReactNode;
    className?: string;
    direction?: "horizontal" | "vertical";
    id?: string;
    autoSaveId?: string;
    storage?: PanelGroupStorage;
    onLayout?: (sizes: number[]) => void;
} & React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
declare const ResizablePanel: ({ className, defaultSize, minSize, maxSize, collapsible, collapsedSize: _collapsedSize, onCollapse, onExpand, onResize, order: _order, tagName: _tagName, id: propId, children, ...props }: {
    defaultSize?: number;
    minSize?: number;
    maxSize?: number;
    collapsible?: boolean;
    collapsedSize?: number;
    onCollapse?: () => void;
    onExpand?: () => void;
    onResize?: (size: number) => void;
    order?: number;
    tagName?: string;
} & React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
declare const ResizableHandle: ({ withHandle, className, id: propId, tagName: _tagName, ...props }: {
    withHandle?: boolean;
    tagName?: string;
} & React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element | null;
export { ResizablePanelGroup, ResizablePanel, ResizableHandle };