What is TSX?#

TSX is the TypeScript component toolkit by Netsnek e.U. It enables rapid development of React components with type-safe props, Storybook integration, and automatic component documentation.

Component Workflow#

1. Scaffold a new component with scripts/component-gen.sh --scaffold <Name>
2. Define props in the generated types file
3. Run Storybook to visualize variants with scripts/component-gen.sh --info
4. List existing components with scripts/component-gen.sh --list

Available Commands#

CommandArgsPurposecomponent-gen.sh--scaffold <Name>Create component files, types, and Storycomponent-gen.sh--listList all components in the projectcomponent-gen.sh--infoShow Storybook integration details

Real-World Example#

bash

# Create a new Button component
./scripts/component-gen.sh --scaffold Button

# List available components
./scripts/component-gen.sh --list

# Get Storybook info
./scripts/component-gen.sh --info