colourbox-ui
Colourbox UI is a collection of reusable React components and default styling definitions It is used in the Colourbox CMS
Run locally
have nvm installed and run:
nvm use
npm i
npm run storybook
Install in other project
npm i colourbox-ui
Install
npm i
Sandbox
npm run sandbox {module}
Each component should have a folder in sandbox that mirrors the path.
Modules
index.js
or index.jsx
and any other files.
Import import 'sandbox/initialize';
, includes colourbox-ui styles and icons
Always import components from colourbox-ui
Example - Button
Button component path: components/Button/Button.jsx
Button sandbox path: components/button/index.jsx
npm run sandbox ./src/components/button/index.jsx
gitHooks
post-merge npm install hook
touch post-merge
in .git/hooks
Run chmod +x post-merge
to make it executable.
#/usr/bin/env bash
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
check_run() {
echo "$changed_files" | grep --quiet "$1" && eval "$2"
}
check_run package.json "npm install"
check_run package-lock.json "npm install"