Lexical
Meta(Facebook)の作ったJavaScript向けテキストエディタフレームワーク
インライン記法？
- https://lexical.dev/docs/concepts/transforms#examples
- にMarkdownの例がある
- https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/plugins/AutoLinkPlugin.jsx
- これはLexicalAutoLinkPluginを利用している
- https://github.com/facebook/lexical/blob/main/packages/lexical-react/src/LexicalAutoLinkPlugin.js
- LexicalAutoLinkPlugin の説明がまだない
- 正規表現とそれに対応するurlを登録すればOKみたい
- wikilinkはこれで実装できそう
- この辺を参考にすればできそうだが・・ 冗長だなぁ・・
ブロック記法
- 複数行を対象とする記法は開始・終了記号を表示しないのが主流？
- lexicalにはそういうサンプルが存在しない
- ツールバーをクリックしてブロック記法にするのはよく見る
- 理想としてどうなればよいかよくわからん
- registerNodeTransformはNodeを1対1で変換する例しか見ていない
- https://github.com/facebook/lexical/blob/main/packages/lexical-markdown/src/v2
- この辺を見てみる
- インポート時にコードブロックを認識してNodeに変換する手法に見える
- 新たにブロック記法を導入するときはShortcutという仕組みが利用できそう
- import時は全体を読み取りつつNodeに変換する
- 入力時は入力ごとに処理してShortcutとして読み込む
- ただしソースコードが結構長いうえに面倒くさそう（パーサを手で書く感じの構造になっている）
- ペーストも一種のimportとするのか？（一概にそうとは言えなそう）
Markdownの例
- https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/plugins/MarkdownTransformers.js
- これがそうっぽい？
- 単に組み込むのは簡単だがカスタマイズするのが大変そう・・
- Element作成時に書式をつけるための文字も書き込む
- 書式をつけるための文字が削除されたら書式を元に戻す必要がある（これが面倒そう）
- codeでこれをやるのが面倒そう
- できなくはないが思想が違う気がする
- contenteditableって難しいのかな？
- markdown周りが絶賛開発中みたい・・
資料
- https://lexical.dev/
- https://github.com/facebook/lexical
- https://zenn.dev/stin/articles/getting-started-with-lexical
- 非常によくできた日本語の資料