component-api-validator

Audit component APIs for consistency, breaking changes, and contract compliance.

155|7|Updated Mar 9, 2026
One-click install
npx skills add https://github.com/murphytrueman/design-system-ops --skill component-api-validator
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: component-api-validator
Source: https://github.com/murphytrueman/design-system-ops/tree/main/skills/component-api-validator
Command: npx skills add https://github.com/murphytrueman/design-system-ops --skill component-api-validator

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses inconsistencies and potential breaking changes in a component library's public API, ensuring a stable and predictable contract for consumers.

Core Features & Use Cases

  • API Auditing: Analyzes prop naming, type coverage, default values, and composition patterns across components.
  • Breaking Change Detection: Identifies regressions and backward-incompatible changes between versions.
  • Design-to-Code Alignment: Verifies that the component API accurately reflects design specifications.
  • Use Case: Before releasing a new version of your design system, use this Skill to automatically audit all component APIs for consistency and flag any potential breaking changes that could impact consuming applications.

Quick Start

Run a component API audit on the codebase located at src/components.

Frequently Asked Questions about component-api-validator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit component APIs for breaking changes in a TypeScript design system?

You can validate design-to-code contracts by auditing prop naming, type coverage, and composition patterns against your framework's specifications, ensuring your TypeScript component APIs accurately reflect design requirements and maintain predictable consumer contracts.

Does component API validation work with GitHub and Storybook integrations?

Yes, component API validation supports optional integrations for GitHub and Storybook. You must configure your system framework and styling setup to enable these integrations, allowing the tool to map contract compliance across your component library workflow.

What is the best way to detect prop regressions before releasing a component library?

To validate component API consistency, run an audit on your source code, such as the src/components directory. The tool requires configuration for your system framework and styling approach to accurately evaluate prop naming, types, and default values.

Can I check for backward-incompatible changes in my component props automatically?

Yes, you can automatically check for backward-incompatible changes by running an API audit across your component library. The tool validates prop types and default values against previous contracts to detect regressions and maintain API health.

Why do I need to configure the system framework before validating component APIs?

You need to configure the system framework because the tool validates prop naming, type coverage, and composition patterns against design-to-code contracts specific to your framework and styling setup, ensuring accurate consistency checks for your library.