プロジェクトエディタコンポーネント

プロジェクトエディタコンポーネント

執筆画面（/project/[id]）を構成する主要なパネルコンポーネントです。

LeftPanel (Plot Panel)

プロットの構造（Part > Arc > Chapter > Story > Section）をツリー形式で管理・表示するコンポーネントです。

• 責務:
  • プロット階層の表示と操作（追加、削除、並べ替え、編集）。
  • ドラッグ&ドロップによる並べ替え: @dnd-kit/core を使用してプロットアイテムの並べ替えを可能にする。
  • 同期スクロール (受信): selectedSectionAtom の変更を監視し、外部（CenterPanelなど）でセクションが選択された場合、自動的に該当するプロットアイテムまでツリーを展開し、スクロールして表示する。
  • AIによるプロット生成・翻訳のトリガー。
  • 各プロットアイテムに対して、生成、翻訳、リライト、編集、コンテキストプレビュー、削除などのアクションを提供する。
• ⋮メニュー構成:
  • 各階層（Section/Story/Chapter/Arc）のコンテキストメニューに Context Preview を含む。
  • Context Preview は ContextPreviewDialog を開き、AIに送信されるコンテキストの内訳を表示する。
• 関連Atoms:
  • partsAtom: プロットデータ全体。
  • selectedSectionAtom: 現在選択されているセクションID。
  • plotCollapseStateAtom: ツリーの展開状態を管理。
  • generatingSectionAtom: 生成中のセクションIDを管理。
  • editingPlotItemAtom: 編集中のプロットアイテムを管理。
  • focusedPlotItemAtom: フォーカス中のプロットアイテムを管理。

CenterPanel (Manuscript Panel)

原稿の執筆・閲覧を行うメインパネルです。

• 責務:
  • Story（話）単位の表示: 選択されたセクションが属するStoryに含まれるセクションの原稿カード（ManuscriptCard）のみを表示する。全セクションの一括表示ではなく、文脈のある最小単位（Story）で絞り込むことでDOM負荷を軽減する。
  • 自動選択: プロジェクト読み込み時、localStorageに保存されたセクションを復元。未選択・無効値の場合は最初の原稿ありセクションを自動選択する。
  • 同期スクロール (送信): 原稿カードがクリックされた際、selectedSectionAtom を更新してLeftPanelへ通知する。
  • 同期スクロール (受信): selectedSectionAtom が変更された際、該当する原稿カードまでスクロールする。
  • Mobile前後Storyナビゲーション: モバイルビューでは、表示中のStoryの上下に前後のStoryへのナビゲーションボタンを配置する。
  • 原稿の削除: 確認ダイアログ付きで原稿バージョンの削除機能を提供。
  • 原稿の再生成: AIによる原稿の再生成機能を提供。
  • 全原稿の整理: 使用されていない原稿バージョンを一括削除する「整理」機能を提供。
  • 保存機能: プロジェクトの保存状態を表示し、保存ボタンを提供。
• 関連Atoms:
  • manuscriptsAtom: 原稿データ（manuscriptSectionFamily から集約された読み取り専用Atom）。
  • selectedSectionAtom: 最後に選択したセクションID（localStorage永続化）。
  • isProjectDirtyAtom: プロジェクトの未保存状態を管理。
  • manuscriptFontSizeAtom: 原稿のフォントサイズ。
  • manuscriptFontWeightAtom: 原稿のフォントウェイト。
  • manuscriptContentChangeAtom: 原稿内容の変更を処理。
  • deleteManuscriptVersionAtom: 原稿バージョンの削除。
  • pruneAllManuscriptsAtom: 全原稿の整理。

ManuscriptCard

個々の原稿セクションを表示・編集するカードコンポーネントです。

• 責務:
  • 原稿本文の表示と編集（Textarea、100msデバウンス付き）。
  • バージョン管理（翻訳、オリジナル）の切り替え。
  • 選択検知: クリックイベントを親コンポーネントに通知し、アクティブなセクションとして設定させる。
  • 文字数カウンター: 原稿の文字数をリアルタイムで表示。
  • ZenMode起動: Expand ボタンから ZenModeView を開く。開く前にデバウンス中の編集内容をフラッシュする。
  • デバッグ情報: AI生成時のモデル情報とコンテキストサマリー（debugInfo.contextSummary）を折りたたみ表示。Raw Promptの詳細は ContextPreviewDialog に移譲。

ZenModeView

Reader画面と統一した没入型の執筆環境を提供するフルスクリーンオーバーレイコンポーネント。CenterPanel から onOpenZenMode 経由で起動される。

• 責務:
  • Reader統一UI: 固定ヘッダー（グラスモーフィズム）+ 中央寄せ本文 + 固定フッターの3層構成。.reader-prose と同等のタイポグラフィ（line-height: 1.9、letter-spacing: 0.05em）を適用。
  • セクション単位ナビゲーション: 全Storyにまたがるセクション単位の前後移動。フッターに位置情報（Sec. X/Y、Story A/B）を表示。
  • プロットメタデータオーバーレイ: ヘッダーの BookOpen ボタンから、Part>Arc>Chapter>Story>Section のパンくず付きで該当セクションのプロット情報を確認できる。
  • 言語切替: 複数言語の原稿がある場合、ドロップダウンで切替。
  • 100msデバウンス: Textareaの入力は100msデバウンスでAtom更新。セクション移動時はフラッシュしてから遷移。
• 関連Atoms:
  • manuscriptSectionFamily(sectionId): 現在のセクションの原稿データ。
  • manuscriptContentChangeAtom: 原稿内容の変更を処理。
  • selectedSectionAtom: セクション移動時に更新。
  • manuscriptFontSizeAtom / manuscriptFontWeightAtom: フォント設定。
  • partsAtom: プロット情報の参照。

RightPanel (Writing Tools Panel)

執筆支援ツールを提供するパネルコンポーネントです。

• 責務:
  • タブ構成: 「執筆プロンプト」と「AI設定」の2つのタブを提供。
  • 執筆プロンプトタブ: PromptManagementPanel を使用して、プロジェクト固有の執筆プロンプトを管理。
  • AI設定タブ: ConfigurableApiSettingsPanel を使用して、AI生成のための設定（プロバイダー、モデル、温度など）を管理。
• 関連Atoms:
  • writingPromptsAtom: プロジェクト固有の執筆プロンプト一覧。
  • addWritingPromptAtom: 新規プロンプトの追加。
  • updateWritingPromptAtom: プロンプトの更新。
  • deleteWritingPromptAtom: プロンプトの削除。
  • reorderWritingPromptsAtom: プロンプトの並べ替え。
  • writingLlmProviderAtom: AIプロバイダーの設定。
  • writingModelAtom: AIモデルの設定。
  • writingTemperatureAtom: 生成温度の設定。
  • writingTopPAtom: Top-Pの設定。
  • writingStreamingEnabledAtom: ストリーミング生成の有効/無効。
  • writingContextWindowAtom: コンテキストウィンドウの設定。
  • writingApiRequestIntervalAtom: APIリクエスト間隔の設定。

RewriteDialog

AIによる原稿のリライト・推敲を行うためのモーダルダイアログです。

• 責務:
  • 一括リライト対象のセクション一覧表示。
  • グローバル指示およびプロンプトアセットの構成。
  • AIによるプランニング結果とリライトプレビューの表示。
  • diff ライブラリを用いた新旧原稿の文字単位差分表示。
  • 生成結果の直接編集（Editモード）と、最終的な原稿への一括適用。
• 関連Atoms:
  • rewriteStateAtom: ダイアログの状態（指示、プレビュー、進行状況など）を永続化。
  • manuscriptsAtom: リライト結果の適用先。

ContextPreviewDialog

AIに送信されるコンテキストデータの内訳を事前確認するためのモーダルダイアログです。LeftPanelの各プロットアイテムの⋮メニューから開きます。

• 責務:
  • AI実行前に送信されるコンテキスト構成の可視化。
  • 4タブ構成: WritingPrompts / Structure Plot / Manuscripts / Raw Prompt。
  • Raw Promptタブは buildGenerateUserPrompt() で構築される実際の finalUserPrompt をそのまま表示。
  • サマリーバーで各コンテキストの文字数を一覧表示。
• 関連ユーティリティ:
  • formatPlotToMarkdown(): Plot構造をMarkdownヘッダー形式に変換（lib/utils/plotFormatter.ts）。
  • buildGenerateUserPrompt(): セクション生成時の finalUserPrompt を構築（generateSectionAtom と同一ロジック）。

PromptAssetSelector

リライト指示に使用するプロンプトのテンプレート（アセット）を選択するためのシートコンポーネントです。

• 責務:
  • 保存済みプロンプトアセットの検索と一覧表示。
  • 選択されたアセットを RewriteDialog の指示に統合。
• データソース:
  • promptAssetsAtom: データベースから取得したプロンプトアセット一覧。

PromptManagementPanel

プロンプトアセットを管理するためのパネルコンポーネントです。

• 責務:
  • プロンプトアセットの作成、編集、削除。
  • タグによるフィルタリングと検索。
  • 有効/無効の切り替え。
  • ドラッグ&ドロップによる並べ替え。
• データソース:
  • 対象となるプロンプトAtom（執筆プロンプトなど）。
  • 各種操作Atom（追加、更新、削除、並べ替え）。

プロンプトシステムのアーキテクチャ

本アプリケーションのプロンプトシステムは、3つの異なるテーブルで管理され、それぞれ異なるスコープと用途を持ちます。

執筆プロンプト (writingPrompts)

• スコープ: プロジェクト固有
• 用途: 執筆支援（プロット生成、文章生成など）
• 管理場所: プロジェクトごとの writingPrompts テーブル
• 同期: Project Chunk に含まれる
• UI: 右パネルの「執筆プロンプト」タブ

チャットプロンプト (chatPrompts)

• スコープ: グローバル
• 用途: AIチャットの性格や振る舞いを定義
• 管理場所: グローバルな chatPrompts テーブル
• 同期: Global Chunk に含まれる
• UI: チャット設定画面

プロンプトアセット (prompt_assets)

• スコープ: グローバル
• 用途: 再利用可能なプロンプトテンプレート（タグ、説明、公開設定などのメタデータを含む）
• 管理場所: グローバルな prompt_assets テーブル
• 同期: Global Chunk に含まれる
• UI: プロンプト管理パネル、リライトダイアログ内のアセット選択

同期トリガー

• プロンプトアセットの変更時: globalChunkVersionAtom が更新され、Global Chunk の同期がトリガーされます。
• 執筆プロンプトの変更時: プロジェクトの updatedAt が更新され、Project Chunk の同期がトリガーされます。