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 `` between sibling `` 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.
*/
declare const ResizablePanelGroup: ({ children, className, direction, id, autoSaveId, storage, onLayout, ...props }: {
children: React.ReactNode;
className?: string;
direction?: "horizontal" | "vertical";
id?: string;
autoSaveId?: string;
storage?: any;
onLayout?: (sizes: number[]) => void;
} & React.HTMLAttributes) => import("react/jsx-runtime").JSX.Element;
declare const ResizablePanel: ({ className, defaultSize, minSize, maxSize, collapsible, collapsedSize, onCollapse, onExpand, onResize, order, 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) => import("react/jsx-runtime").JSX.Element;
declare const ResizableHandle: ({ withHandle, className, id: propId, tagName, ...props }: {
withHandle?: boolean;
tagName?: string;
} & React.HTMLAttributes) => import("react/jsx-runtime").JSX.Element | null;
export { ResizablePanelGroup, ResizablePanel, ResizableHandle };