https://github.com/reflex-dev/reflex-resizable-panels
https://github.com/reflex-dev/reflex-resizable-panels
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/reflex-dev/reflex-resizable-panels
- Owner: reflex-dev
- Created: 2024-05-15T13:39:49.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-15T17:17:56.000Z (about 1 year ago)
- Last Synced: 2025-08-18T17:58:06.985Z (5 months ago)
- Language: Python
- Size: 9.77 KB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# resizable-panels
A Reflex custom component resizable-panels.
## Installation
```bash
pip install reflex-resizable-panels
```
## Usage
```python
from reflex import rx
from reflex_resizable_panels import resizable_panels as rzp
def index():
return rx.box(
rzp.group(
rzp.panel("Header", default_size=20, min_size=20),
rzp.handle(),
rzp.panel(
"Content",
background_color=rx.color("gray", 10),
default_size=80,
min_size=20,
),
),
width="100vw",
height="100vh",
)
```
## API
### PanelGroup
- `children`: List of `Panel` and `Handle` components.
- `auto_save_id`: `str` - ID to save the layout in LocalStorage.
- `direction`: `Literal["horizontal", "vertical"]` - Direction of the panels. Default is `horizontal`.
### Panel
- `children`: `Component` - Content of the panel.
- `default_size`: `int` - Default size of the panels.
- `min_size`: `int` - Minimum size of the panels. Default is `10`.
- `max_size`: `int` - Maximum size of the panels. Default is `100`.
- `collapsible`: `bool` - If `True`, panel can be collapsed by resizing below `min_size`.
- `collapsed_size`: The size of the panel when it is collapsed. Default is `0`.
- `order`: `int` - Order of the panel in the group. Required when using panels in `rx.cond`
Disclaimer:
> Resizable panels don't work when used inside `rx.container`. However, `rx.container` inside resizable panels do work.