Detecting nested components
If parts of an imported component contain a matching variant from another already-imported component, story.to.design will detect and place the nested component.
How to use it
Understand which components are the most atomic, and that might be used inside other components.
When starting the import process, make sure you import these atomic components first.
Once the atomic ones are placed on the canvas, when the other subsequent components are imported and placed on the canvas, the plugin will make the connection.
E.g: An icon component should be imported first, then the button which contains that icon, so story.to.design can link to the icon component.
Currently, nested component detection only works with the technologies React and Web Components. If you need support for another framework, let us know in our Discord chat or send an email to email@example.com.