frontend-refactor-surgeonlisted
Install: claude install-skill ytvee-dev/webdev-agent-kit
# Frontend Refactor Surgeon
## Purpose
Refactor frontend code while preserving behavior, rendered output, and public contracts unless the user explicitly approves a behavior change.
Refactor verification may use a bounded loop for related failures, but the refactor must not expand into feature work or broad rewrite.
## When To Use
Use this skill when the user asks to simplify or reorganize frontend code, extract components, hooks, utilities, or styles, tighten TypeScript types, remove duplication within a clear frontend boundary, decompose mixed-responsibility components, or prepare code for a future change without adding the feature yet.
## When Not To Use
Do not use this skill for bugfix-first debugging, new feature implementation, design/spec work, visual QA only, broad rewrites without a boundary, backend refactors, package installation, or testing workflow creation.
Use `frontend-bugfix-debugger` when the primary goal is to fix a defect.
## Required Context
1. Read `AGENTS.md`.
2. Read `common/prompt-intent-routing-rules.md` when workflow level is unclear.
3. Read `common/refactor-safety-rules.md`.
4. Read `common/approved-patterns.md` for component decomposition rules.
5. Read `common/anti-patterns.md` and relevant anti-pattern templates when the refactor touches components.
6. Read `common/verification-loop-rules.md` and `common/bounded-retry-rules.md` when verification repair is in scope.
7. Read `common/typescript-discipline.md`.
8. Read relevant boundary d