The Places Autocomplete Svelte component is highly configurable through a set of properties
(props) and a nested options object.
This guide provides a detailed reference for each available prop, enabling you to tailor the
component to your specific needs.
These are the primary props passed directly to the PlaceAutocomplete component.
PUBLIC_GOOGLE_MAPS_API_KEY (Required)Type: string
Your Google Maps API Key with Places API enabled. Not required if the loader has been initialised in a parent component.
onResponse (Required)Type: (response: PlaceResult) => void
Callback function triggered with the selected place details (PlaceResult object) after fetchFields is complete.
onError (Required)Type: (error: string) => void
Callback function triggered when an error occurs (API loading, fetching suggestions, fetching details).
requestParams Type: Partial<RequestParams>
Default: { inputOffset: 3, ... }
Parameters for the Autocomplete request. See AutocompletionRequest options.
fetchFields Type: string[]
Default: ['formattedAddress', 'addressComponents']
Array of Place Data Fields to request when a place is selected. Affects API cost.
options Type: Partial<ComponentOptions>
Default: { debounce: 100, ... }
Options to control component behavior and appearance. See details below.
The options prop accepts an object
to control finer details of the component's behavior and appearance.
placeholderType: string
Default: ''
Placeholder text for the input field.
debounceType: number
Default: 100
Delay in milliseconds before triggering autocomplete API request after user stops typing. Set to 0 to disable debouncing.
distanceType: boolean
Default: true
Show distance from requestParams.origin in suggestions (if origin is provided).
distance_unitsType: 'km' | 'miles'
Default: 'km'
Units to display distance in.
labelType: string
Default: ''
Optional label text displayed above the input field.
autofocusType: boolean
Default: false
Automatically focus the input field on mount.
autocompleteType: string
Default: 'off'
Standard HTML autocomplete attribute for the input field.
classesType: Partial<ComponentClasses>
Default: {}
Object to override default CSS classes for various component parts. See Styling
clear_inputType: boolean
Default: true
If `true` (default), clears the input field after a suggestion is selected. If `false`, the input field retains the `formattedAddress` of the selected place.