@hawk-ui/input

Installation

#### To install a component run
$ npm install @hawk-ui/input --save

#### Please import CSS styles via
``scss noeditor
@import '/path__to__node_modules/@hawk-ui/input/dist/index.min.css
`

Usage


#### Without Label and Without Required:
Demo
`js static
import Input from '@hawk-ui/input';
`
`js
initialState = {
value: '',
};

type="text"
value={state.value}
onChange={(event) => {
setState({
value: event.target.value,
});
}}
onEnter={(value) => {
alert(value);
}}
placeholder="Enter Username"
description="This is user input"
/>
`


#### With Copy
Demo
`js static
import Input from '@hawk-ui/input';
`
`js
initialState = {
value: '',
};

type="text"
value={state.value}
id="copy"
isCopyable
onChange={(event) => {
setState({
value: event.target.value,
});
}}
onEnter={(value) => {
alert(value);
}}
placeholder="Enter Username"
/>
`


#### With Password Visible
Demo
`js static
import Input from '@hawk-ui/input';
`
`js
initialState = {
value: '',
};

type="password"
value={state.value}
isPasswordVisible
onChange={(event) => {
setState({
value: event.target.value,
});
}}
onEnter={(value) => {
alert(value);
}}
placeholder="Enter Username"
/>
`


#### With Label and With Required
Demo
`js static
import Input from '@hawk-ui/input';
`
`js
initialState = {
value: '',
};

type="text"
onChange={(event) => {
setState({
value: event.target.value,
});
}}
onEnter={(value) => {
alert(value);
}}
placeholder="Enter Username"
label="Username"
isRequired
isError
errorMessage="This field is a compulsory field."
/>
`


#### Textarea With Label
Demo
`js static
import Input from '@hawk-ui/input';
`
`js
initialState = {
value: '',
};

type="text"
isTextarea
htmlAttributes={{
rows: '3',
cols: '30',
}}
onChange={(event) => {
setState({
value: event.target.value,
});
}}
onEnter={(value) => {
alert(value);
}}
placeholder="Enter Address"
label="Address"
/>
``