isard 1.2.0 → 1.3.0

package/dist/ui/search.js

@@ -0,0 +1,119 @@
+/**
+ * The search bar: places suggested as the user types (the Géoplateforme's geocoding by default, or yours), the map
+ * flying to the one picked. A combobox for screen readers: arrows move in the list, Enter picks, Escape closes.
+ */
+import { geoplateformeGeocode } from "../geoplateforme.js";
+/** Milliseconds of typing before the text is looked up */
+const DEBOUNCE_MS = 250;
+/** The default pick: a flight to the place, an address seen closer than a town */
+const flyThere = (place, map) => map.flyTo({ center: place.lonLat, zoom: place.kind === 'address' ? 17 : 14 });
+/** A text box and the places it suggests, in a corner of the map */
+export class SearchControl {
+    options;
+    stop;
+    constructor(options = {}) {
+        this.options = options;
+    }
+    onAdd(map) {
+        const { geocode, onSelect = flyThere, placeholder = 'Search a place', maxResults = 8 } = this.options;
+        const lookUp = geocode ?? ((text, signal) => geoplateformeGeocode(text, { signal }));
+        const element = document.createElement('div');
+        const input = document.createElement('input');
+        const list = document.createElement('ul');
+        const listId = `isard-search-${Math.random().toString(36).slice(2)}`;
+        const state = { places: [], active: -1 };
+        element.className = 'isard-ctrl-search';
+        input.type = 'search';
+        input.placeholder = placeholder;
+        input.setAttribute('role', 'combobox');
+        input.setAttribute('aria-label', placeholder);
+        input.setAttribute('aria-autocomplete', 'list');
+        input.setAttribute('aria-controls', listId);
+        input.setAttribute('aria-expanded', 'false');
+        list.id = listId;
+        list.setAttribute('role', 'listbox');
+        list.hidden = true;
+        element.append(input, list);
+        const show = () => {
+            list.replaceChildren(...state.places.map((place, i) => {
+                const item = document.createElement('li');
+                item.id = `${listId}-${i}`;
+                item.setAttribute('role', 'option');
+                item.setAttribute('aria-selected', String(i === state.active));
+                item.textContent = place.label;
+                // Before the input's blur
+                item.addEventListener('pointerdown', (e) => {
+                    e.preventDefault();
+                    pick(i);
+                });
+                return item;
+            }));
+            list.hidden = state.places.length === 0;
+            input.setAttribute('aria-expanded', String(!list.hidden));
+            if (state.active >= 0)
+                input.setAttribute('aria-activedescendant', `${listId}-${state.active}`);
+            else
+                input.removeAttribute('aria-activedescendant');
+        };
+        const close = () => {
+            state.places = [];
+            state.active = -1;
+            show();
+        };
+        const pick = (i) => {
+            const place = state.places[i];
+            if (!place)
+                return;
+            input.value = place.label;
+            close();
+            onSelect(place, map);
+        };
+        const search = () => {
+            state.query?.abort();
+            const query = new AbortController();
+            state.query = query;
+            lookUp(input.value, query.signal).then((places) => {
+                if (query.signal.aborted)
+                    return;
+                state.places = places.slice(0, maxResults);
+                state.active = -1;
+                show();
+            }, (error) => {
+                if (!query.signal.aborted)
+                    console.warn(error);
+            });
+        };
+        input.addEventListener('input', () => {
+            clearTimeout(state.timer);
+            state.timer = setTimeout(search, DEBOUNCE_MS);
+        });
+        input.addEventListener('keydown', (e) => {
+            const count = state.places.length;
+            if (e.key === 'ArrowDown' && count > 0)
+                state.active = (state.active + 1) % count;
+            else if (e.key === 'ArrowUp' && count > 0)
+                state.active = (state.active - 1 + count) % count;
+            else if (e.key === 'Enter')
+                pick(Math.max(0, state.active));
+            else if (e.key === 'Escape')
+                close();
+            else
+                return;
+            e.preventDefault();
+            show();
+        });
+        input.addEventListener('blur', close);
+        // The map's keys (arrows, +, -) are not the input's
+        element.addEventListener('keydown', (e) => e.stopPropagation());
+        this.stop = () => {
+            clearTimeout(state.timer);
+            state.query?.abort();
+        };
+        return element;
+    }
+    onRemove() {
+        this.stop?.();
+        this.stop = undefined;
+    }
+}
+//# sourceMappingURL=search.js.map

package/dist/ui/search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"search.js","sourceRoot":"","sources":["../../src/ui/search.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * The search bar: places suggested as the user types (the Géoplateforme's geocoding by default, or yours), the map\n * flying to the one picked. A combobox for screen readers: arrows move in the list, Enter picks, Escape closes.\n */\n\nimport { type GeocodedPlace, geoplateformeGeocode } from '../geoplateforme.ts';\nimport type { GeoMap } from '../map.ts';\nimport type { Control } from './controls.ts';\n\nexport interface SearchOptions {\n  /** The places of a text (default: the Géoplateforme's geocoding, France) */\n  geocode?: (text: string, signal: AbortSignal) => Promise<GeocodedPlace[]>;\n  /** What a pick does (default: a flight there, closer for an address than for a place) */\n  onSelect?: (place: GeocodedPlace, map: GeoMap) => void;\n  /** Default 'Search a place' */\n  placeholder?: string;\n  /** Suggestions shown at most (default 8) */\n  maxResults?: number;\n}\n\n/** Milliseconds of typing before the text is looked up */\nconst DEBOUNCE_MS = 250;\n\n/** The default pick: a flight to the place, an address seen closer than a town */\nconst flyThere = (place: GeocodedPlace, map: GeoMap) =>\n  map.flyTo({ center: place.lonLat, zoom: place.kind === 'address' ? 17 : 14 });\n\n/** A text box and the places it suggests, in a corner of the map */\nexport class SearchControl implements Control {\n  private readonly options: SearchOptions;\n  private stop: (() => void) | undefined;\n\n  constructor(options: SearchOptions = {}) {\n    this.options = options;\n  }\n\n  onAdd(map: GeoMap): HTMLElement {\n    const { geocode, onSelect = flyThere, placeholder = 'Search a place', maxResults = 8 } = this.options;\n    const lookUp = geocode ?? ((text: string, signal: AbortSignal) => geoplateformeGeocode(text, { signal }));\n    const element = document.createElement('div');\n    const input = document.createElement('input');\n    const list = document.createElement('ul');\n    const listId = `isard-search-${Math.random().toString(36).slice(2)}`;\n    const state: {\n      places: GeocodedPlace[];\n      active: number;\n      timer?: ReturnType<typeof setTimeout>;\n      query?: AbortController;\n    } = { places: [], active: -1 };\n\n    element.className = 'isard-ctrl-search';\n    input.type = 'search';\n    input.placeholder = placeholder;\n    input.setAttribute('role', 'combobox');\n    input.setAttribute('aria-label', placeholder);\n    input.setAttribute('aria-autocomplete', 'list');\n    input.setAttribute('aria-controls', listId);\n    input.setAttribute('aria-expanded', 'false');\n    list.id = listId;\n    list.setAttribute('role', 'listbox');\n    list.hidden = true;\n    element.append(input, list);\n\n    const show = () => {\n      list.replaceChildren(\n        ...state.places.map((place, i) => {\n          const item = document.createElement('li');\n\n          item.id = `${listId}-${i}`;\n          item.setAttribute('role', 'option');\n          item.setAttribute('aria-selected', String(i === state.active));\n          item.textContent = place.label;\n          // Before the input's blur\n          item.addEventListener('pointerdown', (e) => {\n            e.preventDefault();\n            pick(i);\n          });\n\n          return item;\n        }),\n      );\n      list.hidden = state.places.length === 0;\n      input.setAttribute('aria-expanded', String(!list.hidden));\n      if (state.active >= 0) input.setAttribute('aria-activedescendant', `${listId}-${state.active}`);\n      else input.removeAttribute('aria-activedescendant');\n    };\n    const close = () => {\n      state.places = [];\n      state.active = -1;\n      show();\n    };\n    const pick = (i: number) => {\n      const place = state.places[i];\n\n      if (!place) return;\n      input.value = place.label;\n      close();\n      onSelect(place, map);\n    };\n    const search = () => {\n      state.query?.abort();\n\n      const query = new AbortController();\n\n      state.query = query;\n      lookUp(input.value, query.signal).then(\n        (places) => {\n          if (query.signal.aborted) return;\n          state.places = places.slice(0, maxResults);\n          state.active = -1;\n          show();\n        },\n        (error: unknown) => {\n          if (!query.signal.aborted) console.warn(error);\n        },\n      );\n    };\n\n    input.addEventListener('input', () => {\n      clearTimeout(state.timer);\n      state.timer = setTimeout(search, DEBOUNCE_MS);\n    });\n    input.addEventListener('keydown', (e) => {\n      const count = state.places.length;\n\n      if (e.key === 'ArrowDown' && count > 0) state.active = (state.active + 1) % count;\n      else if (e.key === 'ArrowUp' && count > 0) state.active = (state.active - 1 + count) % count;\n      else if (e.key === 'Enter') pick(Math.max(0, state.active));\n      else if (e.key === 'Escape') close();\n      else return;\n      e.preventDefault();\n      show();\n    });\n    input.addEventListener('blur', close);\n    // The map's keys (arrows, +, -) are not the input's\n    element.addEventListener('keydown', (e) => e.stopPropagation());\n\n    this.stop = () => {\n      clearTimeout(state.timer);\n      state.query?.abort();\n    };\n\n    return element;\n  }\n\n  onRemove(): void {\n    this.stop?.();\n    this.stop = undefined;\n  }\n}\n"]}

package/dist/ui/style.js

@@ -48,6 +48,23 @@ const CSS = `
 .isard-ctrl-group button.active { background: var(--isard-ctrl-active); color: var(--isard-ctrl-active-fg); }
 .isard-ctrl-group button svg { display: block; margin: auto; pointer-events: none; }
 .isard-ctrl-compass svg { transition: transform 0.05s; }
+.isard-ctrl-scale {
+  box-sizing: border-box; padding: 0 5px; border: 2px solid var(--isard-ctrl-fg); border-top: 0;
+  background: var(--isard-attrib-bg); color: var(--isard-ctrl-fg); font: 11px/1.4 system-ui, sans-serif; white-space: nowrap;
+}
+.isard-ctrl-search { position: relative; width: 260px; }
+.isard-ctrl-search input {
+  box-sizing: border-box; width: 100%; padding: 6px 10px; border: 0; border-radius: 4px; outline: none;
+  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); box-shadow: var(--isard-ctrl-shadow); font: 13px system-ui, sans-serif;
+}
+.isard-ctrl-search input:focus-visible { box-shadow: 0 0 0 2px var(--isard-focus); }
+.isard-ctrl-search ul {
+  position: absolute; left: 0; right: 0; margin: 4px 0 0; padding: 4px 0; list-style: none; border-radius: 4px;
+  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); box-shadow: var(--isard-ctrl-shadow); font: 13px system-ui, sans-serif;
+}
+.isard-ctrl-search li { padding: 5px 10px; cursor: pointer; }
+.isard-ctrl-search li:hover, .isard-ctrl-search li[aria-selected="true"] { background: var(--isard-ctrl-hover); }
+.isard-ctrl-minimap { overflow: hidden; cursor: pointer; border-radius: 4px; box-shadow: var(--isard-ctrl-shadow); background: var(--isard-ctrl-bg); }
 .isard-marker { position: absolute; top: 0; left: 0; pointer-events: auto; will-change: transform; }
 .isard-marker-draggable { cursor: grab; touch-action: none; }
 .isard-marker-dragging { cursor: grabbing; }

package/dist/ui/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/ui/style.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,GAAG,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmHX,CAAC;AAEF,MAAM,MAAM,GAAG,IAAI,OAAO,EAAY,CAAC;AAEvC,mHAAmH;AACnH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,GAAa,EAAQ,EAAE;IACjD,IAAI,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC;QAAE,OAAO;IAC5B,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAEhB,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAEzC,KAAK,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC;IACzB,KAAK,CAAC,WAAW,GAAG,GAAG,CAAC;IACxB,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC1B,CAAC,CAAC","sourcesContent":["/**\n * Styles of the DOM overlays (markers, popups, controls), injected once per document so the package needs no CSS\n * file. Colors are custom properties, defaults on the root with no specificity: an application restyles them on any\n * element around the map (its container's class may be replaced by a framework: nothing depends on it).\n */\n\nconst CSS = `\n:where(:root) {\n  --isard-ctrl-bg: #fff;\n  --isard-ctrl-fg: #333;\n  --isard-ctrl-hover: rgb(0 0 0 / 0.05);\n  --isard-ctrl-active: #1d2433;\n  --isard-ctrl-active-fg: #fff;\n  --isard-ctrl-border: #ddd;\n  --isard-ctrl-shadow: 0 0 0 2px rgb(0 0 0 / 0.1);\n  --isard-popup-bg: #fff;\n  --isard-popup-fg: #1d2433;\n  --isard-marker-color: #3a6fd8;\n  --isard-attrib-bg: rgb(255 255 255 / 0.5);\n  --isard-attrib-fg: rgb(0 0 0 / 0.75);\n  --isard-focus: #3a6fd8;\n}\n.isard-canvas:focus { outline: none; }\n.isard-canvas:focus-visible { outline: 2px solid var(--isard-focus); outline-offset: -2px; }\n.isard-overlay { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }\n.isard-ctrl-top-left, .isard-ctrl-top-right, .isard-ctrl-bottom-left, .isard-ctrl-bottom-right {\n  position: absolute; pointer-events: none; z-index: 2;\n}\n.isard-ctrl-top-left { top: 0; left: 0; }\n.isard-ctrl-top-right { top: 0; right: 0; }\n.isard-ctrl-bottom-left { bottom: 0; left: 0; }\n.isard-ctrl-bottom-right { bottom: 0; right: 0; }\n.isard-ctrl { clear: both; pointer-events: auto; transform: translate(0, 0); }\n.isard-ctrl-top-left .isard-ctrl { float: left; margin: 10px 0 0 10px; }\n.isard-ctrl-top-right .isard-ctrl { float: right; margin: 10px 10px 0 0; }\n.isard-ctrl-bottom-left .isard-ctrl { float: left; margin: 0 0 10px 10px; }\n.isard-ctrl-bottom-right .isard-ctrl { float: right; margin: 0 10px 10px 0; }\n.isard-ctrl-group { background: var(--isard-ctrl-bg); border-radius: 4px; box-shadow: var(--isard-ctrl-shadow); }\n.isard-ctrl-group button {\n  display: block; width: 29px; height: 29px; padding: 0; margin: 0; border: 0; box-sizing: border-box;\n  background: transparent; color: var(--isard-ctrl-fg); cursor: pointer; font: inherit;\n}\n.isard-ctrl-group button + button { border-top: 1px solid var(--isard-ctrl-border); }\n.isard-ctrl-group button:first-child { border-radius: 4px 4px 0 0; }\n.isard-ctrl-group button:last-child { border-radius: 0 0 4px 4px; }\n.isard-ctrl-group button:only-child { border-radius: inherit; }\n.isard-ctrl-group button:hover { background-color: var(--isard-ctrl-hover); }\n.isard-ctrl-group button:focus-visible { outline: 2px solid var(--isard-ctrl-active); outline-offset: -2px; }\n.isard-ctrl-group button.active { background: var(--isard-ctrl-active); color: var(--isard-ctrl-active-fg); }\n.isard-ctrl-group button svg { display: block; margin: auto; pointer-events: none; }\n.isard-ctrl-compass svg { transition: transform 0.05s; }\n.isard-marker { position: absolute; top: 0; left: 0; pointer-events: auto; will-change: transform; }\n.isard-marker-draggable { cursor: grab; touch-action: none; }\n.isard-marker-dragging { cursor: grabbing; }\n.isard-marker-stem { position: absolute; z-index: -1; width: 2px; margin-left: -1px; transform-origin: top center; background: var(--isard-marker-color); opacity: 0.8; pointer-events: none; }\n.isard-marker-stem::after { content: \"\"; position: absolute; bottom: -3px; left: -2px; width: 6px; height: 6px; border-radius: 50%; background: inherit; }\n.isard-marker-pin { display: block; color: var(--isard-marker-color); filter: drop-shadow(0 1px 2px rgb(0 0 0 / 0.35)); }\n.isard-panel { position: absolute; top: 0; left: 0; transform-origin: 0 0; pointer-events: auto; will-change: transform; }\n.isard-popup {\n  position: absolute; top: 0; left: 0; display: flex; pointer-events: none; will-change: transform; z-index: 1;\n  color: var(--isard-popup-fg);\n}\n.isard-popup-anchor-top, .isard-popup-anchor-top-left, .isard-popup-anchor-top-right { flex-direction: column; }\n.isard-popup-anchor-bottom, .isard-popup-anchor-bottom-left, .isard-popup-anchor-bottom-right {\n  flex-direction: column-reverse;\n}\n.isard-popup-anchor-left { flex-direction: row; }\n.isard-popup-anchor-right { flex-direction: row-reverse; }\n.isard-popup-tip { width: 0; height: 0; border: 10px solid transparent; z-index: 1; }\n.isard-popup-anchor-top .isard-popup-tip { align-self: center; border-top: none; border-bottom-color: var(--isard-popup-bg); }\n.isard-popup-anchor-top-left .isard-popup-tip {\n  align-self: flex-start; border-top: none; border-left: none; border-bottom-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-top-right .isard-popup-tip {\n  align-self: flex-end; border-top: none; border-right: none; border-bottom-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-bottom .isard-popup-tip { align-self: center; border-bottom: none; border-top-color: var(--isard-popup-bg); }\n.isard-popup-anchor-bottom-left .isard-popup-tip {\n  align-self: flex-start; border-bottom: none; border-left: none; border-top-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-bottom-right .isard-popup-tip {\n  align-self: flex-end; border-bottom: none; border-right: none; border-top-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-left .isard-popup-tip { align-self: center; border-left: none; border-right-color: var(--isard-popup-bg); }\n.isard-popup-anchor-right .isard-popup-tip { align-self: center; border-right: none; border-left-color: var(--isard-popup-bg); }\n.isard-popup-content {\n  position: relative; padding: 12px 14px; border-radius: 4px; background: var(--isard-popup-bg);\n  box-shadow: 0 1px 4px rgb(0 0 0 / 0.2); pointer-events: auto; overflow-wrap: break-word;\n}\n.isard-popup-has-close .isard-popup-content { padding-right: 26px; }\n.isard-popup-anchor-top-left .isard-popup-content { border-top-left-radius: 0; }\n.isard-popup-anchor-top-right .isard-popup-content { border-top-right-radius: 0; }\n.isard-popup-anchor-bottom-left .isard-popup-content { border-bottom-left-radius: 0; }\n.isard-popup-anchor-bottom-right .isard-popup-content { border-bottom-right-radius: 0; }\n.isard-popup-close {\n  position: absolute; top: 0; right: 0; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 0 4px 0 4px;\n  background: transparent; color: inherit; font: 18px/22px system-ui, sans-serif; cursor: pointer;\n}\n.isard-popup-close:hover { background: rgb(0 0 0 / 0.05); }\n.isard-popup-close:focus-visible, .isard-attrib-button:focus-visible, .isard-attrib a:focus-visible {\n  outline: 2px solid var(--isard-focus); outline-offset: -2px;\n}\n.isard-attrib {\n  display: flex; align-items: center; gap: 4px; padding: 0 5px; border-radius: 4px; background: var(--isard-attrib-bg);\n  color: var(--isard-attrib-fg); font: 12px/20px system-ui, sans-serif;\n}\n.isard-ctrl-bottom-right .isard-ctrl.isard-attrib, .isard-ctrl-bottom-left .isard-ctrl.isard-attrib { margin-bottom: 0; }\n.isard-ctrl-bottom-right .isard-ctrl.isard-attrib { margin-right: 0; border-radius: 4px 0 0 0; }\n.isard-ctrl-bottom-left .isard-ctrl.isard-attrib { margin-left: 0; border-radius: 0 4px 0 0; }\n.isard-attrib a { color: inherit; text-decoration: none; }\n.isard-attrib a:hover { text-decoration: underline; }\n.isard-attrib-button {\n  display: none; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 12px; flex: none;\n  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); cursor: pointer;\n}\n.isard-attrib-button svg { display: block; margin: auto; }\n.isard-ctrl.isard-attrib.isard-attrib-compact { min-height: 24px; padding: 2px; border-radius: 12px; margin: 0 10px 10px; }\n.isard-attrib-compact .isard-attrib-button { display: block; }\n.isard-attrib-compact .isard-attrib-inner { display: none; padding: 0 6px 0 2px; }\n.isard-attrib-compact.isard-attrib-open { background: var(--isard-ctrl-bg); }\n.isard-attrib-compact.isard-attrib-open .isard-attrib-inner { display: block; }\n`;\n\nconst styled = new WeakSet<Document>();\n\n/** Adds the overlay styles to a document, once; first in the head so application rules win at equal specificity */\nexport const injectStyle = (doc: Document): void => {\n  if (styled.has(doc)) return;\n  styled.add(doc);\n\n  const style = doc.createElement('style');\n\n  style.dataset.isard = '';\n  style.textContent = CSS;\n  doc.head.prepend(style);\n};\n"]}
+{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/ui/style.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,GAAG,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoIX,CAAC;AAEF,MAAM,MAAM,GAAG,IAAI,OAAO,EAAY,CAAC;AAEvC,mHAAmH;AACnH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,GAAa,EAAQ,EAAE;IACjD,IAAI,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC;QAAE,OAAO;IAC5B,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAEhB,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAEzC,KAAK,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC;IACzB,KAAK,CAAC,WAAW,GAAG,GAAG,CAAC;IACxB,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC1B,CAAC,CAAC","sourcesContent":["/**\n * Styles of the DOM overlays (markers, popups, controls), injected once per document so the package needs no CSS\n * file. Colors are custom properties, defaults on the root with no specificity: an application restyles them on any\n * element around the map (its container's class may be replaced by a framework: nothing depends on it).\n */\n\nconst CSS = `\n:where(:root) {\n  --isard-ctrl-bg: #fff;\n  --isard-ctrl-fg: #333;\n  --isard-ctrl-hover: rgb(0 0 0 / 0.05);\n  --isard-ctrl-active: #1d2433;\n  --isard-ctrl-active-fg: #fff;\n  --isard-ctrl-border: #ddd;\n  --isard-ctrl-shadow: 0 0 0 2px rgb(0 0 0 / 0.1);\n  --isard-popup-bg: #fff;\n  --isard-popup-fg: #1d2433;\n  --isard-marker-color: #3a6fd8;\n  --isard-attrib-bg: rgb(255 255 255 / 0.5);\n  --isard-attrib-fg: rgb(0 0 0 / 0.75);\n  --isard-focus: #3a6fd8;\n}\n.isard-canvas:focus { outline: none; }\n.isard-canvas:focus-visible { outline: 2px solid var(--isard-focus); outline-offset: -2px; }\n.isard-overlay { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }\n.isard-ctrl-top-left, .isard-ctrl-top-right, .isard-ctrl-bottom-left, .isard-ctrl-bottom-right {\n  position: absolute; pointer-events: none; z-index: 2;\n}\n.isard-ctrl-top-left { top: 0; left: 0; }\n.isard-ctrl-top-right { top: 0; right: 0; }\n.isard-ctrl-bottom-left { bottom: 0; left: 0; }\n.isard-ctrl-bottom-right { bottom: 0; right: 0; }\n.isard-ctrl { clear: both; pointer-events: auto; transform: translate(0, 0); }\n.isard-ctrl-top-left .isard-ctrl { float: left; margin: 10px 0 0 10px; }\n.isard-ctrl-top-right .isard-ctrl { float: right; margin: 10px 10px 0 0; }\n.isard-ctrl-bottom-left .isard-ctrl { float: left; margin: 0 0 10px 10px; }\n.isard-ctrl-bottom-right .isard-ctrl { float: right; margin: 0 10px 10px 0; }\n.isard-ctrl-group { background: var(--isard-ctrl-bg); border-radius: 4px; box-shadow: var(--isard-ctrl-shadow); }\n.isard-ctrl-group button {\n  display: block; width: 29px; height: 29px; padding: 0; margin: 0; border: 0; box-sizing: border-box;\n  background: transparent; color: var(--isard-ctrl-fg); cursor: pointer; font: inherit;\n}\n.isard-ctrl-group button + button { border-top: 1px solid var(--isard-ctrl-border); }\n.isard-ctrl-group button:first-child { border-radius: 4px 4px 0 0; }\n.isard-ctrl-group button:last-child { border-radius: 0 0 4px 4px; }\n.isard-ctrl-group button:only-child { border-radius: inherit; }\n.isard-ctrl-group button:hover { background-color: var(--isard-ctrl-hover); }\n.isard-ctrl-group button:focus-visible { outline: 2px solid var(--isard-ctrl-active); outline-offset: -2px; }\n.isard-ctrl-group button.active { background: var(--isard-ctrl-active); color: var(--isard-ctrl-active-fg); }\n.isard-ctrl-group button svg { display: block; margin: auto; pointer-events: none; }\n.isard-ctrl-compass svg { transition: transform 0.05s; }\n.isard-ctrl-scale {\n  box-sizing: border-box; padding: 0 5px; border: 2px solid var(--isard-ctrl-fg); border-top: 0;\n  background: var(--isard-attrib-bg); color: var(--isard-ctrl-fg); font: 11px/1.4 system-ui, sans-serif; white-space: nowrap;\n}\n.isard-ctrl-search { position: relative; width: 260px; }\n.isard-ctrl-search input {\n  box-sizing: border-box; width: 100%; padding: 6px 10px; border: 0; border-radius: 4px; outline: none;\n  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); box-shadow: var(--isard-ctrl-shadow); font: 13px system-ui, sans-serif;\n}\n.isard-ctrl-search input:focus-visible { box-shadow: 0 0 0 2px var(--isard-focus); }\n.isard-ctrl-search ul {\n  position: absolute; left: 0; right: 0; margin: 4px 0 0; padding: 4px 0; list-style: none; border-radius: 4px;\n  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); box-shadow: var(--isard-ctrl-shadow); font: 13px system-ui, sans-serif;\n}\n.isard-ctrl-search li { padding: 5px 10px; cursor: pointer; }\n.isard-ctrl-search li:hover, .isard-ctrl-search li[aria-selected=\"true\"] { background: var(--isard-ctrl-hover); }\n.isard-ctrl-minimap { overflow: hidden; cursor: pointer; border-radius: 4px; box-shadow: var(--isard-ctrl-shadow); background: var(--isard-ctrl-bg); }\n.isard-marker { position: absolute; top: 0; left: 0; pointer-events: auto; will-change: transform; }\n.isard-marker-draggable { cursor: grab; touch-action: none; }\n.isard-marker-dragging { cursor: grabbing; }\n.isard-marker-stem { position: absolute; z-index: -1; width: 2px; margin-left: -1px; transform-origin: top center; background: var(--isard-marker-color); opacity: 0.8; pointer-events: none; }\n.isard-marker-stem::after { content: \"\"; position: absolute; bottom: -3px; left: -2px; width: 6px; height: 6px; border-radius: 50%; background: inherit; }\n.isard-marker-pin { display: block; color: var(--isard-marker-color); filter: drop-shadow(0 1px 2px rgb(0 0 0 / 0.35)); }\n.isard-panel { position: absolute; top: 0; left: 0; transform-origin: 0 0; pointer-events: auto; will-change: transform; }\n.isard-popup {\n  position: absolute; top: 0; left: 0; display: flex; pointer-events: none; will-change: transform; z-index: 1;\n  color: var(--isard-popup-fg);\n}\n.isard-popup-anchor-top, .isard-popup-anchor-top-left, .isard-popup-anchor-top-right { flex-direction: column; }\n.isard-popup-anchor-bottom, .isard-popup-anchor-bottom-left, .isard-popup-anchor-bottom-right {\n  flex-direction: column-reverse;\n}\n.isard-popup-anchor-left { flex-direction: row; }\n.isard-popup-anchor-right { flex-direction: row-reverse; }\n.isard-popup-tip { width: 0; height: 0; border: 10px solid transparent; z-index: 1; }\n.isard-popup-anchor-top .isard-popup-tip { align-self: center; border-top: none; border-bottom-color: var(--isard-popup-bg); }\n.isard-popup-anchor-top-left .isard-popup-tip {\n  align-self: flex-start; border-top: none; border-left: none; border-bottom-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-top-right .isard-popup-tip {\n  align-self: flex-end; border-top: none; border-right: none; border-bottom-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-bottom .isard-popup-tip { align-self: center; border-bottom: none; border-top-color: var(--isard-popup-bg); }\n.isard-popup-anchor-bottom-left .isard-popup-tip {\n  align-self: flex-start; border-bottom: none; border-left: none; border-top-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-bottom-right .isard-popup-tip {\n  align-self: flex-end; border-bottom: none; border-right: none; border-top-color: var(--isard-popup-bg);\n}\n.isard-popup-anchor-left .isard-popup-tip { align-self: center; border-left: none; border-right-color: var(--isard-popup-bg); }\n.isard-popup-anchor-right .isard-popup-tip { align-self: center; border-right: none; border-left-color: var(--isard-popup-bg); }\n.isard-popup-content {\n  position: relative; padding: 12px 14px; border-radius: 4px; background: var(--isard-popup-bg);\n  box-shadow: 0 1px 4px rgb(0 0 0 / 0.2); pointer-events: auto; overflow-wrap: break-word;\n}\n.isard-popup-has-close .isard-popup-content { padding-right: 26px; }\n.isard-popup-anchor-top-left .isard-popup-content { border-top-left-radius: 0; }\n.isard-popup-anchor-top-right .isard-popup-content { border-top-right-radius: 0; }\n.isard-popup-anchor-bottom-left .isard-popup-content { border-bottom-left-radius: 0; }\n.isard-popup-anchor-bottom-right .isard-popup-content { border-bottom-right-radius: 0; }\n.isard-popup-close {\n  position: absolute; top: 0; right: 0; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 0 4px 0 4px;\n  background: transparent; color: inherit; font: 18px/22px system-ui, sans-serif; cursor: pointer;\n}\n.isard-popup-close:hover { background: rgb(0 0 0 / 0.05); }\n.isard-popup-close:focus-visible, .isard-attrib-button:focus-visible, .isard-attrib a:focus-visible {\n  outline: 2px solid var(--isard-focus); outline-offset: -2px;\n}\n.isard-attrib {\n  display: flex; align-items: center; gap: 4px; padding: 0 5px; border-radius: 4px; background: var(--isard-attrib-bg);\n  color: var(--isard-attrib-fg); font: 12px/20px system-ui, sans-serif;\n}\n.isard-ctrl-bottom-right .isard-ctrl.isard-attrib, .isard-ctrl-bottom-left .isard-ctrl.isard-attrib { margin-bottom: 0; }\n.isard-ctrl-bottom-right .isard-ctrl.isard-attrib { margin-right: 0; border-radius: 4px 0 0 0; }\n.isard-ctrl-bottom-left .isard-ctrl.isard-attrib { margin-left: 0; border-radius: 0 4px 0 0; }\n.isard-attrib a { color: inherit; text-decoration: none; }\n.isard-attrib a:hover { text-decoration: underline; }\n.isard-attrib-button {\n  display: none; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 12px; flex: none;\n  background: var(--isard-ctrl-bg); color: var(--isard-ctrl-fg); cursor: pointer;\n}\n.isard-attrib-button svg { display: block; margin: auto; }\n.isard-ctrl.isard-attrib.isard-attrib-compact { min-height: 24px; padding: 2px; border-radius: 12px; margin: 0 10px 10px; }\n.isard-attrib-compact .isard-attrib-button { display: block; }\n.isard-attrib-compact .isard-attrib-inner { display: none; padding: 0 6px 0 2px; }\n.isard-attrib-compact.isard-attrib-open { background: var(--isard-ctrl-bg); }\n.isard-attrib-compact.isard-attrib-open .isard-attrib-inner { display: block; }\n`;\n\nconst styled = new WeakSet<Document>();\n\n/** Adds the overlay styles to a document, once; first in the head so application rules win at equal specificity */\nexport const injectStyle = (doc: Document): void => {\n  if (styled.has(doc)) return;\n  styled.add(doc);\n\n  const style = doc.createElement('style');\n\n  style.dataset.isard = '';\n  style.textContent = CSS;\n  doc.head.prepend(style);\n};\n"]}

package/dist/util/sun.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Where the sun stands in the sky: its azimuth and altitude at a place and time, from its ecliptic position (the
+ * low-precision formulas of the Astronomical Almanac: within a few hundredths of a degree from 1950 to 2050, far
+ * finer than a shadow needs)
+ */
+import type { LonLat } from '../types.ts';
+/** The sun's azimuth (degrees clockwise from north) and altitude (degrees above the horizon) at `lonLat` at `date` */
+export declare const sunPosition: (date: Date, [lon, lat]: LonLat) => {
+    azimuth: number;
+    altitude: number;
+};

package/dist/util/sun.js

@@ -0,0 +1,26 @@
+/**
+ * Where the sun stands in the sky: its azimuth and altitude at a place and time, from its ecliptic position (the
+ * low-precision formulas of the Astronomical Almanac: within a few hundredths of a degree from 1950 to 2050, far
+ * finer than a shadow needs)
+ */
+const RAD = Math.PI / 180;
+/** The sun's azimuth (degrees clockwise from north) and altitude (degrees above the horizon) at `lonLat` at `date` */
+export const sunPosition = (date, [lon, lat]) => {
+    // Days since J2000.0 (noon on the 1st of January 2000, UTC)
+    const d = date.getTime() / 86_400_000 - 10_957.5;
+    const g = (357.529 + 0.985_600_28 * d) * RAD;
+    const q = 280.459 + 0.985_647_36 * d;
+    // Its ecliptic longitude, the obliquity of the ecliptic, then its right ascension and declination
+    const l = (q + 1.915 * Math.sin(g) + 0.02 * Math.sin(2 * g)) * RAD;
+    const e = (23.439 - 0.000_000_36 * d) * RAD;
+    const ra = Math.atan2(Math.cos(e) * Math.sin(l), Math.cos(l));
+    const dec = Math.asin(Math.sin(e) * Math.sin(l));
+    // Its hour angle at the place, from the sidereal time at Greenwich
+    const gmst = 280.460_618_37 + 360.985_647_366_29 * d;
+    const h = (gmst + lon) * RAD - ra;
+    const phi = lat * RAD;
+    const altitude = Math.asin(Math.sin(phi) * Math.sin(dec) + Math.cos(phi) * Math.cos(dec) * Math.cos(h));
+    const azimuth = Math.atan2(-Math.sin(h), Math.tan(dec) * Math.cos(phi) - Math.sin(phi) * Math.cos(h));
+    return { azimuth: (((azimuth / RAD) % 360) + 360) % 360, altitude: altitude / RAD };
+};
+//# sourceMappingURL=sun.js.map

package/dist/util/sun.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sun.js","sourceRoot":"","sources":["../../src/util/sun.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,GAAG,CAAC;AAE1B,sHAAsH;AACtH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAU,EAAE,CAAC,GAAG,EAAE,GAAG,CAAS,EAAyC,EAAE;IACnG,4DAA4D;IAC5D,MAAM,CAAC,GAAG,IAAI,CAAC,OAAO,EAAE,GAAG,UAAU,GAAG,QAAQ,CAAC;IACjD,MAAM,CAAC,GAAG,CAAC,OAAO,GAAG,YAAY,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC;IAC7C,MAAM,CAAC,GAAG,OAAO,GAAG,YAAY,GAAG,CAAC,CAAC;IACrC,kGAAkG;IAClG,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;IACnE,MAAM,CAAC,GAAG,CAAC,MAAM,GAAG,YAAY,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC;IAC5C,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAC9D,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IACjD,mEAAmE;IACnE,MAAM,IAAI,GAAG,cAAc,GAAG,kBAAkB,GAAG,CAAC,CAAC;IACrD,MAAM,CAAC,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;IAClC,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACtB,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IACxG,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAEtG,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,OAAO,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,EAAE,QAAQ,EAAE,QAAQ,GAAG,GAAG,EAAE,CAAC;AACtF,CAAC,CAAC","sourcesContent":["/**\n * Where the sun stands in the sky: its azimuth and altitude at a place and time, from its ecliptic position (the\n * low-precision formulas of the Astronomical Almanac: within a few hundredths of a degree from 1950 to 2050, far\n * finer than a shadow needs)\n */\n\nimport type { LonLat } from '../types.ts';\n\nconst RAD = Math.PI / 180;\n\n/** The sun's azimuth (degrees clockwise from north) and altitude (degrees above the horizon) at `lonLat` at `date` */\nexport const sunPosition = (date: Date, [lon, lat]: LonLat): { azimuth: number; altitude: number } => {\n  // Days since J2000.0 (noon on the 1st of January 2000, UTC)\n  const d = date.getTime() / 86_400_000 - 10_957.5;\n  const g = (357.529 + 0.985_600_28 * d) * RAD;\n  const q = 280.459 + 0.985_647_36 * d;\n  // Its ecliptic longitude, the obliquity of the ecliptic, then its right ascension and declination\n  const l = (q + 1.915 * Math.sin(g) + 0.02 * Math.sin(2 * g)) * RAD;\n  const e = (23.439 - 0.000_000_36 * d) * RAD;\n  const ra = Math.atan2(Math.cos(e) * Math.sin(l), Math.cos(l));\n  const dec = Math.asin(Math.sin(e) * Math.sin(l));\n  // Its hour angle at the place, from the sidereal time at Greenwich\n  const gmst = 280.460_618_37 + 360.985_647_366_29 * d;\n  const h = (gmst + lon) * RAD - ra;\n  const phi = lat * RAD;\n  const altitude = Math.asin(Math.sin(phi) * Math.sin(dec) + Math.cos(phi) * Math.cos(dec) * Math.cos(h));\n  const azimuth = Math.atan2(-Math.sin(h), Math.tan(dec) * Math.cos(phi) - Math.sin(phi) * Math.cos(h));\n\n  return { azimuth: (((azimuth / RAD) % 360) + 360) % 360, altitude: altitude / RAD };\n};\n"]}

package/dist/wasm/isard.d.ts

@@ -393,6 +393,15 @@ export class Engine {
      * its info log). The tileset itself is read later: a bad one leaves the layer empty, it does not throw
      */
     addTiles3d(url: string, max_error: number, geoid?: boolean | null): number;
+    /**
+     * An empty layer of vector tiles drawn as geometry: its style layers come with `setVectorSublayers`, its tiles
+     * with `setVectorTile`
+     *
+     * # Errors
+     *
+     * Throws (to JavaScript) when a shader fails to compile (the error carries its info log)
+     */
+    addVectorTiles(): number;
     /**
      * Longitudes and latitudes the view covers on the ground, `[west, south, east, north]` (degrees): the screen's
      * border cast on the ground, or on the far plane where it passes the horizon
@@ -510,6 +519,10 @@ export class Engine {
      * Removes a layer and frees its GPU objects; the other layers forget it (a layer that referred to it)
      */
     removeLayer(id: number): void;
+    /**
+     * Removes tile `key` of a vector tile layer (nothing if there is none)
+     */
+    removeVectorTile(id: number, key: number): void;
     /**
      * Draws a frame: the backdrop, the ground and the layers over it bottom to top, then the panorama and the
      * viewshed; returns true while tiles are still loading (a new frame will be asked through `redraw`)
@@ -592,10 +605,10 @@ export class Engine {
      */
     setFeatureRamp(id: number, rgba: Uint8Array | null | undefined, min: number, max: number): void;
     /**
-     * Style of the features of a line, circle, fill or extrusion layer (batch `key` of the latter): 32 floats per
-     * feature, its color (RGBA 0-1), its second color (a circle's stroke), then two sizes as zoom stops (four zooms,
-     * four values each): a line's width; a circle's radius and stroke width, CSS pixels; a block's height and base
-     * height, metres
+     * Style of the features of a line, circle, fill, extrusion or vector tile layer (batch or tile `key` of the last
+     * two): 32 floats per feature, its color (RGBA 0-1), its second color (a circle's stroke), then two sizes as zoom
+     * stops (four zooms, four values each): a line's width; a circle's radius and stroke width, CSS pixels; a block's
+     * height and base height, metres
      */
     setFeatureStyle(id: number, style: Float32Array, key?: number | null): void;
     /**
@@ -765,11 +778,22 @@ export class Engine {
      * Space behind the globe (stars, atmosphere halo), in the globe projection
      */
     setSky(enabled: boolean): void;
+    /**
+     * The sun casting shadows and the night: its azimuth (degrees clockwise from north) and altitude (degrees above
+     * the horizon), the shadows' opacity (0 to 1; none under the horizon or not a number), how dark the night is (0 to
+     * 1: the frame tinted, the lights of the layers on). Neither shadows nor night: nothing drawn
+     *
+     * # Errors
+     *
+     * Throws (to JavaScript) when a WebGL object cannot be created or the pass fails to compile
+     */
+    setSun(azimuth: number, altitude: number, opacity: number, night: number): void;
     /**
      * Shows `layers` on one side of a vertical line only, the others beneath on the other side (comparing two states
-     * of a place): left of `x` (CSS pixels from the left of the canvas), or right of it; a non-finite `x` stops
+     * of a place): left of `x` (CSS pixels from the left of the canvas), or right of it; `others` on the other side
+     * only (two meshes of the same place, each on its side, never drawn over each other); a non-finite `x` stops
      */
-    setSwipe(x: number, right: boolean, layers: Uint32Array): void;
+    setSwipe(x: number, right: boolean, layers: Uint32Array, others: Uint32Array): void;
     /**
      * Layer-wide style of a symbol layer: size scale and opacity as zoom stops (four zooms then four values each),
      * zoom range, visibility
@@ -812,6 +836,44 @@ export class Engine {
      * for none: it tints the textures and colors the untextured meshes) of a 3D Tiles layer
      */
     setTiles3dStyle(id: number, max_error: number, opacity: number, point_size: number | null | undefined, color: Float32Array): void;
+    /**
+     * The style layers of a vector tile layer, in drawing order: per layer, its kind (0 fill, 1 line, 2 extrusion), its zoom range
+     * (two numbers: shown from the first, included, to the second, excluded), whether it shows (0 or 1), its dashes
+     * (four numbers: dash, gap, dash, gap, in line widths; 0: solid), its opacity as zoom stops (four zooms then four
+     * values; missing: opaque), the caps of its lines' ends (0 butt, 1 round, 2 square; missing: round), whether its
+     * lines glow at night (streets; 0 or 1)
+     */
+    setVectorSublayers(id: number, kinds: Uint8Array, zooms: Float64Array, visible: Uint8Array, dashes: Float32Array, opacities: Float32Array, caps: Uint8Array, lit: Uint8Array): void;
+    /**
+     * Adds or replaces tile `key` of a vector tile layer ready for the GPU, as the basemap workers make it (the
+     * tessellation module): its polygons as for `setVectorTile` (picked here; their prisms built here if drawn in
+     * relief while `prism` is false), the vertices of its fills (`shapes::Vertex` as bytes, each with its feature),
+     * their triangles, per sublayer its top cap and the rest of its prism (`fill_ranges`: four numbers, first and
+     * end of each), its line pieces (`pieces::Piece` as bytes), the line table (feature and length of each line),
+     * per sublayer its pieces (`line_ranges`: first, end), the blocks of its extrusion sublayers (`shapes::Block` as
+     * bytes), their triangles, per sublayer its blocks' triangles (`block_ranges`: first, end), the extent of its
+     * points (`bounds`: min x, min y, max x, max y), `feature_count` features
+     *
+     * # Errors
+     *
+     * Throws (to JavaScript) when the vertices, pieces or blocks are cut short, when a WebGL object of the tile cannot be
+     * created, or when its features or lines need a table texture past the GPU's `MAX_TEXTURE_SIZE`
+     */
+    setVectorTileMesh(id: number, key: number, points: Float64Array, ring_start: Uint32Array, polygon_start: Uint32Array, polygon_feature: Uint32Array, fill_start: Uint32Array, vertices: Uint8Array, indices: Uint32Array, fill_ranges: Uint32Array, prism: boolean, pieces: Uint8Array, line_table: Float32Array, line_ranges: Uint32Array, blocks: Uint8Array, block_indices: Uint32Array, block_ranges: Uint32Array, bounds: Float64Array, feature_count: number): void;
+    /**
+     * Adds or replaces tile `key` of a vector tile layer: its polygons as for `addFills` (`fill_start`: the first
+     * polygon of each sublayer, and the end; those of an extrusion sublayer raised into blocks), its lines as for
+     * `addLines` (`line_start`: the first line of each sublayer, and the end), `feature_count` features, styled as an
+     * extrusion layer's (`setFeatureStyle` with the key: a color, then a line's width or a block's height and base);
+     * `tile`: the corners of the tile they are cut to (west, north, east, south; empty: none), along whose edges no
+     * wall of a block rises
+     *
+     * # Errors
+     *
+     * Throws (to JavaScript) when a WebGL object of the tile cannot be created, or when its features or lines need a
+     * table texture past the GPU's `MAX_TEXTURE_SIZE`
+     */
+    setVectorTile(id: number, key: number, points: Float64Array, ring_start: Uint32Array, polygon_start: Uint32Array, polygon_feature: Uint32Array, fill_start: Uint32Array, line_points: Float64Array, line_first: Uint32Array, line_feature: Uint32Array, line_start: Uint32Array, feature_count: number, tile: Float64Array): void;
     /**
      * Shows what can be seen from points, each within its range: `observers` holds 8 numbers per observer
      * (16 at most): longitude, latitude (degrees), metres above the ground, range (metres), then to look one way
@@ -880,6 +942,12 @@ export class Engine {
      * A region of the icon atlas: `width` × `height` RGBA texels (premultiplied) at (`x`, `y`)
      */
     updateIconAtlas(x: number, y: number, width: number, height: number, data: Uint8Array): void;
+    /**
+     * Vector tiles (512 CSS pixels across at their level, as `MapLibre`'s) for the view of the last frame (else the
+     * camera's), levels `min_z` to `max_z`, three numbers per tile (z, x, y), the nearest to the eye first: what a
+     * vector tile layer draws (`addVectorTiles`), coarser far away in a tilted view as the raster layers
+     */
+    vectorTilesInView(min_z: number, max_z: number): Uint32Array;
     /**
      * Tiles a raster layer wants for the view of the last frame, three numbers per tile (z, x, y), the nearest to
      * the eye first: the level each area of the ground is drawn at, for the labels of a vector style to follow it
@@ -924,6 +992,7 @@ export interface InitOutput {
     readonly engine_addRaster: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number) => [number, number, number];
     readonly engine_addSymbols: (a: number) => [number, number, number];
     readonly engine_addTiles3d: (a: number, b: number, c: number, d: number, e: number) => [number, number, number];
+    readonly engine_addVectorTiles: (a: number) => [number, number, number];
     readonly engine_bounds: (a: number) => [number, number];
     readonly engine_camera: (a: number) => any;
     readonly engine_clearPanorama: (a: number) => void;
@@ -948,6 +1017,7 @@ export interface InitOutput {
     readonly engine_project: (a: number, b: number, c: number, d: number, e: number) => any;
     readonly engine_removeExtrusionBatch: (a: number, b: number, c: number) => void;
     readonly engine_removeLayer: (a: number, b: number) => void;
+    readonly engine_removeVectorTile: (a: number, b: number, c: number) => void;
     readonly engine_render: (a: number) => number;
     readonly engine_requestPick: (a: number, b: number, c: number, d: number, e: number, f: number, g: number) => number;
     readonly engine_resize: (a: number, b: number, c: number, d: number) => void;
@@ -992,12 +1062,16 @@ export interface InitOutput {
     readonly engine_setRasterStyle: (a: number, b: number, c: number, d: number) => void;
     readonly engine_setRequestHeaders: (a: number, b: number, c: number, d: number, e: number, f: number, g: number) => void;
     readonly engine_setSky: (a: number, b: number) => void;
-    readonly engine_setSwipe: (a: number, b: number, c: number, d: number, e: number) => void;
+    readonly engine_setSun: (a: number, b: number, c: number, d: number, e: number) => [number, number];
+    readonly engine_setSwipe: (a: number, b: number, c: number, d: number, e: number, f: number, g: number) => void;
     readonly engine_setSymbolLayer: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number) => void;
     readonly engine_setSymbols: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number) => [number, number];
     readonly engine_setTerrain: (a: number, b: number, c: number, d: number, e: number, f: number, g: number) => [number, number];
     readonly engine_setTileLoader: (a: number, b: any) => void;
     readonly engine_setTiles3dStyle: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number) => void;
+    readonly engine_setVectorSublayers: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number, k: number, l: number, m: number, n: number, o: number, p: number) => void;
+    readonly engine_setVectorTile: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number, k: number, l: number, m: number, n: number, o: number, p: number, q: number, r: number, s: number, t: number, u: number, v: number, w: number, x: number) => [number, number];
+    readonly engine_setVectorTileMesh: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number, k: number, l: number, m: number, n: number, o: number, p: number, q: number, r: number, s: number, t: number, u: number, v: number, w: number, x: number, y: number, z: number, a1: number, b1: number, c1: number, d1: number, e1: number, f1: number, g1: number, h1: number, i1: number) => [number, number];
     readonly engine_setViewshed: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number) => [number, number];
     readonly engine_setZoomRange: (a: number, b: number, c: number) => void;
     readonly engine_stats: (a: number) => any;
@@ -1010,6 +1084,7 @@ export interface InitOutput {
     readonly engine_updateGlyphPage: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number) => void;
     readonly engine_updateGroundTexture: (a: number, b: number, c: number, d: number, e: number, f: number, g: number, h: number, i: number, j: number, k: number) => [number, number];
     readonly engine_updateIconAtlas: (a: number, b: number, c: number, d: number, e: number, f: number, g: number) => void;
+    readonly engine_vectorTilesInView: (a: number, b: number, c: number) => [number, number];
     readonly engine_wantedTiles: (a: number, b: number) => [number, number];
     readonly engine_zoomAt: (a: number, b: number, c: number, d: number) => void;
     readonly wasm_bindgen_2e566c63402fe7fa___convert__closures_____invoke___js_sys_b1e1c29ba6b0e6b3___Function_fn_wasm_bindgen_2e566c63402fe7fa___JsValue_____wasm_bindgen_2e566c63402fe7fa___sys__Undefined___js_sys_b1e1c29ba6b0e6b3___Function_fn_wasm_bindgen_2e566c63402fe7fa___JsValue_____wasm_bindgen_2e566c63402fe7fa___sys__Undefined_______true_: (a: number, b: number, c: any, d: any) => void;