エディタ仕様書(小説執筆支援機能)
1. 概要
小説執筆における視認性と編集効率を向上させるため、Monaco Editor をカスタマイズし、小説特有の表現をサポートします。
2. 機能仕様
2.1 シンタックスハイライト(カスタム言語: novel)
小説特有の記法を強調表示します。
- セリフの強調:
「で始まり」で終わるテキスト、および『で始まり』で終わるテキストを強調表示します。- トークン名:
novel.dialogue - 色:
theme.jsonまたはカスタムテーマ定義により、通常のテキストと区別できる色(例: 明るい緑)を割り当てます。
- ルビ・傍記:
- カクヨム記法に準拠した形式を認識します。
|文字《るび》(任意の文字)漢字《るび》(漢字の後の自動ルビ)《《傍点》》(圏点)
2.2 空白文字の可視化
- 半角スペース・タブ:
- Monaco 標準の
renderWhitespace: 'all'を使用して表示します。
- Monaco 標準の
- 全角スペース:
- Monaco 標準機能ではサポートされていないため、
deltaDecorationsを使用してカスタムの視覚的装飾を適用します。 - レンダラー側で正規表現
/\u3000/gを用いて位置を特定し、背景色や枠線による装飾を行います。
- Monaco 標準機能ではサポートされていないため、
2.3 将来の拡張計画
- 形態素解析:
kuromoji.js等のライブラリを統合し、品詞(動詞、形容詞、助詞など)ごとに色分けを行う機能を検討します。
- 文章校正(シンタックスチェック):
- 三点リーダ(…)の偶数個チェック、括弧の閉じ忘れチェック、二重否定の検出などを
editor.onDidModelContentChangeにフックして実装する予定です。
- 三点リーダ(…)の偶数個チェック、括弧の閉じ忘れチェック、二重否定の検出などを
2.4 投稿支援機能
- 内部ウェブブラウザ:
webviewを使用したウェブブラウザ機能をドキュメント領域のタブとして表示します。- 小説投稿サイト(カクヨム、小説家になろう等)を表示し、コピペによる投稿作業を効率化します。
- クイックアクセスURL:
- カクヨム: https://kakuyomu.jp/my
- 小説家になろう: https://syosetu.com/usernovel/list/
- 外部ブラウザ連携:
- 必要に応じて、表示中のページをOS既定のブラウザで開き直すことができます。
3. 実装詳細
CodeEditor.tsxのbeforeMountで言語定義とテーマ登録を行います。onMountでeditor.onDidModelContentChangeリスナーを登録し、内容変更のたびに全角スペースの装飾を更新します。- 装飾用スタイルは
CodeEditor.cssで定義します。