TextField

A SwiftUI TextField component for text input.

iOS

tvOS

GitHub

npm

Changelog

Bundled version:

~55.0.10

A text field component that allows users to enter and edit text.

Installation

Terminal

- npx expo install @expo/ui

If you are installing this in an existing React Native app, make sure to install expo in your project.

Usage

import { Host, TextField } from '@expo/ui/swift-ui';

<Host matchContents>
  <TextField autocorrection={false} defaultValue="A single line text input" onChangeText={setValue} />
</Host>

See official SwiftUI documentation for more information.

API

import { TextField } from '@expo/ui/swift-ui';

Component

`TextField`

iOS

tvOS

Type: React.Element<TextFieldProps>

Renders a SwiftUI TextField.

TextFieldProps

`autoFocus`

iOS

tvOS

Optional • Type: boolean • Default: false

If true, the text field will be focused automatically when mounted.

`axis`

iOS

tvOS

Optional • Literal type: string • Default: 'horizontal'

The axis along which the text field grows when content exceeds a single line.

'horizontal' — single line (default).
'vertical' — expands vertically for multiline content. Use lineLimit modifier to cap visible lines.

Acceptable values are: 'horizontal' | 'vertical'

`defaultValue`

iOS

tvOS

Optional • Type: string

Initial value displayed when mounted. Uncontrolled — change key to reset.

`onFocusChange`

iOS

tvOS

Optional • Type: (focused: boolean) => void

A callback triggered when the field gains or loses focus.

`onSelectionChange`

iOS 18.0+ tvos 18.0+

Optional • Type:

({ start, end }: {
  end: number, 
  start: number
}) => void

A callback triggered when user selects text in the TextField.

`onValueChange`

iOS

tvOS

Optional • Type: (value: string) => void

A callback triggered when the text value changes.

`placeholder`

iOS

tvOS

Optional • Type: string

A text that is displayed when the field is empty.

`ref`

iOS

tvOS

Optional • Type: Ref<TextFieldRef>

Inherited Props

CommonViewModifierProps

Types

`TextFieldRef`

iOS

tvOS

Can be used for imperatively setting text and focus on the TextField component.

Property	Type	Description
blur	`() => Promise<void>`	-
focus	`() => Promise<void>`	-
setSelection	`(start: number, end: number) => Promise<void>`	Only for: iOS 18.0+ tvos 18.0+ Programmatically select text using start and end indices.
setText	`(newText: string) => Promise<void>`	-