Get started

Show a map with controls props

The generated props of every element on Show a map with controls. The guide is where they are explained; this is the whole surface.

MapView

children

ReactNode

The controls, panels and elements to place on the map, rendered inside its container once the map is ready.

They render under a MountayaElementsProvider that states this map, and this map's client where no enclosing provider states one, so <MapView client={client}><MapControls zoom /></MapView> needs no state and no onReady. Everything else is the enclosing provider's. A control placed outside the map takes the map from onReady through a provider of its own.

A map whose first style never loads renders none of them, so a way out of that failure (a retry, another terrain) sits outside the map and hears of it through onError.

client

MountayaMapOptions["client"]

required

The client this map fetches its specifications through, and the client the children read where no enclosing provider states one.

A seed, read once as the map is built: the map reads the credential it holds at each request, so a session token that rotates needs nothing here, and a map over another client is remounted with a key.

credential

MountayaMapOptions["credential"]

Overrides the credential MapLibre attaches to its own tile, sprite and glyph requests.

Its session token is followed: the one this prop holds at each request goes out, and a render that omits the prop keeps the last one. The key, the share token and the cookie flag are a seed, read once as the map is built, and a map built with others is remounted with a key.

center

MountayaMapOptions["center"]

Where the camera opens, as [longitude, latitude].

A seed, read once as the map is built, as the whole opening pose is: from there the camera is the reader's, and the map onReady hands you moves it.

zoom

MountayaMapOptions["zoom"]

The zoom the camera opens at. A seed, read once as center is.

bearing

MountayaMapOptions["bearing"]

The compass bearing the camera opens at, in degrees clockwise from north. A seed, read once as center is.

pitch

MountayaMapOptions["pitch"]

The tilt the camera opens at, in degrees off vertical. A seed, read once as center is.

geolocation

MountayaMapOptions["geolocation"]

Where a device fix comes from: a native shell's, or inertGeolocation for a product that locates nobody.

A seed, read once as the map is built: a map served by another seam is remounted with a key. A seam written inline is no change.

maplibre

MountayaMapOptions["maplibre"]

MapLibre's own options, handed to it as written.

A seed, read once as the map is built: a map built with others is remounted with a key. An object written inline is no change, a callback among its members included.

mapStyle

MountayaMapOptions["style"]

A complete map style to start on, instead of a terrain from the layers manifest.

A seed, read once as the map is built: a map that starts on another style is remounted with a key, and setStyle on the map switches it afterwards.

paint

MountayaMapOptions["paint"]

Overrides for what the map draws: the itinerary stroke, its casing, the layer ranks.

It cannot be a --mtya-* token: MapLibre evaluates paint expressions inside its own renderer against no DOM element, so a var(--mtya-accent) arrives as a string it cannot read. The tokens theme the chrome around the canvas; this themes what is drawn in it.

Folded per key, so { itinerary: { casingColor: "#f8f9fa" } } changes the halo and leaves every width stop, dash and stacking rank where they were. A seed, read once as the map is built: a map painted otherwise is remounted with a key.

markerIcons

IconProvider

The glyph set the markers this map draws take their glyphs from.

A seed, read once as the map is built.

terrainVariant

MountayaMapOptions["terrainVariant"]

The rendition of the catalogue terrain the base map draws, as the layers manifest lists it.

The terrain's own light or dark variant, which is the application's choice and is never read off the page's colour scheme or data-mtya-color-scheme: a dark interface over a light base map is a legitimate product. Followed after mount: a new value switches the rendition in place, and a render that omits it changes nothing.

terrain

MountayaMapOptions["terrain"]

The slug of the catalogue terrain the base map draws.

Followed after mount: a new slug switches the base map in place, and a render that omits it changes nothing. A slug the manifest does not list reaches onError.

language

MountayaMapOptions["language"]

The language labels are drawn in.

Followed after mount, and a render that omits it changes nothing.

constraints

MountayaMapOptions["constraints"]

The limits the camera may not leave: a zoom floor and ceiling, and a boundary.

Followed after mount, compared by its members so an object written inline changes nothing, and a render that omits it changes nothing. A boundary or a zoom window the map cannot hold throws MountayaElementsError to the nearest error boundary, at mount as after it.

transformRequest

MountayaMapOptions["transformRequest"]

Replaces the transform the map derives from its client and its credential, for every request MapLibre makes.

Whether one is supplied at mount decides, for the map's life, whether it replaces the derived transform: a transform first supplied on a later render is ignored, and a map that takes one from then on is remounted with a key. The prop is then read at each request, so a transform rebuilt when a credential rotates reaches the next tile, and a render that omits it keeps the last one supplied.

MapControls

zoom

boolean

default: false

Which controls to render. Each defaults to off, so a stack is opt-in per control.

compass

boolean

default: false

geolocate

boolean

default: false

layers

boolean

default: false

preferences

boolean

default: false

pois

boolean

default: false

position

"top-right" | "top-left" | "bottom-left" | "bottom-right"

default: "top-right"

strings

MapControlsStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

disabled

boolean

default: false

Renders the whole stack inert.

Read once here and threaded to every control, which is what keeps a control added to this stack from shipping live: it takes the same flag its siblings do. Mountaya's own studio passes its agent-run lock through this, so the entire chrome goes inert together while an agent drives.

layersPanel

LayersPanelProps

poiPanel

PoiPanelProps

preferencesPanel

PreferencesPanelProps

The preferences panel's own props, on the same terms its two siblings take theirs.

Hoisting them here as a preferencesValue and an onPreferencesChange is what would put a UnitFormatOptions under the same word as the preferences BOOLEAN above, the flag deciding whether the control renders at all. Two different things wearing one name, which no amount of documentation fixes. One panel, one prop, and the controlled pair stays inside the type that owns it.

Omitted, the stack holds the preference set itself, so every row of the panel responds to its press: it starts from defaultUnits in the language the provider selected, and a language row still drives the map. The set reaches nothing outside the panel, so an application whose profile, table or own surfaces read units passes the pair and holds the value.

openPanel

PanelName | (string & {}) | null

The open panel, when the application owns that state: one of the built-in panels, the kind of a PanelControl composed in children, or null for none.

Unset, the stack owns it, which is what a consumer rendering the built-in panels wants. Set, the stack only reads it: onTogglePanel is how the built-in toggles ask for a change, and onClosePanel is how a press elsewhere in the stack does. An application composing its own PanelControls in children supplies this alone, so the stack still knows a panel is open and can dismiss it.

A press inside the open panel, or on its toggle, is never a dismissal. Neither is a press on another panel's toggle when that toggle writes this state: every toggle of a controlled stack, and the built-in ones otherwise.

children

ReactNode

Controls of the application's own, rendered between the panel cluster and the geolocate/compass pair.

Composition is the full-strength path, not a bolt-on: an application that needs its own handler per control, its own gating, or panels it positions itself leaves every flag off and builds the stack here out of ZoomControl, CompassControl, GeolocateControl and PanelControl. It keeps the positioning, the token block and the dismiss-on-press, which is everything this component is for.

MapControls.Compass

CompassControl resets the bearing to north, and doubles as an orientation readout.

disabled

boolean

default: false

strings

CompassControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

MapControls.Directions

DirectionsControl asks the application to open directions for what the map is showing.

disabled

boolean

strings

ActionControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

MapControls.Download

DownloadControl asks the application to export what the map is showing.

disabled

boolean

strings

ActionControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

MapControls.Geolocate

GeolocateControl centres the map on the device location.

disabled

boolean

default: false

locating

boolean

Reports a fix as in flight, for an application that owns the request through onLocate.

Unset, the control tracks its own request. The pair matters: an onLocate that suppresses the default also suppresses the state the default sets, so without this the button would sit idle and unpainted through every fix the application makes.

strings

GeolocateControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

tooltipDisabled

boolean

default: false

Suppresses the tooltip.

For an application whose onLocate opens a surface of its own (a permission pre-prompt, say), and for the same reason PanelControl suppresses its own: a bubble over the surface a press just revealed reads as a rendering fault.

MapControls.Panel

PanelControl is a button that owns a floating panel.

label

string

required
tooltipTitle

string

required
tooltipDescription

string

required
glyph

string

required
kind

string

required

Names the panel in the DOM, on the element that wraps the toggle and the floating panel.

The stack's dismiss-on-press reads it there: a press inside the element of the open panel is never a dismissal, and MapControlsProps.openPanel names the open panel by this value. A panel the stack ships, or a word of the application's own for a panel it composes.

open

boolean

required
disabled

boolean

default: false

ref

Ref<HTMLDivElement>

The control's own outermost element, for a caller that has to point at it.

One caller and one reason: a floating panel positioned somewhere ELSE on the page has to exempt its own toggle from its outside-click handler, or a press on the toggle closes the panel and the button's own handler immediately reopens it. Reading the button out of the document by its kind looks equivalent and is not: it finds the FIRST match on the page, so two maps on one page exempt each other's button, and it finds nothing at all across a shadow root.

A panel rendered through children needs none of this: it is inside this element already.

children

ReactNode

The panel itself, rendered beside the button while open.

Omit it when the application positions its own panel: in a drawer, a sidebar, or a layer anchored somewhere other than the button. The control is then the toggle alone, and everything else about it holds: the held paint, the suppressed tooltip, and the kind the stack's dismiss-on-press exempts.

One of React's empty values (null, false, what a failed condition hands) reads as omitted, so a conditional panel draws no empty floating box.

SearchControl is a search box over Mountaya's unified search, with the results under it.

disabled

boolean

default: false

targets

readonly SearchTargetName[]

The branches to ask for.

language

DataLanguage

The language the Data API answers in.

limit

number

Per-target result cap: a whole number from 1 to 50, the range the API takes.

units

UnitFormatOptions

The units every figure in the list is stated in: an itinerary's length and ascent, and the distance or elevation in the sentence under a place, a way or a point of interest.

A change of its length or its language asks a fresh round, since those sentences are worded as their branch lands.

wording

SearchWording

How a row's title and second line are worded for the reader, as SearchEngine takes it.

resolveLabel answers the word a wire value reads as: a category, a way's tags. units, when stated here, replaces the control's own units for the sentences this wording words, and an application states one or the other.

query

string

The query, when the application owns it. Unset, the control owns its own, whether or not onQueryChange is supplied.

viewportScope

boolean

Whether the search is restricted to the visible area, when the application owns it. Unset, the control owns its own, whether or not onViewportScopeChange is supplied.

resultMarker

Omit<MarkerOptions, "id" | "lngLat">

The pin dropped on a picked result. Its id and position are the control's.

strings

SearchControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

MapControls.StreetView

StreetViewControl is the handle a user drags onto the map to look around.

disabled

boolean

default: false

strings

StreetViewControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

minZoom

number

default: 13

The zoom below which the handle is inert.

googleMapsApiKey

string

The Maps JS API key the coverage check is made with.

Never ours: Street View is Google's product billed to whoever asks for it, so the key belongs to the application. Without one, and without an onDrop of your own, the control renders nothing at all, because a handle whose every drop must fail is worse than an absent one.

bounds

StreetViewBounds

Bounds the droppable area to an itinerary, and draws that corridor for the length of a drag.

children

ReactNode

Replaces the glyph in the handle and in the ghost.

For an application with artwork of its own, such as a pegman image its users already recognise.

MapControls.Zoom

ZoomControl is the +/- pair, as one flush chip.

disabled

boolean

default: false

strings

ZoomControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

ZoomControl

disabled

boolean

default: false

strings

ZoomControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

CompassControl

disabled

boolean

default: false

strings

CompassControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

CompassRose

size

number

required

The rose's width and height in CSS pixels: the rose is square, so one dimension sizes it.

GeolocateControl

disabled

boolean

default: false

locating

boolean

Reports a fix as in flight, for an application that owns the request through onLocate.

Unset, the control tracks its own request. The pair matters: an onLocate that suppresses the default also suppresses the state the default sets, so without this the button would sit idle and unpainted through every fix the application makes.

strings

GeolocateControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

tooltipDisabled

boolean

default: false

Suppresses the tooltip.

For an application whose onLocate opens a surface of its own (a permission pre-prompt, say), and for the same reason PanelControl suppresses its own: a bubble over the surface a press just revealed reads as a rendering fault.

PanelControl

label

string

required
tooltipTitle

string

required
tooltipDescription

string

required
glyph

string

required
kind

string

required

Names the panel in the DOM, on the element that wraps the toggle and the floating panel.

The stack's dismiss-on-press reads it there: a press inside the element of the open panel is never a dismissal, and MapControlsProps.openPanel names the open panel by this value. A panel the stack ships, or a word of the application's own for a panel it composes.

open

boolean

required
disabled

boolean

default: false

ref

Ref<HTMLDivElement>

The control's own outermost element, for a caller that has to point at it.

One caller and one reason: a floating panel positioned somewhere ELSE on the page has to exempt its own toggle from its outside-click handler, or a press on the toggle closes the panel and the button's own handler immediately reopens it. Reading the button out of the document by its kind looks equivalent and is not: it finds the FIRST match on the page, so two maps on one page exempt each other's button, and it finds nothing at all across a shadow root.

A panel rendered through children needs none of this: it is inside this element already.

children

ReactNode

The panel itself, rendered beside the button while open.

Omit it when the application positions its own panel: in a drawer, a sidebar, or a layer anchored somewhere other than the button. The control is then the toggle alone, and everything else about it holds: the held paint, the suppressed tooltip, and the kind the stack's dismiss-on-press exempts.

One of React's empty values (null, false, what a failed condition hands) reads as omitted, so a conditional panel draws no empty floating box.

DirectionsControl

disabled

boolean

strings

ActionControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

DownloadControl

disabled

boolean

strings

ActionControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

SearchControl

disabled

boolean

default: false

targets

readonly SearchTargetName[]

The branches to ask for.

language

DataLanguage

The language the Data API answers in.

limit

number

Per-target result cap: a whole number from 1 to 50, the range the API takes.

units

UnitFormatOptions

The units every figure in the list is stated in: an itinerary's length and ascent, and the distance or elevation in the sentence under a place, a way or a point of interest.

A change of its length or its language asks a fresh round, since those sentences are worded as their branch lands.

wording

SearchWording

How a row's title and second line are worded for the reader, as SearchEngine takes it.

resolveLabel answers the word a wire value reads as: a category, a way's tags. units, when stated here, replaces the control's own units for the sentences this wording words, and an application states one or the other.

query

string

The query, when the application owns it. Unset, the control owns its own, whether or not onQueryChange is supplied.

viewportScope

boolean

Whether the search is restricted to the visible area, when the application owns it. Unset, the control owns its own, whether or not onViewportScopeChange is supplied.

resultMarker

Omit<MarkerOptions, "id" | "lngLat">

The pin dropped on a picked result. Its id and position are the control's.

strings

SearchControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

StreetViewControl

disabled

boolean

default: false

strings

StreetViewControlStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

minZoom

number

default: 13

The zoom below which the handle is inert.

googleMapsApiKey

string

The Maps JS API key the coverage check is made with.

Never ours: Street View is Google's product billed to whoever asks for it, so the key belongs to the application. Without one, and without an onDrop of your own, the control renders nothing at all, because a handle whose every drop must fail is worse than an absent one.

bounds

StreetViewBounds

Bounds the droppable area to an itinerary, and draws that corridor for the length of a drag.

children

ReactNode

Replaces the glyph in the handle and in the ghost.

For an application with artwork of its own, such as a pegman image its users already recognise.

LayersPanel

strings

LayersPanelStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

isLocked

(slug: string) => boolean

Reports an entry the viewer's agreement does not include, so it renders locked.

What an agreement includes is the API's to enforce: the Tile API answers 403 whatever a picker shows. This exists so an application that already knows what the agreement includes can say so before the request, rather than letting a press fail silently.

PoiPanel

strings

PoiPanelStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

labels

Readonly<Record<string, string>>

A label per manifest key. A key with no entry is shown as the key itself.

The keys come from the layers manifest at runtime, so they cannot live in the static strings contract the way the rest of this package's copy does. "parking" is legible where a blank row is not, which is why the fallback is the key rather than an empty string: the same call localizedName in @mountaya/elements/i18n makes for a slug.

keys

readonly string[]

Restricts the panel to these keys, in this order.

For a consumer offering a curated subset (the assembled studio groups a few concepts out of a longer manifest) rather than whatever the manifest happens to carry today.

groups

readonly PoiPanelGroup[]

Curated groups, one row each. Supersedes {@link keys}.

The unit a user reasons about is rarely the manifest's: "water" is a spring, a drinking tap and a fountain, and offering the three separately asks them to know which of the three the map drew. A group collapses that into one row whose toggle drives every key it names.

activeGroups

readonly string[]

The groups currently on, when the application owns that state.

Unset, the panel reads the map. Set, it only renders what it is told: the pair onToggleGroup completes, for a surface whose group state lives somewhere the map cannot answer for.

showAllToggle

boolean

default: false

Adds the master row above the categories, which turns the whole overlay on and off.

Off by default: a panel offering one concept has nothing to master, and the row would read as a duplicate of the only toggle under it.

minZoom

number

The zoom below which the overlay draws nothing, so the panel can say so.

Points of interest are tiled at street zooms, so a user who switched them on at country scale sees an empty map and a panel full of lit toggles. The note names the reason; it does not disable anything, because the toggles are still what the map will honour once the camera arrives.

disabled

boolean

default: false

PreferencesPanel

preferences

UnitFormatOptions

required

The preference set the panel edits: the length system, the form a travel rate takes, the slope notation, the temperature scale and the language.

The value every formatter and every element's units takes, so the value an application stores is the value it hands on. Seed it from defaultUnits of @mountaya/elements/profile: every member is required, and a partial value round-tripped through storage is how a reader's units silently revert.

strings

PreferencesPanelStrings

Overrides the words this element renders, for this element only.

Folded onto whatever the provider resolved, so an override naming one key leaves the rest of the section alone. Scoped to the sections this element reads: a key it never renders is a type error rather than a silent no-op.

ControlButton

label

string

required

The accessible name. Required: a control stack of unlabelled squares is unusable.

aria-describedby

string

The ids of what describes the button beyond its label. <ControlTooltip> writes its open bubble's id here.

glyph

string

A glyph role from UI_GLYPHS. Omit when passing children instead.

disabled

boolean

default: false

pressed

boolean

Renders the button as a toggle that is on, through aria-pressed.

Painted as the same calm grey as hover rather than as a filled accent, as expanded and busy are. Omitted, the button is no toggle and states no pressed state at all.

expanded

boolean

Whether the surface this button discloses is shown, through aria-expanded: a panel toggle states it, and names the surface with controls.

Painted as pressed is while it is true.

controls

string

The id of the surface expanded speaks of, written as aria-controls.

busy

boolean

Whether the action the button started is still under way, through aria-busy: the geolocate button states it while a fix is out.

Painted as pressed is while it is true.

ref

Ref<HTMLButtonElement>

The <button> element, for a caller that hands focus back to it.

kind

string

Marks the button in the DOM, so the stack's dismiss-on-press can exempt it.

children

ReactNode

Replaces the glyph, for a control drawing something of its own (the compass rose).

ControlGroup

orientation

"vertical" | "horizontal"

default: "vertical"

vertical stacks the buttons into one flush chip, which is the stack's own idiom.

disabled

boolean

default: false

Whether every control in the group is disabled, which flattens the raised surface.

A property of the GROUP, not an instruction to its children: each control keeps its own disabled, because a group regularly holds one live control beside a gated one. Set this only when all of them are off, or the chip stops looking raised while something inside it is still pressable.

children

ReactNode

required

ControlTooltip

title

string

required
description

string

required
disabled

boolean

default: false

Suppresses the bubble entirely.

Used while the control's own panel or modal is open, so a tooltip never covers the surface its own button just revealed.

side

"left" | "right" | "top" | "bottom"

Which side of the control the bubble opens on, for a caller that knows where its control sits.

children

ReactElement<{ "aria-describedby"?: string | undefined }>

required

The control the bubble describes: one element that takes aria-describedby.

While the bubble is open the control is handed its id there, after any description the control already names, so a keyboard reader hears the second line with the control's name.

Glyph

name

string

required

A role from UI_GLYPHS: zoom-in, layers, geolocate.

label

string

An accessible name, for the rare glyph that IS the control rather than decoration.

Absent by default, and the default is the common case: a glyph beside a label repeats it, so announcing both makes a screen reader say everything twice. Passing one flips the element from aria-hidden to role="img": a glyph cannot be half-announced, and leaving aria-hidden on an element that carries the only name renders it unreachable rather than merely unlabelled.

size

number

default: 16

icons

IconProvider

The set to draw from, when it is not the control set.

For a surface that binds a set of its own and draws every glyph from it: a studio's wrapper over its interface set, a waypoint layer over a set of places. The glyph reads the set's paint mode, stroke width and view box with its shapes, so one name drawn from two sets is two different drawings.

fallback

ReactNode

default: null

What to draw when the provider has no shape under this name.

null by default, and the default is right for a control: a zoom button whose glyph is missing should not grow a word where an icon belongs. It is wrong for anything drawing a DATUM (a place's services, say), because a host that has not registered the amenity-* family then gets an empty cell over data the itinerary genuinely carries, and nothing anywhere says so. Those call sites pass the name as text.

Also accepts every standard <svg> attribute — a ref, event handlers, data-* and ARIA — which are forwarded to the rendered element.

OptionRow

kind

"radio" | "checkbox"

required

radio for a choice that replaces the last one, checkbox for one that stacks.

This is not decoration. It is the same distinction the layers manifest draws between a classic overlay and an enrichment, surfaced to assistive technology: a screen-reader user hearing "radio button" learns that selecting this will deselect the other, which is the rule the whole picker rests on.

name

string

Groups the radios that replace one another. Ignored for a checkbox.

label

string

required
checked

boolean

required
disabled

boolean

children

ReactNode

Rendered after the label: a badge, a lock.

Handlers

An on* handler suppresses the element's own default. Left unset, the element acts; set, it becomes presentational and your handler decides. The two never both fire.

MapView

onReady

(map: MountayaMap) => void

Called once the map is constructed and its style has loaded.

onDestroy

(map: MountayaMap) => void

Called just before a map that reached onReady is destroyed, to release anything attached to it.

Paired with onReady: a map torn down before its style loaded was handed to nobody, so it is destroyed without this being called. React StrictMode builds and tears down such a map on every development mount, and an application hears of the one it keeps.

onError

(error: Error) => void

Called with each failure the map reports that no call of yours could reject: an error MapLibre raised, the base map not arriving because the layers manifest could not be read or lists no such terrain, and a switch of terrain or terrainVariant after mount that the map refuses.

Attached as the map is built, before it makes its first request, so a failure that lands before onReady is heard. It reports and replaces nothing. A refusal of access goes to onAccessRequired instead, and a map that cannot be built at all (no WebGL context) throws to the nearest error boundary, which is React's own contract for a failure while mounting.

onAccessRequired

(refusal: MountayaMapEvents["accessrequired"]) => void

Called when the API refuses one of the map's own requests with a 401, a 402 or a 403: a tile, a sprite, a glyph, a style, or the layers manifest.

The refusal carries the status and the address refused, so an application tells a sign-in apart from access its agreement does not include (a 402: talk to us at https://mountaya.com/en/contact/). Attached as the map is built, like onError, since the manifest is read before the style loads and an expired session token is refused there first.

MapControls

onTogglePanel

(panel: PanelName) => void

Called with the built-in panel whose toggle was pressed, in a controlled stack. A composed PanelControl reports through its own onToggle.

onClosePanel

() => void

Called when a press elsewhere in a controlled stack asks for the open panel to close.

ZoomControl

onZoomIn

() => void

Overrides what a press does.

Left unset, the control drives the map directly, which is what a consumer wants. Set, the control becomes presentational and the handler decides, which is how Mountaya's own studio routes every action through its tool bus while sharing this exact component.

Supplying one also makes that half of the pair live with no map in context, because a handler that suppresses the default has nothing left to wait for. The two halves are gated separately: a stack that overrides only zoom-in must not carry a live zoom-out whose default it never wired.

onZoomOut

() => void

CompassControl

onResetNorth

() => void

Overrides the reset. Unset, the control resets the map's bearing and pitch itself.

Supplying one also makes the control live with no map in context: the default is what needed one, and a handler that replaces it does not. The rose then reads the identity bearing, because there is no camera to track.

GeolocateControl

onLocate

() => void

Overrides the request. Unset, the control asks the browser and eases the map itself.

Supplying one also makes the control live with no map in context: what needed a map was the easing, and an application that owns the request owns where the fix lands.

onError

(error: Error) => void

Called when the browser refuses or the fix fails, for an application's own recovery UI.

Always an Error, as every element's onError is: the MountayaElementsError the map rejects with, whose message states the reason. A geolocation seam of the host's own that rejects with a value that is no Error is reported as a MountayaElementsRejectionError holding that value as its cause. Never called for a fix the application makes itself through onLocate, nor after the control has unmounted.

PanelControl

onToggle

(open: boolean) => void

required

Called with the state the press is asking for, not with the state it left.

The control is controlled (open is the caller's), so a bare notification would leave every caller re-deriving !open from the value it just rendered, and the two disagree for exactly as long as a press and a re-render are apart.

DirectionsControl

onClick

() => void

required

What a press does. Required, unlike the on* on every other control here.

The rest of this package's controls default to driving the map, and their handler is an override. These two have nothing to drive: exporting a route and routing between points both end in a surface (a dialog, a panel, a download) that belongs to the application and cannot be guessed. A control that rendered without one would be a button that looks live and does nothing, which is worse than not offering it.

DownloadControl

onClick

() => void

required

What a press does. Required, unlike the on* on every other control here.

The rest of this package's controls default to driving the map, and their handler is an override. These two have nothing to drive: exporting a route and routing between points both end in a surface (a dialog, a panel, a download) that belongs to the application and cannot be guessed. A control that rendered without one would be a button that looks live and does nothing, which is worse than not offering it.

SearchControl

onQueryChange

(query: string) => void

Called with the query each keystroke and each clear asks for. With query supplied it is how the application is asked to change the value. With none it observes: the control has already written its own.

onViewportScopeChange

(scoped: boolean) => void

Called with the scope a press on the checkbox asks for. With viewportScope supplied it is how the application is asked to change the value. With none it observes.

onSelect

(row: SearchRow) => void

Overrides what picking a result does.

Unset, the control moves the camera onto the result and drops a pin. Set, it does neither and the handler decides: the assembled studio routes a pick through its own mutation surface this way while rendering this exact list.

onSearch

SearchFetch

Overrides how a round reaches the API. Unset, it routes the map's own search.

onError

(error: Error) => void

Called once for each branch whose request failed, with the failure.

Always an Error, as every element's onError is: an onSearch that rejects with any other value is reported as a MountayaElementsRejectionError holding that value as its cause. It reports and replaces nothing: the list still shows the branch's error line and its retry.

StreetViewControl

onDragStart

() => void

Overrides what a grab does. Unset, the map shows Street View coverage and the corridor.

Paired with onDragEnd, which is called on EVERY path that ends a drag: a release, a pointer cancel, a capture the browser took back, a zoom falling below the threshold with the handle still held, and the control leaving the page mid-drag. An override that shows something has to be told to take it down again by every one of them.

This is also the pair that makes the handle live with no map in context, where every other control here is made live by whichever single handler replaces its default. The asymmetry is the drop: unprojecting a screen point into a coordinate is the map's own measurement, so a mapless handle can be dragged and can tell an application about the drag, but the drop itself resolves to nothing. Presentational Street View is therefore the drag overrides, and onDrop/onOpen never fire without a canvas to aim at.

onDragEnd

() => void

Overrides what the end of a drag does, on the terms {@link onDragStart} states.

onUnavailable

(reason: StreetViewMiss) => void

Called when a drop is refused, for an application raising its own message. Only the latest drop is answered: a check a later drop replaced reports nothing, and neither does one that answers after the control was disabled or unmounted.

onError

(error: Error) => void

Called when a drop's coverage check failed rather than found no imagery: the optional peer @googlemaps/js-api-loader is not installed, Google's own library failed to load, or Google failed the request (a key it does not accept, a quota spent, the network). The drop is refused as unavailable all the same, since nothing can be opened.

A reader cannot tell this from a place with no imagery, so it is the developer's signal. Without it, a missing peer is written once to the console of a development build, and a failed load or a failed request is reported nowhere.

onDrop

(lngLat: [number, number]) => boolean

onOpen

undefined

LayersPanel

onLockedClick

(slug: string) => void

Called when a locked entry is pressed, for an application's own notice.

PoiPanel

onToggleGroup

(id: string, visible: boolean) => void

Overrides what a group's toggle does, on the terms {@link onToggle} states.

onToggleAll

(visible: boolean) => void

Overrides what the master row does, on the terms {@link onToggle} states.

onToggle

(key: string, visible: boolean) => void

Overrides what a toggle does.

Left unset, the panel drives the map. Set, it becomes presentational and the handler decides: the same seam every control here offers.

A write the handler makes to the map shows as the map reports it, whether the handler makes it before it returns or after.

PreferencesPanel

onPreferencesChange

(next: UnitFormatOptions) => void

required

Called with the whole preference set the press is asking for, not with the one field.

The same name MapControls takes, because it is the same value travelling one level further: a panel that spelled it onChange would leave the two surfaces reporting the same thing under two words.

ControlButton

onClick

() => void

OptionRow

onSelect

() => void

required