祝！KuroEditor v1.0.0 到達と「レイアウトの多様性」 vol.3
ついにKuroEditorがv1.0.0の節目に到達。単なるバグ修正に留まらず、フローティングボックス「RoundBox」の追加やテーブル機能の深化など、実用的な進化を遂げた内容を解説します。
「とりあえず動く」から「正式版」への大きな飛躍
KuroEditorの開発が始まってから早数ヶ月。vol.1で「作るしかなかった」と嘆き、vol.2でその仕組みと初版を公開して後に引けない状態になってきましたが、ついにバージョン番号が「1.0.0」の大台に乗りました。これまで0.3.x台で200回以上にも及ぶ細かく積み上げてきた改善が、一つの完成形として結実した形です。
今回のメジャーアップデートでは、ライブラリ依存ゼロ・Vanilla JSという柔軟な設計思想を維持しつつ、ブログ執筆の表現力を劇的に高める「構造的な新機能」を投入しました。もはや単なるテキストエディタではなく、簡易的なレイアウトツールとしての側面も持ち始めています。
v1.0.0の目玉機能：フローティングボックス「RoundBox」
v1.0.0最大の追加機能は、自由な配置が可能な「角丸ボックス（kuro-roundbox）」です。これまでのWYSIWYGエディタでは難しかった、「文章の横に補足情報を置く」「画像とテキストを並べて配置する」といったレイアウトが、ボタン一つで実現できるようになりました。
ただの箱ではありません。幅の指定はもちろん、左・右へのフローティング（回り込み） 設定、さらにはボックスの中にさらに装飾を施すといったネスト構造にも対応しています。技術的には、カーソル位置やポップアップメニューがボックスと重ならないよう、自動的に回避位置を計算するロジックを組み込んでおり、複雑なレイアウトでもストレスなく執筆に集中できるようになっています。
テーブル機能の深化：CSVペーストと操作性の向上
vol.2でも「重点ポイント」として紹介したテーブル機能ですが、v1.0.0でさらに大きな進化を遂げました。特に要望（というか自分が必要だったもの）として大きかったのが、外部データの取り込みです。
新機能 | 詳細とメリット |
CSV/TSV ペ ースト | Excelやスプレッドシートからコピーしたデータを、そのままテーブルとして展開。 |
縦方向の整列 | セル内の文字を「上・中央・下」の好きな位置に配置可能に。 |
ワンクリック削除 | テーブル全体の削除ボタンを新設。操作ミスを減らすUI改善。 |
文字数カウント | エディタ下部にリアルタイム の文字数ラベルを表示。地味に便利。 |
※Dopbox Paper からのコピペにも対応w
こだわりのUI：メニューの衝突回避ロジック
機能が増えると、どうしてもUIが煩雑になりがちです。しかしKuroEditorは「執筆を邪魔しない」 ことが至上命題。今回、各種フローティングメニュー（ポップアップメニュー、メインメニュー、カーソルなど）が互いに重ならないよう、表示位置を動的に計算する「重なり回避」を刷新しました。
例えば、テーブルのすぐ下にRoundBoxがあるような狭い領域でも、メニューが最適な場所に「シュッと」現れます。この「当たり前の挙動を当たり前に実現する」ために、地味ながら数千行のロジックを見直しました。フレームワークを使わないからこそできる、ミリ単位のこだわりです。
これからのKuroEditor
v1.0.0で本来のKuroEditorとしての基盤はでき上がりました。今後はバグ修正が中心になるとは思いますが、コード量の削減もこつこつ進めていく予定です。今後も根底にある「Vanilla JSで爆速、依存ゼロでどこでも動く」という思想が揺らぐことはありません。
KuroCMSと共に進化し続けるKuroEditor。今回のアップデートで、単一ファイルのライブラリとしては最高峰の機能性を手に入れたと自負しています。興味のある方は、ぜひGithubを覗くか、当サイトのサンプルページでその「サクサク動く」操作感を体験してみてください。
【出典】