Set up your dashbard

Your component scan is completed. Let's buckle a few things up to start analyzing your design system.

After the first scan, Omlet will take you through a 3-step process to tag your components on the Web app. These tags will be used to reference your design system components as well as other sets of components in the analytics dashboard.

Tag your design system components

First, you'll need to name a tag that represents your design system components. Feel free to choose any name you want. If you're not sure yet, most teams usually go with names such as "Core", "Library", or "UI Kit". Then, you can select which packages or folders contain these components from the packages list on the right.

No design system components?

If you don't see your design system components, make sure its repository is scanned. You can head to the root of the repository and run:

npm

npx @omlet/cli analyze

yarn

pnpm

Create more tags

You can create more tags to identify different components as well—let's say you can tag legacy components that you deprecated here.

This step is optional. No need to do this right away — you can always adjust your tags later on.

Congrats! 🥳 You completed the setup. Omlet will redirect you to the Analytics page, where you can get insights into your components.