@hiro-ui/bootstrap
v8.3.12
Published
Hiro UI - Bootstrap
Downloads
558
Readme
Hiro UI - Bootstrap
This project provides standardised components, themes and rendering for Hiro Apps. By rendering your React app as a Hiro App; Authentication, ORM, Redux store and Routing are all handled for you. Additionally, Hiro UI Themes are provided and work in conjunction with the underlying Semantic UI components to provide re-usable React components.
Publish
yarn lerna publish
Usage
First create your React app using the create-react-app tool.
yarn create react-app my-app --typescript
Follow the given instructions.
Then import components as normal and use:
import { Container, Menu, MenuItem, Segment } from '@hiro-ui/bootstrap';
import HiroLogo from './hiro-logo.svg';
const MyApp = () => (
<Container>
<GlobalStyle />
<Menu bordered>
<MenuItem border="right">
<img src={HiroLogo} width={35} height={35} alt="HIRO Login" />
</MenuItem>
<MenuItem>Welcome</MenuItem>
</Menu>
<p>Hello world!</p>
</Container>
);
See the docs for examples of components and their props: https://arago.github.io/hiro-ui/
ESLint Configuration
Usage
First, install this package, ESLint and the necessary plugins.
yarn add -D @hiro-ui/eslint-config
Then create a file named .eslintrc.json
with following contents in the root folder of your project:
{
"extends": "@hiro-ui"
}
Prettier Configuration
Usage
Install:
$ yarn add --dev @hiro-ui/prettier-config
Edit package.json
:
{
// ...
"prettier": "@hiro-ui/prettier-config"
}
Husky Configuration
Usage
Install:
yarn add --dev husky @hiro-ui/husky-config
Create .huskyrc.js
:
module.exports = require('@hiro-ui/husky-config');
Storybook
Run the storybook locally:
yarn storybook
Storybook exists remotely on arago.github.io. Once you update any story, you will need to publish it there.
The main idea is that you need to generate files in docs
folder of bootstrap on master
branch,
copy it somewhere, checkout to gh-pages
branch, replace all the files
in storybook-files
folder with the generated ones and push updated gh-pages
.
Steps to publish storybook over terminal:
git checkout master && git pull
cd packages/bootstrap/
Generate files and folders inside of docs
folder that will be used in the future:
yarn docs
Create a folder located over hiro-ui
:
cd ../../ && mkdir ../docs
Copy all the generated files into created on the previous step folder:
cp -r docs/* ../docs
rm -r docs/*
Pull gh-pages
branch:
git checkout gh-pages && git pull
Remove existing files:
rm -r storybook-files/*
Populate storybook-files
with new files:
cp -r ../docs/* ./storybook-files
git add ./storybook-files && git commit -m "Your commit" && git push origin gh-pages
rm -rf ../docs