1# Splitter
2 
3Resizable split panels
4 
5**Parts:** `SplitterGroup`, `SplitterPanel`, `SplitterResizeHandle`
6 
7## SplitterGroup
8 
9### Props
10| Prop | Type | Default |
11|------|------|---------|
12| `as` | `AsTag \| Component` | `"div"` |
13| `asChild` | `boolean` | - |
14| `autoSaveId` | `string \| null` | `null` |
15| `direction`* | `"vertical" \| "horizontal"` | - |
16| `id` | `string \| null` | - |
17| `keyboardResizeBy` | `number \| null` | `10` |
18| `storage` | `PanelGroupStorage` | `defaultStorage` |
19 
20### Emits
21| Event | Payload |
22|-------|---------|
23| `layout` | `[val: number[]]` |
24 
25### Slots
26| Slot | Type |
27|------|------|
28| `layout` | `number[]` |
29 
30## SplitterPanel
31 
32### Props
33| Prop | Type | Default |
34|------|------|---------|
35| `as` | `AsTag \| Component` | `"div"` |
36| `asChild` | `boolean` | - |
37| `collapsedSize` | `number` | - |
38| `collapsible` | `boolean` | - |
39| `defaultSize` | `number` | - |
40| `id` | `string` | - |
41| `maxSize` | `number` | - |
42| `minSize` | `number` | - |
43| `order` | `number` | - |
44 
45### Emits
46| Event | Payload |
47|-------|---------|
48| `collapse` | `[]` |
49| `expand` | `[]` |
50| `resize` | `[size: number, prevSize: number]` |
51 
52### Slots
53| Slot | Type |
54|------|------|
55| `isCollapsed` | `boolean` |
56| `isExpanded` | `boolean` |
57 
58## SplitterResizeHandle
59 
60### Props
61| Prop | Type | Default |
62|------|------|---------|
63| `as` | `AsTag \| Component` | `"div"` |
64| `asChild` | `boolean` | - |
65| `disabled` | `boolean` | - |
66| `hitAreaMargins` | `PointerHitAreaMargins` | - |
67| `id` | `string` | - |
68| `tabindex` | `number` | `0` |
69 
70### Emits
71| Event | Payload |
72|-------|---------|
73| `dragging` | `[isDragging: boolean]` |
74