@versatiles/svelte 1.1.1 → 1.1.2

package/dist/components/BBoxMap/AutoComplete.svelte

@@ -1,4 +1,3 @@
-<!-- AutoComplete.svelte -->
 <script lang="ts" generics="T">
 	import { isDarkMode } from '../../utils/map_style.js';
 	/* eslint svelte/no-at-html-tags: off */

package/dist/components/BBoxMap/BBoxMap.svelte

@@ -1,4 +1,3 @@
-<!-- BBoxMap.svelte -->
 <script lang="ts">
 	import type { CameraOptions, Map as MaplibreMapType } from 'maplibre-gl';
 	import AutoComplete from './AutoComplete.svelte';
@@ -7,7 +6,7 @@
 	import { isDarkMode } from '../../utils/map_style.js';
 	import type { BBox } from 'geojson';
 	import { loadBBoxes } from './BBoxMap.js';
-	import { BBoxDrawer } from '../../utils/draw/bbox.js';
+	import { BBoxDrawer } from './lib/bbox.js';
 
 	let { selectedBBox = $bindable() }: { selectedBBox?: BBox } = $props();
 	const startTime = Date.now();

package/dist/{utils/draw → components/BBoxMap/lib}/bbox.d.ts

@@ -1,7 +1,7 @@
 import type geojson from 'geojson';
 import { type Writable } from 'svelte/store';
 import maplibregl from 'maplibre-gl';
-type DragPoint = 'n' | 'ne' | 'e' | 'se' | 's' | 'sw' | 'w' | 'nw' | false;
+export type DragPoint = 'n' | 'ne' | 'e' | 'se' | 's' | 'sw' | 'w' | 'nw' | false;
 export declare const DragPointMap: Map<DragPoint, {
     cursor: string;
     flipH: DragPoint;
@@ -27,4 +27,3 @@ export declare class BBoxDrawer {
     private getCursor;
     private doDrag;
 }
-export {};

package/dist/components/BasicMap/BasicMap.svelte

@@ -1,10 +1,8 @@
-<!-- BasicMap.svelte -->
 <script lang="ts">
-	import type { Map as MaplibreMapType, MapOptions } from 'maplibre-gl';
 	import 'maplibre-gl/dist/maplibre-gl.css';
 	import { getMapStyle, isDarkMode } from '../../utils/map_style.js';
 	import maplibre from 'maplibre-gl';
-	const { Map } = maplibre;
+	import type { MapOptions } from 'maplibre-gl';
 
 	// Props
 	let {
@@ -18,9 +16,9 @@
 		style?: string;
 		styleOptions?: Parameters<typeof getMapStyle>[1];
 		mapOptions?: Partial<MapOptions>;
-		map?: MaplibreMapType;
-		onMapInit?: (map: MaplibreMapType) => void;
-		onMapLoad?: (map: MaplibreMapType) => void;
+		map?: maplibre.Map;
+		onMapInit?: (map: maplibre.Map) => void;
+		onMapLoad?: (map: maplibre.Map) => void;
 	} = $props();
 
 	let container: HTMLDivElement;
@@ -40,7 +38,7 @@
 
 		const style = getMapStyle(darkMode, styleOptions);
 		style.transition = { duration: 0, delay: 0 };
-		map = new Map({
+		map = new maplibre.Map({
 			container,
 			style,
 			renderWorldCopies: false,

package/dist/components/BasicMap/BasicMap.svelte.d.ts

@@ -1,13 +1,14 @@
-import type { Map as MaplibreMapType, MapOptions } from 'maplibre-gl';
 import 'maplibre-gl/dist/maplibre-gl.css';
 import { getMapStyle } from '../../utils/map_style.js';
+import maplibre from 'maplibre-gl';
+import type { MapOptions } from 'maplibre-gl';
 type $$ComponentProps = {
     style?: string;
     styleOptions?: Parameters<typeof getMapStyle>[1];
     mapOptions?: Partial<MapOptions>;
-    map?: MaplibreMapType;
-    onMapInit?: (map: MaplibreMapType) => void;
-    onMapLoad?: (map: MaplibreMapType) => void;
+    map?: maplibre.Map;
+    onMapInit?: (map: maplibre.Map) => void;
+    onMapLoad?: (map: maplibre.Map) => void;
 };
 declare const BasicMap: import("svelte").Component<$$ComponentProps, {}, "map">;
 type BasicMap = ReturnType<typeof BasicMap>;

package/dist/components/LocatorMap/LocatorMap.svelte

@@ -1,4 +1,3 @@
-<!-- LocatorMap.svelte -->
 <script lang="ts">
 	import type { Map as MaplibreMapType, GeoJSONSource } from 'maplibre-gl';
 	import BasicMap from '../BasicMap/BasicMap.svelte';
@@ -10,7 +9,6 @@
 			let coordinates: [number, number] = [0, 0];
 			const initialHash = parseHash();
 			if (initialHash) {
-				console.log('initialHash', initialHash);
 				coordinates = [initialHash[1], initialHash[2]];
 				map.setZoom(initialHash[0]);
 				map.setCenter(coordinates);

package/dist/components/MapEditor/components/Editor.svelte

@@ -8,6 +8,7 @@
 	import { PolygonElement } from '../lib/element/polygon.js';
 
 	const { element }: { element: AbstractElement } = $props();
+
 	let strokeVisible = $state(false);
 
 	if (element instanceof PolygonElement) {

package/dist/components/MapEditor/components/EditorSymbol.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { MapLayerSymbol } from '../lib/map_layer/symbol.js';
+	import { labelPositions, MapLayerSymbol } from '../lib/map_layer/symbol.js';
 	import SymbolSelector from './SymbolSelector.svelte';
 
 	const { layer }: { layer: MapLayerSymbol } = $props();
@@ -9,6 +9,7 @@
 	let rotate = $state(layer.rotate);
 	let halo = $state(layer.halo);
 	let label = $state(layer.label);
+	let labelAlign = $state(layer.labelAlign);
 	let size = $state(layer.size);
 </script>
 
@@ -41,3 +42,12 @@
 	<label for="label">Label:</label>
 	<input id="label" type="label" bind:value={$label} />
 </div>
+
+<div class="row-input">
+	<label for="labelAlign">Align Label:</label>
+	<select id="labelAlign" bind:value={$labelAlign}>
+		{#each labelPositions as { index, name } (index)}
+			<option value={index}>{name}</option>
+		{/each}
+	</select>
+</div>

package/dist/components/MapEditor/components/Sidebar.svelte

@@ -1,14 +1,10 @@
 <script lang="ts">
-	import type { AbstractElement } from '../lib/element/abstract.js';
 	import Editor from './Editor.svelte';
 	import type { GeometryManager } from '../lib/geometry_manager.js';
 
 	const { geometryManager, width }: { geometryManager: GeometryManager; width: number } = $props();
 
-	let activeElement: AbstractElement | undefined = $state(undefined);
-	$effect(() => geometryManager.selectElement(activeElement));
-
-	geometryManager.selectedElement.subscribe((value) => (activeElement = value));
+	let activeElement = geometryManager.selectedElement;
 
 	function importGeoJSON() {
 		const input = document.createElement('input');
@@ -60,22 +56,24 @@
 			<input
 				type="button"
 				value="Marker"
-				onclick={() => (activeElement = geometryManager.addNewMarker())}
+				onclick={() => activeElement.set(geometryManager.addNewMarker())}
 			/>
 			<input
 				type="button"
 				value="Line"
-				onclick={() => (activeElement = geometryManager.addNewLine())}
+				onclick={() => activeElement.set(geometryManager.addNewLine())}
 			/>
 			<input
 				type="button"
 				value="Polygon"
-				onclick={() => (activeElement = geometryManager.addNewPolygon())}
+				onclick={() => activeElement.set(geometryManager.addNewPolygon())}
 			/>
 		</div>
-		{#if activeElement != null}
+		{#if $activeElement != null}
 			<hr />
-			<Editor element={activeElement} />
+			{#key $activeElement}
+				<Editor element={$activeElement} />
+			{/key}
 		{/if}
 	</div>
 	<div class="footer">

package/dist/components/MapEditor/lib/geometry_manager.js

@@ -85,6 +85,8 @@ export class GeometryManager {
             this.loadState(hash);
     }
     selectElement(element) {
+        if (element == get(this.selectedElement))
+            return;
         const elements = get(this.elements);
         elements.forEach((e) => e.select(e == element));
         this.selectedElement.set(element);

package/dist/components/MapEditor/lib/map_layer/abstract.d.ts

@@ -20,7 +20,7 @@ export declare abstract class MapLayer<T extends LayerSpec> {
     private addEvents;
     setPaint(paint: T['paint']): void;
     updatePaint<K extends keyof T['paint'], V extends T['paint'][K]>(key: K, value: V): void;
-    setLayout(layout: T['layout']): void;
+    updateLayout(obj: T['layout']): void;
     updateLayout<K extends keyof T['layout'], V extends T['layout'][K]>(key: K, value: V): void;
     destroy(): void;
     abstract getState(): StateObject | undefined;

package/dist/components/MapEditor/lib/map_layer/abstract.js

@@ -13,10 +13,20 @@ export class MapLayer {
         this.id = id;
     }
     addLayer(source, type, layout, paint) {
+        layout = cloneClean(layout);
+        paint = cloneClean(paint);
         this.layout = layout;
         this.paint = paint;
         this.map.addLayer({ id: this.id, source, type, layout, paint }, 'selection_nodes');
         this.addEvents();
+        function cloneClean(obj) {
+            const clone = { ...obj };
+            for (const key in clone) {
+                if (clone[key] == null)
+                    delete clone[key];
+            }
+            return clone;
+        }
     }
     on(event, handler) {
         if (!this.eventHandlers.has(event))
@@ -75,18 +85,23 @@ export class MapLayer {
         this.map.setPaintProperty(this.id, key, value);
         this.paint[key] = value;
     }
-    setLayout(layout) {
-        if (layout === undefined)
-            return;
-        const keys = new Set(Object.keys(layout).concat(Object.keys(this.layout)));
-        for (const key of keys.values())
-            this.updateLayout(key, layout[key]);
-    }
-    updateLayout(key, value) {
-        if (this.layout[key] == value)
-            return;
-        this.map.setLayoutProperty(this.id, key, value);
-        this.layout[key] = value;
+    updateLayout(arg1, arg2) {
+        if (typeof arg1 === 'string') {
+            if (this.layout[arg1] == arg2)
+                return;
+            this.map.setLayoutProperty(this.id, arg1, arg2);
+            if (arg2 == null) {
+                delete this.layout[arg1];
+            }
+            else {
+                this.layout[arg1] = arg2;
+            }
+        }
+        else if (typeof arg1 === 'object') {
+            for (const [key, value] of Object.entries(arg1)) {
+                this.updateLayout(key, value);
+            }
+        }
     }
     destroy() {
         this.map.removeLayer(this.id);

package/dist/components/MapEditor/lib/map_layer/symbol.d.ts

@@ -1,19 +1,29 @@
+import { type Writable } from 'svelte/store';
 import type { LayerSymbol } from './types.js';
 import { MapLayer } from './abstract.js';
 import type { GeometryManager } from '../geometry_manager.js';
 import type { StateObject } from '../state/types.js';
+interface LabelAlign {
+    index: 0 | 1 | 2 | 3 | 4;
+    name: string;
+    anchor?: 'center' | 'left' | 'right' | 'bottom' | 'top';
+}
+export declare const labelPositions: LabelAlign[];
 export declare class MapLayerSymbol extends MapLayer<LayerSymbol> {
-    color: import("svelte/store").Writable<string>;
-    halo: import("svelte/store").Writable<number>;
-    rotate: import("svelte/store").Writable<number>;
-    size: import("svelte/store").Writable<number>;
-    symbolIndex: import("svelte/store").Writable<number>;
-    label: import("svelte/store").Writable<string>;
-    haloWidth: import("svelte/store").Readable<number>;
+    color: Writable<string>;
+    halo: Writable<number>;
+    rotate: Writable<number>;
+    size: Writable<number>;
+    symbolIndex: Writable<number>;
+    label: Writable<string>;
+    labelAlign: Writable<0 | 2 | 1 | 4 | 3>;
     symbolInfo: import("svelte/store").Readable<import("../symbols.js").SymbolInfo>;
+    textAnchor: import("svelte/store").Readable<"center" | "top" | "bottom" | "right" | "left" | undefined>;
+    textVariableAnchor: import("svelte/store").Readable<("center" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | "top" | "bottom" | "right" | "left")[] | undefined>;
     constructor(manager: GeometryManager, id: string, source: string);
     getState(): StateObject | undefined;
     setState(state: StateObject): void;
     getGeoJSONProperties(): GeoJSON.GeoJsonProperties;
     setGeoJSONProperties(properties: GeoJSON.GeoJsonProperties): void;
 }
+export {};

package/dist/components/MapEditor/lib/map_layer/symbol.js

@@ -3,13 +3,21 @@ import { MapLayer } from './abstract.js';
 import { Color } from '@versatiles/style';
 import { getSymbol, getSymbolIndexByName } from '../symbols.js';
 import { removeDefaultFields } from '../utils.js';
+export const labelPositions = [
+    { index: 0, name: 'auto' },
+    { index: 1, name: 'right', anchor: 'left' },
+    { index: 2, name: 'left', anchor: 'right' },
+    { index: 3, name: 'top', anchor: 'bottom' },
+    { index: 4, name: 'bottom', anchor: 'top' }
+];
 const defaultStyle = {
     color: '#ff0000',
     rotate: 0,
     size: 1,
     halo: 1,
     pattern: 38,
-    label: ''
+    label: '',
+    align: 0
 };
 export class MapLayerSymbol extends MapLayer {
     color = writable(defaultStyle.color);
@@ -18,22 +26,34 @@ export class MapLayerSymbol extends MapLayer {
     size = writable(defaultStyle.size);
     symbolIndex = writable(defaultStyle.pattern);
     label = writable(defaultStyle.label);
-    haloWidth = derived([this.halo, this.size], ([halo, size]) => halo * size);
+    labelAlign = writable(defaultStyle.align);
     symbolInfo = derived(this.symbolIndex, (index) => getSymbol(index));
+    textAnchor = derived(this.labelAlign, (index) => {
+        return lookupLabelAlign(index).anchor;
+    });
+    textVariableAnchor = derived([this.labelAlign, this.symbolInfo], ([index, symbol]) => {
+        if (index !== 0)
+            return undefined;
+        if (symbol.image == null) {
+            return ['center', 'left', 'right', 'top', 'bottom'];
+        }
+        return ['left', 'right', 'top', 'bottom'];
+    });
     constructor(manager, id, source) {
         super(manager, id);
         this.addLayer(source, 'symbol', {
             'icon-image': get(this.symbolInfo).image,
             'icon-offset': get(this.symbolInfo).offset,
-            'icon-overlap': 'always',
+            'icon-allow-overlap': true,
             'icon-rotate': defaultStyle.rotate,
             'icon-size': defaultStyle.size,
             'text-field': defaultStyle.label,
             'text-font': ['noto_sans_regular'],
             'text-justify': 'left',
-            'text-optional': true,
-            'text-offset': [0.7, 0.7],
-            'text-variable-anchor': ['right', 'left', 'top', 'bottom']
+            'text-overlap': 'always',
+            'text-radial-offset': 0.7,
+            'text-variable-anchor': get(this.textVariableAnchor),
+            'text-anchor': get(this.textAnchor)
         }, {
             'icon-color': defaultStyle.color,
             'icon-halo-blur': 0,
@@ -44,27 +64,45 @@ export class MapLayerSymbol extends MapLayer {
             'text-halo-color': '#FFFFFF',
             'text-halo-width': defaultStyle.halo
         });
-        this.color.subscribe((v) => this.updatePaint('icon-color', Color.parse(v)));
-        this.haloWidth.subscribe((v) => {
+        this.color.subscribe((v) => {
+            this.updatePaint('icon-color', Color.parse(v));
+            this.manager.saveState();
+        });
+        this.halo.subscribe((v) => {
             this.updatePaint('icon-halo-width', v);
             this.updatePaint('text-halo-width', v);
+            this.manager.saveState();
+        });
+        this.label.subscribe((v) => {
+            this.updateLayout('text-field', v);
+            this.manager.saveState();
+        });
+        this.textAnchor.subscribe((v) => {
+            this.updateLayout('text-anchor', v);
+            this.manager.saveState();
+        });
+        this.textVariableAnchor.subscribe((v) => {
+            this.updateLayout('text-variable-anchor', v);
+            this.manager.saveState();
+        });
+        this.rotate.subscribe((v) => {
+            this.updateLayout('icon-rotate', v);
+            this.manager.saveState();
         });
-        this.label.subscribe((v) => this.updateLayout('text-field', v));
-        this.rotate.subscribe((v) => this.updateLayout('icon-rotate', v));
         this.size.subscribe((v) => {
             this.updateLayout('icon-size', v);
             this.updateLayout('text-size', v * 16);
+            this.manager.saveState();
         });
         this.symbolInfo.subscribe((v) => {
             if (v.image == null) {
                 this.updateLayout('icon-image', undefined);
-                this.updateLayout('text-variable-anchor', ['center']);
             }
             else {
                 this.updateLayout('icon-image', v.image);
-                this.updateLayout('text-variable-anchor', ['right', 'left', 'top', 'bottom']);
                 this.updateLayout('icon-offset', v.offset);
             }
+            this.manager.saveState();
         });
     }
     getState() {
@@ -74,7 +112,8 @@ export class MapLayerSymbol extends MapLayer {
             size: get(this.size),
             halo: get(this.halo),
             pattern: get(this.symbolIndex),
-            label: get(this.label)
+            label: get(this.label),
+            align: get(this.labelAlign)
         }, defaultStyle);
     }
     setState(state) {
@@ -90,6 +129,8 @@ export class MapLayerSymbol extends MapLayer {
             this.symbolIndex.set(state.pattern);
         if (state.label)
             this.label.set(state.label);
+        if (state.align)
+            this.labelAlign.set(lookupLabelAlign(state.align).index);
     }
     getGeoJSONProperties() {
         return {
@@ -98,7 +139,8 @@ export class MapLayerSymbol extends MapLayer {
             'symbol-rotate': get(this.rotate),
             'symbol-size': get(this.size),
             'symbol-pattern': get(this.symbolInfo).name,
-            'symbol-label': get(this.label)
+            'symbol-label': get(this.label),
+            'symbol-label-align': lookupLabelAlign(this.labelAlign).name
         };
     }
     setGeoJSONProperties(properties) {
@@ -114,6 +156,8 @@ export class MapLayerSymbol extends MapLayer {
             this.size.set(properties['symbol-size']);
         if (properties['symbol-label'])
             this.label.set(properties['symbol-label']);
+        if (properties['symbol-label-align'])
+            this.labelAlign.set(lookupLabelAlign(properties['symbol-label-align']).index);
         if (properties['symbol-pattern']) {
             const index = getSymbolIndexByName(properties['symbol-pattern']);
             if (index != null)
@@ -121,3 +165,18 @@ export class MapLayerSymbol extends MapLayer {
         }
     }
 }
+function lookupLabelAlign(index) {
+    let pos;
+    if (typeof index === 'object') {
+        index = get(index);
+    }
+    if (typeof index === 'number') {
+        pos = labelPositions.find((p) => p.index === index);
+    }
+    else if (typeof index === 'string') {
+        pos = labelPositions.find((p) => p.name === index);
+    }
+    if (pos == null)
+        return labelPositions[0];
+    return pos;
+}

package/dist/components/MapEditor/lib/state/reader.js

@@ -110,7 +110,7 @@ export class StateReader {
                     state.pattern = this.readUnsignedInteger();
                     break;
                 case 73:
-                    state.rotate = this.readUnsignedInteger();
+                    state.rotate = this.readSignedInteger();
                     break;
                 case 74:
                     state.size = this.readUnsignedInteger() / 10;
@@ -121,6 +121,9 @@ export class StateReader {
                 case 76:
                     state.zoom = this.readUnsignedInteger() / 20;
                     break;
+                case 77:
+                    state.align = this.readUnsignedInteger();
+                    break;
                 case 90:
                     state.visible = this.readBoolean();
                     break;

package/dist/components/MapEditor/lib/state/types.d.ts

@@ -16,5 +16,6 @@ export interface StateObject {
     size?: number;
     width?: number;
     zoom?: number;
+    align?: number;
     visible?: boolean;
 }

package/dist/components/MapEditor/lib/state/writer.js

@@ -66,6 +66,8 @@ export class StateWriter {
                 case 'elements':
                     if (!Array.isArray(value))
                         throw new Error(`Invalid elements: ${value}`);
+                    if (value.length === 0)
+                        return;
                     this.writeByte(20);
                     this.writeUnsignedInteger(value.length);
                     value.forEach((element) => this.writeObject(element));
@@ -80,6 +82,8 @@ export class StateWriter {
                 case 'points':
                     if (!Array.isArray(value))
                         throw new Error(`Invalid points: ${value}`);
+                    if (value.length === 0)
+                        return;
                     this.writeByte(31);
                     this.writeUnsignedInteger(value.length);
                     this.writeDifferential(value.map((p) => Math.round(p[0] * 1e5)));
@@ -121,7 +125,7 @@ export class StateWriter {
                     writeInteger(72, value);
                     break;
                 case 'rotate':
-                    writeInteger(73, value);
+                    writeSignedInteger(73, value);
                     break;
                 case 'size':
                     writeInteger(74, value, 10);
@@ -132,6 +136,9 @@ export class StateWriter {
                 case 'zoom':
                     writeInteger(76, value, 20);
                     break;
+                case 'align':
+                    writeInteger(77, value);
+                    break;
                 case 'visible':
                     if (typeof value !== 'boolean')
                         throw new Error(`Invalid boolean: ${value}`);
@@ -158,6 +165,13 @@ export class StateWriter {
             me.writeByte(id);
             me.writeUnsignedInteger(value * factor);
         }
+        function writeSignedInteger(id, obj, factor = 1) {
+            if (typeof obj !== 'number')
+                throw new Error(`Invalid number: ${obj}`);
+            const value = Math.round(obj);
+            me.writeByte(id);
+            me.writeSignedInteger(value * factor);
+        }
     }
     writeColor(color) {
         if (typeof color !== 'string')

package/package.json

@@ -1,24 +1,24 @@
 {
   "name": "@versatiles/svelte",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "license": "MIT",
   "scripts": {
     "build": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json && vite build && npm run package",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "check": "npm run lint && npm run build && npm run test",
+    "check-watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "check": "npm run format && npm run lint && npm run build && npm run test",
     "dev": "vite dev",
-    "format": "prettier --write .",
+    "format": "prettier --write --log-level warn .",
     "lint": "prettier --check . && eslint --color .",
     "package": "svelte-kit sync && svelte-package && publint",
     "prepack": "npm run build",
     "prepublishOnly": "npm run package",
     "preview": "vite preview",
-    "screenshots": "npm run build && npx tsx ./scripts/screenshots.ts && pngquant --nofs --force --ext .png screenshots/*.png && optipng -quiet screenshots/*.png",
+    "screenshots": "npx tsx ./scripts/screenshots.ts",
     "release": "vrt release-npm",
-    "test:integration": "playwright test",
-    "test:unit": "vitest run",
-    "test:coverage": "vitest run --coverage",
-    "test": "npm run test:unit && npm run test:integration",
+    "test-integration": "playwright test",
+    "test-unit": "vitest run",
+    "test-coverage": "vitest run --coverage",
+    "test": "npm run test-unit && npm run test-integration",
     "upgrade": "vrt deps-upgrade"
   },
   "exports": {
@@ -30,18 +30,19 @@
   "files": [
     "dist",
     "!dist/**/*.spec.*",
+    "!dist/**/__mocks__/*",
     "!dist/**/*.test.*",
     "!dist/BBoxMap/data/*",
     "!dist/BBoxMap/helpers/*"
   ],
   "peerDependencies": {
     "sass-embedded": "^1.86.0",
-    "svelte": "^5.0.3"
+    "svelte": "^5.23.2"
   },
   "devDependencies": {
     "@playwright/test": "^1.51.1",
     "@sveltejs/adapter-static": "^3.0.8",
-    "@sveltejs/kit": "^2.20.0",
+    "@sveltejs/kit": "^2.20.1",
     "@sveltejs/package": "^2.3.10",
     "@sveltejs/vite-plugin-svelte": "^5.0.3",
     "@turf/turf": "^7.2.0",
@@ -60,7 +61,7 @@
     "prettier-plugin-svelte": "^3.3.3",
     "publint": "^0.3.9",
     "sass": "^1.86.0",
-    "svelte": "^5.23.1",
+    "svelte": "^5.23.2",
     "svelte-check": "^4.1.5",
     "svelte-preprocess": "^6.0.3",
     "tsx": "^4.19.3",

package/dist/components/MapEditor/lib/__mocks__/cursor.d.ts

@@ -1,5 +0,0 @@
-export declare class MockCursor {
-    grab: import("vitest").Mock<(...args: any[]) => any>;
-    hover: import("vitest").Mock<(...args: any[]) => any>;
-    precise: import("vitest").Mock<(...args: any[]) => any>;
-}

package/dist/components/MapEditor/lib/__mocks__/cursor.js

@@ -1,6 +0,0 @@
-import { vi } from 'vitest';
-export class MockCursor {
-    grab = vi.fn();
-    hover = vi.fn();
-    precise = vi.fn();
-}

package/dist/components/MapEditor/lib/__mocks__/geometry_manager.d.ts

@@ -1,22 +0,0 @@
-import { type Writable } from 'svelte/store';
-import type { AbstractElement } from '../element/abstract.js';
-import type { StateObject } from '../state/types.js';
-import { MockMap } from './map.js';
-import { MockCursor } from './cursor.js';
-export declare class MockGeometryManager {
-    readonly elements: Writable<AbstractElement[]>;
-    readonly activeElement: Writable<AbstractElement | undefined>;
-    readonly map: MockMap;
-    readonly cursor: MockCursor;
-    constructor();
-    setActiveElement: import("vitest").Mock<(...args: any[]) => any>;
-    getState: import("vitest").Mock<() => StateObject>;
-    saveState: import("vitest").Mock<(...args: any[]) => any>;
-    loadState: import("vitest").Mock<(...args: any[]) => any>;
-    getElement: import("vitest").Mock<(index: number) => AbstractElement>;
-    addNewMarker: import("vitest").Mock<() => AbstractElement>;
-    addNewLine: import("vitest").Mock<() => AbstractElement>;
-    addNewPolygon: import("vitest").Mock<() => AbstractElement>;
-    deleteElement: import("vitest").Mock<(...args: any[]) => any>;
-    drawSelectionNodes: import("vitest").Mock<(...args: any[]) => any>;
-}

package/dist/components/MapEditor/lib/__mocks__/geometry_manager.js

@@ -1,21 +0,0 @@
-import { writable } from 'svelte/store';
-import { vi } from 'vitest';
-import { MockMap } from './map.js';
-import { MockCursor } from './cursor.js';
-export class MockGeometryManager {
-    elements = writable([]);
-    activeElement = writable(undefined);
-    map = new MockMap();
-    cursor = new MockCursor();
-    constructor() { }
-    setActiveElement = vi.fn();
-    getState = vi.fn(() => ({ map: { point: [0, 0], zoom: 10 }, elements: [] }));
-    saveState = vi.fn();
-    loadState = vi.fn();
-    getElement = vi.fn((index) => ({ index }));
-    addNewMarker = vi.fn(() => ({}));
-    addNewLine = vi.fn(() => ({}));
-    addNewPolygon = vi.fn(() => ({}));
-    deleteElement = vi.fn();
-    drawSelectionNodes = vi.fn();
-}

package/dist/components/MapEditor/lib/__mocks__/map.d.ts

@@ -1,36 +0,0 @@
-export declare class MockMap {
-    getCanvasContainer: import("vitest").Mock<() => {
-        style: {
-            cursor: string;
-        };
-    }>;
-    addSource: import("vitest").Mock<(...args: any[]) => any>;
-    removeSource: import("vitest").Mock<(...args: any[]) => any>;
-    getSource: import("vitest").Mock<() => {
-        setData: import("vitest").Mock<(...args: any[]) => any>;
-    }>;
-    addLayer: import("vitest").Mock<(...args: any[]) => any>;
-    on: import("vitest").Mock<(...args: any[]) => any>;
-    setCenter: import("vitest").Mock<(...args: any[]) => any>;
-    setZoom: import("vitest").Mock<(...args: any[]) => any>;
-    getZoom: import("vitest").Mock<() => number>;
-    getCenter: import("vitest").Mock<() => {
-        lng: number;
-        lat: number;
-    }>;
-    queryRenderedFeatures: import("vitest").Mock<() => {
-        properties: {};
-    }[]>;
-    setPaintProperty: import("vitest").Mock<(...args: any[]) => any>;
-    setLayoutProperty: import("vitest").Mock<(...args: any[]) => any>;
-    removeLayer: import("vitest").Mock<(...args: any[]) => any>;
-    hasImage: import("vitest").Mock<(...args: any[]) => any>;
-    removeImage: import("vitest").Mock<(...args: any[]) => any>;
-    addImage: import("vitest").Mock<(...args: any[]) => any>;
-    getBounds: import("vitest").Mock<() => {
-        getWest: () => -180;
-        getEast: () => 180;
-        getSouth: () => -90;
-        getNorth: () => 90;
-    }>;
-}

package/dist/components/MapEditor/lib/__mocks__/map.js

@@ -1,26 +0,0 @@
-import { vi } from 'vitest';
-export class MockMap {
-    getCanvasContainer = vi.fn(() => ({ style: { cursor: 'default' } }));
-    addSource = vi.fn();
-    removeSource = vi.fn();
-    getSource = vi.fn(() => ({ setData: vi.fn() }));
-    addLayer = vi.fn();
-    on = vi.fn();
-    setCenter = vi.fn();
-    setZoom = vi.fn();
-    getZoom = vi.fn(() => 10);
-    getCenter = vi.fn(() => ({ lng: 0, lat: 0 }));
-    queryRenderedFeatures = vi.fn(() => [{ properties: {} }]);
-    setPaintProperty = vi.fn();
-    setLayoutProperty = vi.fn();
-    removeLayer = vi.fn();
-    hasImage = vi.fn();
-    removeImage = vi.fn();
-    addImage = vi.fn();
-    getBounds = vi.fn(() => ({
-        getWest: () => -180,
-        getEast: () => 180,
-        getSouth: () => -90,
-        getNorth: () => 90
-    }));
-}