@versatiles/svelte 1.1.2 → 2.0.0

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

@@ -1,192 +1,205 @@
 import { Color } from '@versatiles/style';
-import { compress, uint8ArrayToBase64 } from '../utils.js';
-const chunkSize = 65536;
+import { BASE64_CHARS, CHAR_CODE2VALUE } from './constants.js';
+import { StateReader } from './reader.js';
 export class StateWriter {
-    buffer = new Uint8Array(chunkSize);
-    offset = 0;
+    bits = [];
     constructor() { }
-    writeByte(num) {
-        if (this.offset >= this.buffer.length) {
-            const newBuffer = new Uint8Array(this.buffer.length + chunkSize);
-            newBuffer.set(this.buffer);
-            this.buffer = newBuffer;
+    asBase64() {
+        const reader = new StateReader(this.bits);
+        const chars = [];
+        while (!reader.ended()) {
+            chars.push(BASE64_CHARS[reader.read6pack()]);
         }
-        this.buffer[this.offset++] = num;
+        return chars.join('');
     }
-    writeUnsignedInteger(i) {
-        if (!Number.isSafeInteger(i)) {
-            throw new RangeError(`Number out of safe integer range: ${i}`);
-        }
-        while (i > 0x7f) {
-            this.writeByte((i & 0x7f) | 0x80);
-            i >>>= 7;
+    asBitString() {
+        return this.bits.map((bit) => (bit ? '1' : '0')).join('');
+    }
+    writeBit(value) {
+        this.bits.push(value);
+    }
+    writeInteger(value, bits) {
+        if (value % 1 !== 0)
+            throw new Error('value must be an integer');
+        for (let i = bits - 1; i >= 0; i--) {
+            this.bits.push((value & (1 << i)) > 0);
         }
-        this.writeByte(i);
+        return value;
     }
-    writeSignedInteger(i) {
-        if (!Number.isSafeInteger(i)) {
-            throw new RangeError(`Number out of safe integer range: ${i}`);
+    writeVarint(value, signed) {
+        if (value % 1 !== 0)
+            throw new Error('value must be an integer');
+        if (signed) {
+            value = value < 0 ? ((-1 - value) << 1) | 1 : value << 1;
+        }
+        else {
+            if (value < 0)
+                throw new Error('Unsigned varint cannot be negative');
+        }
+        while (true) {
+            this.writeInteger(value & 0x1f, 5);
+            value >>= 5;
+            this.writeBit(value >= 1);
+            if (value < 1)
+                break;
         }
-        this.writeUnsignedInteger(i < 0 ? -i * 2 - 1 : i * 2);
     }
-    writeString(str) {
-        const length = str.length;
-        this.writeUnsignedInteger(length);
+    writeArray(array, cb) {
+        const length = array.length;
+        this.writeVarint(length);
         for (let i = 0; i < length; i++)
-            this.writeUnsignedInteger(str.charCodeAt(i));
-    }
-    writeBoolean(b) {
-        this.writeByte(b ? 1 : 0);
+            cb(array[i]);
     }
-    getBase64() {
-        return uint8ArrayToBase64(this.getBuffer());
+    writePoint(point, level = 14) {
+        const scale = Math.pow(2, level + 2);
+        this.writeInteger(Math.round(point[0] * scale), level + 11);
+        this.writeInteger(Math.round(point[1] * scale), level + 10);
     }
-    async getBase64compressed() {
-        return uint8ArrayToBase64(await compress(this.getBuffer()));
-    }
-    getBuffer() {
-        return this.buffer.slice(0, this.offset);
+    writePoints(points, level = 14) {
+        this.writeVarint(points.length);
+        const scale = Math.pow(2, level + 2);
+        let x = 0;
+        let y = 0;
+        points.forEach((point) => {
+            const xi = Math.round(point[0] * scale);
+            const yi = Math.round(point[1] * scale);
+            this.writeVarint(xi - x, true);
+            this.writeVarint(yi - y, true);
+            x = xi;
+            y = yi;
+        });
     }
-    writeObject(state) {
-        // eslint-disable-next-line @typescript-eslint/no-this-alias
-        const me = this;
-        Object.entries(state).forEach(([key, value]) => {
-            if (value == null)
-                return;
-            switch (key) {
-                case 'map':
-                    writeObject(10, value);
-                    break;
-                case 'style':
-                    writeObject(11, value);
-                    break;
-                case 'strokeStyle':
-                    writeObject(12, value);
-                    break;
-                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));
-                    break;
-                case 'point':
-                    if (!Array.isArray(value) || value.length !== 2)
-                        throw new Error(`Invalid point: ${value}`);
-                    this.writeByte(30);
-                    me.writeSignedInteger(Math.round(value[0] * 1e5));
-                    me.writeSignedInteger(Math.round(value[1] * 1e5));
-                    break;
-                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)));
-                    this.writeDifferential(value.map((p) => Math.round(p[1] * 1e5)));
-                    break;
-                case 'color':
-                    this.writeByte(40);
-                    this.writeColor(value);
-                    break;
-                case 'type':
-                    this.writeByte(50);
-                    switch (value) {
-                        case 'marker':
-                            this.writeByte(0);
-                            break;
-                        case 'line':
-                            this.writeByte(1);
-                            break;
-                        case 'polygon':
-                            this.writeByte(2);
-                            break;
-                        default:
-                            throw new Error(`Invalid type: ${value}`);
-                    }
-                    break;
-                case 'label':
-                    if (typeof value !== 'string')
-                        throw new Error(`Invalid string: ${value}`);
-                    this.writeByte(60);
-                    this.writeString(value);
-                    break;
-                case 'halo':
-                    writeInteger(70, value, 10);
-                    break;
-                case 'opacity':
-                    writeInteger(71, value, 100);
-                    break;
-                case 'pattern':
-                    writeInteger(72, value);
-                    break;
-                case 'rotate':
-                    writeSignedInteger(73, value);
-                    break;
-                case 'size':
-                    writeInteger(74, value, 10);
-                    break;
-                case 'width':
-                    writeInteger(75, value, 10);
-                    break;
-                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}`);
-                    this.writeByte(90);
-                    this.writeBoolean(value);
+    writeRoot(root) {
+        // Write the version
+        this.writeInteger(0, 3);
+        if (root.map) {
+            this.writeBit(true);
+            this.writeMap(root.map);
+        }
+        else {
+            this.writeBit(false);
+        }
+        // metadata is not used yet
+        this.writeBit(false);
+        root.elements.forEach((element) => {
+            switch (element.type) {
+                case 'marker':
+                    this.writeInteger(1, 3);
+                    this.writeElementMarker(element);
+                    break;
+                case 'line':
+                    this.writeInteger(2, 3);
+                    this.writeElementLine(element);
+                    break;
+                case 'polygon':
+                    this.writeInteger(3, 3);
+                    this.writeElementPolygon(element);
                     break;
-                default:
-                    throw new Error(`Invalid state key: ${key}`);
             }
         });
-        this.writeByte(0);
-        function writeObject(id, obj) {
-            if (typeof obj !== 'object' || obj == null)
-                throw new Error(`Invalid object: ${obj}`);
-            me.writeByte(id);
-            me.writeObject(obj);
-        }
-        function writeInteger(id, obj, factor = 1) {
-            if (typeof obj !== 'number')
-                throw new Error(`Invalid number: ${obj}`);
-            const value = Math.round(obj);
-            if (value < 0)
-                throw new Error(`Negative Number: ${obj}`);
-            me.writeByte(id);
-            me.writeUnsignedInteger(value * factor);
+    }
+    writeMap(map) {
+        this.writeInteger(Math.round(map.zoom * 32), 10);
+        this.writePoint(map.center, Math.ceil(map.zoom));
+    }
+    writeElementMarker(element) {
+        this.writePoint(element.point);
+        if (element.style) {
+            this.writeBit(true);
+            this.writeStyle(element.style);
+        }
+        else {
+            this.writeBit(false);
+        }
+        return element;
+    }
+    writeElementLine(element) {
+        this.writePoints(element.points);
+        if (element.style) {
+            this.writeBit(true);
+            this.writeStyle(element.style);
+        }
+        else {
+            this.writeBit(false);
+        }
+        return element;
+    }
+    writeElementPolygon(element) {
+        this.writePoints(element.points);
+        if (element.style) {
+            this.writeBit(true);
+            this.writeStyle(element.style);
+        }
+        else {
+            this.writeBit(false);
+        }
+        if (element.strokeStyle) {
+            this.writeBit(true);
+            this.writeStyle(element.strokeStyle);
         }
-        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);
+        else {
+            this.writeBit(false);
         }
     }
+    writeStyle(style) {
+        if (style.halo != null) {
+            this.writeInteger(1, 4);
+            this.writeVarint(Math.round(style.halo * 10));
+        }
+        if (style.opacity != null) {
+            this.writeInteger(2, 4);
+            this.writeVarint(Math.round(style.opacity * 100));
+        }
+        if (style.pattern != null) {
+            this.writeInteger(3, 4);
+            this.writeVarint(style.pattern);
+        }
+        if (style.rotate != null) {
+            this.writeInteger(4, 4);
+            this.writeVarint(style.rotate, true);
+        }
+        if (style.size != null) {
+            this.writeInteger(5, 4);
+            this.writeVarint(Math.round(style.size * 10));
+        }
+        if (style.width != null) {
+            this.writeInteger(6, 4);
+            this.writeVarint(Math.round(style.width * 10));
+        }
+        if (style.align != null) {
+            this.writeInteger(7, 4);
+            this.writeVarint(style.align);
+        }
+        if (style.color != null) {
+            this.writeInteger(8, 4);
+            this.writeColor(style.color);
+        }
+        if (style.label != null) {
+            this.writeInteger(9, 4);
+            this.writeString(style.label);
+        }
+        if (style.visible === false) {
+            this.writeInteger(10, 4);
+        }
+        this.writeInteger(0, 4);
+    }
     writeColor(color) {
-        if (typeof color !== 'string')
-            throw new Error(`Invalid color: ${color}`);
-        const c = Color.parse(color).asRGB().round().asArray();
-        this.writeByte(c[0]);
-        this.writeByte(c[1]);
-        this.writeByte(c[2]);
-    }
-    writeDifferential(values) {
-        if (values.length === 0)
-            return;
-        this.writeSignedInteger(values[0]);
-        for (let i = 1; i < values.length; i++) {
-            this.writeSignedInteger(values[i] - values[i - 1]);
+        const rgb = Color.parse(color).toRGB();
+        this.writeInteger(rgb.r, 8);
+        this.writeInteger(rgb.g, 8);
+        this.writeInteger(rgb.b, 8);
+        if (rgb.a == 1) {
+            this.bits.push(false);
+        }
+        else {
+            this.bits.push(true);
+            this.writeInteger(Math.round(rgb.a * 255), 8);
         }
     }
+    writeString(value) {
+        const charCodes = value.split('').map((c) => c.charCodeAt(0));
+        this.writeVarint(charCodes.length);
+        charCodes.forEach((c) => this.writeVarint(c < 128 ? CHAR_CODE2VALUE[c] : c));
+        return value;
+    }
 }

package/dist/components/MapEditor/lib/utils.d.ts

@@ -1,9 +1,6 @@
 import type { ElementPoint } from './element/types.js';
+import type { StateStyle } from './state/types.js';
 export declare function getMiddlePoint(p0: ElementPoint, p1: ElementPoint): ElementPoint;
 export declare function lat2mercator(lat: number): number;
 export declare function mercator2lat(y: number): number;
-export declare function base64ToUint8Array(base64: string): Uint8Array;
-export declare function uint8ArrayToBase64(data: Uint8Array): string;
-export declare function compress(data: Uint8Array): Promise<Uint8Array>;
-export declare function decompress(data: Uint8Array): Promise<Uint8Array>;
-export declare function removeDefaultFields<T extends Record<string, unknown>>(value: T, def: T): Partial<T> | undefined;
+export declare function removeDefaultFields(value: StateStyle, def: StateStyle): Partial<StateStyle> | undefined;

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

@@ -9,25 +9,6 @@ export function lat2mercator(lat) {
 export function mercator2lat(y) {
     return ((2 * Math.atan(Math.exp(y)) - Math.PI / 2) * 180) / Math.PI;
 }
-export function base64ToUint8Array(base64) {
-    const binaryString = atob(base64);
-    return Uint8Array.from(binaryString, (c) => c.charCodeAt(0));
-}
-export function uint8ArrayToBase64(data) {
-    const binaryString = String.fromCharCode(...data);
-    return btoa(binaryString);
-}
-export async function compress(data) {
-    const stream = new Blob([data]).stream();
-    const compressedStream = stream.pipeThrough(new CompressionStream('deflate-raw'));
-    return new Uint8Array(await new Response(compressedStream).arrayBuffer());
-}
-export async function decompress(data) {
-    const stream = new Blob([data]).stream();
-    const decompressedStream = stream.pipeThrough(new DecompressionStream('deflate-raw'));
-    const arrayBuffer = await new Response(decompressedStream).arrayBuffer();
-    return new Uint8Array(arrayBuffer);
-}
 export function removeDefaultFields(value, def) {
     const entries = Object.entries(value).filter(([k, v]) => {
         if (v === undefined)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@versatiles/svelte",
-  "version": "1.1.2",
+  "version": "2.0.0",
   "license": "MIT",
   "scripts": {
     "build": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json && vite build && npm run package",
@@ -36,45 +36,45 @@
     "!dist/BBoxMap/helpers/*"
   ],
   "peerDependencies": {
-    "sass-embedded": "^1.86.0",
-    "svelte": "^5.23.2"
+    "sass-embedded": "^1.86.3",
+    "svelte": "^5.27.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.51.1",
     "@sveltejs/adapter-static": "^3.0.8",
-    "@sveltejs/kit": "^2.20.1",
-    "@sveltejs/package": "^2.3.10",
+    "@sveltejs/kit": "^2.20.7",
+    "@sveltejs/package": "^2.3.11",
     "@sveltejs/vite-plugin-svelte": "^5.0.3",
     "@turf/turf": "^7.2.0",
     "@types/eslint": "^9.6.1",
-    "@types/node": "^22.13.10",
+    "@types/node": "^22.14.1",
     "@versatiles/release-tool": "^2.4.2",
-    "@vitest/coverage-v8": "^3.0.9",
+    "@vitest/coverage-v8": "^3.1.1",
     "cookie": "^1.0.2",
-    "eslint": "^9.22.0",
-    "eslint-config-prettier": "^10.1.1",
-    "eslint-plugin-svelte": "^3.3.2",
+    "eslint": "^9.24.0",
+    "eslint-config-prettier": "^10.1.2",
+    "eslint-plugin-svelte": "^3.5.1",
     "geojson": "^0.5.0",
     "globals": "^16.0.0",
     "happy-dom": "^17.4.4",
     "prettier": "^3.5.3",
     "prettier-plugin-svelte": "^3.3.3",
-    "publint": "^0.3.9",
-    "sass": "^1.86.0",
-    "svelte": "^5.23.2",
-    "svelte-check": "^4.1.5",
+    "publint": "^0.3.12",
+    "sass": "^1.86.3",
+    "svelte": "^5.27.0",
+    "svelte-check": "^4.1.6",
     "svelte-preprocess": "^6.0.3",
     "tsx": "^4.19.3",
-    "typescript": "^5.8.2",
-    "typescript-eslint": "^8.26.1",
-    "vite": "^6.2.2",
-    "vitest": "^3.0.9"
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.30.1",
+    "vite": "^6.2.6",
+    "vitest": "^3.1.1"
   },
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",
   "dependencies": {
     "@versatiles/style": "^5.6.0",
-    "maplibre-gl": "^5.2.0"
+    "maplibre-gl": "^5.3.1"
   }
 }