A package to handle multi panel resizing. This implements the ARIA Window Splitter pattern so should be accessible. It's built with useGesture but this may change in future.
- Multiple split panels (horizontal + vertical)
- Resizing via drag
- Resizing via the keyboard
- Nested panels
- Min / max sizes
- Min size snapping
- Min snap (like vscode)
- Tests
- Conditional panels
- Drag to order panels
- Drag to nest panels
import { PanelGroup, Panel, Splitter } from 'react-ez-panels';
function MyComponent() {
return (
<PanelGroup direction="horizontal">
<Panel id="panel-1">
...
</Panel>
<Splitter id="splitter-1" />
<Panel id="panel-2" >
...
</Panel>
</PanelGroup>
);
}