# Core/TextInput - Usage

TextInput component for single-line text entry. Backwards compatible with Ant Design v5 Input.

:::warning[Internal only]

`TextInput` is not exported from the public `@capra/core` API. For single-line text entry in product code, use [`TextField`](?path=/docs/core-textfield--design).

:::

| Prop | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `appearance` | `(typeof appearances)[number]` | No | `--` | Appearance of the input.<br>@default 'default' |
| `leadingSlot` | `React.ReactNode` | No | `--` | Content before the input (e.g. icon). |
| `size` | `(typeof sizes)[number]` | No | `--` | Size of the input.<br>@default 'md' |
| `trailingSlot` | `React.ReactNode` | No | `--` | Content after the input (e.g. icon or clear button). |
| `className` | `never` | No | `--` | Use `FORCE__className` instead. |
| `style` | `never` | No | `--` | Inline styles are not supported; use component props or `FORCE__className`. |
| `FORCE__className` | `string` | No | `--` | 🚨 This prop is meant to be an escape hatch. 🚨<br><br>If the desired style cannot be achieved using component props, use this as a last resort. The inner workings of Capra components are implementation details and this escape hatch gives one access to those implementation details. We cannot make any guarantees that styles will applied correctly across version updates. Please use it responsibly.<br><br>Add a CSS class to the component. |

Use `layout="vertical"` (default) for label above the field; use `layout="horizontal"` for label on the leading side when space is limited.