# 画面設計書 25-メールパネル

## 概要

本ドキュメントは、LaravelフレームワークのHTMLメールテンプレートにおけるパネルコンポーネント（panel.blade.php）の設計仕様を定義するものである。

### 本画面の処理概要

本コンポーネントは、HTMLメール内でコンテンツを視覚的に区別するためのパネル（囲み枠）を提供する部品である。重要な情報、注意事項、引用文などを目立たせるために使用される。

**業務上の目的・背景**：メールコンテンツの中で特に注目させたい情報を視覚的に強調するために、パネルコンポーネントは効果的である。例えば、請求金額の表示、重要な日付の告知、アカウント情報の概要など、ユーザーが見逃してはいけない情報を囲み枠で表示することで、情報の優先度を明確に伝えることができる。

**画面へのアクセス方法**：本コンポーネントは直接アクセスするものではなく、Markdownメール内で`@component('mail::panel')`として使用される。または、Bladeコンポーネント構文で`<x-mail::panel>`として呼び出す。

**主要な操作・処理内容**：
1. テーブルレイアウトでパネル領域を構成
2. $slotの内容をMarkdown::parse()でパースしてHTMLに変換
3. 変換されたHTMLをパネルセル内に表示
4. CSSクラスによりパネル固有のスタイリングを適用

**画面遷移**：パネルコンポーネント自体には遷移機能はない。パネル内にリンクが含まれる場合、それらをクリックすると該当ページに遷移する。

**権限による表示制御**：パネルコンポーネント自体には権限制御はない。表示内容はスロットとして渡されるコンテンツによって決定される。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 28 | メール管理 | 主機能 | HTMLメールのパネルコンテンツ表示 |

## 画面種別

コンポーネント（メールテンプレート部品）

## URL/ルーティング

該当なし（Bladeコンポーネントとして使用）

コンポーネント名: `mail::panel`

## 入出力項目

| 項目名 | 型 | 必須 | 説明 |
|--------|------|------|------|
| $slot | string | Yes | パネルコンテンツ（Markdown形式対応） |

## 表示項目

| 要素 | 表示内容 | 備考 |
|------|---------|------|
| パネル本文 | $slotの内容（Markdownパース済み） | 背景色・境界線で強調表示 |

## イベント仕様

### 1-パネル内リンククリック

パネルコンテンツ内にリンクが含まれている場合、クリックすると該当URLに遷移する。

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

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

該当なし（表示専用コンポーネント）

## メッセージ仕様

該当なし

## 例外処理

| 状態 | 処理内容 |
|------|---------|
| $slot未指定 | 空のパネルとして出力 |
| Markdownパースエラー | そのままテキストとして出力（推測） |

## 備考

- 2段階のネストテーブル構造でパネルを構成
- Markdown::parse()を使用してスロット内容をパースするため、Markdown形式のコンテンツに対応
- CSSクラス`panel`、`panel-content`、`panel-item`はテーマファイルで定義
- 典型的な使用例：重要な通知、アカウント情報の概要、請求明細など

---

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

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

### 推奨読解順序

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

まず、コンポーネントで受け取るスロットとMarkdownパースの関係を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | Markdown.php | `src/Illuminate/Mail/Markdown.php` | parse()メソッドの実装（行142-172） |

**読解のコツ**: `Markdown::parse()`は静的メソッドとして呼び出され、CommonMarkライブラリを使用してMarkdownをHTMLに変換する。

#### Step 2: テンプレート構造を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | panel.blade.php | `src/Illuminate/Mail/resources/views/html/panel.blade.php` | テーブル構造（行1-14） |

**主要処理フロー**:
- **行1**: 外側テーブル（panelクラス、幅100%）
- **行2-3**: テーブル行とpanel-contentクラスのセル
- **行4-8**: 内側テーブルとpanel-itemクラスのセル
- **行7**: `{{ Illuminate\Mail\Markdown::parse($slot) }}`でMarkdownパース・出力

#### Step 3: テキストメール版との比較

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | text/panel.blade.php | `src/Illuminate/Mail/resources/views/text/panel.blade.php` | テキスト版の実装（行1） |

**読解のコツ**: テキスト版は`{{ $slot }}`のみの単純な出力。HTMLのパネル装飾はテキストメールでは不要なため。

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

```
Markdownメールテンプレート
    │
    └─ @component('mail::panel') または <x-mail::panel>
           │
           └─ panel.blade.php
                  │
                  ├─ 外側テーブル (class="panel")
                  │      │
                  │      └─ 内側テーブル
                  │             │
                  │             └─ <td class="panel-item">
                  │                    │
                  │                    └─ Markdown::parse($slot)
                  │
                  └─ HTML出力
```

### データフロー図

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

$slot ────────────▶ Markdown::parse() ──────▶ HTML変換結果
(Markdown形式)              │                      │
                            │                      ▼
                     CommonMarkConverter    <table class="panel">
                            │                  <td class="panel-item">
                            │                    変換されたHTML
                            │                  </td>
                            ▼                </table>
                      HtmlString
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| panel.blade.php | `src/Illuminate/Mail/resources/views/html/panel.blade.php` | テンプレート | パネル部品本体（HTML版） |
| text/panel.blade.php | `src/Illuminate/Mail/resources/views/text/panel.blade.php` | テンプレート | パネル部品本体（テキスト版） |
| Markdown.php | `src/Illuminate/Mail/Markdown.php` | ソース | Markdownパース処理 |
| Mailable.php | `src/Illuminate/Mail/Mailable.php` | ソース | メール送信の基底クラス |
