使用方法
- 复制安装命令，在自己的智能体环境安装前先检查源码包。
- 从原始文档核对所需工具、凭据和支持的宿主。
- 说明输入材料与期望交付物，并对照来源检查输出。
npx skills add https://github.com/vercel/components.build --skill building-components开始前需了解
- 安装不包含模型订阅、API 额度或访问文件的权限。
- 仓库星数和安装量反映活跃情况，不等于独立质量或安全测试。
仓库原始内容
按源仓库内容呈现，保留标题、案例、代码、表格、链接以及原文引用的演示图片。
Building Components
When to use this skill
Use when the user is:
- 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
References
- 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 component patterns
- as-child.mdx - The as-child pattern for element polymorphism
- polymorphism.mdx - Polymorphic component patterns
- types.mdx - TypeScript typing patterns for components
- state.mdx - Controlled vs uncontrolled state management
- data-attributes.mdx - Using data attributes for styling and state
- design-tokens.mdx - Design token systems and theming
- styling.mdx - Component styling approaches
- registry.mdx - shadcn-style registry distribution
- npm.mdx - Publishing components to npm
- marketplaces.mdx - Component marketplace distribution
- docs.mdx - Writing component documentation
