What problem does it solve? UI changes often silently break unrelated screens because shared components drift, states go untested, and regressions slip past review. This Skill enforces a five-step discipline so every component, page, or style change is verified visually before it ships. ## Core Features & Use Cases - Reuse-First Discipline: Search for and extend existing components with variants or props instead of creating near-duplicates that drift apart. - Same-Change State Coverage: Every new or changed component state gets a story or capture in the same change, never as a follow-up. - Blast Radius Analysis: Grep importers of shared components to identify every affected screen and confirm each has visual coverage. - Visual Verification & Flake Control: Prove changes with visual diffs and fix flaky captures (clocks, live data, animations) at the source instead of accepting them. - Use Case: Before editing a shared Button component, run these five moves to extend it with a variant, add stories for all states, check every importing screen, and confirm the visual diff only shows intended changes. ## Quick Start Ask the agent to read the making-ui-changes guidance before modifying any component, page, or stylesheet in the project.
