Skills
.Work. You
Rest

component-triad

Community

Automate component triad: implement, test, story.

Software Engineering#automation#testing#react#component#storybook#triad
Authorhdkz-dev
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This skill enforces the project-wide Strict Rule by ensuring that for every component the three essential artifacts—implementation, tests, and Storybook stories—are developed and kept in sync, reducing drift and missed coverage.

Core Features & Use Cases

  • Triad Generation: when creating a new component, ensure the three artifacts exist: a TypeScript/TSX implementation file, a corresponding test file under tests (e.g., Component.test.tsx), and a Storybook story file (e.g., Component.stories.tsx). When modifying a component, verify that related tests and stories are present and up to date.
  • Triad Verification: propose and enable running targeted commands to execute tests for the specific component and validate the presence and consistency of its triad artifacts.
  • Missing Triad Check: scan the repository to surface components missing one or more triad artifacts and surface remediation tasks.

Quick Start

Create a new component and let the Triad system generate the implementation, tests, and Storybook artifacts.

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-triad
Download link: https://github.com/hdkz-dev/multi-game-engines/archive/main.zip#component-triad

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 223,000+ vetted skills library on demand.