Pulsar Language

Exporters are powered by a Supernova templating language called Pulsar. Pulsar allows you to define exactly how the output will look, down to the last character.

You might now think - another programming language? Please no! But worry not. We've taken great care in making it as close to existing templating languages as possible while adding all-new capabilities focused specifically on code generation for design systems.

If you've ever developed a React page, used Moustache, Handlebars, or anything similar, you'll feel at home. And if not, you'll master it before you know it - it is very intuitive to understand simplifies complex tasks with a powerful built-in library of functions. Pulsar directly communicates with the Supernova Design System Model and with its computing engine, shielding you from all the internals but giving you full access to all design system data on demand. All exporters are written with Pulsar, with an optional layer of Javascript on top of that if you need to do some more advanced computation.

Example

Each exporter consists of blueprints - dynamic Pulsar templates that allow you to fetch data directly from the design system and transform them at will. This is one such blueprint:

import 'package:flutter/material.dart';

class SDMColors {
  const SDMColors();


{[ const tokens = @ds.allTokens()  /]}
{[ for token in tokens ]}
  final {[ inject "export_token_name" context token /]} = {[ inject "export_color" context token /]};
{[/]}

}

This blueprint is taken from Supernova's Flutter exporter and takes care of the generation of Flutter color definitions. The output looks like this:

import 'package:flutter/material.dart';

class SDMColors {
  const SDMColors();

  final ctaButtonColor = const Color(0xff4589ff);
  final ctaTextColor = const Color(0xffffffff);
  final contentTextHi = const Color(0xff555353);
  final contentTextMid = const Color(0xff697077);
}

All the dynamic parts were removed and replaced with the data coming from the selected design system, properly formatted for a specific target platform (in this case, Flutter). You can see that we have been able to define a rather complex task of getting the data, parsing them, and transforming them with a few lines of code, greatly simplifying the code needed to do such a thing if we would write the entire pipeline from scratch.

This guide will walk you through all the options in the Pulsar language that cater to different situations you might need when developing exporters.