PanelA panel within a PanelGroup
| Name | Type | Description |
|---|---|---|
handle | Ref<PanelHandle> | undefined; | Imperative handle to control the panel |
onResize | OnResizeCallback | undefined; | Callback called when the panel is resized |
collapsed | boolean | undefined; | CONTROLLED COMPONENT If this prop is used it will be used as the source of truth for the collapsed state.
It should be used in conjunction with the Use this if you want full control over the collapsed state. When trying to collapse a panel it will defer to onCollapseChange to determine if it should be collapsed. |
onCollapseChange | ((isCollapsed: boolean) => void) | undefined | CONTROLLED COMPONENT A callback called with the new desired collapsed state. If paired w
with the Otherwise this will just be called with the new collapsed state so you can use it to update your own state. |
min | Unit | undefined; | The minimum size of the panel |
max | Unit | undefined; | The maximum size of the panel |
default | Unit | undefined; | The default size of the panel |
collapsible | boolean | undefined; | Whether the panel is collapsible |
defaultCollapsed | boolean | undefined; | Whether the panel should initially render as collapsed |
collapsedSize | Unit | undefined; | The size of the panel once collapsed |
isStaticAtRest | boolean | undefined; | By default the layout will be stored in percentage values while at rest. This makes scaling the layout easier when the container is resized. However you might have a panel you want to stay at a static size when the container is resized. |
collapseAnimation | "ease-in-out" | "bounce" | "linear" | { duration: number; easing: "ease-in-out" | "bounce" | "linear" | ((t: number) => number); } | undefined | Animate the collapse/expand |