CKEditor 5

エディターのモデルとウィジェットを使うプラグイン。

導入

npm run build:integrations を実行し、dist/integrations/ckeditor5/ をアプリケーションにコピーします。ソースとライセンスを含む配布物には npm run package:integrations を使用します。エディター作成前に formulix-ui.min.js を読み込み、index.js を ESM でインポートします。アプリケーションと同じ ckeditor5 を使い、別コピーを追加しないでください。検証・peer dependency は CKEditor 49 です。

既存設定に統合

import Formulix from './formulix/index.js';
const config = {
  plugins: [ /* ... */ Formulix ],
  toolbar: ['formulixFormula', 'formulixConta', 'formulixGrafico', 'formulixQuimica'],
  formulix: {
    servidor: 'https://api.formulix.example',
    chave: 'YOUR_PUBLIC_KEY',
    idioma: 'ja'
  }
};

upload コールバックがなければ FileRepository と既存のアップロードアダプターを使います。独自方式は formulix に upload: async blob => { /* ... */ } を渡し、PNG を送って URL を返します。認証付きアップロードとサーバー側の PNG・サイズ検証を実装してください。

API / 公開キー

運営者から提供された HTTPS API URL とアカウントの公開キーを設定し、管理画面にエディターのドメインを登録します。サブドメインも対象です。https://api.formulix.example と YOUR_PUBLIC_KEY は説明用のプレースホルダーで、実在する接続先やキーではありません。

プレビューと挿入の内容は API に送信されます。ブラウザーにはドメインに紐づく公開キーだけを設定し、管理用・SMTP・Mercado Pago の認証情報は入れないでください。

API · プライバシー — 翻訳草案

保存と制限

4ボタンとダブルクリックで操作し、editor.getData() を保存します。サーバーのサニタイザーで data-formulix ラッパー、MathML、表、data-* を保持します。変更と履歴はモデルのトランザクションを使用します。CKEditor 49 で4種類、保存・再読込、再編集、元に戻す、サニタイズ、読み取り専用を検証済みです。ホストのエディターのライセンスは別途確認してください。アダプターは GPL-3.0-or-later です。

Word の OMML/RTF クリップボード処理は TinyMCE 固有です。Alpha アダプターの同等機能、複数言語の同時使用、Firefox/WebKit、モバイル端末は検証が必要です。