vue-maplibre-gl - npm Package Compare versions

Comparing version 5.3.3 to 5.3.4

dist/types/components/index.d.ts

@@ -10,3 +10,2 @@ export { default as MglMap } from './map.component';
 export { default as MglStyleSwitchControl } from './controls/styleSwitch.control';
-export { default as MglDrawControl } from './controls/draw.control';
 export { default as MglButton } from './button.component';
@@ -13,0 +12,0 @@ export { default as MglMarker } from './marker.component';

dist/types/plugins/draw/index.d.ts

@@ -6,1 +6,2 @@ export * from './plugin';
 export * from './types';
+export { default as MglDrawControl } from './draw.control';

dist/vue-maplibre-gl-draw.js

 /*!
-* vue-maplibre-gl v5.3.3
+* vue-maplibre-gl v5.3.4
 * (c) 2025 Volker Nauruhn
 * @license MIT
 */
-import { C as e, a as r, b as s, D as d, P as i } from "./plugin-CLGuBXZ9.js";
+var Pe = Object.defineProperty;
+var Se = (t, o, e) => o in t ? Pe(t, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[o] = e;
+var b = (t, o, e) => Se(t, typeof o != "symbol" ? o + "" : o, e);
+import { t as fe, b as Ae, h as te, m as Le, f as Ee, M as $, B as q } from "./button.component-DHk7NkrP.js";
+import "maplibre-gl";
+import "geojson";
+import { defineComponent as ke, inject as ie, reactive as De, watch as G, onBeforeUnmount as Te, h as H } from "vue";
+var L = 63710088e-1, Oe = {
+  centimeters: L * 100,
+  centimetres: L * 100,
+  degrees: 360 / (2 * Math.PI),
+  feet: L * 3.28084,
+  inches: L * 39.37,
+  kilometers: L / 1e3,
+  kilometres: L / 1e3,
+  meters: L,
+  metres: L,
+  miles: L / 1609.344,
+  millimeters: L * 1e3,
+  millimetres: L * 1e3,
+  nauticalmiles: L / 1852,
+  radians: 1,
+  yards: L * 1.0936
+};
+function K(t, o, e = {}) {
+  const i = { type: "Feature" };
+  return (e.id === 0 || e.id) && (i.id = e.id), e.bbox && (i.bbox = e.bbox), i.properties = o || {}, i.geometry = t, i;
+}
+function Ve(t, o, e = {}) {
+  if (!t)
+    throw new Error("coordinates is required");
+  if (!Array.isArray(t))
+    throw new Error("coordinates must be an Array");
+  if (t.length < 2)
+    throw new Error("coordinates must be at least 2 numbers long");
+  if (!re(t[0]) || !re(t[1]))
+    throw new Error("coordinates must contain numbers");
+  return K({
+    type: "Point",
+    coordinates: t
+  }, o, e);
+}
+function xe(t, o, e = {}) {
+  for (const n of t) {
+    if (n.length < 4)
+      throw new Error(
+        "Each LinearRing of a Polygon must have 4 or more Positions."
+      );
+    if (n[n.length - 1].length !== n[0].length)
+      throw new Error("First and last Position are not equivalent.");
+    for (let r = 0; r < n[n.length - 1].length; r++)
+      if (n[n.length - 1][r] !== n[0][r])
+        throw new Error("First and last Position are not equivalent.");
+  }
+  return K({
+    type: "Polygon",
+    coordinates: t
+  }, o, e);
+}
+function ze(t, o = "kilometers") {
+  const e = Oe[o];
+  if (!e)
+    throw new Error(o + " units is invalid");
+  return t / e;
+}
+function oe(t) {
+  return t % (2 * Math.PI) * 180 / Math.PI;
+}
+function Y(t) {
+  return t % 360 * Math.PI / 180;
+}
+function re(t) {
+  return !isNaN(t) && t !== null && !Array.isArray(t);
+}
+function Ie(t) {
+  return t !== null && typeof t == "object" && !Array.isArray(t);
+}
+function de(t, o, e) {
+  if (t !== null)
+    for (var i, n, r, s, a, c, u, p = 0, l = 0, h, f = t.type, g = f === "FeatureCollection", m = f === "Feature", y = g ? t.features.length : 1, d = 0; d < y; d++) {
+      u = g ? t.features[d].geometry : m ? t.geometry : t, h = u ? u.type === "GeometryCollection" : !1, a = h ? u.geometries.length : 1;
+      for (var v = 0; v < a; v++) {
+        var w = 0, M = 0;
+        if (s = h ? u.geometries[v] : u, s !== null) {
+          c = s.coordinates;
+          var _ = s.type;
+          switch (p = 0, _) {
+            case null:
+              break;
+            case "Point":
+              if (o(
+                c,
+                l,
+                d,
+                w,
+                M
+              ) === !1)
+                return !1;
+              l++, w++;
+              break;
+            case "LineString":
+            case "MultiPoint":
+              for (i = 0; i < c.length; i++) {
+                if (o(
+                  c[i],
+                  l,
+                  d,
+                  w,
+                  M
+                ) === !1)
+                  return !1;
+                l++, _ === "MultiPoint" && w++;
+              }
+              _ === "LineString" && w++;
+              break;
+            case "Polygon":
+            case "MultiLineString":
+              for (i = 0; i < c.length; i++) {
+                for (n = 0; n < c[i].length - p; n++) {
+                  if (o(
+                    c[i][n],
+                    l,
+                    d,
+                    w,
+                    M
+                  ) === !1)
+                    return !1;
+                  l++;
+                }
+                _ === "MultiLineString" && w++, _ === "Polygon" && M++;
+              }
+              _ === "Polygon" && w++;
+              break;
+            case "MultiPolygon":
+              for (i = 0; i < c.length; i++) {
+                for (M = 0, n = 0; n < c[i].length; n++) {
+                  for (r = 0; r < c[i][n].length - p; r++) {
+                    if (o(
+                      c[i][n][r],
+                      l,
+                      d,
+                      w,
+                      M
+                    ) === !1)
+                      return !1;
+                    l++;
+                  }
+                  M++;
+                }
+                w++;
+              }
+              break;
+            case "GeometryCollection":
+              for (i = 0; i < s.geometries.length; i++)
+                if (de(s.geometries[i], o) === !1)
+                  return !1;
+              break;
+            default:
+              throw new Error("Unknown Geometry Type");
+          }
+        }
+      }
+    }
+}
+function me(t, o) {
+  var e, i, n, r, s, a, c, u, p, l, h = 0, f = t.type === "FeatureCollection", g = t.type === "Feature", m = f ? t.features.length : 1;
+  for (e = 0; e < m; e++) {
+    for (a = f ? t.features[e].geometry : g ? t.geometry : t, u = f ? t.features[e].properties : g ? t.properties : {}, p = f ? t.features[e].bbox : g ? t.bbox : void 0, l = f ? t.features[e].id : g ? t.id : void 0, c = a ? a.type === "GeometryCollection" : !1, s = c ? a.geometries.length : 1, n = 0; n < s; n++) {
+      if (r = c ? a.geometries[n] : a, r === null) {
+        if (o(
+          null,
+          h,
+          u,
+          p,
+          l
+        ) === !1)
+          return !1;
+        continue;
+      }
+      switch (r.type) {
+        case "Point":
+        case "LineString":
+        case "MultiPoint":
+        case "Polygon":
+        case "MultiLineString":
+        case "MultiPolygon": {
+          if (o(
+            r,
+            h,
+            u,
+            p,
+            l
+          ) === !1)
+            return !1;
+          break;
+        }
+        case "GeometryCollection": {
+          for (i = 0; i < r.geometries.length; i++)
+            if (o(
+              r.geometries[i],
+              h,
+              u,
+              p,
+              l
+            ) === !1)
+              return !1;
+          break;
+        }
+        default:
+          throw new Error("Unknown Geometry Type");
+      }
+    }
+    h++;
+  }
+}
+function Re(t, o, e) {
+  var i = e;
+  return me(
+    t,
+    function(n, r, s, a, c) {
+      i = o(
+        i,
+        n,
+        r,
+        s,
+        a,
+        c
+      );
+    }
+  ), i;
+}
+function Ue(t) {
+  return Re(
+    t,
+    (o, e) => o + Fe(e),
+    0
+  );
+}
+function Fe(t) {
+  let o = 0, e;
+  switch (t.type) {
+    case "Polygon":
+      return ne(t.coordinates);
+    case "MultiPolygon":
+      for (e = 0; e < t.coordinates.length; e++)
+        o += ne(t.coordinates[e]);
+      return o;
+    case "Point":
+    case "MultiPoint":
+    case "LineString":
+    case "MultiLineString":
+      return 0;
+  }
+  return 0;
+}
+function ne(t) {
+  let o = 0;
+  if (t && t.length > 0) {
+    o += Math.abs(se(t[0]));
+    for (let e = 1; e < t.length; e++)
+      o -= Math.abs(se(t[e]));
+  }
+  return o;
+}
+var Ge = L * L / 2, W = Math.PI / 180;
+function se(t) {
+  const o = t.length - 1;
+  if (o <= 2) return 0;
+  let e = 0, i = 0;
+  for (; i < o; ) {
+    const n = t[i], r = t[i + 1 === o ? 0 : i + 1], s = t[i + 2 >= o ? (i + 2) % o : i + 2], a = n[0] * W, c = r[1] * W, u = s[0] * W;
+    e += (u - a) * Math.sin(c), i++;
+  }
+  return e * Ge;
+}
+var He = Ue;
+function ge(t) {
+  if (!t)
+    throw new Error("coord is required");
+  if (!Array.isArray(t)) {
+    if (t.type === "Feature" && t.geometry !== null && t.geometry.type === "Point")
+      return [...t.geometry.coordinates];
+    if (t.type === "Point")
+      return [...t.coordinates];
+  }
+  if (Array.isArray(t) && t.length >= 2 && !Array.isArray(t[0]) && !Array.isArray(t[1]))
+    return [...t];
+  throw new Error("coord must be GeoJSON Point or an Array of numbers");
+}
+function N(t) {
+  if (Array.isArray(t))
+    return t;
+  if (t.type === "Feature") {
+    if (t.geometry !== null)
+      return t.geometry.coordinates;
+  } else if (t.coordinates)
+    return t.coordinates;
+  throw new Error(
+    "coords must be GeoJSON Feature, Geometry Object or an Array"
+  );
+}
+function Ne(t) {
+  return t.type === "Feature" ? t.geometry : t;
+}
+function Be(t, o) {
+  return t.type === "FeatureCollection" ? "FeatureCollection" : t.type === "GeometryCollection" ? "GeometryCollection" : t.type === "Feature" && t.geometry !== null ? t.geometry.type : t.type;
+}
+function $e(t, o, e, i = {}) {
+  const n = ge(t), r = Y(n[0]), s = Y(n[1]), a = Y(e), c = ze(o, i.units), u = Math.asin(
+    Math.sin(s) * Math.cos(c) + Math.cos(s) * Math.sin(c) * Math.cos(a)
+  ), p = r + Math.atan2(
+    Math.sin(a) * Math.sin(c) * Math.cos(s),
+    Math.cos(c) - Math.sin(s) * Math.sin(u)
+  ), l = oe(p), h = oe(u);
+  return Ve([l, h], i.properties);
+}
+function qe(t, o, e = {}) {
+  const i = e.steps || 64, n = e.properties ? e.properties : !Array.isArray(t) && t.type === "Feature" && t.properties ? t.properties : {}, r = [];
+  for (let s = 0; s < i; s++)
+    r.push(
+      $e(t, o, s * -360 / i, e).geometry.coordinates
+    );
+  return r.push(r[0]), xe([r], n);
+}
+var Ye = qe;
+class j {
+  constructor(o, e, i) {
+    b(this, "earthRadius", 6371e3);
+    b(this, "plugin");
+    b(this, "map");
+    b(this, "source");
+    b(this, "collection");
+    this.plugin = o, this.map = e, this.source = i;
+  }
+  getPolygon() {
+    return this.collection.features[0];
+  }
+  clonePolygon() {
+    return this.getPolygon().geometry.coordinates[0].map((o) => [o[0], o[1]]);
+  }
+  isNearby(o, e, i) {
+    const n = i ? this.plugin.options.pointerPrecision.touch : this.plugin.options.pointerPrecision.mouse, r = this.map.project(o), s = Math.sqrt((e.x - r.x) ** 2 + (e.y - r.y) ** 2);
+    return console.log("isTouch", i, n, s, s <= n), s <= n;
+  }
+  getMidpoint(o, e) {
+    return [(o[0] + e[0]) / 2, (o[1] + e[1]) / 2];
+  }
+  clear() {
+    this.source.setData({ type: "FeatureCollection", features: [] });
+  }
+  render() {
+    var o;
+    if (this.plugin.options.minArea.size && ((o = this.collection) != null && o.features[0])) {
+      const e = this.getAreaSize(this.collection.features[0]);
+      this.collection.features[0].properties.area = e, this.collection.features[0].properties.tooSmall = e < this.plugin.options.minArea.size;
+    }
+    this.source.setData(this.collection ?? { type: "FeatureCollection", features: [] });
+  }
+  emitOnUpdate(o) {
+    var e, i, n, r;
+    o ? (i = (e = this.plugin.options).onUpdate) == null || i.call(e, o) : this.collection && ((r = (n = this.plugin.options).onUpdate) == null || r.call(n, this.collection.features[0]));
+  }
+  createCircle(o, e, i = 64) {
+    const n = Ye(o, e, { units: "degrees", steps: i, properties: { center: o, radius: e, meta: "circle" } });
+    return n.properties.area = this.getAreaSize(n), n.properties.tooSmall = n.properties.area < (this.plugin.options.minArea.size ?? -1), n;
+  }
+  // returns m²
+  getAreaSize(o) {
+    if (o.properties.meta === "circle" && o.properties.radius) {
+      const e = o.properties.radius * (Math.PI / 180) * this.earthRadius;
+      return Math.PI * Math.pow(e, 2);
+    }
+    return He(o);
+  }
+  isTouchEvent(o) {
+    return o.originalEvent instanceof TouchEvent;
+  }
+}
+const I = 11102230246251565e-32, S = 134217729, We = (3 + 8 * I) * I;
+function X(t, o, e, i, n) {
+  let r, s, a, c, u = o[0], p = i[0], l = 0, h = 0;
+  p > u == p > -u ? (r = u, u = o[++l]) : (r = p, p = i[++h]);
+  let f = 0;
+  if (l < t && h < e)
+    for (p > u == p > -u ? (s = u + r, a = r - (s - u), u = o[++l]) : (s = p + r, a = r - (s - p), p = i[++h]), r = s, a !== 0 && (n[f++] = a); l < t && h < e; )
+      p > u == p > -u ? (s = r + u, c = s - r, a = r - (s - c) + (u - c), u = o[++l]) : (s = r + p, c = s - r, a = r - (s - c) + (p - c), p = i[++h]), r = s, a !== 0 && (n[f++] = a);
+  for (; l < t; )
+    s = r + u, c = s - r, a = r - (s - c) + (u - c), u = o[++l], r = s, a !== 0 && (n[f++] = a);
+  for (; h < e; )
+    s = r + p, c = s - r, a = r - (s - c) + (p - c), p = i[++h], r = s, a !== 0 && (n[f++] = a);
+  return (r !== 0 || f === 0) && (n[f++] = r), f;
+}
+function Xe(t, o) {
+  let e = o[0];
+  for (let i = 1; i < t; i++) e += o[i];
+  return e;
+}
+function F(t) {
+  return new Float64Array(t);
+}
+const Je = (3 + 16 * I) * I, Ze = (2 + 12 * I) * I, Qe = (9 + 64 * I) * I * I, R = F(4), ae = F(8), le = F(12), ce = F(16), A = F(4);
+function Ke(t, o, e, i, n, r, s) {
+  let a, c, u, p, l, h, f, g, m, y, d, v, w, M, _, C, k, P;
+  const D = t - n, T = e - n, O = o - r, V = i - r;
+  M = D * V, h = S * D, f = h - (h - D), g = D - f, h = S * V, m = h - (h - V), y = V - m, _ = g * y - (M - f * m - g * m - f * y), C = O * T, h = S * O, f = h - (h - O), g = O - f, h = S * T, m = h - (h - T), y = T - m, k = g * y - (C - f * m - g * m - f * y), d = _ - k, l = _ - d, R[0] = _ - (d + l) + (l - k), v = M + d, l = v - M, w = M - (v - l) + (d - l), d = w - C, l = w - d, R[1] = w - (d + l) + (l - C), P = v + d, l = P - v, R[2] = v - (P - l) + (d - l), R[3] = P;
+  let z = Xe(4, R), U = Ze * s;
+  if (z >= U || -z >= U || (l = t - D, a = t - (D + l) + (l - n), l = e - T, u = e - (T + l) + (l - n), l = o - O, c = o - (O + l) + (l - r), l = i - V, p = i - (V + l) + (l - r), a === 0 && c === 0 && u === 0 && p === 0) || (U = Qe * s + We * Math.abs(z), z += D * p + V * a - (O * u + T * c), z >= U || -z >= U)) return z;
+  M = a * V, h = S * a, f = h - (h - a), g = a - f, h = S * V, m = h - (h - V), y = V - m, _ = g * y - (M - f * m - g * m - f * y), C = c * T, h = S * c, f = h - (h - c), g = c - f, h = S * T, m = h - (h - T), y = T - m, k = g * y - (C - f * m - g * m - f * y), d = _ - k, l = _ - d, A[0] = _ - (d + l) + (l - k), v = M + d, l = v - M, w = M - (v - l) + (d - l), d = w - C, l = w - d, A[1] = w - (d + l) + (l - C), P = v + d, l = P - v, A[2] = v - (P - l) + (d - l), A[3] = P;
+  const _e = X(4, R, 4, A, ae);
+  M = D * p, h = S * D, f = h - (h - D), g = D - f, h = S * p, m = h - (h - p), y = p - m, _ = g * y - (M - f * m - g * m - f * y), C = O * u, h = S * O, f = h - (h - O), g = O - f, h = S * u, m = h - (h - u), y = u - m, k = g * y - (C - f * m - g * m - f * y), d = _ - k, l = _ - d, A[0] = _ - (d + l) + (l - k), v = M + d, l = v - M, w = M - (v - l) + (d - l), d = w - C, l = w - d, A[1] = w - (d + l) + (l - C), P = v + d, l = P - v, A[2] = v - (P - l) + (d - l), A[3] = P;
+  const be = X(_e, ae, 4, A, le);
+  M = a * p, h = S * a, f = h - (h - a), g = a - f, h = S * p, m = h - (h - p), y = p - m, _ = g * y - (M - f * m - g * m - f * y), C = c * u, h = S * c, f = h - (h - c), g = c - f, h = S * u, m = h - (h - u), y = u - m, k = g * y - (C - f * m - g * m - f * y), d = _ - k, l = _ - d, A[0] = _ - (d + l) + (l - k), v = M + d, l = v - M, w = M - (v - l) + (d - l), d = w - C, l = w - d, A[1] = w - (d + l) + (l - C), P = v + d, l = P - v, A[2] = v - (P - l) + (d - l), A[3] = P;
+  const Ce = X(be, le, 4, A, ce);
+  return ce[Ce - 1];
+}
+function je(t, o, e, i, n, r) {
+  const s = (o - r) * (e - n), a = (t - n) * (i - r), c = s - a, u = Math.abs(s + a);
+  return Math.abs(c) >= Je * u ? c : -Ke(t, o, e, i, n, r, u);
+}
+function et(t, o) {
+  var e, i, n = 0, r, s, a, c, u, p, l, h = t[0], f = t[1], g = o.length;
+  for (e = 0; e < g; e++) {
+    i = 0;
+    var m = o[e], y = m.length - 1;
+    if (p = m[0], p[0] !== m[y][0] && p[1] !== m[y][1])
+      throw new Error("First and last coordinates in a ring must be the same");
+    for (s = p[0] - h, a = p[1] - f, i; i < y; i++) {
+      if (l = m[i + 1], c = l[0] - h, u = l[1] - f, a === 0 && u === 0) {
+        if (c <= 0 && s >= 0 || s <= 0 && c >= 0)
+          return 0;
+      } else if (u >= 0 && a <= 0 || u <= 0 && a >= 0) {
+        if (r = je(s, c, a, u, 0, 0), r === 0)
+          return 0;
+        (r > 0 && u > 0 && a <= 0 || r < 0 && u <= 0 && a > 0) && n++;
+      }
+      p = l, a = u, s = c;
+    }
+  }
+  return n % 2 !== 0;
+}
+function tt(t, o, e = {}) {
+  if (!t)
+    throw new Error("point is required");
+  if (!o)
+    throw new Error("polygon is required");
+  const i = ge(t), n = Ne(o), r = n.type, s = o.bbox;
+  let a = n.coordinates;
+  if (s && it(i, s) === !1)
+    return !1;
+  r === "Polygon" && (a = [a]);
+  let c = !1;
+  for (var u = 0; u < a.length; ++u) {
+    const p = et(i, a[u]);
+    if (p === 0) return !e.ignoreBoundary;
+    p && (c = !0);
+  }
+  return c;
+}
+function it(t, o) {
+  return o[0] <= t[0] && o[1] <= t[1] && o[2] >= t[0] && o[3] >= t[1];
+}
+var ye = tt;
+class ot extends j {
+  constructor(e, i, n, r) {
+    super(e, i, n);
+    b(this, "_mode");
+    b(this, "_moveStart");
+    b(this, "_resizeAnker");
+    this.onClick = this.onClick.bind(this), this.onMouseMove = fe(this.onMouseMove.bind(this), 16), this.onMouseDown = this.onMouseDown.bind(this), this.onMouseUp = this.onMouseUp.bind(this), this.setModel(r);
+  }
+  onClick(e) {
+    if (this._mode)
+      return;
+    const i = e.lngLat.toArray(), n = this.map.unproject([e.point.x + 1, e.point.y]), r = Math.abs(n.lng - e.lngLat.lng) * 50, s = this.createCircle(i, r);
+    this.createFeatureCollection(s), this.generateVertices(), this.render(), this.emitOnUpdate();
+  }
+  onMouseDown(e) {
+    var n;
+    if (!((n = this.collection) != null && n.features.length))
+      return;
+    for (let r = 0, s = this.collection.features[1].geometry.coordinates.length; r < s; r++)
+      if (this.isNearby(this.collection.features[1].geometry.coordinates[r], e.point, this.isTouchEvent(e))) {
+        e.preventDefault(), this._resizeAnker = r, this._mode = "resize";
+        return;
+      }
+    const i = this.getPolygon();
+    ye(e.lngLat.toArray(), i) && (e.preventDefault(), this._moveStart = { polygon: this.clonePolygon(), point: [...i.properties.center], start: e.lngLat }, this._mode = "move");
+  }
+  onMouseMove(e) {
+    var n;
+    if (!this._mode || !((n = this.collection) != null && n.features.length))
+      return;
+    let i;
+    switch (this._mode) {
+      case "move":
+        if (!this._moveStart)
+          return;
+        e.preventDefault(), i = this.getPolygon();
+        const r = e.lngLat.lat - this._moveStart.start.lat, s = e.lngLat.lng - this._moveStart.start.lng;
+        for (let c = 0, u = i.geometry.coordinates[0].length; c < u; c++)
+          i.geometry.coordinates[0][c][1] = this._moveStart.polygon[c][1] + r, i.geometry.coordinates[0][c][0] = this._moveStart.polygon[c][0] + s;
+        i.properties.center[1] = this._moveStart.point[1] + r, i.properties.center[0] = this._moveStart.point[0] + s, this.generateVertices(), this.render();
+        break;
+      case "resize":
+        if (!this._resizeAnker)
+          return;
+        e.preventDefault(), i = this.getPolygon();
+        let a;
+        switch (this._resizeAnker) {
+          case 0:
+          case 2:
+            a = Math.abs(i.properties.center[1] - e.lngLat.lat);
+            break;
+          case 1:
+          case 3:
+            a = Math.abs(i.properties.center[0] - e.lngLat.lng) * Math.cos(e.lngLat.lat * Math.PI / 180);
+            break;
+        }
+        i.geometry.coordinates[0] = this.createCircle(i.properties.center, a).geometry.coordinates[0], i.properties.radius = a, this.generateVertices(), this.render();
+        break;
+    }
+  }
+  onMouseUp(e) {
+    if (this._mode)
+      switch (this._mode) {
+        case "move":
+        case "resize":
+          e.preventDefault(), this._mode = void 0, this._moveStart = void 0, this._resizeAnker = void 0, this.emitOnUpdate();
+          break;
+      }
+  }
+  generateVertices() {
+    if (!this.collection)
+      return;
+    const e = this.getPolygon(), i = this.createCircle(e.properties.center, e.properties.radius, 4);
+    this.collection.features[1].geometry.coordinates = i.geometry.coordinates[0].slice(0, -1);
+  }
+  createFeatureCollection(e) {
+    this.collection = {
+      type: "FeatureCollection",
+      features: [
+        e,
+        {
+          type: "Feature",
+          geometry: {
+            type: "MultiPoint",
+            coordinates: []
+          },
+          properties: { meta: "vertex" }
+        }
+      ]
+    };
+  }
+  register() {
+    this.map.on("click", this.onClick), this.map.on("mousemove", this.onMouseMove), this.map.on("mousedown", this.onMouseDown), this.map.on("mouseup", this.onMouseUp), this.map.on("touchstart", this.onMouseDown), this.map.on("touchmove", this.onMouseMove), this.map.on("touchend", this.onMouseUp);
+  }
+  unregister() {
+    this.map.off("click", this.onClick), this.map.off("mousemove", this.onMouseMove), this.map.off("mousedown", this.onMouseDown), this.map.off("mouseup", this.onMouseUp), this.map.off("touchstart", this.onMouseDown), this.map.off("touchmove", this.onMouseMove), this.map.off("touchend", this.onMouseUp);
+  }
+  setModel(e) {
+    var i;
+    ((i = e == null ? void 0 : e.properties) == null ? void 0 : i.meta) === "circle" ? (this.createFeatureCollection(e), this.generateVertices()) : this.collection = void 0, this.render();
+  }
+}
+class rt extends j {
+  constructor(e, i, n, r) {
+    super(e, i, n);
+    b(this, "_model");
+    b(this, "_container", document.createElement("div"));
+    b(this, "_circle");
+    this.onViewportChange = this.onViewportChange.bind(this), this._model = r, this._container.classList.add("maplibregl-draw-circle-mode"), this._circle = document.createElement("div"), this._circle.classList.add("maplibregl-draw-circle-mode-circle"), this._circle.innerHTML = `<svg class="maplibre-draw-min-area-pattern" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
+    <defs>
+        <pattern id="maplibre-draw-min-area-pattern" patternUnits="userSpaceOnUse" width="4.5" height="4.5" patternTransform="rotate(135)">
+            <line x1="0" y="0" x2="0" y2="4.5" stroke="currentColor" stroke-width="1" />
+        </pattern>
+    </defs>
+    <rect width="100%" height="100%" fill="url(#maplibre-draw-min-area-pattern)" :opacity="1" />
+</svg>`, this._container.appendChild(this._circle), this.setPadding();
+  }
+  onViewportChange() {
+    this._model = this.viewportToModel(), this.emitOnUpdate(this._model), this._model.properties.tooSmall ? this._circle.classList.add("maplibregl-draw-circle-too-small") : this._circle.classList.remove("maplibregl-draw-circle-too-small");
+  }
+  viewportToModel() {
+    const e = this._container.offsetLeft + this._circle.offsetLeft, i = this._container.offsetTop + this._circle.offsetTop, n = this.map.unproject([Math.round(e + this._circle.offsetWidth / 2), Math.round(i + this._circle.offsetHeight / 2)]), r = this.map.unproject([e, i]), s = Math.abs(r.lat - n.lat), a = n.toArray();
+    return this.createCircle(a, s);
+  }
+  register() {
+    this.map.getCanvasContainer().appendChild(this._container), this.map.on("dragend", this.onViewportChange), this.map.on("zoomend", this.onViewportChange);
+  }
+  unregister() {
+    this.map.getCanvasContainer().removeChild(this._container), this.map.off("dragend", this.onViewportChange), this.map.off("zoomend", this.onViewportChange);
+  }
+  setModel(e) {
+    (e == null ? void 0 : e.properties.meta) === "circle" ? this._model = this.createCircle(e.properties.center, e.properties.radius) : this._model = void 0;
+  }
+  setPadding() {
+    var i;
+    const e = (i = this.plugin.options.fitBoundsOptions) == null ? void 0 : i.padding;
+    switch (typeof e) {
+      case "number":
+        this._container.style.setProperty("--padding", `${e}px`);
+        break;
+      case "object":
+        let n;
+        for (n in e)
+          typeof e[n] == "number" && this._container.style.setProperty(`--padding-${n}`, `${e[n]}px`);
+        break;
+    }
+  }
+}
+function nt(t, o = {}) {
+  var e = typeof o == "object" ? o.mutate : o;
+  if (!t) throw new Error("geojson is required");
+  var i = Be(t), n = [];
+  switch (i) {
+    case "LineString":
+      n = J(t, i);
+      break;
+    case "MultiLineString":
+    case "Polygon":
+      N(t).forEach(function(s) {
+        n.push(J(s, i));
+      });
+      break;
+    case "MultiPolygon":
+      N(t).forEach(function(s) {
+        var a = [];
+        s.forEach(function(c) {
+          a.push(J(c, i));
+        }), n.push(a);
+      });
+      break;
+    case "Point":
+      return t;
+    case "MultiPoint":
+      var r = {};
+      N(t).forEach(function(s) {
+        var a = s.join("-");
+        Object.prototype.hasOwnProperty.call(r, a) || (n.push(s), r[a] = !0);
+      });
+      break;
+    default:
+      throw new Error(i + " geometry not supported");
+  }
+  return t.coordinates ? e === !0 ? (t.coordinates = n, t) : { type: i, coordinates: n } : e === !0 ? (t.geometry.coordinates = n, t) : K({ type: i, coordinates: n }, t.properties, {
+    bbox: t.bbox,
+    id: t.id
+  });
+}
+function J(t, o) {
+  var e = N(t);
+  if (e.length === 2 && !he(e[0], e[1])) return e;
+  var i = [], n = e.length - 1, r = i.length;
+  i.push(e[0]);
+  for (var s = 1; s < n; s++) {
+    var a = i[i.length - 1];
+    e[s][0] === a[0] && e[s][1] === a[1] || (i.push(e[s]), r = i.length, r > 2 && ue(
+      i[r - 3],
+      i[r - 1],
+      i[r - 2]
+    ) && i.splice(i.length - 2, 1));
+  }
+  if (i.push(e[e.length - 1]), r = i.length, (o === "Polygon" || o === "MultiPolygon") && he(e[0], e[e.length - 1]) && r < 4)
+    throw new Error("invalid polygon");
+  return o === "LineString" && r < 3 || ue(
+    i[r - 3],
+    i[r - 1],
+    i[r - 2]
+  ) && i.splice(i.length - 2, 1), i;
+}
+function he(t, o) {
+  return t[0] === o[0] && t[1] === o[1];
+}
+function ue(t, o, e) {
+  var i = e[0], n = e[1], r = t[0], s = t[1], a = o[0], c = o[1], u = i - r, p = n - s, l = a - r, h = c - s, f = u * h - p * l;
+  return f !== 0 ? !1 : Math.abs(l) >= Math.abs(h) ? l > 0 ? r <= i && i <= a : a <= i && i <= r : h > 0 ? s <= n && n <= c : c <= n && n <= s;
+}
+function st(t) {
+  if (!t)
+    throw new Error("geojson is required");
+  switch (t.type) {
+    case "Feature":
+      return ve(t);
+    case "FeatureCollection":
+      return at(t);
+    case "Point":
+    case "LineString":
+    case "Polygon":
+    case "MultiPoint":
+    case "MultiLineString":
+    case "MultiPolygon":
+    case "GeometryCollection":
+      return ee(t);
+    default:
+      throw new Error("unknown GeoJSON type");
+  }
+}
+function ve(t) {
+  const o = { type: "Feature" };
+  return Object.keys(t).forEach((e) => {
+    switch (e) {
+      case "type":
+      case "properties":
+      case "geometry":
+        return;
+      default:
+        o[e] = t[e];
+    }
+  }), o.properties = Me(t.properties), t.geometry == null ? o.geometry = null : o.geometry = ee(t.geometry), o;
+}
+function Me(t) {
+  const o = {};
+  return t && Object.keys(t).forEach((e) => {
+    const i = t[e];
+    typeof i == "object" ? i === null ? o[e] = null : Array.isArray(i) ? o[e] = i.map((n) => n) : o[e] = Me(i) : o[e] = i;
+  }), o;
+}
+function at(t) {
+  const o = { type: "FeatureCollection" };
+  return Object.keys(t).forEach((e) => {
+    switch (e) {
+      case "type":
+      case "features":
+        return;
+      default:
+        o[e] = t[e];
+    }
+  }), o.features = t.features.map((e) => ve(e)), o;
+}
+function ee(t) {
+  const o = { type: t.type };
+  return t.bbox && (o.bbox = t.bbox), t.type === "GeometryCollection" ? (o.geometries = t.geometries.map((e) => ee(e)), o) : (o.coordinates = we(t.coordinates), o);
+}
+function we(t) {
+  const o = t;
+  return typeof o[0] != "object" ? o.slice() : o.map((e) => we(e));
+}
+function lt(t, o) {
+  var e = t[0] - o[0], i = t[1] - o[1];
+  return e * e + i * i;
+}
+function ct(t, o, e) {
+  var i = o[0], n = o[1], r = e[0] - i, s = e[1] - n;
+  if (r !== 0 || s !== 0) {
+    var a = ((t[0] - i) * r + (t[1] - n) * s) / (r * r + s * s);
+    a > 1 ? (i = e[0], n = e[1]) : a > 0 && (i += r * a, n += s * a);
+  }
+  return r = t[0] - i, s = t[1] - n, r * r + s * s;
+}
+function ht(t, o) {
+  for (var e = t[0], i = [e], n, r = 1, s = t.length; r < s; r++)
+    n = t[r], lt(n, e) > o && (i.push(n), e = n);
+  return e !== n && i.push(n), i;
+}
+function Z(t, o, e, i, n) {
+  for (var r = i, s, a = o + 1; a < e; a++) {
+    var c = ct(t[a], t[o], t[e]);
+    c > r && (s = a, r = c);
+  }
+  r > i && (s - o > 1 && Z(t, o, s, i, n), n.push(t[s]), e - s > 1 && Z(t, s, e, i, n));
+}
+function ut(t, o) {
+  var e = t.length - 1, i = [t[0]];
+  return Z(t, 0, e, o, i), i.push(t[e]), i;
+}
+function B(t, o, e) {
+  if (t.length <= 2) return t;
+  var i = o !== void 0 ? o * o : 1;
+  return t = e ? t : ht(t, i), t = ut(t, i), t;
+}
+function pt(t, o = {}) {
+  var e, i, n;
+  if (o = o ?? {}, !Ie(o)) throw new Error("options is invalid");
+  const r = (e = o.tolerance) != null ? e : 1, s = (i = o.highQuality) != null ? i : !1, a = (n = o.mutate) != null ? n : !1;
+  if (!t) throw new Error("geojson is required");
+  if (r && r < 0) throw new Error("invalid tolerance");
+  return a !== !0 && (t = st(t)), me(t, function(c) {
+    ft(c, r, s);
+  }), t;
+}
+function ft(t, o, e) {
+  const i = t.type;
+  if (i === "Point" || i === "MultiPoint") return t;
+  if (nt(t, { mutate: !0 }), i !== "GeometryCollection")
+    switch (i) {
+      case "LineString":
+        t.coordinates = B(
+          t.coordinates,
+          o,
+          e
+        );
+        break;
+      case "MultiLineString":
+        t.coordinates = t.coordinates.map(
+          (n) => B(n, o, e)
+        );
+        break;
+      case "Polygon":
+        t.coordinates = pe(
+          t.coordinates,
+          o,
+          e
+        );
+        break;
+      case "MultiPolygon":
+        t.coordinates = t.coordinates.map(
+          (n) => pe(n, o, e)
+        );
+    }
+  return t;
+}
+function pe(t, o, e) {
+  return t.map(function(i) {
+    if (i.length < 4)
+      throw new Error("invalid polygon");
+    let n = o, r = B(i, n, e);
+    for (; !dt(r); )
+      n -= n * 0.01, r = B(i, n, e);
+    return (r[r.length - 1][0] !== r[0][0] || r[r.length - 1][1] !== r[0][1]) && r.push(r[0]), r;
+  });
+}
+function dt(t) {
+  return t.length < 3 ? !1 : !(t.length === 3 && t[2][0] === t[0][0] && t[2][1] === t[0][1]);
+}
+var mt = pt;
+class gt extends j {
+  constructor(e, i, n, r) {
+    super(e, i, n);
+    b(this, "_mode");
+    b(this, "_hasHelperVertex", !0);
+    b(this, "_moveStart");
+    this.onClick = this.onClick.bind(this), this.onDoubleClick = this.onDoubleClick.bind(this), this.onMouseMove = fe(this.onMouseMove.bind(this), 16), this.onMouseDown = this.onMouseDown.bind(this), this.onMouseUp = this.onMouseUp.bind(this), this.setModel(r);
+  }
+  onClick(e) {
+    const i = e.lngLat.toArray();
+    switch (this._mode) {
+      case "create":
+        const n = this.getPolygon();
+        if (this.isNearby(n.geometry.coordinates[0][0], e.point, this.isTouchEvent(e))) {
+          this.getPolygon().geometry.coordinates[0].splice(1, 1), this.endCreation();
+          return;
+        }
+        n.geometry.coordinates[0].splice(1, 0, i), this.collection.features[1].geometry.coordinates[1] = i;
+        const r = n.geometry.coordinates[0].length, s = r - 2;
+        this._hasHelperVertex && r === 5 && (n.geometry.coordinates[0].splice(s, 1), this._hasHelperVertex = !1);
+        break;
+      default:
+        if (e.originalEvent.ctrlKey && this.collection) {
+          e.preventDefault();
+          const a = this.getPolygon(), c = a.geometry.coordinates[0].length;
+          if (c < 5)
+            return;
+          for (let u = 0; u < c; u++)
+            if (this.isNearby(a.geometry.coordinates[0][u], e.point, this.isTouchEvent(e))) {
+              a.geometry.coordinates[0].splice(u, 1), u === 0 && (a.geometry.coordinates[0].splice(-1, 1), a.geometry.coordinates[0].push(a.geometry.coordinates[0][0])), this.generateCollectionWithVertexes(), this.source.setData(this.collection);
+              return;
+            }
+        }
+        this._hasHelperVertex = !0, this.createFeatureCollection({
+          type: "Feature",
+          geometry: {
+            type: "Polygon",
+            coordinates: [[i, i, i, i]]
+          },
+          properties: { meta: "polygon" }
+        }), this.collection.features[1].geometry.coordinates = [i, i], this._mode = "create";
+    }
+    this.render();
+  }
+  onDoubleClick(e) {
+    if (!(!this._mode || !this.collection))
+      switch (this._mode) {
+        case "create":
+          e.preventDefault(), this.endCreation();
+          break;
+      }
+  }
+  onMouseMove(e) {
+    var r;
+    if (!this._mode || !((r = this.collection) != null && r.features.length))
+      return;
+    let i, n;
+    switch (this._mode) {
+      case "create":
+        e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
+        const s = i.geometry.coordinates[0].length, a = s - 2;
+        if (i.geometry.coordinates[0][1] = n, this._hasHelperVertex) {
+          const p = this.map.unproject([e.point.x + 1, e.point.y]), l = Math.abs((p.lng - n[0]) / 3);
+          i.geometry.coordinates[0][a] = this.calculateB(n, i.geometry.coordinates[0][0], l);
+        }
+        this.render();
+        break;
+      case "move":
+        if (!this._moveStart)
+          return;
+        e.preventDefault(), i = this.getPolygon();
+        const c = e.lngLat.lng - this._moveStart.start.lng, u = e.lngLat.lat - this._moveStart.start.lat;
+        for (let p = 0, l = i.geometry.coordinates[0].length; p < l; p++)
+          i.geometry.coordinates[0][p][0] = this._moveStart.polygon[p][0] + c, i.geometry.coordinates[0][p][1] = this._moveStart.polygon[p][1] + u;
+        this.generateCollectionWithVertexes(), this.render();
+        break;
+      case "move_vertex":
+        if (!this._moveStart)
+          return;
+        e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
+        for (let p = 0, l = i.geometry.coordinates[0].length; p < l; p++)
+          if (this._moveStart.polygon[p][0] === this._moveStart.point[0] && this._moveStart.polygon[p][1] === this._moveStart.point[1]) {
+            i.geometry.coordinates[0][p] = n, p === 0 && (i.geometry.coordinates[0][i.geometry.coordinates[0].length - 1] = n);
+            break;
+          }
+        this.generateCollectionWithVertexes(), this.render();
+        break;
+      case "add_vertex":
+        if (!this._moveStart)
+          return;
+        e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
+        for (let p = 0, l = i.geometry.coordinates[0].length; p < l - 1; p++) {
+          const h = this.getMidpoint(i.geometry.coordinates[0][p], i.geometry.coordinates[0][p + 1]);
+          if (h[0] === this._moveStart.point[0] && h[1] === this._moveStart.point[1]) {
+            i.geometry.coordinates[0].splice(p + 1, 0, h), this._moveStart = {
+              polygon: this.clonePolygon(),
+              point: h,
+              start: e.lngLat
+            }, this._mode = "move_vertex";
+            break;
+          }
+        }
+        this.generateCollectionWithVertexes(), this.render();
+        break;
+    }
+  }
+  onMouseDown(e) {
+    var n;
+    if (this._mode === "create" || !((n = this.collection) != null && n.features.length))
+      return;
+    for (let r = 0, s = this.collection.features[1].geometry.coordinates.length; r < s; r++)
+      if (this.isNearby(this.collection.features[1].geometry.coordinates[r], e.point, this.isTouchEvent(e))) {
+        e.preventDefault(), this._moveStart = {
+          polygon: this.clonePolygon(),
+          point: this.collection.features[1].geometry.coordinates[r],
+          start: e.lngLat
+        }, this._mode = "move_vertex";
+        return;
+      }
+    for (let r = 0, s = this.collection.features[2].geometry.coordinates.length; r < s; r++)
+      if (this.isNearby(this.collection.features[2].geometry.coordinates[r], e.point, this.isTouchEvent(e))) {
+        e.preventDefault(), this._moveStart = {
+          polygon: this.clonePolygon(),
+          point: this.collection.features[2].geometry.coordinates[r],
+          start: e.lngLat
+        }, this._mode = "add_vertex";
+        return;
+      }
+    const i = this.getPolygon();
+    ye(e.lngLat.toArray(), i) && (e.preventDefault(), this._moveStart = { polygon: this.clonePolygon(), start: e.lngLat }, this._mode = "move");
+  }
+  onMouseUp(e) {
+    if (this._mode)
+      switch (this._mode) {
+        case "move":
+        case "move_vertex":
+        case "add_vertex":
+          e.preventDefault(), this._mode = void 0, this._moveStart = void 0, this.emitOnUpdate();
+          break;
+      }
+  }
+  register() {
+    this.map.on("click", this.onClick), this.map.on("dblclick", this.onDoubleClick), this.map.on("mousemove", this.onMouseMove), this.map.on("mousedown", this.onMouseDown), this.map.on("mouseup", this.onMouseUp), this.map.on("touchstart", this.onMouseDown), this.map.on("touchmove", this.onMouseMove), this.map.on("touchend", this.onMouseUp);
+  }
+  unregister() {
+    this.map.off("click", this.onClick), this.map.off("dblclick", this.onDoubleClick), this.map.off("mousemove", this.onMouseMove), this.map.off("mousedown", this.onMouseDown), this.map.off("mouseup", this.onMouseUp), this.map.off("touchstart", this.onMouseDown), this.map.off("touchmove", this.onMouseMove), this.map.off("touchend", this.onMouseUp);
+  }
+  setModel(e) {
+    var i;
+    ((i = e == null ? void 0 : e.properties) == null ? void 0 : i.meta) === "polygon" ? (this.createFeatureCollection(e), this.generateCollectionWithVertexes()) : this.collection = void 0, this.render();
+  }
+  createFeatureCollection(e) {
+    this.collection = {
+      type: "FeatureCollection",
+      features: [
+        e,
+        {
+          type: "Feature",
+          geometry: {
+            type: "MultiPoint",
+            coordinates: []
+          },
+          properties: { meta: "vertex" }
+        },
+        {
+          type: "Feature",
+          geometry: {
+            type: "MultiPoint",
+            coordinates: []
+          },
+          properties: { meta: "midpoint" }
+        }
+      ]
+    };
+  }
+  endCreation() {
+    const e = this.getPolygon();
+    this._mode = void 0, this.collection.features[0] = mt(e, { tolerance: 1e-5, highQuality: !0 }), this.generateCollectionWithVertexes(), this.render(), this.emitOnUpdate();
+  }
+  generateCollectionWithVertexes() {
+    if (!this.collection)
+      return;
+    const e = this.getPolygon(), i = e.geometry.coordinates[0].length;
+    this.collection.features[1].geometry.coordinates = e.geometry.coordinates[0].slice(0, -1);
+    const n = new Array(i - 1);
+    for (let r = 0; r < i - 1; r++)
+      n[r] = this.getMidpoint(e.geometry.coordinates[0][r], e.geometry.coordinates[0][r + 1]);
+    this.collection.features[2].geometry.coordinates = n;
+  }
+  calculateB(e, i, n) {
+    const r = e[0] - i[0], s = e[1] - i[1], a = Math.sqrt(r * r + s * s), c = i[0] + n * (-s / a), u = i[1] + n * (r / a);
+    return [c, u];
+  }
+}
+const yt = [
+  // ACTIVE (being drawn)
+  // line stroke
+  {
+    id: "gl-draw-line",
+    type: "line",
+    filter: ["all", ["==", "$type", "LineString"], ["!=", "mode", "static"]],
+    layout: {
+      "line-cap": "round",
+      "line-join": "round"
+    },
+    paint: {
+      "line-color": "#e74b3c",
+      "line-dasharray": [0.2, 2],
+      "line-width": 2
+    }
+  },
+  // polygon fill
+  {
+    id: "gl-draw-polygon-fill",
+    type: "fill",
+    filter: ["all", ["==", "$type", "Polygon"], ["!=", "mode", "static"]],
+    paint: {
+      "fill-color": "#3c99e7",
+      "fill-outline-color": "#3c99e7",
+      "fill-opacity": 0.1
+    }
+  },
+  // polygon fill below min area size
+  {
+    id: "gl-draw-polygon-fill-below-min-area-size",
+    type: "fill",
+    filter: ["all", ["==", "$type", "Polygon"], ["==", "tooSmall", !0]],
+    paint: {
+      "fill-pattern": "maplibre-draw-min-area-pattern"
+    }
+  },
+  // polygon mid points
+  {
+    id: "gl-draw-polygon-midpoint",
+    type: "circle",
+    filter: [
+      "all",
+      ["==", "$type", "Point"],
+      ["==", "meta", "midpoint"]
+    ],
+    paint: {
+      "circle-radius": 4,
+      "circle-color": "#e74b3c"
+    }
+  },
+  // polygon outline stroke
+  // This doesn't style the first edge of the polygon, which uses the line stroke styling instead
+  {
+    id: "gl-draw-polygon-stroke-active",
+    type: "line",
+    filter: ["all", ["==", "$type", "Polygon"], ["!=", "mode", "static"]],
+    layout: {
+      "line-cap": "round",
+      "line-join": "round"
+    },
+    paint: {
+      "line-color": "#e74b3c",
+      "line-dasharray": [0.2, 2],
+      "line-width": 2
+    }
+  },
+  // vertex point halos
+  {
+    id: "gl-draw-polygon-and-line-vertex-halo-active",
+    type: "circle",
+    filter: ["all", ["==", "meta", "vertex"], ["==", "$type", "Point"], ["!=", "mode", "static"]],
+    paint: {
+      "circle-radius": 8,
+      "circle-color": "#FFF"
+    }
+  },
+  // vertex points
+  {
+    id: "gl-draw-polygon-and-line-vertex-active",
+    type: "circle",
+    filter: ["all", ["==", "meta", "vertex"], ["==", "$type", "Point"], ["!=", "mode", "static"]],
+    paint: {
+      "circle-radius": 5,
+      "circle-color": "#e74b3c"
+    }
+  },
+  // INACTIVE (static, already drawn)
+  // line stroke
+  {
+    id: "gl-draw-line-static",
+    type: "line",
+    filter: ["all", ["==", "$type", "LineString"], ["==", "mode", "static"]],
+    layout: {
+      "line-cap": "round",
+      "line-join": "round"
+    },
+    paint: {
+      "line-color": "#000",
+      "line-width": 3
+    }
+  },
+  // polygon fill
+  {
+    id: "gl-draw-polygon-fill-static",
+    type: "fill",
+    filter: ["all", ["==", "$type", "Polygon"], ["==", "mode", "static"]],
+    paint: {
+      "fill-color": "#000",
+      "fill-outline-color": "#000",
+      "fill-opacity": 0.1
+    }
+  },
+  // polygon outline
+  {
+    id: "gl-draw-polygon-stroke-static",
+    type: "line",
+    filter: ["all", ["==", "$type", "Polygon"], ["==", "mode", "static"]],
+    layout: {
+      "line-cap": "round",
+      "line-join": "round"
+    },
+    paint: {
+      "line-color": "#000",
+      "line-width": 3
+    }
+  }
+];
+var E = /* @__PURE__ */ ((t) => (t.POLYGON = "POLYGON", t.CIRCLE = "CIRCLE", t.CIRCLE_STATIC = "CIRCLE_STATIC", t))(E || {});
+function vt(t, o = {}) {
+  if (t.bbox != null && o.recompute !== !0)
+    return t.bbox;
+  const e = [1 / 0, 1 / 0, -1 / 0, -1 / 0];
+  return de(t, (i) => {
+    e[0] > i[0] && (e[0] = i[0]), e[1] > i[1] && (e[1] = i[1]), e[2] < i[0] && (e[2] = i[0]), e[3] < i[1] && (e[3] = i[1]);
+  }), e;
+}
+var Mt = vt;
+const x = class x {
+  constructor(o, e, i = {}) {
+    b(this, "map");
+    b(this, "_model");
+    b(this, "_mode");
+    b(this, "_modeInstance");
+    b(this, "_source");
+    b(this, "options");
+    this.map = o, this._model = e, this._mode = i.mode ?? E.POLYGON, this.options = {
+      ...i,
+      styles: i.styles ?? yt,
+      zoomOnUpdate: !0,
+      minArea: i.minArea ?? {},
+      pointerPrecision: {
+        mouse: 24,
+        touch: 36,
+        ...i.pointerPrecision || {}
+      }
+    }, this.setup = this.setup.bind(this), this.zoomToModel = this.zoomToModel.bind(this), this.map.once("load", this.setup);
+  }
+  get mode() {
+    return this._mode;
+  }
+  setMode(o, e) {
+    this._model = e, this._mode !== o && (this._mode = o, this.setupMode());
+  }
+  setupMode() {
+    var o;
+    switch (this._modeInstance && (this._modeInstance.unregister(), this._modeInstance.clear()), this._mode) {
+      case E.POLYGON:
+        this._modeInstance = new gt(this, this.map, this._source, this._model);
+        break;
+      case E.CIRCLE:
+        this._modeInstance = new ot(this, this.map, this._source, this._model);
+        break;
+      case E.CIRCLE_STATIC:
+        this._modeInstance = new rt(this, this.map, this._source, this._model);
+        break;
+      default:
+        throw new Error(`Unsupported mode "${this._mode}"`);
+    }
+    this.zoomToModel(), (o = this._modeInstance) == null || o.register();
+  }
+  setupMap() {
+    this.map.addSource(x.SOURCE_ID, { type: "geojson", data: { type: "FeatureCollection", features: [] } }), this._source = this.map.getSource(x.SOURCE_ID), this.setupStyles(), this.map.on("resize", this.zoomToModel);
+  }
+  setupStyles() {
+    for (let o = 0, e = this.options.styles.length; o < e; o++)
+      this.map.addLayer({ ...this.options.styles[o], source: x.SOURCE_ID });
+  }
+  setStyles(o) {
+    this.removeStyles(), this.options.styles = o, this.setupStyles();
+  }
+  setOnUpdate(o) {
+    this.options.onUpdate = o;
+  }
+  setModel(o) {
+    var e;
+    this._model = o, (e = this._modeInstance) == null || e.setModel(o), o && this.options.zoomOnUpdate && this.zoomToModel();
+  }
+  setMinAreaSize(o) {
+    this.options.minArea.size = o, o && this.setMinAreaSizePattern();
+  }
+  setMinAreaColor(o) {
+    this.options.minArea.color = o, this.options.minArea.size && this.setMinAreaSizePattern();
+  }
+  zoomToModel() {
+    this._model && this.map.fitBounds(Mt(this._model), this.options.fitBoundsOptions);
+  }
+  removeStyles() {
+    for (let o = 0, e = this.options.styles.length; o < e; o++)
+      this.map.removeLayer(this.options.styles[o].id);
+  }
+  setup() {
+    this.setupMap(), this.setupMode(), this.options.minArea.size && this.setMinAreaSizePattern();
+  }
+  setMinAreaSizePattern() {
+    const o = document.createElement("canvas"), e = o.getContext("2d", { antialias: !0 }), i = window.devicePixelRatio || 1, n = 12 * i, r = n, s = n, a = 16 * i;
+    o.width = r, o.height = s, e.fillStyle = this.options.minArea.color || "#e74b3c", e.translate(r / 2, s / 2), e.rotate(Math.PI / 2), e.translate(-r / 2, -s / 2), e.beginPath(), e.moveTo(0, s * (1 / a)), e.lineTo(r * (1 / a), 0), e.lineTo(0, 0), e.lineTo(0, s * (1 / a)), e.fill(), e.beginPath(), e.moveTo(r, s * (1 / a)), e.lineTo(r * (1 / a), s), e.lineTo(0, s), e.lineTo(0, s * ((a - 1) / a)), e.lineTo(r * ((a - 1) / a), 0), e.lineTo(r, 0), e.lineTo(r, s * (1 / a)), e.fill(), e.beginPath(), e.moveTo(r, s * ((a - 1) / a)), e.lineTo(r * ((a - 1) / a), s), e.lineTo(r, s), e.lineTo(r, s * ((a - 1) / a)), e.fill();
+    const c = e.getImageData(0, 0, r, s);
+    this.map.hasImage(x.MIN_AREA_PATTERN_ID) ? this.map.updateImage(x.MIN_AREA_PATTERN_ID, c) : this.map.addImage(x.MIN_AREA_PATTERN_ID, c, { pixelRatio: 2 * i });
+  }
+  dispose() {
+    var o, e;
+    (o = this._modeInstance) == null || o.unregister(), this.map.off("resize", this.zoomToModel);
+    try {
+      (e = this.map) == null || e.removeSource(x.SOURCE_ID);
+    } catch {
+    }
+  }
+};
+b(x, "SOURCE_ID", "mgl-draw-plugin"), b(x, "MIN_AREA_PATTERN_ID", "maplibre-draw-min-area-pattern");
+let Q = x;
+const St = /* @__PURE__ */ ke({
+  name: "MglDrawControl",
+  components: { MglCustomControl: te },
+  props: {
+    position: { type: String, default: Ae.TOP_RIGHT },
+    model: { type: Object },
+    mode: { type: String, default: E.POLYGON },
+    defaultMode: { type: String, default: E.POLYGON },
+    zoomOnUpdate: { type: Boolean, default: !0 },
+    minAreaSize: { type: Number },
+    minAreaColor: { type: String },
+    pointerPrecision: { type: Object }
+  },
+  emits: ["update:mode", "update:model"],
+  slots: Object,
+  setup(t, { emit: o, slots: e }) {
+    const i = ie(Le), n = ie(Ee), r = De(new Q(i.value, t.model, {
+      mode: t.mode,
+      zoomOnUpdate: t.zoomOnUpdate,
+      pointerPrecision: t.pointerPrecision,
+      minArea: {
+        size: t.minAreaSize,
+        color: t.minAreaColor
+      },
+      fitBoundsOptions: n,
+      onUpdate: (a) => o("update:model", a)
+    }));
+    function s(a) {
+      r.mode === a ? r.setMode(t.defaultMode, t.model) : r.setMode(a, t.model), o("update:mode", a);
+    }
+    return G(() => t.mode, () => t.mode !== r.mode && s(t.mode)), G(() => t.model, () => r.setModel(t.model)), G(() => t.minAreaSize, () => r.setMinAreaSize(t.minAreaSize)), G(() => t.minAreaColor, () => r.setMinAreaColor(t.minAreaColor)), Te(() => r.dispose()), () => H(
+      te,
+      { position: t.position },
+      () => e.buttons ? e.buttons({ mode: r.mode, setMode: s }) : [
+        H($, {
+          type: q.MDI,
+          path: "M17,15.7V13H19V17L10,21L3,14L7,5H11V7H8.3L5.4,13.6L10.4,18.6L17,15.7M22,5V7H19V10H17V7H14V5H17V2H19V5H22Z",
+          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-polygon", r.mode === E.POLYGON ? "is-active" : void 0],
+          onClick: () => s(E.POLYGON)
+        }),
+        H($, {
+          type: q.MDI,
+          path: "M11,19A6,6 0 0,0 17,13H19A8,8 0 0,1 11,21A8,8 0 0,1 3,13A8,8 0 0,1 11,5V7A6,6 0 0,0 5,13A6,6 0 0,0 11,19M19,5H22V7H19V10H17V7H14V5H17V2H19V5Z",
+          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-circle", r.mode === E.CIRCLE ? "is-active" : void 0],
+          onClick: () => s(E.CIRCLE)
+        }),
+        H($, {
+          type: q.MDI,
+          path: "M3.05,13H1V11H3.05C3.5,6.83 6.83,3.5 11,3.05V1H13V3.05C17.17,3.5 20.5,6.83 20.95,11H23V13H20.95C20.5,17.17 17.17,20.5 13,20.95V23H11V20.95C6.83,20.5 3.5,17.17 3.05,13M12,5A7,7 0 0,0 5,12A7,7 0 0,0 12,19A7,7 0 0,0 19,12A7,7 0 0,0 12,5Z",
+          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-circle-static", r.mode === E.CIRCLE_STATIC ? "is-active" : void 0],
+          onClick: () => s(E.CIRCLE_STATIC)
+        })
+      ]
+    );
+  }
+});
 export {
-  e as CircleMode,
-  r as CircleStaticMode,
-  s as DrawMode,
-  d as DrawPlugin,
-  i as PolygonMode
+  ot as CircleMode,
+  rt as CircleStaticMode,
+  E as DrawMode,
+  Q as DrawPlugin,
+  St as MglDrawControl,
+  gt as PolygonMode
 };
 //# sourceMappingURL=vue-maplibre-gl-draw.js.map

dist/vue-maplibre-gl.js

 /*!
-* vue-maplibre-gl v5.3.3
+* vue-maplibre-gl v5.3.4
 * (c) 2025 Volker Nauruhn
 * @license MIT
 */
-var Se = Object.defineProperty;
-var be = (e, a, o) => a in e ? Se(e, a, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[a] = o;
-var v = (e, a, o) => be(e, typeof a != "symbol" ? a + "" : a, o);
-import { reactive as J, defineComponent as p, markRaw as se, getCurrentInstance as w, shallowRef as te, ref as k, provide as T, watch as c, onMounted as ve, onBeforeUnmount as E, h as R, unref as X, nextTick as oe, inject as g, createCommentVNode as O, Teleport as ce, warn as me, createTextVNode as ue, isRef as Z } from "vue";
-import { d as Ae, b as _, D as Oe } from "./plugin-CLGuBXZ9.js";
-import { Map as Le, AttributionControl as Re, FullscreenControl as Ce, GeolocateControl as Me, NavigationControl as Ee, ScaleControl as Ne, Marker as xe } from "maplibre-gl";
-import Ie from "mitt";
-const s = J({
+var de = Object.defineProperty;
+var ce = (e, a, o) => a in e ? de(e, a, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[a] = o;
+var A = (e, a, o) => ce(e, typeof a != "symbol" ? a + "" : a, o);
+import { reactive as q, defineComponent as p, markRaw as te, getCurrentInstance as P, shallowRef as Y, ref as _, provide as I, watch as c, onMounted as me, onBeforeUnmount as C, h as H, unref as G, nextTick as re, inject as g, createCommentVNode as O, Teleport as fe, createTextVNode as ae, isRef as F, warn as ge } from "vue";
+import { m as x, i as W, a as T, c as J, s as Q, e as X, f as he, d as ye, u as B, P as z, b as Z, C as pe, M as K, B as oe, g as ie, A as k, h as Se } from "./button.component-DHk7NkrP.js";
+import { j as vt } from "./button.component-DHk7NkrP.js";
+import { Map as ve, AttributionControl as be, FullscreenControl as Ae, GeolocateControl as Re, NavigationControl as Oe, ScaleControl as Ee, Marker as Le } from "maplibre-gl";
+import Me from "mitt";
+const l = q({
   style: "https://demotiles.maplibre.org/style.json",
@@ -19,8 +20,8 @@ center: [0, 0],
 });
-class I {
+class N {
   static createEventHandler(a, o, n, t) {
-    return (r = {}) => n.emit(t, { type: r.type, map: o, component: a, event: r });
+    return (s = {}) => n.emit(t, { type: s.type, map: o, component: a, event: s });
   }
 }
-v(I, "MAP_OPTION_KEYS", [
+A(N, "MAP_OPTION_KEYS", [
   "attributionControl",
@@ -76,3 +77,3 @@ "bearing",
   "mapStyle"
-]), v(I, "MARKER_OPTION_KEYS", [
+]), A(N, "MARKER_OPTION_KEYS", [
   "element",
@@ -88,3 +89,3 @@ "offset",
   "scale"
-]), v(I, "MAP_EVENT_TYPES", [
+]), A(N, "MAP_EVENT_TYPES", [
   "boxzoomcancel",
@@ -143,20 +144,13 @@ "boxzoomend",
 ]);
-const K = /* @__PURE__ */ new Map(), fe = Symbol("default");
-function At(e = fe) {
-  let a = K.get(e);
-  return a || (a = J({ isLoaded: !1, isMounted: !1, language: null }), K.set(e, a)), a;
+const U = /* @__PURE__ */ new Map(), le = Symbol("default");
+function ht(e = le) {
+  let a = U.get(e);
+  return a || (a = q({ isLoaded: !1, isMounted: !1, language: null }), U.set(e, a)), a;
 }
-function Te(e, a, o = fe) {
+function Ne(e, a, o = le) {
   var t;
-  let n = K.get(o);
-  return n || (n = J({ isLoaded: !1, isMounted: !1, language: null }), K.set(o, n)), n.component = e, n.map = a.value, n.isLoaded = ((t = a.value) == null ? void 0 : t.loaded()) || !1, n.isMounted = !1, n;
+  let n = U.get(o);
+  return n || (n = q({ isLoaded: !1, isMounted: !1, language: null }), U.set(o, n)), n.component = e, n.map = a.value, n.isLoaded = ((t = a.value) == null ? void 0 : t.loaded()) || !1, n.isMounted = !1, n;
 }
-const N = Symbol("map"), Q = Symbol("isLoaded"), P = Symbol("isInitialized"), ne = Symbol("componentId"), ie = Symbol("sourceId"), ge = Symbol("sourceLayerRegistry"), re = Symbol("emitter"), ye = Symbol("fitBoundsOptions");
-function Ot(e) {
-  return Object.keys(e);
-}
-function F(e) {
-  return Object.keys(e);
-}
-const he = {
+const se = {
   /**
@@ -255,52 +249,52 @@ * AUTO mode uses the language of the browser
 };
-new Set(Object.values(he));
-new Set(Object.values(he));
-function ee(e, a) {
-  const o = e.getStyle().layers, n = /^\s*{\s*name\s*(:\s*(\S*))?\s*}$/, t = /^\s*name\s*(:\s*(\S*))?\s*$/, r = /^\s*{\s*name\s*(:\s*(\S*))?\s*}(\s*){\s*name\s*(:\s*(\S*))?\s*}$/, u = /^(.*)({\s*name\s*(:\s*(\S*))?\s*})(.*)$/, f = a ? `name:${a}` : "name", y = [
+new Set(Object.values(se));
+new Set(Object.values(se));
+function $(e, a) {
+  const o = e.getStyle().layers, n = /^\s*{\s*name\s*(:\s*(\S*))?\s*}$/, t = /^\s*name\s*(:\s*(\S*))?\s*$/, s = /^\s*{\s*name\s*(:\s*(\S*))?\s*}(\s*){\s*name\s*(:\s*(\S*))?\s*}$/, h = /^(.*)({\s*name\s*(:\s*(\S*))?\s*})(.*)$/, S = a ? `name:${a}` : "name", m = [
     "case",
-    ["has", f],
-    ["get", f],
+    ["has", S],
+    ["get", S],
     ["get", "name"]
   ];
-  for (let A = 0; A < o.length; A += 1) {
-    const h = o[A], C = h.layout;
-    if (!C || !C["text-field"])
+  for (let b = 0; b < o.length; b += 1) {
+    const f = o[b], E = f.layout;
+    if (!E || !E["text-field"])
       continue;
-    const m = e.getLayoutProperty(h.id, "text-field");
-    let L;
-    if (Array.isArray(m) && m.length >= 2 && m[0].trim().toLowerCase() === "concat") {
-      const S = m.slice();
-      for (let d = 0; d < m.length; d += 1) {
-        const i = m[d];
-        if ((typeof i == "string" || i instanceof String) && n.exec(i.toString())) {
-          S[d] = y;
+    const d = e.getLayoutProperty(f.id, "text-field");
+    let R;
+    if (Array.isArray(d) && d.length >= 2 && d[0].trim().toLowerCase() === "concat") {
+      const y = d.slice();
+      for (let u = 0; u < d.length; u += 1) {
+        const r = d[u];
+        if ((typeof r == "string" || r instanceof String) && n.exec(r.toString())) {
+          y[u] = m;
           break;
-        } else if (Array.isArray(i) && i.length >= 2 && i[0].trim().toLowerCase() === "get" && t.exec(i[1].toString())) {
-          S[d] = y;
+        } else if (Array.isArray(r) && r.length >= 2 && r[0].trim().toLowerCase() === "get" && t.exec(r[1].toString())) {
+          y[u] = m;
           break;
-        } else if (Array.isArray(i) && i.length === 4 && i[0].trim().toLowerCase() === "case") {
-          S[d] = y;
+        } else if (Array.isArray(r) && r.length === 4 && r[0].trim().toLowerCase() === "case") {
+          y[u] = m;
           break;
         }
       }
-      e.setLayoutProperty(h.id, "text-field", S);
-    } else if (Array.isArray(m) && m.length >= 2 && m[0].trim().toLowerCase() === "get" && t.exec(m[1].toString())) {
-      const S = y;
-      e.setLayoutProperty(h.id, "text-field", S);
-    } else if ((typeof m == "string" || m instanceof String) && n.exec(m.toString())) {
-      const S = y;
-      e.setLayoutProperty(h.id, "text-field", S);
-    } else if (Array.isArray(m) && m.length === 4 && m[0].trim().toLowerCase() === "case") {
-      const S = y;
-      e.setLayoutProperty(h.id, "text-field", S);
-    } else if ((typeof m == "string" || m instanceof String) && (L = r.exec(m.toString())) !== null) {
-      const S = `{${f}}${L[3]}{name${L[4] || ""}}`;
-      e.setLayoutProperty(h.id, "text-field", S);
-    } else if ((typeof m == "string" || m instanceof String) && (L = u.exec(m.toString())) !== null) {
-      const S = `${L[1]}{${f}}${L[5]}`;
-      e.setLayoutProperty(h.id, "text-field", S);
+      e.setLayoutProperty(f.id, "text-field", y);
+    } else if (Array.isArray(d) && d.length >= 2 && d[0].trim().toLowerCase() === "get" && t.exec(d[1].toString())) {
+      const y = m;
+      e.setLayoutProperty(f.id, "text-field", y);
+    } else if ((typeof d == "string" || d instanceof String) && n.exec(d.toString())) {
+      const y = m;
+      e.setLayoutProperty(f.id, "text-field", y);
+    } else if (Array.isArray(d) && d.length === 4 && d[0].trim().toLowerCase() === "case") {
+      const y = m;
+      e.setLayoutProperty(f.id, "text-field", y);
+    } else if ((typeof d == "string" || d instanceof String) && (R = s.exec(d.toString())) !== null) {
+      const y = `{${S}}${R[3]}{name${R[4] || ""}}`;
+      e.setLayoutProperty(f.id, "text-field", y);
+    } else if ((typeof d == "string" || d instanceof String) && (R = h.exec(d.toString())) !== null) {
+      const y = `${R[1]}{${S}}${R[5]}`;
+      e.setLayoutProperty(f.id, "text-field", y);
     }
   }
 }
-const we = /* @__PURE__ */ p({
+const Ce = /* @__PURE__ */ p({
   name: "MglMap",
@@ -310,61 +304,61 @@ props: {
     height: { type: [Number, String], default: "100%" },
-    attributionControl: { type: [Boolean, Object], default: () => s.attributionControl },
-    bearing: { type: Number, default: () => s.bearing },
-    bearingSnap: { type: Number, default: () => s.bearingSnap },
-    bounds: { type: [Array, Object], default: () => s.bounds },
-    boxZoom: { type: Boolean, default: () => s.boxZoom },
+    attributionControl: { type: [Boolean, Object], default: () => l.attributionControl },
+    bearing: { type: Number, default: () => l.bearing },
+    bearingSnap: { type: Number, default: () => l.bearingSnap },
+    bounds: { type: [Array, Object], default: () => l.bounds },
+    boxZoom: { type: Boolean, default: () => l.boxZoom },
     cancelPendingTileRequestsWhileZooming: {
       type: Boolean,
-      default: () => s.cancelPendingTileRequestsWhileZooming
+      default: () => l.cancelPendingTileRequestsWhileZooming
     },
-    canvasContextAttributes: { type: Object, default: () => s.canvasContextAttributes },
-    center: { type: [Array, Object], default: () => s.center },
-    centerClampedToGround: { type: Boolean, default: () => s.centerClampedToGround },
-    clickTolerance: { type: Number, default: () => s.clickTolerance },
-    collectResourceTiming: { type: Boolean, default: () => s.collectResourceTiming },
-    cooperativeGestures: { type: [Boolean, Object], default: () => s.cooperativeGestures },
-    crossSourceCollisions: { type: Boolean, default: () => s.crossSourceCollisions },
-    doubleClickZoom: { type: Boolean, default: () => s.doubleClickZoom },
-    dragPan: { type: Boolean, default: () => s.dragPan },
-    dragRotate: { type: Boolean, default: () => s.dragRotate },
-    elevation: { type: Number, default: () => s.elevation },
-    fadeDuration: { type: Number, default: () => s.fadeDuration },
-    fitBoundsOptions: { type: Object, default: () => s.fitBoundsOptions },
-    hash: { type: [Boolean, String], default: () => s.hash },
-    interactive: { type: Boolean, default: () => s.interactive },
-    keyboard: { type: Boolean, default: () => s.keyboard },
-    language: { type: String, default: () => s.language || null },
-    locale: { type: Object, default: () => s.locale },
+    canvasContextAttributes: { type: Object, default: () => l.canvasContextAttributes },
+    center: { type: [Array, Object], default: () => l.center },
+    centerClampedToGround: { type: Boolean, default: () => l.centerClampedToGround },
+    clickTolerance: { type: Number, default: () => l.clickTolerance },
+    collectResourceTiming: { type: Boolean, default: () => l.collectResourceTiming },
+    cooperativeGestures: { type: [Boolean, Object], default: () => l.cooperativeGestures },
+    crossSourceCollisions: { type: Boolean, default: () => l.crossSourceCollisions },
+    doubleClickZoom: { type: Boolean, default: () => l.doubleClickZoom },
+    dragPan: { type: Boolean, default: () => l.dragPan },
+    dragRotate: { type: Boolean, default: () => l.dragRotate },
+    elevation: { type: Number, default: () => l.elevation },
+    fadeDuration: { type: Number, default: () => l.fadeDuration },
+    fitBoundsOptions: { type: Object, default: () => l.fitBoundsOptions },
+    hash: { type: [Boolean, String], default: () => l.hash },
+    interactive: { type: Boolean, default: () => l.interactive },
+    keyboard: { type: Boolean, default: () => l.keyboard },
+    language: { type: String, default: () => l.language || null },
+    locale: { type: Object, default: () => l.locale },
     localIdeographFontFamily: {
       type: String,
-      default: () => s.localIdeographFontFamily
+      default: () => l.localIdeographFontFamily
     },
-    logoPosition: { type: [String], default: () => s.logoPosition },
+    logoPosition: { type: [String], default: () => l.logoPosition },
     mapKey: { type: [String, Symbol] },
-    maplibreLogo: { type: Boolean, default: () => s.maplibreLogo },
+    maplibreLogo: { type: Boolean, default: () => l.maplibreLogo },
     // StyleSpecification triggers TS7056, so users must handle typings themselves
-    mapStyle: { type: [String, Object], default: () => s.style },
-    maxBounds: { type: [Array, Object], default: () => s.maxBounds },
-    maxCanvasSize: { type: Array, default: () => s.maxCanvasSize },
-    maxPitch: { type: Number, default: () => s.maxPitch },
-    maxTileCacheSize: { type: Number, default: () => s.maxTileCacheSize },
-    maxTileCacheZoomLevels: { type: Number, default: () => s.maxTileCacheZoomLevels },
-    maxZoom: { type: Number, default: () => s.maxZoom },
-    minPitch: { type: Number, default: () => s.minPitch },
-    minZoom: { type: Number, default: () => s.minZoom },
-    pitch: { type: Number, default: () => s.pitch },
-    pitchWithRotate: { type: Boolean, default: () => s.pitchWithRotate },
-    pixelRatio: { type: Number, default: () => s.pixelRatio },
-    refreshExpiredTiles: { type: Boolean, default: () => s.refreshExpiredTiles },
-    renderWorldCopies: { type: Boolean, default: () => s.renderWorldCopies },
-    roll: { type: Number, default: () => s.roll },
-    rollEnabled: { typed: Boolean, default: () => s.rollEnabled },
-    scrollZoom: { type: Boolean, default: () => s.scrollZoom },
-    touchPitch: { type: Boolean, default: () => s.touchPitch },
-    touchZoomRotate: { type: Boolean, default: () => s.touchZoomRotate },
-    trackResize: { type: Boolean, default: () => s.trackResize },
-    transformCameraUpdate: { type: Function, default: s.transformCameraUpdate },
-    transformRequest: { type: Function, default: s.transformRequest },
-    validateStyle: { type: Boolean, default: () => s.validateStyle },
-    zoom: { type: Number, default: () => s.zoom }
+    mapStyle: { type: [String, Object], default: () => l.style },
+    maxBounds: { type: [Array, Object], default: () => l.maxBounds },
+    maxCanvasSize: { type: Array, default: () => l.maxCanvasSize },
+    maxPitch: { type: Number, default: () => l.maxPitch },
+    maxTileCacheSize: { type: Number, default: () => l.maxTileCacheSize },
+    maxTileCacheZoomLevels: { type: Number, default: () => l.maxTileCacheZoomLevels },
+    maxZoom: { type: Number, default: () => l.maxZoom },
+    minPitch: { type: Number, default: () => l.minPitch },
+    minZoom: { type: Number, default: () => l.minZoom },
+    pitch: { type: Number, default: () => l.pitch },
+    pitchWithRotate: { type: Boolean, default: () => l.pitchWithRotate },
+    pixelRatio: { type: Number, default: () => l.pixelRatio },
+    refreshExpiredTiles: { type: Boolean, default: () => l.refreshExpiredTiles },
+    renderWorldCopies: { type: Boolean, default: () => l.renderWorldCopies },
+    roll: { type: Number, default: () => l.roll },
+    rollEnabled: { typed: Boolean, default: () => l.rollEnabled },
+    scrollZoom: { type: Boolean, default: () => l.scrollZoom },
+    touchPitch: { type: Boolean, default: () => l.touchPitch },
+    touchZoomRotate: { type: Boolean, default: () => l.touchZoomRotate },
+    trackResize: { type: Boolean, default: () => l.trackResize },
+    transformCameraUpdate: { type: Function, default: l.transformCameraUpdate },
+    transformRequest: { type: Function, default: l.transformRequest },
+    validateStyle: { type: Boolean, default: () => l.validateStyle },
+    zoom: { type: Number, default: () => l.zoom }
   },
@@ -427,78 +421,78 @@ emits: [
   setup(e, a) {
-    const o = se(w()), n = te(), t = te(), r = k(!1), u = k(!1), f = k(!1), y = /* @__PURE__ */ new Map(), A = Ie(), h = Te(o, t, e.mapKey);
-    let C;
-    T(N, t), T(Q, u), T(P, r), T(ne, o.uid), T(ie, ""), T(re, A), T(ye, e.fitBoundsOptions), c(() => e.bearing, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setBearing(i));
-    }), c(() => e.bounds, (i) => {
-      var l, x;
-      return i && ((x = t.value) == null ? void 0 : x.fitBounds(i, (l = e.fitBoundsOptions) != null && l.useOnBoundsUpdate ? e.fitBoundsOptions : void 0));
-    }), c(() => e.center, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setCenter(i));
-    }), c(() => e.maxBounds, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setMaxBounds(i));
-    }), c(() => e.maxPitch, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setMaxPitch(i));
-    }), c(() => e.maxZoom, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setMaxZoom(i));
-    }), c(() => e.minPitch, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setMinPitch(i));
-    }), c(() => e.minZoom, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setMinZoom(i));
-    }), c(() => e.pitch, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setPitch(i));
-    }), c(() => e.renderWorldCopies, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setRenderWorldCopies(i));
-    }), c(() => e.mapStyle, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setStyle(i));
-    }), c(() => e.transformRequest, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setTransformRequest(i));
-    }), c(() => e.zoom, (i) => {
-      var l;
-      return i && ((l = t.value) == null ? void 0 : l.setZoom(i));
-    }), c(() => e.language, (i) => {
-      f.value && t.value && h.language !== (i || null) && (ee(t.value, i || ""), h.language = i || null);
-    }), c(() => h.language, (i) => {
-      f.value && t.value && ee(t.value, i || "");
+    const o = te(P()), n = Y(), t = Y(), s = _(!1), h = _(!1), S = _(!1), m = /* @__PURE__ */ new Map(), b = Me(), f = Ne(o, t, e.mapKey);
+    let E;
+    I(x, t), I(W, h), I(T, s), I(J, o.uid), I(Q, ""), I(X, b), I(he, e.fitBoundsOptions), c(() => e.bearing, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setBearing(r));
+    }), c(() => e.bounds, (r) => {
+      var i, M;
+      return r && ((M = t.value) == null ? void 0 : M.fitBounds(r, (i = e.fitBoundsOptions) != null && i.useOnBoundsUpdate ? e.fitBoundsOptions : void 0));
+    }), c(() => e.center, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setCenter(r));
+    }), c(() => e.maxBounds, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setMaxBounds(r));
+    }), c(() => e.maxPitch, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setMaxPitch(r));
+    }), c(() => e.maxZoom, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setMaxZoom(r));
+    }), c(() => e.minPitch, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setMinPitch(r));
+    }), c(() => e.minZoom, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setMinZoom(r));
+    }), c(() => e.pitch, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setPitch(r));
+    }), c(() => e.renderWorldCopies, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setRenderWorldCopies(r));
+    }), c(() => e.mapStyle, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setStyle(r));
+    }), c(() => e.transformRequest, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setTransformRequest(r));
+    }), c(() => e.zoom, (r) => {
+      var i;
+      return r && ((i = t.value) == null ? void 0 : i.setZoom(r));
+    }), c(() => e.language, (r) => {
+      S.value && t.value && f.language !== (r || null) && ($(t.value, r || ""), f.language = r || null);
+    }), c(() => f.language, (r) => {
+      S.value && t.value && $(t.value, r || "");
     });
-    function m() {
-      f.value = !0, e.language ? h.language = e.language : h.language && ee(t.value, e.language || "");
+    function d() {
+      S.value = !0, e.language ? f.language = e.language : f.language && $(t.value, e.language || "");
     }
-    function L() {
-      h.isMounted = !0;
-      const i = Object.keys(e).filter((l) => e[l] !== void 0 && I.MAP_OPTION_KEYS.indexOf(l) !== -1).reduce((l, x) => (l[x === "mapStyle" ? "style" : x] = X(e[x]), l), { container: n.value });
-      if (t.value = se(new Le(i)), h.map = t.value, r.value = !0, y.set("__load", () => (u.value = !0, h.isLoaded = !0)), t.value.once("styledata", m), t.value.on("load", y.get("__load")), o.vnode.props) {
-        for (let l = 0, x = I.MAP_EVENT_TYPES.length; l < x; l++)
-          if (o.vnode.props["onMap:" + I.MAP_EVENT_TYPES[l]]) {
-            const le = I.createEventHandler(o, t.value, a, "map:" + I.MAP_EVENT_TYPES[l]);
-            y.set(I.MAP_EVENT_TYPES[l], le), t.value.on(I.MAP_EVENT_TYPES[l], le);
+    function R() {
+      f.isMounted = !0;
+      const r = Object.keys(e).filter((i) => e[i] !== void 0 && N.MAP_OPTION_KEYS.indexOf(i) !== -1).reduce((i, M) => (i[M === "mapStyle" ? "style" : M] = G(e[M]), i), { container: n.value });
+      if (t.value = te(new ve(r)), f.map = t.value, s.value = !0, m.set("__load", () => (h.value = !0, f.isLoaded = !0)), t.value.once("styledata", d), t.value.on("load", m.get("__load")), o.vnode.props) {
+        for (let i = 0, M = N.MAP_EVENT_TYPES.length; i < M; i++)
+          if (o.vnode.props["onMap:" + N.MAP_EVENT_TYPES[i]]) {
+            const ee = N.createEventHandler(o, t.value, a, "map:" + N.MAP_EVENT_TYPES[i]);
+            m.set(N.MAP_EVENT_TYPES[i], ee), t.value.on(N.MAP_EVENT_TYPES[i], ee);
           }
       }
-      t.value.getCanvas().addEventListener("webglcontextlost", d);
+      t.value.getCanvas().addEventListener("webglcontextlost", u);
     }
-    async function S() {
-      h.isMounted = !1, h.isLoaded = !1, u.value = !1, t.value && (t.value.getCanvas().removeEventListener("webglcontextlost", d), t.value._controls.forEach((i) => {
-        t.value.removeControl(i);
-      }), r.value = !1, y.forEach((i, l) => {
-        t.value.off(l.startsWith("__") ? l.substring(2) : l, i);
+    async function y() {
+      f.isMounted = !1, f.isLoaded = !1, h.value = !1, t.value && (t.value.getCanvas().removeEventListener("webglcontextlost", u), t.value._controls.forEach((r) => {
+        t.value.removeControl(r);
+      }), s.value = !1, m.forEach((r, i) => {
+        t.value.off(i.startsWith("__") ? i.substring(2) : i, r);
       }), t.value.remove());
     }
-    function d() {
-      S(), oe(L);
+    function u() {
+      y(), re(R);
     }
-    return ve(() => {
-      L(), t.value && (C = new ResizeObserver(Ae(t.value.resize.bind(t.value), 100)), C.observe(n.value));
-    }), E(() => {
-      C !== void 0 && (C.disconnect(), C = void 0), S();
-    }), a.expose({ map: t }), () => R(
+    return me(() => {
+      R(), t.value && (E = new ResizeObserver(ye(t.value.resize.bind(t.value), 100)), E.observe(n.value));
+    }), C(() => {
+      E !== void 0 && (E.disconnect(), E = void 0), y();
+    }), a.expose({ map: t }), () => H(
       "div",
@@ -510,17 +504,8 @@ {
       [
-        R("div", { ref: n, class: "mgl-wrapper" }),
-        r.value && a.slots.default ? a.slots.default({}) : void 0
+        H("div", { ref: n, class: "mgl-wrapper" }),
+        s.value && a.slots.default ? a.slots.default({}) : void 0
       ]
     );
   }
-});
-var H = /* @__PURE__ */ ((e) => (e.TOP_LEFT = "top-left", e.TOP_RIGHT = "top-right", e.BOTTOM_LEFT = "bottom-left", e.BOTTOM_RIGHT = "bottom-right", e))(H || {});
-const z = Object.values(H);
-function V(e, a, o) {
-  c(e, (n) => {
-    var t, r;
-    n && z.indexOf(n) === -1 || ((t = a.value) != null && t.hasControl(o) && a.value.removeControl(o), (r = a.value) == null || r.addControl(o, n));
-  }, { immediate: !0 });
-}
-const Pe = /* @__PURE__ */ p({
+}), xe = /* @__PURE__ */ p({
   name: "MglAttributionControl",
@@ -536,55 +521,8 @@ props: {
   setup(e) {
-    const a = g(N), o = g(P), n = new Re({ compact: e.compact, customAttribution: e.customAttribution });
-    V(() => e.position, a, n), E(() => o.value && a.value.removeControl(n));
+    const a = g(x), o = g(T), n = new be({ compact: e.compact, customAttribution: e.customAttribution });
+    B(() => e.position, a, n), C(() => o.value && a.value.removeControl(n));
   },
   render() {
   }
-}), j = class j {
-  constructor(a, o) {
-    v(this, "container");
-    this.isAdded = a, this.container = document.createElement("div"), this.setClasses(o);
-  }
-  getDefaultPosition() {
-    return H.TOP_LEFT;
-  }
-  onAdd() {
-    return oe(() => this.isAdded.value = !0), this.container;
-  }
-  onRemove() {
-    this.isAdded.value = !1, this.container.remove();
-  }
-  setClasses(a) {
-    a ? (this.container.classList.remove(j.CONTROL_CLASS), this.container.classList.remove(j.CONTROL_GROUP_CLASS)) : (this.container.classList.add(j.CONTROL_CLASS), this.container.classList.add(j.CONTROL_GROUP_CLASS));
-  }
-};
-v(j, "CONTROL_CLASS", "maplibregl-ctrl"), v(j, "CONTROL_GROUP_CLASS", "maplibregl-ctrl-group");
-let q = j;
-const ae = /* @__PURE__ */ p({
-  name: "MglCustomControl",
-  props: {
-    position: {
-      type: String,
-      validator: (e) => z.indexOf(e) !== -1
-    },
-    noClasses: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  slots: Object,
-  setup(e, { slots: a }) {
-    const o = g(N), n = g(P), t = k(!1), r = new q(t, e.noClasses);
-    return V(() => e.position, o, r), c(() => e.noClasses, (u) => r.setClasses(u)), E(() => {
-      var u;
-      return n.value && ((u = o.value) == null ? void 0 : u.removeControl(r));
-    }), () => {
-      var u;
-      return t.value ? R(
-        ce,
-        { to: r.container },
-        (u = a.default) == null ? void 0 : u.call(a, {})
-      ) : O("custom-component");
-    };
-  }
-}), He = /* @__PURE__ */ p({
+}), Ie = /* @__PURE__ */ p({
   name: "MglFullscreenControl",
@@ -594,3 +532,3 @@ props: {
       type: String,
-      default: H.TOP_RIGHT,
+      default: Z.TOP_RIGHT,
       validator: (e) => z.indexOf(e) !== -1
@@ -604,12 +542,12 @@ },
   setup(e) {
-    const a = g(N), o = g(P), n = new Ce({ container: e.container || void 0 });
+    const a = g(x), o = g(T), n = new Ae({ container: e.container || void 0 });
     function t() {
-      oe(() => {
-        var r;
-        return (r = a.value) == null ? void 0 : r.resize();
+      re(() => {
+        var s;
+        return (s = a.value) == null ? void 0 : s.resize();
       });
     }
-    n.on("fullscreenstart", t), n.on("fullscreenend", t), V(() => e.position, a, n), E(() => {
-      var r;
-      n.off("fullscreenstart", t), n.off("fullscreenend", t), o.value && ((r = a.value) == null || r.removeControl(n));
+    n.on("fullscreenstart", t), n.on("fullscreenend", t), B(() => e.position, a, n), C(() => {
+      var s;
+      n.off("fullscreenstart", t), n.off("fullscreenend", t), o.value && ((s = a.value) == null || s.removeControl(n));
     });
@@ -620,17 +558,17 @@ },
 });
-class ze {
-  constructor(a = "rgba(0,0,0,0.9)", o = 4 * window.devicePixelRatio, n = "#7cf859", t = "Monaco, Consolas, Courier, monospace", r = 60 * window.devicePixelRatio, u = 90 * window.devicePixelRatio, f = 0, y = 5 * window.devicePixelRatio, A = 100 * window.devicePixelRatio) {
-    v(this, "frames", 0);
-    v(this, "totalTime", 0);
-    v(this, "totalFrames", 0);
-    v(this, "time", null);
-    v(this, "map");
-    v(this, "container");
-    v(this, "readOutput");
-    v(this, "canvas");
-    v(this, "eventHandlers", /* @__PURE__ */ new Map());
-    this.background = a, this.barWidth = o, this.color = n, this.font = t, this.graphHeight = r, this.graphWidth = u, this.graphTop = f, this.graphRight = y, this.width = A;
+class Pe {
+  constructor(a = "rgba(0,0,0,0.9)", o = 4 * window.devicePixelRatio, n = "#7cf859", t = "Monaco, Consolas, Courier, monospace", s = 60 * window.devicePixelRatio, h = 90 * window.devicePixelRatio, S = 0, m = 5 * window.devicePixelRatio, b = 100 * window.devicePixelRatio) {
+    A(this, "frames", 0);
+    A(this, "totalTime", 0);
+    A(this, "totalFrames", 0);
+    A(this, "time", null);
+    A(this, "map");
+    A(this, "container");
+    A(this, "readOutput");
+    A(this, "canvas");
+    A(this, "eventHandlers", /* @__PURE__ */ new Map());
+    this.background = a, this.barWidth = o, this.color = n, this.font = t, this.graphHeight = s, this.graphWidth = h, this.graphTop = S, this.graphRight = m, this.width = b;
   }
   getDefaultPosition() {
-    return H.TOP_RIGHT;
+    return Z.TOP_RIGHT;
   }
@@ -687,3 +625,3 @@ onAdd(a) {
 }
-const Be = /* @__PURE__ */ p({
+const we = /* @__PURE__ */ p({
   name: "MglFrameRateControl",
@@ -733,3 +671,3 @@ props: {
   setup(e) {
-    const a = g(N), o = g(P), n = new ze(
+    const a = g(x), o = g(T), n = new Pe(
       e.background,
@@ -745,3 +683,3 @@ e.barWidth,
     );
-    V(() => e.position, a, n), E(() => {
+    B(() => e.position, a, n), C(() => {
       var t;
@@ -753,3 +691,3 @@ return o.value && ((t = a.value) == null ? void 0 : t.removeControl(n));
   }
-}), _e = /* @__PURE__ */ p({
+}), Te = /* @__PURE__ */ p({
   name: "MglGeolocationControl",
@@ -759,3 +697,3 @@ props: {
       type: String,
-      default: H.TOP_RIGHT,
+      default: Z.TOP_RIGHT,
       validator: (e) => z.indexOf(e) !== -1
@@ -785,3 +723,3 @@ },
   setup(e) {
-    const a = g(N), o = g(P), n = new Me({
+    const a = g(x), o = g(T), n = new Re({
       positionOptions: e.positionOptions,
@@ -793,3 +731,3 @@ fitBoundsOptions: e.fitBoundsOptions,
     });
-    V(() => e.position, a, n), E(() => {
+    B(() => e.position, a, n), C(() => {
       var t;
@@ -801,3 +739,3 @@ return o.value && ((t = a.value) == null ? void 0 : t.removeControl(n));
   }
-}), je = /* @__PURE__ */ p({
+}), He = /* @__PURE__ */ p({
   name: "MglNavigationControl",
@@ -807,3 +745,3 @@ props: {
       type: String,
-      default: H.TOP_RIGHT,
+      default: Z.TOP_RIGHT,
       validator: (e) => z.indexOf(e) !== -1
@@ -816,4 +754,4 @@ },
   setup(e) {
-    const a = g(N), o = g(P), n = new Ee({ showCompass: e.showCompass, showZoom: e.showZoom, visualizePitch: e.visualizePitch });
-    V(() => e.position, a, n), E(() => {
+    const a = g(x), o = g(T), n = new Oe({ showCompass: e.showCompass, showZoom: e.showZoom, visualizePitch: e.visualizePitch });
+    B(() => e.position, a, n), C(() => {
       var t;
@@ -826,4 +764,4 @@ return o.value && ((t = a.value) == null ? void 0 : t.removeControl(n));
 });
-var pe = /* @__PURE__ */ ((e) => (e.IMPERIAL = "imperial", e.METRIC = "metric", e.NAUTICAL = "nautical", e))(pe || {});
-const ke = Object.values(pe), Ve = /* @__PURE__ */ p({
+var ue = /* @__PURE__ */ ((e) => (e.IMPERIAL = "imperial", e.METRIC = "metric", e.NAUTICAL = "nautical", e))(ue || {});
+const Be = Object.values(ue), ze = /* @__PURE__ */ p({
   name: "MglScaleControl",
@@ -839,8 +777,8 @@ props: {
       default: "metric",
-      validator: (e) => ke.indexOf(e) !== -1
+      validator: (e) => Be.indexOf(e) !== -1
     }
   },
   setup(e) {
-    const a = g(N), o = g(P), n = new Ne({ maxWidth: e.maxWidth, unit: e.unit });
-    V(() => e.position, a, n), E(() => {
+    const a = g(x), o = g(T), n = new Ee({ maxWidth: e.maxWidth, unit: e.unit });
+    B(() => e.position, a, n), C(() => {
       var t;
@@ -853,60 +791,6 @@ return o.value && ((t = a.value) == null ? void 0 : t.removeControl(n));
 });
-var D = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.TEXT = "text", e.MDI = "mdi", e.SIMPLE_ICON = "simple-icons", e))(D || {});
-const De = Object.values(D), $ = {
-  text: void 0,
-  mdi: {
-    size: 21,
-    viewbox: "0 0 24 24"
-  },
-  "simple-icons": {
-    size: 21,
-    viewbox: "0 0 24 24"
-  },
-  default: {
-    size: 0,
-    viewbox: "0 0 0 0"
-  }
-}, U = /* @__PURE__ */ p({
-  name: "MglButton",
-  props: {
-    type: {
-      type: String,
-      default: "default",
-      validator: (e) => De.indexOf(e) !== -1
-    },
-    path: {
-      type: String
-    },
-    size: Number,
-    viewbox: String
-  },
-  slots: Object,
-  setup(e, { slots: a }) {
-    !e.path && e.type !== "text" && me("property `path` must be set on MaplibreButton");
-    const o = k($[e.type] || $.default);
-    return c(() => e.type, (n) => o.value = $[n] || $.default), () => {
-      var n, t;
-      return e.type === "text" ? R("button", { type: "button" }, (n = a.default) == null ? void 0 : n.call(a, {})) : R(
-        "button",
-        { type: "button", class: "maplibregl-ctrl-icon" },
-        [
-          R(
-            "svg",
-            {
-              width: e.size || o.value.size,
-              height: e.size || o.value.size,
-              viewBox: e.viewbox || o.value.viewbox
-            },
-            R("path", { fill: "currentColor", d: e.path })
-          ),
-          (t = a.default) == null ? void 0 : t.call(a, {})
-        ]
-      );
-    };
-  }
-});
-function de(e) {
+function ne(e) {
   return e && !!e.stopPropagation;
 }
-const Fe = /* @__PURE__ */ p({
+const ke = /* @__PURE__ */ p({
   name: "MglStyleSwitchControl",
@@ -934,62 +818,62 @@ props: {
   setup(e, { emit: a, slots: o }) {
-    const n = g(N), t = g(P), r = g(Q), u = g(re), f = k(!1), y = k(e.isOpen === void 0 ? !1 : e.isOpen), A = te(e.modelValue === void 0 ? e.mapStyles.length ? e.mapStyles[0] : null : e.modelValue), h = new q(f, !1), C = S.bind(null, !1);
-    function m() {
-      const d = n.value.getStyle().name;
-      for (let i = 0, l = e.mapStyles.length; i < l; i++)
-        if (e.mapStyles[i].name === d) {
-          L(e.mapStyles[i]);
+    const n = g(x), t = g(T), s = g(W), h = g(X), S = _(!1), m = _(e.isOpen === void 0 ? !1 : e.isOpen), b = Y(e.modelValue === void 0 ? e.mapStyles.length ? e.mapStyles[0] : null : e.modelValue), f = new pe(S, !1), E = y.bind(null, !1);
+    function d() {
+      const u = n.value.getStyle().name;
+      for (let r = 0, i = e.mapStyles.length; r < i; r++)
+        if (e.mapStyles[r].name === u) {
+          R(e.mapStyles[r]);
           break;
         }
     }
-    c(r, (d) => {
-      d && m();
-    }, { immediate: !0 }), n.value.on("style.load", m), document.addEventListener("click", C), V(() => e.position, n, h), e.modelValue !== void 0 && c(() => e.modelValue, (d) => {
-      d !== void 0 && (A.value = d);
-    }), e.isOpen !== void 0 && c(() => e.isOpen, (d) => {
-      d !== void 0 && (y.value = d);
-    }), E(() => {
-      t.value && (n.value.removeControl(h), n.value.off("style.load", m)), document.removeEventListener("click", C);
+    c(s, (u) => {
+      u && d();
+    }, { immediate: !0 }), n.value.on("style.load", d), document.addEventListener("click", E), B(() => e.position, n, f), e.modelValue !== void 0 && c(() => e.modelValue, (u) => {
+      u !== void 0 && (b.value = u);
+    }), e.isOpen !== void 0 && c(() => e.isOpen, (u) => {
+      u !== void 0 && (m.value = u);
+    }), C(() => {
+      t.value && (n.value.removeControl(f), n.value.off("style.load", d)), document.removeEventListener("click", E);
     });
-    function L(d) {
-      var i;
-      ((i = A.value) == null ? void 0 : i.name) !== d.name && (u.emit("styleSwitched", d), n.value.setStyle(d.style, { diff: !1 }), e.modelValue === void 0 && (A.value = d), a("update:modelValue", d), S(!1));
+    function R(u) {
+      var r;
+      ((r = b.value) == null ? void 0 : r.name) !== u.name && (h.emit("styleSwitched", u), n.value.setStyle(u.style, { diff: !1 }), e.modelValue === void 0 && (b.value = u), a("update:modelValue", u), y(!1));
     }
-    function S(d, i) {
-      de(i) ? i.stopPropagation() : de(d) && d.stopPropagation(), !(e.isOpen !== void 0 && e.isOpen === d || y.value === d) && (e.isOpen === void 0 ? (y.value = typeof d == "boolean" ? d : !y.value, a("update:isOpen", y.value)) : a("update:isOpen", typeof d == "boolean" ? d : !e.isOpen));
+    function y(u, r) {
+      ne(r) ? r.stopPropagation() : ne(u) && u.stopPropagation(), !(e.isOpen !== void 0 && e.isOpen === u || m.value === u) && (e.isOpen === void 0 ? (m.value = typeof u == "boolean" ? u : !m.value, a("update:isOpen", m.value)) : a("update:isOpen", typeof u == "boolean" ? u : !e.isOpen));
     }
     return () => {
-      if (!f.value)
+      if (!S.value)
         return O("style-switch-control");
-      const d = {
-        isOpen: y,
-        toggleOpen: S,
-        setStyle: L,
+      const u = {
+        isOpen: m,
+        toggleOpen: y,
+        setStyle: R,
         mapStyles: e.mapStyles,
-        currentStyle: A
+        currentStyle: b
       };
-      return R(
-        ce,
-        { to: h.container },
-        o.default ? o.default(d) : [
-          o.button ? o.button(d) : R(U, {
-            type: D.MDI,
+      return H(
+        fe,
+        { to: f.container },
+        o.default ? o.default(u) : [
+          o.button ? o.button(u) : H(K, {
+            type: oe.MDI,
             path: "M12,18.54L19.37,12.8L21,14.07L12,21.07L3,14.07L4.62,12.81L12,18.54M12,16L3,9L12,2L21,9L12,16M12,4.53L6.26,9L12,13.47L17.74,9L12,4.53Z",
-            class: ["maplibregl-ctrl-icon maplibregl-style-switch", y.value ? "is-open" : ""],
-            onClick: S.bind(null, !0)
+            class: ["maplibregl-ctrl-icon maplibregl-style-switch", m.value ? "is-open" : ""],
+            onClick: y.bind(null, !0)
           }),
-          o.styleList ? o.styleList(d) : R(
+          o.styleList ? o.styleList(u) : H(
             "div",
-            { class: ["maplibregl-style-list", y.value ? "is-open" : ""] },
-            e.mapStyles.map((i) => {
-              var l, x;
-              return i.icon ? R(U, {
-                type: D.MDI,
-                path: i.icon.path,
-                class: ((l = A.value) == null ? void 0 : l.name) === i.name ? "is-active" : "",
-                onClick: () => L(i)
-              }, ue(i.label)) : R("button", {
+            { class: ["maplibregl-style-list", m.value ? "is-open" : ""] },
+            e.mapStyles.map((r) => {
+              var i, M;
+              return r.icon ? H(K, {
+                type: oe.MDI,
+                path: r.icon.path,
+                class: ((i = b.value) == null ? void 0 : i.name) === r.name ? "is-active" : "",
+                onClick: () => R(r)
+              }, ae(r.label)) : H("button", {
                 type: "button",
-                class: ((x = A.value) == null ? void 0 : x.name) === i.name ? "is-active" : "",
-                onClick: () => L(i)
-              }, ue(i.label));
+                class: ((M = b.value) == null ? void 0 : M.name) === r.name ? "is-active" : "",
+                onClick: () => R(r)
+              }, ae(r.label));
             })
@@ -1008,58 +892,3 @@ )
 	`
-}), Ge = /* @__PURE__ */ p({
-  name: "MglDrawControl",
-  components: { MglCustomControl: ae },
-  props: {
-    position: { type: String, default: H.TOP_RIGHT },
-    model: { type: Object },
-    mode: { type: String, default: _.POLYGON },
-    defaultMode: { type: String, default: _.POLYGON },
-    zoomOnUpdate: { type: Boolean, default: !0 },
-    minAreaSize: { type: Number },
-    minAreaColor: { type: String },
-    pointerPrecision: { type: Object }
-  },
-  emits: ["update:mode", "update:model"],
-  slots: Object,
-  setup(e, { emit: a, slots: o }) {
-    const n = g(N), t = g(ye), r = J(new Oe(n.value, e.model, {
-      mode: e.mode,
-      zoomOnUpdate: e.zoomOnUpdate,
-      pointerPrecision: e.pointerPrecision,
-      minArea: {
-        size: e.minAreaSize,
-        color: e.minAreaColor
-      },
-      fitBoundsOptions: t,
-      onUpdate: (f) => a("update:model", f)
-    }));
-    function u(f) {
-      r.mode === f ? r.setMode(e.defaultMode, e.model) : r.setMode(f, e.model), a("update:mode", f);
-    }
-    return c(() => e.mode, () => e.mode !== r.mode && u(e.mode)), c(() => e.model, () => r.setModel(e.model)), c(() => e.minAreaSize, () => r.setMinAreaSize(e.minAreaSize)), c(() => e.minAreaColor, () => r.setMinAreaColor(e.minAreaColor)), E(() => r.dispose()), () => R(
-      ae,
-      { position: e.position },
-      () => o.buttons ? o.buttons({ mode: r.mode, setMode: u }) : [
-        R(U, {
-          type: D.MDI,
-          path: "M17,15.7V13H19V17L10,21L3,14L7,5H11V7H8.3L5.4,13.6L10.4,18.6L17,15.7M22,5V7H19V10H17V7H14V5H17V2H19V5H22Z",
-          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-polygon", r.mode === _.POLYGON ? "is-active" : void 0],
-          onClick: () => u(_.POLYGON)
-        }),
-        R(U, {
-          type: D.MDI,
-          path: "M11,19A6,6 0 0,0 17,13H19A8,8 0 0,1 11,21A8,8 0 0,1 3,13A8,8 0 0,1 11,5V7A6,6 0 0,0 5,13A6,6 0 0,0 11,19M19,5H22V7H19V10H17V7H14V5H17V2H19V5Z",
-          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-circle", r.mode === _.CIRCLE ? "is-active" : void 0],
-          onClick: () => u(_.CIRCLE)
-        }),
-        R(U, {
-          type: D.MDI,
-          path: "M3.05,13H1V11H3.05C3.5,6.83 6.83,3.5 11,3.05V1H13V3.05C17.17,3.5 20.5,6.83 20.95,11H23V13H20.95C20.5,17.17 17.17,20.5 13,20.95V23H11V20.95C6.83,20.5 3.5,17.17 3.05,13M12,5A7,7 0 0,0 5,12A7,7 0 0,0 12,19A7,7 0 0,0 19,12A7,7 0 0,0 12,5Z",
-          class: ["maplibregl-ctrl-icon maplibregl-draw-control maplibregl-draw-control-circle-static", r.mode === _.CIRCLE_STATIC ? "is-active" : void 0],
-          onClick: () => u(_.CIRCLE_STATIC)
-        })
-      ]
-    );
-  }
-}), Ue = /* @__PURE__ */ p({
+}), je = /* @__PURE__ */ p({
   name: "MglMarker",
@@ -1082,22 +911,22 @@ props: {
   setup(e) {
-    const a = g(N), o = Object.keys(e).filter((t) => e[t] !== void 0 && I.MARKER_OPTION_KEYS.indexOf(t) !== -1).reduce((t, r) => (t[r] = X(e[r]), t), {}), n = new xe(o);
-    return n.setLngLat(e.coordinates).addTo(a.value), c(() => e.coordinates, (t) => n.setLngLat(t)), c(() => e.offset, (t) => n.setOffset(t || [0, 0])), c(() => e.pitchAlignment, (t) => n.setPitchAlignment(t || "auto")), c(() => e.rotationAlignment, (t) => n.setRotationAlignment(t || "auto")), E(n.remove.bind(n)), { marker: n };
+    const a = g(x), o = Object.keys(e).filter((t) => e[t] !== void 0 && N.MARKER_OPTION_KEYS.indexOf(t) !== -1).reduce((t, s) => (t[s] = G(e[s]), t), {}), n = new Le(o);
+    return n.setLngLat(e.coordinates).addTo(a.value), c(() => e.coordinates, (t) => n.setLngLat(t)), c(() => e.offset, (t) => n.setOffset(t || [0, 0])), c(() => e.pitchAlignment, (t) => n.setPitchAlignment(t || "auto")), c(() => e.rotationAlignment, (t) => n.setRotationAlignment(t || "auto")), C(n.remove.bind(n)), { marker: n };
   },
   render() {
   }
-}), W = class W {
+}), D = class D {
   static genSourceOpts(a, o, n) {
-    return Object.keys(o).filter((t) => o[t] !== void 0 && n.indexOf(t) !== -1).reduce((t, r) => (t[r] = X(o[r]), t), { type: a });
+    return Object.keys(o).filter((t) => o[t] !== void 0 && n.indexOf(t) !== -1).reduce((t, s) => (t[s] = G(o[s]), t), { type: a });
   }
   static getSourceRef(a, o) {
     const n = typeof o == "string", t = String(a) + (n ? o : "");
-    let r = W.REFS.get(t);
-    return r || (r = k(n ? null : void 0), W.REFS.set(t, r)), r;
+    let s = D.REFS.get(t);
+    return s || (s = _(n ? null : void 0), D.REFS.set(t, s)), s;
   }
 };
-v(W, "REFS", /* @__PURE__ */ new Map());
-let Y = W;
-class Ze {
+A(D, "REFS", /* @__PURE__ */ new Map());
+let V = D;
+class _e {
   constructor() {
-    v(this, "unmountHandlers", /* @__PURE__ */ new Map());
+    A(this, "unmountHandlers", /* @__PURE__ */ new Map());
   }
@@ -1114,20 +943,20 @@ registerUnmountHandler(a, o) {
 }
-function G(e, a, o) {
-  const n = g(N), t = g(Q), r = g(re), u = g(ne), f = Y.getSourceRef(u, e.sourceId), y = new Ze();
-  T(ie, e.sourceId), T(ge, y);
-  function A() {
-    t.value && (n.value.addSource(e.sourceId, Y.genSourceOpts(a, e, o)), f.value = n.value.getSource(e.sourceId));
+function j(e, a, o) {
+  const n = g(x), t = g(W), s = g(X), h = g(J), S = V.getSourceRef(h, e.sourceId), m = new _e();
+  I(Q, e.sourceId), I(ie, m);
+  function b() {
+    t.value && (n.value.addSource(e.sourceId, V.genSourceOpts(a, e, o)), S.value = n.value.getSource(e.sourceId));
   }
-  function h() {
-    f.value = null;
+  function f() {
+    S.value = null;
   }
-  return c(t, A, { immediate: !0 }), n.value.on("style.load", A), r.on("styleSwitched", h), E(() => {
-    t.value && (y.unmount(), n.value.removeSource(e.sourceId)), n.value.off("style.load", A), r.off("styleSwitched", h);
-  }), f;
+  return c(t, b, { immediate: !0 }), n.value.on("style.load", b), s.on("styleSwitched", f), C(() => {
+    t.value && (m.unmount(), n.value.removeSource(e.sourceId)), n.value.off("style.load", b), s.off("styleSwitched", f);
+  }), S;
 }
-const We = F({
+const Fe = k({
   animate: void 0,
   canvas: void 0,
   coordinates: void 0
-}), Ye = /* @__PURE__ */ p({
+}), De = /* @__PURE__ */ p({
   name: "MglCanvasSource",
@@ -1145,4 +974,4 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "canvas", We);
-    return c(Z(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
+    const o = j(e, "canvas", Fe);
+    return c(F(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
       var t;
@@ -1155,3 +984,3 @@ (t = o.value) == null || t.setCoordinates(n);
   }
-}), $e = F({
+}), Ve = k({
   data: void 0,
@@ -1171,3 +1000,3 @@ maxzoom: void 0,
   filter: void 0
-}), Ke = /* @__PURE__ */ p({
+}), Ze = /* @__PURE__ */ p({
   name: "MglGeoJsonSource",
@@ -1196,4 +1025,4 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "geojson", $e);
-    return c(Z(e.data) ? e.data : () => e.data, (n) => {
+    const o = j(e, "geojson", Ve);
+    return c(F(e.data) ? e.data : () => e.data, (n) => {
       var t;
@@ -1206,6 +1035,6 @@ (t = o.value) == null || t.setData(n || { type: "FeatureCollection", features: [] });
   }
-}), qe = F({
+}), Ue = k({
   url: void 0,
   coordinates: void 0
-}), Je = /* @__PURE__ */ p({
+}), Ge = /* @__PURE__ */ p({
   name: "MglImageSource",
@@ -1222,4 +1051,4 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "image", qe);
-    return c(Z(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
+    const o = j(e, "image", Ue);
+    return c(F(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
       var t;
@@ -1232,3 +1061,3 @@ (t = o.value) == null || t.setCoordinates(n);
   }
-}), Xe = F({
+}), We = k({
   url: void 0,
@@ -1243,3 +1072,3 @@ tiles: void 0,
   volatile: void 0
-}), Qe = /* @__PURE__ */ p({
+}), $e = /* @__PURE__ */ p({
   name: "MglRasterSource",
@@ -1263,3 +1092,3 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "raster", Xe);
+    const o = j(e, "raster", We);
     return () => [
@@ -1270,3 +1099,3 @@ O("Raster Source"),
   }
-}), et = F({
+}), Ye = k({
   url: void 0,
@@ -1285,3 +1114,3 @@ tiles: void 0,
   baseShift: void 0
-}), tt = /* @__PURE__ */ p({
+}), Ke = /* @__PURE__ */ p({
   name: "MglRasterDemSource",
@@ -1309,3 +1138,3 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "raster-dem", et);
+    const o = j(e, "raster-dem", Ye);
     return () => [
@@ -1316,3 +1145,3 @@ O("RasterDem Source"),
   }
-}), at = F({
+}), qe = k({
   url: void 0,
@@ -1327,3 +1156,3 @@ tiles: void 0,
   volatile: void 0
-}), ot = /* @__PURE__ */ p({
+}), Je = /* @__PURE__ */ p({
   name: "MglVectorSource",
@@ -1347,7 +1176,7 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "vector", at);
-    return c(Z(e.tiles) ? e.tiles : () => e.tiles, (n) => {
+    const o = j(e, "vector", qe);
+    return c(F(e.tiles) ? e.tiles : () => e.tiles, (n) => {
       var t;
       (t = o.value) == null || t.setTiles(n || []);
-    }, { immediate: !0 }), c(Z(e.url) ? e.url : () => e.url, (n) => {
+    }, { immediate: !0 }), c(F(e.url) ? e.url : () => e.url, (n) => {
       var t;
@@ -1360,6 +1189,6 @@ (t = o.value) == null || t.setUrl(n || "");
   }
-}), nt = F({
+}), Qe = k({
   urls: void 0,
   coordinates: void 0
-}), it = /* @__PURE__ */ p({
+}), Xe = /* @__PURE__ */ p({
   name: "MglVideoSource",
@@ -1376,4 +1205,4 @@ props: {
   setup(e, { slots: a }) {
-    const o = G(e, "video", nt);
-    return c(Z(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
+    const o = j(e, "video", Qe);
+    return c(F(e.coordinates) ? e.coordinates : () => e.coordinates, (n) => {
       var t;
@@ -1386,11 +1215,11 @@ (t = o.value) == null || t.setCoordinates(n);
   }
-}), M = class M {
+}), L = class L {
   static genLayerOpts(a, o, n, t) {
-    return Object.keys(n).filter((r) => n[r] !== void 0 && M.SOURCE_OPTS.indexOf(r) !== -1).reduce((r, u) => (r[u === "sourceLayer" ? "source-layer" : u] = X(n[u]), r), { type: o, source: n.source || t, id: a });
+    return Object.keys(n).filter((s) => n[s] !== void 0 && L.SOURCE_OPTS.indexOf(s) !== -1).reduce((s, h) => (s[h === "sourceLayer" ? "source-layer" : h] = G(n[h]), s), { type: o, source: n.source || t, id: a });
   }
   static registerLayerEvents(a, o, n) {
     if (n.props)
-      for (let t = 0, r = M.LAYER_EVENTS.length; t < r; t++) {
-        const u = "on" + M.LAYER_EVENTS[t].charAt(0).toUpperCase() + M.LAYER_EVENTS[t].substr(1);
-        n.props[u] && a.on(M.LAYER_EVENTS[t], o, n.props[u]);
+      for (let t = 0, s = L.LAYER_EVENTS.length; t < s; t++) {
+        const h = "on" + L.LAYER_EVENTS[t].charAt(0).toUpperCase() + L.LAYER_EVENTS[t].substr(1);
+        n.props[h] && a.on(L.LAYER_EVENTS[t], o, n.props[h]);
       }
@@ -1400,9 +1229,9 @@ }
     if (n.props)
-      for (let t = 0, r = M.LAYER_EVENTS.length; t < r; t++) {
-        const u = "on" + M.LAYER_EVENTS[t].charAt(0).toUpperCase() + M.LAYER_EVENTS[t].substr(1);
-        n.props[u] && a.off(M.LAYER_EVENTS[t], o, n.props[u]);
+      for (let t = 0, s = L.LAYER_EVENTS.length; t < s; t++) {
+        const h = "on" + L.LAYER_EVENTS[t].charAt(0).toUpperCase() + L.LAYER_EVENTS[t].substr(1);
+        n.props[h] && a.off(L.LAYER_EVENTS[t], o, n.props[h]);
       }
   }
 };
-v(M, "SOURCE_OPTS", [
+A(L, "SOURCE_OPTS", [
   "metadata",
@@ -1418,3 +1247,3 @@ "ref",
   "paint"
-]), v(M, "LAYER_EVENTS", [
+]), A(L, "LAYER_EVENTS", [
   "click",
@@ -1433,3 +1262,3 @@ "dblclick",
   "touchcancel"
-]), v(M, "SHARED", {
+]), A(L, "SHARED", {
   props: {
@@ -1464,31 +1293,31 @@ layerId: {
 });
-let b = M;
-function B(e, a, o, n, t) {
-  const r = g(ie), u = a || r;
-  u || me(`Layer (${o}): layer must be used inside source tag or source prop must be set`);
-  const f = g(N), y = g(Q), A = g(ne), h = Y.getSourceRef(A, u), C = g(ge);
-  function m() {
-    y.value && (t && b.unregisterLayerEvents(f.value, o, t.vnode), f.value.getLayer(o) && f.value.removeLayer(o));
+let v = L;
+function w(e, a, o, n, t) {
+  const s = g(Q), h = a || s;
+  h || ge(`Layer (${o}): layer must be used inside source tag or source prop must be set`);
+  const S = g(x), m = g(W), b = g(J), f = V.getSourceRef(b, h), E = g(ie);
+  function d() {
+    m.value && (t && v.unregisterLayerEvents(S.value, o, t.vnode), S.value.getLayer(o) && S.value.removeLayer(o));
   }
-  return C.registerUnmountHandler(o, m), E(() => {
-    C.unregisterUnmountHandler(o), m();
-  }), c([y, h], ([L, S]) => {
-    L && (S || S === void 0) && (f.value.addLayer(b.genLayerOpts(o, e, n, u), n.before || void 0), t && b.registerLayerEvents(f.value, n.layerId, t.vnode));
-  }, { immediate: !0 }), { map: f, isLoaded: y, source: h };
+  return E.registerUnmountHandler(o, d), C(() => {
+    E.unregisterUnmountHandler(o), d();
+  }), c([m, f], ([R, y]) => {
+    R && (y || y === void 0) && (S.value.addLayer(v.genLayerOpts(o, e, n, h), n.before || void 0), t && v.registerLayerEvents(S.value, n.layerId, t.vnode));
+  }, { immediate: !0 }), { map: S, isLoaded: m, source: f };
 }
-const rt = /* @__PURE__ */ p({
+const et = /* @__PURE__ */ p({
   name: "MglBackgroundLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
     paint: Object
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    return B("background", e.source, e.layerId, e), () => O("Background Layer");
+    return w("background", e.source, e.layerId, e), () => O("Background Layer");
   }
-}), lt = /* @__PURE__ */ p({
+}), tt = /* @__PURE__ */ p({
   name: "MglCircleLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1498,11 +1327,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("circle", e.source, e.layerId, e, a), () => O("Circle Layer");
+    const a = P();
+    return w("circle", e.source, e.layerId, e, a), () => O("Circle Layer");
   }
-}), st = /* @__PURE__ */ p({
+}), at = /* @__PURE__ */ p({
   name: "MglFillLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1512,11 +1341,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("fill", e.source, e.layerId, e, a), () => O("Fill Layer");
+    const a = P();
+    return w("fill", e.source, e.layerId, e, a), () => O("Fill Layer");
   }
-}), ut = /* @__PURE__ */ p({
+}), ot = /* @__PURE__ */ p({
   name: "MglFillExtrusionLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1526,11 +1355,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("fill-extrusion", e.source, e.layerId, e, a), () => O("Fill Extrusion Layer");
+    const a = P();
+    return w("fill-extrusion", e.source, e.layerId, e, a), () => O("Fill Extrusion Layer");
   }
-}), dt = /* @__PURE__ */ p({
+}), nt = /* @__PURE__ */ p({
   name: "MglHeatmapLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1540,11 +1369,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("heatmap", e.source, e.layerId, e, a), () => O("Heatmap Layer");
+    const a = P();
+    return w("heatmap", e.source, e.layerId, e, a), () => O("Heatmap Layer");
   }
-}), ct = /* @__PURE__ */ p({
+}), rt = /* @__PURE__ */ p({
   name: "MglHillshadeLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1554,11 +1383,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("hillshade", e.source, e.layerId, e, a), () => O("Hillshade Layer");
+    const a = P();
+    return w("hillshade", e.source, e.layerId, e, a), () => O("Hillshade Layer");
   }
-}), mt = /* @__PURE__ */ p({
+}), it = /* @__PURE__ */ p({
   name: "MglLineLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1568,11 +1397,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("line", e.source, e.layerId, e, a), () => O("Line Layer");
+    const a = P();
+    return w("line", e.source, e.layerId, e, a), () => O("Line Layer");
   }
-}), ft = /* @__PURE__ */ p({
+}), lt = /* @__PURE__ */ p({
   name: "MglRasterLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1582,11 +1411,11 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("raster", e.source, e.layerId, e, a), () => O("Raster Layer");
+    const a = P();
+    return w("raster", e.source, e.layerId, e, a), () => O("Raster Layer");
   }
-}), gt = /* @__PURE__ */ p({
+}), st = /* @__PURE__ */ p({
   name: "MglSymbolLayer",
   props: {
-    ...b.SHARED.props,
+    ...v.SHARED.props,
     layout: Object,
@@ -1596,40 +1425,39 @@ paint: Object,
   },
-  emits: [...b.SHARED.emits],
+  emits: [...v.SHARED.emits],
   setup(e) {
-    const a = w();
-    return B("symbol", e.source, e.layerId, e, a), () => O("Symbol Layer");
+    const a = P();
+    return w("symbol", e.source, e.layerId, e, a), () => O("Symbol Layer");
   }
-}), yt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}), ut = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  MglAttributionControl: Pe,
-  MglBackgroundLayer: rt,
-  MglButton: U,
-  MglCanvasSource: Ye,
-  MglCircleLayer: lt,
-  MglCustomControl: ae,
-  MglDrawControl: Ge,
-  MglFillExtrusionLayer: ut,
-  MglFillLayer: st,
-  MglFrameRateControl: Be,
-  MglFullscreenControl: He,
-  MglGeoJsonSource: Ke,
-  MglGeolocationControl: _e,
-  MglHeatmapLayer: dt,
-  MglHillshadeLayer: ct,
-  MglImageSource: Je,
-  MglLineLayer: mt,
-  MglMap: we,
-  MglMarker: Ue,
-  MglNavigationControl: je,
-  MglRasterDemSource: tt,
-  MglRasterLayer: ft,
-  MglRasterSource: Qe,
-  MglScaleControl: Ve,
-  MglStyleSwitchControl: Fe,
-  MglSymbolLayer: gt,
-  MglVectorSource: ot,
-  MglVideoSource: it,
-  Position: H
-}, Symbol.toStringTag, { value: "Module" })), Lt = function(a) {
-  Object.entries(yt).forEach(([o, n]) => {
+  MglAttributionControl: xe,
+  MglBackgroundLayer: et,
+  MglButton: K,
+  MglCanvasSource: De,
+  MglCircleLayer: tt,
+  MglCustomControl: Se,
+  MglFillExtrusionLayer: ot,
+  MglFillLayer: at,
+  MglFrameRateControl: we,
+  MglFullscreenControl: Ie,
+  MglGeoJsonSource: Ze,
+  MglGeolocationControl: Te,
+  MglHeatmapLayer: nt,
+  MglHillshadeLayer: rt,
+  MglImageSource: Ge,
+  MglLineLayer: it,
+  MglMap: Ce,
+  MglMarker: je,
+  MglNavigationControl: He,
+  MglRasterDemSource: Ke,
+  MglRasterLayer: lt,
+  MglRasterSource: $e,
+  MglScaleControl: ze,
+  MglStyleSwitchControl: ke,
+  MglSymbolLayer: st,
+  MglVectorSource: Je,
+  MglVideoSource: Xe,
+  Position: Z
+}, Symbol.toStringTag, { value: "Module" })), yt = function(a) {
+  Object.entries(ut).forEach(([o, n]) => {
     a.component(o, n);
@@ -1639,48 +1467,47 @@ });
 export {
-  Ot as AllOptions,
-  F as AllSourceOptions,
-  Pe as MglAttributionControl,
-  rt as MglBackgroundLayer,
-  U as MglButton,
-  Ye as MglCanvasSource,
-  lt as MglCircleLayer,
-  ae as MglCustomControl,
-  s as MglDefaults,
-  Ge as MglDrawControl,
-  ut as MglFillExtrusionLayer,
-  st as MglFillLayer,
-  Be as MglFrameRateControl,
-  He as MglFullscreenControl,
-  Ke as MglGeoJsonSource,
-  _e as MglGeolocationControl,
-  dt as MglHeatmapLayer,
-  ct as MglHillshadeLayer,
-  Je as MglImageSource,
-  mt as MglLineLayer,
-  we as MglMap,
-  Ue as MglMarker,
-  je as MglNavigationControl,
-  tt as MglRasterDemSource,
-  ft as MglRasterLayer,
-  Qe as MglRasterSource,
-  Ve as MglScaleControl,
-  Fe as MglStyleSwitchControl,
-  gt as MglSymbolLayer,
-  ot as MglVectorSource,
-  it as MglVideoSource,
-  H as Position,
-  ne as componentIdSymbol,
-  Lt as default,
-  re as emitterSymbol,
-  ye as fitBoundsOptionsSymbol,
-  P as isInitializedSymbol,
-  Q as isLoadedSymbol,
-  N as mapSymbol,
-  ie as sourceIdSymbol,
-  ge as sourceLayerRegistry,
-  B as useDisposableLayer,
-  At as useMap,
-  V as usePositionWatcher,
-  G as useSource
+  vt as AllOptions,
+  k as AllSourceOptions,
+  xe as MglAttributionControl,
+  et as MglBackgroundLayer,
+  K as MglButton,
+  De as MglCanvasSource,
+  tt as MglCircleLayer,
+  Se as MglCustomControl,
+  l as MglDefaults,
+  ot as MglFillExtrusionLayer,
+  at as MglFillLayer,
+  we as MglFrameRateControl,
+  Ie as MglFullscreenControl,
+  Ze as MglGeoJsonSource,
+  Te as MglGeolocationControl,
+  nt as MglHeatmapLayer,
+  rt as MglHillshadeLayer,
+  Ge as MglImageSource,
+  it as MglLineLayer,
+  Ce as MglMap,
+  je as MglMarker,
+  He as MglNavigationControl,
+  Ke as MglRasterDemSource,
+  lt as MglRasterLayer,
+  $e as MglRasterSource,
+  ze as MglScaleControl,
+  ke as MglStyleSwitchControl,
+  st as MglSymbolLayer,
+  Je as MglVectorSource,
+  Xe as MglVideoSource,
+  Z as Position,
+  J as componentIdSymbol,
+  yt as default,
+  X as emitterSymbol,
+  he as fitBoundsOptionsSymbol,
+  T as isInitializedSymbol,
+  W as isLoadedSymbol,
+  x as mapSymbol,
+  Q as sourceIdSymbol,
+  ie as sourceLayerRegistry,
+  w as useDisposableLayer,
+  ht as useMap,
+  B as usePositionWatcher,
+  j as useSource
 };
 //# sourceMappingURL=vue-maplibre-gl.js.map

package.json

 {
   "name": "vue-maplibre-gl",
-  "version": "5.3.3",
+  "version": "5.3.4",
   "description": "Vue 3 plugin for maplibre-gl",
@@ -5,0 +5,0 @@ "keywords": [

src/components/index.ts

@@ -11,3 +11,2 @@ /* eslint-disable import/prefer-default-export */
 export { default as MglStyleSwitchControl } from './controls/styleSwitch.control';
-export { default as MglDrawControl } from './controls/draw.control';
 export { default as MglButton } from './button.component';
@@ -14,0 +13,0 @@ export { default as MglMarker } from './marker.component';

src/plugins/draw/index.ts

@@ -6,3 +6,5 @@ import './draw.plugin.scss';
 export * from './circle.mode.ts';
-export * from './circleStatic.mode.ts'
+export * from './circleStatic.mode.ts';
 export * from './types';
+
+export { default as MglDrawControl } from './draw.control';

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1002188

increased by0.38%

Lines of code

9180

increased by0.27%

Worsened metrics

Number of low quality alerts

4

increased by33.33%

No dependency changes