@fieldia/map 0.0.0-stage → 0.14.0

package/src/lib/map-core.mjs

@@ -0,0 +1,297 @@
+import { fill } from './labels.mjs';
+import { loadLeaflet, tileLayer } from './leaflet.mjs';
+import { installLeafletStyles, installMapStyles } from './styles.mjs';
+const warned = new Set();
+const isMac = (doc) => /Mac|iPhone|iPad/.test(doc.defaultView?.navigator.platform ?? '');
+export function createMapBox(options) {
+    const { document: doc, provider, locale, labels } = options;
+    installMapStyles(doc);
+    const element = doc.createElement('div');
+    element.className = 'fd-map-box';
+    // The map's own layout is left to right in every language; the controls over it follow the page.
+    element.dir = 'ltr';
+    element.style.setProperty('--fd-map-height', `${options.height ?? 280}px`);
+    element.setAttribute('role', 'region');
+    element.setAttribute('aria-label', fill(labels.mapOf, { label: options.name }));
+    const keysId = `fd-map-keys-${Math.random().toString(36).slice(2, 9)}`;
+    const keys = doc.createElement('span');
+    keys.id = keysId;
+    keys.className = 'fd-sr-only';
+    keys.textContent = [labels.mapKeys, options.keys].filter(Boolean).join(' ');
+    element.setAttribute('aria-describedby', keysId);
+    const zoom = doc.createElement('div');
+    zoom.className = 'fd-map-zoom';
+    zoom.dataset['side'] = 'right';
+    const zoomButton = (words, sign) => {
+        const button = doc.createElement('button');
+        button.type = 'button';
+        button.setAttribute('aria-label', words);
+        button.title = words;
+        button.textContent = sign;
+        return button;
+    };
+    const zoomIn = zoomButton(labels.zoomIn, '+');
+    const zoomOut = zoomButton(labels.zoomOut, '−');
+    zoom.append(zoomIn, zoomOut);
+    const credits = doc.createElement('div');
+    credits.className = 'fd-map-credits';
+    const veilElement = doc.createElement('div');
+    veilElement.className = 'fd-map-veil';
+    veilElement.setAttribute('aria-hidden', 'true');
+    const crosshair = doc.createElement('div');
+    crosshair.className = 'fd-map-crosshair';
+    element.append(keys, veilElement, crosshair);
+    // The buttons and credits go in after Leaflet's layers, once the map is made: Tab reaches the map's own pins and grips first.
+    const overlays = [zoom, credits];
+    if (provider.logo) {
+        const mark = doc.createElement(provider.logo.href ? 'a' : 'span');
+        mark.className = 'fd-map-logo';
+        if (mark instanceof HTMLAnchorElement && provider.logo.href) {
+            mark.href = provider.logo.href;
+            mark.target = '_blank';
+            mark.rel = 'noopener';
+        }
+        if (provider.logo.image) {
+            const img = doc.createElement('img');
+            img.src = provider.logo.image;
+            img.alt = provider.logo.text;
+            mark.append(img);
+        }
+        else {
+            const words = doc.createElement('span');
+            words.textContent = provider.logo.text;
+            mark.append(words);
+        }
+        overlays.push(mark);
+    }
+    if (provider.demoOnly && !warned.has(provider.id)) {
+        warned.add(provider.id);
+        console.warn(`[Fieldia] The "${provider.id}" map provider is for demos and development only: choose a provider (azureMaps, googleMaps, mapbox, or tiles) for an app in use.`);
+    }
+    let map = null;
+    let L = null;
+    let destroyed = false;
+    let pannable = true;
+    let baseMap = null;
+    let baseLayer = null;
+    let creditsAsked = 0;
+    let creditsTimer;
+    let veilTimer;
+    const waiting = [];
+    const following = [veilElement];
+    const cleanups = [];
+    function veil(words) {
+        veilElement.textContent = words;
+        veilElement.dataset['show'] = '';
+        clearTimeout(veilTimer);
+        veilTimer = setTimeout(() => delete veilElement.dataset['show'], 1400);
+    }
+    function shield(over) {
+        if (!L) {
+            waiting.push(() => shield(over));
+            return;
+        }
+        L.DomEvent.disableClickPropagation(over);
+        L.DomEvent.disableScrollPropagation(over);
+    }
+    /** Dark when the form is: its own scheme, or the reader's when it follows theirs. */
+    function dark() {
+        const view = doc.defaultView;
+        const scheme = view?.getComputedStyle(element).colorScheme ?? '';
+        if (!scheme.includes('dark'))
+            return false;
+        if (!scheme.includes('light'))
+            return true;
+        return !!view?.matchMedia?.('(prefers-color-scheme: dark)').matches;
+    }
+    function showCredits(list) {
+        credits.replaceChildren();
+        list.forEach((credit, i) => {
+            if (i)
+                credits.append(' · ');
+            if (credit.href) {
+                const link = doc.createElement('a');
+                link.href = credit.href;
+                link.target = '_blank';
+                link.rel = 'noopener';
+                link.textContent = credit.text;
+                credits.append(link);
+            }
+            else
+                credits.append(credit.text);
+        });
+    }
+    function askCredits() {
+        clearTimeout(creditsTimer);
+        creditsTimer = setTimeout(() => {
+            if (!map || !baseMap)
+                return;
+            const asked = ++creditsAsked;
+            const b = map.getBounds();
+            provider
+                .credits(baseMap, { zoom: map.getZoom(), bounds: { south: b.getSouth(), west: b.getWest(), north: b.getNorth(), east: b.getEast() } }, locale)
+                .then((list) => asked === creditsAsked && showCredits(list))
+                .catch(() => undefined);
+        }, 300);
+    }
+    async function setBaseMap(kind) {
+        if (!map || !L || kind === baseMap)
+            return;
+        let spec = await provider.tiles(kind, locale).catch(() => null);
+        let drawn = kind;
+        if (!spec && kind !== 'road') {
+            spec = await provider.tiles('road', locale).catch(() => null);
+            drawn = 'road';
+        }
+        if (!spec || destroyed || !map)
+            return;
+        if (drawn === baseMap) {
+            baseMap = kind;
+            return;
+        }
+        const layer = tileLayer(L, spec).addTo(map);
+        baseLayer?.remove();
+        baseLayer = layer;
+        baseMap = drawn;
+        element.dataset['baseMap'] = drawn;
+        askCredits();
+    }
+    function refresh() {
+        const page = element.parentElement ? doc.defaultView?.getComputedStyle(element.parentElement).direction : 'ltr';
+        zoom.dataset['side'] = page === 'rtl' ? 'left' : 'right';
+        element.dataset['side'] = zoom.dataset['side'];
+        for (const words of following)
+            words.dir = page === 'rtl' ? 'rtl' : 'ltr';
+        if (map)
+            void setBaseMap(dark() ? 'dark' : 'road');
+    }
+    function setPannable(on) {
+        pannable = on;
+        if (!map)
+            return;
+        if (on)
+            map.dragging.enable();
+        else
+            map.dragging.disable();
+    }
+    // A scroll passes to the page; Ctrl or ⌘ with it zooms. Caught on the way down, before Leaflet's own.
+    const wheel = (event) => {
+        if (event.ctrlKey || event.metaKey)
+            return;
+        event.stopPropagation();
+        veil(isMac(doc) ? labels.cmdZoom : labels.ctrlZoom);
+    };
+    element.addEventListener('wheel', wheel, { capture: true, passive: true });
+    // The cross at the centre is the keyboard's pointer: shown once a key is pressed on the map, gone at the next press of a pointer.
+    // (Leaflet focuses the map in code on every press, which a browser may show as keyboard focus.)
+    // Focus that no press brought (Tab, a shortcut) is the keyboard's too.
+    let pressing = false;
+    const byKeys = (event) => event.target === element && element.setAttribute('data-keys', '');
+    const byPointer = () => {
+        element.removeAttribute('data-keys');
+        pressing = true;
+        setTimeout(() => (pressing = false), 0);
+    };
+    const byFocus = () => !pressing && element.setAttribute('data-keys', '');
+    element.addEventListener('keydown', byKeys);
+    element.addEventListener('pointerdown', byPointer, { capture: true });
+    element.addEventListener('focus', byFocus);
+    cleanups.push(() => {
+        element.removeEventListener('keydown', byKeys);
+        element.removeEventListener('pointerdown', byPointer, { capture: true });
+        element.removeEventListener('focus', byFocus);
+    });
+    // One finger scrolls the page; two move the map.
+    let touchStart = null;
+    const touchstart = (event) => {
+        if (!map)
+            return;
+        const one = event.touches.length === 1;
+        touchStart = one ? { x: event.touches[0].clientX, y: event.touches[0].clientY } : null;
+        if (one || !pannable)
+            map.dragging.disable();
+        else
+            map.dragging.enable();
+    };
+    const touchmove = (event) => {
+        if (!touchStart || event.touches.length !== 1 || !pannable)
+            return;
+        const moved = Math.hypot(event.touches[0].clientX - touchStart.x, event.touches[0].clientY - touchStart.y);
+        if (moved > 12)
+            veil(labels.twoFingers);
+    };
+    const touchend = (event) => {
+        if (event.touches.length === 0 && map && pannable)
+            map.dragging.enable();
+    };
+    element.addEventListener('touchstart', touchstart, { capture: true, passive: true });
+    element.addEventListener('touchmove', touchmove, { capture: true, passive: true });
+    element.addEventListener('touchend', touchend, { capture: true, passive: true });
+    cleanups.push(() => {
+        element.removeEventListener('wheel', wheel, { capture: true });
+        element.removeEventListener('touchstart', touchstart, { capture: true });
+        element.removeEventListener('touchmove', touchmove, { capture: true });
+        element.removeEventListener('touchend', touchend, { capture: true });
+    });
+    void loadLeaflet().then(({ L: leaflet, css }) => {
+        if (destroyed)
+            return;
+        installLeafletStyles(doc, css);
+        L = leaflet;
+        map = leaflet.map(element, {
+            zoomControl: false,
+            attributionControl: false,
+            keyboard: true,
+            keyboardPanDelta: 80,
+            worldCopyJump: true,
+            dragging: pannable,
+        });
+        if (options.center)
+            map.setView([options.center.lat, options.center.lng], options.zoom ?? 15);
+        else
+            map.setView([20, 0], options.zoom ?? 2);
+        element.append(...overlays);
+        for (const over of overlays)
+            shield(over);
+        zoomIn.addEventListener('click', () => map?.zoomIn());
+        zoomOut.addEventListener('click', () => map?.zoomOut());
+        map.on('moveend', askCredits);
+        // Shown at last in a tab or a dialog: the map measures itself again.
+        const ResizeWatch = doc.defaultView?.ResizeObserver;
+        if (ResizeWatch) {
+            const watch = new ResizeWatch(() => map?.invalidateSize({ pan: false }));
+            watch.observe(element);
+            cleanups.push(() => watch.disconnect());
+        }
+        refresh();
+        for (const use of waiting.splice(0))
+            use(map, leaflet);
+    });
+    return {
+        element,
+        ready(use) {
+            if (map && L)
+                use(map, L);
+            else
+                waiting.push(use);
+        },
+        veil,
+        setPannable,
+        refresh,
+        shield,
+        follow(words) {
+            following.push(words);
+            refresh();
+        },
+        destroy() {
+            destroyed = true;
+            clearTimeout(creditsTimer);
+            clearTimeout(veilTimer);
+            for (const cleanup of cleanups.splice(0))
+                cleanup();
+            map?.remove();
+            map = null;
+        },
+    };
+}
+//# sourceMappingURL=map-core.mjs.map

package/src/lib/map-core.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-core.mjs","sourceRoot":"","sources":["../../../../../libs/map/src/lib/map-core.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,IAAI,EAAkB,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,SAAS,EAAsB,MAAM,WAAW,CAAC;AAEvE,OAAO,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AA6ClE,MAAM,MAAM,GAAG,IAAI,GAAG,EAAU,CAAC;AACjC,MAAM,KAAK,GAAG,CAAC,GAAa,EAAE,EAAE,CAAC,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,SAAS,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC;AAEnG,MAAM,UAAU,YAAY,CAAC,OAAsB;IACjD,MAAM,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IAC5D,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACtB,MAAM,OAAO,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACzC,OAAO,CAAC,SAAS,GAAG,YAAY,CAAC;IACjC,iGAAiG;IACjG,OAAO,CAAC,GAAG,GAAG,KAAK,CAAC;IACpB,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,OAAO,CAAC,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC;IAC3E,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACvC,OAAO,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;IAChF,MAAM,MAAM,GAAG,eAAe,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;IACvE,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IACvC,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC;IACjB,IAAI,CAAC,SAAS,GAAG,YAAY,CAAC;IAC9B,IAAI,CAAC,WAAW,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC5E,OAAO,CAAC,YAAY,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;IAEjD,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACtC,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;IAC/B,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC;IAC/B,MAAM,UAAU,GAAG,CAAC,KAAa,EAAE,IAAY,EAAE,EAAE;QACjD,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC3C,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC;QACvB,MAAM,CAAC,YAAY,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;QACzC,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;QACrB,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC;QAC1B,OAAO,MAAM,CAAC;IAChB,CAAC,CAAC;IACF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC9C,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IAChD,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7B,MAAM,OAAO,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACzC,OAAO,CAAC,SAAS,GAAG,gBAAgB,CAAC;IACrC,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7C,WAAW,CAAC,SAAS,GAAG,aAAa,CAAC;IACtC,WAAW,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC3C,SAAS,CAAC,SAAS,GAAG,kBAAkB,CAAC;IACzC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAC7C,8HAA8H;IAC9H,MAAM,QAAQ,GAAkB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAChD,IAAI,QAAQ,CAAC,IAAI,EAAE,CAAC;QAClB,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;QAClE,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;QAC/B,IAAI,IAAI,YAAY,iBAAiB,IAAI,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC5D,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;YAC/B,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC;YACvB,IAAI,CAAC,GAAG,GAAG,UAAU,CAAC;QACxB,CAAC;QACD,IAAI,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YACxB,MAAM,GAAG,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YACrC,GAAG,CAAC,GAAG,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;YAC9B,GAAG,CAAC,GAAG,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;YAC7B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;QACnB,CAAC;aAAM,CAAC;YACN,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YACxC,KAAK,CAAC,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;YACvC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACrB,CAAC;QACD,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;IACD,IAAI,QAAQ,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;QAClD,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACxB,OAAO,CAAC,IAAI,CAAC,kBAAkB,QAAQ,CAAC,EAAE,kIAAkI,CAAC,CAAC;IAChL,CAAC;IAED,IAAI,GAAG,GAAuB,IAAI,CAAC;IACnC,IAAI,CAAC,GAAyB,IAAI,CAAC;IACnC,IAAI,SAAS,GAAG,KAAK,CAAC;IACtB,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,IAAI,OAAO,GAAmB,IAAI,CAAC;IACnC,IAAI,SAAS,GAA6B,IAAI,CAAC;IAC/C,IAAI,YAAY,GAAG,CAAC,CAAC;IACrB,IAAI,YAAuD,CAAC;IAC5D,IAAI,SAAoD,CAAC;IACzD,MAAM,OAAO,GAAqD,EAAE,CAAC;IACrE,MAAM,SAAS,GAAkB,CAAC,WAAW,CAAC,CAAC;IAC/C,MAAM,QAAQ,GAAmB,EAAE,CAAC;IAEpC,SAAS,IAAI,CAAC,KAAa;QACzB,WAAW,CAAC,WAAW,GAAG,KAAK,CAAC;QAChC,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC;QACjC,YAAY,CAAC,SAAS,CAAC,CAAC;QACxB,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,CAAC;IACzE,CAAC;IAED,SAAS,MAAM,CAAC,IAAiB;QAC/B,IAAI,CAAC,CAAC,EAAE,CAAC;YACP,OAAO,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;YACjC,OAAO;QACT,CAAC;QACD,CAAC,CAAC,QAAQ,CAAC,uBAAuB,CAAC,IAAI,CAAC,CAAC;QACzC,CAAC,CAAC,QAAQ,CAAC,wBAAwB,CAAC,IAAI,CAAC,CAAC;IAC5C,CAAC;IAED,qFAAqF;IACrF,SAAS,IAAI;QACX,MAAM,IAAI,GAAG,GAAG,CAAC,WAAW,CAAC;QAC7B,MAAM,MAAM,GAAG,IAAI,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC,WAAW,IAAI,EAAE,CAAC;QACjE,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC;YAAE,OAAO,KAAK,CAAC;QAC3C,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC;YAAE,OAAO,IAAI,CAAC;QAC3C,OAAO,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,8BAA8B,CAAC,CAAC,OAAO,CAAC;IACtE,CAAC;IAED,SAAS,WAAW,CAAC,IAAc;QACjC,OAAO,CAAC,eAAe,EAAE,CAAC;QAC1B,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACzB,IAAI,CAAC;gBAAE,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC7B,IAAI,MAAM,CAAC,IAAI,EAAE,CAAC;gBAChB,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;gBACpC,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC;gBACxB,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC;gBACvB,IAAI,CAAC,GAAG,GAAG,UAAU,CAAC;gBACtB,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC;gBAC/B,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YACvB,CAAC;;gBAAM,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;IACL,CAAC;IAED,SAAS,UAAU;QACjB,YAAY,CAAC,YAAY,CAAC,CAAC;QAC3B,YAAY,GAAG,UAAU,CAAC,GAAG,EAAE;YAC7B,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO;gBAAE,OAAO;YAC7B,MAAM,KAAK,GAAG,EAAE,YAAY,CAAC;YAC7B,MAAM,CAAC,GAAG,GAAG,CAAC,SAAS,EAAE,CAAC;YAC1B,QAAQ;iBACL,OAAO,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,GAAG,CAAC,OAAO,EAAE,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE,EAAE,EAAE,MAAM,CAAC;iBAC7I,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,KAAK,KAAK,YAAY,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;iBAC3D,KAAK,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC;QAC5B,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAED,KAAK,UAAU,UAAU,CAAC,IAAa;QACrC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,IAAI,IAAI,KAAK,OAAO;YAAE,OAAO;QAC3C,IAAI,IAAI,GAAG,MAAM,QAAQ,CAAC,KAAK,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;QAChE,IAAI,KAAK,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,IAAI,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;YAC7B,IAAI,GAAG,MAAM,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;YAC9D,KAAK,GAAG,MAAM,CAAC;QACjB,CAAC;QACD,IAAI,CAAC,IAAI,IAAI,SAAS,IAAI,CAAC,GAAG;YAAE,OAAO;QACvC,IAAI,KAAK,KAAK,OAAO,EAAE,CAAC;YACtB,OAAO,GAAG,IAAI,CAAC;YACf,OAAO;QACT,CAAC;QACD,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC5C,SAAS,EAAE,MAAM,EAAE,CAAC;QACpB,SAAS,GAAG,KAAK,CAAC;QAClB,OAAO,GAAG,KAAK,CAAC;QAChB,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;QACnC,UAAU,EAAE,CAAC;IACf,CAAC;IAED,SAAS,OAAO;QACd,MAAM,IAAI,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,gBAAgB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC;QAChH,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QACzD,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAC/C,KAAK,MAAM,KAAK,IAAI,SAAS;YAAE,KAAK,CAAC,GAAG,GAAG,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;QAC1E,IAAI,GAAG;YAAE,KAAK,UAAU,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IACrD,CAAC;IAED,SAAS,WAAW,CAAC,EAAW;QAC9B,QAAQ,GAAG,EAAE,CAAC;QACd,IAAI,CAAC,GAAG;YAAE,OAAO;QACjB,IAAI,EAAE;YAAE,GAAG,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;;YACzB,GAAG,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;IAC9B,CAAC;IAED,sGAAsG;IACtG,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE;QAClC,IAAI,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO;YAAE,OAAO;QAC3C,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IACtD,CAAC,CAAC;IACF,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3E,kIAAkI;IAClI,gGAAgG;IAChG,uEAAuE;IACvE,IAAI,QAAQ,GAAG,KAAK,CAAC;IACrB,MAAM,MAAM,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,KAAK,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;IAC3G,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,OAAO,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;QACrC,QAAQ,GAAG,IAAI,CAAC;QAChB,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;IAC1C,CAAC,CAAC;IACF,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;IACzE,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IAC5C,OAAO,CAAC,gBAAgB,CAAC,aAAa,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACtE,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAC3C,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE;QACjB,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;QAC/C,OAAO,CAAC,mBAAmB,CAAC,aAAa,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACzE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAChD,CAAC,CAAC,CAAC;IACH,iDAAiD;IACjD,IAAI,UAAU,GAAoC,IAAI,CAAC;IACvD,MAAM,UAAU,GAAG,CAAC,KAAiB,EAAE,EAAE;QACvC,IAAI,CAAC,GAAG;YAAE,OAAO;QACjB,MAAM,GAAG,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,CAAC;QACvC,UAAU,GAAG,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QACvF,IAAI,GAAG,IAAI,CAAC,QAAQ;YAAE,GAAG,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;;YACxC,GAAG,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;IAC7B,CAAC,CAAC;IACF,MAAM,SAAS,GAAG,CAAC,KAAiB,EAAE,EAAE;QACtC,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QACnE,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;QAC3G,IAAI,KAAK,GAAG,EAAE;YAAE,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC,CAAC;IACF,MAAM,QAAQ,GAAG,CAAC,KAAiB,EAAE,EAAE;QACrC,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,GAAG,IAAI,QAAQ;YAAE,GAAG,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;IAC3E,CAAC,CAAC;IACF,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACrF,OAAO,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACnF,OAAO,CAAC,gBAAgB,CAAC,UAAU,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACjF,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE;QACjB,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAC/D,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACzE,OAAO,CAAC,mBAAmB,CAAC,WAAW,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACvE,OAAO,CAAC,mBAAmB,CAAC,UAAU,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,KAAK,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE;QAC9C,IAAI,SAAS;YAAE,OAAO;QACtB,oBAAoB,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;QAC/B,CAAC,GAAG,OAAO,CAAC;QACZ,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE;YACzB,WAAW,EAAE,KAAK;YAClB,kBAAkB,EAAE,KAAK;YACzB,QAAQ,EAAE,IAAI;YACd,gBAAgB,EAAE,EAAE;YACpB,aAAa,EAAE,IAAI;YACnB,QAAQ,EAAE,QAAQ;SACnB,CAAC,CAAC;QACH,IAAI,OAAO,CAAC,MAAM;YAAE,GAAG,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,OAAO,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;;YACzF,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC;QAC7C,OAAO,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC;QAC5B,KAAK,MAAM,IAAI,IAAI,QAAQ;YAAE,MAAM,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC;QACtD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,CAAC,CAAC;QACxD,GAAG,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;QAC9B,qEAAqE;QACrE,MAAM,WAAW,GAAG,GAAG,CAAC,WAAW,EAAE,cAAc,CAAC;QACpD,IAAI,WAAW,EAAE,CAAC;YAChB,MAAM,KAAK,GAAG,IAAI,WAAW,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,cAAc,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;YACzE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YACvB,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC;QAC1C,CAAC;QACD,OAAO,EAAE,CAAC;QACV,KAAK,MAAM,GAAG,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAAE,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,OAAO;QACL,OAAO;QACP,KAAK,CAAC,GAAG;YACP,IAAI,GAAG,IAAI,CAAC;gBAAE,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;;gBACrB,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACzB,CAAC;QACD,IAAI;QACJ,WAAW;QACX,OAAO;QACP,MAAM;QACN,MAAM,CAAC,KAAK;YACV,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACtB,OAAO,EAAE,CAAC;QACZ,CAAC;QACD,OAAO;YACL,SAAS,GAAG,IAAI,CAAC;YACjB,YAAY,CAAC,YAAY,CAAC,CAAC;YAC3B,YAAY,CAAC,SAAS,CAAC,CAAC;YACxB,KAAK,MAAM,OAAO,IAAI,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC;gBAAE,OAAO,EAAE,CAAC;YACpD,GAAG,EAAE,MAAM,EAAE,CAAC;YACd,GAAG,GAAG,IAAI,CAAC;QACb,CAAC;KACF,CAAC;AACJ,CAAC"}

package/src/lib/place.d.mts

@@ -0,0 +1,3 @@
+import type { WidgetFactory } from '@fieldia/widgets';
+import type { MapSettings } from './settings.mjs';
+export declare function placeWidget(settings: MapSettings): WidgetFactory;

package/src/lib/place.d.ts

@@ -0,0 +1,3 @@
+import type { WidgetFactory } from '@fieldia/widgets';
+import type { MapSettings } from './settings';
+export declare function placeWidget(settings: MapSettings): WidgetFactory;

package/src/lib/place.js

@@ -0,0 +1,323 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.placeWidget = placeWidget;
+const geo_1 = require("./geo");
+const labels_1 = require("./labels");
+const map_core_1 = require("./map-core");
+const search_box_1 = require("./search-box");
+/**
+ * A place on a form: a click on the map, a dragged pin, an address found,
+ * or "My location". Kept as a GeoJSON Point in a json field, or in two
+ * number fields (`latitude` with `options.longitudeField`), the way Odoo
+ * keeps a partner's place. The coordinates stay typeable under the map:
+ * that is the way in without a mouse, beside Enter on the map (the place
+ * at its centre) and the arrow keys on the pin.
+ *
+ * Options: `longitudeField`, `addressField` (filled from the address
+ * found, or named from the point where the provider can), `myLocation`
+ * (on unless false), `search` (on unless false), `zoom` (15), `height`.
+ */
+const PIN = `<svg viewBox="0 0 28 40" aria-hidden="true"><path class="fd-map-pin-body" d="M14 1C6.8 1 1 6.7 1 13.8 1 23.6 14 39 14 39s13-15.4 13-25.2C27 6.7 21.2 1 14 1z"/><circle class="fd-map-pin-dot" cx="14" cy="14" r="5"/></svg>`;
+const round6 = (n) => Math.round(n * 1e6) / 1e6;
+function placeWidget(settings) {
+    return (context) => {
+        const { form, name, field, node, id, document: doc } = context;
+        const options = node.options ?? {};
+        const labels = (0, labels_1.mapLabels)(context.locale, settings.labels?.[context.locale ?? 'en']);
+        const longitudeField = typeof options['longitudeField'] === 'string' ? options['longitudeField'] : null;
+        const addressField = typeof options['addressField'] === 'string' ? options['addressField'] : null;
+        const inFields = field.type === 'float';
+        if (inFields && !longitudeField)
+            throw new Error(`The place on "${name}" keeps its latitude there and needs options.longitudeField for its longitude`);
+        const zoom = typeof options['zoom'] === 'number' ? options['zoom'] : 15;
+        const search = options['search'] === false ? undefined : (settings.search ?? settings.provider.search);
+        const reverse = settings.reverse ?? settings.provider.reverse;
+        const asYouType = settings.search ? (settings.searchAsYouType ?? true) : !!settings.provider.searchAsYouType;
+        const geolocation = options['myLocation'] === false ? undefined : doc.defaultView?.navigator.geolocation;
+        let readonly = false;
+        let point = null;
+        /** The address this field last wrote: one a person typed is never written over. */
+        let addressWritten;
+        let values = form.getState().values;
+        const element = doc.createElement('div');
+        element.className = 'fd-map-field fd-place';
+        element.setAttribute('role', 'group');
+        element.setAttribute('aria-labelledby', `${id}-label`);
+        const tools = doc.createElement('div');
+        tools.className = 'fd-map-tools';
+        const note = doc.createElement('p');
+        note.className = 'fd-map-note';
+        note.setAttribute('aria-live', 'polite');
+        note.hidden = true;
+        const say = (words, tone) => {
+            note.textContent = words ?? '';
+            note.hidden = !words;
+            if (tone)
+                note.dataset['tone'] = tone;
+            else
+                delete note.dataset['tone'];
+        };
+        const box = (0, map_core_1.createMapBox)({
+            document: doc,
+            provider: settings.provider,
+            locale: context.locale ?? 'en',
+            labels,
+            name: field.label,
+            keys: labels.placeKeys,
+            center: settings.center,
+            zoom: settings.center ? (settings.zoom ?? 11) : undefined,
+            height: typeof options['height'] === 'number' ? options['height'] : undefined,
+        });
+        // ---- the coordinates, typeable -------------------------------------------
+        const coords = doc.createElement('div');
+        coords.className = 'fd-map-coords';
+        const coordinate = (words, inputId) => {
+            const label = doc.createElement('label');
+            const input = doc.createElement('input');
+            input.className = 'fd-input';
+            input.id = inputId;
+            input.inputMode = 'decimal';
+            input.autocomplete = 'off';
+            input.spellcheck = false;
+            label.append(words, input);
+            coords.append(label);
+            return input;
+        };
+        const lat = coordinate(labels.latitude, search ? `${id}-lat` : id);
+        const lng = coordinate(labels.longitude, `${id}-lng`);
+        const typed = () => {
+            const a = (0, geo_1.parseCoordinate)(lat.value);
+            const b = (0, geo_1.parseCoordinate)(lng.value);
+            const empty = !lat.value.trim() && !lng.value.trim();
+            const good = empty || (0, geo_1.isLatLng)(a, b);
+            lat.setAttribute('aria-invalid', String(!good || (a !== null && Math.abs(a) > 90)));
+            lng.setAttribute('aria-invalid', String(!good || (b !== null && Math.abs(b) > 180)));
+            if (!good)
+                return say(labels.notACoordinate, 'error');
+            say(null);
+            if (empty)
+                return set(null);
+            set({ lat: a, lng: b }, { fly: true, name: true });
+        };
+        for (const input of [lat, lng]) {
+            input.addEventListener('change', typed);
+            input.addEventListener('keydown', (event) => event.key === 'Enter' && (event.preventDefault(), typed()));
+        }
+        // ---- writing ---------------------------------------------------------------
+        function write(next) {
+            if (inFields) {
+                form.setValue(name, next ? round6(next.lat) : null);
+                form.setValue(longitudeField, next ? round6(next.lng) : null);
+            }
+            else
+                form.setValue(name, next ? (0, geo_1.asJson)((0, geo_1.writePoint)(next)) : null);
+        }
+        let naming = null;
+        /** The address from the point, where the provider can say one, unless a person typed their own. */
+        function nameFrom(at) {
+            if (!addressField || !reverse)
+                return;
+            const current = values[addressField];
+            if (current !== null && current !== undefined && current !== '' && current !== addressWritten)
+                return;
+            naming?.abort();
+            naming = new AbortController();
+            reverse({ ...at, locale: context.locale ?? 'en', signal: naming.signal })
+                .then((label) => {
+                if (!label)
+                    return;
+                addressWritten = label;
+                form.setValue(addressField, label);
+            })
+                .catch(() => undefined);
+        }
+        function set(next, how = {}) {
+            if (readonly)
+                return;
+            if (next)
+                next = { lat: round6(next.lat), lng: round6(next.lng) };
+            point = next;
+            show(how.fly);
+            write(next);
+            if (next && how.address !== undefined && addressField) {
+                addressWritten = how.address;
+                form.setValue(addressField, how.address);
+            }
+            else if (next && how.name)
+                nameFrom(next);
+        }
+        // ---- the map and its pin ---------------------------------------------------
+        let marker = null;
+        function show(fly = false) {
+            clear.hidden = readonly || !point;
+            box.ready((map, L) => {
+                if (!point) {
+                    marker?.remove();
+                    marker = null;
+                    return;
+                }
+                const at = [point.lat, point.lng];
+                if (!marker)
+                    marker = makeMarker(map, L, at);
+                else
+                    marker.setLatLng(at);
+                if (marker.dragging) {
+                    if (readonly)
+                        marker.dragging.disable();
+                    else
+                        marker.dragging.enable();
+                }
+                marker.getElement()?.setAttribute('aria-label', `${field.label}: ${point.lat}, ${point.lng}`);
+                if (fly)
+                    map.setView(at, Math.max(map.getZoom(), zoom));
+                else if (!map.getBounds().contains(at))
+                    map.setView(at, map.getZoom() < 5 ? zoom : map.getZoom());
+            });
+        }
+        function makeMarker(map, L, at) {
+            const icon = L.divIcon({ className: 'fd-map-pin', html: PIN, iconSize: [28, 40], iconAnchor: [14, 39] });
+            const pin = L.marker(at, { icon, draggable: !readonly, keyboard: true, autoPan: true }).addTo(map);
+            pin.on('dragend', () => {
+                const moved = pin.getLatLng();
+                set({ lat: moved.lat, lng: moved.lng }, { name: true });
+            });
+            // The arrow keys carry the pin a few pixels; Shift, further.
+            pin.getElement()?.addEventListener('keydown', (event) => {
+                const step = event.shiftKey ? 16 : 4;
+                const by = { ArrowUp: [0, -step], ArrowDown: [0, step], ArrowLeft: [-step, 0], ArrowRight: [step, 0] }[event.key];
+                if (!by || readonly)
+                    return;
+                event.preventDefault();
+                event.stopPropagation();
+                const there = map.containerPointToLatLng(map.latLngToContainerPoint(pin.getLatLng()).add(L.point(by[0], by[1])));
+                set({ lat: there.lat, lng: there.lng }, { name: true });
+            });
+            return pin;
+        }
+        box.ready((map) => {
+            map.on('click', (event) => set({ lat: event.latlng.lat, lng: event.latlng.lng }, { name: true }));
+            // Enter on the map: the place at its centre, where the cross is.
+            box.element.addEventListener('keydown', (event) => {
+                if ((event.key !== 'Enter' && event.key !== ' ') || event.target !== box.element || readonly)
+                    return;
+                event.preventDefault();
+                const centre = map.getCenter();
+                set({ lat: centre.lat, lng: centre.lng }, { name: true });
+            });
+            show(true);
+        });
+        // ---- search, my location, clear ---------------------------------------------
+        const found = search
+            ? (0, search_box_1.searchBox)({
+                document: doc,
+                id: lat.id === id ? `${id}-search` : id,
+                labels,
+                search,
+                asYouType: asYouType,
+                locale: context.locale ?? 'en',
+                near: () => point ?? settings.center,
+                pick: (place) => set({ lat: place.lat, lng: place.lng }, { fly: true, address: place.label }),
+                say,
+            })
+            : null;
+        if (found)
+            tools.append(found.element);
+        const myLocation = doc.createElement('button');
+        myLocation.type = 'button';
+        myLocation.className = 'fd-button';
+        myLocation.innerHTML = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><circle cx="12" cy="12" r="4"/><path d="M12 2v3M12 19v3M2 12h3M19 12h3"/></svg>';
+        myLocation.append(labels.myLocation);
+        let blocked = false;
+        myLocation.hidden = !geolocation;
+        myLocation.addEventListener('click', () => {
+            if (!geolocation)
+                return;
+            say(labels.locating);
+            geolocation.getCurrentPosition((position) => {
+                say(null);
+                set({ lat: position.coords.latitude, lng: position.coords.longitude }, { fly: true, name: true });
+            }, (error) => {
+                if (error.code === error.PERMISSION_DENIED) {
+                    blocked = true;
+                    myLocation.hidden = true;
+                    say(labels.locationBlocked);
+                }
+                else
+                    say(labels.locationFailed, 'error');
+            }, { enableHighAccuracy: true, timeout: 10_000, maximumAge: 60_000 });
+        });
+        // Location blocked for the site: the button goes, with the reason in its place.
+        doc.defaultView?.navigator.permissions
+            ?.query({ name: 'geolocation' })
+            .then((status) => {
+            const read = () => {
+                blocked = status.state === 'denied';
+                myLocation.hidden = !geolocation || blocked || readonly;
+                if (blocked)
+                    say(labels.locationBlocked);
+            };
+            read();
+            status.onchange = read;
+        })
+            .catch(() => undefined);
+        const clear = doc.createElement('button');
+        clear.type = 'button';
+        clear.className = 'fd-button fd-button-link';
+        clear.textContent = labels.clear;
+        clear.hidden = true;
+        clear.addEventListener('click', () => {
+            set(null);
+            say(null);
+            (found?.input ?? lat).focus();
+        });
+        tools.append(myLocation, clear);
+        element.append(tools, box.element, coords, note);
+        const showCoords = () => {
+            for (const [input, n] of [[lat, point?.lat], [lng, point?.lng]]) {
+                if (doc.activeElement === input)
+                    continue;
+                input.value = n === undefined ? '' : String(n);
+                input.setAttribute('aria-invalid', 'false');
+            }
+        };
+        return {
+            element,
+            focus: () => (found?.input ?? lat).focus(),
+            destroy: () => {
+                naming?.abort();
+                found?.destroy();
+                box.destroy();
+            },
+            update(state) {
+                values = state.values;
+                readonly = state.readonly;
+                const next = inFields
+                    ? (0, geo_1.isLatLng)(state.value, state.values[longitudeField])
+                        ? { lat: state.value, lng: state.values[longitudeField] }
+                        : null
+                    : (0, geo_1.readPoint)(state.value);
+                const changed = next?.lat !== point?.lat || next?.lng !== point?.lng;
+                point = next;
+                tools.hidden = readonly;
+                myLocation.hidden = !geolocation || blocked || readonly;
+                for (const input of [lat, lng])
+                    input.readOnly = readonly;
+                const target = found?.input ?? lat;
+                target.setAttribute('aria-invalid', String(state.invalid));
+                target.setAttribute('aria-required', String(state.required));
+                if (state.describedBy)
+                    target.setAttribute('aria-describedby', state.describedBy);
+                else
+                    target.removeAttribute('aria-describedby');
+                lat.setAttribute('aria-required', String(state.required));
+                showCoords();
+                box.refresh();
+                if (changed)
+                    show();
+                else
+                    clear.hidden = readonly || !point;
+            },
+        };
+    };
+}
+//# sourceMappingURL=place.js.map