Package Exports
- optimizely-oui
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (optimizely-oui) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
OUI Component Library
A custom CSS framework and React component library that powers the Optimizely user interface.
đ Links
- Storybook
- Archived SASS documentation (requires VPN access)
- latest.css
đŚ Install
git clone https://github.com/optimizely/oui.git
yarn install
yarn storybookĘŚ TypeScript
Typescript types are generated for src/components from their JS files to aid consumption of this repo in Typescript.
The optimizely-oui declaration file (types/templates/module-declaration.d.ts) exports all named component exports.
To build the exported declaration file (types/index.d.ts), the autogenerated individual component module declarations
are merged with the main declaration file (see yarn generate-types).
PropTypes
PropTypes can still be used for non-Typescript (.js) components as well as when more complex validation is needed.
The (babel-plugin-typescript-to-proptypes)[https://www.npmjs.com/package/babel-plugin-typescript-to-proptypes] plugin is used to ensure that all components (typed or not) are exported with PropTypes.
đŞ Contribute
Read how to contribute to OUI for instructions on making pull requests.
đ˘ Release
Check out the Release a New Version section for instructions on releasing a new version of OUI
âĄď¸ React
To use an OUI component inside your React app:
import React from 'react';
import { Button } from 'optimizely-oui';
...
return ( <Button size="tiny">Click Me</Button> );đ Sass
To use OUI Sass variables and mixins in your project read how to use OUI sass.