Nested Groups
An example of nesting groups of panes for more complex layouts.
One
Two
Three
Anatomy
Here's the high-level structure of the example above:
<script lang="ts">
import { PaneGroup, Pane, PaneResizer } from "paneforge";
</script>
<PaneGroup direction="horizontal">
<Pane defaultSize={50} />
<PaneResizer />
<Pane defaultSize={50}>
<PaneGroup direction="vertical">
<Pane defaultSize={50} />
<PaneResizer />
<Pane defaultSize={50} />
</PaneGroup>
</Pane>
</PaneGroup>