---
url: "https://vueda.dev/v3/reference/theming/keys/InputGroupInput.md"
title: "InputGroupInput"
---

# InputGroupInput

Source: `client/lib/theme/vueda-tailwind/controls/index.js`

> The text-input child inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root). Strips its own border, shadow, and focus ring so the surrounding group owns the chrome; flexes to fill the remaining row, and overrides the standalone [Input](/v3/reference/theming/keys/Input.md) dark-mode tint with `dark:bg-transparent` so the group's tint is the only one painted. The important shadow reset suppresses the standalone bottom line and its focus and invalid variants, keeping the group as the only edge in every state.

Vue component: [InputGroupInput](/v3/reference/api/vue/InputGroupInput.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/InputGroupInput.md#theme-key-InputGroupInput-root) | `flex-1 rounded-none border-0 bg-transparent !shadow-none dark:bg-transparent` | The text-input child inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root). Strips its own border, shadow, and focus ring so the surrounding group owns the chrome; flexes to fill the remaining row, and overrides the standalone [Input](/v3/reference/theming/keys/Input.md) dark-mode tint with `dark:bg-transparent` so the group's tint is the only one painted. The important shadow reset suppresses the standalone bottom line and its focus and invalid variants, keeping the group as the only edge in every state. |

<a id="theme-key-InputGroupInput-root"></a>

## root

> The text-input child inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root). Strips its own border, shadow, and focus ring so the surrounding group owns the chrome; flexes to fill the remaining row, and overrides the standalone [Input](/v3/reference/theming/keys/Input.md) dark-mode tint with `dark:bg-transparent` so the group's tint is the only one painted. The important shadow reset suppresses the standalone bottom line and its focus and invalid variants, keeping the group as the only edge in every state.

Default classes:

`flex-1 rounded-none border-0 bg-transparent !shadow-none dark:bg-transparent`

Source: `client/lib/theme/vueda-tailwind/controls/InputGroupInput.theme.js:17`