0.1.0 • Published 1 year ago
react-ez-panels v0.1.0
react-ez-panels
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.
Features
- Multiple split panels (horizontal + vertical)
- Resizing via drag
- Resizing via the keyboard
- Nested panels
- Min / max sizes
- Min size snapping
Roadmap
- Min snap (like vscode)
- Tests
- Conditional panels
Ideas
- Drag to order panels
- Drag to nest panels
Example
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>
);
}