Shared Component Library for Bandwidth React Apps
SCL is now deprecated in favor of Foundry.
Install the library as an NPM module. npm i --save @bandwidth/shared-components styled-components
styled-componentsis a peer dependency and required for usage
Add the BandwidthProvider to the root of your React component structure:
import { BandwidthProvider } from '@bandwidth/shared-components';
...
<BandwidthProvider>
<MyApp />
</BandwidthProvider>Now you can start including the components in your code. Require them by name from the module root:
import { Button } from '@bandwidth/shared-components'`;As of v6.x, this library no longer loads fonts for you. You must include them in your project yourself.
For your convenience, we've provided a fonts/fonts.css file in the NPM package. You can use it to quickly bootstrap both our brand font (Overpass) and icon font. For instance, if you're using Webpack, you can do:
import '@bandwidth/shared-components/fonts/fonts.css';
anywhere in your project to load the fonts automatically.
Other project types will need to determine how to include the appropriate font files. We provide our icon font files in the /fonts directory, which you may copy as needed. You can get Overpass from Google Fonts.
To develop locally, run npm run start. The docs should then be available at http://localhost:6060. Live reloading, etc should work as well. Alternatively, you can develop against Storybook by running npm run storybook and visiting http://localhost:9001.
Please refer to the contributing guide and read through the pull request template before submitting a PR!
Our docs live on the gh-pages branch. Publishing them is easy - just run the npm run deploy command. It will manage switching branches, copying files and pushing for you.
The source of this library is licensed under the MIT license (see LICENSE)
Bandwidth and the BW logo are trademarks of Bandwidth.com, Inc. Bandwidth reserves all rights to these trademarks, as well as any others that may be included from time to time.