Overview

UI Components

The UI components library is a collection of reusable ecommerce components compatible with any React project. Components come fully typed, have been tested for performance and accessibility, and are highly customisable.

Base components

The UI components are built on top of the Overdose base components library. Check out the base components documentation for a step-by-step installation guide.

Usage

The UI components are available for use from the ui package in the PWA monorepo. Using a component in your project is a matter of copy/pasting it into your project directory and modifying it as required.

Our recommended approach is to:

1. Locate and copy the directory of the component you want to use into your project
2. Check if the component has any node modules that need to be installed and install them
3. Modify the types to match the type used in your project (for example your project will likely have a unique type for the Product object)
4. Run your project's type checker (or use your IDE hints) to make sure the component uses your custom types correctly. Modify the component if necessary.
5. Apply the appropriate styles and modifications for the component to match your project's design

Contributing

The UI component library is a place for us to share useful components between projects. If you have a new component or an improvement to an existing component that you think would be useful to others feel free to open a pull request.