esalon-admin-components-lib
Admin components lib + storybook integration in React
Setup
Inside cloned project folder install dependencies:
npm install
To start StoryBook
npm run storybook
To start as app
npm run start
See package.json for all available scripts
peerDependencies
This module has peerDependencies of
"react": "^16.9.0"
"react-dom": "^16.9.0"
Make sure you have them in dependencies in projects that use this package
To use this package in another app
A] From node regisrty
npm i esalon-admin-react-components
B] Using npm link
-
Checkout this project.
-
In project dir run:
npm install npm run module npm link (OR sudo npm link)
-
In Parent/Consumer project run:
npm link esalon-admin-react-components
-
You should now be able to import the components listed below using syntax:
import { ComponentName } from 'esalon-admin-react-components
Button, BUTTON_SIZES, BUTTON_TYPES, ButtonSelector, Checkbox, CloseSVG, LabelTextField, LoadingSpinner, Modal, MODAL_TYPE, SelectList, SlidingModal, DIRECTION, StateSelectList, TriangleSVG, ORIENTATION
-
You can also import color & font aliases:
import { Colors, Fonts } from 'esalon-admin-react-components
See https://github.com/eSalon/esalon-admin-components-lib/blob/master/src/styles/constants.js
Running the tests
Automated structural and visual tests may be run on all components, as follows:
npm test
Structural Test
A snapshot copy of the structure of UI components reporting any issues or changes. To run just the structural test:
npm test structural
Visual Regression Tests
Visual snapshots of UI components reporting differences in pixels. Note: a runing instance of StoryBook is required to test locally. To run just the visual tests:
npm test visual
Updating snapshots
To update structural and visual snapshots to the latest and commit the changes:
npm run cleantest