lucid

A UI component library from AppNexus.

Showing:

Popularity

Downloads/wk

37

GitHub Stars

188

Maintenance

Last Commit

6d ago

Contributors

107

Package

Dependencies

15

Size (min+gzip)

142.6KB

License

Apache-2.0

Type Definitions

Tree-Shakeable

No?

Categories

Readme

Lucid codecov

A UI component library from AppNexus.

Install

Lucid can be installed with npm

  npm install --save lucid-ui

or yarn

  yarn add lucid-ui

Usage

  import React from 'react';
  import ReactDOM from 'react-dom';
  import { Button } from 'lucid-ui';

  ReactDOM.render(
    <Button>Hello World</Button>,
    mountNode
  );

Lucid uses less for its stylesheets. If you use less, you can include the styles like so:

@import "node_modules/lucid-ui/src/index.less";

If you don't use less, you can use the precompiled css file node_modules/lucid-ui/dist/lucid.css.

Custom CSS Scope

There are some very rare situations where you might need to customize the prefix for all the css class names emitted by the library and less. If you find yourself in that unenviable position, you can do the following:

In your webpack config use the DefinePlugin to specify LUCID_CSS_NAMESPACE like so:

new webpack.DefinePlugin({
  LUCID_CSS_NAMESPACE: "'something-custom'",
});

When you render the less, make sure to set the prefix variable to the same thing you set in in your webpack config. E.g.

lessc node_modules/lucid-ui/src/index.less --modify-var='prefix=something-custom'

Dependencies

lucid-ui has several React peer dependencies. This means your application is responsible for declaring dependencies on compatible versions. Currently we support React 15 and 16.

Example package.json:

  {
    "dependencies": {
      "lucid-ui": "^5.0.0",
      "react": "^16.0.0",
      "react-dom": "^16.0.0",
    }
  }

To contribute to lucid, please see CONTRIBUTING.md.

Credits

  • BrowserStack for providing cross-browser testing infrastructure.
  • Travis CI for providing continuous integration infrastructure.
  • CodeCov for providing code coverage analysis infrastructure.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100