vuepont/ai-elements-vue

何を解決するか

AIインターフェースの構築には、標準的なUIライブラリには存在しない特殊なUIパターン（例：推論表示、ツール実行の承認、出典の引用）が必要です。AI Elements Vueは、これらのAI駆動型インタラクションに特化した、事前に構築済みでカスタマイズ可能なコンポーネントのセットを提供し、複雑なAIチャットやワークフローインターフェースの構築に必要な作業を削減します。

動作方法

shadcn-vueと統合するCLIツールとして動作します。CLIを実行すると、コンポーネントレジストリを取得し、要求されたコンポーネントをプロジェクトのcomponentsディレクトリに直接インストールします。このアプローチにより、コンポーネントは自らのコードベースの一部となり、スタイリングやロジックの完全な制御が可能になります。Vue.jsまたはNuxt.jsプロジェクトにTailwind CSSとAI SDKがインストールされている必要があります。

対象ユーザー

Vue.jsまたはNuxt.jsを使用してAIアプリケーションを開発し、"バイブコーディング"アーティファクトやチェーン・オブ・シンキング表示などのプロフェッショナルなAI UIパターンを、ゼロから構築せずに実装したい開発者。

特徴

• AI専用コンポーネント: チェーン・オブ・シンキング推論、モデル選択、プロンプト入力、ツール使用の可視化に特化した要素を含む。
• ワークフロー可視化: ノード、エッジ、コントロールを備えたキャンバスベースのコンポーネント群で、AIワークフローグラフを構築可能。
• バイブコーディング対応: アーティファクトや埋め込みWebページのプレビューを表示するためのコンポーネントを提供。
• CLI駆動のインストール: npx経由でライブラリ全体または個別コンポーネントを簡単に追加可能。