AddressField

A studio's address, found by its name: type the shop or a street and the places that match drop down under the field; pick one and its exact address fills it. Whatever's typed is kept too, as a plain field would. Places come from Google Maps through Okami's own route, so the key never reaches the page.

Playground

Try “pele” or “barber”.

import { AddressField } from "@/components/shared/address-field";

<AddressField
  label="Address"
  optional="optional"
  placeholder="Your shop's name or street"
  saved={address}
  locale="en"
  onCommit={(raw) => (setAddress(raw), null)}
/>

Field

Placeholder

Saved

API

Prop	Type	Default	Description
label / optional / placeholder	string	—	The field's words, in the owner's language.
saved	string	—	The address saved; shown until the owner types.
locale	string	—	The owner's language, for the places' names.
onCommit	(raw) => string \| null	—	Saves what's typed (on leaving the field) or picked; a problem comes back as its message.
ask	typeof askPlaces	Okami's /api/places	Where places come from. The catalog's are made up, so it never asks Google.

Rules

Google is asked once typing rests (250 ms) and three letters are in; only the newest answer shows.
One owner's typing and pick are one Google session, billed once; the pick closes it.
The list credits Google Maps at its foot with Google's own logo (GoogleMapsLogo): Google's terms ask it of places shown without its map.
No key, a limit reached, Google down: no list, and the field is a plain one.