H
headless-VPLエディタを最新APIから素早く構築
by headless-vpl
headless-vpl の最新ソースコードを参照しながら、新しいエディタ・デモ・サンプルコードを生成できます。 バニラ TypeScript、React、ブロック型エディタなど、用途別のテンプレートから素早く実装をスタートできます。 README やドキュメント用の短いコード例を、現在の API 仕様に合わせて自動生成できます。 古い API 知識に頼らず、常に src/lib/headless-vpl/index.ts の export 一覧と実装例から正確なコードを導き出します。 headless-vpl を使った新しいエディタ機能を開発したい開発者 デモや サンプルコードを素早く用意する必要があるドキュメント作成者 ブロック型エディタやフロー型エディタなど、特定の UI パターンを実装したい人 API の詳細を毎回確認するのではなく、テンプレートから実装を進めたい開発チーム 本スキルは、headless-vpl コードベースの最新 export と実装パターンに基づき、新規コード生成を支援します。実装対象を「バニラ TS 最小例」「React demo」「ブロック型エディタ」「ドキュメント用スニペット」に分類し、references/patterns.md から基準ファイルを選択します。近い実装をコピーするのではなく、必要機能のみを残して最小構成に組み直します。バニラ TS では Workspace + SvgRenderer + InteractionManager を基本骨格とし、getMouseState・animate を未 export ヘルパーから直接 import します。InteractionManager は handlePointerDown()・handlePointerUp()・tick() パターンに従います。React では useWorkspace に寄せて独自初期化を最小化します。NestingZone・createSlotZone はブロックエディタの専用挿入点用です。ドキュメント例では個人環境の絶対パスを避けます。
ドキュメント