用途：在 React 项目中依据参考站点或手动的 21st.dev 组件交接来搭建页面。技能提供两条流程：自动模式（用户给参考站点 URL，代理检查并推断所需分区，自动选择匹配的 21st.dev 组件并集成）和手动模式（用户自行浏览 21st.dev，代理列出分区并告知需获取内容，再集成交接）。
主要能力：分区检测与页面结构建模；将分区映射到 21st.dev 分类；解析组件页为标准化元数据，获取 CDN 原始源码；按仓库现有 Tailwind、TypeScript、shadcn 约定进行适配与依赖安装；半自动时生成手动交接清单。
使用方式：仅用于 React 系项目，否则停止。解析组件必须走标准流程：先取 21st.dev 社区组件页 URL，再运行 node scripts/resolve-21st-component.mjs --url "<21st-component-url>" --json，读取 codeUrl 与 demoCodeUrl，然后用 node scripts/fetch-21st-source.mjs --url "<code-url>" --url "<demo-code-url>" --out-dir tmp/21st 获取源码。禁止用字符串拼接或改写社区页 URL 推导 CDN 地址。手动清单可用 node scripts/build-manual-handoff-template.mjs --sections "header,hero,features,pricing,footer" --out 21st-handoff.md 生成。
适用场景：想把参考站点结构用 21st.dev 组件复刻为 React 站点或应用分区；需要代理自动选组件并整合进现有仓库。
限制：v1 仅支持 React 项目；引用站点被封锁或抓取脆弱时自动模式会转为手动模式；解析成功但环境无法抓取 CDN 源码时，需用户粘贴 Copy Code 内容、提供已下载源码或允许换用可抓取环境；若某分区无法干净匹配，其余仍会集成并显式标注该分区。具体收费与平台信息暂未提供。