@adeira/sx-design

Inclusive design system written using @adeira/sx

Usage no npm install needed!

<script type="module">
  import adeiraSxDesign from 'https://cdn.skypack.dev/@adeira/sx-design';
</script>

README

Adeira logo

adeira/universe monorepo is an open-source collection of projects created in our free time. We are friends helping each other to build libraries and applications and effectively share knowledge and work among all of us.

Continuous Integration (JavaScript) Continuous Integration (Rust)

Shipit NPM Publisher Dockerfile Builder

See: https://adeira.dev/ for more info.

Quick start

git clone --depth=100 git@github.com:adeira/universe.git
cd universe
yarn install

Please note: you have to use Yarn. It won't work with NPM!

What now? There are many projects under src/ and all of them are tested and linted together (with many monorepo optimizations). You can try to run all the checks:

yarn test

It runs only the necessary checks based on what changed last. This monorepo si divided into many workspaces. You can access commands of each workspace like so:

yarn workspace @adeira/example-relay start

Specific workspace names can be found in individual package.json files of each workspace.

Do you need some help? Feel free to ask. :)

adeira/universe monorepo structure

Overall picture of this monorepo:

/
├── .github/
│   ├── workflows/              # global GitHub CI job definitions
├── .yarn/
│   └── releases/               # Yarn itself
├── flow-typed/                 # external Flow types definitions
├── node_modules/
├── scripts/                    # support scripts for this monorepo
├── src/                        # all the source codes (workspaces)
│   ├── fetch/
│   ├── js/
│   ├── relay/
│   └── …
├── .eslintrc.js                # global Eslint config
├── .flowconfig                 # global Flow config
└── package.json                # global workspaces definition

As you can see we store all the code of this monorepo in src/ folder which contains additional subfolders for each project. You will spend most of the time there. Tools like Eslint and Flow (+ the whole testing system) is defined globally for everyone.

Node: we require you to install Yarn version 1.0+ but the actual version used when working with Universe is defined in .yarnrc and it's stored in .yarn/release. Your local Yarn version us just an initial executor for the actual Yarn.

Contributing

Check our Contribution guide on how to report issues, suggest improvements, commit changes and release.

Information for adeira/universe maintainers

Upgrading Flow

Flow is currently being released approx. every 14 days with each release introducing improvements into the type system. It is common that there will be new errors discovered with each release as well as some error will disappear. The recommended strategy is to acknowledge these new errors and suppress them to ease the version upgrade. To do so, please clone locally facebook/flow repository, install dependencies via yarn install and run the following command (modify as needed):

./tool update-suppressions --comment "This comment suppresses an error when upgrading Flow to version 0.155.0. To see the error delete this comment and run Flow." --bin /Work/adeira/universe/node_modules/.bin/flow /Work/adeira/universe

You can also try to run fix and codemod commands (from adeira/universe root):

yarn flow fix --write
yarn flow codemod --help

Troubleshooting

Click to expand

Things go broken and sometimes it's difficult to understand what's going on. This section should help with these tricky problems. Please help us expand it as you go.

When running tests

Problem (some unexpected Babel behavior which doesn't seem to be a code problem):

TypeError: /adeira/universe/src/relay/.babelrc.js: Error while loading config - yield* (intermediate value)(intermediate value)(intermediate value)(intermediate value) is not iterable
TypeError: [BABEL] /adeira/universe/src/sx/src/__tests__/StyleCollectorPseudoNode.test.js: (0 , _parser(...).parse) is not a function

Solution:

yarn test-only --clearCache

You can also try to delete node_modules/.cache/@babel/ folder.


Problem:

node:internal/process/promises:218
          triggerUncaughtException(err, true /* fromPromise */);
          ^

[UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason "Error: secret error ccc".] {
  code: 'ERR_UNHANDLED_REJECTION'
}

This happens on Node.js version 15 due to this Jest issue: https://github.com/facebook/jest/issues/10784

Solution: switch to later (LTS) Node.js version (nvm use 14) to see the full error message and run the test again.


Problem:

jest-haste-map: Watchman crawl failed. Retrying once with node crawler.
Usually this happens when watchman isn't running. Create an empty `.watchmanconfig` file in your project's root folder or initialize a git or hg repository in your project.
Error: Watchman error: query failed: synchronization failed: Operation timed out. Make sure watchman is running for this project. See https://facebook.github.io/watchman/docs/troubleshooting.

And all the scripts (lints, tests) are slow or unresponsive.

Solution:

watchman shutdown-server