sparklabx/drawio-ai-kit

drawio‑ai‑kit – AI 駆動、検証済みの draw.io 図生成

概要

• 自己完結型 CLI（drawio‑ai）と、LLM エージェント（Claude、Gemini など）が手動で座標を調整せずに draw.io でクラウドアーキテクチャ図を構築できるようにする スキル。
• このキットは、図で使用されるすべてのステンシル ID が draw.io の AWS/Azure/GCP ライブラリに実際に存在し、レイアウトが一連のコード化された設計原則に従うことを保証します。

主要コンポーネント

コンポーネント	役割
宣言的カタログ	すべての draw.io ステンシル ID（mxgraph.aws4.*、Azure、GCP など）をその分類、標準カラーパレット、接続ポイントにマッピングする単一の JSON ベースのソース。
設計原則	アーキテクチャと視覚的なルール（ノードの重なり禁止、固定アスペクト比、色の一貫性など）をエンコードするマークダウンファイル（principles.md）。
構造バリデータ	生成された draw.io XML を解析し、ステンシルの有効性をチェックし、原則を強制し、ファイルが保存される前に違反を報告する静的解析エンジン。
CLI（drawio‑ai）	単一の Bun 圧縮ファイル（dist/cli.mjs）としてバンドルされています。アイコンの検索、PNG のレンダリング、XML の検証、美学の監査、スキルのインストールのためのコマンドを提供します。
スキル（skills/drawio/）	LLM が呼び出すことができる小さな命令セット：ユーザーに何を描くかを尋ね、適切なドメイン参照（AWS、Azure、GCP、Databricks、BPMN）をロードし、ビルド‑検証‑レンダーループを実行し、完成した .drawio ファイルを返します。

AI エージェントの仕組み

1. エージェントは自然言語リクエストを発行します（例：「AWS 3 層 Web アプリを描いて」）。
2. drawio‑ai skill はエージェントに不足している詳細（クラウドプロバイダー、トポロジータイプ）を促します。
3. エージェントはキットの TypeScript API（Diagram、group、icon、renderTree など）を使用して短いスクリプトを書きます。
4. drawio‑ai run <script> がスクリプトを実行し、レイアウトエンジンが座標を自動計算し、図 XML が生成されます。
5. drawio‑ai validate が XML をリントします。幻覚ステンシル ID はすべて検出されます。
6. オプションで drawio‑ai render が XML を PNG に変換し、視覚ベースの自己チェックを行います。
7. 最終的な .drawio ファイルがユーザーに返されます。

インストールと使用法

• ランタイム依存関係ゼロ – Node ≥ 20.6 または Bun 1.4+ のみ。インストーラー（install.sh）は単一のバイナリ（drawio‑ai）を ~/.local/bin に配置し、スキルを登録します。
• ワンライナー：curl …/install.sh | sh（または手動で npm i -g drawio‑ai-kit && drawio‑ai skill install）。
• プログラム的使用：import { Diagram, group, icon, renderTree } from "drawio‑ai-kit"; – ライブラリには完全な TypeScript 型定義が付属しています。
• 安全性：インストール後スクリプトなし、隠れたテレメトリなし、バンドルされた dist/ は読み取り可能なソースの再現可能なビルドです。

構築できるもの

• クラウドランディングゾーン（AWS Control Tower、Azure CAF、GCP Shared VPC）。
• ネットワークトポロジ（VPC、サブネット、ルートテーブル、EKS クラスターなど）。
• マルチクラウドまたはハイブリッド図（オンプレミス ↔ AWS ↔ Azure）。
• Databricks lakehouse、MLOps パイプライン、BPMN プロセスフロー。
  すべての例は examples/ にあり、drawio‑ai scaffold でスキャフォールドできます。

重要性

• 幻覚の削減：AI エージェントはステンシル ID を発明することがよくあります。バリデータは図が保存される前にこれらを検出します。
• 一貫した視覚スタイル：公式アイコンのカタログと色/サイズパレットを強制することで、図はプロフェッショナルに見え、すぐに認識できます。
• モデルフレンドリー：スキルのステップは小さく決定的で、安価な LLM（Claude Haiku）でもパイプライン全体を駆動できます。

結論 drawio‑ai-kit は、大規模言語モデルと正確で標準準拠の draw.io 図の間の実用的な橋渡しであり、開発者向けの CLI と LLM エージェントが自動的に呼び出せるスキルの両方を提供します。