Matchbox is an open source design system and React component library, built for SparkPost's UI.
Welcome to Matchbox Development
Want to start using Matchbox? See:
Looking for documentation? See:
Collaborating on Matchbox
Matchbox uses Lerna to manage packages.
lerna globally, then run the following commands to get started:
npm i -g lerna git clone firstname.lastname@example.org:SparkPost/matchbox.git cd matchbox npm i lerna bootstrap
Root Repo Scripts
# Start Scripts npm run start:storybook # Runs storybook npm run start:site # Runs the design system website npm run start:playroom # Runs playroom # Test Scripts # Integration tests require storybook to be running first npm run pretest # Run before running tests for first time npm run test:unit # Runs unit tests npm run test:e2e:gui # Runs integration tests npm run test:e2e:headless # Runs integration tests in headless mode # Build Scripts npm run build # Builds all packages
Our release process isn't perfect, and requires some manual work.
lerna to handle versioning and publishing to NPM. Before publishing, ensure you are logged
into SparkPost's NPM account locally via the NPM CLI. Reach out to #UXFE or #design-guild on Slack
if you need access.
- Merge all pull requests you wish to release to
- Before publishing for the first time, set up your github auth token in
.env. In order to run
changelogyou'll need to create a personal access token with the
public_repopermissions and copy it to a
GITHUB_AUTHvariable in an
- On the
npm run changelog. This generates a markdown changelog in
- Open and edit
CHANGELOG.mdwith correct title and version number of your release.
- Push these changes to
mainif you have permissions, or on a new branch.
lerna version --force-publish. The Lerna CLI will prompt you for version numbers. The
force-publishflag will force all packages to be bumped to the same version. See https://github.com/lerna/lerna/tree/master/commands/version.
lerna publish from-package. The Lerna CLI will prompt you for a one time password from your authenticator. See https://github.com/lerna/lerna/tree/master/commands/publish.
What the commands look like:
npm run changelog # Open the changelog file and edit git add CHANGELOG.md git commit -m "Update CHANGELOG.md" git push lerna version --force-publish lerna publish from-package # That's it!