# B2B-UI

B2B-UI v4 is currently production ready!

You can build all of your UI with the MUI 5 components proxied by B2B-ui.

Example:

```
import { Box, Autocomplete, Stack } from '@evaneos/b2b-ui';
```

Make sure you checkout the [storybook](https://evaneos.github.io/b2b-ui/) for more info around setup and usage.

## Contributing

Contribution is super easy.

### Update a current component

Run the storybook locally, see if a story can help you see your update and make your update. Feel free to add new stories if needed as we are all owner of the storybook.

Send your PR to be reviewed, when all green merge.

A changelog PR will automatically appear, make sure it's all good then merge it, a new version of b2b-ui will be deployed automatically upon merge.

### Add a new export

Currently `tsup` builds the library. If you want to add a new exported function or component:

You can see the source code files and the compiled target in the [build-config.ts file](build-config.ts)

#### Update a currently exported file

-   Are you looking to add a new component to the design system or a new utility to the utilities?

-   Add the export to `src/evaneos/index.ts` or `src/evaneos/utilities.index.ts` if it's a small addition (not a full new lib for example).
-   Run `npm run build` then `npm run test:build`, it should break if you have not updated tests, that's expected. Now you should update the exported expected snapshot by running `npm run test:build -- -u`, you should see your new exports in the updated snapshot.
-   Get your PR reviewed, merged and merge the changelog PR

#### Add a new file export to the library

-   Are you looking to add something big, like a graph library that you want to add to the design system? First talk about it to the chapter front first and foremost.
-   Then export it in `src/evaneos/[your new exported file]/index.ts`
-   update [build-config.ts file](build-config.ts) with a new entry. 'graph-xyz': 'src/evaneos/graph-xyz/index.ts'
-   Update gitignore to ignore the new build outputs: `/graph-xyz`
-   run `npm run build` and then `npm run test:build`, it should break with the new addition, update the snapshot accordingly.
-   Run `npm publish --dry-run | grep graph-xyz` you should see the compiled files for your new addition.
-   Update `package.json.files`, add your new entry ` "/graph-xyz/*",`

You should be good to push and get reviewed.

Do this only if you have been check by the chapter front.
Usually what motivates adding new file export are

-   Heavy addition that not all apps may need and could weight down bundles
-   External lib proxy

## Install

Make sure to use the `@latest` since we are currently under beta.

```shell
npm install @evaneos/b2b-ui@latest
```

If you are looking for the v3.x.x, [checkout the b2b-ui/v3.x.x branch](https://github.com/Evaneos/b2b-ui/tree/b2b-ui/v3.x.x)

## Documentation

Checkout out our [storybook for documentation](https://evaneos.github.io/b2b-ui/).

## Publishing

Publishing the NPM library is automatic, you should never do it manually. it's done by the release-please github action upon merging the automatic changelog PRs.

This automation is handled by https://github.com/google-github-actions/release-please-action/tree/v4/ used in the `release-please.yaml` github workflow.

The release is conditioned by the presence of certain conventional commit in the merged PR. This is taken from the doc:
> fix: which represents bug fixes, and correlates to a SemVer patch.
>
> feat: which represents a new feature, and correlates to a SemVer minor.
>
> feat!:, or fix!:, refactor!:, etc., which represent a breaking change (indicated by the !) and will result in a SemVer major.