check-component-readiness

Reviews Blade design system components against a shipping checklist before release.

649|197|Updated Jan 28, 2020
One-click install
npx skills add https://github.com/razorpay/blade --skill check-component-readiness
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: check-component-readiness
Source: https://github.com/razorpay/blade/tree/main/.agents/skills/check-component-readiness
Command: npx skills add https://github.com/razorpay/blade --skill check-component-readiness

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design system engineers often ship components with missing tests, documentation, or exports. This Skill reviews a Blade component against a nine-item shipping checklist and reports exactly what is incomplete before release.

Core Features & Use Cases

  • Checklist-Based Review: Verifies component status registration, KitchenSink stories, interaction tests, unit tests, JSDoc coverage, Storybook documentation, exports, and knowledgebase entries.
  • Structured Report Output: Produces a report with completed items, missing items with file paths, actionable recommendations, and additional notes.
  • Use Case: Before merging a new Button variant, ask for a readiness review to confirm that _KitchenSink.Button.stories.tsx, SSR tests, and the knowledgebase markdown in packages/blade-mcp/knowledgebase all exist.

Quick Start

Ask the assistant to review the Button component for shipping readiness using the component checklist.

Frequently Asked Questions about check-component-readiness

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

FAQPage Schema
How do I check if a Blade component is ready to ship?

Ask for a component readiness review by name. The Skill checks nine items including component status registration, KitchenSink stories, tests, JSDoc, Storybook docs, exports, and knowledgebase entries, then reports what is missing.

What files does the component shipping checklist verify?

It verifies componentStatusData.ts registration, _KitchenSink stories, interaction test stories, web and SSR unit tests in __tests__, Storybook stories with StoryPageWrapper, index.ts exports, and knowledgebase markdown under packages/blade-mcp.

Does the readiness review modify component code?

No, the review is strictly read-only. It only inspects files and suggests changes with specific file paths and recommendations, leaving all implementation work to the developer.

What are the limitations of automated component readiness checks?

Manual testing cannot be verified automatically, so the review only reminds developers to complete it. It also checks file existence for tests rather than reviewing test content or quality.

How do I generate the knowledgebase file for a new Blade component?

The review checks for a {ComponentName}.md file under packages/blade-mcp/knowledgebase. If missing, it suggests running the prompt from packages/blade-mcp/knowledgebase/components/prompt.txt to generate it.