React Material Inputs

Installation

npm i material-react-input-text-field

Usage

import InputField from 'material-react-input-text-field'

const App = () => {

    const [name, setName] = useState('')
    const handleChange = (value) => {
        setName(value)
    }

    return (
        <div>
            <h1>React-material InputField</h1>
            <h3>Examples:</h3>
            <div className={styles.examples}>
                <div>
                    <InputField
                        value={name}
                        placeHolder="Standard"
                        handleChange={handleChange}
                    />
                </div>
                <div>
                    <InputField
                        value="terry"
                        placeHolder="Filled"
                        variant="filled"
                    />
                </div>
            </div>
            <div>
                {name && `hi, ${name}`}
            </div>
        </div>
    )

};

Overview

|Name|Description| | -- | -- | |value|Can Controlled or Uncontrolled component| |placeHolder|just input placeholder| |handleChange|handle input change event| |variant|now have "standard", "filled"| |...rest|you can add any type of attributes if you want|