# Demio UI Kit

Demio resources and components that are shared across Demio applications

## Publish to NPM

```
yarn publishing
```

## Components

For a list of the components and a general overview of each, check out the Components & Resources README (src/README.md)

## Testing & Development

Testing & development should never be done via publishing to npm.
There are two main ways to go about it.

1. Run Storybook and create a story file (see the `stories` folder) for the component, and then test and develop locally.

2. Before publishing, it's always helpful to test the changes in the repo you'll be adding the new demio-ui-kit version to. There are many ways to test this, but one of the best is [yalc](https://www.npmjs.com/package/yalc). 

## Start Storybook

```
yarn storybook
```

## Test changes in another repo via yalc

Inside demio-ui-kit, run this:

```
yarn build
yalc publish
```
`yarn build` is only required if you have something like styles that need to be built via webpack

to show bundle analyzer report

```
yarn build --showBundleAnalyzer
```

Inside the external repo, run this:

```
yalc add demio-ui-kit
```

Boom! Now your local demio-ui-kit

To push demio-ui-kit changes to the external repo without needing to add the kit there again, run this in demio-ui-kit:

```
yalc push
```
Note that you'll need to do `yarn build` inside the demio-ui-kit again if you updated things that need to be rebuilt via webpack.

To remove the local demio-ui-kit from the external repo, run this in the repo:

```
yalc remove demio-ui-kit
```

**Important**: Do not push the yalc changes to the external repo.

## Publish Public Storybook Docs

```
yarn publish:docs
```