Gathering detailed insights and metrics for optimizely-oui
Gathering detailed insights and metrics for optimizely-oui
Installations
npm install optimizely-ouiDeveloper Guide
BETA
Typescript
Yes
Module System
CommonJS
Min. Node Version
>=8.15.1
Node Version
12.4.0
NPM Version
6.9.0
Releases
Unable to fetch releases
Download Statistics
Total Downloads
287,043
Last Day
24
Last Week
94
Last Month
1,564
Last Year
12,913
Bundle Size
1.38 MB
Minified
366.95 kB
Minified + Gzipped
Maintainers
6
Package Meta Information
Latest Version
49.0.0
Package Id
optimizely-oui@49.0.0
Size
3.40 MB
NPM Version
6.9.0
Node Version
12.4.0
Published on
Sep 24, 2021
Total Downloads
Cumulative downloads
Total Downloads
287,043
Last Day
0%
24
Compared to previous day
Last Week
-93.3%
94
Compared to previous week
Last Month
174.4%
1,564
Compared to previous month
Last Year
-22%
12,913
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
31
@optimizely/design-tokens@restart/contextawesome-debounce-promiseclassnamesclipboardcore-jsfile-loaderhighlight.jsimmutablelodashlodash.debouncelodash.noopre-resizablereact-beautiful-dndreact-copy-to-clipboardreact-datesreact-diff-viewerreact-dndreact-dnd-html5-backendreact-dnd-test-backendreact-gh-like-diffreact-immutable-proptypesreact-oui-iconsreact-outside-click-handlerreact-popperreact-tagsinputreact-tippyrecomposestyled-componentssvg-jsx-loadertether
Dev Dependencies
78
@babel/cli@babel/core@babel/plugin-proposal-class-properties@babel/plugin-proposal-decorators@babel/plugin-proposal-object-rest-spread@babel/plugin-syntax-dynamic-import@babel/preset-env@babel/preset-react@babel/preset-typescript@storybook/addon-a11y@storybook/addon-actions@storybook/addon-info@storybook/addon-knobs@storybook/addon-notes@storybook/addon-options@storybook/addon-storysource@storybook/addon-viewport@storybook/react@storybook/theming@types/cheerio@types/classnames@types/enzyme@types/jest@types/lodash@types/reactbabel-corebabel-jestbabel-loaderbabel-plugin-transform-class-propertiesbabel-plugin-typescript-to-proptypescodecovcss-loadercsswhatdeldoctrineenzymeenzyme-adapter-react-16enzyme-to-jsonextract-text-webpack-pluginglamorglobhistoryjestjest-clijest-enzymejs-yamljsonjson-loaderlodash.findmarkedmini-css-extract-pluginmkdirpnearest-coloronchangepostcss-loaderprop-typesreactreact-addons-test-utilsreact-docgenreact-domreact-element-to-jsx-stringreact-gareact-routerreact-test-rendererregenerator-runtimesasssass-lintsass-loaderstandard-versionstorybook-addon-smart-knobsstorybook-chromaticstyle-loadersvg-inline-loadertypescriptwebpackwebpack-cliwebpack-dev-serverwebpack-notifier
Axiom Component Library
A custom CSS framework and React component library that powers the Optimizely user interface.
???? Links
- Component Guide
- Storybook
- Archived SASS documentation (requires VPN access)
- styles.css (latest compiled stylesheet for Axiom)
???? Installation
1npm install optimizely-oui
1yarn add optimizely-oui
ʦ 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 Axiom for instructions on making pull requests.
???? Release
Check out the Release a New Version section for instructions on releasing a new version of Axiom.
⚡️ React
To use an Axiom component inside your React app:
1import React from 'react'; 2import { Button } from 'optimizely-oui'; 3... 4return ( <Button size="tiny">Click Me</Button> );
???? Testing
Thanks to Chromatic, Axiom runs visual regression tests on every pull request and merge. These tests are snapshots of each Storybook story within the repository. For implementation details, see the Chromatic section of the contributing guidelines.
???? Sass
To use Axiom Sass variables and mixins in your project read how to use Axiom sass.
No vulnerabilities found.
No security vulnerabilities found.