Develop components

Available scripts:

# general
turbo dev
 
# publish package
turbo ship
 
# publish storybook to Chromatic (optional)
# for Figma embed
turbo chromatic
 
 
# manually build token file from Figma
# only when github workflow failed
turbo build-token

Run the dev server

turbo dev

You should see two servers running:

localhost:3000 - the documentation website (this site) (opens in a new tab)
localhost:6006 - the workshop (storybook) (opens in a new tab)

Develop components

Add files in packages/ui/*
Export them in the packages/ui/src/index.tsx file

Publish package

turbo ship

Publish storybook to Chromatic

turbo chromatic

Embed Story in website

Get url from the top right corner of a story (opens in a new tab).

Example:

import {Story} from "../misc/Story"
 
# Button
 
<Story id="https://nomi-workshop.vercel.app/iframe.html?args=&id=atomic-button--default"/>

Button