本文へ移動

§09-07Forms

リッチテキストエディタ (block)

ブロック単位で編集し「/」でブロックを挿入する。

見出しや画像などを段落単位で組み合わせ、書式を意識せずに文書を組める。ノートや記事の執筆で、キーボードから手を離さずに要素を足したいときに向く。

実装のポイント

contentEditable を直接扱うと選択範囲と IME の扱いが難しいため、ドキュメントモデルを持つエディタ基盤に任せる。「/」メニューはキャレット位置に出す。

特徴
  • キーボード操作
デモで使っているもの
  • lucide-react

このパターンが効く目的