Skip to content


Repository files navigation


Matchbox is an open source design system and React component library, built for SparkPost's UI.

Build Tests

Welcome to Matchbox Development

Want to start using Matchbox? See:

Looking for documentation? See:

Root Repo Scripts

# Start Scripts
npm run start:libby       # Runs libby

# Test Scripts
# Integration tests require libby 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


We use changesets to handle versioning and publishing to NPM. Before publishing, ensure you are logged into SparkPost's NPM account locally via the NPM CLI. We recommend reviewing the following steps and changeset's documentation before proceeding.

Publishing Steps

  1. Run npx changset in your pull request. This will let you select which packages you'd like to include and to which version. Hint: use space to select options, and enter to proceed. Don't worry about the summary, this is editable later on.
  2. Ensure the changeset you just created has an accurate summary, located in the .changeset directory.
  3. Commit your changset to your pull request. The remaining steps should be taken after merging to main.
  4. Run npx changeset version. This will consume any changesets previously created, bump the packages, and update changelogs.
  5. Run npm run build to build all packages.
  6. Run npx changeset publish. This will publish all bumped packages to NPM. You will be required to enter your NPM OTP.
  7. Lastly, double check the git tags were pushed to this repo in the releases section. If not, push the tags manually.