@opentrons/components NPM

opentrons components library

React components for Opentrons' applications. Visit the Opentrons Components Library to see available components.

example usage

import { PrimaryButton } from '@opentrons/components'

export default function CowButton(props) {
  return <PrimaryButton onClick={() => console.log('🐄')} />
}

setup

Usage requirements for dependent projects:

Node v18 and yarn
The following dependencies (peer dependencies of @opentrons/components)
- react: 17.0.1,
- react-router-dom: ^4.2.2,
- classnames: ^2.2.5,
- lodash: ^4.17.4

contributing

Make sure you have read the top-level Contributing Guide.

unit tests

Unit tests are run with the rest of the repositories unit tests from the top level of the project.

make test-js

Unit tests live in a __tests__ directory in the same directory as the module under test. When writing unit tests for components, we've found the following tests to be the most useful:

DOM tests
- Make sure the component renders the correct node type
- Make sure DOM attributes are mapped correctly
- Make sure handlers fire correctly
Render tests
- Snapshot tests using jest's snapshot functionality
- To regenerate snapshots after an intentional rendering change, run:
```
make test-js updateSnapshot=true
```