JSPM – pretty-checkbox-react@0.0.8

Package Exports

pretty-checkbox-react

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 (pretty-checkbox-react) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Quickly integrate pretty checkbox Components (checkbox, switch, radio) with React

Demo and documentation
https://atomicpages.github.io/pretty-checkbox-react/

Browser

Include the script file and then the component:

<script type="text/javascript" src="node_modules/react/umd/react.production.min.js"></script>
<script type="text/javascript" src="node_modules/react-dom/umd/react-dom.production.min.js"></script>
<script type="text/javascript" src="node_modules/pretty-checkbox-react/dist/pretty-checkbox-react.min.js"></script>

<script type="text/javascript">
function App() {
    return React.createElement(
        PrettyCheckboxReact.Checkbox,
        {
            animation: 'smooth',
            shape: 'curve'
        },
        React.createElement(
            'label',
            null,
            'Check me!'
        )
    )
}

ReactDOM.render(App, document.querySelector('body'));
</script>

Webpack + Rollup

If you're using webpack or rollup then with JSX you can write this more succulently:

import React from 'react';
import ReactDOM from 'react-dom';

import { Checkbox } from 'pretty-checkbox-react';

function App() {
    return <Checkbox animation="smooth" shape="curve">Check me!</Checkbox>;
}

ReactDOM.render(App, document.querySelector('body'));

Getting Started

Install pretty-checkbox and pretty-checkbox-react through NPM or yarn:

yarn pretty-checkbox pretty-checkbox-react # or
npm i pretty-checkbox pretty-checkbox-react --save

pretty-checkbox is a peer dependency so you need to install it yourself!

Make the dependencies available and begin using! pretty-checkbox-react exposes three components for your use:

Checkbox
Radio
Switch

Contributions

Shout out to Lokesh for creating the original pretty-checkbox library!

License

This project is licensed under the MIT License