Is this skill specific to Rust development?

While optimized for the zTerm terminal UI ecosystem which uses Rust, the patterns it generates are applicable to developers following similar component-driven design patterns.

How does this skill ensure consistency?

It specifically follows existing patterns in the zTerm repository, such as those found in crates/story/src/stories, and uses the section! macro for organization.

What is a component story in this context?

A story is a specialized example that demonstrates a UI component's appearance, variants, and behavior within a design system or gallery.

Can it handle complex component states?

Yes, the skill is designed to include basic usage, interactive examples, edge cases, and error states to provide comprehensive coverage.

Component Story Generator

Name: Component Story Generator
Author: zerx-lab

byzerx-lab

•

디자인 도구

Automates the creation of comprehensive UI component stories and usage examples following Rust-based design patterns.

This skill streamlines the development workflow for terminal UI components by generating standardized stories and usage examples. By adhering to established patterns within the zTerm ecosystem, it ensures that every component is documented with consistent structure, using specific macros like `section!` to organize variants. It is an essential tool for developers looking to maintain a high-quality design system, providing a framework to showcase basic usage, interactive states, and edge cases for any new or existing component.

주요 기능

0117 GitHub stars

02Consistent structural organization using section! macros

03Adherence to project-specific architectural patterns

04Comprehensive coverage of component states and variants

05Automated Rust-based story template generation

06Scaffolding for interactive and error-state examples

사용 사례

01Ensuring architectural consistency across a library's component gallery

02Adding interactive usage examples to a terminal design system

03Documenting a newly created terminal UI component with diverse visual states

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add zerx-lab/zterm generate-component-story

For use in Claude.ai and ChatGPT

Download Skill