mirror of
https://github.com/catlog22/Claude-Code-Workflow.git
synced 2026-02-10 02:24:35 +08:00
854464b221
主要变更： - 模板重命名：采用优先级前缀（01-通用, 02-专用, 03-领域特定） - 目录调整：bug-diagnosis从development移至analysis - 引用更新：5个命令文件中21处模板引用更新为新路径 - 路径统一：所有引用统一使用完整路径格式 模板变更详情： - analysis/：8个模板（01-trace-code-execution, 01-diagnose-bug-root-cause等） - development/：5个模板（02-implement-feature, 02-refactor-codebase等） - planning/：5个模板（01-plan-architecture-design, 02-breakdown-task-steps等） - memory/：1个模板（02-document-module-structure） 命令文件更新： - cli/mode/bug-diagnosis.md（6处引用） - cli/mode/code-analysis.md（6处引用） - cli/mode/plan.md（6处引用） - task/execute.md（1处引用） - workflow/tools/test-task-generate.md（2处引用） 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
56 lines
2.1 KiB
Plaintext
56 lines
2.1 KiB
Plaintext
Create a reusable component following project conventions and best practices.
|
|
|
|
## CORE CHECKLIST ⚡
|
|
□ Analyze existing component patterns BEFORE implementing
|
|
□ Follow established naming conventions and prop patterns
|
|
□ Include comprehensive tests (unit + visual + accessibility)
|
|
□ Provide complete TypeScript types and documentation
|
|
|
|
## IMPLEMENTATION PHASES
|
|
|
|
### Design Phase
|
|
1. Analyze existing component patterns and structures
|
|
2. Identify reusable design principles and styling approaches
|
|
3. Review component hierarchy and prop patterns
|
|
4. Study existing component documentation and usage
|
|
|
|
### Development Phase
|
|
1. Create component with proper TypeScript interfaces
|
|
2. Implement following established naming conventions
|
|
3. Add appropriate default props and validation
|
|
4. Include comprehensive prop documentation
|
|
|
|
### Styling Phase
|
|
1. Follow existing styling methodology (CSS modules, styled-components, etc.)
|
|
2. Ensure responsive design principles
|
|
3. Add proper theming support if applicable
|
|
4. Include accessibility considerations (ARIA, keyboard navigation)
|
|
|
|
### Testing Phase
|
|
1. Write component tests covering all props and states
|
|
2. Test accessibility compliance
|
|
3. Add visual regression tests if applicable
|
|
4. Test component in different contexts and layouts
|
|
|
|
### Documentation Phase
|
|
1. Create usage examples and code snippets
|
|
2. Document all props and their purposes
|
|
3. Include accessibility guidelines
|
|
4. Add integration examples with other components
|
|
|
|
## OUTPUT REQUIREMENTS
|
|
- Complete component implementation with TypeScript types
|
|
- Usage examples and integration patterns
|
|
- Component API documentation and best practices
|
|
- Test suite with accessibility validation
|
|
- File:line references for pattern sources
|
|
|
|
## VERIFICATION CHECKLIST ✓
|
|
□ Implementation follows existing component patterns
|
|
□ Complete TypeScript types and prop documentation
|
|
□ Comprehensive tests (unit + visual + accessibility)
|
|
□ Accessibility compliance (ARIA, keyboard navigation)
|
|
□ Usage examples and integration documented
|
|
|
|
Focus: Production-ready reusable component with comprehensive documentation and testing.
|