---
title: TextInput
description: >-
  A wrapper around the base Input that automatically adjusts the layout to keep
  the focused field visible when the on-screen keyboard appears.
source_url:
  html: 'https://shopify.dev/docs/api/shop-minis/components/primitives/textinput'
  md: 'https://shopify.dev/docs/api/shop-minis/components/primitives/textinput.md'
---

# TextInput

A wrapper around the base Input that automatically adjusts the layout to keep the focused field visible when the on-screen keyboard appears. Accepts standard HTML input props (`value`, `onChange`, `placeholder`, `type`, etc.).

Examples

## Preview

![textinput](https://shopify.dev/assets/assets/images/templated-apis-screenshots/shop-minis/TextInput-CXFoQtDo.png)

### Examples

* ####

  ##### tsx

  ```tsx
  import {TextInput} from '@shopify/shop-minis-react'

  export default function MyComponent() {
    return <TextInput placeholder="Enter your name" />
  }
  ```

***