# UI

P81 UI components library.
Created with [MUI 5](https://mui.com/material-ui/getting-started/installation/)

## Create a new component

Please use the script

```shell
node generateComponent.ts --name='component-name'
```

This will auto update the exports on the index files.

To add stories simply add a `.stories` in the component folder (no extra configuration required, storybook will pick it up automatically)

## Test files

Write tests for components, with `.spec` extension.

To test the library, run:

```sh
npx nx run ui:test
```

## NPM link

Sometimes we need to create a symlink to UI package in order to test a newly developed component. Below is an example of linking to `perimeter81-webclient` repository:

```sh
npx nx run ui:build
npm link dist/libs/ui
cd ../perimeter81-webclient
npm link @perimeter_81/ui
```

To start the webclient, run:

```sh
npm run start:craco
```

## Publish to NPM

Publish is done manually by running a workflow.

- Go to [Publish UI](https://github.com/perimeter-81/nx-monorepo/actions/workflows/release-ui-lib.yml).
- Select versioning: minor, major, patch, or prerelease (default).
- Run workflow.

```

```