Layout Splitter Workspace
v1.0.0A resizable split-panel layout container.
Horizontal Workspace Splitting
Click and drag the divider to resize panels.
lib
utils.ts
button.tsx
Main Layout Workspace Panel
Drag the vertical line separator handle channel left or right to re-scale the inner structural width tracking buffers.
Splitter API Reference
All available props for this component.
Property | Type | Default | Description |
|---|---|---|---|
| primaryPane | React.ReactNode | required | Content tree rendered inside the variable-sized first slot (left or top). |
| secondaryPane | React.ReactNode | required | Content tree rendered inside the secondary expanding responsive filling box slot. |
| direction | 'horizontal' | 'vertical' | 'horizontal' | Controls alignment vectors and matches pointer tracking vectors to matching axes streams. |
| initialSize | number | 30 | Initial split allocation percentage targeted directly at the primary container partition layer. |
| minSize | number | 15 | The lower boundary constraint floor percentage allowed by the drag interaction handler. |
| maxSize | number | 85 | The upper boundary ceiling percentage restriction allowed by the drag interaction handler. |