ユースケース別（逆引き）

月カレンダー＋日付にイベント

編集/コンテンツカレンダー・予約。日セルにチップ。

週の時刻グリッド（重なりを横に詰める）

面接/予定を時刻×曜日で。

リソース行×連続時間軸（レーン詰めバー）

生産ライン・設備/車両・工程。バーは行内でレーン詰め＝交差する斜線にはならない。時間×距離で斜線が交差する運行図表(列車/バス)は Stringline。

時間×距離の運行図表＝停車駅を横切る斜めの運行線（列車/バス運行図表・ダイヤグラム・Marey）

停車駅=距離(y)軸・時間=x軸・各運行は斜めの線(傾き=速度・接近=続行/追越)。上下双方向・now-line・予実(計画破線/実績実線)・運行を選択可。鉄道/バス/路面/フェリーの運行・ダイヤ図表。Gantt が構造的に描けない図(Gantt は y=識別・Stringline は y=距離で交差可)。航空(固定軌道無し)は Gantt/ScheduleGrid。

日付・期間を選ぶ

単一日は DatePicker・期間は DateRangePicker。正確な時刻(HH:mm)は TimePicker。配達/集荷の時間帯(午前中/12〜14時/14〜16時)は SegmentedControl か バンドの RadioGroup で、TimePicker ではない(TimePicker は正確時刻でバンドではない)。

単親ツリー（組織図・階層）

開閉・1ノード1親。

ファイル/フォルダツリー

時系列の出来事

A→B 区間ヘッダ＝出発 → 到着 を横並びで（東京 → 新大阪 / HND → CTS / POL → POD / 発→着 時刻）・入れ替え・経由つき

from/to(+via) 端点(ラベル＋コード/時刻の sub)・矢印か所要時間の connector・出発⇄到着 入れ替え。inline＝発→着 の結果行用コンパクト版。交通/物流の検索・結果画面が開く横並びの A→B。RouteStops/Itinerary ではない＝あれらは縦に流れるシーケンス(配送停留所/日別プラン)で形が逆。

路線/系統番号のチップを路線のブランド色で（渋88 / JY / 丸ノ内線 / G＝接近案内・経路候補・区間行・運行ラベル）

路線の hex ブランド色で塗りつぶし・文字は輝度で黒/白に自動コントラスト・ラベルが意味を担う(色非依存)。識別チップ＝Badge(状態/意味トーン)ではない。ListCard の leading・経路候補・Stringline 運行ラベルに。色省略で中立チップ。

旅程/ジャーニー：便/ホテル/アクティビティを日別に、または乗換経路（種別アイコン・リッチ内容・tap）

未来の旅程＝日別グループ・項目ごとの種別アイコン/トーン・内容スロット・onSelect。Timeline より厚く、RouteStops(配送語彙 未配/配送中/予実 固定)より適切。

順序づいた段階（状態＋予実＋遅延）＝状態トラッキング/段階オペ進捗（配送/注文/修理/手荷物/ターンアラウンド/予実を見張る工程）

番号付き段階・状態(pending/current/completed/delayed)・現在ステップ・statusLabels で再ラベル・段階ごとアクション。時刻は2モード＝当日の予実 plannedTime/actualTime "HH:MM"＋自動 Delta(当日配送・ターンアラウンド 到着→PBB→取卸→給油→搭載→出発)／日付跨ぎは per-stop の dateLabel で多日・多週の追跡(貨物追跡/国際輸送/通関/cross-dock＝5/12 輸出通関→5/16〜5/29 海上輸送→6/5 納品)。よって宅配追跡も国際輸送追跡もここ(dateLabel 使用)で当日に限らない。Stepper より適(タイミング/Delta 無し)。未来の旅程/乗換は Itinerary・純粋な承認は ApprovalSteps。

企業/組織/制度の identity セル＝四角ロゴ＋名前＋業種/所在地

PersonCell の人でない兄弟＝会社/補助金制度/取引先/アカウント。四角ロゴ(丸アバター/presence ではない)。MatchCard の左右に。

二者間のマッチ/ペアリング詳細＝A と B を並べ＋適合度＋要件 factor（求貨求車 荷物×空車・M&A 売り手×買い手・補助金 自社×制度・候補×案件）

エンティティ非依存の left+right(CompanyCell/PersonCell/任意・2側は異なる種類でも可=会社×制度)・中央 score・factors[] 内訳・アクション。マッチング/推薦/ディール/比較コンソールの核。RelationshipRow ではない＝2つの PersonCell(人⟷人)を固定し score/factor 領域が無い・会社×会社/×制度 に使うと組織にアバターを強制し型も通らない。

2人を並べる（上司↔部下・担当↔利用者）

1on1・メンター・ケア担当の組＝人専用(from/to は PersonCell)。会社/制度/人でないペアは MatchCard。

アバターの集合

ランキング/番付：best・worst（売上 top-N、事故率/赤字/苦情のワースト、系統別・営業所別・担当別）

事前順序付けの行＋ランクチップ＋値バー＋Delta。並びは呼び出し側（best/worst）＝ランクは位置。上昇＝悪い時は deltaTones で赤反転。StatGroup(無順序KPI)でも BarChart(順位なしチャート)でも ParetoChart(ABC累積%)でもない。

対応キュー：要対応の worklist（失効防止/更新/満期・ダイヤ乱れ・アラート対応）

重大度ソートの行（アイコン＋トーン・色のみに非依存）＋種別チップ＋期日＋アクション。StatGroup と対。単発は Alert・常駐ベルは NotificationCenter。

単一の指標

差分/トレンド付き KPI ヒーローカード

ポイント/残高/ランクのヒーロー（ロイヤリティ・マイル・IC・会員特典）

残高＋ランクバッジ＋次ランクへの進捗(higher-is-better)＋失効＋アクション・ブランドのグラデーション面。B2C ロイヤリティの華＝StatGroup(平らなKPI行)でも AnalyticsCard(トレンド)でもない。

容量/稼働/充足のメーター

value÷MAX のバー(閾値は max の割合)。金額整形は formatValue={formatCurrency}・direction でトーン意味。実単位の名前付き上限 vs 値(拘束時間/SLA/過積載/残業＝基準13h で超過状態)は LimitMonitor で Meter ではない(target は参照のみ・閾値は max 割合)。

測定値を基準範囲で判定（バイタル・公差・基準値 H/L）

数値レンジ専用・H/L/HH/LL 自動。日付の有効期限は ExpiryBadge。名前付きソフト/ハード上限 vs 値でバー付き(拘束時間/SLA/quota)は LimitMonitor(ReferenceValue は超過状態はあるがバー/上限線が無い)。

値 vs 名前付き上限＝バー+超過状態（改善基準告示 拘束時間/連続運転/休息・SLA・quota・過積載・残業・レート制限）

上限は値の単位そのまま(基準13h/上限16h)・超過トーンはそこから導出(ok/near/over/critical)・上限を線で描画・どれだけ近い/超過かのバー。direction='floor' で下限(休息11h)。純関数 classifyLimit()。value-vs-X の4番目＝ExpiryBadge(期限)/ReferenceValue(範囲)/Meter(容量)/LimitMonitor(名前付き上限)。Meter(max割合+参照のみ target)でも ReferenceValue(バー/線無し)でもない。

日付 vs 期限＝有効期限カレンシー（免許・資格・適性診断・健診・車検・保険・認証・点検→有効/期限間近/失効）

Meter(容量)と ReferenceValue(数値レンジ)の日付ドメイン版＝値 vs 期限。色安全な状態チップ(アイコン+ラベル)+日付+残N日/N日超過・純関数 classifyExpiry(date,{today,warnWithinDays})→{state,days} が flagValue の対。SSR は today を渡す。ReferenceValue(数値専用)ではない。

符号付き差分・増減

金額の導出：明細 − 控除 = 合計（請求/見積/査定/支払/精算/控除/給与明細）

確定済みの金額導出（小計・数式つき）。金額は渡した値を表示するだけで合算はしない。編集入力は EditableDataTable。日付/客先でグループ化し各グループ小計のある取引一覧は SectionList。

ダウンロードできる書類/ファイル行＝ファイルアイコン＋名前＋meta（PDF・サイズ・発行日）＋DLボタン（＋一括選択チェックボックス）

独立した複数の操作対象＝先頭のコントロール(Checkbox)・ファイル本体(アイコン＋名前＋meta・onOpen でプレビュー)・末尾の独立した DL Button。帳票/明細/書類/添付/DL 画面の背骨。ListCard ではない＝onSelect でカード全体が1つの button になり DL ボタンを入れ子にすると不正な HTML＋フォーカス順が壊れる。年/種別グループは SectionList で。

セクションにグループ化＋各グループ小計のリスト（利用明細/取引履歴を月別・請求を締め/客先別・明細書・台帳を日付別）

groupBy＋セクション見出し(title+sublabel+右寄せ集計)＋任意のグループ小計フッター。本文非依存＝ListCard(モバイル履歴)/Table(デスクトップ請求)/符号付き台帳行を入れる・グルーピングと小計計算とクロスグループ選択は呼び出し側。履歴/利用明細/取引履歴/明細書/客先別請求 の手組みの背骨。StatusBoard.groups(状態タイル)/Itinerary.days(旅程)/フラットな DataTable(グループ/小計なし)ではない。

設定/アカウント/マイページのナビ行＝`[アイコン] ラベル … 現在値 [›]` で詳細を開く/遷移（お支払い方法・送付方法・通知・プロフィール）

flush 行＝先頭アイコン＋ラベル＋説明＋右寄せ現在値＋末尾 chevron。onSelect でナビ/ディスクロージャーの button(aria-haspopup・aria-pressed ではない)。SettingGroup で丸角＋ハイライン区切り。ListCard ではない＝ListCard.onSelect は aria-pressed(トグル/選択状態)で、詳細を開く行には a11y 的に誤り。静的な操作行は NavRow の trailing に Switch/Badge(onSelect 無し)。

価格つき選択カード—1つを選ぶ（プラン/きっぷ/配送/支払方法）

RadioGroup の単一選択(role=radio+キーボード)＋カード本体：タグ＋タイトル＋エリア/期間＋強調価格＋おトク＋チェック。B2C 購入/プラン選択の原子＝ListCard(onSelect は aria-pressed トグルで pick-one には a11y 的に不適)でなくこちら。

横スクロールの単一選択カテゴリ chip バー（施設/一覧ファインダーのナビ：施設カテゴリ/ジャンル/エリア）

多カテゴリ・横スクロール・塗りつぶし active・矢印キー・スクロールバー非表示＝消費者ファインダーのナビ(空港/駅施設・食べログ・小売)。2-4等幅は SegmentedControl・ポップオーバー多面は FilterButton。

小さいインライン単一選択トグル（旅客区分 大人/小児・支払い 現金/IC/QR・片道/往復・出発/到着・個人/法人・日/週/月）

凹んだトラックに2-4等幅セグメント・active が浮く・role=radiogroup＋矢印キー・onValueChange は単一 string。モバイルの either/or 切替。ToggleGroup(汎用・content-fit・単/複両用・union 型・等幅は CSS で偽装)でも RadioCard(大きな価格付き選択カード)でも Tabs(コンテンツ切替)でもない。

操作可能な座席/区画ピッカー（通路つき2Dグリッド・座席ごとの状態/種別/料金・複数選択）

航空/新幹線の座席・映画・スタジアム・イベント・レストラン卓。selectedIds+onToggle+maxSelectable・grid a11y。読み取り専用の強度は HeatmapChart。

モバイル app-bar / ページヘッダー（戻る＋タイトル＋アクション・sticky・≥44px・ノッチ対応）

消費者のスマホ画面に要る上部バー＝onBack・title/subtitle・actions・safe-area・左/中央寄せ。スマホ専用＝デスクトップの業務コンソール/ダッシュボードの見出しバーは Header(+HeaderBrand/HeaderActions)・これではない。

下部固定アクションバー（走行サマリ＋主要CTA）＝決済/配車/予約/注文

取引/リアルタイム消費者画面が下で終わるドック＝children に走行サマリ(合計/到着まで○分/件数)・actions に CTA(呼ぶ/支払う/予約)・下部固定+safe-area-inset(ホームインジケータ回避)。PageHeader(上)の対。stack で CTA を全幅で上に。StatusBar(固定幅のデスクトップ状態帯)ではない。

デスクトップ業務コンソール/ダッシュボードの見出しバー（ブランド＋タイトル＋アクション・全幅クローム）

配車/監視/分析コンソールの上部クローム＝HeaderBrand＋タイトル＋HeaderActions。PageHeader(スマホ専用)のデスクトップ版・壁掛け/デスクの業務画面はこちらでモバイル app-bar ではない。

ソート/ページング/絞り込み・モバイルでカード化する表

renderCard でモバイルはカード崩し。消費者向けの tap リストは ListCard。デスクトップの行選択+一括操作(案件→車両一括割当/一括承認/一括処理/N件選択→実行)は ActionDataTable(selectedIds+onSelectionChange+bulkActions[]+チェックボックス列)で、DataTable にチェックボックス列を手組みしない。モバイルの複数選択+一括操作(経費まとめDL/一括)は ListCard(leading に Checkbox)+BottomActionBar(選択中N件+CTA)。

業務データ表＝行アクション/行選択+一括操作（案件一括割当・一括承認・一括ステータス変更）

DataTable＋チェックボックス列・制御 selectedIds+onSelectionChange・全選択ヘッダ・選択集合に効く bulkActions[]（配車：未割当案件を選択→車両に一括割当）。デスクトップの『N行選択→実行』ワークフロー＝DataTable に選択を手組みしない。行ごとのインライン操作だけ(一括なし)は DataTable に操作列。

編集できる明細・列揃え合計（データ入力）

セルが入力・行追加削除。確定済みの金額導出は AmountBreakdown。

素の表プリミティブ

棒・積み上げ棒

ABC分析・パレート（上位＋累積80%）

累積%軸が内蔵。2チャート重ねで偽装しない。

構成比（ドーナツ）

ドーナツ＋中央合計＋コールアウト。素は DonutChart（showLegend）。LabeledDonutCard は showCallouts。

多軸レーダー（360度/多面評価）

星評価＝表示専用（平均★4.92・件数の読み出し）

role=img・value/max/reviewCount/showValue。表示専用＝onChange も focusable star も無い。評価の入力(乗車後評価・レビュー投稿でタップ/キーボードで★を選ぶ)は星の radiogroup を構成(focusable ボタン+矢印キー+≥44px)・専用 RatingInput は #406 で提案中・Rating に onChange を付けようとしない(存在しない)。

曜日×時間帯の強度（読み取り専用・値の色塗り）

読み取り専用の強度グリッド(行列)。操作可能な座席選択は SeatMap。単一の定性レベル表示(混雑度/在庫/レベル)は別＝Badge+icon+tone(下記)でグリッドではない。

定性ステータス/レベル表示（空いています/やや混雑/混雑・在庫 多/少・鮮度・信号レベル・合否ゲート）

順序づいた2〜4レベルを1つのピルで＝Badge に leading icon ＋ semantic variant(success/warning/destructive)・色のみに依存しない。HeatmapChart(読み取り専用の強度グリッド)ではない。専用の StatusLevel/QualitativeStatus(levels[]→トーン+アイコン+色安全ラベル)は #376 で提案中・当面は Badge で構成。

稼働状態盤（車両/機器/区画＝多数のエンティティ・各々 状態＋場所・故障が目立つ・グループ化）

配車/監視の盤＝エンティティのタイルグリッド・色安全な状態ピル+トーン・故障優先ソート・エリア別グループ+要対応件数・onSelect。タクシー配車盤/駅務機器盤/ランプGSE/工場OEE。Gantt(行×時間)/DataTable(ソート表)/HeatmapChart(読み取り専用の色塗り行列)ではない＝選択可能な状態エンティティの空間的な盤。

1本バーの分布・キャリブレーション

ゲージ

承認ステップ表示

多段ウィザード/フォームの進捗（対象選択 → 確認 → 完了）

決済/払戻し/登録/申込フローの段階表示＝steps[] の {label,state}・横並びは375px最適化。表示のみ(状態とボトムバーは自前)。承認は ApprovalSteps、状態追跡は RouteStops。

署名・ロック・追記のみの法的記録（確定後は追記のみ）

退院サマリ・介護記録・ケアプラン交付。署名でロック・修正は追記。

2人確認・ダブルチェック

同一人物ガード付き（与薬・人事確定・明細確定）。

円/数値/％の整形（ja-JP・JPY 既定）

Intl 不要。formatValue prop にも渡せる。

バーコードスキャン・段階スキャン（事業者がコードを読み取る）

レジ/係員側＝読み取る。提示する券面(搭乗券/クーポン/会員証)は TicketStub。

提示用の券面（搭乗券/eチケット/クーポン/会員証）＝バーコード/QR＋ミシン目

value＋format(code128/qr)＋可読ラベル＋ミシン目＋内容スロット(OD/割引/ランク)。ScanInput の消費者側ミラー(提示 vs 読取)。実スキャンは code で差替。

チェックリスト（チェック＋ラベル＋読み上げ名）