Expose unit and language preferences

PreferencesPanel is a controlled surface: it reads a value and reports a change, and never stores anything. Where a reader's units live is your decision, so the panel refuses to make it.

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

export const Preferences = () => (
  <MountayaElementsProvider client={client} map={map}>
    <div style={{ height: 560, position: "relative" }}>
      <MapView center={[6.87, 45.85]} client={client} onReady={setMap} terrain="topo" zoom={12} />
      <MapControls
        onClosePanel={() => setPanel(null)}
        onTogglePanel={(next) => setPanel((open) => (open === next ? null : next))}
        openPanel={panel}
        preferences
        preferencesPanel={{ onPreferencesChange: setPreferences, preferences }}
        zoom
      />
    </div>
  </MountayaElementsProvider>
);

Seed your state from defaultUnits (@mountaya/elements/profile), because every field is required and a partial value reverts a reader's units.

Next steps

Let readers switch terrain

The base map picker beside it.

Customize

The locale and strings the panel writes into.