Components

Address Autocomplete

Note The process.env.GOOGLE_MAPS_API_KEY parameter does NOT get exposed to the client-side nor is it sent to our servers. The key is only used in your backend environment.

Usage

const googleMapsResult = await io.input.address('Customer address', process.env.GOOGLE_MAPS_API_KEY, {
  pick: (result) => result.description
})

console.log(googleMapsResult) // '1600 Amphitheatre Pkwy, Mountain View, CA 94043'

Parameters

labelrequired
string

The label to render above the input.

googleMapsApiKeyrequired
string

A Google Maps API key.

options { ... }
pick
(result: GoogleMapsAutocompleteResult) => result

A synchronous function used to format the result before it is resolved. The function takes the GoogleMapsAutocompleteResult and outputs any result.

disabled
boolean

Disables user input. Default false.

selectionAppearance
'text-input' | 'option'

Rendering mode for selected option(s). Default 'text-input'.

help
string

The small help text to render below the input. Default undefined.

placeholder
string

The placeholder to render within the input. Default undefined.

customValidator
(input: unknown) => Promise<string | true>

An asynchronous function that takes unknown input and outputs either true or an error message string to show the user.

Server

Autocomplete