{"repo":"lifeomic/chroma-react","free":true,"listed":false,"github":"https://github.com/lifeomic/chroma-react","clone":"git clone https://github.com/lifeomic/chroma-react.git","description":"Open source design system from LifeOmic, built with React","language":"TypeScript","stars":47,"topics":["react","reactjs","ui-library","accessible","a11y","react-components","material-ui","uikit","typescript","storybook"],"license":"MIT","category":"ui-components","readme_excerpt":"Chroma React Chroma is an open source design system from the team at LifeOmic. It is built with React and TypeScript. The goal of Chroma is to provide design-approved components to developers to speed up their development process and build visual consistency throughout web applications. View our Storybook Usage To get started with Chroma, follow these steps: 1. Install dependencies Chroma leverages @material-ui/styles for CSS-in-JS and react-router-dom for link-related components. 2. Wrap your application with the StyledEngineProvider and ThemeProvider provided by Chroma. 3. Start using components! 4. Add jest config (optional) To include the jest configuration setup, add the following: Note : Some components may require support for CSS imports (e.g. import 'some-module/styles.css ). All major bundlers can support this behavior (example: webpack's css-loader). Theming Want to override the default theme of Chroma? No problem! 1. Create your component-level overrides and palette overrides. Chroma leverages Material-UI's global theme variation to override specific component styles. 2. Update your theme provider. Importing Component Styles Only? Need to build a custom component, but want to use the styles hook of an existing Chroma component? Development Getting Started First you'll need to install the dependencies for the repository. Running Storybook To run the Storybook for Chroma, run the following command. After some time, the Storybook will open. Any local changes made will","default_branch":null,"files":null,"tree":[],"storefront":"/r/lifeomic","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/lifeomic/chroma-react/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}