ui-textinput
Text input as part of a larger web UI component
Installation
$ npm install ui-textinput --save-dev
Usage
const Textinput = ;const textinputOptions = // Set up options here (see below); const firstNameField = textInputOptions;someContainerElement;firstNameField;
Options
Type: {Object}
type
Type: {String}
Optional. Default: text
.
Reflects the type
attribute of <input>
element.
As of now, there is only support for text
.
width
Type: {String}
Optional. Default: 100%
.
Sets the width of the input element.
tabindex
Type: {Integer}
The value of tabindex
attribute to be set for the DOM element. Default: 0
.
validator
Type: {Function}
A function that will be used to validate the element's current value. Any truthy value returned by the function will mean the element's value is valid. Any falsy value returned by the function will mean the element's value is NOT valid.
If omitted, all element's values are treated as valid.
When called, the function will be passed the following arguments:
{String} val
- Current element's value
onValueChange
Type: {Function | Array<Function>}
Callback function(s) that will be called every time the value of the element changes.
When called, the function will be passed the following arguments:
{String} val
- New value of the element.
onValidationStatusChange
Type: {Function | Array<Function>}
Callback function(s) that will be called every time the validation status of the element changes.
When called, the function will be passed the following arguments:
{Boolean} isValid
- New validation status.
API
Properties
element
Type: {HTMLInputElement}
Returns reference to the DOM node created by the constructor.
isValid
Type: {Boolean}
Returns the current validation status of the element.
Methods
focus()
Sets input focus on the element.
Return: {undefined}
setValue(val)
Sets the element's value.
Parameters:
{String} val
- New value
Return: {undefined}
getValue()
Gets the current value of the element.
Return: {String}
enable()
Enables the input field.
Return: {undefined}
disable()
Disables the input field.
Return: {undefined}