SplitLayout

direction

"horizontal" | "vertical"

Default: horizontal

Arrange panes as columns or rows.

defaultSize

number | string

Default: —

Initial size — px or a CSS length ("32%"). Omit to flex and fill.

collapsedSize

number

Default: 0

Size when collapsed.

sizes

Array<number | null>

Default: —

Controlled pane sizes in px (null for the flex pane). Pair with onResize.

onResize

(sizes) => void

Default: —

Fires on drag, keyboard resize, or collapse.

keyboardStep

number

Default: 24

px moved per arrow-key press on a handle.

minSize / maxSize

number

Default: 80 / —

px clamp while resizing.

isResizable

boolean

Default: false

Show a drag handle on this pane's trailing edge.

isCollapsible

boolean

Default: false

Collapse when dragged past ~60% of minSize, or on Enter/Space on the handle.

isCollapsed / defaultCollapsed / onCollapsedChange

—

Default: —

Controlled / uncontrolled collapse.

classNames

{ base?, pane?, handle? }

Default: —

Slot classes.

aria-label

string

Default: —

Names the group.

label

string

Default: —

Accessible name for this pane's handle ("Resize <label>").