TextField

Text fields let users enter and edit text. Follows the Material Design 3 Text Field specification.

Usage

import { TextField } from '@onlynative/components/text-field'

const [value, setValue] = useState('')

<TextField
  label="Email"
  value={value}
  onChangeText={setValue}
/>

Variants

Variant	Description
filled	Filled container with bottom border (default)
outlined	Outlined border around the field

<TextField label="Name" variant="filled" />
<TextField label="Name" variant="outlined" />

With Icons

<TextField
  label="Search"
  leadingIcon="magnify"
  trailingIcon="close"
  onTrailingIconPress={() => setValue('')}
/>

Validation

<TextField
  label="Email"
  value={email}
  onChangeText={setEmail}
  error={!isValid}
  errorText="Please enter a valid email address"
  supportingText="We'll never share your email"
/>

Props

No props found for TextField.