Framer live components

Also introducing: a release notes block, private GitHub Markdown, pure live-code variants for code blocks, ad more improvements and bugfixes.

This version was released on October 12, 2022

We love listening to your ideas, and today's smaller release brings a few of those to life, especially focused on improving the experience of our advanced users! Check it out and let us know what you think :)

Introducing: Framer <> Supernova live components

We love Framer.com and its advanced web capabilities! For this reason and because many of you has asked, have added internal support for showing the live components using Framer's handshake.

With this capability, you can now properly render your live components inside Supernova as well and document them to your liking. Here is one for you:

Introducing: Release notes block

We've made release notes useful with the introduction of the release notes block that you can start using right away. Such generated release notes might look like this:

Release notes take changelog from your versions and turn it into auto-generated list

Release notes take changelog from your versions and turn it into auto-generated list

 

The release notes block generates release notes (duh 🤷) that are directly taken from your published versions:

We will also be looking at version management in greated detail with additional improvements coming, so stay tuned - this is just a small taste of things to come.

Introducing: Private GitHub Markdown

We have improved our private markdown handling so it is now possible to properly import private GitHub markdown files directly into your documentation. To enabled this functionality, first, provide you developer access token into the documentation settings:

Your GitHub token will start with

Your GitHub token will start with "ghp_", followed by string of characters

Once you have that, simply copy the URL of the markdown file you'd like to show:

And paste it into markdown block:

You can create markdown block by writing /markdown at any line of your documentation

You can create markdown block by writing /markdown at any line of your documentation

Markdown will be refreshed with every publish of the documentation, and will be made into natural part of your documentation site! This is great for using developer-written content alongside your other content created inside Supernova.

Introducing: Pure live-code variant

We have added new option to show your codebases - pure live-code variant for the code blocks. Select the variant from the list of available variants under the code block options:

With this variant, you can hide all supporting UI including the code editor to only focus attention on the code:

Multi-layer CSS, SCSS, and LESS exporters

We have greatly improved the export capabilities of CSS, SCSS, and LESS exporters by introducing support for multi-layer shadows. Previously, the shadow tokens with multiple layers were generated as separate shadows, greatly complicating their use:

However, with the new iterations, shadows are now properly exported even with multiple layers:

We'll be tackling their proper visualization inside the editor as well in near future, but for the purposes of export and documentation, they now behave like true multi-layer tokens.

Improvements

  • The ... hover context menu button is now visible when hovering anywhere on the tokens, components or groups.
  • Frame selection dialog now works with the new import and brands.
  • We have updated the default layout of Tokens/Components spreadsheets.

Bugfixes

  • We fixed the issue when Documentation editor used more different types of font weight.
  • Cloud properly reloads the amount of linked files right away after file linkage.
  • Component with assigned Figma component now shows Figma component as Available in the published documentation.
  • Leaving the Documentation link or Repository component properties and publishing them properly renders these empty properties as - in the published documentation.
  • Trying to render Token Group block as Stack no longer results in Docs failing to deploy.
  • Table set as Fit to page renders in the correct size in the published Docs again.
  • We fixed the incorrect shadows under error messages.
  • Token values won't show null anymore when line height for typography tokens was not defined

 

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!