# Development Log — ComfyUI PSD Figure Creator

---

## v0.6.8 — 2026-06-24

### Changed
- **PスイッチタブのスロットボタンUI改善** — ボタンの並び順を変更し、ポーズ登録系ボタンを左に集約:
  - 順序: `+MLP`（黄）→ `+SLP`（水色）→ `−LP` → スペース → `+Slot` → `−Slot`
  - `+MLP` に黄色、`+SLP` に水色のテーマカラーを適用し、0° スロット操作時に使用するボタンが視覚的に区別しやすくなった

---

## v0.6.7 — 2026-06-24

### Added
- **アニメーションGIF出力** — キーフレームパネルのWebMボタン右隣に「🎞️ GIF」ボタンを追加。透過対応アニメーションGIFをエクスポート。`web/js/gif_encoder.js` を新規作成（NeuQuant カラー量子化 + GIF LZW エンコーダー + GIF89a フォーマット出力）
- **ヘルプにキーフレームアニメーションセクション追加** — 全3言語（日本語・英語・中国語）でキーフレームパネルの全ボタンの説明を追加

### Fixed
- **GIF カラー量子化スケールバグ** — NeuQuant 学習時にRGBピクセル値にネットワークスケール（`<< netbiasshift`）を適用していなかったため、パレットが黒に近い値に収束しシルエット状になる問題を修正
- **GIF 透過インデックスオーバーフロー** — `map()` が255を返したとき `+1=256` が `Uint8Array` で0（透過インデックス）に切り捨てられ、白やパレット末尾の色が透過になる問題を `Math.min(254, ...)` で修正
- **GIF アルファ処理改善** — 透過閾値を `alpha < 128` から `alpha < 32` に引き下げ、`32 ≦ alpha < 255` の半透明ピクセルにアルファ合成（プレマルチプライ）を適用してフチの欠落を低減
- **PSW追加/削除後のレイヤータブ表示更新漏れ** — `_createPswLayer()` / `_deletePswLayer()` に `_renderTree()` 呼び出しを追加し、LSWと同様にボタン操作直後にレイヤーリストが更新されるよう修正

### Changed
- **レイヤータブ ボタン名変更** — 「SW追加」「SW削除」→「LSW追加」「LSW削除」に変更（i18n.js 全3言語）
- **ヘルプのLSWボタン名修正** — ヘルプ内の「SW追加/削除」表記を「LSW追加/削除」に統一（全3言語）

---

## v0.6.6 — 2026-06-23

### Fixed
- **PSW ON/OFF 状態の保存・復元を全箇所に対応**:
  - **ポーズ保存（通常・SW付き）**: `pswEnabled` を保存データに追加。ロード時に `node._pswEnabled` を復元しボタン色を更新
  - **モデル保存**: `configObj.pswEnabled` を追加
  - **モデルロード**: `data.layer_config.pswEnabled` を `node._pswEnabled` に復元
  - **確定ボタン（onApplyConfig）**: 既存 `layer_config` の `pswEnabled` を新 `configObj` に引き継ぎ
  - **キーフレーム**: 各フレームに `pswEnabled` を保存・ステップ補間で復元（前バージョンより）
  - **プロジェクト（layer_config）**: トグル操作時に `layer_config` へ書き込み、`onConfigure` で復元（前バージョンより）

---

## v0.6.5 — 2026-06-23

### Added
- **PSW ON/OFF 状態をキーフレームに保存** — キーフレーム登録時に `pswEnabled` フラグを保存し、シーク・再生時に復元
  - PSW トグルの ON/OFF がキーフレームごとに切り替わるアニメーションが可能
  - `pswEnabled` はステップ補間（直前のキーフレームの値を次のキーフレームまで保持）
  - `node._updatePswToggle` を外部参照可能にし、シーク時にボタンの青/赤表示を即時更新

---

## v0.6.4 — 2026-06-23

### Added
- **PSW ON/OFF トグルボタン（ノード）** — ノードの Capture ボタン左に `PSW` トグルボタンを追加:
  - **青（ON）**: PSW プリセットポーズを有効化（デフォルト）
  - **赤（OFF）**: PSW を無効化。PSW 登録レイヤーも含めて全レイヤーを R/MR で自由操作可能
  - モーダルプレビューにも即時反映（`this.node._pswEnabled` 参照）
- **ヘルプ（3言語）更新** — PSwitch タブに「PSW トグル」の説明行を追加

---

## v0.6.3 — 2026-06-23

### Changed
- **PSWポーズ登録ワークフロー刷新**:
  - **+MLP / +SLP は 0° スロット専用** — 0° 以外のスロットでは何もしない。0° スロットで登録するレイヤー（群）を確定するための操作として明確化
  - **0° 以外のスロットは ✏編集 → ✓確定 フローで保存** — `✏編集` でスロットの登録済みポーズ（未登録時は 0° スロットのポーズ）を `state.pose` にロード、ポーズ調整後に `✓確定` で 0° スロットのレイヤー群に現在のポーズを書き戻す
- **+Slot / −Slot ボタン名** — PSW スロット追加/削除ボタンを `+` / `−` から `+Slot` / `−Slot` にリネーム
- **PSW 可動域ロック修正** — `(slots.length - 1) × PSW_STEP` を最大角度に変更。1スロット=0°固定、2スロット=0°〜30°、3スロット=0°〜60°
- **セットアップモードのガイドアーク修正** — アーク描画範囲を `PSW_STEP × n`（旧: スロット数+1分）から `PSW_STEP × (n-1)`（最終スロットまで）に修正
- **ヘルプダイアログ（3言語）更新** — PSW セクションを新ワークフローに合わせて全面改訂。+Slot / −Slot、+MLP/+SLP の 0° 専用化、✏編集→✓確定 の手順を明記

### Fixed
- **+SLP のレイヤー未選択エラーが 0° 以外のスロットで出続ける** — `_lastSlpLayerId` が null のとき 0° スロットに登録済みのレイヤーを自動フォールバックとして使用するよう修正
- **スロット行クリック時に編集モードが終了しない** — `slotRow.onclick` で `_pswEditingPointId = null` を設定し、他スロット選択時に自動的に編集モードを終了

---

## v0.6.2 — 2026-06-23

### Added
- **+MLP / +SLP ポーズ登録の分割** — Pスイッチタブのポーズ登録ボタンを2種類に分割:
  - **+MLP**（マルチレイヤーポーズ）— 従来の `+pset` と同じ動作。現在の全レイヤーポーズをスロットに一括登録
  - **+SLP**（シングルレイヤーポーズ）— レイヤーツリーで選択中の1レイヤーのポーズのみをスロットにマージ登録。既存の他レイヤーポーズは保持される
  - **−LP** — 従来の `-pset` をリネーム。スロットのポーズをクリア

- **+SLP レイヤー記憶** — `_lastSlpLayerId` で最後に使ったレイヤーIDを保持。0°スロットでレイヤーを選択して登録した後、30°・60°… のスロットではレイヤー再選択なしで同じレイヤーに +SLP 可能。レイヤーを選択し直すと上書き更新される

- **PSWハンドルの可動域ロック** — Pose モード・ノードキャンバス両方で、PSW ハンドルの回転を `[0°, 登録スロット数 × 30°]` の範囲にクランプ。3スロットなら0°〜90°、スロット追加で自動的に可動域が広がる。Setup モードでの初期配置ドラッグはクランプ対象外

### Changed
- **レイヤータブ: `[SW]` → `[LSW]`** — LSW レイヤーのプレフィックス表示を全3言語で変更 (`i18n.js`)
- **LSW / PSW 排他選択** — レイヤータブで LSW レイヤーを選択すると PSW の選択が解除され、PSW レイヤーを選択すると LSW・通常レイヤー選択が解除される
- **LSW / PSW カラーテーマ変更** — レイヤータブ・Lスイッチタブ・Pスイッチタブで色を統一:
  - LSW: `#a78bfa`（紫）→ `#55aaff`（青）、ボーダー `#7c3aed` → `#2266cc`
  - PSW: `#cc88ff`（薄紫）→ `#ff7766`（赤）、ボーダー `#9944cc` → `#cc3344`

### UX
- **PSWスロット表示の改善**:
  - 未登録: `未登録` → `−`
  - SLP登録（1レイヤー）: `✓ 登録済み (1レイヤー)` → `✓ : レイヤー名`（`state.renamed` 優先、なければ PSD 元名）
  - MLP登録（複数レイヤー）: `✓ 登録済み (Nレイヤー)` → `✓ (Nレイヤー)`

---

## v0.6.1 — 2026-06-22

### Added
- **PSWキーフレーム対応** — キーフレームシステムが PSW ハンドル角度（`psw_angles`）を記録・補間・復元するように対応:
  - `addKeyframeAtCurrentFrame`: `psw_layers` の各ポイント angle を `psw_angles` としてキーフレームに保存
  - `_kfGetInterpolatedState`: `psw_angles` をフレーム間で最短回転パス補間
  - `seekToFrame`: 補間済み `psw_angles` を `config.psw_layers` の各ポイントに反映

### Fixed
- **PSWレイヤー名変更ができない** — `_renderPswTab` でクリックハンドラが即座に `_renderPswTab()` を呼ぶためダブルクリックイベントが届かなかった。クリック処理を 260ms タイマー遅延に変更し、レイヤー名を `<span>` 要素として保持することでインライン編集を有効化
- **レイヤータブで PSW レイヤー名を変更できない** — `_mkPswLayerEl` に dblclick リネームを追加（SW レイヤーと同パターン）
- **ポーズ保存（右クリック）に PSW ハンドル角度が含まれない** — モーダルの `_savePoseWithSwFromModal` とノードのポーズスナップ右クリック両方で `psw_angles` を収集・保存するよう修正
- **ポーズロード時に PSW ハンドル角度が適用されない** — `_loadPose` の通常ポーズ復元ブロックに `psw_angles` → `psw_layers[].points[].angle` への反映処理を追加

### Changed
- **ヘルプダイアログ** — 3言語すべて更新:
  - レイヤータブ: PSW レイヤー名変更の説明を追加
  - Pose モード: 「ポーズ保存 右クリック」の説明を "SW 状態込み" → "LSW/PSW ハンドル状態込み" に修正

### Docs
- **README 3言語** — キーフレーム補間表に `PSW ハンドル角度` 行を追加、`layer_config` スキーマの `keyframes` エントリに `psw_angles` フィールドを追加
- **README 3言語** — トラブルシューティングセクションを新設: psd-tools が出力する `Unknown image resource` / `Unknown tagged block` の INFO メッセージは無害であることを説明

---

## v0.6.0 — 2026-06-22

### Overview
スイッチ（SW）機能をレイヤースイッチ（LSW）とポーズスイッチ（PSW）に分割。LSW は従来の「ハンドル角度でグループ表示を切り替える」機能をそのまま継承。新規追加の PSW はハンドル角度に応じて登録済みポーズ（R/MR の状態）を自動適用するスイッチで、30°刻みのスロットにポーズを登録し、最大12スロットまで対応。

### Added
- **PSW（ポーズスイッチ）ポイント** — 白いオリジン ＋ 紫のハンドル。ハンドルを回転させて登録済みポーズスロットを切り替える:
  - **配置**: Setupモードで PSW ボタン（初回押下時にPSWレイヤーを自動作成）→ キャンバスをクリック
  - **スロット管理**: `+` で30°刻みのスロットを追加（最大12スロット）、`−` で削除
  - **ポーズ登録**: Poseモードで姿勢を決めてスロットを選択 → `+pset` で現在のポーズを登録、`−pset` でクリア
  - **ポーズ適用**: ハンドル角度が 0°〜30°→スロット0、30°〜60°→スロット1… と切り替わる
  - 複数PSWポイントは独立して動作し、それぞれのポーズが合成される

- **`computePswEffectivePose(basePose, pswLayers, editingPswPointId)`** — PSWポイントの角度からアクティブスロットを特定し、ベースポーズに登録ポーズを合成して返す。モーダルプレビューとノードキャンバス両方で使用。`editingPswPointId` を指定するとそのポイントのオーバーライドを無効化（`+pset` で編集中にR/MRの変化をリアルタイム確認可能）

- **Pスイッチ（PSW）タブ** — セットアップモーダルに4番目のタブとして追加:
  - 上段: PSWレイヤー/ポイントリスト（選択・リネーム・削除ボタン付き）
  - 中段: スロットリスト（登録済み/未登録の状態表示、クリックでアクティブスロット変更・ハンドルが対応角度に移動）
  - 下段: `+` / `−` / `+pset` / `−pset` の4ボタン

- **PSWボタン** — Setup バーに「PSW」ボタンを追加（紫系テーマ）。押下時にPSWレイヤーが存在しなければ自動作成し即座にポイント配置可能

- **ノードキャンバス対応** — ノードキャンバスでもPSWポイントのヒットテスト・ハンドルドラッグ・ポーズ適用に対応

- **i18n** — PSW関連翻訳キーを ja / en / zh に追加: `tabPSwitch`, `addPswLayer`, `deletePswLayer`, `deletePswPointTooltip`, `addPswSlotTooltip`, `deletePswSlotTooltip`, `setPswPoseTooltip`, `clearPswPoseTooltip`, `maxPswSlotsReached`

### Changed
- **スイッチタブ名変更** — "スイッチ" → "Lスイッチ" (ja) / "LSwitch" (en) / "L切换" (zh)
- **SWボタン** — セットアップバーの "SW" ボタンを "LSW" にリネーム
- **ヘルプダイアログ** — 3言語すべて更新: スイッチ→Lスイッチ(LSW)にリネーム、Pスイッチ(PSW)セクション新規追加、Setup/Poseモードに LSW/PSW の説明を追加

### Fixed
- **PSWボタン押下後にポイントを配置できない** — ボタンはモードを `psw` に変更するだけで `_selectedPswLayerId` が未設定のままキャンバスクリックがパンになっていた。PSWボタン onclick に「レイヤーが無ければ自動作成、あれば先頭を選択」ロジックを追加

### Schema addition
```jsonc
// layer_config に追加されるPSWフィールド
{
  "psw_layers": [{
    "id":   "pswl_xxx",
    "name": "PSW1",
    "points": [{
      "id":     "pswp_xxx",
      "name":   "PSW1",
      "x":      512,
      "y":      512,
      "radius": 80,
      "angle":  0,
      "slots": [
        { "degree": 0,  "pose": null },
        { "degree": 30, "pose": { "<layerId>": { "angle": 0.5, "tx": 10, "ty": -5 } } }
      ]
    }]
  }]
}
```
`psw_layers` がない既存設定は従来通り動作（後方互換）。

---

## v0.5.2 — 2026-06-19

### Fixed
- **別PC移行時に Setup が開けない** (`openLayerModal`) — ワークフローを別PCに持ち込んだ場合など、`psd_filename` ウィジェットに値があるが PSD ファイルが `input/psd/` に存在しないとき、「レイヤー情報の取得に失敗しました」アラートを表示した後 `return` でモーダル表示をブロックしていた。`return` を削除し、PSD が見つからなくてもモーダルを空レイヤー状態で開くように修正。モーダルが開けば「Open PSD」ボタンから PSD を再選択・アップロードできる。

---

## v0.5.1 — 2026-06-18

### Added
- **キーフレーム移動トグル (`↔`)** — Row A に `↔` ボタン（`kfMoveKeyBtn`）を追加。ON 状態でタイムラインのドラッグがキーフレームを移動する（プレイヘッドは無効化）。OFF 状態は従来通りプレイヘッドをドラッグ。ON 時はボタンが紫系ハイライト（`background:#3a2a4a; border:#8a5a9a; outline:1px solid #aa77cc`）で状態を示し、ダイヤモンドマーカー 12px 以内でカーソルが `grab` になる。ポーズのみ・カメラのみ・両方を含むどの KF もまとめて移動する（`frame` フィールドを書き換えて `layer_config.keyframes` を即時更新）。移動先に既存 KF がある場合は上書き

- **新関数 `moveKeyframe(node, fromFrame, toFrame)`** — 指定フレームの KF エントリ全体を別フレームへ移動。移動先に既存 KF があれば先に削除してから追加しソート。`layer_config.keyframes` とタイムラインキャンバスを更新

### Changed
- **Row A / Row B レイアウト変更** — 再生・停止ボタンを Row A から Row B へ移動し、操作グループを整理:
  - Row A から `sep2`・`▶（再生）`・`■（停止）` を削除
  - Row A 最終形: `[+KF] [🗑KF] | [+CK] [-CK] | [↔] | [0] [◀] [f] / [t] [▶（次フレーム）]`
  - `[🎬 WebM]` を Row B の `[💾 Proj]` の直右隣に移動（`margin-left:auto` を除去）
  - Row B に `flex:1` スペーサー (`rowBSpacer`) を追加し、右端に `[▶（再生）] [■（停止）]` を配置
  - 再生ボタンに `min-width:54px`（通常の約 2 倍幅）を追加
  - Row B 最終形: `[New] FPS [24] [💾 Proj] [🎬 WebM]  ←flex:1→  [進捗] [▶▶▶] [■]`

- **i18n** — `kfMoveKeyBtn` / `kfMoveKeyTooltip` を ja / en / zh に追加

---

## v0.5.0 — 2026-06-18

### Overview
キーフレームアニメーションシステムと WebM 動画エクスポートを追加。⏱ ボタンでキーフレームパネルを展開し、ポーズ / カメラを独立してフレームに記録、タイムラインをクリック / ドラッグでスクラブ、補間再生プレビュー、WebM 形式での動画書き出しができる。カメラキーフレームはポーズとは独立した補間ロジックで処理される。キーフレームプロジェクトはライブラリのポーズ欄に保存・再読み込みでき、`layer_config.keyframes` に永続化されるため ComfyUI のワークフロー保存にも対応。

### Added
- **ポーズキーフレーム記録 (`+KF` / `🗑KF`)** — 現在フレームにポーズを記録・削除。位置 (tx/ty)・角度・可視性・SW 角度を保存。カメラは含まない（後述の `+CK` で個別に記録）

- **カメラキーフレーム記録 (`+CK` / `-CK`)** — 現在フレームにカメラ状態（zoom / x / y / roll）を個別に記録・削除。同フレームにポーズ KF があれば `camera` フィールドを追加 / 更新し、なければカメラのみのエントリを新規作成。`-CK` はカメラフィールドだけを削除しポーズデータは保持する

- **タイムライン UI (`⏱ トグル`)** — ノードの row3 に ⏱ ボタンを追加。展開時にキーフレームパネルを表示:
  - **Row A**: `[+KF] [🗑KF] | [+CK] [-CK] | [0] [◀] [フレーム番号] / [総フレーム数] [▶] | [▶ 再生] [■ 停止]`
  - **タイムラインキャンバス** (34 px) — フレームトラック + ◆ マーカー + 再生ヘッドを描画。クリック / ドラッグでスクラブ
  - **Row B**: `[New] FPS [入力] | [💾 Proj] | [進捗表示] | [🎬 WebM]`

- **タイムラインマーカーの色分け** — キーフレームの種別を ◆ の色で識別:
  - 黄（`#ffdd44`）— ポーズのみ
  - 紫（`#cc66ff`）— カメラのみ
  - 緑（`#44ee88`）— ポーズ＋カメラ両方
  - 現在フレームのマーカーは 1px 大きく同色グローを表示

- **`0` ボタン（フレーム 0 ジャンプ）** — Row A のナビゲーション左端に配置。`seekToFrame(node, 0)` を呼ぶ

- **`New` ボタン（全 KF クリア）** — Row B の FPS 左隣に配置。confirm ダイアログ後に `node._keyframes = []` / `layer_config.keyframes` 削除 / フレーム 0 にリセット。誤操作防止のため Row B（操作頻度の低い行）に配置

- **フレーム補間** — キーフレーム間を自動補間:
  - 位置 (tx/ty): 線形補間 (lerp)
  - 角度 / SW 角度 / カメラ roll: 最短回転パスで補間 (shortest-path angle lerp)
  - カメラ zoom / x / y: 線形補間
  - カメラ補間はポーズ KF の位置とは独立し、`camera` フィールドを持つ KF のみを対象に前後を探して補間する
  - 可視性: 直前のキーフレーム値を維持（ステップ）

- **再生プレビュー** — `▶` ボタンで RAF ベースの再生ループ。FPS フィールドで速度を調整（デフォルト 24 fps）。再生中は `■` で停止

- **WebM 動画エクスポート (`🎬 WebM`)** — `canvas.captureStream(0)` + `track.requestFrame()` + `MediaRecorder` でフレームを逐次レンダリングしてエンコード。Chrome / Edge 推奨（VP8 コーデック）。カメラキーフレームは `renderToOutputCanvas` が `node._camera` を参照するため自動的に WebM に反映される。進捗をテキストで表示

- **プロジェクト保存 / 読み込み (`💾 Proj`)** — キーフレームデータ（フレームリスト・総フレーム数・FPS）をライブラリのポーズ欄に保存。ファイル名デフォルトは `project-YYYYMMDDHHMMSS`（プロンプトで変更可）。ライブラリから読み込み時に `_type: "kf_project"` フィールドで自動判別し、フレーム 0 のポーズをキャンバスに適用してタイムラインを復元

- **キーフレームのワークフロー永続化** — キーフレームは `layer_config.keyframes` に保存。ComfyUI のワークフロー保存 / 読み込みで自動復元。`PSDModal._apply()` による設定上書き時もキーフレームが保持される (`onConfigure` フックで `_keyframes` を再展開)

- **新定数 `KF_PANEL_H = 98`** — キーフレームパネルの高さ定数を `computeSize` と `buildKeyframePanel` で共用

- **i18n キー追加** (`i18n.js`) — `kfPanelBtn`, `kfPanelTooltip`, `kfAddBtn`, `kfAddTooltip`, `kfDelBtn`, `kfDelTooltip`, `kfPlayBtn`, `kfStopBtn`, `kfExportBtn`, `kfExportTooltip`, `kfExporting`, `kfFpsLabel`, `kfNoKeyframes`, `kfSaveProjBtn`, `kfSaveProjTooltip`, `kfProjNamePrompt`, `kfGoToZeroBtn`, `kfGoToZeroTooltip`, `kfClearBtn`, `kfClearTooltip`, `kfAddCamBtn`, `kfAddCamTooltip`, `kfDelCamBtn`, `kfDelCamTooltip` を ja / en / zh に追加

### Fixed
- **KF パネル展開時のノード高さ崩れ** (`psd_loader.js`) — `nodeType.prototype.computeSize` がハードコードの `UI_WIDGET_H + 80` を返していたため、ComfyUI がレンダリングサイクルごとにノード高さを旧値に戻し、パネルが見えなくなっていた。`_kfPanelVisible` フラグを参照して `const kfExtra = (this._kfPanelVisible ? KF_PANEL_H : 0)` を加算するよう修正

- **カメラのみ KF でシーク / 再生がクラッシュしてループが止まる** (`seekToFrame`) — `_kfGetInterpolatedState` がカメラのみ KF をそのまま返すと `state.pose` / `state.sw_angles` / `state.visibility` が `undefined` になる。`JSON.parse(JSON.stringify(undefined))` が SyntaxError をスローし RAF ループが停止していた。各フィールドに `undefined` ガードを追加（`state.pose !== undefined` のときのみ適用、`state.sw_angles` / `state.visibility` は `&&` でガード）

- **`+KF` でポーズを上書きするとカメラ KF が消える** (`addKeyframeAtCurrentFrame`) — 同フレームの既存 KF を `.filter` で丸ごと削除してから新 KF を追加していたため、`camera` フィールドが失われていた。上書き前に `existingKf = node._keyframes.find(k => k.frame === frame)` を取得し、`existingKf?.camera` があれば新 KF に引き継ぐよう修正

- **`🗑KF` がカメラ KF も削除する** (`deleteKeyframeAtCurrentFrame`) — 丸ごと削除していたため同フレームのカメラデータも失われていた。ポーズ系フィールド（`pose` / `sw_angles` / `visibility`）のみ除去し `camera` は保持するよう修正。`camera` もなくなった場合のみエントリを削除する

### Schema addition
```jsonc
// layer_config に追加されるキーフレームフィールド
{
  "keyframes": [
    {
      "frame": 0,
      "visibility": { "<layerId>": true },
      "pose":       { "<layerId>": { "angle": 0, "tx": 0, "ty": 0 } },
      "sw_angles":  { "<pointId>": 0 },
      "camera":     { "zoom": 1.0, "x": 0, "y": 0, "roll": 0 }  // +CK で記録、省略可
    }
  ],
  "kf_total_frames": 60,
  "kf_fps": 24
}
```
`keyframes` がない既存の設定は従来通り動作（後方互換）。`camera` フィールドがない KF ではカメラは変化しない。

---

## v2.24.0 — 2026-06-10

### Overview
Post-release code review of the v2.21–v2.23 work (clipping-mask support, +L/+P/+C split)
surfaced nine findings; eight are fixed here. The ninth — in-place entry-type conversion
between layer and group entries, removed by the +L/+P/+C dropdown split — is accepted as a
design tradeoff. Highlights: clipping stacks now work at the document root and inside
custom groups (previously only inside PSD folders), layer masks are applied again in
canvas layer images, hidden clipping layers are respected by server-side compositing, and
the clipping-stack offscreen canvas is cached instead of re-allocated per frame.
Additionally, the output-size widgets now step in 1 px increments.

### Fixed
- **Root-level / custom-group clipping stacks** (`psd_loader.js`) — clipping stacks were
  only assembled by `renderChildren`, which is reached exclusively for PSD folder children.
  Root-level layers (both the `cg_order` path and the PSD-order fallback) and custom-group
  members were drawn one-by-one via `renderOneNode` / `renderCg`, so clipping layers
  outside folders rendered unclipped (fully visible). New helper
  `renderIdList(ids, skipCgMembers, skipCgMemberEntries)` groups consecutive plain nodes
  into runs and feeds them through `renderChildren`, so stacks form on every path:
  - `cg_order` path → `renderIdList([...cgOrder].reverse(), true, true)`
  - `renderCg` (custom-group members) → `renderIdList([...cg.layer_ids].reverse(), false, false)`
  - fallback path → `renderChildren(layers, false)` directly
  - `renderClippingStack` also gained the previously missing
    `skipCgMembers && cgMemberIds.has(base.id)` guard on the base layer, matching
    `renderOneNode` behavior.

- **Hidden clipping layers baked into server-side composite** (`psd_utils.py`) —
  `_manual_composite` / `_manual_composite_ordered` skipped clipping layers *before*
  consulting `effective_vis`, and the base layer's `composite()` bakes clip layers in
  regardless of config — so a clipping layer hidden in the UI still appeared in
  `/psd_loader/preview` output (JS preview hid it correctly). Base composition now passes
  a `layer_filter` built from `effective_vis` (`_composite_single(layer, vis_fn)`), so
  hidden clipping layers are excluded. psd-tools without `layer_filter` support falls back
  to the previous behavior via `TypeError` catch.

- **Layer masks lost in canvas layer images** (`psd_utils.py::get_layer_image_by_id`) —
  v2.21 switched to `topil()` to avoid clip-layer double-draw, but `topil()` returns raw
  pixels without layer masks, effects, or opacity. Now uses
  `composite(layer_filter=lambda l: l is current)`, which applies masks while still
  excluding clipping layers. For clipping layers themselves, a solo composite produces a
  fully transparent image (nothing to clip to) — fixed by temporarily clearing the
  `clipping` flag during composite (restored in `finally`; verified alpha-identical to
  `topil()` on the sample PSD).

### Performance
- **Offscreen canvas cached** (`psd_loader.js`) — `renderClippingStack` allocated a
  full-size `document.createElement('canvas')` per clipping stack per render pass;
  `_drawPreview` runs on every mousemove during pose dragging, so this caused GC churn and
  frame drops. The canvas is now cached in module-scope `_clipTmpCanvas`, resized only when
  dimensions change, and cleared with `clearRect` per use.

### Changed
- **`output_width` / `output_height` step 64 → 1** (`psd_loader_node.py`) — output size is
  now adjustable in 1 px increments (drag/arrow steps; was jumping by 64).
- **`countSwSlots` = `expandSwGroupEntries().length`** (`psd_loader.js`) — removed the
  duplicated composite/piece counting logic; slot expansion now has a single source of
  truth (verified equivalent across 7 entry-type cases).
- **`isOrphaned` simplified** (`_renderSwitchTab`) — the composite/piece ternary collapsed
  to `(isPsdGroup || isCustomGroup) && (leaves?.length ?? 0) === 0`, which is equivalent
  for both modes.
- **`server.py::_build_layer_tree` delegates to `psd_utils.get_layer_tree`** — removed the
  duplicated layer-dict construction (the two copies had to be edited in lockstep, e.g.
  the v2.21 `clipping` field). Output verified identical.
- **`_paste_layer` helper extracted** (`psd_utils.py`) — the identical composite→RGBA→
  bounds-check→paste block in `_manual_composite` and `_manual_composite_ordered` is now
  shared.
- **Error logging** — the bare `except Exception: pass` around the layer-image composite
  now logs `[psd_figure_creator] layer composite error (<name>): <e>` instead of silently
  swallowing corrupt-layer failures.
- **Dead i18n key removed** — `addGroupTooltip` (ja/en/zh) had no remaining references
  after the v2.20 +L/+P/+C button split.

### Verification
- Python (sample_1.psd): hiding clipping layer `6.1` (irides-r) now changes both manual
  composite paths (3,360 px diff, matching the layer bbox); all-visible output is
  byte-identical before/after; `get_layer_image_by_id` returns mask-applied, clip-free
  base images and non-empty clip-layer images.
- JS (stub-DOM harness, 9 tests): clipping stacks form on root fallback / `cg_order` /
  custom-group paths; `source-atop` draw order preserved; visibility overrides respected;
  canvas cache allocates once; `countSwSlots` equivalence; non-clipping layers still draw
  directly to the main canvas.

---

## v2.23.0 — 2026-06-07

### Overview
Bundled a sample character PSD with a pre-configured model and two pose files so users can
try the rigging system immediately after installation.

### Added
- **`user_data/sample_1.psd`** — sample character PSD (~2.3 MB).
- **`user_data/models/sample.psd-model.json`** — fully configured model for `sample_1.psd`:
  - R pivots on layers 2, 3, 4, 11
  - MR points on layers 0, 1, 5, 9, 10, and sub-layers 6.1 / 7.1
  - Parent hierarchy: layer 2 as root → 3 → 4 → children (eyes, mouth, accessories, etc.)
  - SW layer `SW1` with a composite-mode slot referencing group 7 and leaf layer 8
- **`user_data/poses/pose1.pose.json`** — sample pose 1 (head tilt + eye/mouth movement).
- **`user_data/poses/pose2.pose.json`** — sample pose 2 (alternate expression).

### Notes
- `user_data/models/` and `user_data/poses/` are loaded automatically by the library panel.
- `user_data/sample_1.psd` must be copied to `ComfyUI/input/psd/` manually before the model
  can be loaded (the model JSON references `psd_filename: "sample_1.psd"`).

---

## v2.22.0 — 2026-06-07

### Overview
Two maintenance fixes: a DOM crash in inline-rename handlers, and a help-dialog gap where
the Chinese Parent Tab section was missing entirely and all three languages lacked the
clipping-layer caveat for parent setup.

### Fixed
- **Inline rename `replaceWith` crash** (`psd_loader.js`) — Four inline-rename handlers
  (SW point name, custom-group name, SW layer name, `_inlineRename`) all shared the same
  pattern: `nameEl.replaceWith(input)` on double-click, then `input.replaceWith(nameEl)` in
  `commit()`. Pressing Enter called `commit()` which removed `input` from the DOM, then the
  resulting `blur` event fired `commit()` a second time, causing
  `NotFoundError: Failed to execute 'replaceWith' on 'Element'`. Fixed by adding
  `if (!input.isConnected) return;` at the top of every `commit` closure — idempotent once
  the input is detached.

### Changed
- **Help dialog — Parent Tab** (`_showHelp` in `psd_loader.js`):
  - Added `⚠ クリッピングレイヤー` row to the Japanese **ペアレントタブ** section.
  - Added `⚠ Clipping Layers` row to the English **Parent Tab** section.
  - Added the entire **父级选项卡** section to the Chinese help — it was previously absent.
    The new section includes setup instructions and the same clipping-layer caveat.
  - Caveat text (all languages): clipping layers (✂) only follow the base layer's transform
    if both layers share the same parent in the Parent tab; if only the base has a parent,
    the clipping layer stays at its original canvas position and the mask alignment breaks.

---

## v2.21.0 — 2026-06-07

### Overview
Full clipping-mask support across the canvas preview and Capture output. Clipping layers
(layers with the Photoshop "clip to layer below" flag) are now detected, propagated to the
frontend, and rendered using an offscreen-canvas `source-atop` compositing technique.
R/MR rigs placed on a clipping layer work correctly while the clipping shape is enforced by
the base layer's alpha. Additionally, double-rendering of clipping layers in the server-side
manual compositor is fixed.

### Added
- **`clipping` field on layer-tree nodes** — `server.py::_build_layer_tree` and
  `psd_utils.py::_build_layer_node` now emit `"clipping": true|false` for every layer node.
  This was the root cause of clipping not working: the frontend received nodes without the
  flag, so all layers appeared as non-clipping.

- **`renderChildren(children, skipCgMembers)`** — new function inside `renderLayersToCtx`
  that replaces direct `for...of n.children` iteration. It scans the child array and groups
  consecutive clipping layers with their base layer into a "clipping stack", delegating to
  `renderClippingStack` when clips are found.

- **`renderClippingStack(base, clipLayers, skipCgMembers)`** — offscreen-canvas compositor:
  1. Creates a temporary canvas the same size as the main canvas.
  2. Copies the current camera transform to the offscreen context via `ctx.getTransform()` /
     `tmpCtx.setTransform()`.
  3. Temporarily swaps the closed-over `ctx` variable to `tmpCtx`; all drawing functions
     (`drawLeaf`, `applyRigTransform`) automatically target the offscreen canvas.
  4. Draws the base layer, then draws each clipping layer with
     `globalCompositeOperation = 'source-atop'` (clips to base's opaque pixels).
  5. Resets the transform and composites the offscreen canvas onto the main canvas 1:1.
  - R/MR rigs on clipping layers are fully applied inside `drawLeaf` before the
    `source-atop` clip is enforced, so both transform and clipping work simultaneously.

- **`✂` badge in layer panel** — `_mkLayerEl` appends a small `✂` span when `node.clipping`
  is true, giving visual feedback in the Layers tab and the SW `+L` dropdown.

- **i18n key `clippingLayerBadge`** added to ja / en / zh for the badge tooltip.

### Fixed
- **`get_layer_image_by_id` (canvas layer fetch)** — switched from `layer.composite()` to
  `layer.topil()` for non-group layers. `composite()` embeds associated clipping layers into
  the base layer's image, causing the clipping layer to appear twice on the canvas and making
  R/MR rigs on those layers invisible. `topil()` returns raw pixel data only; clipping is
  handled entirely by `renderClippingStack` at draw time.

- **`_manual_composite` / `_manual_composite_ordered`** — clipping layers are now skipped
  (`if getattr(layer, "clipping", False): return`). The base layer's `layer.composite()`
  already includes its clipping layers, so iterating and drawing them separately caused
  double rendering in the server-side compositor (both routes: `layer_order` and fallback).

### Changed
- **`renderLayersToCtx` signature** — parameter renamed from `ctx` to `ctxArg`; internal
  `let ctx = ctxArg` allows the variable to be temporarily reassigned to the offscreen
  context inside `renderClippingStack` without touching any call sites.
- **`renderOneNode` group path** — the two inline `for (const child of n.children)` loops
  are replaced by `renderChildren(n.children, skipCgMembers)`.

---

## v2.20.0 — 2026-06-07

### Overview
The single `+` button in the Switch tab is replaced by three distinct add buttons —
`+L` (Layer), `+P` (Piece), `+C` (Composite) — each producing a different slot entry
type. A new `mode: 'composite'` field on group/folder entries makes the entire group count
as a single slot whose member layers are composited together, contrasting with
`mode: 'piece'` (the existing per-layer expansion behavior). Each entry row now shows a
color-coded type badge and the dropdown is filtered to show only relevant options for
that entry type.

### Added
- **`+L` / `+P` / `+C` buttons** — replace the single `+` button in the Switch tab bar:
  - **`+L` (Layer)** — adds an individual PSD layer as a string entry (1 slot); dropdown
    shows leaf layers only
  - **`+P` (Piece)** — adds a custom group or PSD folder group with `mode: 'piece'`
    (default expansion behavior: 1 slot per member/leaf layer); dropdown shows groups and
    folders only
  - **`+C` (Composite)** — adds a custom group or PSD folder group with
    `mode: 'composite'` (entire group = 1 slot; all member layers rendered together);
    dropdown shows groups and folders only
  - `makeAddSwBtn(text, tipKey, mode)` helper in `_buildDOM` creates all three buttons
  - i18n keys added: `addLayerEntryTooltip`, `addPieceEntryTooltip`,
    `addCompositeEntryTooltip`, `noAssignableGroup` (ja/en/zh)

- **`mode: 'composite'` entry field** — new optional field on `psd_group` / `custom_group`
  entries in `pt.groups`:
  - Backward-compatible: entries without `mode` (all v2.19 data) continue to behave as
    `'piece'`
  - `expandSwGroupEntries` — composite branch returns a single slot
    `{ id, entryIdx, mode:'composite', memberIds:[...] }` instead of per-leaf entries
  - `countSwSlots` — composite entries always contribute 1, regardless of member count
  - `renderLayersToCtx` SW loop — composite slot activates/deactivates all `memberIds`
    together via a loop over `slot.memberIds`; piece slot still controls a single `id`

- **Type badges in Switch tab entry rows** (`[L]` / `[P]` / `[C]`):
  - Rendered as a small colored `<span>` to the left of the step-angle label
  - L → blue (`#89b4fa` on `#2a2a4a`), P → cyan (`#89dceb` on `#152535`),
    C → orange (`#fab387` on `#3a2515`)

### Changed
- **`_addSwGroup(mode)`** — gained `mode` parameter (`'layer'` | `'piece'` | `'composite'`):
  - `'layer'`: pushes the first leaf layer ID (string) found in `layerTree`
  - `'piece'` / `'composite'`: pushes `{ type:'custom_group'|'psd_group', id, mode }`
    preferring the first custom group, falling back to the first PSD folder group
- **`_renderSwitchTab` entry loop**:
  - `slotCount` set to `1` for composite entries (was `leaves.length`)
  - Orphan detection for composite: checks `leaves.length === 0` (group/folder empty
    or deleted) rather than `slotCount === 0`
  - Angle range label: range notation (`0°–60°`) suppressed for composite (always
    single angle)
  - Dropdown options filtered by entry type: string entries show layers only; object
    entries show custom groups + PSD folder groups only
  - Change handler preserves `entry.mode` when updating the selected group/folder:
    `pt.groups[i] = { type, id, mode: entry?.mode ?? 'piece' }`

### Schema addition
```jsonc
// pt.groups entry (new mode field)
{ "type": "custom_group", "id": "...", "mode": "piece" }      // +P: per-layer slots
{ "type": "psd_group",    "id": "...", "mode": "composite" }  // +C: 1 composite slot
```
Entries without `mode` default to `'piece'` (backward compatible with v2.19 data).

---

## v2.19.0 — 2026-06-06

### Overview
Four improvements: (1) thumbnails for model/pose/pose+SW saves are now always captured with
rig labels and the output-size label hidden, then the UI state is restored; (2) the Switch tab
now accepts PSD folder groups as expandable per-layer slot entries; (3) custom groups in the
Switch tab also expand per-layer (matching PSD folder behavior); (4) modal pose-save thumbnails
no longer show a dark outer frame caused by camera zoom state.

### Fixed
- **Dark outer frame in modal pose-save thumbnails** — `_savePoseFromModal()` /
  `_savePoseWithSwFromModal()` computed `_computeModalOutputFrame()` under the current camera
  state; when the user had zoomed in, the output frame extended beyond the preview canvas
  bounds and `drawImage` captured dark canvas background around the content:
  - Before capture: `savedCam = { ...this._previewCam }`, then reset to
    `{ ...this._defaultPreviewCam }` so the output frame is always within canvas bounds
  - After capture: restore `this._previewCam = savedCam` and call `_drawPreview()` to return
    to the user's camera state
- **Rig labels and output-size label visible in saved thumbnails** — model, pose, and
  pose+SW saves captured thumbnails while `node._showRigLabels` and the `512 × 512` frame
  label were still active; replaced `createNodeCanvasNoLabel` (offscreen canvas — incorrectly
  produced small/dark results) with `captureThumbFromNode`:
  - Save `node._showRigLabels`; set to `false`
  - Call `drawNodeCanvas(node, { skipFrameLabel: true })` — suppresses both rig labels and
    the output-size text
  - Crop and export; restore `node._showRigLabels`; call `drawNodeCanvas(node)` to redraw
  - Modal saves (`_savePoseFromModal`, `_savePoseWithSwFromModal`) apply the same pattern
    using `this._showRigLabels` + `this._drawPreview()`

### Added
- **PSD folder groups as Switch entries** (`[フォルダ]` / `[Folder]` / `[文件夹]`):
  - `getPsdGroupLeaves(groupId, layerTree)` — recursively collects all non-group descendant
    IDs from a PSD folder node
  - `expandSwGroupEntries(groups, layerTree, customGroups)` — flattens `pt.groups` entries
    into a per-slot list; `string` → 1 slot, `{type:'psd_group'}` → N leaf slots,
    `{type:'custom_group'}` → N `layer_ids` slots
  - `countSwSlots(groups, layerTree, customGroups)` — sums total slot count across all
    entries (dissolved entries contribute 0)
  - Switch tab dropdown includes `[フォルダ] <name>` options for every PSD group node in the
    layer tree (recursive); stored as `{ type: 'psd_group', id }` in `pt.groups`
  - Angle display: 1 slot → `"30°"`, multiple slots → `"0°–60°"` range notation
  - Orphaned entry (PSD folder dissolved): red row background, ⚠ tooltip icon, angle shown
    as `"-"`; entry must be deleted manually
  - Max-slot guard (`> 12`) applies across all entry types combined
  - i18n keys added: `psdGroupPrefix` (ja/en/zh), `swGroupOrphaned` (ja/en/zh)

- **Custom groups as Switch entries** (`[グループ]` / `[Group]` / `[组]`) — expand per-layer:
  - Previously custom groups were stored as plain string IDs in `pt.groups` and treated as
    single slots with no actual rendering effect
  - Now stored as `{ type: 'custom_group', id }`; `expandSwGroupEntries` expands each
    custom group into per-`layer_ids` slots, identical to PSD folder expansion
  - Dropdown option values changed from `cg2.id` to `cg:<id>` to distinguish from layer IDs;
    change handler recognizes `cg:` prefix and writes `{ type: 'custom_group', id }` to
    `pt.groups[i]`
  - `_addSwGroup()` default new entry for custom groups is now `{ type:'custom_group', id }`
    instead of a bare string
  - Orphaned handling: if the custom group no longer exists in `this.state.customGroups`,
    `slotCount = 0` → shown as orphaned with ⚠ (same as PSD folder)
  - `renderLayersToCtx` and `drawRigOverlay` both pass `cgList` / `customGroups` to
    `expandSwGroupEntries` so SW visibility switching works for all entry types

### Changed
- **`drawNodeCanvas` signature** — added `{ skipFrameLabel = false, targetCanvas = null }`
  options object; output-size label block is wrapped in `if (!skipFrameLabel)` guard
- **`captureThumbFromNode(node, thumbW, thumbH)`** — replaces the removed
  `createNodeCanvasNoLabel`; uses the "temporarily disable → draw → capture → restore"
  pattern on `node._nodeCanvas`; used by all 5 thumbnail capture paths:
  model save (140×140), modal pose save fallback (140×auto), modal pose+SW save fallback,
  quick pose save (node contextmenu), quick pose+SW save (node contextmenu)

### Updated
- **Help dialog** (`_showHelp`) — all three languages (ja/en/zh) updated:
  - Switch tab section fully rewritten: entry types ([Group]/[Folder]/[Layer]), slot
    expansion behavior, angle range notation, 12-slot max, orphaned ⚠ warning
  - Pose mode: note added that thumbnails are captured with labels hidden automatically
  - Layer tab: custom group creation description mentions SW tab per-layer expansion
  - Camera (modal preview): RC reset button row added
  - Chinese (zh): Switch tab and Pose mode sections added (were previously absent)

---

## v2.18.0 — 2026-06-05

### Overview
Two improvements: (1) fixed a broken JS module import that prevented `psd_pose_editor.js` from
loading; (2) added a "?" help button to the PSD Model Editor footer that opens a scrollable
in-app help dialog in the user's language (ja/en/zh). Also added screenshots to all three
README files.

### Fixed
- **`psd_pose_editor.js` fails to load on ComfyUI startup** (`vite:preloadError`):
  - Line 1 used a relative import `../../scripts/app.js` which resolves to
    `/extensions/scripts/app.js` (non-existent) instead of `/scripts/app.js`
  - Changed to absolute path `/scripts/app.js`, matching `psd_loader.js` convention
  - The error appeared twice in the console because ComfyUI's Vite layer reported the
    same failed fetch from two code paths (`console-listener.js` direct + `App.vue:73`)

### Added
- **In-app help dialog** — "?" button added to the bottom-left of the PSD Model Editor footer:
  - Uses `margin-right: auto` on the button to left-align it while keeping all other footer
    buttons (`Cancel` / `Save` / `Pose` / `Apply`) right-aligned
  - `_showHelp()` method on `PSDModal`: builds a scrollable overlay dialog with sections
    covering Basic Operations, Layer Tab, Parent Tab, Switch Tab, Setup Mode, Pose Mode,
    and Camera controls (modal vs. node preview distinguished separately)
  - Content fully translated: Japanese / English / Simplified Chinese, selected via `getLang()`
  - Dialog closes on outside click or the "Close" button; rendered at `z-index: 10001`
    (above the main modal at 10000)
  - `getLang` added to the `i18n.js` import in `psd_loader.js`
- **Help dialog CSS** (`.psd-help-dialog`, `.psd-help-header`, `.psd-help-body`,
  `.psd-help-section`, `.psd-help-section-title`, `.psd-help-table`, `.psd-help-term`,
  `.psd-help-desc`) — dark-themed: blue section titles (`#89b4fa`), purple term
  cells (`#cba6f7`), muted description text (`#bac2de`)
- **i18n keys** `helpBtn`, `helpTitle`, `helpClose` added to ja / en / zh locales
- **README screenshots** — `## Screenshots` section inserted between Features and Installation
  in `README.md`, `README.ja.md`, `README.zh.md`; includes all 7 images from `docs/`
  (`1_node.png` – `7_capture.png`, excluding `thumb.png`) with language-appropriate captions

### Fixed (help content accuracy)
- Camera operation descriptions corrected after code review:
  - Roll is **not** available in the modal preview (`_previewCam` has no `roll` property;
    right-drag in the modal pans, not rolls)
  - Roll is **only** available on the node preview canvas: `Alt + right-drag`
    (`setupPreviewInteraction` → `e.altKey && e.button === 2`)
  - Camera reset button on the node is **RC** (not ↺ as initially written)
  - Help now shows two separate camera sections: "Modal Preview" (zoom + pan only) and
    "Node Preview" (zoom + pan + roll + RC reset)

---

## v2.17.0 — 2026-06-05

### Overview
Two maintenance updates: (1) plugin renamed to "PSD Figure Creator"; (2) i18n support added for
Japanese, English, and Simplified Chinese.

### Changed
- **プラグイン名変更** — "PSD Loader" → "PSD Figure Creator":
  - `psd_loader_node.py`: クラス名 `PSDLoaderNode` → `PSDFigureCreatorNode`、
    `NODE_CLASS_MAPPINGS` / `NODE_DISPLAY_NAME_MAPPINGS` のキー・値を更新
  - `web/js/psd_loader.js`: `NODE_TYPE = "PSDFigureCreator"`、
    extension 登録名 `"psd_loader.PSDFigureCreator"` に更新
  - `psd_utils.py`: ログラベル `[psd_loader]` → `[psd_figure_creator]`
  - **注意**: 既存ワークフローの JSON に `"PSDLoader"` が保存されている場合は
    `"PSDFigureCreator"` に書き換えが必要

---

## v2.16.0 — 2026-06-05

### Overview
Security hardening: path traversal prevention across all file-handling endpoints, and
i18n (internationalization) support for Japanese / English / Simplified Chinese.

### Security
- **パストラバーサル修正** (`server.py`):
  - `/psd_loader/upload`: `field.filename` を `Path(...).name` でサニタイズ後、
    `save_path.resolve().is_relative_to(psd_dir.resolve())` で境界チェックを追加
  - `/psd_loader/layers`, `/psd_loader/layer_image`, `/psd_loader/preview`:
    クエリパラメータ `filename` を `Path(...).name` でディレクトリ成分除去
  - `/psd_loader/preview`: `width` パラメータを `min(..., 4096)` で上限制限
  - エラーメッセージからファイルパスを除去（内部情報漏洩対策）
- **パストラバーサル修正** (`psd_loader_node.py`):
  - `psd_dir / psd_filename` → `psd_dir / Path(psd_filename).name`
- library 系エンドポイント（`/psd_loader/library/...`）は既存の `".."` チェックで対応済み

### Added
- **i18n 対応** — `web/js/i18n.js` を新規作成:
  - 対応言語: 日本語 (`ja`)・英語 (`en`)・簡体字中国語 (`zh`)
  - `navigator.language` で起動時に自動検出（`zh*` → zh、`ja` → ja、それ以外 → en）
  - `t(key, ...args)` 関数: `{0}` プレースホルダーで変数埋め込みに対応
  - `setLang(lang)` / `getLang()` でプログラムからの言語切り替えが可能
  - 翻訳キー数: 約 65 キー（ボタン・ツールチップ・アラート・confirm・prompt・キャンバステキスト）
- **`psd_loader.js` の全日本語文字列を `t()` に置換**:
  - `alert()` / `confirm()` / `prompt()` のメッセージ
  - `.textContent` / `.title` / `.placeholder` の UI テキスト
  - キャンバスオーバーレイテキスト（外部背景接続中メッセージ）
  - プレフィックス文字列（`[カスタム]` / `[SW]` / `[グループ]` / `[レイヤー]`）

---

## v2.15.0 — 2026-06-04

### Overview
Three UI improvements: (1) a New button in the setup modal file bar to start fresh without any
rigging; (2) tab hover/active style unified across all three tabs; (3) pose save button right-click
now saves switch state (SW angles) together with the pose instead of applying the last saved pose.

### Added
- **「✨ 新規」ボタン** — セットアップモーダルのファイルバーに追加（PSDボタン左横）:
  - クリックで確認ダイアログ → `layer_config` ウィジェットを `"{}"` にリセット
  - リギング・ポーズ・SWレイヤー・SWポイントをすべてクリア
  - `_rigMode` を `'normal'` に戻し、`_reloadFromNode()` でUI再描画
  - PSDボタンと同じ `flex:1` を付与し両ボタンが均等幅になることで PSD ボタン幅を実質半減
- **`_savePoseWithSwFromModal()`** — モーダルの「📷 ポーズ」ボタン右クリック用の新メソッド:
  - `sw_angles: {pointId: angle}` をポーズファイルに追加して保存
  - SWポイントの角度のみ記録（x/y/radius などセットアップ座標は含まない）

### Fixed
- **ペアレントタブの白線** — `mkTabBtn` のインライン CSS を `border-left/right/top:none` から
  `border:none` に変更。ホバー時に `.psd-btn:hover` の `border-color` が `#6c7086` に変化し
  bottom border が白線として見えていた問題を解消
- **タブホバー挙動の不統一** — 上記修正により 3 タブすべてで `background` 変化のみが起きるよう統一

### Changed
- **タブ選択の赤枠表示** — `updateTabStyle()` を更新し、アクティブタブに
  `outline: 2px solid #f38ba8` を追加（`outline-offset:-2px` でボタン内側に収める）。
  非アクティブタブは `outline: none`
- **ポーズ保存ボタン右クリックの動作変更** (ノード・モーダル共通):
  - 変更前: 直前に保存した `node._poseSnapshots[0]` を `layer_config` に適用
  - 変更後: 現在のスイッチ状態（SW角度）込みでポーズを名前付き保存
  - 保存成功時フラッシュ色: 左クリック = 緑 (`#44ff88`)、右クリック = オレンジ (`#ff8844`) で区別可能
  - モーダルの「📷 ポーズ」ボタンに `contextmenu` ハンドラを追加して同様の右クリック保存に対応
- **`_loadPose()` でスイッチ状態を復元** — ポーズファイルに `sw_angles` が含まれる場合、
  現在の `config.sw_layers` 内の各 SW ポイントの `angle` のみを上書き。
  x/y/radius などのセットアップ情報は一切変更しない
- **`poseSnapBtn.title`** — `"ポーズを保存（右クリックで適用）"` →
  `"ポーズを保存（右クリック: スイッチ状態込みで保存）"` に更新

### Schema addition
```jsonc
// pose ファイル（右クリック保存時のみ追加）
{
  "sw_angles": {
    "pointId": number   // SW ポイントの現在角度（radians）。pointId = swl.points[i].id
  }
}
```
`sw_angles` がないポーズファイルは従来通り `visibility` / `pose` のみ適用（後方互換）。

---

## v2.14.0 — 2026-06-04

### Overview
SWレイヤーUIのバグ修正と、レイヤー並べ替えが描画に反映されない根本的な問題を修正。

### Fixed
- **SWレイヤー行の▽トグル削除** — SWレイヤーは展開不要なためツリートグルを除去。行がフラット表示に統一
- **SWレイヤー行のクリック選択改善** — 以前は🔀アイコン部分しか選択できなかった問題を修正。
  行全体（名前テキスト含む）をクリックで選択可能に。名前はダブルクリックでリネーム（250ms タイマーで区別）
- **SW選択と通常レイヤー選択の排他制御** — SWレイヤーを選択した状態で通常レイヤーをクリックすると
  両方が選択状態になっていた問題を修正。`_mkLayerEl` / `_mkCustomGroupEl` のクリック時に
  `_selectedSwLayerId` をクリアするよう変更
- **SWグループにPSDレイヤーを直接割り当て可能** — スイッチパネルの＋ボタンを押したとき
  「カスタムグループがありません」エラーになっていた問題を修正。カスタムグループだけでなく
  個別PSDレイヤーもSWグループに割り当て可能とし、セレクトに `[グループ] / [レイヤー]` で表示
- **選択済みSWポイントのドラッグ操作改善** — スイッチパネルでSWポイントを選択しても
  キャンバス上での移動操作ができなかった問題を修正。`_selectedSwPointInfo` がある場合に
  sw_origin の 28px/zoom 以内のクリックでドラッグ開始するよう拡張
- **レイヤー並べ替えが描画に反映されない問題を修正** — `renderLayersToCtx` が常に
  PSD元順序（psd-tools 返却順）で描画していたため、UIでの並べ替えが表示に反映されなかった。
  `config.cg_order` を使って描画順を制御するよう根本修正:
  - `nodeMap` を構築し ID でノードを参照
  - `cgMemberIds` でカスタムグループ所属レイヤーを追跡（二重描画防止）
  - `cgOrder` がある場合は `[...cgOrder].reverse()` 順（下層→上層）で描画
  - カスタムグループ内も `layer_ids` の逆順で描画
  - `cgOrder` 未設定時は PSD 元順序にフォールバック

---

## v2.13.0 — 2026-06-04

### Overview
SWポイントの管理方式を全面刷新。従来は「カスタムグループごとにSWポイントを1つ配置する」仕組みだったが、**SWレイヤー**という専用コンテナを導入し、1つのSWレイヤーに複数のSWポイントを自由に配置できるようにした。SWポイントの座標もレイヤー相対からPSD絶対座標へ移行。

### Changed (Breaking)
- **データ構造変更** — `config.sw` (`{layerId: {...}}`) を廃止し `config.sw_layers`
  (`[{id, name, points:[{id, name, x, y, radius, angle, groups:[cgId]}]}]`) に変更
  - SWポイントはPSD絶対座標（旧: 配置レイヤーからの相対座標）
  - `LayerState.sw` → `LayerState.swLayers`
  - `toConfig()` が `sw_layers` を出力、`fromConfig()` が読み込む
  - 旧形式 `config.sw` は `fromConfig` 時に自動変換（後方互換）

### Added
- **SWレイヤー作成・削除ボタン** — レイヤータブ下部のボタンバー（グループ解除ボタン右隣）に
  「SW追加」「SW削除」ボタンを追加
- **SWレイヤーのレイヤーリスト表示** — レイヤーリスト先頭に紫ボーダー付きの
  `[SW] <名前>` 行として表示。クリックで選択（ダブルクリックでリネーム）
- **複数SWポイントの配置** — SWレイヤーを選択 → SWボタン → キャンバスクリックでSWポイントを配置。
  配置のたびにSWボタンが自動解除され、再度押すことで次のポイントを追加できる
- **SWポイント選択のスイッチパネル対応** — スイッチパネルに「SWレイヤーヘッダー + 配下のSWポイント一覧」を表示。
  クリックでSWポイントを選択（ダブルクリックでリネーム）、選択中ポイントのgroupsリストを展開表示
- `_mkSwLayerEl()` — SWレイヤー行DOM生成メソッド
- `_createSwLayer()` / `_deleteSwLayer()` — SWレイヤーの追加・削除

### Changed
- **`drawRigOverlay()`** — シグネチャ `swData={}` → `swLayers=[], selectedSwPointInfo=null`。
  SWポイント描画ループを `swLayers[].points[]` に変更。選択判定を `selectedSwPointInfo` で行う
- **`hitTestRig()`** — シグネチャ `swData={}` → `swLayers=[]`。
  戻り値のSWポイントヒットが `{layerId, type}` → `{swLayerId, swPointId, type}` に変更
- **`renderLayersToCtx()`** — SWによるカスタムグループ表示切り替えを `config.sw_layers` に対応
- **`_setupRigInteraction()`** — setupモードでのSW配置フローを変更：
  SWレイヤー選択 + SWボタン + キャンバスクリック → `_placeSwPoint(wx, wy)` 呼び出し
- **`_placeSwPoint()`** — シグネチャ `(layerId, wx, wy, entry)` → `(wx, wy)`。
  `_selectedSwLayerId` のSWレイヤーへ絶対座標でポイントを追加後、SWボタンを解除
- **`_renderSwitchTab()`** — swLayers構造でSWレイヤー/SWポイントを階層表示
- **`_addSwGroup()` / `_removeSwGroup()`** — `_selectedSwPointInfo` を使ってgroupsを操作
- **ノードキャンバス (`drawNodeCanvas`)** — `config.sw` → `config.sw_layers` に対応。
  SWハンドルドラッグ時のpivot計算をlayerEntry依存から絶対座標に変更

---

## v2.12.0 — 2026-06-04

### Overview
Three additions: (1) background color picker and local image file input on the node canvas;
(2) optional `background_image` IMAGE input port for compositing an upstream node's image
as the background layer; (3) fix to SW point name inline-rename (double-click was broken
by the row click handler re-building the DOM before the second click registered).

### Fixed
- **SW point name rename broken** — `row.addEventListener("click")` called
  `_renderSwitchTab()` on every click, rebuilding the DOM before the `dblclick` event on
  `nameEl` could fire; fixed with a 250 ms timer pattern (same as the layer tree rename):
  - `nameEl` click: start a 250 ms timer → on expiry, toggle selection and re-render
  - `nameEl` dblclick: cancel the timer, keep `_selectedSwLayerId` set, open inline input
  - `row` click handler skips when `e.target === nameEl` (nameEl owns its own selection logic)

### Added
- **Background color picker** — `BG` label + `<input type="color">` + `✕` clear button
  added below the Point Size slider in the node canvas widget; selecting a color sets
  `node._bgColorEnabled = true` and `node._bgColor`; clears local background image if set;
  `✕` sets `_bgColorEnabled = false`; canvas redraws immediately
- **Background image (local file)** — `🖼 画像` button + hidden `<input type="file"
  accept="image/*">` + `✕` clear button; file is read with `FileReader.readAsDataURL()` and
  stored as an `Image` object in `node._bgImage`; button label updates to the filename (up
  to 12 chars); selecting a file clears `_bgColorEnabled`; `✕` sets `_bgImage = null`
- **Background image (ComfyUI node input)** — optional `("IMAGE",)` input port
  `background_image` added to `PSDLoaderNode.INPUT_TYPES`; when connected, the upstream
  image is composited as the bottommost layer (letterbox resize, aspect-ratio preserved) via
  the new `_composite_on_bg()` helper; applied in both the `image_data` (Capture) path and
  the server-side compositing path
- **External background indicator** — when `background_image` input has an active link,
  `onConnectionsChange` hook shows `🔗 外部接続中` label in the BG control row; canvas
  displays a dark-green tinted placeholder with text
  `"🔗 外部背景画像接続中 / Queue Prompt で反映されます"` instead of the checker pattern

### Changed
- **`drawNodeCanvas()` background priority** — checker pattern is now the last fallback;
  priority: local image (`_bgImage`) → local color (`_bgColorEnabled`) →
  external connection indicator → checker
- **`captureNode()` background** — same priority order applied to the temp canvas before
  camera-transformed PSD layers are drawn; local background is baked into the captured PNG
- **`psd_loader_node.py` — `_composite_on_bg()` helper** — module-level helper function
  encapsulates background compositing (tensor → PIL → letterbox resize → alpha_composite);
  called in both the `image_data` branch and the server-side branch; `background_image` is
  now applied even when `image_data` (Capture) is present, so the composited result always
  includes the upstream background
- **`IS_CHANGED`** — includes `str(background_image.shape)` in the hash key so the node
  re-executes when the upstream image dimensions or content changes
- **`PREVIEW_WIDGET_H`** — `PREVIEW_IMG_H + 62` (484 px) → `PREVIEW_IMG_H + 88` (510 px)
  to accommodate the new BG control row (+26 px); `UI_WIDGET_H` 544 → 570 px

---

## v2.11.0 — 2026-06-04

### Overview
Two improvements: (1) bug fix — rig points were invisible after loading a model from the
Library or from the Setup modal's `📂 model` button; (2) new SW (Switch) point type that
toggles the visibility of registered custom groups by rotating a handle, allowing multi-state
layer switching (e.g. facial expression sets) without manual eye-toggle clicks.

### Fixed
- **Rig points not shown after Library model load** — `_loadModel()` set
  `node._layerImages = null` then called `refreshNodePreview()`, which fell into the
  `_compositeImg` branch of `drawNodeCanvas()` (no `_layerImages` → no rig overlay);
  fixed by awaiting `loadLayerImages()` directly inside `_loadModel()` and calling
  `drawNodeCanvas()` after `_layerImages` is populated
- **Rig points not shown after Setup modal model load** — `_reloadFromNode()` called
  `_initPreview()` → `_drawPreview()` while `_rigMode` was still `'normal'` (rig overlay
  guard: `if (this._rigMode !== 'normal')`), so points were invisible until the user
  manually clicked Pose/Setup; fixed by checking `config.rigging` keys after state rebuild:
  if rigging exists and `_rigMode === 'normal'`, automatically switch to `'pose'` mode and
  call `_updateRigModeUI()` before the preview draw

### Added
- **SW (Switch) point type** — new rig point that controls group visibility via angle:
  - **Visual**: green origin dot connected to a cyan handle by a green line; handle displays
    the active group index; selection ring (yellow) on origin in setup mode
  - **Setup arc overlay** — when the layer is selected in setup mode, a dashed green arc
    shows the full angular range (`30° × n` groups), with tick marks at each 30° step
  - **Placement**: select the SW button in the setup bar, pick a layer, click canvas to
    place the origin; drag the cyan handle to set radius and initial angle
  - **Pose mode**: dragging the cyan handle changes `swInfo.angle`; no radius change in
    pose mode (radius is setup-only)
  - **Group switching logic** (`renderLayersToCtx`): for each SW point, computes
    `activeIdx = floor(normalizedAngle / 30°)` where `normalizedAngle = angle mod (30°×n)`;
    the active group is unhidden (even if `visible:false`), all other registered groups are
    hidden; SW override takes priority over `cg.visible` but not over unregistered groups
  - **Maximum 12 groups** per SW point (12 × 30° = 360°)

- **SW button in Setup bar** — green-tinted `SW` button added to the right of `MR`;
  sets `_setupPointType = 'sw'`; highlighted with a green outline when active

- **Switch tab** — third tab added to the right panel (レイヤー | ペアレント | **スイッチ**):
  - Lists all SW points by name; click to select; double-click to rename inline; ✕ to delete
  - Selected SW expands to show its registered groups as rows with `angle°` label and a
    dropdown selector (shows all custom groups)
  - `+` button appends a new group slot (dropdown defaults to first CG); `−` removes the
    selected slot; limit 12 slots per SW

- **`_nextSwName()`** — generates unique auto-incremented names (`sw1`, `sw2`, …)
- **`_placeSwPoint()`** — places or moves the SW origin for the selected layer
- **`_renderSwitchTab()`** — renders the switch tab list and group slot rows
- **`_addSwGroup()` / `_removeSwGroup()`** — add or remove a group slot from the selected SW

### Changed
- **`LayerState`** — added `sw = {}` property; included in `toConfig()` as `sw:` key and
  restored in `fromConfig()` from `config.sw`
- **`drawRigOverlay()`** — added `swData = {}` as the last parameter; draws SW points after
  all R/MR points; call sites in `drawNodeCanvas()` and `PSDModal._drawPreview()` updated to
  pass `config.sw || {}`; early-return guard expanded to also allow `swData` entries
- **`hitTestRig()`** — added `swData = {}` as the last parameter; tests cyan handle
  (`sw_handle`) in both modes, and origin (`sw_origin`) in setup mode only; returns
  `{ layerId, type: 'sw_handle' | 'sw_origin' }`; all call sites updated
- **`_setupRigInteraction()` (modal)**:
  - Setup mousedown: SW button active → `_placeSwPoint()` on canvas miss; hit on
    `sw_handle` or `sw_origin` → `setup_drag`; mousemove handles `sw_handle` (radius +
    angle) and `sw_origin` (translate origin)
  - Pose mousedown: `sw_handle` hit → `sw_pose_drag` drag info with pivot at SW origin
  - Pose mousemove: `sw_pose_drag` → `swInfo.angle = atan2(wy−pivotY, wx−pivotX)`
- **`setupPreviewInteraction()` (node canvas)**:
  - Mousedown: `sw_handle` hit → `isRigDrag = true`, `rigDragInfo` with SW pivot stored
  - Mousemove: `hit.type === 'sw_handle'` branch updates `swInfo.angle` then writes
    updated config to the widget and redraws; `config.rigging` access guarded with `|| {}`
  - Hit-test guard changed from `if (config.rigging)` to `if (config.rigging || config.sw)`

### Schema addition
```jsonc
{
  "sw": {
    "layerId": {
      "name":   "sw1",          // display name (auto-incremented)
      "x":      100,            // origin X in layer-local coords
      "y":      200,            // origin Y in layer-local coords
      "radius": 80,             // distance to cyan handle (setup-editable)
      "angle":  0,              // current angle in radians (pose-editable)
      "groups": ["cg_a", "cg_b"]  // registered CG IDs; index 0 = 0°, 1 = 30°, …
    }
  }
}
```
Field is optional; configs without `sw` behave identically to prior versions.

---

## v2.10.0 — 2026-06-03

### Overview
Pose thumbnail display and save accuracy improvements. The Library pose grid now renders
thumbnails at the correct aspect ratio and responds correctly to S/M/L size switching.
Setup modal pose save now captures from the modal's own live preview instead of the
(potentially stale) node canvas. A green dashed frame overlay is always visible in the
Setup modal preview to mark the output crop region.

### Fixed
- **Pose thumbnail grid layout** — added `align-items:center` to each pose card
  (`flex-direction:column`); without it, `thumbBox` stretched to fill the grid-cell width
  while height stayed at `px`, causing a non-square distorted frame. S/M/L switching now
  correctly resizes both the grid columns and each card's thumb container
- **Pose thumbnail aspect ratio on save** — changed fixed 70×44 canvas to
  `140 × round(140 * fh/fw)` so the saved thumbnail matches the `output_width / output_height`
  aspect ratio rather than a hard-coded 16:10 approximation (applies to both node pose-save
  button and Setup modal pose-save button)

### Added
- **Output-frame overlay in Setup modal preview** — a semi-transparent green dashed border
  (`rgba(0,220,80,0.65)`) drawn after `ctx.restore()` in `_drawPreview()` marks the output
  crop region at all times, consistent with the node canvas overlay
- **`_computeModalOutputFrame()` method** — calculates the output-frame rectangle in screen
  coordinates of `this._previewCanvas`, taking the current camera zoom/pan into account;
  shared by `_drawPreview()` overlay and `_savePoseFromModal()` capture

### Changed
- **Setup modal pose save captures from `this._previewCanvas`** — `_savePoseFromModal()`
  now uses `_computeModalOutputFrame()` to crop from the live modal preview instead of
  `node._nodeCanvas` (which reflects the last Queue Prompt output, not the current pose
  state); falls back to `node._nodeCanvas` when PSD metadata is not yet loaded

---

## v2.9.0 — 2026-06-03

### Overview
Library modal improvements: pose thumbnail aspect-ratio fix, S/M/L thumbnail size toggle,
selected-model thumbnail preview in the left panel, and model save now includes a 140×140
thumbnail. Setup modal title renamed. PSD/model file loading now refreshes the modal's
layer tree and state in-place. Setup can open without a PSD loaded.

### Fixed
- **Pose thumbnail aspect ratio** — replaced the fixed 70×44 `<canvas>` with an `<img>`
  element sized `max-width:${px}px; max-height:${px}px; width:auto; height:auto;` inside a
  square container, so the original output-frame aspect ratio is preserved at all thumbnail
  sizes
- **Setup modal opens without PSD** — removed the `alert("先にPSDファイルを選択してください")`
  guard in `openLayerModal()`; the call site now passes `layers || []` to `PSDModal` so an
  empty tree is valid

### Added
- **Pose thumbnail S/M/L toggle** — three-button group added to the right-panel toolbar
  (`S` = 76 px, `M` = 110 px, `L` = 160 px); selected size highlights; `_thumbPx()` helper
  drives both the card container size and `grid-template-columns` via `_updateGridCss()`
- **Selected-model thumbnail panel** — 106 px area at the bottom of the left panel;
  single-click on a model list item selects it (highlights row, shows thumbnail);
  double-click loads the model onto the node and closes the modal
- **Model save includes thumbnail** — `_saveConfig()` renders a 140×140 frame from the
  output region of the node canvas and stores it as `content.thumbnail` alongside
  `psd_filename` and `layer_config`
- **`library_list_models` returns thumbnail** — server response now includes
  `"thumbnail": data.get("thumbnail")` so the library can display model thumbnails without
  a separate fetch
- **Setup modal file bar** — `📂 psd` / `📂 model` / `⟳` bar always visible above the
  setup/pose sub-bars; opening a PSD or model file calls `_reloadFromNode()` to rebuild
  `layerTree`, `state`, and re-render the tree and preview in place without reopening the
  modal
- **`_reloadFromNode()` method** — rebuilds `this.layerTree`, `this.state`, clears
  selection state, then calls `_renderTree()` and `_initPreview()`

### Changed
- **Setup modal title** — `"PSD レイヤー設定"` → `"PSD モデルエディタ"`
- **Model list interaction** — single-click selects (shows thumbnail); double-click loads;
  right-click deletes with confirmation (previously single-click loaded immediately)

---

## v2.8.0 — 2026-06-03

### Overview
Library modal implementation and UI restructuring. Model/pose save now writes to
`user_data/models/` and `user_data/poses/` on the server instead of triggering browser
downloads. PSD file buttons moved from node row 1 into the Setup modal header area.
Node shrinks from 3 rows to 2 rows. Library modal supports browsing, loading, and deleting
saved models and poses.

### Added
- **Library API — server (`server.py`)** — six new aiohttp routes under `/psd_loader/library/`:
  - `GET /models` — list all `.psd-model.json` files in `user_data/models/`
  - `GET /models/{name}` — fetch a single model file
  - `POST /models` — save model content to `user_data/models/<name>.psd-model.json`
  - `DELETE /models/{name}` — delete a model file
  - `GET /poses`, `GET /poses/{name}`, `POST /poses`, `DELETE /poses/{name}` — same CRUD
    for `.pose.json` files in `user_data/poses/`
  - All routes validate filenames against path-traversal characters (`..`, `/`, `\`)
- **Library modal (`LibraryModal` class)** — opens via the lib button (row 1 of node):
  - Left panel: model search input + model list; click to load model onto node, right-click
    to delete with confirmation
  - Right panel: pose search input + thumbnail grid; click to apply pose to node, right-click
    to delete; thumbnails use `<img>` tags so original aspect ratio is preserved
  - Header `×` button and overlay click both close the modal
- **Setup modal — file bar** — always-visible bar inserted between the modal header and the
  setup/pose sub-bars:
  - `📂 psd` — opens file picker to upload/select a PSD (button label updates to filename)
  - `📂 model` — opens file picker to load a `.psd-model.json` file directly
  - `⟳` — refreshes preview
- **Setup modal — Pose button** — `📷 ポーズ` button added to the footer (between `💾 保存`
  and `適用`); prompts for a name and saves current `visibility` + `pose` + 70×44 thumbnail
  to `user_data/poses/` via `_savePoseFromModal()`

### Changed
- **Model save** (`_saveConfig()`) — no longer triggers a browser download; now prompts for
  a name and POSTs `{ psd_filename, layer_config }` to `/psd_loader/library/models`
- **Pose snapshot button** — left-click now prompts for a name and POSTs to
  `/psd_loader/library/poses`; thumbnail on the button icon does not update after save
  (initial human-silhouette icon is preserved); right-click still applies the last-saved
  pose from `node._poseSnapshots[0]`
- **Pose snapshot icon** — initial canvas draws a human-silhouette icon on a dark background
  instead of the previous `+` text
- **Library button icon** — canvas replaced with a 3×2 coloured-block grid on a dark background
- **Node row layout — 3 rows → 2 rows**:
  - Row 1 (psd / psd model / ⟳) removed; those buttons now live in the Setup modal file bar
  - Remaining rows: `[lib] [pose] [Setup] [🏷] [RP] [RC]` and `[📸 Capture]`
  - `UI_WIDGET_H` updated to `BTN_ROW_H × 2 + PREVIEW_WIDGET_H` = 544 px
- **Setup modal opens without PSD** — removed the `alert("先にPSDファイルを選択してください")`
  guard so the modal can open with an empty layer tree; PSD can then be loaded via the
  in-modal file bar

---

## v2.7.0 — 2026-06-03

### Overview
Four improvements: (1) camera roll now correctly applies to captured output; (2) rig point
size and label size are now adjustable with a slider on both the node canvas and the Editor
modal; (3) model files (`.psd-model.json`) can be saved from the Editor and loaded back onto
the node; (4) the node button layout is redesigned, and the pose snapshot button gains full
save / apply functionality.

### Fixed
- **Camera roll not reflected in capture output** — `captureNode()` applied
  `translate → scale → translate` but omitted `rotate(cam.roll)`, so captured images
  were always axis-aligned regardless of viewport roll; added `tmpCtx.rotate(cam.roll || 0)`
  between the two translate calls, matching the transform sequence in `drawNodeCanvas()`

### Added
- **Point Size slider — node canvas** — `buildPreviewWidget()` appends a slider row
  (`range 0.5–3.0, step 0.1, default 1.0`) below the status label; value stored as
  `node._rigPointSize`; triggers `drawNodeCanvas()` on `input`
- **Point Size slider — Editor modal** — `previewPanel` receives the same slider between
  `_previewStatusEl` and the RP button; value stored as `this._rigPointSize`; triggers
  `_drawPreview()` on `input`
- **`drawRigOverlay` point size scaling** — signature gains `pointSize = 1.0` (last
  parameter); three internal size variables computed at entry:
  - `PR = round(7 × pointSize)` — rig point dot radius
  - `SR = round(12 × pointSize)` — setup-mode selection ring radius
  - `PSR = round(11 × pointSize)` — pose-mode selection ring radius
  - All `_drawRigPoint`, `ctx.arc`, and flip-indicator font sizes use these variables;
    radius label font scales as `max(8, round(10 × pointSize))px`
- **`_drawRigLabel` label size scaling** — gains `pointSize = 1.0` parameter; font size
  `max(8, round(11 × pointSize))px`; background rect and vertical offset scale proportionally
- **`hitTestRig` point size scaling** — gains `pointSize = 1.0` parameter; hit radius
  scales as `14 / zoom × pointSize` so click targets match visual point size
- **All `drawRigOverlay` / `hitTestRig` call sites** updated to pass the relevant
  `node._rigPointSize` or `this._rigPointSize` value
- **Model file save — Editor modal** — `💾 保存` button added to the modal footer (between
  キャンセル and 適用); `_saveConfig()` method serializes
  `{ psd_filename, layer_config }` (including `layer_order`) to a
  `<basename>.psd-model.json` file and triggers a browser download
- **Model file load — node** — `📂 psd model` button added to row 1 (between psd and ⟳);
  opens a JSON file picker; on load, writes `layer_config` to the widget, updates
  `psd_filename`, fetches layer tree from server, resets camera, and refreshes preview
- **Pose snapshot button — full implementation** — replaces the placeholder gradient;
  initial state shows a `+` icon on a dark canvas:
  - **Left-click → save**: captures `visibility` and `pose` from `layer_config`; renders
    a 36 × 22 px thumbnail from the output frame region of the node canvas; stores as
    `node._poseSnapshots[0]`; updates the button canvas; flashes green outline (600 ms)
  - **Right-click → apply**: writes the saved `visibility` and `pose` back to
    `layer_config` and calls `drawNodeCanvas()`
  - Thumbnail image loaded via `Image` object into the button canvas to handle async
    PNG decode correctly (`_refreshPoseSnapThumb` helper)

### Changed
- **Node button layout redesigned**:
  - **Row 1**: `[📂 psd (flex:1)] [📂 psd model (flex:1)] [⟳ (28px)]`
  - **Row 2**: `[lib PH (40px)] [pose snap (40px)] [Setup (flex:1)] [🏷] [RP] [RC]`
  - **Row 3**: `[📸 Capture]`
  - `Editor` button renamed to `Setup`
  - Library button remains a gradient-thumbnail placeholder (disabled) for the upcoming
    library modal
- **`PREVIEW_WIDGET_H`** recalculated from actual DOM measurements:
  `PREVIEW_IMG_H + 62` = 484 px (wrap padding 10 + border 2 + status 18 + slider 26 +
  margin buffer 6); `UI_WIDGET_H` updated to 574 px

---

## v2.6.1 — 2026-06-02

### Fixed
- **Parent tab: CG structure must not affect parent-child (rig) relationships** — the layer
  tab shows display order / custom group structure; the parent tab shows only user-set
  `layerParent` relationships between PSD layers; these two must be completely independent:
  - Moving a layer into a CG auto-sets `layerParent[lid] = cgId` for rig transform
    propagation, which was causing layers to disappear from the parent tab (they had a
    parent, but the CG parent was not displayed) and corrupting existing rig hierarchies
  - **`_ptAllOrderedIds()`** — rewritten to walk the PSD layer tree directly, completely
    ignoring `cgOrder` and CG `layer_ids`; the parent tab display order is now based solely
    on the original PSD structure, not on layer tab grouping
  - **`_ptDeriveRoots()`** — filter changed to `!lp[id] || cgIds.has(lp[id])`: layers
    whose `layerParent` points to a CG are treated as roots (the CG-assigned parent is
    invisible to the parent tab)
  - **`_ptDeriveChildren(parentId)`** — returns `[]` immediately when `parentId` is a CG
    ID, so CG nodes can never function as rig parents in the parent tab hierarchy

---

## v2.6.0 — 2026-06-02

### Overview
Three UX improvements to the rig / Editor workflow: (1) layer flip via Alt / Ctrl click on rig
points; (2) right-drag panning in Editor setup mode; (3) collapsible hierarchy in the parent tab.

### Added
- **Layer flip in Pose mode** — Alt + click or Ctrl + click on any R or MR rig point
  (blue or red) toggles a per-layer flip transform:
  - **Alt + click** → toggle `pose[layerId].flipX` (horizontal mirror)
  - **Ctrl + click** → toggle `pose[layerId].flipY` (vertical mirror)
  - Both modifiers can be active simultaneously (`flipX && flipY` = 180° rotational symmetry)
  - Flip pivot is the R point (falls back to MR if no R); applied **after** rotation and
    **before** translation in `applyRigTransform` via `ctx.scale(±1, ±1)` around the pivot
  - Works in both the Editor modal (`_setupRigInteraction`) and the node canvas
    (`setupPreviewInteraction`); Alt+right-drag (camera roll) is unaffected because roll
    requires button 2
  - **`applyChainToPoint`** — flip added after rotation step:
    `if (p.flipX) x = 2*px - x; if (p.flipY) y = 2*py - y`
  - **`inverseChainToPoint`** — inverse flip inserted between translation undo and rotation
    undo (flip is self-inverse: same formula)
  - **`getAncestorChain` / `buildAncestorChain`** — chain-inclusion condition extended to
    `|| p.flipX || p.flipY` so flipped ancestors are included even when angle/tx/ty are zero
  - **`hasTf`** in `renderLayersToCtx` render loop — extended with `|| p.flipX || p.flipY`
    for both the group branch and the leaf branch
  - **Flip indicator in `drawRigOverlay`** — `↔` (flipX), `↕` (flipY), or `↔↕` (both)
    drawn in yellow (`rgba(255,220,0,0.95)`) below the pivot point, visible in all modes

### Fixed
- **Editor setup mode: panning blocked when layer selected** — any click that missed an
  existing rig point immediately called `_placeSetupPoint()`, making it impossible to pan
  the preview canvas while a layer was selected; fixed by checking `e.button === 2` at the
  top of the setup branch and entering `isPanning` state for right-button presses, leaving
  left-click for point placement as before

### Changed
- **`_renderParentTab` — collapsible hierarchy** — parent tab now supports collapse /
  expand using the existing `collapsedIds` set:
  - Nodes with at least one `layerParent` child show a `▶ / ▼` toggle button; clicking it
    hides or reveals the subtree without affecting other tabs
  - Custom group nodes (`cg_xxx`) that appear as parents in `layerParent` are now resolved
    via `this.state.customGroups` and displayed as `📂 [CG] name`; previously they were
    silently skipped because `_findNodeById` only searches the PSD layer tree
  - Clicking a CG row in the parent tab selects it (sets `_selectedCgId`), matching the
    behavior of the layer tab
  - Eye button and inline rename (PSD layers only via dblclick) preserved

### Schema addition
```jsonc
{
  "pose": {
    "layerId": {
      "flipX": boolean,  // optional; horizontal flip around R/MR pivot
      "flipY": boolean   // optional; vertical flip around R/MR pivot
    }
  }
}
```

---

## v2.4.0 — 2026-06-02

### Overview
Two improvements: (1) custom groups can now have rig points assigned directly, and those
points propagate transforms to member layers via `layer_parent`; (2) the Editor modal preview
now shows a PSD canvas boundary line matching the node canvas.
Includes fixes for orange-handle drag not working in Editor pose mode, and group rig not
moving member layers on the node canvas.

### Added
- **Custom group rigging** — custom groups can now be selected in Setup mode and have R / MR
  rig points placed on them; the group acts as a virtual layer with `left:0, top:0` and PSD
  canvas dimensions (`width:psdW, height:psdH`)
  - **`getEffectiveImageMap(node, config)` (global helper)** — returns `node._layerImages`
    merged with a virtual entry `{img:null, isCgLayer:true, left:0, top:0, width, height}`
    for each custom group that has no existing entry; used by all rendering and interaction
    paths on the node canvas
  - **`PSDModal._getEffectiveImageMap()`** — same logic scoped to the modal's `this.state`
  - **`drawRigOverlay` / `hitTestRig`** gain a `customGroups = []` parameter; any custom
    group whose ID appears in `rigging` is appended as a virtual node `{id, name}` to
    `allLayers` so its rig points are drawn and hittable
  - **`_getSelectedLayerId()`** updated to return `this._selectedCgId` first so a selected
    custom group is recognized as the Setup target
  - **`_deleteSelectedRig()`** updated to delete the rig of `_selectedCgId` when a custom
    group is selected
- **PSD canvas boundary in Editor modal** — a yellow dashed border (`rgba(255,255,100,0.5)`,
  `1/zoom` px wide) is drawn around `(0, 0, psdW, psdH)` inside the camera transform block
  in `_drawPreview()`, matching the node canvas boundary style

### Changed
- **`_createGroup()`** — after creating the group, automatically sets
  `this.state.layerParent[lid] = cgId` for every member layer that has no existing
  `layerParent` entry; also sets `this._selectedCgId = cgId` so the new group is immediately
  selected and ready for rig point placement
- **`_moveItemToGroup()`** — when a layer is dragged into a group, sets
  `layerParent[itemId] = groupId` if the item is not a CG and has no existing parent;
  when it is removed from its previous group, clears `layerParent[itemId]` if that group
  was its parent
- **`_removeItemFromGroup()`** — clears `layerParent[itemId]` when the removed item's
  recorded parent matches the group being left
- **`_ungroup()`** — now also deletes `rigging[targetId]`, `pose[targetId]`, and clears
  `layerParent` entries that pointed at the dissolved group
- **All rendering / interaction calls** updated to use effective image maps and pass
  `customGroups`:
  - `drawNodeCanvas()` — uses `getEffectiveImageMap`; passes `_config.custom_groups` to
    `drawRigOverlay`
  - `captureNode()` — uses `getEffectiveImageMap` (fixes group rig missing in output image)
  - `setupPreviewInteraction` mousedown / mousemove — uses `getEffectiveImageMap`; passes
    `config.custom_groups` to `hitTestRig`
  - `_setupRigInteraction` (modal) mousedown / mousemove — uses `_getEffectiveImageMap()`
    for entry lookup and `buildAncestorChain` call; passes `this.state.customGroups` to
    `hitTestRig`
  - `_drawPreview()` — uses `_getEffectiveImageMap()`; passes `this.state.customGroups` to
    `drawRigOverlay`

### Fixed
- **Editor pose mode: orange handle not draggable** — `pose_drag` in `_setupRigInteraction`
  used `const entry = node._layerImages[layerId]` directly; for custom-group rig IDs this
  returned `undefined`, causing a TypeError that silently prevented `p.tx/ty` from updating;
  fixed by using `this._getEffectiveImageMap()[layerId]`; same fix applied to the
  `buildAncestorChain` call inside the orange branch
- **Node canvas: group rig not moving member layers** — `_moveItemToGroup` did not update
  `layerParent`, so layers added to a group via drag-and-drop after group creation had no
  ancestor chain; `renderLayersToCtx → getAncestorChain` therefore returned an empty chain
  and the group's `tx/ty` was never propagated; fixed by auto-setting `layerParent` in
  `_moveItemToGroup` (same guard used in `_createGroup`: only if not already set)

---

## v2.3.0 — 2026-06-02

### Overview
Camera roll on the node canvas preview: Alt + right-drag rotates the viewport around the
canvas center. All existing camera-transformed overlays (PSD boundary, rig points) correctly
follow the roll.

### Added
- **Camera roll** — `node._camera.roll` (radians, default `0`) applied as
  `ctx.rotate(cam.roll)` between `ctx.translate(W/2, H/2)` and `ctx.scale(cam.zoom)` in
  `drawNodeCanvas()`, so the entire PSD + rig + boundary rotates around the canvas center
- **Alt + right-drag interaction** — `setupPreviewInteraction()` detects `e.altKey && e.button === 2`
  on `mousedown`; enters `isRolling` state; `mousemove` sets
  `cam.roll = rollStartRoll + dx * 0.005` (≈ 0.29°/px); drag cursor `ew-resize`; roll
  cleared on `mouseup` / `mouseleave` exit
- **`toWorld()` roll inverse** — canvas → PSD coordinate conversion in
  `setupPreviewInteraction` now applies `cos(-roll) / sin(-roll)` rotation to the
  canvas-center-relative pixel offset before dividing by zoom, so rig point hit-testing
  remains accurate at any roll angle
- **`setDefaultCamera()`** — initializes `roll: 0` in both `node._camera` and
  `node._defaultCamera`; camera reset (`RC` button) therefore also resets roll
- **PSD boundary overlay moved inside ctx transform block** — previously drawn after
  `ctx.restore()` using `worldToCanvas` (which ignored roll); now drawn as
  `ctx.strokeRect(0, 0, psdW, psdH)` inside the camera save/restore block with
  `lineWidth = 1/cam.zoom` and `setLineDash([4/cam.zoom, 4/cam.zoom])`, so the boundary
  rotates correctly with the viewport

---

## v2.2.0 — 2026-06-01

### Overview
Three groups of improvements: (1) rig points on the node canvas now correctly follow
`layerParent` ancestor transforms (matching the modal's existing behavior); (2) the node
button row gains 🏷 label-toggle and RP reset-pose buttons, and the Editor modal gets an
RP button below its preview; (3) the MR orange handle direction is now freely orientable
during setup instead of being fixed to the right — stored as a new `mr_angle` field.

### Fixed
- **Node canvas: R/MR points did not follow parent-layer transforms** — `drawRigOverlay`,
  `hitTestRig`, and the orange-handle drag handler were all called without `layer_parent`,
  so ancestor transforms were ignored on the node canvas:
  - `drawNodeCanvas()` now passes `_config.layer_parent || {}`, `_config.renamed || {}`,
    and `node._showRigLabels` to `drawRigOverlay`
  - `setupPreviewInteraction` mousedown now passes `config.layer_parent || {}` to
    `hitTestRig`; pivot position for `r` and `mr` types computed via
    `buildAncestorChain + applyChainToPoint` (same logic as the modal)
  - Orange-handle drag (`hit.type === 'orange'`) now applies `inverseChainToPoint` before
    computing `tx/ty`, so dragging respects the ancestor rotation axes; `chain` is stored
    in `rigDragInfo` at mousedown and reused in mousemove

### Added
- **`🏷` label toggle button on node row 2** — `node._showRigLabels` (default `false`);
  green outline when active; triggers `drawNodeCanvas(node)`; placed between Editor and RC
- **`RP` button on node row 2** — calls `resetNodePose(node)`, which sets every rigged
  layer's pose to `{angle:0, tx:0, ty:0}`, writes back to `layer_config`, and redraws;
  placed between 🏷 and RC so the row reads `[Editor] [🏷] [RP] [RC]`
- **`RP` button in Editor modal preview panel** — `modalRpBtn` appended below
  `_previewStatusEl`; resets `this.state.pose[id]` for every id in `this.state.rigging`
  and calls `_drawPreview()`; available in all rig modes (normal / setup / pose)
- **`resetNodePose(node)`** — new top-level helper function (added after `resetNodeCamera`)

### Changed
- **MR orange handle: freely orientable direction** — previously the orange handle was
  always displayed at `(mrOrigin.x + mr_radius, mrOrigin.y)` (fixed rightward) during
  setup; now it is positioned at angle `mr_angle` from the MR origin:
  - **`drawRigOverlay` setup branch** — `oX/oY` computed as
    `(sX + r·cos(mr_angle), sY + r·sin(mr_angle))` where `mr_angle` defaults to `0`;
    connecting dashed line and radius label follow the new `oY`
  - **`hitTestRig` setup branch** — orange hit target moved to the same angled position
  - **`_setupRigInteraction` setup_drag** — orange drag now updates both `mr_radius` (`hypot`)
    and `mr_angle` (`atan2`) from the drag delta, allowing the user to drag the handle in
    any direction
  - **`_placeSetupPoint()`** — when `mr_radius === 0` at first MR placement, initializes
    `mr_angle = 0` alongside `mr_radius = 50`

### Schema addition
```jsonc
{
  "rigging": {
    "layerId": {
      "mr_angle": number   // radians; 0 = rightward (default). New optional field.
    }
  }
}
```
Existing configs without `mr_angle` default to `0` (unchanged visual behavior for right-pointing handles).

---

## v2.1.0 — 2026-06-01

### Overview
UI refactor separating display order from parent-child relationships into two tabs, plus a
critical fix ensuring that `layerParent` rig-transform propagation no longer alters the
rendering order, and full visual/interaction support for rig points on child layers.

### Added
- **レイヤー / ペアレント タブ** — the right panel is now split into two tabs:
  - **レイヤータブ**: shows `cgOrder` display order with drag-and-drop, custom group
    create/ungroup buttons; `layerParent` indentation is not shown here
  - **ペアレントタブ**: shows `layerParent` parent-child hierarchy; buttons `▲ ▼ ◀ ▶`;
    order here is purely visual and has no effect on rendering
- **`parentTabOrder`** — new `LayerState` field (`parent_tab_order` in JSON) storing
  `{ roots, children }` for the parent tab's independent sibling order; `null` entries
  fall back to `cgOrder`-derived order; persisted via `toConfig`/`fromConfig`
- **`▲ ▼` buttons (parent tab)** — `_shiftParentTabItem(dir)` swaps a layer with its
  previous/next sibling in `parentTabOrder` without touching `cgOrder`
- **Tab-aware `_indent` / `_outdent`** — dispatches to `_indentParent` / `_outdentParent`
  (which update `parentTabOrder`) when the parent tab is active; falls back to the
  original `cgOrder`-based logic in the layer tab
- **Standalone rig-transform helpers** — `buildAncestorChain`, `applyChainToPoint`,
  `inverseChainToPoint` added as top-level functions for use by overlay and hit-test code

### Fixed
- **Rendering order preserved after `layerParent` assignment** — `renderLayersToCtx`
  no longer skips child layers in the main render pass; `drawLayerTree` (which reordered
  children after their parent) is removed and replaced by `getAncestorChain`, which
  accumulates parent rig transforms and applies them via `ctx.save/restore` to each child
  at its original `cgOrder` position — display order is fully determined by `cgOrder`, not
  by `layerParent`
- **Child rig points shown at correct visual position** — `drawRigOverlay` now accepts
  `layerParentMap` and applies each ancestor's `ctx` transform (rotation + translation)
  in a `save/restore` block before drawing the layer's rig points; points for child layers
  move correctly when a parent is posed
- **Child rig point hit detection corrected** — `hitTestRig` accepts `layerParentMap` and
  calls `applyChainToPoint` to convert each rig point from local to visual coordinates
  before distance comparison; clicking on a visually-moved rig point now registers correctly
- **Pose drag pivot uses visual coordinates** — when starting a pose drag on a child layer,
  `buildAncestorChain` + `applyChainToPoint` compute the pivot's visual position; angle
  delta is measured from the visual pivot, giving correct rotation behavior
- **MR orange-handle drag corrected for rotated ancestors** — `inverseChainToPoint` converts
  the drag position from visual (world) space back to the layer's ancestor-local space before
  computing `tx/ty`; motion direction now matches the ancestor's rotated axes

### Schema additions
```jsonc
{
  "parent_tab_order": { "roots": ["id", …] | null, "children": { "parentId": ["childId", …] } }
}
```
Field is optional; omitting it derives order from `cgOrder`.

---

## v2.0.0 — 2026-06-01

### Overview
Major structural additions: (1) PSD group layers can now carry R/MR rig points; (2) custom
groups can be nested arbitrarily; (3) a unified `cgOrder` list controls the display order of
custom groups and PSD layers together; (4) `◀ ▶` indent buttons enable parent-child
relationships between layers without creating a custom group; (5) `layerParent` propagates
parent rig transforms to child layers hierarchically (tail-chain use case).

### Added
- **Group layer rigging** — `loadLayerImages` now creates a pseudo-entry `{img:null, isGroup:true,
  left, top, width, height}` for every PSD group node; `hitTestRig`, `drawRigOverlay`, and
  `_placeSetupPoint` handle groups automatically; `renderLayersToCtx` applies the group's
  `rig/pose` transform to a `ctx.save/restore` block wrapping all its children
- **Nested custom groups** — `layer_ids` may now contain CG IDs (prefixed `cg_`); `renderCg()`
  is recursive; `_moveItemToGroup()` has a descendant-set cycle check before moving; parent
  visibility propagates recursively via `markHidden()`; `_mkCustomGroupEl` is draggable
  (`dragstart` / `drop`) so groups can be rearranged or nested by drag-and-drop
- **`cgOrder`** — new `LayerState` field (and `cg_order` in saved JSON) storing the top-level
  display sequence of root CG IDs and PSD root layer IDs (upper-to-lower order); `_renderTree`
  iterates `cgOrder` instead of separate CG-then-PSD passes, allowing groups and PSD layers to
  be freely interleaved; `_reorder()` updates `cgOrder` when both endpoints are at the root level;
  migration: configs without `cg_order` reconstruct the order as `[rootCgIds…, reversedPsdIds…]`
- **`◀ ▶` indent buttons** — added to the group bar (right of グループ解除); behaviour:
  - **▶ (indent)**: sets `layerParent[selId] = prevId` where `prevId` is the immediately
    preceding item in the same scope; if `prevId` is a CG the operation is a no-op (does not
    enter CGs); works inside custom groups without escaping them
  - **◀ (outdent)**: for layers — deletes `layerParent[selId]` (stays within its CG scope);
    for CGs — removes from parent CG and re-inserts into `cgOrder` / grandparent `layer_ids`
    at the parent's position + 1
- **`layerParent`** — new `LayerState` field (and `layer_parent` in saved JSON) mapping
  `childId → parentId` for layer-level parent-child relationships:
  - `_renderTree` computes a depth-first `displayOrder` per scope and indents children;
    only root items (no parent in same scope) are rendered at the top of each list;
    `collapsedIds` suppresses children
  - `renderLayersToCtx` builds a reverse map `layerChildrenMap`; `drawLayerTree(n, entry)`
    applies the layer's own `rig/pose` transform in a `ctx.save/restore` block, then recurses
    into children — child layers inherit the accumulated canvas transform from all ancestors;
    layers that have a `layerParent` entry are skipped in the main `render()` pass to prevent
    double-drawing
  - `applyRigTransform(entry, rig, p)` helper extracted to eliminate duplicated pivot /
    rotation / translation code across the group and layer branches

### Changed
- **`_createGroup()`** — if `_selectedCgId` is set, the new CG is appended to that group's
  `layer_ids` (sub-group); otherwise it is `unshift`-ed into `cgOrder` (root group)
- **`_ungroup()`** — removes the target CG from `cgOrder` and from all parent `layer_ids`;
  child CGs are promoted to `cgOrder` at the removed CG's former index position
- **`_moveItemToGroup()`** — removes the item from `cgOrder` when it transitions from root CG
  to nested CG; `_removeItemFromGroup()` re-inserts it into `cgOrder` when promoted back to root

### Schema additions
```jsonc
{
  "cg_order":    ["cg_xxx", "psd_layer_id", …],   // root display order (new)
  "layer_parent": { "child_id": "parent_id", … }  // layer hierarchy (new)
}
```
Both fields are optional; configs without them fall back to prior behaviour.

---

## v1.7.0 — 2026-05-30

### Overview
MR point system redesign. R and MR points are now strictly independent: placing R creates
only R (blue), placing MR creates only MR (red) — the previous auto-creation of both is
removed. MR now supports both rotation (drag red point) and translation (drag orange point)
in pose mode, with the orange handle and red dashed line visible in both setup and pose modes.
Visual style updated to match the particle renderer reference (red dashed line connecting
MR origin to orange radius handle).

### Changed
- **`_placeSetupPoint()`** — initialization refactored:
  - Previous: first placement always created `{ r:{…}, mr:{…}, mr_radius:0 }` regardless of
    which button was active
  - New: `if (!rig)` creates `{ mr_radius: 0 }` only; R button adds `rig.r` if absent; MR
    button adds `rig.mr` if absent — the two point types no longer coerce each other
  - Default `mr_radius = 50` is applied only when `mr_radius === 0` at MR placement time
- **`renderLayersToCtx()`** — rotation pivot logic generalized:
  - Previous: only `rig.r` was used as rotation pivot; MR-only layers could not rotate
  - New: pivot = `rig.r ?? rig.mr`; MR-only layers now rotate around `rig.mr`
- **`drawRigOverlay()` — pose mode branch** rewritten for MR:
  - MR origin (red dot) drawn at fixed world position `(entry.left + mr.x, entry.top + mr.y)`;
    no `tx/ty` applied, as MR is the rotation anchor
  - Orange dot drawn at `(MR_world + p.tx, MR_world + p.ty)` — tracks current translation
  - Red dashed line `[4,3]` / `rgba(220,50,50,0.85)` / 2px connects MR origin to orange dot
  - Orange range circle `[5,5]` / `rgba(255,136,0,0.4)` drawn around MR origin at `mr_radius`
  - All MR visuals (circle, line, orange dot) conditional on `mr_radius > 0`
- **`drawRigOverlay()` — setup mode branch** — connecting line color changed:
  - Previous: orange `rgba(255,136,0,0.7)`
  - New: red `rgba(220,50,50,0.85)` / `[4,3]` / 2px, matching pose mode
  - Radius label `R: {px}` added in orange next to the orange handle
- **`hitTestRig()` — pose mode branch** — MR and orange tested independently:
  - MR origin hit at fixed `(entry.left + mr.x, entry.top + mr.y)` (no tx/ty)
  - Orange hit at `(MR_world.x + tx, MR_world.y + ty)` — only when `mr_radius > 0`
  - Orange tested before MR so it takes priority when positions overlap (tx=ty=0)
- **Pose drag — modal (`_setupRigInteraction`) and node canvas (`setupPreviewInteraction`)**:
  - `hit.type === 'r'` → rotation around R (unchanged)
  - `hit.type === 'mr'` → rotation around fixed MR origin (`pivotX/Y = entry + mr.x/y`, no tx)
  - `hit.type === 'orange'` → translation: `p.tx = wx − mr.x`, `p.ty = wy − mr.y`, clamped to
    `mr_radius` circle (logic moved from former `'mr'` branch)
  - Both drag-start blocks (`mousedown`) compute `pivotX/Y` and `initAngle` for `'mr'` type

### Notes
- A layer can now have `r` only, `mr` only, or both; existing saved configs with both keys
  continue to work (R used for rotation if present, otherwise MR; MR orange for translation)
- Multiple points per layer (numbered) is deferred to a future version

---

## v1.6.0 — 2026-05-30

### Overview
Three improvements to the rigging/posing workflow: (1) the modal preview panel is enlarged
1.5× and gains the same pan/zoom camera as the node canvas; (2) rig points now display layer
name labels so nearby or overlapping points can be identified; (3) the rig point model is
corrected — R and MR are now fully independent systems, data keys renamed throughout.

### Added
- **Modal preview pan/zoom** — preview panel width `260 → 390 px`; modal width `720 → 850 px`;
  canvas internal resolution fixed at `366 × 520`; camera (`_previewCam: {x, y, zoom}`) set
  at open time to fit-zoom the PSD, same algorithm as the node canvas
  - Left-drag → pan (normal, setup-miss, and pose-miss all fall through to pan)
  - Mouse wheel → zoom around cursor (factor 1.12, range 0.05×–20×)
  - `_setDefaultPreviewCam()` helper recomputes fit-zoom from current PSD dimensions
- **Rig point labels** — `_drawRigLabel(ctx, x, y, label, isSelected)` helper renders a
  semi-transparent black background + white text (yellow when selected) above each rig point
  - `drawRigOverlay()` gains `showLabels = false` and `renamed = {}` parameters
  - Setup mode: always shown; label positioned above the R or MR point respectively
  - Pose mode: controlled by `_showRigLabels` flag (default `true`); a **🏷 ラベル** toggle
    button appears in the green pose bar (highlighted with green outline when active)
- **Pose mode bar** — `poseBar` element (green tint) shown below header when Pose mode is
  active; currently contains only the label toggle button; symmetric with `setupBar`

### Changed
- **Rig point model — R and MR are now independent**
  - `pivot` → `r` (Rotation): rotation-only point; posing rotates the layer around `r`
  - `stretch_origin` → `mr`, `stretch_radius` → `mr_radius` (Move and Rotation):
    translation-only point; `mr` is origin, orange handle sets `mr_radius`; posing drags the
    layer within the radius circle; `p.tx / p.ty` are updated
  - The two point types are designed for exclusive use per layer (one or the other); both can
    coexist but each operates independently
- **`renderLayersToCtx()`** — rewritten to handle R-only, MR-only, or both:
  - R present + `p.angle`: applies `translate(px,py) rotate(angle) translate(-px,-py)`
  - `p.tx || p.ty`: applies `translate(tx, ty)` (from MR interaction)
  - No rig or no non-zero pose values: draws as before
- **`drawRigOverlay()`** — rewritten per-point-type loop:
  - Guard changed from `if (!rig?.r)` to `if (!rig?.r && !rig?.mr)` so MR-only layers render
  - R block (blue dot) and MR block (red dot + orange radius handle) drawn independently
  - Selected-layer yellow ring follows the active point (R preferred over MR when both exist)
- **`hitTestRig()`** — same guard fix; setup and pose branches each test R and MR independently
- **`PSDModal._buildDOM()`** — rig button labels: `"🔵 Pivot"` → `"R"`, `"🔴 Stretch"` → `"MR"`;
  internal names `_btnPivot/_btnStretch` → `_btnR/_btnMR`; `_setupPointType` default `'pivot'` → `'r'`
- **`_drawPreview()`** — migrated from calling global `drawPreview()` (which reset canvas size
  to PSD dimensions) to inline camera-transformed rendering matching node canvas approach;
  rig overlay now rendered inside the `ctx.save/restore` camera block
- **`_setupRigInteraction()`** — completely rewritten; previously lacked pan/zoom; coordinate
  transform `toPsd()` now inverts camera matrix; `hitTestRig` receives `_previewCam.zoom`
- **Rig drag start (modal + node)** — `pivotX/Y` and `initAngle` computed only when
  `hit.type === 'r'` so MR-only layers no longer throw when `rig.r` is absent
- **`_placeSetupPoint()` and `setup_drag` init** — data object key `pivot:` → `r:`

### Schema change
```
rigging: {
  layerId: {
    r:         { x: number, y: number },   // was pivot
    mr:        { x: number, y: number },   // was stretch_origin
    mr_radius: number                       // was stretch_radius
  }
}
```
Existing saved workflows using the old keys will stop applying rig transforms (the keys will
simply be absent); re-place the rig points in Setup mode to migrate.

---

## v1.5.0 — 2026-05-30

### Overview
Layer rigging system. Two point types can be placed on each layer: a **pivot point** (blue)
that acts as the rotation centre, and a **stretch point** (red) that translates the layer
within a configurable radius. Setup is done in the Editor modal; posing works both in the
modal and directly on the node canvas (same interaction model as the 2D Pose Editor reference).

### Added
- **Rigging data in `layer_config`** — two new top-level keys:
  - `rigging`: `{ layerId: { pivot:{x,y}, stretch_origin:{x,y}, stretch_radius:number } }`
    — coordinates are in layer-local space (offset from `entry.left / entry.top`)
  - `pose`: `{ layerId: { angle:number, tx:number, ty:number } }`
    — `angle` = rotation around pivot (radians); `tx/ty` = translation from stretch interaction
- **`drawRigOverlay(ctx, layers, imageMap, rigging, pose, mode, selectedLayerId, setupPointType)`**
  — draws rig points on a canvas context; adapts to `'setup'` vs `'pose'` mode:
  - Setup: raw (un-posed) coordinates; shows orange handle + dashed radius circle + blue pivot + red stretch origin; highlights active point type with a ring
  - Pose: posed coordinates (pivot + tx/ty offset); blue pivot dot + red stretch dot
- **`hitTestRig(wx, wy, …)`** — returns `{ layerId, type:'pivot'|'stretch'|'orange' }` for the
  nearest rig point within a zoom-adjusted 14 px hit radius; used by both modal and node canvas
- **`_drawRigPoint(ctx, x, y, r, fill, stroke)`** — small helper for filled circle with stroke
- **Modal Setup mode** — toggled by [Setup] button in modal header:
  - Sub-bar appears with [🔵 Pivot] / [🔴 Stretch] type selector + [🗑 削除] delete button
  - Click on preview canvas → places selected point type at cursor position in layer-local coords
  - Drag existing point → repositions it
  - Drag orange handle → updates `stretch_radius`
- **Modal Pose mode** — toggled by [Pose] button:
  - Drag blue pivot dot → updates `pose[id].angle` via `atan2(mouse − pivot) − atan2(start − pivot)`
  - Drag red stretch dot → updates `pose[id].tx/ty`; clamped to `stretch_radius` circle
- **Node canvas rig interaction** — `setupPreviewInteraction()` now hit-tests rig points on
  `mousedown`; if a point is hit, enters rig-drag mode (same pivot/stretch logic as modal pose);
  if no point hit, falls through to existing pan behaviour; updates `layer_config` widget on
  every `mousemove` so `drawNodeCanvas()` shows live feedback
- **`node._rigSelectedLayerId`** — tracks which layer is highlighted (yellow ring) on the node
  canvas rig overlay

### Changed
- **`LayerState`** — added `rigging` and `pose` properties; both included in `toConfig()` and
  restored in `fromConfig()`
- **`renderLayersToCtx()`** — when a layer has both a `rigging` entry (with `pivot`) and a
  `pose` entry with non-zero values, applies `ctx.translate(tx, ty)` → `ctx.translate(pivotX, pivotY)`
  → `ctx.rotate(angle)` → `ctx.translate(-pivotX, -pivotY)` before `drawImage`; layers without
  rig data draw as before
- **`drawNodeCanvas()`** — calls `drawRigOverlay()` in pose mode after rendering layers;
  config object extracted to a named variable so it can be reused for the overlay call

### Fixed
- **Layer name rename double-click not firing** — `row.addEventListener("click")` called
  `_renderTree()` which rebuilt the DOM before `dblclick` could fire on the original `nameEl`;
  fixed by delaying the `_renderTree()` call 250 ms when the click target is `nameEl`; a
  `dblclick` arriving within that window cancels the timer via `clearTimeout`
- **Custom group name rename double-click not firing** — same root cause as above; same fix
  applied to `_mkCustomGroupEl`
- **Layer compositing order reversed** — psd-tools `enumerate(psd)` yields layers in
  back-to-front order (`psd[0]` = bottommost); `_renderTree` already used `.reverse()` for
  correct UI display (foreground at top), but `renderLayersToCtx` and `_manual_composite`
  also called `.reverse()` / `reversed()`, making the draw order front-to-back (each layer
  was painted *under* the previous one); removed all `reversed()` / `.reverse()` calls from
  the three compositing paths (`renderLayersToCtx`, `_manual_composite`,
  `_manual_composite_ordered`) so layers are drawn back-to-front as intended

---

## v1.4.0 — 2026-05-29

### Overview
Interactive preview canvas with pan/zoom/capture. The node preview is now a camera:
pan and zoom to frame the subject, then Capture to output exactly what is visible.
Output frame overlay shows the capture boundary based on output_width × output_height
aspect ratio. Capture triggers Queue Prompt automatically.

### Added
- **Interactive preview canvas** — replaced static `<img>` + placeholder with a `<canvas>`
  element (462 × 422 px internal); serves as the interactive camera viewport
- **Pan** — left-click drag moves the canvas view; direction and scale correctly account for
  CSS-to-canvas pixel ratio (`canvas.width / rect.width`) and zoom level
- **Zoom** — mouse wheel zooms around the cursor position (not canvas center); range 0.05×–20×
- **RC button** — resets camera to the fit-zoom state computed at PSD load time
  (`zoom = min(462/psdW, 422/psdH) * 0.95`); placed alongside Editor button in row 2
- **Capture button** — captures current viewport as `image_data` and immediately calls
  `app.queuePrompt(0, 1)` to run the node; button shows ⏳ Queuing… → ✅ Done! feedback
- **`image_data` widget** (backend) — added to `PSDLoaderNode.INPUT_TYPES` as optional STRING;
  when non-empty the backend decodes base64 PNG → PIL → tensor, bypassing server compositing;
  clears on workflow save via `app.graph.serialize` wrapper hook (same pattern as 2D Pose Editor)
- **`IS_CHANGED`** — added to `PSDLoaderNode`; hashes all parameters including `image_data`
  so the node re-executes whenever capture data changes
- **Output frame overlay** — semi-transparent dark mask outside the capture boundary, white
  border + L-corner markers + size label (`W × H`) at bottom-right; frame is the largest
  rectangle inside the preview canvas that matches `output_width / output_height` aspect ratio
- **PSD boundary overlay** — yellow dashed border showing PSD content extents within the
  viewport; rendered in world-space coordinates via camera transform inverse
- **`computeOutputFrame(node)`** helper — computes the crop rectangle `{fx, fy, fw, fh}`
  from output_width/height aspect ratio and preview canvas dimensions
- **`worldToCanvas(wx, wy, cam, W, H)`** helper — converts PSD world coordinates to canvas
  pixel coordinates under current camera state
- **Output widget callbacks** — `output_width` and `output_height` widget callbacks trigger
  `drawNodeCanvas(node)` immediately so the output frame redraws on value change

### Changed
- **Capture → viewport crop** — capture renders the output frame region (`fw × fh` in preview
  canvas space) mapped to `output_width × output_height`; transform:
  `scale(cam.zoom * outW/fw)` centered at frame center (`outW/2, outH/2`); mathematically
  equivalent to rendering the world region visible through the output frame rectangle
- **Node layout** — added third button row for Capture; `UI_WIDGET_H` updated:
  `BTN_H(30) × 3 + PREVIEW_WIDGET_H(450) = 540`
- **`_setNodePreview()`** — requests preview image at `canvas.width * 2` for higher
  resolution fallback when layer images are not yet cached
- **`PSDModal._apply()`** — calls `drawNodeCanvas(node)` instead of setting `img.src`
- **`refreshNodePreview()`** — calls `drawNodeCanvas(node)` directly when layer images cached

### Fixed
- **`ModuleNotFoundError: No module named psd_pose_editor`** — reverted `__init__.py` to
  original (only imports `psd_loader_node`); `psd_pose_editor` subpackage is a reference/test
  artifact and is not installed in the ComfyUI custom_nodes path

---

## v1.3.0 — 2026-05-28

### Overview
Resolved persistent node height / preview overflow issues caused by ComfyUI's DOM widget
placement system. Consolidated all custom UI elements into a single DOM widget to eliminate
multi-widget layout interference, and overrode `prototype.computeSize` to guarantee correct
node height regardless of ComfyUI's internal recalculation timing.

### Fixed
- **Preview overflows node frame (height too small)** — root cause: `computeSize()` called
  before DOM widgets are fully initialized returns incorrect height; ComfyUI also periodically
  re-calls `computeSize()` and resets `node.size[1]`, discarding manually set values
  - Fix 1 (rejected): `requestAnimationFrame` delay — ComfyUI overwrites size again after
    the callback fires
  - Fix 2 (final): override `nodeType.prototype.computeSize` to always return a minimum
    height of `UI_WIDGET_H + 80`, preventing ComfyUI from shrinking the node
- **`psd_btns` widget renders at full node height** — root cause: ComfyUI allocates a single
  DOM overlay container for all DOM widgets; multiple DOM widgets (`psd_btns`, `psd_preview`)
  caused placement interference where the first widget expanded to fill the entire container
  - Fix: merged `psd_btns`, `Editor` button, and `psd_preview` into one DOM widget (`psd_ui`)
    backed by a single `uiWrap` flex column container; ComfyUI now allocates exactly one
    overlay region with no cross-widget interference
- **4 px preview clip at bottom** — `PREVIEW_WIDGET_H` was 446 but actual `previewWrap`
  height is 450 (padding 10 + previewBox 422 + statusEl 18); corrected constant to match

### Changed
- `PREVIEW_WIDGET_H`: `PREVIEW_IMG_H + 24` (446) → `PREVIEW_IMG_H + 28` (450)
- `UI_WIDGET_H` new constant: `30 + 34 + PREVIEW_WIDGET_H` = 514
  - `30` = btnRow, `34` = editorBtn (height 26 + margin 8), `450` = previewWrap
- `addDOMWidget("psd_btns")` and `addWidget("button", "Editor")` removed; replaced by
  `editorBtn` HTML button and `btnRow` inside the unified `uiWrap` flex container
- `addDOMWidget("psd_preview")` replaced by `addDOMWidget("psd_ui")` (the unified container)
- `prototype.computeSize` override added in `beforeRegisterNodeDef` (before `onNodeCreated`)
  with `minH = UI_WIDGET_H + 80`; `onNodeCreated` and `onConfigure` now set `node.size`
  directly without `requestAnimationFrame`

---

## v1.2.0 — 2026-05-28

### Overview
Fixed preview area overflow, implemented fixed node size (474×733), and redesigned
preview widget with always-visible 422×422 area using inner-container isolation pattern.
Also fixed button stretching on wide nodes.

### Added
- **Fixed node size** (474×733) — `node.resizable = false` with `node.onResize` override
  enforces constant size; follows the same pattern as the 2D Pose Editor reference node
- **Always-visible preview area** (422×422) — preview placeholder (checker pattern) shown
  before PSD is loaded; replaced by the actual composite image after load
- **Checker placeholder canvas** — drawn programmatically as a 64×64 tiled checker,
  displayed full-size via CSS `width:100%; height:100%` with `image-rendering:pixelated`
- **`PREVIEW_IMG_H = 422`** and **`PREVIEW_NODE_W = 474`** module-level constants
  for centralized size management

### Fixed
- **Preview overflow / clipping to 29px** — root cause: `overflow:hidden` on the outer
  DOM widget element (whose height ComfyUI sets incorrectly) clipped the preview content
  - Fix: removed `overflow:hidden` from the outer `wrap`; added inner `previewBox` div
    with explicit `height:422px` and `overflow:hidden`; placeholder and img use
    `position:absolute; top:0; left:0; width:100%; height:100%` inside `previewBox`
  - ComfyUI cannot affect `previewBox` height since it is a child element, not the
    registered widget element
- **PSD load button stretching** — `psdBtn` with `flex:1` expanded to fill full node
  width when node was wide (e.g., output_width=1024); fixed by adding `max-width:220px`
- **Node size not updating** — previous `setTimeout + if (node.size[0] < PREVIEW_NODE_W)`
  conditional skipped height update when node was already wide; replaced with immediate
  unconditional `node.size[0] = PREVIEW_NODE_W; node.size[1] = node.computeSize()[1]`
- **Saved workflow restoring wrong node size** — `onConfigure` now also applies
  `node.size[0] = PREVIEW_NODE_W; node.size[1] = node.computeSize()[1]` to override
  stale saved sizes

### Changed
- Preview widget `computeSize(w)` now returns fixed `[w, PREVIEW_IMG_H + 24]` (446px)
  instead of dynamic `[w, node._previewH ?? 0]`
- Removed `_updateNodePreviewHeight()` function and all dynamic height calculation logic
- `buildPreviewWidget()` restructured: outer `wrap` (no overflow) → inner `previewBox`
  (fixed 422px, overflow:hidden) → placeholder + img (absolute positioned)
- Simplified `refreshNodePreview`, `_apply`, and canvas path to remove height update calls

---

## v1.1.0 — 2026-05-28

### Overview
Added layer order reflection in output image, node preview display, output size controls,
and Editor layer order display matching Affinity Photo (foreground at top).

### Added
- **Node preview widget** — composite preview rendered inside the node using server-side
  `/psd_loader/preview` API or client-side canvas (when layer images are cached)
- **`output_width` / `output_height` INT parameters** — resize output image; 0 = no resize;
  aspect ratio preserved if only one dimension is set
- **Layer order in output** — `layer_order` key saved to `layer_config` JSON in `_apply()`;
  `composite_with_config()` uses `_manual_composite_ordered()` when `layer_order` is present
- **`_manual_composite_ordered()`** in `psd_utils.py` — renders layers in the order specified
  by the frontend layer tree (foreground-first list, reversed for back-to-front compositing)
- **Frontend layer reordering** — drag-and-drop reorder in the Editor modal; reordered tree
  saved as `layer_order` in config on Apply
- **Foreground-first layer display** — Editor shows layers with foreground at top (reversed
  from psd-tools' back-first array) using `[...nodes].reverse()` in `_renderTree`
- **Canvas-based node preview** — when `node._layerImages` is cached, `drawPreview()` renders
  directly to a canvas and sets `img.src` as dataURL (no server round-trip)

### Fixed
- **Import path error** (`GET /extensions/scripts/app.js 404`) — changed from relative
  `../../scripts/app.js` to absolute `/scripts/app.js`
- **"Extension already registered" error** — deleted duplicate `web/psd_loader.js` (web root);
  active file is `web/js/psd_loader.js`
- **Files not reflected in ComfyUI** — created Windows Junction point linking development
  directory to ComfyUI custom_nodes directory

### Changed
- `psd_utils.py`: added `_manual_composite_ordered()` and modified `composite_with_config()`
  to use it when `layer_order` is present in config
- `psd_loader_node.py`: added `output_width`/`output_height` params and resize logic using
  `Image.LANCZOS`

---

## v1.0.0 — (prior session)

### Overview
Initial implementation of PSD Loader ComfyUI custom node.

### Added
- PSD file upload via `/psd_loader/upload` API endpoint
- Layer tree parsing and display in modal Editor
- Layer visibility toggle with eye button
- Custom group creation (drag-and-drop layers into named groups)
- Layer visibility reflected in composite output
- Node preview via `/psd_loader/preview` API
- Layer rename (double-click inline edit)
- `get_layer_image_by_id()` for per-layer image fetch
- `composite_with_config()` with three fallback methods (layer_filter, visible override, manual)
- Server routes: `/psd_loader/upload`, `/psd_loader/layers`, `/psd_loader/layer_image`,
  `/psd_loader/preview`