Reusable UI Kit using the following
Base UI
- styled-components v4
- facepaint
- polished
- styled-tools
- styled-theming
Navigation
- react-static/react-router v4 (??reach router??)
- react portals w/ react-router v4 (??reach router??)
State + Data
- react-apollo
- xstate + xstateful
Animation
- lottie
- react-spring
Monorepo Organization
Uses lerna and yarn workspaces. Following https://medium.com/trabe/monorepo-setup-with-lerna-and-yarn-workspaces-5d747d7c0e91.
Packages:
- / (hub package)
- tools (common config for dev tools package)
- components (core ui component package)
- devcomponents (dev components package - Errors, Accessibility Checks, etc...)
- icons (icons package - font awesome, etc...)
- animations (animations package - lottie, react-spring config, etc...)
- utils-ui (ui utils package - polished, color, etc..)
- utils-general (general utils package - lodash, ramda, etc...)
Ultimately would be awesome to follow the lead set here: https://github.com/primer/primer and have even more structure/options (individual components released on their own, grouped into "components", the overall kit, and then also "meta groupings")
Documentation
docs prepared with either docz or ESDoc