building-components

Comprehensive guide for building modern, accessible, and composable UI components. Use when the user is: - Covers component taxonomy (primitives, components, blocks, templates), core design principles, and accessibility implementation including ARIA, keyboard navigation, and WCAG compliance - Includes patterns for composable APIs, polymorphism, controlled/uncontrolled state, and the as-child pattern for flexible element composition - Provides guidance on design tokens, theming systems, styling approaches, and using data attributes for state and styling - Addresses publishing workflows: npm distribution, shadcn-style registries, component marketplaces, and documentation best practices - Building new UI components (primitives, components, blocks, templates) - Implementing accessibility features (ARIA, keyboard navigation, focus management) - Creating composable component APIs (slots, render props, controlled/uncontrolled state) - Setting up design tokens and theming systems - Publishing components to npm or a registry - Writing component documentation - Implementing polymorphism or as-child patterns - Working with data attributes for styling/state - definitions.mdx - Artifact taxonomy (primitives, components, blocks, templates) - principles.mdx - Core principles for component design - accessibility.mdx - ARIA, keyboard navigation, WCAG compliance - composition.mdx - Composable...