This is a library of re-usable React components for use in Brightlayer UI applications. For the most part, these components are meant to simplify building your application by providing drop-in components that implement common use cases in Brightlayer UI and eliminate the need for multiple teams to build their own components for these.
Refer to the Component Library API documentation site for a list of available components and the document for each individual component.
To install the Brightlayer UI react components from NPM as a dependency for your project, you can run the following command in your project root:
yarn add @brightlayer-ui/react-components
NOTE: This install command will install the package from NPM. If you are a Brightlayer UI developer working with components locally, you will want to follow the manual linking instructions - see below.
To work with this library, first clone down the repository and install dependencies:
git clone https://github.com/etn-ccis/blui-react-component-library
cd react-component-library
yarn initialize
The library can be built by running the following command. The resulting output will be in the /dist folder.
yarn build
We recommend using this library in conjunction with @brightlayer-ui/react-themes. If you are using version 6.0.0+ of the Brightlayer UI themes, you must upgrade to at least version 5.1.0 of @brightlayer-ui/react-components, or you may see some unintended default styles on some components.
This repository comes with a demo project found within the /demos
folder.
The Showcase project (from react-showcase-demo) that shows a combination of components in the context of a realistic interface.
The react-showcase-demo is deployed as part of the Brightlayer UI continuous integrations.
The second project found within the /docs folder is the React Component Library API documentation that allows you to see the components in isolation and interact with their properties.
The React Component Library is deployed as part of the Brightlayer UI continuous integrations.
You can build, link, and start the applications in a single step by running
yarn start:showcase
or
yarn start:docs
from the root directory.
See the documentation for information on using these components.
Brightlayer UI libraries will work with any modern browser. For details, please refer to our Browser Support documentation.