isard 0.0.0-stage → 0.2.1

package/dist/overlay.d.ts

@@ -0,0 +1,118 @@
+/**
+ * DOM overlays tied to a position: markers and popups. The map places them all in one pass after each frame it draws
+ * (camera moves, finer relief arriving), with a CSS transform from `map.project`: the browser only composites them,
+ * nothing is laid out again.
+ */
+import type { GeoMap } from './map.ts';
+import type { LonLat, Point } from './types.ts';
+/** Which part of the element sits on the position */
+export type Anchor = 'center' | 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+export interface MarkerOptions {
+    /** The element to show (default: a round pin) */
+    element?: HTMLElement;
+    /** Which part of the element sits on the position (default 'center' with an element of your own, 'bottom' for the
+     * default pin) */
+    anchor?: Anchor;
+    /** Shift from the anchor, CSS pixels (default [0, 0]) */
+    offset?: Point;
+    /** The marker can be dragged over the map, on the relief (default false) */
+    draggable?: boolean;
+    /** Classes added to the element, space separated */
+    className?: string;
+}
+export interface MarkerEvent {
+    target: Marker;
+    lonLat: LonLat;
+}
+export interface MarkerEvents {
+    dragstart: MarkerEvent;
+    drag: MarkerEvent;
+    dragend: MarkerEvent;
+}
+/** An element at a position on the map, optionally draggable */
+export declare class Marker {
+    private readonly element;
+    private readonly anchor;
+    private readonly events;
+    private offset;
+    private draggable;
+    private lonLat;
+    private map;
+    private popup;
+    /** While pressed: the press point and the gap between the pointer and the marker's position */
+    private grab;
+    private dragging;
+    /** The click that ends a drag is not a click on the marker */
+    private swallowClick;
+    constructor(options?: MarkerOptions);
+    getElement(): HTMLElement;
+    getLonLat(): LonLat;
+    setLonLat(lonLat: LonLat): this;
+    setOffset(offset: Point): this;
+    setDraggable(draggable: boolean): this;
+    isDraggable(): boolean;
+    /** A popup that a click on the marker opens and closes, at the marker's position; give it an offset clearing the
+     * marker (with the default pin, [0, -34]) */
+    setPopup(popup: Popup | undefined): this;
+    getPopup(): Popup | undefined;
+    /** Opens the marker's popup, or closes it if open */
+    togglePopup(): this;
+    /** Listens to the drag of the marker; returns the function that stops listening */
+    on<K extends keyof MarkerEvents>(type: K, listener: (event: MarkerEvents[K]) => void): () => void;
+    addTo(map: GeoMap): this;
+    remove(): this;
+    private local;
+    private down;
+    private move;
+    private up;
+    private click;
+}
+export interface PopupOptions {
+    /** A × button in the corner (default true) */
+    closeButton?: boolean;
+    /** A click on the map elsewhere closes the popup (default true) */
+    closeOnClick?: boolean;
+    /** CSS max-width of the popup (default '240px') */
+    maxWidth?: string;
+    /** Classes added to the popup, space separated */
+    className?: string;
+    /** Which part of the popup sits on the position, its tip there (default 'bottom': the popup is above the point) */
+    anchor?: Anchor;
+    /** Shift from the anchor, CSS pixels (default [0, 0]) */
+    offset?: Point;
+}
+export interface PopupEvents {
+    open: {
+        target: Popup;
+    };
+    close: {
+        target: Popup;
+    };
+}
+/** A box of content at a position, its tip pointing at it */
+export declare class Popup {
+    private readonly container;
+    private readonly content;
+    private readonly closeButton;
+    private readonly anchor;
+    private readonly closeOnClick;
+    private readonly events;
+    private offset;
+    private lonLat;
+    private map;
+    private stopListening;
+    constructor(options?: PopupOptions);
+    getElement(): HTMLElement;
+    getLonLat(): LonLat;
+    setLonLat(lonLat: LonLat): this;
+    setOffset(offset: Point): this;
+    /** Content from an HTML string: only for trusted HTML (use `setText` for user or remote data) */
+    setHTML(html: string): this;
+    setText(text: string): this;
+    setDOMContent(node: Node): this;
+    isOpen(): boolean;
+    /** Listens to the popup opening or closing; returns the function that stops listening */
+    on<K extends keyof PopupEvents>(type: K, listener: (event: PopupEvents[K]) => void): () => void;
+    addTo(map: GeoMap): this;
+    remove(): this;
+}

package/dist/overlay.js

@@ -0,0 +1,334 @@
+const ANCHOR_TRANSLATE = {
+    center: 'translate(-50%, -50%)',
+    top: 'translate(-50%, 0)',
+    bottom: 'translate(-50%, -100%)',
+    left: 'translate(0, -50%)',
+    right: 'translate(-100%, -50%)',
+    'top-left': 'translate(0, 0)',
+    'top-right': 'translate(-100%, 0)',
+    'bottom-left': 'translate(0, -100%)',
+    'bottom-right': 'translate(-100%, -100%)',
+};
+/** Overlays further than this out of the canvas (CSS pixels) are hidden: no part of them can show, and huge
+ * transforms near the horizon would only cost the compositor */
+const MARGIN = 500;
+/** A press on a draggable marker that moves less than this (CSS pixels) is a click */
+const DRAG_TOLERANCE = 3;
+/** Typed listeners of an overlay */
+class Emitter {
+    listeners = {};
+    on(type, listener) {
+        const set = this.listeners[type] ?? new Set();
+        this.listeners[type] = set;
+        set.add(listener);
+        return () => set.delete(listener);
+    }
+    emit(type, event) {
+        for (const listener of this.listeners[type] ?? [])
+            listener(event);
+    }
+}
+/** Moves `element` so that its anchor sits on `lonLat`, or hides it when the position is out of sight */
+function place(map, element, lonLat, anchor, offset, size) {
+    const point = map.project(lonLat);
+    const visible = point !== undefined &&
+        point[0] > -MARGIN &&
+        point[0] < size[0] + MARGIN &&
+        point[1] > -MARGIN &&
+        point[1] < size[1] + MARGIN;
+    if (!visible) {
+        element.style.display = 'none';
+        return;
+    }
+    element.style.display = '';
+    // Whole pixels: a fractional translation blurs text and icons
+    const x = Math.round(point[0] + offset[0]);
+    const y = Math.round(point[1] + offset[1]);
+    element.style.transform = `translate(${x}px, ${y}px) ${ANCHOR_TRANSLATE[anchor]}`;
+}
+/** Round pin, its tip at the bottom: the default marker */
+function pin() {
+    const element = document.createElement('div');
+    element.innerHTML =
+        '<svg class="isard-marker-pin" width="25" height="34" viewBox="0 0 25 34" aria-hidden="true">' +
+            '<path fill="currentColor" stroke="rgb(0 0 0 / 0.25)" d="M12.5 33.5C12.5 33.5 .5 20.6 .5 12.5a12 12 0 0 1 24 0' +
+            'c0 8.1-12 21-12 21z"/><circle cx="12.5" cy="12.5" r="4.5" fill="#fff"/></svg>';
+    return element;
+}
+/** An element at a position on the map, optionally draggable */
+export class Marker {
+    element;
+    anchor;
+    events = new Emitter();
+    offset;
+    draggable;
+    lonLat = [0, 0];
+    map;
+    popup;
+    /** While pressed: the press point and the gap between the pointer and the marker's position */
+    grab;
+    dragging = false;
+    /** The click that ends a drag is not a click on the marker */
+    swallowClick = false;
+    constructor(options = {}) {
+        this.element = options.element ?? pin();
+        this.anchor = options.anchor ?? (options.element ? 'center' : 'bottom');
+        this.offset = options.offset ?? [0, 0];
+        this.draggable = options.draggable ?? false;
+        this.element.classList.add('isard-marker');
+        if (options.className)
+            this.element.classList.add(...options.className.split(/\s+/).filter(Boolean));
+        this.element.classList.toggle('isard-marker-draggable', this.draggable);
+        this.element.addEventListener('pointerdown', (e) => this.down(e));
+        this.element.addEventListener('pointermove', (e) => this.move(e));
+        this.element.addEventListener('pointerup', (e) => this.up(e));
+        this.element.addEventListener('pointercancel', (e) => this.up(e));
+        this.element.addEventListener('click', (e) => this.click(e), { capture: true });
+    }
+    getElement() {
+        return this.element;
+    }
+    getLonLat() {
+        return [...this.lonLat];
+    }
+    setLonLat(lonLat) {
+        this.lonLat = [lonLat[0], lonLat[1]];
+        this.map?.positionOverlay(this);
+        // An open popup of the marker goes with it
+        if (this.popup?.isOpen())
+            this.popup.setLonLat(this.lonLat);
+        return this;
+    }
+    setOffset(offset) {
+        this.offset = [offset[0], offset[1]];
+        this.map?.positionOverlay(this);
+        return this;
+    }
+    setDraggable(draggable) {
+        this.draggable = draggable;
+        this.element.classList.toggle('isard-marker-draggable', draggable);
+        return this;
+    }
+    isDraggable() {
+        return this.draggable;
+    }
+    /** A popup that a click on the marker opens and closes, at the marker's position; give it an offset clearing the
+     * marker (with the default pin, [0, -34]) */
+    setPopup(popup) {
+        this.popup?.remove();
+        this.popup = popup;
+        return this;
+    }
+    getPopup() {
+        return this.popup;
+    }
+    /** Opens the marker's popup, or closes it if open */
+    togglePopup() {
+        if (!this.popup || !this.map)
+            return this;
+        if (this.popup.isOpen())
+            this.popup.remove();
+        else
+            this.popup.setLonLat(this.lonLat).addTo(this.map);
+        return this;
+    }
+    /** Listens to the drag of the marker; returns the function that stops listening */
+    on(type, listener) {
+        return this.events.on(type, listener);
+    }
+    addTo(map) {
+        if (this.map === map)
+            return this;
+        this.remove();
+        this.map = map;
+        map.attachOverlay(this, this.element);
+        return this;
+    }
+    remove() {
+        this.popup?.remove();
+        this.map?.detachOverlay(this, this.element);
+        this.map = undefined;
+        this.grab = undefined;
+        this.dragging = false;
+        this.element.classList.remove('isard-marker-dragging');
+        return this;
+    }
+    /** @internal */
+    position(size) {
+        if (this.map)
+            place(this.map, this.element, this.lonLat, this.anchor, this.offset, size);
+    }
+    local(e) {
+        const rect = this.map?.getCanvas().getBoundingClientRect();
+        return rect && [e.clientX - rect.left, e.clientY - rect.top];
+    }
+    down(e) {
+        this.swallowClick = false;
+        if (!this.draggable || !this.map || e.button !== 0)
+            return;
+        const point = this.map.project(this.lonLat);
+        const at = this.local(e);
+        if (!point || !at)
+            return;
+        // The map must not start panning under the marker
+        e.stopPropagation();
+        e.preventDefault();
+        this.element.setPointerCapture(e.pointerId);
+        // The grabbed spot of the marker stays under the pointer, wherever the element was pressed
+        this.grab = { start: at, gap: [at[0] - point[0], at[1] - point[1]] };
+        this.dragging = false;
+    }
+    move(e) {
+        const at = this.local(e);
+        if (!this.grab || !this.map || !at)
+            return;
+        e.stopPropagation();
+        const { start, gap } = this.grab;
+        if (!this.dragging && Math.hypot(at[0] - start[0], at[1] - start[1]) < DRAG_TOLERANCE)
+            return;
+        // On the relief: the ground under the point, read back from the picking pass
+        const lonLat = this.map.unproject([at[0] - gap[0], at[1] - gap[1]]);
+        if (!lonLat)
+            return;
+        if (!this.dragging) {
+            this.dragging = true;
+            this.element.classList.add('isard-marker-dragging');
+            this.events.emit('dragstart', { target: this, lonLat: this.getLonLat() });
+        }
+        this.setLonLat(lonLat);
+        this.events.emit('drag', { target: this, lonLat: this.getLonLat() });
+    }
+    up(e) {
+        if (!this.grab)
+            return;
+        e.stopPropagation();
+        this.grab = undefined;
+        if (this.element.hasPointerCapture(e.pointerId))
+            this.element.releasePointerCapture(e.pointerId);
+        if (!this.dragging)
+            return;
+        this.dragging = false;
+        this.swallowClick = true;
+        this.element.classList.remove('isard-marker-dragging');
+        this.events.emit('dragend', { target: this, lonLat: this.getLonLat() });
+    }
+    click(e) {
+        if (this.swallowClick) {
+            this.swallowClick = false;
+            e.stopImmediatePropagation();
+            e.preventDefault();
+            return;
+        }
+        if (this.popup)
+            this.togglePopup();
+    }
+}
+/** A box of content at a position, its tip pointing at it */
+export class Popup {
+    container;
+    content;
+    closeButton;
+    anchor;
+    closeOnClick;
+    events = new Emitter();
+    offset;
+    lonLat = [0, 0];
+    map;
+    stopListening;
+    constructor(options = {}) {
+        this.anchor = options.anchor ?? 'bottom';
+        this.offset = options.offset ?? [0, 0];
+        this.closeOnClick = options.closeOnClick ?? true;
+        this.container = document.createElement('div');
+        this.container.className = `isard-popup isard-popup-anchor-${this.anchor}`;
+        if (options.className)
+            this.container.classList.add(...options.className.split(/\s+/).filter(Boolean));
+        this.container.style.maxWidth = options.maxWidth ?? '240px';
+        const tip = document.createElement('div');
+        tip.className = 'isard-popup-tip';
+        this.content = document.createElement('div');
+        this.content.className = 'isard-popup-content';
+        if (options.closeButton ?? true) {
+            this.container.classList.add('isard-popup-has-close');
+            this.closeButton = document.createElement('button');
+            this.closeButton.type = 'button';
+            this.closeButton.className = 'isard-popup-close';
+            this.closeButton.setAttribute('aria-label', 'Close popup');
+            this.closeButton.textContent = '×';
+            this.closeButton.addEventListener('click', () => this.remove());
+            this.content.append(this.closeButton);
+        }
+        this.container.append(tip, this.content);
+    }
+    getElement() {
+        return this.container;
+    }
+    getLonLat() {
+        return [...this.lonLat];
+    }
+    setLonLat(lonLat) {
+        this.lonLat = [lonLat[0], lonLat[1]];
+        this.map?.positionOverlay(this);
+        return this;
+    }
+    setOffset(offset) {
+        this.offset = [offset[0], offset[1]];
+        this.map?.positionOverlay(this);
+        return this;
+    }
+    /** Content from an HTML string: only for trusted HTML (use `setText` for user or remote data) */
+    setHTML(html) {
+        const template = document.createElement('template');
+        template.innerHTML = html;
+        return this.setDOMContent(template.content);
+    }
+    setText(text) {
+        return this.setDOMContent(document.createTextNode(text));
+    }
+    setDOMContent(node) {
+        this.content.replaceChildren(node);
+        if (this.closeButton)
+            this.content.append(this.closeButton);
+        this.map?.positionOverlay(this);
+        return this;
+    }
+    isOpen() {
+        return this.map !== undefined;
+    }
+    /** Listens to the popup opening or closing; returns the function that stops listening */
+    on(type, listener) {
+        return this.events.on(type, listener);
+    }
+    addTo(map) {
+        if (this.map === map)
+            return this;
+        this.remove();
+        this.map = map;
+        map.attachOverlay(this, this.container);
+        if (this.closeOnClick) {
+            // From the next task on: a popup opened by a map click must not be closed by that same click
+            queueMicrotask(() => {
+                if (this.map === map && !this.stopListening)
+                    this.stopListening = map.on('click', () => this.remove());
+            });
+        }
+        this.events.emit('open', { target: this });
+        return this;
+    }
+    remove() {
+        if (!this.map)
+            return this;
+        this.stopListening?.();
+        this.stopListening = undefined;
+        this.map.detachOverlay(this, this.container);
+        this.map = undefined;
+        this.events.emit('close', { target: this });
+        return this;
+    }
+    /** @internal */
+    position(size) {
+        if (this.map)
+            place(this.map, this.container, this.lonLat, this.anchor, this.offset, size);
+    }
+}
+//# sourceMappingURL=overlay.js.map

package/dist/overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.js","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * DOM overlays tied to a position: markers and popups. The map places them all in one pass after each frame it draws\n * (camera moves, finer relief arriving), with a CSS transform from `map.project`: the browser only composites them,\n * nothing is laid out again.\n */\nimport type { GeoMap } from './map.ts';\nimport type { LonLat, Point } from './types.ts';\n\n/** Which part of the element sits on the position */\nexport type Anchor =\n  | 'center'\n  | 'top'\n  | 'bottom'\n  | 'left'\n  | 'right'\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-right';\n\nconst ANCHOR_TRANSLATE: Record<Anchor, string> = {\n  center: 'translate(-50%, -50%)',\n  top: 'translate(-50%, 0)',\n  bottom: 'translate(-50%, -100%)',\n  left: 'translate(0, -50%)',\n  right: 'translate(-100%, -50%)',\n  'top-left': 'translate(0, 0)',\n  'top-right': 'translate(-100%, 0)',\n  'bottom-left': 'translate(0, -100%)',\n  'bottom-right': 'translate(-100%, -100%)',\n};\n\n/** Overlays further than this out of the canvas (CSS pixels) are hidden: no part of them can show, and huge\n * transforms near the horizon would only cost the compositor */\nconst MARGIN = 500;\n/** A press on a draggable marker that moves less than this (CSS pixels) is a click */\nconst DRAG_TOLERANCE = 3;\n\n/** @internal What the map places after each frame */\nexport interface Positioned {\n  /** Places the overlay for the current camera; `size` is the canvas size in CSS pixels */\n  position(size: Point): void;\n}\n\n/** Typed listeners of an overlay */\nclass Emitter<E> {\n  private readonly listeners: { [K in keyof E]?: Set<(event: E[K]) => void> } = {};\n\n  on<K extends keyof E>(type: K, listener: (event: E[K]) => void): () => void {\n    const set = this.listeners[type] ?? new Set();\n    this.listeners[type] = set;\n    set.add(listener);\n    return () => set.delete(listener);\n  }\n\n  emit<K extends keyof E>(type: K, event: E[K]): void {\n    for (const listener of this.listeners[type] ?? []) listener(event);\n  }\n}\n\n/** Moves `element` so that its anchor sits on `lonLat`, or hides it when the position is out of sight */\nfunction place(map: GeoMap, element: HTMLElement, lonLat: LonLat, anchor: Anchor, offset: Point, size: Point): void {\n  const point = map.project(lonLat);\n  const visible =\n    point !== undefined &&\n    point[0] > -MARGIN &&\n    point[0] < size[0] + MARGIN &&\n    point[1] > -MARGIN &&\n    point[1] < size[1] + MARGIN;\n  if (!visible) {\n    element.style.display = 'none';\n    return;\n  }\n  element.style.display = '';\n  // Whole pixels: a fractional translation blurs text and icons\n  const x = Math.round(point[0] + offset[0]);\n  const y = Math.round(point[1] + offset[1]);\n  element.style.transform = `translate(${x}px, ${y}px) ${ANCHOR_TRANSLATE[anchor]}`;\n}\n\n/** Round pin, its tip at the bottom: the default marker */\nfunction pin(): HTMLElement {\n  const element = document.createElement('div');\n  element.innerHTML =\n    '<svg class=\"isard-marker-pin\" width=\"25\" height=\"34\" viewBox=\"0 0 25 34\" aria-hidden=\"true\">' +\n    '<path fill=\"currentColor\" stroke=\"rgb(0 0 0 / 0.25)\" d=\"M12.5 33.5C12.5 33.5 .5 20.6 .5 12.5a12 12 0 0 1 24 0' +\n    'c0 8.1-12 21-12 21z\"/><circle cx=\"12.5\" cy=\"12.5\" r=\"4.5\" fill=\"#fff\"/></svg>';\n  return element;\n}\n\nexport interface MarkerOptions {\n  /** The element to show (default: a round pin) */\n  element?: HTMLElement;\n  /** Which part of the element sits on the position (default 'center' with an element of your own, 'bottom' for the\n   * default pin) */\n  anchor?: Anchor;\n  /** Shift from the anchor, CSS pixels (default [0, 0]) */\n  offset?: Point;\n  /** The marker can be dragged over the map, on the relief (default false) */\n  draggable?: boolean;\n  /** Classes added to the element, space separated */\n  className?: string;\n}\n\nexport interface MarkerEvent {\n  target: Marker;\n  lonLat: LonLat;\n}\n\nexport interface MarkerEvents {\n  dragstart: MarkerEvent;\n  drag: MarkerEvent;\n  dragend: MarkerEvent;\n}\n\n/** An element at a position on the map, optionally draggable */\nexport class Marker {\n  private readonly element: HTMLElement;\n  private readonly anchor: Anchor;\n  private readonly events = new Emitter<MarkerEvents>();\n  private offset: Point;\n  private draggable: boolean;\n  private lonLat: LonLat = [0, 0];\n  private map: GeoMap | undefined;\n  private popup: Popup | undefined;\n  /** While pressed: the press point and the gap between the pointer and the marker's position */\n  private grab: { start: Point; gap: Point } | undefined;\n  private dragging = false;\n  /** The click that ends a drag is not a click on the marker */\n  private swallowClick = false;\n\n  constructor(options: MarkerOptions = {}) {\n    this.element = options.element ?? pin();\n    this.anchor = options.anchor ?? (options.element ? 'center' : 'bottom');\n    this.offset = options.offset ?? [0, 0];\n    this.draggable = options.draggable ?? false;\n    this.element.classList.add('isard-marker');\n    if (options.className) this.element.classList.add(...options.className.split(/\\s+/).filter(Boolean));\n    this.element.classList.toggle('isard-marker-draggable', this.draggable);\n    this.element.addEventListener('pointerdown', (e) => this.down(e));\n    this.element.addEventListener('pointermove', (e) => this.move(e));\n    this.element.addEventListener('pointerup', (e) => this.up(e));\n    this.element.addEventListener('pointercancel', (e) => this.up(e));\n    this.element.addEventListener('click', (e) => this.click(e), { capture: true });\n  }\n\n  getElement(): HTMLElement {\n    return this.element;\n  }\n\n  getLonLat(): LonLat {\n    return [...this.lonLat];\n  }\n\n  setLonLat(lonLat: LonLat): this {\n    this.lonLat = [lonLat[0], lonLat[1]];\n    this.map?.positionOverlay(this);\n    // An open popup of the marker goes with it\n    if (this.popup?.isOpen()) this.popup.setLonLat(this.lonLat);\n    return this;\n  }\n\n  setOffset(offset: Point): this {\n    this.offset = [offset[0], offset[1]];\n    this.map?.positionOverlay(this);\n    return this;\n  }\n\n  setDraggable(draggable: boolean): this {\n    this.draggable = draggable;\n    this.element.classList.toggle('isard-marker-draggable', draggable);\n    return this;\n  }\n\n  isDraggable(): boolean {\n    return this.draggable;\n  }\n\n  /** A popup that a click on the marker opens and closes, at the marker's position; give it an offset clearing the\n   * marker (with the default pin, [0, -34]) */\n  setPopup(popup: Popup | undefined): this {\n    this.popup?.remove();\n    this.popup = popup;\n    return this;\n  }\n\n  getPopup(): Popup | undefined {\n    return this.popup;\n  }\n\n  /** Opens the marker's popup, or closes it if open */\n  togglePopup(): this {\n    if (!this.popup || !this.map) return this;\n    if (this.popup.isOpen()) this.popup.remove();\n    else this.popup.setLonLat(this.lonLat).addTo(this.map);\n    return this;\n  }\n\n  /** Listens to the drag of the marker; returns the function that stops listening */\n  on<K extends keyof MarkerEvents>(type: K, listener: (event: MarkerEvents[K]) => void): () => void {\n    return this.events.on(type, listener);\n  }\n\n  addTo(map: GeoMap): this {\n    if (this.map === map) return this;\n    this.remove();\n    this.map = map;\n    map.attachOverlay(this, this.element);\n    return this;\n  }\n\n  remove(): this {\n    this.popup?.remove();\n    this.map?.detachOverlay(this, this.element);\n    this.map = undefined;\n    this.grab = undefined;\n    this.dragging = false;\n    this.element.classList.remove('isard-marker-dragging');\n    return this;\n  }\n\n  /** @internal */\n  position(size: Point): void {\n    if (this.map) place(this.map, this.element, this.lonLat, this.anchor, this.offset, size);\n  }\n\n  private local(e: PointerEvent): Point | undefined {\n    const rect = this.map?.getCanvas().getBoundingClientRect();\n    return rect && [e.clientX - rect.left, e.clientY - rect.top];\n  }\n\n  private down(e: PointerEvent): void {\n    this.swallowClick = false;\n    if (!this.draggable || !this.map || e.button !== 0) return;\n    const point = this.map.project(this.lonLat);\n    const at = this.local(e);\n    if (!point || !at) return;\n    // The map must not start panning under the marker\n    e.stopPropagation();\n    e.preventDefault();\n    this.element.setPointerCapture(e.pointerId);\n    // The grabbed spot of the marker stays under the pointer, wherever the element was pressed\n    this.grab = { start: at, gap: [at[0] - point[0], at[1] - point[1]] };\n    this.dragging = false;\n  }\n\n  private move(e: PointerEvent): void {\n    const at = this.local(e);\n    if (!this.grab || !this.map || !at) return;\n    e.stopPropagation();\n    const { start, gap } = this.grab;\n    if (!this.dragging && Math.hypot(at[0] - start[0], at[1] - start[1]) < DRAG_TOLERANCE) return;\n    // On the relief: the ground under the point, read back from the picking pass\n    const lonLat = this.map.unproject([at[0] - gap[0], at[1] - gap[1]]);\n    if (!lonLat) return;\n    if (!this.dragging) {\n      this.dragging = true;\n      this.element.classList.add('isard-marker-dragging');\n      this.events.emit('dragstart', { target: this, lonLat: this.getLonLat() });\n    }\n    this.setLonLat(lonLat);\n    this.events.emit('drag', { target: this, lonLat: this.getLonLat() });\n  }\n\n  private up(e: PointerEvent): void {\n    if (!this.grab) return;\n    e.stopPropagation();\n    this.grab = undefined;\n    if (this.element.hasPointerCapture(e.pointerId)) this.element.releasePointerCapture(e.pointerId);\n    if (!this.dragging) return;\n    this.dragging = false;\n    this.swallowClick = true;\n    this.element.classList.remove('isard-marker-dragging');\n    this.events.emit('dragend', { target: this, lonLat: this.getLonLat() });\n  }\n\n  private click(e: MouseEvent): void {\n    if (this.swallowClick) {\n      this.swallowClick = false;\n      e.stopImmediatePropagation();\n      e.preventDefault();\n      return;\n    }\n    if (this.popup) this.togglePopup();\n  }\n}\n\nexport interface PopupOptions {\n  /** A × button in the corner (default true) */\n  closeButton?: boolean;\n  /** A click on the map elsewhere closes the popup (default true) */\n  closeOnClick?: boolean;\n  /** CSS max-width of the popup (default '240px') */\n  maxWidth?: string;\n  /** Classes added to the popup, space separated */\n  className?: string;\n  /** Which part of the popup sits on the position, its tip there (default 'bottom': the popup is above the point) */\n  anchor?: Anchor;\n  /** Shift from the anchor, CSS pixels (default [0, 0]) */\n  offset?: Point;\n}\n\nexport interface PopupEvents {\n  open: { target: Popup };\n  close: { target: Popup };\n}\n\n/** A box of content at a position, its tip pointing at it */\nexport class Popup {\n  private readonly container: HTMLElement;\n  private readonly content: HTMLElement;\n  private readonly closeButton: HTMLButtonElement | undefined;\n  private readonly anchor: Anchor;\n  private readonly closeOnClick: boolean;\n  private readonly events = new Emitter<PopupEvents>();\n  private offset: Point;\n  private lonLat: LonLat = [0, 0];\n  private map: GeoMap | undefined;\n  private stopListening: (() => void) | undefined;\n\n  constructor(options: PopupOptions = {}) {\n    this.anchor = options.anchor ?? 'bottom';\n    this.offset = options.offset ?? [0, 0];\n    this.closeOnClick = options.closeOnClick ?? true;\n    this.container = document.createElement('div');\n    this.container.className = `isard-popup isard-popup-anchor-${this.anchor}`;\n    if (options.className) this.container.classList.add(...options.className.split(/\\s+/).filter(Boolean));\n    this.container.style.maxWidth = options.maxWidth ?? '240px';\n    const tip = document.createElement('div');\n    tip.className = 'isard-popup-tip';\n    this.content = document.createElement('div');\n    this.content.className = 'isard-popup-content';\n    if (options.closeButton ?? true) {\n      this.container.classList.add('isard-popup-has-close');\n      this.closeButton = document.createElement('button');\n      this.closeButton.type = 'button';\n      this.closeButton.className = 'isard-popup-close';\n      this.closeButton.setAttribute('aria-label', 'Close popup');\n      this.closeButton.textContent = '×';\n      this.closeButton.addEventListener('click', () => this.remove());\n      this.content.append(this.closeButton);\n    }\n    this.container.append(tip, this.content);\n  }\n\n  getElement(): HTMLElement {\n    return this.container;\n  }\n\n  getLonLat(): LonLat {\n    return [...this.lonLat];\n  }\n\n  setLonLat(lonLat: LonLat): this {\n    this.lonLat = [lonLat[0], lonLat[1]];\n    this.map?.positionOverlay(this);\n    return this;\n  }\n\n  setOffset(offset: Point): this {\n    this.offset = [offset[0], offset[1]];\n    this.map?.positionOverlay(this);\n    return this;\n  }\n\n  /** Content from an HTML string: only for trusted HTML (use `setText` for user or remote data) */\n  setHTML(html: string): this {\n    const template = document.createElement('template');\n    template.innerHTML = html;\n    return this.setDOMContent(template.content);\n  }\n\n  setText(text: string): this {\n    return this.setDOMContent(document.createTextNode(text));\n  }\n\n  setDOMContent(node: Node): this {\n    this.content.replaceChildren(node);\n    if (this.closeButton) this.content.append(this.closeButton);\n    this.map?.positionOverlay(this);\n    return this;\n  }\n\n  isOpen(): boolean {\n    return this.map !== undefined;\n  }\n\n  /** Listens to the popup opening or closing; returns the function that stops listening */\n  on<K extends keyof PopupEvents>(type: K, listener: (event: PopupEvents[K]) => void): () => void {\n    return this.events.on(type, listener);\n  }\n\n  addTo(map: GeoMap): this {\n    if (this.map === map) return this;\n    this.remove();\n    this.map = map;\n    map.attachOverlay(this, this.container);\n    if (this.closeOnClick) {\n      // From the next task on: a popup opened by a map click must not be closed by that same click\n      queueMicrotask(() => {\n        if (this.map === map && !this.stopListening) this.stopListening = map.on('click', () => this.remove());\n      });\n    }\n    this.events.emit('open', { target: this });\n    return this;\n  }\n\n  remove(): this {\n    if (!this.map) return this;\n    this.stopListening?.();\n    this.stopListening = undefined;\n    this.map.detachOverlay(this, this.container);\n    this.map = undefined;\n    this.events.emit('close', { target: this });\n    return this;\n  }\n\n  /** @internal */\n  position(size: Point): void {\n    if (this.map) place(this.map, this.container, this.lonLat, this.anchor, this.offset, size);\n  }\n}\n"]}

package/dist/protocol.d.ts

@@ -0,0 +1,30 @@
+/** Messages between the main thread and the decoding workers */
+import type { DecoderUrls } from './decoders.ts';
+import type { DecodedTile, TextureFormats } from './wasm/isard.js';
+export type WorkerRequest = {
+    type: 'init';
+    module: WebAssembly.Module;
+    decoders: DecoderUrls;
+    formats: TextureFormats;
+} | {
+    type: 'load';
+    id: number;
+    url: string;
+    transform: Float64Array;
+    yUp: boolean;
+    reload: boolean;
+    priority?: 'high' | 'low';
+} | {
+    type: 'abort';
+    id: number;
+};
+export type WorkerReply = {
+    type: 'tile';
+    id: number;
+    tile: DecodedTile;
+} | {
+    type: 'error';
+    id: number;
+    error: string;
+    aborted: boolean;
+};

package/dist/protocol.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=protocol.js.map

package/dist/protocol.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"protocol.js","sourceRoot":"","sources":["../src/protocol.ts"],"names":[],"mappings":"","sourcesContent":["/** Messages between the main thread and the decoding workers */\nimport type { DecoderUrls } from './decoders.ts';\nimport type { DecodedTile, TextureFormats } from './wasm/isard.js';\n\nexport type WorkerRequest =\n  | { type: 'init'; module: WebAssembly.Module; decoders: DecoderUrls; formats: TextureFormats }\n  | {\n      type: 'load';\n      id: number;\n      url: string;\n      transform: Float64Array;\n      yUp: boolean;\n      reload: boolean;\n      priority?: 'high' | 'low';\n    }\n  | { type: 'abort'; id: number };\n\nexport type WorkerReply =\n  | { type: 'tile'; id: number; tile: DecodedTile }\n  | { type: 'error'; id: number; error: string; aborted: boolean };\n"]}

package/dist/style.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Styles of the DOM overlays (markers, popups, controls), injected once per document so the package needs no CSS
+ * file. Colors are custom properties, defaults on the root with no specificity: an application restyles them on any
+ * element around the map (its container's class may be replaced by a framework: nothing depends on it).
+ */
+/** Adds the overlay styles to a document, once; first in the head so application rules win at equal specificity */
+export declare function injectStyle(doc: Document): void;