Mawy

このプロジェクトについて

Mawy は、マークダウンのエディターとビューアーをひとつのライブラリにまとめたもので、React ライブラリと Flutter パッケージとして提供されます。エディターと別に保守されるレンダラーは、いつかどこかで食い違います——表ひとつ、入れ子の箇条書きひとつ、コードブロックひとつで——そのとき、書き手が確かめた文書と読み手が受け取る文書は別のものになります。ここでは両方が同じパーサーと同じレンダラーを使うので、打ち込んだものがそのまま読まれるものです。

エディターは二つのエディターではなく、ひとつの文書に対する二つの見方です。構文に色のついたマークダウンのソースと、組み上がった文書がクリック一つの距離にあり、書式ツールバーのすべてのコマンドにはキーボードショートカットが用意されていて、切り替えても一方で表せなかったものが失われることはありません。色のついた表面の下にあるのは本物の textarea です。だからブラウザーが持つ取り消しの履歴も、入力メソッドの変換も、モバイルのキーボードもそのまま動きます。ビューアーはそれだけで完成した読み手の画面です。書体、文字サイズ、行間、字間、段の幅、明るい配色と暗い配色、見出しの一覧——どれも文書には手を触れません。表示する文書を渡さなければビューアーはファイルの選択画面になるので、.md ファイルを放り込むことが空の状態の使い道です。

導入はパッケージ一つと CSS 一行です。ライブラリが描くものはすべて --mawy-* のカスタムプロパティを通るので、テーマを変えるのは詳細度で規則に勝つことではなく、包む要素にトークンを宣言し直すことです。ダークモードもそのトークンの一つです。外から取ってくるものはありません。書体のメニューは読み手の端末にすでにあるものを示し、同梱された十三の自由ライセンスの書体は、アプリケーションが自分で渡したときにだけ使われます。マークダウンは HTML の文字列ではなく要素になるので、文書と画面のあいだに innerHTML はありません。React パッケージは ESM で、TypeScript の型定義つき、ランタイム依存はツールバーのアイコンのための一つだけです。

機能

• ドキュメントサイトあり

• TypeScript 型定義

• 多言語対応

• テストで検証済み

• クロスプラットフォーム対応

• アクセシビリティ対応

• ダークモード

• ツリーシェイキング対応