`<SearchBox />`

Location search input. Uses Nominatim to find places, flies the map to the result.

Usage

<Map center={...} zoom={10}>
  <SearchBox
    onSelect={(location) => console.log(location)}
    placeholder="Search a city..."
  />
</Map>

Props

Prop	Type	Default	Description
`onSelect`	`(loc: Location) => void`	—	Called when user picks a result
`placeholder`	`string`	`"Search location..."`	Input placeholder text

type Location = {
  name: string
  lat: number
  lon: number
}

Behaviour

User types in the input
Requests are debounced (waits for user to stop typing)
Calls Nominatim with the search query
Shows a dropdown of results
On selection — map flies to the location, onSelect is called

Notes

Must be a child of <Map />
Nominatim is rate limited to 1 req/sec — the debounce handles this
Not suitable for high-traffic production use — fine for personal/test projects
No API key required

Nominatim API — the geocoding service powering search
Map — parent component