# 画面設計書 55-ファイル行番号表示

## 概要

本ドキュメントは、Laravel例外レンダラーにおけるファイルパスと行番号表示コンポーネントの画面設計書である。スタックトレース内でエラー発生箇所のファイルパスと行番号を表示し、設定されたエディタで直接開くためのリンク機能を提供するUIコンポーネントを定義する。

### 本画面の処理概要

本コンポーネントは、Laravel例外レンダラーの一部として、例外発生箇所のファイルパスと行番号を表示する役割を担う。エディタ連携機能により、開発者はワンクリックでエラー発生箇所をIDEで開くことができる。

**業務上の目的・背景**：デバッグ作業において、エラー発生箇所を素早く特定しコードを確認することは最も基本的な作業である。本コンポーネントは、ファイルパスと行番号を明確に表示するだけでなく、config('app.editor')が設定されている場合はエディタ（VSCode、PHPStorm等）で直接該当箇所を開くリンクを提供する。これにより、開発者はエラー画面からシームレスにコード編集に移行でき、デバッグ効率が大幅に向上する。

**画面へのアクセス方法**：開発環境（APP_DEBUG=true）でアプリケーション実行中に例外が発生すると、自動的に例外詳細画面が表示される。本コンポーネントは各スタックフレームの情報表示において使用される。

**主要な操作・処理内容**：
1. フレームオブジェクトからファイルパスと行番号を取得
2. ツールチップによるフルパス表示
3. エディタ設定時のリンク生成（editorHref）
4. テキスト方向（LTR/RTL）のサポート

**画面遷移**：本コンポーネントをクリックすると、設定されたエディタで該当ファイルの該当行が開かれる（アプリケーション外への遷移）。

**権限による表示制御**：本コンポーネントはAPP_DEBUG=trueの開発環境でのみ表示される。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 36 | ビューファクトリ | 主機能 | エラー発生ファイルパスと行番号の描画 |

## 画面種別

部品（UIコンポーネント）

## URL/ルーティング

本コンポーネントは直接ルーティングされるものではなく、他のコンポーネントから呼び出されて表示される。

## 入出力項目

### 入力項目（Props）

| 項目名 | 属性名 | 型 | 必須 | デフォルト値 | 説明 |
|--------|--------|------|------|-------------|------|
| フレーム | frame | Frame | 必須 | - | スタックフレームオブジェクト |
| テキスト方向 | direction | string | 任意 | 'ltr' | テキスト方向（'ltr' または 'rtl'） |

### 出力項目

| 項目名 | 説明 |
|--------|------|
| ファイルパス | 相対パス形式のファイルパス |
| 行番号 | コロン区切りの行番号 |
| エディタリンク | 設定時のみクリック可能リンク |

## 表示項目

| 項目名 | 表示形式 | スタイル |
|--------|----------|----------|
| コンテナ | インライン | truncate font-mono text-xs |
| ファイルパス | テキスト | hover:underline（リンク時） |
| 行番号 | テキスト | text-neutral-500 |
| ツールチップ | ホバー時 | data-tippy-content |

## イベント仕様

### 1-ファイルパスクリック（エディタ設定時）

ファイルパスをクリックすると、設定されたエディタで該当ファイルの該当行が開かれる。

**処理フロー**：
1. ユーザーがファイルパスリンクをクリック
2. frame->editorHref()で生成されたURLに遷移
3. OSが設定されたエディタを起動し該当行を開く

**対応エディタ例**：
- VSCode: `vscode://file/{path}:{line}`
- PHPStorm: `phpstorm://open?file={path}&line={line}`

## データベース更新仕様

### 操作別データベース影響一覧

本コンポーネントはデータベース操作を行わない（読み取り専用の表示コンポーネント）。

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | データベース操作なし |

## メッセージ仕様

本コンポーネントは固定メッセージを使用しない。

## 例外処理

| 状態 | 処理内容 |
|------|----------|
| エディタ未設定時 | リンクなしのテキストとして表示 |
| ファイルが存在しない時 | Frame::file()が'[internal function]'等を返す |

## 備考

- Tailwind CSSを使用したスタイリング
- ダークモード完全対応（dark:プレフィックスによる切り替え）
- @click.stopでイベントバブリングを防止（親要素のクリックイベントと競合しない）
- dir属性でRTL言語サポート

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

まず、プログラム間で受け渡されるデータ構造を理解することが重要。このコンポーネントはFrameオブジェクトを受け取る。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | Frame.php | `src/Illuminate/Foundation/Exceptions/Renderer/Frame.php` | file()、line()、editorHref()メソッド |

**読解のコツ**:
- file()メソッド（行118-125）: basePathを除去した相対パスを返す
- line()メソッド（行132-141）: ファイルの最大行数を超えないよう調整
- editorHref()メソッド（行92-95）: ResolvesDumpSourceトレイトを使用

#### Step 2: コンポーネント本体を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | file-with-line.blade.php | `src/Illuminate/Foundation/resources/exceptions/renderer/components/file-with-line.blade.php` | @propsでframeとdirectionを受け取る |

**主要処理フロー**:
- **行1**: @props(['frame', 'direction' => 'ltr'])でプロパティ定義
- **行3-6**: @phpブロックでfileとlineを取得
- **行8-21**: 条件分岐でエディタリンクまたはプレーンテキスト表示
- **行12**: data-tippy-contentでツールチップ設定
- **行13-16**: config('app.editor')判定でリンク生成

### プログラム呼び出し階層図

```
file-with-line.blade.php
    │
    ├─ Frame::file()（相対パス取得）
    │
    ├─ Frame::line()（行番号取得）
    │
    └─ Frame::editorHref()（エディタURL生成）
           │
           └─ ResolvesDumpSource::resolveSourceHref()
```

### データフロー図

```
[入力]                      [処理]                              [出力]

Frame ─────────────▶ file() ────────────────────────▶ ファイルパス表示
                            │
                     line() ────────────────────────▶ 行番号表示
                            │
               config('app.editor') ──▶ editorHref() ──▶ リンクURL
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| file-with-line.blade.php | `src/Illuminate/Foundation/resources/exceptions/renderer/components/file-with-line.blade.php` | テンプレート | ファイル行番号表示UI |
| Frame.php | `src/Illuminate/Foundation/Exceptions/Renderer/Frame.php` | ソース | フレームデータ提供 |
| ResolvesDumpSource.php | `src/Illuminate/Foundation/Concerns/ResolvesDumpSource.php` | ソース | エディタリンク生成 |
