mcpField
W
w-shadcn

w-shadcn

github.com/blockmatic-iceboxデザイン・UI1647 回インストール4 週間前に更新
リポジトリ

w-shadcn について

w-shadcnは、共有UIパッケージにshadcnプリミティブを追加または拡張するワークフロースキルです。コンポーネントのインポートと構成方法を示し、画面単位の変更は`/w-ui`に案内します。

主な機能

  1. 01shadcnプリミティブの追加・拡張
  2. 02共有UIパッケージの利用
  3. 03コンポーネントのインポート規約に準拠
  4. 04renderとdata属性による構成
  5. 05変更ファイルへのlint実行

活用シーン

  1. 01プロジェクトへのshadcnプリミティブ追加
  2. 02既存の共有UIコンポーネントの拡張
  3. 03コンポーネント追加後の画面調整

MCP 対応

バリアントが不明な場合、またはインストールエラー時に限り、shadcn MCPを使用します。

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/blockmatic-icebox/basilic-skills --skill w-shadcn

インストール後、Claude Code で/w-shadcnを入力して読み込まれたか確認します。

詳細

shadcn のプリミティブをインストールまたは拡張します。画面の再構成は /w-ui で行います。shadcn-v3 に従ってください。

  1. バリアントが不明な場合、またはインストールエラーが発生した場合に限り、shadcn MCP を使用します。
  2. components.json で指定された共有 UI パッケージにインストールします(Basilic の例:packages/w-ui/src/components/)。
  3. @repo/w-ui/components/* と、そのパッケージの cn をインポートします。まれなプリミティブでは @repo/w-ui/base を使用します(@base-ui/react、@radix-ui/*、削除済みの @repo/w-ui/radix は使用しません)。components.json の "style": "base-vega" を維持します。render と data-slot / data-open を使って組み立てます(asChild / data-state は使用しません)。
  4. プリミティブを追加した後、対象がコンポーネントだけでなく画面全体の場合は、/w-ui で画面を再構成します。変更したファイルに対して lint を実行します。
  5. 動作またはコマンドを変更した場合は、ドキュメントに /w-docs を使用します。

コメント