Textarea
Description
An input where in user can type in long message.
Â
System Dependencies
Installation
The package can be installed via npm:
npm install empower-inputs --save
Standard Textarea
Configuration
import { InputSelectionHandler} from 'empower-inputs';
let [formElement, setFormElement] = useState({
sampleTextarea: {
id: 'sampleTextarea',
type: 'textarea',
value: '',
maxLength: 100,
placeholder: 'Input text',
disabled: false,
required: true,
rows:10,
cols:10
}
});
..............
return (
<>
<h4>TEXTAREA (ALLOW SPECIAL CHAR)</h4>
<InputSelectionHandler
config={formElement.sampleTextareaSpecial}
customClass="textarea-allow-special-custom-class"
onChanged={(e: any) => inputChangedHandler(e, 'sampleTextarea')}
allowedChar={{
alphabet: true,
numeric: true,
space: true,
allowedSymbols: ['&.,']
}}
/>
</>
)
Â
 Properties
Parent Parameter | Sub Parameter | Data Type | Constraint |
---|---|---|---|
config | Â | JSON Object | Required |
 | id | String | Required |
 | type | String | Required |
 | label | String | Optional |
 | value | String | Required |
 | placeholder | String | Optional |
 | maxLength | Integer | Optional |
 | readOnly | Boolean | Optional |
 | required | Boolean | Optional |
 | disabled | Boolean | Optional |
 | rows | Boolean | Required |
 | cols | Boolean | Required |
allowedChar | Â | JSON Object | Optional |
 | alphabet | Boolean | Optional |
 | numeric | Boolean | Optional |
 | space | Boolean | Optional |
 | allowedSymbols | Array (String) | Optional |
customClass | Â | String | Optional |
onChanged | Â | Event Method | Required |
References
Repository Link: https://bitbucket.org/empowerteams/empower-inputs
NPM Package: npm: empower-inputs
Demo Repo: git@bitbucket.org:empowerteams/mfe-sub-application-template.git