SlidePanel
画面右からスライドインするパネル。詳細表示や編集フォームに使用。
|
import { SlidePanel } from "@blueai/ui"Examples
Basic
const [open, setOpen] = useState(false);
<SlidePanel open={open} onClose={() => setOpen(false)}>
<SlidePanel.Header>詳細情報</SlidePanel.Header>
<SlidePanel.Body>
<p>スライドパネルのコンテンツ</p>
</SlidePanel.Body>
</SlidePanel>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| open* | boolean | — | 表示状態 |
| onClose* | () => void | — | 閉じるハンドラ |
| width | number | 480 | パネルの幅 (px) |
| children | ReactNode | — | SlidePanel.Header / SlidePanel.Body / SlidePanel.Footer を配置 |