Skills
.Work. You
Rest

component-craft

Community

Build reusable UI components with consistent APIs

Software Engineering#accessibility#cva#variants#component-api#ui-component#render-as-child#forward-ref
Authorolzn
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Enables teams to build and maintain reusable UI components with consistent APIs and complete state coverage, reducing API drift and improving cross-project maintainability.

Core Features & Use Cases

  • Establishes consistent prop conventions, variant systems (CVA), and render delegation patterns (asChild) for scalable component APIs.
  • Guides forwardRef usage, icon system conventions, and API reviews to ensure accessibility and composability across React components.
  • Applies to tasks such as creating a new component, defining its props and variants, deciding between configuration and composition, implementing compound patterns, and evaluating API consistency.

Quick Start

Define a new component's API and variants following the component-craft guidelines, ensuring forwardRef, render delegation, and solid state coverage.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: component-craft
Download link: https://github.com/olzn/system-craft/archive/main.zip#component-craft

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.