---
generated_at: 2026-02-26 10:05:00
metrics:
  claims_total: 25
  claims_with_evidence: 24
  claims_without_evidence: 1
confidence_derived: 0.96
---

# 根拠レポート：2-Header（ナビゲーションバー）

## 本レポートについて

### 目的
本レポートは、生成された設計書・ドキュメントの信頼性を検証し、人間レビュアーが効率的にレビューできるようにすることを目的としています。

### チェック方法
以下の観点でドキュメントの内容（Claim：主張）を検証しています：

1. **根拠の有無確認**：各主張に対して、ソースコード・既存設計書・要件定義書などの根拠（Evidence）が存在するか
2. **根拠との整合性**：主張の内容が根拠と矛盾していないか
3. **網羅性**：参照すべき情報源を適切にカバーしているか

### 信頼度スコアの算出
- **confidence_derived** = 根拠あり件数 / 総主張件数
- 状態「○」：根拠あり、「△」：根拠不足または要確認

### 本レポートの使い方
1. まず「サマリー」で全体の信頼度と優先レビュー項目を確認
2. 「Claims と根拠の対応」で △ の項目を重点的にレビュー
3. 「不足情報」で補完が必要な情報源を確認

---

## 1) サマリー（まず見るところ）
- 総合信頼度（derived）：**0.96**
  - 根拠あり：24 / 25、根拠なし：1
- 優先レビュー（高）
  1. **__COMMIT__ の注入メカニズム**：ビルド設定ファイルの直接確認が不足
  2. **クリップボード API 非対応時の挙動**：例外ハンドリングの記述が推測に基づく
  3. **ReplStore 型の詳細プロパティ**：@vue/repl パッケージの内部型定義に依存

## 2) 参照した情報（Evidence一覧）

- E-01: `packages-private/sfc-playground/src/Header.vue`（319行）
- E-02: `packages-private/sfc-playground/src/App.vue`（207行）
- E-03: `packages-private/sfc-playground/src/VersionSelect.vue`（152行）
- E-04: `packages-private/sfc-playground/src/download/download.ts`（42行）
- E-05: `docs/code-to-docs/画面機能マッピング/画面機能マッピング.csv`
- E-06: `docs/code-to-docs/画面遷移図/画面遷移図.md`

## 3) Claims と根拠の対応（レビューの主戦場）
| Claim ID | 主張 | Evidence | 状態 |
|---|---|---|---|
| C-01 | defineProps で store, prod, ssr, autoSave, theme を受け取る | E-01（13-19行目） | ○ |
| C-02 | defineEmits で 5種のカスタムイベント定義 | E-01（20-26行目） | ○ |
| C-03 | vueVersion computed で loading 時に 'loading...' を返す | E-01（32-37行目） | ○ |
| C-04 | setVueVersion で store.vueVersion を設定 | E-01（39-41行目） | ○ |
| C-05 | resetVueVersion で store.vueVersion を null に設定 | E-01（43-45行目） | ○ |
| C-06 | copyLink で metaKey 判定後にクリップボードコピーまたはリダイレクト | E-01（47-56行目） | ○ |
| C-07 | toggleDark で dark クラスをトグルし localStorage に保存 | E-01（58-66行目） | ○ |
| C-08 | DEV/PROD ボタンが $emit('toggle-prod') を発火 | E-01（102行目） | ○ |
| C-09 | SSR ボタンが $emit('toggle-ssr') を発火 | E-01（111行目） | ○ |
| C-10 | AutoSave ボタンが $emit('toggle-autosave') を発火 | E-01（118行目） | ○ |
| C-11 | Reload ボタンが $emit('reload-page') を発火 | E-01（133行目） | ○ |
| C-12 | Download ボタンが downloadProject(store) を呼び出し | E-01（139行目）, E-04 | ○ |
| C-13 | GitHub リンクが外部サイトを新規タブで開く | E-01（143-150行目） | ○ |
| C-14 | VersionSelect を TypeScript用と Vue用に2回使用 | E-01（76-97行目） | ○ |
| C-15 | TypeScript VersionSelect は v-model で直接バインド | E-01（77行目） | ○ |
| C-16 | Vue VersionSelect はカスタムイベントとスロットを使用 | E-01（81-97行目） | ○ |
| C-17 | Share ボタンのメッセージ "Sharable URL has been copied to clipboard." | E-01（55行目） | ○ |
| C-18 | nav 高さは CSS 変数 --nav-height で定義 | E-01（168行目）, E-02（192行目） | ○ |
| C-19 | レスポンシブ対応: 560px 以下でフォントサイズ縮小 | E-01（201-205行目） | ○ |
| C-20 | レスポンシブ対応: 520px 以下でタイトル非表示 | E-01（207-211行目） | ○ |
| C-21 | PROD モードは紫、DEV モードは緑の背景色 | E-01（225-232行目） | ○ |
| C-22 | SSR/AutoSave の enabled 状態で緑背景 | E-01（239-243行目） | ○ |
| C-23 | App.vue が Header に 5 つのプロパティを渡す | E-02（149-154行目） | ○ |
| C-24 | App.vue が Header から 5 つのイベントをハンドリング | E-02（155-159行目） | ○ |
| C-25 | __COMMIT__ はビルド時に vite の define で注入 | **根拠なし** | △ |

## 4) 不足情報（Unknown / Missing）
- C-25: `__COMMIT__` の注入メカニズムについて、vite.config.ts や rollup 設定ファイルでの define 設定を直接確認していない。Header.vue 内で `__COMMIT__` が使用されていること（30行目）は確認済みだが、注入元の設定ファイルは本調査範囲外
  - 候補：`packages-private/sfc-playground/vite.config.ts` / プロジェクトルートの `rollup.config.js` / `vitest.config.ts`

## 5) リスクフラグ（レビュー観点）
- 0: 低リスク - コンポーネントのプロパティ・イベント定義はソースコードから直接確認可能
- 0: 低リスク - UI操作とイベント発火の対応関係はテンプレートから明確に読み取れる
- 1: 中リスク - navigator.clipboard API の非対応環境でのエラーハンドリングが不足している可能性

## 6) レビュアーチェックリスト（最小）
- [ ] __COMMIT__ グローバル変数がビルド時に正しく注入されているか確認
- [ ] Share ボタンの metaKey によるローカルリダイレクト機能がセキュリティ上問題ないか確認
- [ ] navigator.clipboard API 非対応ブラウザでのフォールバック処理の必要性を検討
- [ ] VersionSelect の v-model バインディングと @update:model-value の使い分けが適切か確認
