React-wired-element NPM

react-wired-element

How to Use

npm i react-wired-element

And in your JavaScript or TypeScript file:

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import {WiredCard, WiredCombo, WiredInput,
    WiredItem, WiredButton, WiredCheckbox,
    WiredIconButton, WiredListbox, WiredProgress,
    WiredRadio, WiredRadioGroup, WiredSlider,
    WiredTextarea, WiredToggle} from "react-wired-element";

ReactDOM.render(
    <section>
        <WiredCard elevation={5}>
            <h1>Test</h1>
            <br /><br />
            <WiredCombo selected="A">
                <WiredItem text="A" value="A" />
                <WiredItem text="B" value="B" />
            </WiredCombo>
            <br /><br />
            <WiredInput placeholder="input" />
            <br /><br />
            <WiredButton>
                WiredButton
            </WiredButton>
            <br /><br />
            <WiredCheckbox text="checkbox one"/>
            <WiredCheckbox text="checkbox two" checked={true}/>
            <br /><br />
            <WiredIconButton>home</WiredIconButton>
            <br /><br />
            <WiredListbox>
                <WiredItem text="A" value="A" />
                <WiredItem text="B" value="B" />
            </WiredListbox>
            <br /><br />
            <WiredProgress value={10} min={5} max={15}/>
            <br /><br />
            <WiredRadioGroup selected="three">
                <WiredRadio text="Radio One" name="one" />
                <WiredRadio text="Radio disabled" disabled={true} name="two"/>
                <WiredRadio text="Radio Three" name="three"/>
            </WiredRadioGroup>
            <br /><br />
            <WiredSlider knobradius={15} value={10} min={5} max={15} />
            <br /><br />
            <WiredTextarea placeholder="Enter text" rows={4} />
            <br /><br />
            ZH&nbsp;&nbsp;<WiredToggle />&nbsp;&nbsp;EN
            <br /><br />
            <WiredButton>Hi</WiredButton>
        </WiredCard>
    </section>
, document.getElementById('root'));

Notice

This package support TypeScript by itself.You didn't need to install type define. So as you can see, this package is very good for TypeScript support.
This package is based on wired-element, and support React. Any question or issue you may have to visit wired-element.