pretty-checkbox-react v3.2.0

Demos and Docs

Checkout the awesome doc website with sweet code examples that will update in real time after you make changes!

Code Sandbox

Fancy something else? Want a standalone example? Looking for customize the pretty-checkbox theme? How about forking and testing your own changes in code sandbox? It will allow you to prototype and make complex examples all within your browser.

Browser

Include the script file and all dependencies.

Note: keep reading for examples using webpack/rollup/or some other modern web bundler.

<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 or reference the CSS manually!

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 :star:

License

This project is licensed under the MIT License