空状態EmptyState
Experimental

データがない、検索結果がない、読み込みに失敗したなどの状態を、説明と次の操作付きで表示します。

プロジェクトがありません

最初のプロジェクトを作成すると、環境とメンバーをまとめて管理できます。

状態とバリエーション

検索やフィルターの実行結果が 0 件だったことを伝え、解除操作を近くに置きます。

一致する結果がありません

検索条件を変更するか、フィルターを解除してください。

まだデータがない理由と、最初に取るべき操作を明確にします。

まだ素材がありません

素材をアップロードすると、一覧と検索で管理できます。

データ取得に失敗した場合は、原因と再試行操作を同じ面に置きます。

データを読み込めませんでした

ネットワークを確認してから、もう一度試してください。

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

プロパティ	型	初期値	説明
icon	ReactNode	-	タイトルの上に表示する補助アイコンです。
title	ReactNode	-	空状態の見出しです。
description	ReactNode	-	原因や次の行動を短く説明する本文です。
action	ReactNode	-	作成、再試行、解除などの主要操作です。
children	ReactNode	-	補足リンクや追加アクションを配置する領域です。