@brainit/uat-components NPM

Shared UI Components

Shared UI Components for Universal Aviation Training Web Applications.

Setup

Install dependencies:
```
yarn install
```
Compile library to dist/:
```
yarn run start
```
This command continues to watch for changes in src/ module and recompiles the library automatically.

Example project

Library components is tested and showcased in example project using next steps:

Navigate to example folder from the project root:
```
cd example
```
Install dependencies for example project:
```
yarn install
```
Run example/showcase project in browser and see components in action:
```
yarn run start
```

Usage from example project

Components can be imported from library's dist/ folder using absolute import:

import {
  TextHeadline1,
  Logo,
  TextInput
} from "components";
import "components/dist/index.css";

const Example = () => (
  <>
    <TextHeadline1>Headline</TextHeadline1>
    <Logo />
    <TextInput />
  </>
);

Integration to other projects

Link uat-components library to yarn from the library's project root:
```
yarn link
```
Library name is defined in package.json.
Link library's react module to yarn:
```
cd node_modules/react
yarn link
```
This step is required because Invalid Hook Call Warning exception will be raised since library uses react-hooks.
Position to the root of the project where you want to integrate the library.
Link uat-components library from yarn:
```
yarn link uat-components
```
Link react from yarn:
```
yarn link react
```

Usage in other projects

Components can be imported from library using library name:

import {
  TextHeadline1,
  Logo,
  TextInput
} from "uat-components";
import "uat-components/dist/index.css";

const MyProject = () => (
  <>
    <TextHeadline1>Headline</TextHeadline1>
    <Logo />
    <TextInput />
  </>
);