Props

Prop	Type	Default	Description
hasDivider	boolean	false	Draws a rule on the edge that faces the content. Leave it off when an adjacent ResizeHandle already draws a line on that edge.
isScrollable	boolean	true	Scrolls the panel when its content is taller than the panel.
label	string	—	Accessible name for the landmark element.
padding	SpacingStep	—	Internal padding using the spacing scale. Overrides the padding the surrounding layout passes down. 0 makes the panel full bleed.
resizable	LayoutResizable	—	The props object from useResizable. When it is given, the hook owns the width and width is ignored. Place a ResizeHandle next to the panel and give it the same object. The object carries the region's axis as _direction ('horizontal' | 'vertical'), which must match the handle's direction. Only _size is required, so a hand-built { _size: 250 } still works.
role	string	—	ARIA landmark role, for example navigation.
width	number | string	—	Panel width. Numbers are pixels, strings are used as they are. Ignored when resizable is given.

SpacingStep accepts these values:

type SpacingStep = 0 | 0.5 | 1 | 1.5 | 2 | 3 | 4 | 5 | 6 | 8 | 10

Slots

• default: the panel content.

Template ref

LayoutPanel exposes element. Its type is HTMLDivElement | null.

Native attributes

The root element receives HTML attributes, aria-* attributes, data-* attributes, class, and style. class is merged with the component's own classes.