What problem does it solve? Porting a UI component from BaseUI and shadcn/ui into a Blazor component library involves many error-prone steps: researching headless anatomy, translating Radix data attributes, writing CLI templates, regenerating compiled components, rebuilding Tailwind CSS, and visually verifying the result. This Skill orchestrates that entire workflow end to end. ## Core Features & Use Cases - Headless anatomy research: Fetches BaseUI documentation to extract sub-component parts, state attributes, keyboard behavior, and ARIA roles. - Styled template creation: Pulls exact Tailwind class strings from shadcn/ui v4 source and translates Radix attribute selectors (e.g. data-[state=open]) into BlazeUI equivalents (data-[open]). - Build and verification loop: Regenerates compiled components from CLI templates, rebuilds Tailwind v4 CSS, restarts the demo app, and screenshots the result with playwright-cli for visual comparison. - Use Case: Ask to "port the Accordion component" and the Skill researches BaseUI anatomy, creates Accordion.razor templates, adds a demo page, compiles CSS, and iterates on screenshots until the component matches shadcn's appearance. ## Quick Start Ask the assistant to port the Dialog component from BaseUI and shadcn/ui into BlazeUI and verify it visually in the demo app.
