Working with components

Here's how to create a component in Supernova.

Create a new component in Supernova

1. Click + New component to open the New component drawer.
2. Add a name and description for the component.
3. Select a status for the component.
4. Select a Figma component to link to. This basically creates a link between the Supernova and Figma components, so you can easily go to the component in Figma from Supernova. If you haven't imported anything from Figma yet, you'll need to do this first. You can import components directly from the Components section.
5. Select whether the component has been documented on your documenation site yet, and add a link to it if desired. You can also add a link to a repository if the component exists in one.
6. Click Create component to finish and save.

Edit a component

You can edit a component in Supernova any time. To edit an imported component, you'll need to edit it in Figma, and then import the updates to Supernova.

To edit a component in Supernova, simply open the component detail drawer by clicking on the icon in any cell of the relevant row in the components table. You can then edit any information you want in the component drawer, and click Save to finish.

Link a Figma component

It's also possible to link and preview a Figma component to your component in Supernova. This can be done by clicking the Link Figma component button in the component detail drawer, and selecting your Figma component from the list.

You can only link Figma components from your connected Figma files.

Delete a component

1. Click on the relevant component in the Components table to open the New component drawer.
2. Click the trash icon at the bottom right of the drawer.
3. In the dialog, click Delete component to permanently delete the selected component.
4. You can also click ... beside the component name and complete this action from the context menu.