react-headless-dev

Develop unstyled, logic-only React components using headless architecture.

• Creates style-free, data-driven components
• Uses custom hooks for state and logic
• Combines primitives via composition
• Defines state through data attributes

• Style-free logic only
• Custom hooks for state and events
• Primitive composition with spread props
• Data attributes reflect state not style
• Namespace pattern for multi-part components
• States mapped to data attributes like data-checked, data-focused

1. 1.Define component name, type, and state needs
2. 2.Set up folder structure in packages/react-headless/
3. 3.Create use{Component}.ts with state and handlers
4. 4.Export parts via spread in {Component}.tsx
5. 5.Define data attributes based on state