AI 連携
コーディングアシスタントが、実在するコンポーネント、明確な API、一貫したデザインシステムを使えるようにします。初回リリースは、開発時の統合とインターフェースの構築を対象にしています。
Skill をインストール
npx skills add YunYouJun/augma --skill augmaリポジトリの Skill は、Codex や Claude など、Agent Skills に対応したコーディングアシスタントで使えます。次のプロンプトはそのまま使えます：
$augma を使って、この Vue プロジェクトにデバイスのコントロールパネルを作成してください。
公開コンポーネントとセマンティックトークンを使い、既存のブランドとアクセシブルな振る舞いを保ってください。
先にコンポーネント API を確認してから、状態の切り替えとインタラクティブなサンプルを実装してください。新しいバージョンの Skill と Registry は、このリポジトリのリリース後に公開 URL から取得できるようになります。ローカル開発では skills/augma/SKILL.md を直接読み込み、ローカルプレビューのリソース URL を使ってください。
機械可読なエントリー
- llms.txt：簡潔なドキュメントの索引。
- llms-full.txt：Markdown ドキュメント一式（簡体字中国語）。
- components.json：バージョン、インポート、API、サンプル、Registry の URL を含むコンポーネントの契約（説明は簡体字中国語）。
- プレーンテキストのガイド：コーディングアシスタントが直接読み込めます。
すべてのエントリーは、同じソース、サンプル、メタデータから生成されます。components.json は schemaVersion: 1 を使っているため、利用側はバージョンを確認してください。
コンポーネント Registry
shadcn-vue を初期化済みの Vue プロジェクトで、次を実行します：
pnpm dlx [email protected] add https://augma.yyj.moe/r/button.json
pnpm dlx [email protected] add https://augma.yyj.moe/r/dialog.json最初のバッチは Button、Input、Panel、Dialog、HudStatus、HudProgress に対応しています。Registry は npm のコンポーネントと同じソースファイルをコピーし、スタイルと振る舞いの依存関係も宣言します。
アプリのエントリーで読み込みます：
import '@augma/core/style.css'コピーした Vue ファイルは自由に変更できます。Registry 自体は、Augma のスタイルを描画するのに Tailwind を必要としません。ホストプロジェクトに対する CLI の初期化要件は shadcn-vue に従います。
AI が生成したインターフェースを確認する
実際のインポートと Props が存在するかを確かめ、型チェックとビルドを実行し、キーボードでメインの操作を一通り試し、狭い画面と動きを減らす設定も確認します。次のタスクでコーディングアシスタントを試せます：
- Select、Switch、Slider を含むコントロールパネルを作る。
- 正常、待機、エラーの状態を同時に表示する HUD を作る。
- トークンでアクセントカラーを変え、フォーカスと文字のコントラストを保つ。
ショーケース には、この 3 種類のタスクの動作するリファレンスがあり、各サンプルのソースは展開してコピーできます。プレーンテキストのソースファイル：
Skill はデザインと統合の知識を提供します。サイト内のチャットやリアルタイムの UI 生成は、今後の別の機能です。