component-architect

Designing React component APIs from a brief involves generating TypeScript prop interfaces, defining composition strategies, and outlining file structures. This process prioritizes API ergonomics, composability, and strict prop naming conventions for maintainability.

The best way to structure TypeScript interfaces for React components uses strict rules for discriminated unions, compound components, and readonly types. This approach ensures API ergonomics and safe composability for complex UI elements.

You need headless UI libraries like Radix, React Aria, or Headless UI for complex React components like date pickers. They are recommended during architecture generation after checking your project requirements against banned dependencies.

Yes, you can generate an optimal file structure and composition strategy for a React component. The architecture output defines how components interact and are organized, written directly to a specific documentation path.

This React API design approach works without external dependencies to define your core architecture. It only recommends libraries like Radix or React Aria for complex components after verifying none are banned in your environment.