Design Tokens

Warning!

The pipeline runs when all-tokens.json changes. Main is an unprotected branch. That is why we can use git push in the pipeline on main. A new tag (version) will be created with a patch. This will then be published to npm.

Development

0. If you don't have Node.js and npm installed, you can install them by following the instructions on the Node.js website.

macOS

For macOS, you can use Homebrew (if installed):

brew install node

Windows

For Windows, you can use the Node.js installer from the Node.js website.

Linux

For Linux, you can use the package manager of your distribution. For example, on Ubuntu:

sudo apt update
sudo apt install nodejs

0.1 Install dependencies

npm install

Developing the product

1. First got to the folder of the project and run npm link

cd design-tokens
npm link

2. Then go to project you want to test it in, e.g. conversations and "install" the package like so:

cd conversations
npm link @voys/design-tokens

3. Go to the file you want to import the package and add the following

import { dark, light } from '@voys/design-tokens';

Publish a new version

Make sure you are logged in, use the spindle user within KeyHub to authenticate:

npm login

Bump the version accordingly and publish it to the NPM registry, make sure to git push the new version as well:

npm version <major | minor | patch>
npm publish
git push

Install the new version within the consuming project:

npm i -D @voys/design-tokens@latest

Run locally

After installing npm, generate the tokens files by:

npm run create-tokens