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"