react-utils-input/example/src/index.js

Lightweight React Input component, serving as a reusable utility wrapper for HTML Input elements.

import React from 'react';
import ReactDOM from 'react-dom';
import Input from '../../dist/index';
import './style.css';

const Application = () => (
    <div className={'react-utils-bundle-example'}>
        <h2><code>react-utils-input</code></h2>
        <h2><code>{'type="text"'}</code></h2>
        <div className="row">
            <h3> - with <code>placeholder</code></h3>
            <Input placeholder={'Write something ...'} label={'Text label'} labelBefore={true}/>
        </div>

        <h2><code>{'type="checkbox"'}</code></h2>
        <div className="row">
            <h3></h3>
            <Input type="checkbox" id="checkbox-1" defaultChecked={false} label={'Checkbox label'}/>
        </div>

        <h2><code>{'type="radio"'}</code></h2>
        <div className="row">
            <h3></h3>
            <Input type="radio" name="radio-group" label={'Radio 1'}/>
            <Input type="radio" name="radio-group" defaultChecked={true} label={'Radio 2'}/>
        </div>

    </div>
);

ReactDOM.render(
    <Application/>,
    document.getElementById('app')
);