ドロワーDrawer
Experimental

画面の端から補助的な内容を開き、設定や詳細をその場で確認できるドロワーです。

状態とバリエーション

モバイル寄りの補助操作や短いフォームに向いた標準形です。

広い画面では、詳細パネルや設定パネルとして右側から開けます。

ナビゲーションや補助メニューを左側から開く構成です。

短い確認や一時的な設定を上部から表示できます。

表は横にスクロールできます

プロパティ	型	初期値	説明
open	boolean	-	開閉状態を外部で制御します。
onOpenChange	(open: boolean) => void	-	開閉状態が変わった時に呼び出されます。
side	"bottom" \| "right" \| "left" \| "top"	"bottom"	DrawerContent の表示方向です。
shouldScaleBackground	boolean	true	開いた時に背面を縮小するかを制御します。
container	HTMLElement \| null	-	Drawer のポータルや背面処理を閉じ込めるコンテナです。
portalContainer	HTMLElement \| null	-	DrawerContent を描画するポータル先です。docs や埋め込みプレビュー内に閉じ込める時に使います。
overlayClassName	string	-	DrawerOverlay に追加するクラス名です。