What problem does it solve?
Writing documentation for React Native UI components requires cross-checking source code, TypeScript types, variant definitions, and playground demos, which is tedious and error-prone when done manually. This Skill automates the full workflow of locating component source files, validating implementation consistency, and producing spec-compliant MDX documentation for the native-ui-docs site.
Core Features & Use Cases
- Automated file location: Maps a component name (e.g., ActionSheet) to its source directory, playground demos, route page, and MDX document path using kebab-case slug conventions.
- Implementation consistency validation: Cross-verifies props declared in types.ts against actual component destructuring, defaultVariants, classNames slots, and RN-specific behaviors like hitSlop and accessibilityState before writing docs.
- Spec-compliant MDX generation: Produces documentation with Demo references, PropsTable, UnionType, and TypeTable sections following fumadocs conventions, including sidebar meta.json registration and demo coverage checks.
- Use Case: Ask the AI to write documentation for the Button component, and it reads the source and demos, creates any missing playground demos with named exports, generates the MDX page, and verifies demo-to-doc coverage with a diff command.
Quick Start
Write the documentation for the ActionSheet component in @skyroc/native-ui following the native-ui-docs conventions.
