# Web components

The UDS web components are a set of low level react components themed by UDS themes.

Refer to the [UDS monorepo README](https://github.com/telus/universal-design-system/#readme) for details.

## Install

```javascript

npm install @telus-uds/components-web
```

To ensure proper functionality, it is important to install the brand palette and theme since the components package does not include a default theme. For example, you can install the Telus brand palette and theme by running the following command:

```javascript

npm install @telus-uds/palette-allium @telus-uds/theme-allium
```

This will provide the necessary components, along with the corresponding palette and theme, for your project.

## Usage

1. Export component as a named export from root
2. Wrap the UDS component in an BaseProvider
3. Include the BaseProvider provider once at the root of your application (e.g. in App.jsx)

```javascript

import { BaseProvider, Button } from '@telus-uds/components-web'
import alliumTheme from '@telus-uds/theme-allium'
...
  <BaseProvider defaultTheme={alliumTheme}>
    ...
    <Button onPress={() => {}}>Hello World!</Button>
    ...
  </BaseProvider>
...
```