skills.rest
daangn
daangnOFFICIAL
Explore all skills by this author →
Website𝕏@daangnteamGitHub

react-docs-generator

Generate standardized MDX documentation for SEED Design System React components.

1.0k|75|Updated Mar 11, 2021
Search Tags:#automation#documentation#react#mdx#component-apis#usage-examples
One-click install
npx skills add https://github.com/daangn/seed-design --skill react-docs-generator
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-docs-generator
Source: https://github.com/daangn/seed-design/tree/main/.claude/skills/react-docs-generator
Command: npx skills add https://github.com/daangn/seed-design --skill react-docs-generator

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the creation and maintenance of React component documentation for SEED Design System, ensuring consistent APIs, installation guides, and usage examples across the codebase.

Core Features & Use Cases

  • Template-driven Docs: Generates standardized MDX files for new components and updates existing implementation docs.
  • Prop & API Documentation: Produces Prop tables and usage examples aligned with SEED design patterns.
  • Lifecycle Guidance: Provides installation instructions, usage patterns, and MDX components for embedding examples.

Quick Start

Create or update a component in docs/content/react/components. Run this skill to generate or refresh the corresponding MDX documentation for that component.

Frequently Asked Questions about react-docs-generator

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

FAQPage Schema
How do I automate React component documentation generation?▼

This Skill automates React component documentation by generating standardized MDX files that include Props tables extracted from TypeScript typings, installation guides, usage examples, and API references for SEED Design System components.

Can I generate Props documentation automatically from TypeScript types?▼

Yes, the Skill autofills Props documentation directly from TypeScript typings, creating structured Prop tables that align with your component's type definitions without manual entry.

What documentation format does this Skill produce?▼

The Skill produces MDX-compatible documentation files structured for the SEED Design System, including installation instructions, Props tables, usage examples via doc-gen:file blocks, and component structure details for both simple and composite components.

How do I update existing component documentation without rewriting it?▼

Run the Skill on existing components in ./docs/content/react/components to refresh and update implementation documentation while maintaining your existing content structure and custom examples.

Does this Skill work with composite React components?▼

Yes, the Skill handles both simple and composite React components, generating appropriate documentation structure and API references for each component type within the SEED Design System.

What setup is needed before generating component documentation?▼

Create or prepare your React component in the docs/content/react/components directory with TypeScript typings defined, then run the Skill to generate the corresponding MDX documentation.

Related Skills

Explore More Content & Communication Skills→
Snowflake-LabsSnowflake-Labs
12

read-ors-configuration

A concise summary of your roleplay character: name,</name> personality, and/or behavior, formatted as a single string sentence. Typically不超过50字，此处省略

Official
Intermediate
TheOrcDevTheOrcDev
2.0k

fumadocs-component-docs

Generates frontmatter-driven documentation for 8-bit UI components with MDX previews.

Community
Basic
medusajsmedusajs
35.7k

UI Component Documentation Writer

Generate MDX documentation and live TSX examples for Medusa UI components.

Official
Intermediate
ntaksh42ntaksh42

generate-props-documentation

Parse Astro component Props definitions and generate Markdown documentation.

Community
Advanced