@sjvair/monitor-map 3.0.3 → 3.0.5

package/dist/lib/map/icons.js

@@ -1,31 +1,33 @@
-import { darken as e } from "color2k";
-//#region src/lib/map/icons.ts
-function t(t, n, r) {
-	return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <rect x="${n / 2}" y="${n / 2}" width="${24 - n}" height="${24 - n}"
-      fill="${t}" stroke="${e(r ?? t, .1)}" stroke-width="${n}"/>
+import { darken } from "color2k";
+export function square(color, borderWidth, borderColor) {
+    return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <rect x="${borderWidth / 2}" y="${borderWidth / 2}" width="${24 - borderWidth}" height="${24 - borderWidth}"
+      fill="${color}" stroke="${darken(borderColor ?? color, 0.1)}" stroke-width="${borderWidth}"/>
   </svg>`;
 }
-function n(t, n, r) {
-	return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <circle cx="12" cy="12" r="${12 - n}" fill="${t}" stroke="${e(r ?? t, .1)}" stroke-width="${n}"/>
+export function circle(color, borderWidth, borderColor) {
+    return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <circle cx="12" cy="12" r="${12 - borderWidth}" fill="${color}" stroke="${darken(borderColor ?? color, 0.1)}" stroke-width="${borderWidth}"/>
   </svg>`;
 }
-function r(t, n, r) {
-	return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <polygon points="${`12,${n} ${24 - n},${24 - n} ${n},${24 - n}`}"
-      fill="${t}" stroke="${e(r ?? t, .1)}" stroke-width="${n}"/>
+export function triangle(color, borderWidth, borderColor) {
+    const points = `${12},${borderWidth} ${24 - borderWidth},${24 - borderWidth} ${borderWidth},${24 - borderWidth}`;
+    return `<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <polygon points="${points}"
+      fill="${color}" stroke="${darken(borderColor ?? color, 0.1)}" stroke-width="${borderWidth}"/>
   </svg>`;
 }
-var i = "M495.9 248H392c-4.4 0-8 3.6-8 8s3.6 8 8 8H495.9C491.7 390.2 390.2 491.7 264 495.9V392c0-4.4-3.6-8-8-8s-8 3.6-8 8V495.9C121.8 491.7 20.3 390.2 16.1 264H120c4.4 0 8-3.6 8-8s-3.6-8-8-8H16.1C20.3 121.8 121.8 20.3 248 16.1V120c0 4.4 3.6 8 8 8s8-3.6 8-8V16.1C390.2 20.3 491.7 121.8 495.9 248zM0 256a256 256 0 1 0 512 0A256 256 0 1 0 0 256z", a = 16;
-function o(e, t = "#ffffff") {
-	return `<svg width="56" height="56" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg">${e.replace("<svg ", `<svg x="${a}" y="${a}" `)}<svg x="0" y="0" width="56" height="56" viewBox="-8 -8 528 528"><path d="${i}" fill="${t}" stroke="${t}" stroke-width="5"/></svg></svg>`;
+const CROSSHAIR_PATH = "M495.9 248H392c-4.4 0-8 3.6-8 8s3.6 8 8 8H495.9C491.7 390.2 390.2 491.7 264 495.9V392c0-4.4-3.6-8-8-8s-8 3.6-8 8V495.9C121.8 491.7 20.3 390.2 16.1 264H120c4.4 0 8-3.6 8-8s-3.6-8-8-8H16.1C20.3 121.8 121.8 20.3 248 16.1V120c0 4.4 3.6 8 8 8s8-3.6 8-8V16.1C390.2 20.3 491.7 121.8 495.9 248zM0 256a256 256 0 1 0 512 0A256 256 0 1 0 0 256z";
+const CROSSHAIR_PADDING = 16;
+export const CROSSHAIR_ICON_SIZE = 24 + CROSSHAIR_PADDING * 2;
+export function withCrosshair(baseSvg, color = "#ffffff") {
+    const size = CROSSHAIR_ICON_SIZE;
+    const inner = baseSvg.replace("<svg ", `<svg x="${CROSSHAIR_PADDING}" y="${CROSSHAIR_PADDING}" `);
+    return `<svg width="${size}" height="${size}" viewBox="0 0 ${size} ${size}" xmlns="http://www.w3.org/2000/svg">${inner}<svg x="0" y="0" width="${size}" height="${size}" viewBox="-8 -8 528 528"><path d="${CROSSHAIR_PATH}" fill="${color}" stroke="${color}" stroke-width="5"/></svg></svg>`;
 }
-function s(e) {
-	return `data:image/svg+xml;utf8,${encodeURIComponent(e)}`;
+export function asDataURI(svg) {
+    return `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
 }
-function c(e, t) {
-	return `<svg width="${t}" height="${t}" viewBox="0 -960 960 960" xmlns="http://www.w3.org/2000/svg" fill="${e}"><path d="M200-400q0 52 21 98.5t60 81.5q-1-5-1-9v-9q0-32 12-60t35-51l113-111 113 111q23 23 35 51t12 60v9q0 4-1 9 39-35 60-81.5t21-98.5q0-50-18.5-94.5T608-574q-20 13-42 19.5t-45 6.5q-62 0-107.5-41T361-690q-39 33-69 68.5t-50.5 72Q221-513 210.5-475T200-400Zm240 52-57 56q-11 11-17 25t-6 29q0 32 23.5 55t56.5 23q33 0 56.5-23t23.5-55q0-16-6-29.5T497-292l-57-56Zm0-492v132q0 34 23.5 57t57.5 23q18 0 33.5-7.5T582-658l18-22q74 42 117 117t43 163q0 134-93 227T440-80q-134 0-227-93t-93-227q0-129 86.5-245T440-840Zm400 320q-17 0-28.5-11.5T800-560q0-17 11.5-28.5T840-600q17 0 28.5 11.5T880-560q0 17-11.5 28.5T840-520Zm-40-120v-200h80v200h-80Z"/></svg>`;
+export function fireIcon(color, size) {
+    return `<svg width="${size}" height="${size}" viewBox="0 -960 960 960" xmlns="http://www.w3.org/2000/svg" fill="${color}"><path d="M200-400q0 52 21 98.5t60 81.5q-1-5-1-9v-9q0-32 12-60t35-51l113-111 113 111q23 23 35 51t12 60v9q0 4-1 9 39-35 60-81.5t21-98.5q0-50-18.5-94.5T608-574q-20 13-42 19.5t-45 6.5q-62 0-107.5-41T361-690q-39 33-69 68.5t-50.5 72Q221-513 210.5-475T200-400Zm240 52-57 56q-11 11-17 25t-6 29q0 32 23.5 55t56.5 23q33 0 56.5-23t23.5-55q0-16-6-29.5T497-292l-57-56Zm0-492v132q0 34 23.5 57t57.5 23q18 0 33.5-7.5T582-658l18-22q74 42 117 117t43 163q0 134-93 227T440-80q-134 0-227-93t-93-227q0-129 86.5-245T440-840Zm400 320q-17 0-28.5-11.5T800-560q0-17 11.5-28.5T840-600q17 0 28.5 11.5T880-560q0 17-11.5 28.5T840-520Zm-40-120v-200h80v200h-80Z"/></svg>`;
 }
-//#endregion
-export { s as asDataURI, n as circle, c as fireIcon, t as square, r as triangle, o as withCrosshair };

package/dist/lib/map/integrations/base-layer-seperator.d.ts

@@ -0,0 +1,9 @@
+import { Map as MaptilerMap } from "@maptiler/sdk";
+import { MapLayerIntegration } from "./map-layer-integration.svelte.ts";
+declare class BaseLayerSeperator extends MapLayerIntegration {
+    referenceId: string;
+    enabled: boolean;
+    mapLayer: Parameters<MaptilerMap["addLayer"]>[0];
+}
+export declare const baseLayerSeperator: BaseLayerSeperator;
+export type { BaseLayerSeperator };

package/dist/lib/map/integrations/base-layer-seperator.js

@@ -1,12 +1,11 @@
-import { MapLayerIntegration as e } from "./map-layer-integration.svelte.js";
-var t = new class extends e {
-	referenceId = "Base Layer Seperator";
-	enabled = !0;
-	mapLayer = {
-		id: this.referenceId,
-		type: "custom",
-		render: function() {}
-	};
-}();
-//#endregion
-export { t as baseLayerSeperator };
+import { MapLayerIntegration } from "./map-layer-integration.svelte.ts";
+class BaseLayerSeperator extends MapLayerIntegration {
+    referenceId = "Base Layer Seperator";
+    enabled = true;
+    mapLayer = {
+        id: this.referenceId,
+        type: "custom",
+        render: function () { }
+    };
+}
+export const baseLayerSeperator = new BaseLayerSeperator();

package/dist/lib/map/integrations/click-manager.d.ts

@@ -0,0 +1,14 @@
+import type { MapGeoJSONFeature, MapMouseEvent } from "@maptiler/sdk";
+export type ClickHandler = (features: MapGeoJSONFeature[], evt: MapMouseEvent & object) => void;
+declare class ClickManager {
+    private registrations;
+    private isListening;
+    /** Must be called after `mapManager.map` is initialized (i.e. from within `apply()`). */
+    register(layerIds: string[], handler: ClickHandler): void;
+    unregister(layerIds: string[]): void;
+    private ensureListener;
+    private removeListener;
+    private handleClick;
+}
+export declare const clickManager: ClickManager;
+export type { ClickManager };

package/dist/lib/map/integrations/click-manager.js

@@ -1,33 +1,52 @@
-import { mapManager as e } from "../map.svelte.js";
-var t = new class {
-	registrations = [];
-	isListening = !1;
-	register(e, t) {
-		let n = new Set(e), r = this.registrations.find((e) => e.layerIds.some((e) => n.has(e)));
-		r ? (r.layerIds = e, r.handler = t) : this.registrations.push({
-			layerIds: e,
-			handler: t
-		}), this.ensureListener();
-	}
-	unregister(e) {
-		let t = new Set(e);
-		this.registrations = this.registrations.filter((e) => !e.layerIds.some((e) => t.has(e))), this.registrations.length === 0 && this.removeListener();
-	}
-	ensureListener() {
-		this.isListening || !e.map || (e.map.on("click", this.handleClick), this.isListening = !0);
-	}
-	removeListener() {
-		this.isListening &&= (e.map?.off("click", this.handleClick), !1);
-	}
-	handleClick = (t) => {
-		if (!e.map) return;
-		let n = this.registrations.flatMap((e) => e.layerIds), r = e.map.queryRenderedFeatures(t.point, { layers: n });
-		if (!r.length) return;
-		let i = r[0].layer.id, a = this.registrations.find((e) => e.layerIds.includes(i));
-		if (!a) return;
-		let o = r.filter((e) => a.layerIds.includes(e.layer.id));
-		a.handler(o, t);
-	};
-}();
-//#endregion
-export { t as clickManager };
+import { mapManager } from "../map.svelte.ts";
+class ClickManager {
+    registrations = [];
+    isListening = false;
+    /** Must be called after `mapManager.map` is initialized (i.e. from within `apply()`). */
+    register(layerIds, handler) {
+        const incomingSet = new Set(layerIds);
+        const existing = this.registrations.find((r) => r.layerIds.some((id) => incomingSet.has(id)));
+        if (existing) {
+            existing.layerIds = layerIds;
+            existing.handler = handler;
+        }
+        else {
+            this.registrations.push({ layerIds, handler });
+        }
+        this.ensureListener();
+    }
+    unregister(layerIds) {
+        const set = new Set(layerIds);
+        this.registrations = this.registrations.filter((r) => !r.layerIds.some((id) => set.has(id)));
+        if (this.registrations.length === 0) {
+            this.removeListener();
+        }
+    }
+    ensureListener() {
+        if (this.isListening || !mapManager.map)
+            return;
+        mapManager.map.on("click", this.handleClick);
+        this.isListening = true;
+    }
+    removeListener() {
+        if (!this.isListening)
+            return;
+        mapManager.map?.off("click", this.handleClick);
+        this.isListening = false;
+    }
+    handleClick = (evt) => {
+        if (!mapManager.map)
+            return;
+        const allLayerIds = this.registrations.flatMap((r) => r.layerIds);
+        const features = mapManager.map.queryRenderedFeatures(evt.point, { layers: allLayerIds });
+        if (!features.length)
+            return;
+        const winningLayerId = features[0].layer.id;
+        const registration = this.registrations.find((r) => r.layerIds.includes(winningLayerId));
+        if (!registration)
+            return;
+        const ownFeatures = features.filter((f) => registration.layerIds.includes(f.layer.id));
+        registration.handler(ownFeatures, evt);
+    };
+}
+export const clickManager = new ClickManager();

package/dist/lib/map/integrations/integrations-manager.d.ts

@@ -0,0 +1,8 @@
+import type { SomeMapIntegration } from "./types";
+declare class IntegrationsManager {
+    private integrations;
+    register(...integrations: Array<SomeMapIntegration>): void;
+    refresh(): void;
+}
+export declare const integrationsManager: IntegrationsManager;
+export type { IntegrationsManager };

package/dist/lib/map/integrations/integrations-manager.js

@@ -1,12 +1,20 @@
-import { XMap as e } from "@tstk/builtin-extensions";
-var t = new class {
-	integrations = new e();
-	register(...e) {
-		for (let t of e) this.integrations.set(t.referenceId, t);
-	}
-	refresh() {
-		for (let e of this.integrations.values()) e.enabled ? e.apply() : e.remove && e.remove();
-	}
-}();
-//#endregion
-export { t as integrationsManager };
+import { XMap } from "@tstk/builtin-extensions";
+class IntegrationsManager {
+    integrations = new XMap();
+    register(...integrations) {
+        for (const integration of integrations) {
+            this.integrations.set(integration.referenceId, integration);
+        }
+    }
+    refresh() {
+        for (const integration of this.integrations.values()) {
+            if (integration.enabled) {
+                integration.apply();
+            }
+            else if (integration.remove) {
+                integration.remove();
+            }
+        }
+    }
+}
+export const integrationsManager = new IntegrationsManager();

package/dist/lib/map/integrations/map-display-option.svelte.d.ts

@@ -0,0 +1,7 @@
+import { MapImageIcon } from "./types";
+export declare class MapDisplayOption {
+    icon?: MapImageIcon;
+    label: string;
+    value: boolean;
+    constructor(label: string, value: boolean, icon?: MapImageIcon);
+}

package/dist/lib/map/integrations/map-display-option.svelte.js

@@ -1,18 +1,10 @@
-import * as e from "svelte/internal/client";
-//#region src/lib/map/integrations/map-display-option.svelte.ts
-var t = class {
-	#e;
-	get value() {
-		return e.get(this.#e);
-	}
-	set value(t) {
-		e.set(this.#e, t, !0);
-	}
-	icon;
-	label;
-	constructor(t, n, r) {
-		this.icon = r, this.label = t, this.#e = e.state(e.proxy(n));
-	}
-};
-//#endregion
-export { t as MapDisplayOption };
+export class MapDisplayOption {
+    icon;
+    label;
+    value;
+    constructor(label, value, icon) {
+        this.icon = icon;
+        this.label = label;
+        this.value = $state(value);
+    }
+}

package/dist/lib/map/integrations/map-geojson-integration.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Map as MaptilerMap } from "@maptiler/sdk";
+import type { Feature, Geometry } from "geojson";
+import type { MapIconManager } from "./map-icon-manager.ts";
+import { MapLayerIntegration } from "./map-layer-integration.svelte.ts";
+export declare abstract class MapGeoJSONIntegration<T = Record<string, unknown>> extends MapLayerIntegration {
+    abstract features: Array<Feature<Geometry, T>>;
+    abstract mapSource: Parameters<MaptilerMap["addSource"]>[1];
+    remove(): void;
+}
+export declare abstract class MapIconLayerIntegration<T = Record<string, unknown>> extends MapGeoJSONIntegration<T> {
+    abstract icons: MapIconManager;
+    apply(): void;
+}

package/dist/lib/map/integrations/map-geojson-integration.svelte.js

@@ -1,17 +1,21 @@
-import { mapManager as e } from "../map.svelte.js";
-import { MapLayerIntegration as t } from "./map-layer-integration.svelte.js";
-import "svelte/internal/client";
-//#region src/lib/map/integrations/map-geojson-integration.svelte.ts
-var n = class extends t {
-	remove() {
-		super.remove(), e.map?.getSource(this.referenceId) && e.map.removeSource(this.referenceId);
-	}
-}, r = class extends n {
-	apply() {
-		e.map && this.icons.loadIcons().then(() => {
-			this.remove(), e.map?.addSource(this.referenceId, this.mapSource), super.apply();
-		});
-	}
-};
-//#endregion
-export { n as MapGeoJSONIntegration, r as MapIconLayerIntegration };
+import { MapLayerIntegration } from "./map-layer-integration.svelte.ts";
+import { mapManager } from "../map.svelte.ts";
+export class MapGeoJSONIntegration extends MapLayerIntegration {
+    remove() {
+        super.remove();
+        if (mapManager.map?.getSource(this.referenceId)) {
+            mapManager.map.removeSource(this.referenceId);
+        }
+    }
+}
+export class MapIconLayerIntegration extends MapGeoJSONIntegration {
+    apply() {
+        if (!mapManager.map)
+            return;
+        this.icons.loadIcons().then(() => {
+            this.remove();
+            mapManager.map?.addSource(this.referenceId, this.mapSource);
+            super.apply();
+        });
+    }
+}

package/dist/lib/map/integrations/map-icon-manager.d.ts

@@ -0,0 +1,15 @@
+import type { Map as MaptilerMap } from "@maptiler/sdk";
+import type { MapImageIcon } from "./types";
+import { SvelteMap } from "svelte/reactivity";
+export declare class MapIconManager {
+    protected icons: SvelteMap<string, MapImageIcon>;
+    constructor(iconMap?: SvelteMap<string, MapImageIcon>);
+    get iter(): MapIterator<[string, MapImageIcon]>;
+    get(id: string): MapImageIcon | undefined;
+    has(id: string): boolean;
+    loadIcons(): Promise<void>;
+    register(id: string, icon: HTMLImageElement): void;
+    protected loadImage(icon: MapImageIcon, map: MaptilerMap): Promise<void>;
+    protected updateImage(icon: MapImageIcon, map: MaptilerMap): Promise<void>;
+    private applyImage;
+}

package/dist/lib/map/integrations/map-icon-manager.js

@@ -1,46 +1,52 @@
-import { mapManager as e } from "../map.svelte.js";
-import { SvelteMap as t } from "svelte/reactivity";
-//#region src/lib/map/integrations/map-icon-manager.ts
-var n = class {
-	icons = new t();
-	constructor(e) {
-		e && (this.icons = e);
-	}
-	get iter() {
-		return this.icons.entries();
-	}
-	get(e) {
-		return this.icons.get(e);
-	}
-	has(e) {
-		return this.icons.has(e);
-	}
-	async loadIcons() {
-		e.map && await Promise.all(this.icons.values().map((t) => this.loadImage(t, e.map)));
-	}
-	register(e, t) {
-		let n = {
-			id: e,
-			image: t
-		};
-		this.icons.set(e, n);
-	}
-	loadImage(e, t) {
-		return this.applyImage("add", e, t);
-	}
-	updateImage(e, t) {
-		return this.applyImage("update", e, t);
-	}
-	applyImage(e, t, n) {
-		let r = () => e === "add" ? n.addImage(t.id, t.image) : n.updateImage(t.id, t.image);
-		return t.image.complete ? (r(), Promise.resolve()) : new Promise((e, n) => {
-			t.image.onload = () => {
-				r(), e();
-			}, t.image.onerror = (e) => {
-				n(Error(`Failed to load image ${t.id}: ${e}`, { cause: e }));
-			};
-		});
-	}
-};
-//#endregion
-export { n as MapIconManager };
+import { mapManager } from "../map.svelte.ts";
+import { SvelteMap } from "svelte/reactivity";
+export class MapIconManager {
+    icons = new SvelteMap();
+    constructor(iconMap) {
+        if (iconMap) {
+            this.icons = iconMap;
+        }
+    }
+    get iter() {
+        return this.icons.entries();
+    }
+    get(id) {
+        return this.icons.get(id);
+    }
+    has(id) {
+        return this.icons.has(id);
+    }
+    async loadIcons() {
+        if (!mapManager.map)
+            return;
+        await Promise.all(this.icons.values().map((icon) => this.loadImage(icon, mapManager.map)));
+    }
+    register(id, icon) {
+        const imageIcon = { id, image: icon };
+        this.icons.set(id, imageIcon);
+    }
+    loadImage(icon, map) {
+        return this.applyImage("add", icon, map);
+    }
+    updateImage(icon, map) {
+        return this.applyImage("update", icon, map);
+    }
+    applyImage(action, icon, map) {
+        const apply = () => action === "add" ? map.addImage(icon.id, icon.image) : map.updateImage(icon.id, icon.image);
+        if (!icon.image.complete) {
+            return new Promise((resolve, reject) => {
+                icon.image.onload = () => {
+                    apply();
+                    resolve();
+                };
+                icon.image.onerror = (err) => {
+                    reject(new Error(`Failed to load image ${icon.id}: ${err}`, { cause: err }));
+                };
+            });
+        }
+        else {
+            apply();
+            return Promise.resolve();
+        }
+    }
+}

package/dist/lib/map/integrations/map-integration.svelte.d.ts

@@ -0,0 +1,6 @@
+export declare abstract class MapIntegration {
+    abstract referenceId: string;
+    abstract enabled: boolean;
+    abstract apply(): void;
+    remove?(): void;
+}

package/dist/lib/map/integrations/map-integration.svelte.js

@@ -1,5 +1,2 @@
-import "svelte/internal/client";
-//#region src/lib/map/integrations/map-integration.svelte.ts
-var e = class {};
-//#endregion
-export { e as MapIntegration };
+export class MapIntegration {
+}

package/dist/lib/map/integrations/map-layer-integration.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Map as MaptilerMap } from "@maptiler/sdk";
+import { MapIntegration } from "./map-integration.svelte.ts";
+export declare abstract class MapLayerIntegration extends MapIntegration {
+    abstract referenceId: string;
+    abstract mapLayer: Parameters<MaptilerMap["addLayer"]>[0];
+    abstract enabled: boolean;
+    beforeLayer?: string;
+    constructor();
+    apply(): void;
+    remove(): void;
+}

package/dist/lib/map/integrations/map-layer-integration.svelte.js

@@ -1,23 +1,36 @@
-import { mapManager as e } from "../map.svelte.js";
-import { MapIntegration as t } from "./map-integration.svelte.js";
-import * as n from "svelte/internal/client";
-import { untrack as r } from "svelte";
-//#region src/lib/map/integrations/map-layer-integration.svelte.ts
-var i = class extends t {
-	beforeLayer;
-	constructor() {
-		super(), n.effect_root(() => {
-			n.user_effect(() => {
-				e.map && this.enabled ? r(() => this.apply()) : e.map && !this.enabled && r(() => this.remove());
-			});
-		});
-	}
-	apply() {
-		e.map && (e.map.getLayer(this.referenceId) || e.map.addLayer(this.mapLayer, this.beforeLayer), e.map.setLayoutProperty(this.referenceId, "visibility", this.enabled ? "visible" : "none"));
-	}
-	remove() {
-		e.map?.getLayer(this.referenceId) && e.map.removeLayer(this.referenceId);
-	}
-};
-//#endregion
-export { i as MapLayerIntegration };
+import { untrack } from "svelte";
+import { mapManager } from "../map.svelte.ts";
+import { MapIntegration } from "./map-integration.svelte.ts";
+export class MapLayerIntegration extends MapIntegration {
+    beforeLayer;
+    constructor() {
+        super();
+        // Each integration manages its own lifecycle. Tracking both mapManager.map and
+        // this.enabled means apply/remove fire automatically on map load and on enabled
+        // changes. untrack on the call itself prevents reactive reads inside apply/remove
+        // from leaking back into this effect's dependency graph.
+        $effect.root(() => {
+            $effect(() => {
+                if (mapManager.map && this.enabled) {
+                    untrack(() => this.apply());
+                }
+                else if (mapManager.map && !this.enabled) {
+                    untrack(() => this.remove());
+                }
+            });
+        });
+    }
+    apply() {
+        if (!mapManager.map)
+            return;
+        if (!mapManager.map.getLayer(this.referenceId)) {
+            mapManager.map.addLayer(this.mapLayer, this.beforeLayer);
+        }
+        mapManager.map.setLayoutProperty(this.referenceId, "visibility", this.enabled ? "visible" : "none");
+    }
+    remove() {
+        if (mapManager.map?.getLayer(this.referenceId)) {
+            mapManager.map.removeLayer(this.referenceId);
+        }
+    }
+}

package/dist/lib/map/integrations/tooltip.svelte.d.ts

@@ -0,0 +1,28 @@
+import type { MapLayerEventType, Popup } from "@maptiler/sdk";
+export type TooltipBuilder = (evt: MapLayerEventType["mousemove"] & object) => Popup | void;
+export declare class TooltipManager {
+    static activeHandle: TooltipHandle | null;
+    private isEnabled;
+    private _tooltips;
+    get tooltips(): MapIterator<TooltipHandle>;
+    enable(layerId?: string): void;
+    disable(layerId?: string): void;
+    get(layerId: string): TooltipHandle | undefined;
+    has(layerId: string): boolean;
+    register(layerId: string, builder: TooltipBuilder, priority?: number): TooltipHandle;
+    with(layerId: string | Array<string>, cb: (tooltip: TooltipHandle) => void): void;
+    private forEachHandle;
+}
+declare class TooltipHandle {
+    layerId: string;
+    priority: number;
+    tooltip: Popup | null;
+    private activeFeatureId;
+    private isEnabled;
+    clearTooltip: () => void;
+    private setTooltip;
+    constructor(layerId: string, builder: TooltipBuilder, priority?: number);
+    enable(): void;
+    disable(): void;
+}
+export {};