shadcn/ui
shadcn/ui 是一套面向 React 项目的组件代码与使用方式：你把需要的组件加入自己的项目，再按需求修改。它解决了从零实现常见界面控件费时、而现成组件库又不够好改的问题。
你可能会说：「帮我做一套能直接改源码的表单和弹窗，别把样式和交互都锁在组件库里。」
动手看看工作区设置的保存按钮
切换右侧按钮的版本，再悬停、按住或用 Tab 聚焦。shadcn/ui 把组件代码加入你的 React 项目，之后可以直接改，不必从零写起。
本地版换成品牌蓝，适合突出保存这类主要操作。实际项目通常修改组件的样式或变体定义，让使用它的地方保持一致。
要点用 shadcn/ui 做界面，代码会放在哪里？
- 1
组件代码进入你的项目
你选用一个组件后，相关代码会放进项目里，而不是只能从依赖包中调用。比如后台的按钮需要加上业务特有的加载状态，你可以直接修改本地组件，并检查它会影响哪些页面。
- 2
现成结构仍需要你来组装
它提供按钮、输入框、弹窗等常见组件的起点，但不会替你决定页面流程。做一个邀请成员的表单时，我们仍要定义字段、校验规则，以及提交成功或失败后显示什么。
- 3
可修改也意味着自己维护
组件代码归项目所有，所以改样式、改行为都方便；代价是后续调整和升级也要由你处理。让 AI Agent 修改组件前，可以先请它找出哪些页面共用这份代码，免得一次改动波及别处。
容易混淆的地方
它和传统组件库的关键区别是代码归属：传统组件库通常由你安装依赖并调用它提供的组件；shadcn/ui 更强调把选中的组件代码放进你的项目，由你继续修改。它也不是 Tailwind CSS 的别名：Tailwind CSS 提供样式工具，shadcn/ui 提供可用于搭建界面的组件代码，两者解决的问题不同。
什么时候用
适合用
- 做 React 后台时，表格筛选、表单和弹窗较多，想快速搭出统一界面，同时保留修改组件源码的空间。
- 让 AI Agent 开发产品原型时，希望它从现成组件起步，并能按品牌样式调整按钮、输入框等控件。
- 现有 React 项目需要逐步补齐常见控件，不想为了几个组件整体更换当前的页面结构。
不适合用
- 项目使用 Vue，且不打算引入 React；选择适配 Vue 技术栈的组件方案更直接。
- 只是做一张静态活动海报页，没有复杂交互或可复用控件；直接写页面结构和 CSS 更省事。
- 团队要求所有页面统一跟随组件依赖包升级，不想维护项目内的组件副本；集中维护的组件库更合适。
练一练选一个答案，看看解释
你让 AI Agent 给一个 React 后台加「邀请成员」弹窗。它建议使用 shadcn/ui，哪种理解最能帮助你判断后续工作量？
让 AI 帮你做复制给 AI Agent 直接用
这是一个 React 项目。请用 shadcn/ui 为邀请成员功能搭建表单和弹窗，先检查项目已有的组件与样式约定，复用能用的部分；实现字段校验、提交中及失败状态，并说明新增或修改了哪些本地组件，不要假设组件已经包含业务接口。