Create a package release for our Design System

[Aveline-art]

Overview

As a developer, we should make our system easier to manage. For this ticket, let's properly package our design system so that we can implement version control.

Action Items

This should ideally come into multiple stages, with a one or more PR per stage:

Stage 1

• Separate our design system into the root of our directory
• Turn it unto a package with its own package.json
• In order for frontend to find this package, add it as dependency via path

Example:

# package.json
{
  "name": "baz",
  "dependencies": {
    "bar": "file:../foo/bar"
  }
}

Stage 2

• Add some kind of design system documentation template, such as storybook.
  • To host this, there are a couple of options:
    • Static site over S3 (should be easy and cheap)
    • Over gh-pages in a separate repo (needs a separate repo, which would need buy-in)
    • Over gh-pages in our repo (needs to somehow make this work with mkdocs; very hard to accomplish; probably not worth the effort)
    • Compiled with our website (very hard to accomplish; probably not worth the effort)

Stage 3

• Have a github action that can package this specific design system directory into a package that can be downloaded via npm
• Change our project so that we are downloading this package via npm

Example:

npm i https://github.com/user_name/node_project_name
npm install use_name/node_project@version

Resources/Instructions

Resources

The purpose of this PR is to make the Design System document-able and independently manageable. Right now, one difficulty with the design system is that developers are free to edit it at any time, making it hard to impose or enforce any kind of standard. By separating it out, we can document the standard as well as enforce it via making periodic design releases. This helps us make sure that we can revert to different version of our design system should an update break something critical. This in turn allow us to have conversations on how to have better quality control of the design system.