@yappkit/front-module-map 0.1.5 → 0.1.7

package/lib/yappkit-map.js

@@ -50,11 +50,14 @@ class N {
       return;
     }
     this.watching.sources = !0;
-    const t = d(() => (e.value || []).map((s) => {
-      const { data: r, ...o } = s;
-      return s.propsId = JSON.stringify(o), s;
-    }), async (s, r) => {
-      const o = r || [], n = s || [], i = n.filter((c, u) => {
+    const t = d(() => (e.value || []).map((r) => {
+      if (!r.propsId) {
+        const { data: s, ...o } = r;
+        r.propsId = JSON.stringify(o);
+      }
+      return r;
+    }), async (r, s) => {
+      const o = s || [], n = r || [], i = n.filter((c, u) => {
         var m;
         return c !== o[u] && c.propsId === ((m = o[u]) == null ? void 0 : m.propsId);
       }), p = n.filter((c, u) => c !== o[u] && !i.find((m) => m.id === c.id)), l = o.filter((c, u) => c !== n[u] && !i.find((m) => m.id === c.id));
@@ -81,8 +84,8 @@ class N {
       return;
     }
     this.watching.layers = !0;
-    const t = d(e, async (s, r) => {
-      const o = r || [], n = s || [], i = n.filter((l, c) => l !== o[c]), p = o.filter((l, c) => l !== n[c]);
+    const t = d(e, async (r, s) => {
+      const o = s || [], n = r || [], i = n.filter((l, c) => l !== o[c]), p = o.filter((l, c) => l !== n[c]);
       for (const l of p)
         this.map.removeLayer(l.id), this.map.getSource(l.id) && this.map.removeSource(l.id);
       await O();
@@ -110,12 +113,12 @@ class A {
   get Map() {
     return w(
       (e, { emit: a, slots: t }) => {
-        const s = f(null), { options: r, layers: o, sources: n } = y(e), i = v(null);
-        return g("mapboxMap", i), this.createMap(s, r.value).then((p) => {
-          i.value = p, d(r, () => {
+        const r = f(null), { options: s, layers: o, sources: n } = y(e), i = v(null);
+        return g("mapboxMap", i), this.createMap(r, s.value).then((p) => {
+          i.value = p, d(s, () => {
             console.error("Cannot update options (missing function similar to deckglMap.setProps()). Use SDK dedicated functions instead");
-          }, { once: !0 }), p.watchSources(n, r.value.watchSourcesOptions), p.watchLayers(o, r.value.watchLayersOptions), a("loaded", p);
-        }), () => M("div", { ref: s }, i.value ? t : []);
+          }, { once: !0 }), p.watchSources(n, s.value.watchSourcesOptions), p.watchLayers(o, s.value.watchLayersOptions), a("loaded", p);
+        }), () => M("div", { ref: r }, i.value ? t : []);
       },
       {
         props: {
@@ -139,11 +142,11 @@ class A {
   get DeckGLOverlay() {
     return w(
       (e, { emit: a, slots: t }) => {
-        const { options: s, layers: r } = y(e), o = L("mapboxMap");
+        const { options: r, layers: s } = y(e), o = L("mapboxMap");
         if (!o || !o.value)
           throw new Error("map should exist");
-        return o.value.setDeckGLOverlay(s.value).then((n) => {
-          n.watchOptions(s, s.value.watchOptionsOptions), n.watchLayers(r, s.value.watchLayersOptions), a("loaded", n);
+        return o.value.setDeckGLOverlay(r.value).then((n) => {
+          n.watchOptions(r, r.value.watchOptionsOptions), n.watchLayers(s, r.value.watchLayersOptions), a("loaded", n);
         }), () => {
         };
       },
@@ -187,11 +190,11 @@ class A {
     };
   }
   async loadMapboxSDK({ services: e = [] } = {}) {
-    const t = (await import("@mapbox/mapbox-sdk")).default({ accessToken: this.apiKey }), s = [.../* @__PURE__ */ new Set([...this.services, ...e])];
-    this.services = s;
-    const r = await Promise.all(this.services.map((o) => this.sdk[o] || this.servicesLoader[o]().then((n) => n.default(t))));
+    const t = (await import("@mapbox/mapbox-sdk")).default({ accessToken: this.apiKey }), r = [.../* @__PURE__ */ new Set([...this.services, ...e])];
+    this.services = r;
+    const s = await Promise.all(this.services.map((o) => this.sdk[o] || this.servicesLoader[o]().then((n) => n.default(t))));
     for (const [o, n] of this.services.entries())
-      this.sdk[n] = r[o];
+      this.sdk[n] = s[o];
   }
   async getSDK(e) {
     let a = {};
@@ -203,31 +206,31 @@ class A {
     return this.sdk;
   }
   async createMap(e, a = {}) {
-    const t = new N(), s = () => {
-      for (const r of t.unwatchFn)
-        r();
+    const t = new N(), r = () => {
+      for (const s of t.unwatchFn)
+        s();
       t.unwatchFn = [], t.map && (t.map.remove(), t.map = null);
     };
-    return new Promise((r, o) => {
+    return new Promise((s, o) => {
       b(async () => {
         await this.loadMapbox();
         const n = () => {
           if (!e.value)
             throw new Error("Missing HTML element");
           const i = d(e, () => {
-            e.value || (s(), i());
+            e.value || (r(), i());
           });
           t.map = new this.mapboxgl.Map({
             container: e.value,
             accessToken: this.apiKey,
             ...a
           }), t.map.on("load", () => {
-            r(t);
+            s(t);
           });
         };
         a.onMounted ? a.onMounted(n) : n();
       }), k(() => {
-        s();
+        r();
       });
     });
   }
@@ -287,15 +290,15 @@ class I {
   }
   _getSetters(e) {
     const a = [], t = { ...Object.getOwnPropertyDescriptors(Object.getPrototypeOf(e)) };
-    for (const [s, r] of Object.entries(t))
-      r.enumerable && a.push(s);
+    for (const [r, s] of Object.entries(t))
+      s.enumerable && a.push(r);
     return a;
   }
   _getOptions(e) {
     const a = {}, t = this._getSetters(e);
-    for (const s of t) {
-      let r = e[s];
-      e[s] instanceof Object && (r = this._getOptions(e[s])), a[s] = r;
+    for (const r of t) {
+      let s = e[r];
+      e[r] instanceof Object && (s = this._getOptions(e[r])), a[r] = s;
     }
     return a;
   }
@@ -320,18 +323,18 @@ class I {
     }
     this.watching.options = !0;
     let t = {};
-    const s = d(e, async () => {
+    const r = d(e, async () => {
       await O();
-      const r = x(e.value);
-      for (const [o, n] of Object.entries(r))
+      const s = x(e.value);
+      for (const [o, n] of Object.entries(s))
         JSON.stringify(n) !== JSON.stringify(t[o]) && (this.map[o] = n);
-      t = structuredClone(r);
+      t = structuredClone(s);
     }, {
       immediate: !0,
       deep: !0,
       ...a
     });
-    this.unwatchFn.push(s);
+    this.unwatchFn.push(r);
   }
   watchLayers(e, a = {}) {
     if (!this.map)
@@ -341,8 +344,8 @@ class I {
       return;
     }
     this.watching.layers = !0;
-    const t = d(e, async (s, r) => {
-      const o = r || [], n = s || [], i = n.filter((l, c) => l !== o[c]), p = o.filter((l, c) => l !== n[c]);
+    const t = d(e, async (r, s) => {
+      const o = s || [], n = r || [], i = n.filter((l, c) => l !== o[c]), p = o.filter((l, c) => l !== n[c]);
       await O();
       for (const l of p)
         this.map.children.namedItem(l.id).remove();
@@ -364,12 +367,12 @@ class S {
   get Map() {
     return w(
       (e, { emit: a, slots: t }) => {
-        const s = f(null), { options: r } = y(e), o = v(null);
-        return g("googleMapsMap", o), this.createMap(s, r.value).then((n) => {
-          o.value = n, d(r, () => {
+        const r = f(null), { options: s } = y(e), o = v(null);
+        return g("googleMapsMap", o), this.createMap(r, s.value).then((n) => {
+          o.value = n, d(s, () => {
             console.error("Cannot update options (missing function similar to deckglMap.setProps()). Use SDK dedicated functions instead");
           }, { once: !0 }), a("loaded", n);
-        }), () => M("div", { ref: s }, o.value ? t : []);
+        }), () => M("div", { ref: r }, o.value ? t : []);
       },
       {
         props: {
@@ -384,11 +387,11 @@ class S {
   }
   get Map3D() {
     return w(
-      (e, { emit: a, attrs: t, slots: s }) => {
-        const r = f(null), { options: o, layers: n } = y(e), i = v(null);
-        return g("googleMapsMap3D", i), this.createMap3D(r, o.value).then((p) => {
+      (e, { emit: a, attrs: t, slots: r }) => {
+        const s = f(null), { options: o, layers: n } = y(e), i = v(null);
+        return g("googleMapsMap3D", i), this.createMap3D(s, o.value).then((p) => {
           i.value = p, p.watchOptions(o, o.value.watchOptionsOptions), p.watchLayers(n, o.value.watchLayersOptions), a("loaded", p);
-        }), () => M("div", { ref: r }, i.value ? s : []);
+        }), () => M("div", { ref: s }, i.value ? r : []);
       },
       {
         props: {
@@ -408,11 +411,11 @@ class S {
   get DeckGLOverlay() {
     return w(
       (e, { emit: a, slots: t }) => {
-        const { options: s, layers: r } = y(e), o = L("googleMapsMap");
+        const { options: r, layers: s } = y(e), o = L("googleMapsMap");
         if (!o || !o.value)
           throw new Error("map should exist");
-        return o.value.setDeckGLOverlay(s.value).then((n) => {
-          n.watchOptions(s, s.value.watchOptionsOptions), n.watchLayers(r, s.value.watchLayersOptions), a("loaded", n);
+        return o.value.setDeckGLOverlay(r.value).then((n) => {
+          n.watchOptions(r, r.value.watchOptionsOptions), n.watchLayers(s, r.value.watchLayersOptions), a("loaded", n);
         }), () => {
         };
       },
@@ -434,15 +437,15 @@ class S {
   get DeckGL3DTileLayer() {
     return w(
       (e, { emit: a, slots: t }) => {
-        const { options: s } = y(e), r = L("deckGLPrependLayers");
-        if (!r || !r.value)
+        const { options: r } = y(e), s = L("deckGLPrependLayers");
+        if (!s || !s.value)
           throw new Error("deckGLPrependLayers should exist");
         const o = f("");
-        this.createDeckGL3DTileLayer(o, s.value).then((i) => {
-          d(s, () => {
+        this.createDeckGL3DTileLayer(o, r.value).then((i) => {
+          d(r, () => {
             console.error("Cannot update options on DeckGL layer. Replace layer instead");
-          }, { once: !0 }), r.value = [
-            ...r.value,
+          }, { once: !0 }), s.value = [
+            ...s.value,
             i
           ];
         });
@@ -464,14 +467,14 @@ class S {
   }
   async loadGoogleMapsSDK({ libraries: e = [] } = {}) {
     const { Loader: a } = await import("@googlemaps/js-api-loader"), t = [.../* @__PURE__ */ new Set([...this.libraries, ...e])];
-    this.libraries.length === t.length && this.libraries.every((r) => t.includes(r)) || console.error("GoogleMaps Loader does not allow loading one library after the other. Set libraries option on a single googleMaps config"), this.libraries = t, this.loader = new a({
+    this.libraries.length === t.length && this.libraries.every((s) => t.includes(s)) || console.error("GoogleMaps Loader does not allow loading one library after the other. Set libraries option on a single googleMaps config"), this.libraries = t, this.loader = new a({
       apiKey: this.apiKey,
       version: this.version,
       libraries: this.libraries
     });
-    const s = await Promise.all(this.libraries.map((r) => this.sdk[r] || this.loader.importLibrary(r)));
-    for (const [r, o] of this.libraries.entries())
-      this.sdk[o] = s[r];
+    const r = await Promise.all(this.libraries.map((s) => this.sdk[s] || this.loader.importLibrary(s)));
+    for (const [s, o] of this.libraries.entries())
+      this.sdk[o] = r[s];
   }
   async getSDK(e) {
     let a = {};
@@ -483,52 +486,52 @@ class S {
     return this.sdk;
   }
   async createMap(e, a = {}) {
-    const t = new V(), s = () => {
-      for (const r of t.unwatchFn)
-        r();
+    const t = new V(), r = () => {
+      for (const s of t.unwatchFn)
+        s();
       t.unwatchFn = [], t.map && (t.map = null);
     };
-    return new Promise((r, o) => {
+    return new Promise((s, o) => {
       b(async () => {
         await this.getSDK("maps");
         const n = () => {
           if (!e.value)
             throw new Error("Missing HTML element");
           const i = d(e, () => {
-            e.value || (s(), i());
+            e.value || (r(), i());
           });
           t.map = new this.sdk.maps.Map(e.value, {
             ...a
-          }), r(t);
+          }), s(t);
         };
         a.onMounted ? a.onMounted(n) : n();
       }), k(() => {
-        s();
+        r();
       });
     });
   }
   async createMap3D(e, a = {}) {
-    const t = new I(), s = () => {
-      for (const r of t.unwatchFn)
-        r();
+    const t = new I(), r = () => {
+      for (const s of t.unwatchFn)
+        s();
       t.unwatchFn = [], t.map && (t.map = null);
     };
-    return new Promise((r, o) => {
+    return new Promise((s, o) => {
       b(async () => {
         await this.getSDK("maps3d");
         const n = () => {
           if (!e.value)
             throw new Error("Missing HTML element");
           const i = d(e, () => {
-            e.value || (s(), i());
+            e.value || (r(), i());
           });
           t.map = new this.sdk.maps3d.Map3DElement({
             ...a
-          }), e.value.appendChild(t.map), r(t);
+          }), e.value.appendChild(t.map), s(t);
         };
         a.onMounted ? a.onMounted(n) : n();
       }), k(() => {
-        s();
+        r();
       });
     });
   }
@@ -548,12 +551,12 @@ class S {
         }
       },
       onTilesetLoad: (t) => {
-        e && (t.options.onTraversalComplete = (s) => {
-          const r = /* @__PURE__ */ new Set();
-          return s.forEach((o) => {
+        e && (t.options.onTraversalComplete = (r) => {
+          const s = /* @__PURE__ */ new Set();
+          return r.forEach((o) => {
             const { copyright: n } = o.content.gltf.asset;
-            n.split(";").forEach(r.add, r), e.value = [...r].join("; ");
-          }), s;
+            n.split(";").forEach(s.add, s), e.value = [...s].join("; ");
+          }), r;
         });
       },
       operation: "terrain+draw",
@@ -605,8 +608,8 @@ class F {
   }
   get Map() {
     return w(
-      (e, { emit: a, attrs: t, slots: s }) => {
-        const r = f(null), { options: o, layers: n } = y(e), i = v(null);
+      (e, { emit: a, attrs: t, slots: r }) => {
+        const s = f(null), { options: o, layers: n } = y(e), i = v(null);
         g("deckGLMap", i);
         const p = v([]);
         g("deckGLPrependLayers", p);
@@ -614,11 +617,11 @@ class F {
           ...p.value,
           ...n.value
         ]);
-        this.createMap(r, o.value).then((u) => {
+        this.createMap(s, o.value).then((u) => {
           i.value = u, u.watchOptions(o, o.value.watchOptionsOptions), u.watchLayers(l, o.value.watchLayersOptions), a("loaded", u);
         });
         const c = f([]);
-        return g("deckGLAppendVNodeFn", c), () => [M("div", { ...t, ref: r }, i.value ? s : []), c.value.map((u) => u())];
+        return g("deckGLAppendVNodeFn", c), () => [M("div", { ...t, ref: s }, i.value ? r : []), c.value.map((u) => u())];
       },
       {
         props: {
@@ -642,28 +645,28 @@ class F {
     }
   }
   async createMap(e, a = {}) {
-    const t = new _(), s = () => {
-      for (const r of t.unwatchFn)
-        r();
+    const t = new _(), r = () => {
+      for (const s of t.unwatchFn)
+        s();
       t.unwatchFn = [], t.map && (t.map.finalize(), t.map = null);
     };
-    return new Promise((r, o) => {
+    return new Promise((s, o) => {
       b(async () => {
         await this.loadDeckGL();
         const n = () => {
           if (!e.value)
             throw new Error("Missing HTML element");
           const i = d(e, () => {
-            e.value || (s(), i());
+            e.value || (r(), i());
           });
           t.deckgl = this.deckgl, t.map = new this.deckgl.Deck({
             parent: e.value,
             ...a
-          }), r(t);
+          }), s(t);
         };
         a.onMounted ? a.onMounted(n) : n();
       }), k(() => {
-        s();
+        r();
       });
     });
   }
@@ -676,16 +679,16 @@ function D(h) {
   });
 }
 function z({ origin: h, destination: e, step: a = 100 }) {
-  const t = K([h, e]), s = P(t), r = [];
-  for (let o = 0; o < s; o += s / a) {
+  const t = K([h, e]), r = P(t), s = [];
+  for (let o = 0; o < r; o += r / a) {
     const n = j(t, o);
-    r.push(n.geometry.coordinates);
+    s.push(n.geometry.coordinates);
   }
-  return r.push(e), t.geometry.coordinates = D(r), t;
+  return s.push(e), t.geometry.coordinates = D(s), t;
 }
 async function H({ origin: h, destination: e, includeBoundaries: a = !1 }) {
-  const t = (await import("./searoute.js")).default, s = t(G(h), G(e));
-  return a && (s.geometry.coordinates.unshift(h), s.geometry.coordinates.push(e)), s.geometry.coordinates = D(s.geometry.coordinates), s;
+  const t = (await import("./searoute.js")).default, r = t(G(h), G(e));
+  return a && (r.geometry.coordinates.unshift(h), r.geometry.coordinates.push(e)), r.geometry.coordinates = D(r.geometry.coordinates), r;
 }
 const R = {
   getAirRoute: z,
@@ -702,15 +705,19 @@ class q {
   constructor(e = {}) {
     this.options = { ...e };
   }
-  install(e) {
-    const a = {};
-    for (const [t, s] of Object.entries(e.config.maps || {})) {
+  install(e, a) {
+    const t = {};
+    for (const [r, s] of Object.entries(e.config.maps || {})) {
       if (!s.type)
         throw new Error("Map type should be defined");
-      const r = U[s.type];
-      r ? a[t] = new r(s) : console.warn(`Map provider: ${s.type} is not supported`);
+      const o = U[s.type];
+      o ? t[r] = new o(s) : console.warn(`Map provider: ${s.type} is not supported`);
     }
-    e.maps = a, e.map = a, this.yAppKit = e;
+    return e.maps = t, e.map = t, this.yAppKit = e, {
+      //   onBeforeSetup,
+      //   onAfterSetup,
+      //   options
+    };
   }
 }
 const W = (h) => new q(h);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yappkit/front-module-map",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "@yappkit/front module for map",
   "module": "./lib/yappkit-map.js",
   "main": "./lib/yappkit-map.js",
@@ -33,14 +33,14 @@
   },
   "dependencies": {},
   "peerDependencies": {
-    "@deck.gl/google-maps": "^8.9.35",
-    "@deck.gl/mapbox": "^8.9.35",
-    "@googlemaps/js-api-loader": "^1.16.6",
-    "@mapbox/mapbox-sdk": "^0.15.3",
-    "@turf/turf": "^6.5.0",
-    "deck.gl": "^8.9.35",
+    "@deck.gl/google-maps": "^9.0.36",
+    "@deck.gl/mapbox": "^9.0.36",
+    "@googlemaps/js-api-loader": "^1.16.8",
+    "@mapbox/mapbox-sdk": "^0.16.1",
+    "@turf/turf": "^7.1.0",
+    "deck.gl": "^9.0.36",
     "geojson-path-finder": "2.0.2",
-    "maplibre-gl": "^4.1.0",
-    "vue": "^3.4.21"
+    "maplibre-gl": "^4.7.1",
+    "vue": "^3.5.13"
   }
 }