バナーBanner
Experimental

ページ全体に関係するお知らせや状態を横長のバーで表示します。

新しいリリースを公開しました。主な変更点を確認できます。

状態とバリエーション

画面全体に知らせたい更新と、関連する操作を一緒に出します。

新しい権限設定を利用できます。

ユーザーが事前に把握すべき予定停止や制限を示します。

2026年6月3日 02:00-04:00 JST にメンテナンスを行います。

現在起きている障害や強い注意が必要な状態に使います。

API の書き込み処理が遅延しています。復旧状況を確認してください。

大きな完了を短く伝え、不要になれば閉じられるようにします。

ワークスペースの初期設定が完了しました。

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

プロパティ	型	初期値	説明
variant	'default' \| 'info' \| 'success' \| 'warning' \| 'destructive'	'default'	バナーの意味に応じた見た目です。
icon	React.ReactNode	-	先頭に表示する補助アイコンです。
action	React.ReactNode	-	閉じるボタンの前に表示する補助アクションです。
onDismiss	() => void	-	指定すると閉じるボタンを表示し、押下時に呼び出します。
dismissLabel	string	'Dismiss'	閉じるボタンのアクセシブルラベルです。
children	React.ReactNode	-	バナーに表示する本文です。長い文は1行で省略されます。