# UI Kit | Amberflo

## Installation

To install Amberflo UI Kit in your React project run:

```
// yarn
yarn add @amberflo/uikit

// npm
npm install @amberflo/uikit
```

## How to publish

- Tags
- Releases
- Draft a new release
- Choose a tag -> e.g. v1.0.7
- Create tag
- Add title -> e.g. “Release v.1.0.7”
- Auto-generate release notes
- Publish release

## Usage

To import a single Amberflo UI Kit component into your application (Recommended):

```
import { DataTable } from "@amberflo/uikit/DataTable";
import { BarGraph } from "@amberflo/uikit/BarGraph";
```

This will allow to perform tree-shaking so unused components will be dropped from the final bundle that will weight less and load faster.
Note: to make this possible the bundler needs to allow tree shaking

To import multiple components from the root:

```
import { DataTable, BarGraph } from "@amberflo/uikit";
```

Note: Notice tree shaking won’t be effective if you use this approach.

---

## Install Git Hooks:

```
yarn husky install
```

## Build:

You can `yarn build-lib` to build the library
or `./bin/publish` to publish it.

---

## Linter:

If you run `yarn lint` the project will show all the issues that are related to the code structure for you to fix them.

If you run `yarn lint:fix` the project will detect all the auto fixeable issues and run over them.
Not all the issues will be addresable, those should be fixed manualy.

---

## Prettier:

If you run `yarn format` the project will be formatted.

---

## Minimum requirements:

You should have installed `Node` (version v16.13.1 or later) and `Yarn` (version v1.22.17 or later).

## Documentation

Check out our documentation [website](https://docs.amberflo.io/docs/amberflo-components).