Input

A versatile text input for React Native with label, helper text, error states, disabled, required, and button group variants.

componentUI ComponentsExpo SDK 52Free

Preview

Interactive

9:41

Basic Input

Tap any input to start typing

Switch tabs to explore input variants and states

Usage

No additional packages requiredZero deps

Built with React Native core only — no third-party UI library required.

Examples

A plain TextInput — no label, no frills. Pass placeholder and onChangeText to get started.

tsx

import { TextInput, StyleSheet } from 'react-native'';<TextInput  style={styles.input}  placeholder="Enter something...""  value={value}  onChangeText={setValue}/>const styles = StyleSheet.create({  input: {    height: 44,    borderWidth: 1,    borderColor: '#d1d5db'',    borderRadius: 10,    paddingHorizontal: 12,    fontSize: 14,    color: '#111'',    backgroundColor: '#fff'',  },});

Overview

A fully accessible TextInput wrapper built with NativeWind. Supports labels, helper text, inline validation errors, disabled states, required field marking, and composable button group patterns for search bars and invite flows.