<commit_before>---
id: input
title: Input
---

Inputs allow users to enter text into a UI. They typically appear in forms and
dialogs.

<img src="/react-native-elements/img/input.png" width="300"/>

## Usage

```js
import Icon from 'react-native-vector-icons/FontAwesome';
import { Input } from 'react-native-elements';

<Input
  placeholder='BASIC INPUT'
/>

<Input
  placeholder='INPUT WITH ICON'
  leftIcon={{ type: 'font-awesome', name: 'chevron-left' }}
/>

<Input
  placeholder='INPUT WITH CUSTOM ICON'
  leftIcon={
    <Icon
      name='user'
      size={24}
      color='black'
    />
  }
/>

<Input
  placeholder='INPUT WITH SHAKING EFFECT'
  shake={true}
/>

<Input
  placeholder='INPUT WITH ERROR MESSAGE'
  errorStyle={{ color: 'red' }}
  errorMessage='ENTER A VALID ERROR HERE'
/>
```

---

## Props

> This component inherits
> [all native TextInput props that come with a standard React Native TextInput element](https://facebook.github.io/react-native/docs/textinput.html),
> along with the following:

- [`containerStyle`](#containerstyle)
- [`inputContainerStyle`](#inputcontainerstyle)
- [`errorMessage`](#errormessage)
- [`errorStyle`](#errorstyle)
- [`errorProps`](#errorprops)
- [`inputComponent`](#inputComponent)
- [`inputStyle`](#inputstyle)
- [`label`](#label)
- [`labelStyle`](#labelStyle)
- [`labelProps`](#labelprops)
- [`leftIcon`](#lefticon)
- [`leftIconContainerStyle`](#lefticoncontainerstyle)
- [`rightIcon`](#righticon)
- [`rightIconContainerStyle`](#righticoncontainerstyle)
- [`shake`](#shake)

---

## Reference

### `containerStyle`

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

|        Type         | Default |
| :-----------------: | :-----: |
| View style (object) |  none   |

---
<commit_msg>docs(Input): Fix anchor tags for some props (#1789)<commit_after>---
id: input
title: Input
---

Inputs allow users to enter text into a UI. They typically appear in forms and
dialogs.

<img src="/react-native-elements/img/input.png" width="300"/>

## Usage

```js
import Icon from 'react-native-vector-icons/FontAwesome';
import { Input } from 'react-native-elements';

<Input
  placeholder='BASIC INPUT'
/>

<Input
  placeholder='INPUT WITH ICON'
  leftIcon={{ type: 'font-awesome', name: 'chevron-left' }}
/>

<Input
  placeholder='INPUT WITH CUSTOM ICON'
  leftIcon={
    <Icon
      name='user'
      size={24}
      color='black'
    />
  }
/>

<Input
  placeholder='INPUT WITH SHAKING EFFECT'
  shake={true}
/>

<Input
  placeholder='INPUT WITH ERROR MESSAGE'
  errorStyle={{ color: 'red' }}
  errorMessage='ENTER A VALID ERROR HERE'
/>
```

---

## Props

> This component inherits
> [all native TextInput props that come with a standard React Native TextInput element](https://facebook.github.io/react-native/docs/textinput.html),
> along with the following:

- [`containerStyle`](#containerstyle)
- [`inputContainerStyle`](#inputcontainerstyle)
- [`errorMessage`](#errormessage)
- [`errorStyle`](#errorstyle)
- [`errorProps`](#errorprops)
- [`inputComponent`](#inputcomponent)
- [`inputStyle`](#inputstyle)
- [`label`](#label)
- [`labelStyle`](#labelstyle)
- [`labelProps`](#labelprops)
- [`leftIcon`](#lefticon)
- [`leftIconContainerStyle`](#lefticoncontainerstyle)
- [`rightIcon`](#righticon)
- [`rightIconContainerStyle`](#righticoncontainerstyle)
- [`shake`](#shake)

---

## Reference

### `containerStyle`

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

|        Type         | Default |
| :-----------------: | :-----: |
| View style (object) |  none   |

---

{'fraction_non_alphanumeric': 0.18003365114974762, 'fraction_numerical': 0.003925967470555244, 'mean_word_length': 4.052407932011332, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 23, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3163297', 'n_tokens_mistral': 1175, 'n_tokens_neox': 1126, 'n_words': 269}