CLI & Multi-doc sites

New default location, ability to bind multiple documentations together, faster and fancier loadings, CLI improvements, new developer capabilities and oh my, things are picking up pace again.

This version was released on February 2, 2023

We've prepped some improvements and bug fixes for the first release of February. We also greatly improved the import capabilities of the CLI, sped up a few things, and added a much-requested improvement to token management. Finally, there are some new goodies for our developers building custom documentation and token exporters. Read on to learn more!

Now: Start in Documentation

We are taking steps to make Supernova navigation more sensible, so today we are changing Supernova's home destination (https://cloud.supernova.io) to land you in the Documentation section by default instead of the Tokens page.

Note: this does not apply to reviewers, who do not have access to the documentation editor (because they can't edit) - they will still land in Tokens for now. We are working on improving this as well alongside revision of roles in general to allow for better flexibility, stay tuned.

Introducing: Bind multiple doc sites together

Many of you are building multi-design-system documentation sites, but would like them to act as a single entity. Today, we are announcing a smart design system switcher.

Let's take Supernova's own documentation as an example. We built both learn.supernova.io and developers.supernova.io using Supernova's doc engine (hence, why it is so pretty!). Until now, if you wanted to have easy way to switch between your documentation sites, you'd have to create workarounds with links in different places that have a chance of not updating... it was not the greatest.

But with the smart switching, this is no longer needed:

Fully customizable menu allowing you to freely switch between your design systems

Fully customizable menu allowing you to freely switch between your design systems

You can enable which design systems from your workspace will show in this menu (or if it shows at all) in each design system's setting section (republish to take effect):

Design systems switch can be enabled in Settings.

Design systems switch can be enabled in Settings.

You can hide, show multiple design systems, and you can even make it so that one documentation serves as crossroads while others won't have the option to go back (won't show the menu). However, the fun doesn't end here, because we went one step further, with smart matching.

Introducing: Smart URL matching

Let's say you have separate documentation sites for design system A and design system B, with similar content structure, and you have a "button" component in each:

URL #1: myDS-A.com/components/button

URL #2: myDS-B.com/components/button

With smart URL matching, if these sites are bound together in Supernova and a user switches between them - any page that has the same page on the same relative URL in a different design system will automatically show them the corresponding page (the button page in this example) in the other documentation as well!

This is huge for organizations building multiple design systems or brands with different needs for their documentation site, where it will feel like you can just switch between a differently themed context on the fly.

Faster switching between sections

Loading of the data between sections is now smarter, and will result in a faster loading/switching experience. To celebrate that, we have also created a new loading animation!

Token reordering

You can now easily reorder tokens in the Token list block with drag & drop. More drag and drop improvements to follow!

Preview of token reordering feature.

Preview of token reordering feature.

CLI Improvements

We have fixed lot of issues with parsing and have added support for some additional features that Tokens Studio can now do:

  • preciseCopy now works as intended. When preciseCopy: true, all tokens not included inside the current token definition file will be removed. However, with preciseCopy: false, existing tokens will be merged together with provided tokens from the definition file.
  • RGB, RGBA, HSL, HSLA and also named colors (red, blue etc.) are now supported by color parser.
  • Parsing of colors is now stricter and have much better error logging to tell you what went wrong.
  • Token parser will now handle references with percentages properly and won't treat them as numbers anymore. This means that situations like hsl(255, 70%, {opacity-10}) will no longer fail when opacity-10 is defined as 10% and not a number.
  • We have added support for newly introduced Token Studio Dimension tokens (will map to Measures/Dimensions).
  • We have added support for newly introduce Token Studio Border tokens (will map to Border).
  • Handling of references in more complex types, such as Border or Shadow, is now greatly improved and will tell you what went wrong, should your definition be incorrect, including pointing which precise argument was incorrect.

We are aware of few outstanding issues like complications when importing Typography, those will be released shortly in separate batch of fixes as we rapidly approach 1.0 of the CLI. Thank you for your patience!

Pulsar Improvements

We are investing heavily into improving the developer experience in Supernova - but before we are ready to show you what we are working on, we wanted to take some time to wrap up a few small things:

  • It is now possible to use nullish coalescing operator ?? in blueprints.
  • It is now possible to use optional chaining operator ?. in blueprints.

Do note that both work exactly the same as you'd expect in your Typescript/javascript projects, and can be used everywhere where you can write expressions.

Side-note for super-observant developers: There is a sneak peek of upcoming major feature of Supernova, we wonder who will find it ;)

General Improvements

  • It's now possible to unlink the Figma component from your Supernova component!
  • Applying an unapplied style to a frame (which is not seen as a library change in Figma) no longer requires you to republish your Figma library in order to pull changes to Supernova.
  • Figma components have a grey background now, to increase their visibility.
  • If your documentation build fails, you can now display the logs directly from your documentation editor which should tell you what went wrong. If you don't know how to resolve it, just let us know and we'll help you!
  • Resubscribing a suspended workspace preserves all paid settings now.

Bugfixes

  • It's once again possible to interact with a token right after creating it.
  • Sections with Figma styles applied directly on them import properly now.
  • Last import date for designs with only frames selected now shows correctly.
  • Shift + click now selects text in the documentation editor properly.
  • Triggering a GitHub PR build while not being authenticated no longer results in builds that are stuck In progress.

 

That's it for this release, but we'll be back with more soon. As always, if you'd like to see something new, fixed, or improved, join our Discord community — we're always there. You can also request a feature on our Feature Request Portal. Thank you for your support!