该技能用于创建、重构并统一 React 组件，使其符合项目既有约定。
用途：确定组件应放置的位置（共享/通用组件、页面专属组件、既有组件的子组件、页面组件），并据此建立结构与文件。
主要流程：1）判断放置位置，无法从上下文推断时询问用户；2）创建 kebab-case 文件夹；3）在文件夹内创建与导出组件同名的 PascalCase .tsx 文件；4）如需子组件，在组件内创建 components/ 文件夹并按同样规则处理；5）对照校验清单检查；6）仅对新建或修改文件运行 lint 自动修复，若仍有错误应提示用户手动修复并停止，不得用 eslint-disable、@ts-ignore、@ts-expect-error 等指令压制错误。
自定义 hook 归属：仅共享或刻意跨组件、页面、领域复用的 hook 放在 src/hooks/；仅供某组件内部行为使用的 hook 应与所属组件同置，不得把一次性内部逻辑放入 src/hooks/。
校验清单要点：文件夹名为 kebab-case，文件名为 PascalCase 且与导出组件一致，文件置于独立文件夹中；使用命名导出 export const ComponentName: React.FC<Props>，不使用默认导出，一个文件一个组件；props 用 type Props 定义并按必填、可选、回调排序，使用 React.FC<Props>；子组件放在 components/ 子文件夹；JSX 纯返回体使用隐式返回；条件渲染使用 {condition ? <Element /> : null}，不用 condition && <Element />；types.ts、constants.ts、helpers.ts、index.ts 等辅助文件仅在需要时创建。
适用场景：新增 React 组件、拆分或重构既有组件、统一命名与导出风格。
限制：资料未提供具体安装方式、命令、依赖版本、支持的框架范围、价格与平台信息，暂未提供。