React elements of Trust

UI library of react components for Platform Of Trust.

Install

npm install --save https://github.com/PlatformOfTrust/react-elements-of-trust react-bootstrap react   

Usage

Import scss

@import '~bootstrap/scss/bootstrap.scss';
@import '~react-elements-of-trust/dist/scss/main.scss';

Use React components:

import {Button} from 'react-elements-of-trust';
import {Image} from 'react-elements-of-trust';
import {Tabs} from 'react-elements-of-trust';
import {Tab} from 'react-elements-of-trust';
// and so on ...

Troubleshooting

If after adding react-element-of-trust component, there are errors related to react runtime. Try to match react versions in your app with react-elements-of-trust:

   "react": "16.8.6",
   react-bootstrap": "1.0.0-beta.9",
   "react-dom": "16.8.6",

Development

For those who want to help with developing of Platform of Trust components.

Install

!NOTE: Recommended node version is 10.16.0. Use nvm to manage versions.

npm install yarn -g
yarn install

Development

Start Storybook for UI development

npm start

Build

Build with rollup

npm run build

Integrating to existing app while developing

There are 2 things to be done:

1) Install local version of react-elements-of-trust

Go to your project root folder (with package.json). cd <YOUR_PROJECT_ROOT>

npm install /absolute/path/to/react-elements-of-trust --save

(relative path works as well)

2) Alias react dependency of react-elements-of-trust to your app's react dependency

Go to /absolute/path/to/react-elements-of-trust folder with package.json

npm link /absolute/path/to/<YOUR_PROJECT_ROOT>/node_modules/react

Done!

Now each ime you build your local react-elements-of-trust with npm run build. New bundle.js and all scss files will be used within your app.

Linting

Run npm run lint and npm run format before committing.

Flow.js

It is important to run flow. js, while developing components. Webpack runs flow on each code update, however it might be easier for somebody to run it manually:

yarn flow

If you want to disable flow check on each build, check ./storybook/webpack.config.js:12.

Also it is recommended to configure your IDE to run flow while you are writing code.

License

1. The usage of identity assets of Platform of Trust Oy, including UI color schemes, any single color or any combination of colors (under /colors); corporate images and logos (*.jpeg, *.jpg, *.png, *.svg, etc.); information about the organization (*.doc, *.docx, *.odt, *.pdf, *.ppt, *.pptx, *.pps, *.txt, etc.); etc. is restricted and can be used only with express written consent from Platform Of Trust Oy.

2. The usage of assets of types .js and .scss in src folder is licensed under MIT.

3. For usage rights of the logos, contact: Pirkko Laitinen, marketing manager / Platform of Trust. Phone: +35840-512-3836