Skip to main content
Version: 3.4.2

input

Props#

This component inherits all native TextInput props that come with a standard React Native TextInput element, along with the following:


Reference#

containerStyle#

styling for view containing the label, the input and the error message

TypeDefault
View style (object)none

disabled#

disables the input component

TypeDefault
booleanfalse

disabledInputStyle#

disabled styles that will be passed to the style props of the React Native TextInput (optional)

TypeDefault
Text style (object)none

errorMessage#

adds error message (optional)

TypeDefault
stringnone

errorProps#

props to be passed to the React Native Text component used to display the error message (optional)

TypeDefault
{...Text props}none

errorStyle#

add styling to error message (optional)

TypeDefault
objectnone

InputComponent#

component that will be rendered in place of the React Native TextInput (optional)

TypeDefault
React Native ComponentTextInput

inputContainerStyle#

styling for Input Component Container (optional)

TypeDefault
View style (object)none

inputStyle#

style that will be passed to the style props of the React Native TextInput (optional)

TypeDefault
objectnone

label#

add a label on top of the input (optional)

TypeDefault
string OR React element or componentnone

labelProps#

props to be passed to the React Native Text component used to display the label or React Component used instead of simple string in label prop (optional)

TypeDefault
{...Text props} OR passed component propsnone

labelStyle#

styling for the label (optional); You can only use this if label is a string

TypeDefault
objectnone

leftIcon#

displays an icon on the left (optional)

TypeDefault
{...Icon props}
OR
component
none

leftIconContainerStyle#

styling for left Icon Component container

TypeDefault
View style (object)none

placeholder#

Placeholder text for the input

TypeDefault
stringnone

renderErrorMessage#

If the error message container should be rendered (take up vertical space). If false, when showing errorMessage, the layout will shift to add it at that time.

TypeDefault
booleantrue

rightIcon#

displays an icon on the right (optional)

TypeDefault
{...Icon props}
OR
component
none

rightIconContainerStyle#

styling for right Icon Component container

TypeDefault
View style (object)none

Styles explanation#

Input with a label and an error messageStyles explanation