building-components

Build accessible UI components by splitting them into Root, Item, Trigger, and Content subcomponents for flexible assembly. This approach enforces semantic HTML, ARIA roles, keyboard navigation, and focus management by default across React projects.

Structure your design system using a composable architecture that separates UI elements into subcomponents. Include a references directory with Markdown files to document core patterns, design tokens, and styling guidance for consistent component distribution.

Document UI component patterns and design tokens by creating a references directory with Markdown guidance files. These files organize tooling, styling guidance, and publishing workflows to promote design-system alignment across your team.

Yes, this approach supports publishing workflows and maintaining frontend UI libraries. It provides documentation support for design tokens and styling, making it useful for creating, documenting, and distributing components across React projects.

No specific dependencies are required to begin. You start by creating a SKILL.md file with frontmatter and adding Markdown guidance files in a references directory to organize your tooling and component architecture.