#hashicorp/design-system: Helios Design System

原文地址 github.com

HashiCorp 开源了两个新项目,一个是内部各个产品使用的设计系统,另一个是文档管理系统,主要支持 Google Workspace。

Helios Design System. Contribute to hashicorp/design-system development by creating an account on Git......

The Helios Design System provides the building blocks to design and implement consistent, accessible, and delightful product experiences across HashiCorp.

#Usage

For guidelines on how to use Helios, see our documentation website.

#Packages

#packages/components

Design System components in Ember.js

#packages/ember-flight-icons

Ember.js addon with <FlightIcon /> component

#packages/flight-icons

Flight icons in different formats (SVG/SVG Sprite/React)

  • npm package: @hashicorp/flight-icons
  • more info: see flight-icons/README and flight-icons/CONTRIBUTING for details on how to use the "sync/build" scripts that export the assets from Figma and generate a bundle of standalone SVG files.

#packages/tokens

Design tokens

#Contributing

#Workspaces

This monorepo uses yarn workspaces to manage dependencies for all packages.

#Adding new packages

Run this command from the monorepo root:

yarn workspace <workspace-npm-package> add --dev <npm-package>

e.g. yarn workspace @hashicorp/design-system-components add --dev ember-cli-flash

#Using ember install in the monorepo

Run this command from the monorepo root:

yarn workspace <workspace-npm-package> run ember install <npm-package>

e.g. yarn workspace @hashicorp/design-system-components run ember install ember-a11y-refocus

#Changesets

This project uses changesets to manage how changes will be released. Each user-facing change to a package should come with a changeset for each package that has changed.

To create a changeset, run and follow the prompts in your terminal:

yarn changeset

See the changeset docs for more information.

Note: If you want to ignore a changeset bump in terminal (e.g. major bump for selected "package x" is N/A, want a patch release), press return on the command line to skip that step. Press the spacebar to select that step.

#Releasing

Release PRs are created and automatically updated on every PR merge by the changeset GitHub action. Once we are ready to do a release, the PR – titled Version Packages – can be approved and merged to main, and the changes will be released to npm automatically.

#Local testing of versioning

You can simulate the versioning experience locally with this command:

yarn changeset version

In order for this step to complete successfully you'll need to create a personal access token in GitHub. The name could be anything e.g. design-system, with read:user and repo:status scopes, and then add the token to a .env file in the project's root.

GITHUB_TOKEN=YOUR-TOKEN-HERE

#License

This project is licensed under the Mozilla Public License 2.0.

#Versioning

We use SemVer for versioning.