React & Storybook

For ease of use we're actively creating a React component library that is directly based on the CSS components and utilities outlined here.

TeamSnap UI React components can be found in Storybook, at teamsnap-ui-storybook.netlify.com To access Storybook locally simply clone TeamSnap UI and run `npm run storybook` inside the repo

Utilities & the Mod Prop

Most the components are pretty straight forward to work with and more detailed documentation can be found in storybook, but one quick callout is the use of the "mods" prop. By passing utility classes along to the mods prop, each component allows you to add additional classes on top of the base.

Example: 
  
  <componentName 
    columns= { columns }
    rows= { select('Data Sets', dataOptions, defaultDataSet) } 
    isLoading= { boolean("isLoading", false) } 
    mods= 'u-padTopMd u-padBottomMd'
  />