トグルToggle
Experimental

押下状態を持つ単体のオン/オフボタンです。

状態とバリエーション

単体のオン/オフ操作に使います。アイコンだけならツールチップを併用します。

選択中は背景色と文字色を反転し、オンになっていることを明確に示します。

ツールバー上で境界を見せたい場合に使います。

配置するツールバーや密度に合わせて、sm / default / lg を使い分けます。

操作できない状態でもボタンの形は保ち、ツールチップで理由を補足します。

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

プロパティ	型	初期値	説明
variant	'default' \| 'outline'	'default'	見た目の種類です。枠線を見せたい時は outline を使います。
size	'default' \| 'sm' \| 'lg'	'default'	トグルボタンのサイズです。
pressed / defaultPressed	boolean	-	オン状態を制御、または初期値として指定します。
onPressedChange	(pressed: boolean) => void	-	オン/オフが変わった時に呼ばれます。
disabled	boolean	false	操作できない状態にします。理由が必要な場合はツールチップで補足します。
aria-label	string	-	アイコンだけのトグルには必ず操作名を付けます。