shadcn-detection

プロジェクトが 3 つの shadcn/ui コンポーネントベース（Base UI（`base`、2026 年 7 月以降の新規プロジェクトのデフォルト）、Radix（`radix`、完全サポート）、React Aria（`aria`、2026 年 7 月に追加））のどれを使用しているかを検出します。まず信頼できるシグナル（`shadcn info --json` -> `config.base`）を使用し、次に 5 つのシグナルによる重み付きスキャンを実行します。対象は package.json の依存関係、components.json の style プレフィックス、ソースの import パターン、data 属性の慣習（`data-state` 対 `data-open` 対 `data-entering`）、およびロックファイルから検出したパッケージマネージャーです。

Base UI / Radix / React Aria / Mixed（マイグレーションが必要）/ None（新規セットアップ）の判定を生成し、これが下流のすべての shadcn コンポーネントまたはマイグレーションタスクのゲートとなります。

shadcn の検出

エージェントワークフロー（必須）

検出の前に、エージェントを並列で起動します。それぞれ name を指定した Agent 呼び出しを 1 回ずつ行います:

1. fuse-ai-pilot:explore-codebase - プロジェクト構造をスキャン
2. fuse-ai-pilot:research-expert - 最新のプリミティブパターンを検証

その後: 結果を使用してコンポーネントワークフローを構成します。

---

概要

機能	説明
CLI プローブ（信頼できる）	{runner} shadcn@latest info --json -> .config.base = base | radix | aria（加えて .config.style、.components、.links）
パッケージスキャン	@base-ui/react、radix-ui / @radix-ui/*、react-aria-components を検出
設定チェック	components.json の style プレフィックス（base-*、radix-*/new-york、aria-*）を分析
Import 分析	ソースをスキャンして import パターンを確認
属性スキャン	data-state=（Radix）対 data-open（Base UI）対 data-entering/data-placement（React Aria）
パッケージマネージャー	ロックファイルから bun/npm/pnpm/yarn を検出

ベース	パッケージ	Style プレフィックス	コンポジション	ドキュメント
Base UI（デフォルト）	@base-ui/react	base-*	render プロップ	/docs/components/base/<name>
Radix	radix-ui（レガシー @radix-ui/react-*）	radix-*、レガシー new-york	asChild	/docs/components/radix/<name>
React Aria	react-aria-components	aria-*	トリガーラッパー（DialogTrigger > Button + Dialog）、slot、onPress	/docs/components/aria/<name>

既知のベース横断的な依存関係（混在プロジェクトではありません）: radix-* Combobox は @base-ui/react をインポートします（Radix には Combobox がありません）。Questionnaire と MessageScroller はすべてのベースで @shadcn/react をインポートします。現在のすべてのコンポーネントは cn パッケージから cn をインポートします。

---

重要なルール

1. コンポーネント作業の前に必ず検出を実行する
2. 最大限の精度のために5 つのシグナルすべてを確認する
3. 混在状態をマイグレーションケースとして扱う。決して無視しない
4. セッション中は結果をキャッシュする。再検出は不要
5. ロックファイルの優先順位に従ってパッケージマネージャーを検出する

---

アーキテクチャ

project/
├── package.json            # Step 1: deps scan
├── components.json         # Step 2: style field
├── bun.lock|bun.lockb|pnpm-lock.yaml|yarn.lock|package-lock.json  # Step 5: PM
└── src/|components/|app/   # Step 3-4: imports + attrs

→ 完全な例については detection-script.md を参照してください

---

5 ステップの検出アルゴリズム

ステップ 0: components.json が存在する場合、{runner} shadcn@latest info --json がベースを直接返します。以下の重み付きスキャンはそれを確認し、混在プロジェクトを検出します。

ステップ	シグナル	重み
1	package.json の依存関係（@base-ui/react、radix-ui / @radix-ui/*、react-aria-components）	40%
2	components.json の style プレフィックス（base-*、radix-*/new-york、aria-*）	20%
3	ソースファイル内の import パターン	25%
4	Data 属性（data-state= / data-open / data-entering）	15%
5	パッケージマネージャー（ロックファイル → bunx/npx/pnpm dlx/yarn dlx）	-

---

判断テーブル

各ベースはそれぞれ独自のスコア（0〜100）を持ちます。

スコア	結果	アクション
Base UI のみ >50	Base UI	Base UI パターン（render）を使用
Radix のみ >50	Radix	Radix パターン（asChild）を使用
React Aria のみ >50	React Aria	React Aria パターン（トリガーラッパー、onPress）を使用
2 つ以上が >0（上記の既知のベース間依存を割り引いた後）	Mixed	移行が必要
すべて 0	None	新規セットアップ: init はデフォルトで Base UI になります。-b radix または -b aria を渡して選択します

---

ベストプラクティス

すべきこと

• コンポーネントの作業の前に検出を実行する
• 精度のために 5 つのシグナルすべてを確認する
• 「mixed」状態は移行ケースとして扱う

すべきでないこと

• 確認せずに Radix（または新しいデフォルトである Base UI）を前提とする
• components.json の分析を省略する
• data 属性のシグナルを無視する
• Radix スタイルの Combobox からの @base-ui/react を mixed プロジェクトとしてカウントする

---

リファレンスガイド

概念

トピック	リファレンス	参照すべきタイミング
Radix パターン	radix-patterns.md	Radix UI のシグナルを特定するとき
Base UI パターン	baseui-patterns.md	Base UI のシグナルを特定するとき
アルゴリズム	detection-algorithm.md	スコアリングロジックや React Aria のシグナルを理解するとき

テンプレート

テンプレート	使用するタイミング
detection-script.md	プロジェクトで検出を実行するとき