Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProAn address search with a main line and a secondary line per suggestion that returns a structured address, shows it as separate fields and keeps an Enter manually way out. Use this when people type a postal address.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it in checkout and onboarding, where typing one line and picking a suggestion is faster than six fields, and where the result must still be six fields in your database.
Do not use it when you need an address validated for delivery. Suggestions come from a lookup service; confirm with your carrier's validation.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
| --------------- | ---------------------------------------------- | -------------- | ----------------------------------------------------------- | ------------------------------------------------------ |
| suggest | (query, { signal }) => Promise<Suggestion[]> | - | Returns suggestions: { id, primary, secondary, address }. |
| value | Address \\ | null | - | The address (controlled). |
| defaultValue | Address \\ | null | null | Initial address. |
| onValueChange | (address: Address \\ | null) => void | - | Runs when a suggestion is picked or a field is edited. |
| debounceMs | number | 300 | Wait after typing. |
| minChars | number | 3 | Do not search for less. |
combobox; suggestions are options with the street as text and the city, region and country on a second line.Searching…, N suggestions, No suggestions.Street, City, Region, Postal code, Country), so people can correct any part and assistive technology can read each.The pattern ships with a Testing Library test (address-autocomplete-structured.test.tsx) that covers searching, picking a suggestion filling the fields, editing a field and the manual path.