GeocodingInput
Searches an address with a geocoding provider and writes the result the user picks to the form: its name to source, its latitude to latSource, its longitude to lngSource and its box to bboxSource, when the result has one. A provider that allows typeahead searches as the user types, after debounceMs; any other searches on Enter or on the Search button. Text typed by hand is saved when the field loses focus and clears latSource, lngSource and bboxSource, so they never describe a different address. Needs a provider, from provider or MapsProvider.
Searches an address with a geocoding provider and writes the result the user picks to the form: its name to source, its latitude to latSource, its longitude to lngSource and its box to bboxSource, when the result has one. A provider that allows typeahead searches as the user types, after debounceMs; any other searches on Enter or on the Search button. Text typed by hand is saved when the field loses focus and clears latSource, lngSource and bboxSource, so they never describe a different address. Needs a provider, from provider or MapsProvider.
Installation
import { GeocodingInput } from "@chelone/react/maps/osm";See the maps guide for the subpaths, the optional packages and MapsProvider.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| bboxSource | SourceProp<TRecord> | — | Written with the picked result's `[west, south, east, north]`, when it has one. |
| className | string | — | |
| countryCodes | string[] | — | |
| debounceMs | number | — | Typeahead providers only: wait after the last key. Defaults to 300. |
| disabled | boolean | — | |
| label | string | false | — | A string is translated; `false` renders none. Defaults to the label of `source`. |
| latSource | SourceProp<TRecord> | — | Written with the picked result's latitude. Left alone when unset. |
| limit | number | — | |
| lngSource | SourceProp<TRecord> | — | Written with the picked result's longitude. Left alone when unset. |
| minChars | number | — | Shortest trimmed query that searches. Defaults to 3. |
| placeholder | string | — | Defaults to `chelone.map.search_placeholder`. |
| provider | GeocodingProvider | — | Defaults to the `geocoder` of `MapsProvider`. One of the two is required. |
| source | SourceProp<TRecord> | — | The form field holding the address text. |
| viewBox | LngLatBox | — |