Merge pull request #2320 from system-ui/contributing-pnpm

docs: Update Contributing doc with pnpm info

CONTRIBUTING.md

@@ -1,69 +1,77 @@
 # Contributing
 
-Hi! We're looking for some help, and we're excited that you're interested!
-We want contributing to this project to be enjoyable and productive for everyone.
-All contributions are welcome, including opening and commenting on issues and pull requests, adding or updating the docs,
-bug fixes, blog posts, and suggestions for new features.
-We follow a [Code of Conduct](CODE_OF_CONDUCT.md), so please be kind to others and reach out if you have any questions or concerns.
+Hi! We're looking for some help, and we're excited that you're interested! We
+want contributing to this project to be enjoyable and productive for everyone.
+All contributions are welcome, including opening and commenting on issues and
+pull requests, adding or updating the docs, bug fixes, blog posts, and
+suggestions for new features. We follow a [Code of Conduct](CODE_OF_CONDUCT.md),
+so please be kind to others and reach out if you have any questions or concerns.
 
-Theme UI is still in an early stage and things will likely move quickly.
-The time to review a pull request depends on the complexity involved,
-so please be patient if a particular feature takes longer to review than others.
+Theme UI is still in an early stage and things will likely move quickly. The
+time to review a pull request depends on the complexity involved, so please be
+patient if a particular feature takes longer to review than others.
 
 ## Local Development
 
-This repo uses [Yarn Workspaces][] and [Lerna][] to develop multiple packages together as a monorepo.
-Be sure to install [Yarn][] before setting up the development environment.
+This repo uses [pnpm workspaces][] to develop multiple packages together as a
+monorepo. Be sure to [install pnpm][] before setting up the development
+environment.
 
 Install dependencies and link local packages in the root directory:
 
 ```sh
-yarn
+pnpm i
 ```
 
-In `postinstall` script running after dependencies install, [Preconstruct][] links source files to dist directories.
+In `postinstall` script running after dependencies install, [Preconstruct][]
+links source files to dist directories.
 
-Depending on the part of the codebase you're working on, you'll want to run tests or docs development server.
+Depending on the part of the codebase you're working on, you'll want to run
+tests or docs development server.
 
 ## Working on the docs
 
-The docs are using Gatsby. To start development server run
+The docs are using Gatsby. To start development server run:
 
 ```sh
-yarn workspace docs start
+pnpm run dev:docs
 ```
 
 Changes to libraries will immediately hot reload the docs.
 
 ## Tests
 
-Unit tests are run with [Jest][], and each package should include a `test/` directory with unit tests for that package.
+Unit tests are run with [Jest][], and each package should include a `test/`
+directory with unit tests for that package.
 
 Running tests:
 
 ```sh
-yarn test
+pnpm test
 ```
 
 Running tests in watch mode:
 
 ```sh
-yarn test --watch
+pnpm test --watch
 ```
 
-You can specify what tests to run by passing test path pattern as the first positional argument and test name pattern after `-t` flag.
+You can specify what tests to run by passing test path pattern as the first
+positional argument and test name pattern after `-t` flag.
 
 ```sh
-yarn test core/test/react-jsx -t 'accepts sx prop'
+pnpm test core/test/react-jsx -t 'accepts sx prop'
 ```
 
 ## Pull Requests
 
-When opening a pull request, please be sure to update any relevant documentation in the READMEs or in the `packages/docs` directory.
-Also include a high-level list of changes in the [CHANGELOG.md](CHANGELOG.md) file at the top under the `## Unreleased` heading.
+When opening a pull request, please be sure to update any relevant documentation
+in the READMEs or in the `packages/docs` directory. Also include a high-level
+list of changes in the [CHANGELOG.md](CHANGELOG.md) file at the top under the
+`## Unreleased` heading.
 
-[yarn]: https://yarnpkg.com
-[yarn workspaces]: https://yarnpkg.com/en/docs/workspaces
-[lerna]: https://github.com/lerna/lerna
+[pnpm workspaces]: https://pnpm.io/workspaces
+[install pnpm]: https://pnpm.io/installation
 [jest]: https://jestjs.io/
-[preconstruct]: https://preconstruct.tools/guides/using-preconstruct-dev-in-a-monorepo
+[preconstruct]:
+  https://preconstruct.tools/guides/using-preconstruct-dev-in-a-monorepo

packages/theme-ui/README.md

@@ -91,17 +91,17 @@ scales help you build UI rooted in constraint-based design principles.
 - The next evolution of Styled System
 - From the creators of utility-based, atomic CSS methodologies
 - Theme-based styling with the `sx` prop
-- Style [MDX][] content with a simple, expressive API
-- Works with [Typography.js][] themes
 - Compatible with virtually any UI component library
 - Works with existing [Styled System][] components
 - Quick mobile-first responsive styles
 - Built-in support for dark modes
 - Primitive page layout components
-- Plugin for use in [Gatsby][] sites and themes
 - Completely customizable with robust theming
 - Built with a standard [Theme Specification][] for interoperability
 - Built with [Emotion][] for scoped styles
+- Plugin for use in [Gatsby][] sites and themes
+- Style [MDX][] content with a simple, expressive API
+- Works with [Typography.js][] themes
 
 [emotion]: https://emotion.sh
 [mdx]: https://mdxjs.com
@@ -116,7 +116,7 @@ scales help you build UI rooted in constraint-based design principles.
 npm install theme-ui @emotion/react
 ```
 
-_If you don't need color modes, components and MDX support, you can install
+_If you don't need color modes or components you can install
 [**@theme-ui/core**](https://github.com/system-ui/theme-ui/tree/develop/packages/core)_.
 
 Any styles in your app can reference values from the global `theme` object. To
@@ -217,9 +217,9 @@ export default (props) => (
 - [The `sx` Prop](https://theme-ui.com/sx-prop)
 - [Layout](https://theme-ui.com/layout)
 - [Color Modes](https://theme-ui.com/color-modes)
+- [Theme Spec](https://theme-ui.com/theme-spec)
 - [Themed](https://theme-ui.com/themed)
 - [MDX Components](https://theme-ui.com/mdx-components)
-- [Theme Spec](https://theme-ui.com/theme-spec)
 - [Gatsby Plugin](https://theme-ui.com/packages/gatsby-plugin)
 - [API](https://theme-ui.com/api)