What problem does it solve? Manually writing QA stories that cover every input, state, and visual variant of an Angular component is repetitive and error-prone. This Skill automates the creation of standardized QA stories in the Lucca Front design system, ensuring consistent coverage of component options for development and QA teams. ## Core Features & Use Cases - Interface Contract Analysis: Inspects component source code in packages/ng/<composant>/ to identify inputs, outputs, CSS modifier classes, content slots, and states. - Design Guideline Integration: Optionally incorporates Figma links or documentation to enrich test case labels, add usage rules, and cover accessibility edge cases. - Strict Output Format: Generates exactly two files (<composant>.stories.ts and <composant>.stories.html) following the stories/qa/<composant>/ convention with a 3-column QA table (label, HTML, Angular) and the required <span id="ready"></span> marker for ui-diff tooling. - Use Case: After building a new button component with palette and size modifiers, generate a complete QA story covering Default, variants, palettes, sizes, states, and disabled cases in both HTML and Angular implementations. ## Quick Start Generate a QA story for the button component using its interface contract and the attached design guidelines.
