Add a place search box

SearchControl queries the Data API for places, huts, and routes as a reader types. It sits in children rather than behind a flag, because a panel-width bar is not a square chip.

import {
  MapControls,
  MapView,
  MountayaElementsProvider,
  SearchControl,
} from "@mountaya/elements-react";

export const Search = () => (
  <MountayaElementsProvider client={client} map={map}>
    <div style={{ height: 340, position: "relative" }}>
      <MapView center={[6.87, 45.85]} client={client} onReady={setMap} terrain="topo" zoom={12} />
      <MapControls position="top-left" zoom>
        <SearchControl />
      </MapControls>
    </div>
  </MountayaElementsProvider>
);

Without onSelect the control keeps its default: it moves the camera onto the result and drops a pin.

Next steps

Open street view from the map

The other control that takes children.

Maps

The search bar's controlled halves.