@lucaapp/design-library

$3

The goal of this library is to provide a solid set of UI-Components that allow
us to have a consistent and easily changeable UI.

$3

``bash
cd yourpath/luca-web/services/
yarn add @lucaapp/design-library
`

`jsx { "props": { "width": "height" } }
import { Colors, Icons, Illustration } from '@lucaapp/design-library';

// default width 16, default height 16
// default width 256, default height 256
// default width 85, default height 44
`

$3

#### Add a new icon / illustration / logo SVG file

1. add the raw SVG file into the corresponding folder, for example: add a icon
SVG file to src/raw-assets/raw-icons, add a illustration SVG file to
src/raw-assets/raw-illustrations, add a logo SVG file to
src/raw-assets/raw-logos

2. run yarn icons:create or yarn illustrations:create or yarn logos:create
to update the SVG files

3. run yarn build

#### Test the package in a service

`bash
cd packages/design-library
yarn link

cd packages/design-library/node_modules/react
yarn link
`

Within the folder you are developing in, run:

`bash
cd packages/
yarn link luca-design-library

cd packages/
yarn link react
`

If you are running the service in the docker, you can copy the folder
design-library/dist to your service directory and then copy it to your docker
container, for example:

`bash
mv packages/design-library/dist /
docker cp //dist :/containerDir/node_modules/@lucaapp/design-library
`

Afterwards, you can run yarn watch` in the UI-Library directory to
automatically rebuild the library on changes. These changes will also cause an
automatic reload of the service using it, e.g. locations.