FormsFree

Input Group

Groups an input with leading/trailing addons — icons, buttons, or text.

Usage

bash

npm install @wunderui/react

Then import what you need:

tsx

import { InputGroup, InputGroupAddon } from "@wunderui/react"

Leading icon, trailing badge, text prefix — one border, one focus ring.

⌘K

https://

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

A code field with an icon and an Apply button inside one border; a valid code lowers the total.

Order summary

2 items · try the code FALL20

Subtotal$827

Total$827

Prop	Type	Default
className	string	—