infographic-structure-creator

To generate infographic structure components in TypeScript, direct the AI to create a new layout component in TSX under the src/designs/structures directory. It automates layout logic, component composition, and registration for your design system.

Supported infographic layout types include list, compare, sequence, hierarchy, relation, geo, and chart categories. Each category has dedicated components and prompts enforced by the structure framework.

Registering a diagram structure component is automated by coordinating with the structure registry during generation. The workflow uses utilities like getElementBounds and theme helpers to ensure correct positioning and registration within the design system.

Yes, you can use this to modify existing infographic layouts in a React project. It applies to implementing and updating layout logic and component composition for TypeScript/TSX files located in the src/designs/structures directory.

Coding conventions for creating infographic diagrams are enforced by reusing the references/structure-prompt.md file. This ensures the generated TSX structure components adhere to the framework's required layout and registration standards.