よくあるテーブル

• テーブル: オブジェクト名（必須）・属性情報・行操作ボタンを含む。行操作ボタンは最大 3 つ。それ以上は DropdownMenu にまとめる。
• 見出し: 「顧客一覧」「会話履歴」などオブジェクト名を使う。右端にテーブル操作ボタン（新規作成・一括操作）を置く（最大 3 つ）。
• テーブル操作エリア: 見出し右端。データの追加・一括変更など恒久的な操作を置く。
• 一時操作エリア: テーブルの上下。検索・フィルター・ページネーションなど状態依存の操作を置く。

標準レイアウト

テーブルを Card（Base）の中に収める。カラムが少なく横スクロールが不要な場合に使う。カイクラの顧客一覧・フォーム一覧が該当する。

フル幅レイアウト

テーブルをブラウザ横幅いっぱいに広げる。カラムが多く横スクロールが必要な場合に使う。水平スクロールは情報の一覧性を下げるため、固定すべきカラム（ID・オブジェクト名）には fixed を指定して常時表示する。

初期表示（0 件）

• テーブル中央に「まだ登録されていません」などの案内メッセージを表示する
• テーブル操作エリア（新規作成ボタン）は表示したまま、一括操作ボタンは非表示にする

検索結果なし

• テーブルヘッダーは表示し、ボディ部分に「条件に一致する結果はありませんでした」を中央表示する
• ページネーションは非表示にする

1 ページ以内（ページネーション不要）

• すべての要素を表示する。ページネーションのみ非表示にする

テキスト検索

フリーテキストで複数属性を横断検索する。検索対象の属性名（例：「電話番号・顧客名で検索」）を placeholder に明示し、何が検索できるかをユーザーに伝える。

フィルター

属性値による絞り込みには Select または Combobox を使う。選択肢が 7 件以下なら Select、それ以上またはユーザー入力が必要な場合は Combobox を選ぶ。複数のフィルターを横並びに配置し、テキスト検索の右に続ける。

条件リセット

フィルターが 1 つ以上適用されているとき、「条件をリセット」リンクを右端に表示する。全条件を一括解除する。条件が何も適用されていない初期状態では非表示にする。

件数表示

絞り込み中は「N 件中 M 件を表示」をフィルター行の直下に小さく表示する。ユーザーが絞り込みの効果を把握できるようにする。