@local-logic/maps 0.0.10 → 0.0.12

package/dist/index-BhldVNew.js

@@ -0,0 +1,35 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useEffect as a } from "react";
+import { P as i } from "./logo-control-NE-LlsRy.js";
+import { u as c } from "./index-Bd7meO8V.js";
+import { c as n } from "./styles-ChFj97uV.js";
+function x({
+  latitude: r,
+  longitude: e,
+  anchor: f,
+  offset: m = [0, -35],
+  onClose: p,
+  children: o
+}) {
+  const { zoom: u } = c();
+  return a(() => {
+    p == null || p();
+  }, [u]), typeof r > "u" || typeof e > "u" ? null : /* @__PURE__ */ t(
+    i,
+    {
+      className: "maplibre-popup",
+      focusAfterOpen: !0,
+      latitude: r,
+      longitude: e,
+      anchor: f,
+      offset: m,
+      onClose: p,
+      closeButton: !1,
+      children: /* @__PURE__ */ t("div", { className: n, children: o })
+    },
+    "maplibre-popup"
+  );
+}
+export {
+  x as default
+};

package/dist/index-Bu4XEiYU.js

@@ -0,0 +1,74 @@
+import { jsxs as c, jsx as M } from "react/jsx-runtime";
+import { useEffect as h } from "react";
+import { u as L, a as b } from "./logo-control-NE-LlsRy.js";
+import { u as E, M as _ } from "./index-Bd7meO8V.js";
+import { C as v, c as y, M as O } from "./index-B3NH4rqN.js";
+function R({
+  clusters: r,
+  colors: i,
+  clusterIcon: d,
+  markerBounds: n,
+  markerBoundsPadding: e,
+  onClick: m,
+  doesSuperclusterContainActiveMarker: g
+}) {
+  const { current: f } = L(), { activeMarker: s, zoom: u } = E();
+  h(() => {
+    if (f && n) {
+      const [t, a, o, p] = n;
+      f.fitBounds(
+        [
+          [a - e.left, t - e.bottom],
+          [p + e.right, o + e.top]
+        ],
+        {
+          maxZoom: 17,
+          duration: 1e3
+        }
+      );
+    }
+  }, [f, n, e]);
+  const x = (t) => (a) => {
+    a.originalEvent.stopPropagation(), m == null || m(t);
+  };
+  return r == null ? void 0 : r.map((t, a) => {
+    const o = t.geometry.coordinates[0], p = t.geometry.coordinates[1];
+    return /* @__PURE__ */ c(
+      b,
+      {
+        anchor: "bottom",
+        longitude: o,
+        latitude: p,
+        onClick: x(t),
+        children: [
+          t.properties.cluster && t.properties.cluster_id && /* @__PURE__ */ M(
+            v,
+            {
+              colors: i,
+              icon: d,
+              isActive: g(t.properties.cluster_id)
+            }
+          ),
+          !t.properties.cluster && /* @__PURE__ */ M(
+            "div",
+            {
+              className: y,
+              style: {
+                "--background": i == null ? void 0 : i.background,
+                "--fill": i == null ? void 0 : i.fill
+              },
+              "data-is-cluster": !!t.properties.cluster,
+              "data-is-zoomed-out": u < _,
+              "data-is-active": (s == null ? void 0 : s.id) === t.properties.id,
+              children: /* @__PURE__ */ M(O, { icon: t.properties.icon })
+            }
+          )
+        ]
+      },
+      `map-marker-${o}-${p}-${a}`
+    );
+  });
+}
+export {
+  R as default
+};

package/dist/{index-CR8t37Oz.js → index-CzBPD5Sw.js}

@@ -1,28 +1,28 @@
 import { jsxs as M, jsx as d } from "react/jsx-runtime";
 import { useState as h, useEffect as b } from "react";
 import { A as C, M as O, C as i, u as P } from "./index.modern-CLRs8JwI.js";
-import { u as p, d as l, a as v } from "./index-DgHrPgsK.js";
+import { u as p, d as l, a as v } from "./index-Bd7meO8V.js";
 const y = {
   "top-left": i.LEFT_TOP,
   "top-right": i.RIGHT_TOP,
   "bottom-left": i.LEFT_BOTTOM,
   "bottom-right": i.RIGHT_BOTTOM
-}, Z = ({ isMapLoaded: r }) => {
-  const o = P(), { setBounds: u, setZoom: t } = p(), a = () => {
+}, z = ({ isMapLoaded: r }) => {
+  const o = P(), { setBounds: m, setZoom: t } = p(), a = () => {
     var s;
     if (!o)
       return;
     const e = (s = o.getBounds()) == null ? void 0 : s.toJSON(), n = o.getZoom();
-    e && u([e.west, e.south, e.east, e.north]), typeof n < "u" && t(n + 1);
+    e && m([e.west, e.south, e.east, e.north]), typeof n < "u" && t(n + 1);
   };
   return b(() => {
-    !r || !o || (a(), o.addListener("bounds_changed", () => {
+    !r || !o || (a(), o.addListener("zoom_changed", () => {
       a();
     }));
   }, [r, o]), null;
 };
 function B({ children: r }) {
-  const [o, u] = h(!1), {
+  const [o, m] = h(!1), {
     mapProvider: t,
     center: a,
     // Google Maps zoom level starts at 0, so we add 1 to match our defaultMapValues
@@ -32,15 +32,15 @@ function B({ children: r }) {
     pitch: f = l.pitch,
     bearing: c = l.bearing,
     cooperativeGestures: g = l.cooperativeGestures,
-    zoomPosition: m
+    zoomPosition: u
   } = p();
   if (t.name !== "google")
     return null;
   const T = () => {
-    u(!0);
+    m(!0);
   };
   return /* @__PURE__ */ M(C, { apiKey: t.apiKey, children: [
-    /* @__PURE__ */ d(Z, { isMapLoaded: o }),
+    /* @__PURE__ */ d(z, { isMapLoaded: o }),
     /* @__PURE__ */ d(
       O,
       {
@@ -58,7 +58,7 @@ function B({ children: r }) {
         clickableIcons: !1,
         mapTypeControl: !1,
         zoomControlOptions: {
-          position: m && y[m]
+          position: u && y[u]
         },
         minZoom: typeof n == "number" ? n + 1 : void 0,
         maxZoom: typeof s == "number" ? s + 1 : void 0,

package/dist/index-DFdfOz0d.js

@@ -0,0 +1,34 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useEffect as a } from "react";
+import { P as c } from "./scale-control-CyJd4u6j.js";
+import { u as i } from "./index-Bd7meO8V.js";
+import { c as n } from "./styles-ChFj97uV.js";
+function l({
+  latitude: p,
+  longitude: t,
+  anchor: f,
+  offset: o = [0, -35],
+  onClose: r,
+  children: m
+}) {
+  const { zoom: u } = i();
+  return a(() => {
+    r == null || r();
+  }, [u]), typeof p > "u" || typeof t > "u" ? null : /* @__PURE__ */ e(
+    c,
+    {
+      className: "mapbox-popup",
+      focusAfterOpen: !0,
+      latitude: p,
+      longitude: t,
+      anchor: f,
+      offset: o,
+      onClose: r,
+      closeButton: !1,
+      children: /* @__PURE__ */ e("div", { className: n, children: m })
+    }
+  );
+}
+export {
+  l as default
+};

package/dist/index-DsrEcQq0.js

@@ -0,0 +1,71 @@
+import { jsxs as x, jsx as d } from "react/jsx-runtime";
+import { useEffect as L } from "react";
+import { u as c, a as b } from "./index.modern-CLRs8JwI.js";
+import { u as v, M as y } from "./index-Bd7meO8V.js";
+import { C as E, c as O, M as _ } from "./index-B3NH4rqN.js";
+function N({
+  clusters: p,
+  colors: e,
+  clusterIcon: M,
+  markerBounds: n,
+  markerBoundsPadding: i,
+  onClick: m,
+  doesSuperclusterContainActiveMarker: g
+}) {
+  const r = c(), { activeMarker: f, zoom: h } = v();
+  L(() => {
+    if (r && n) {
+      const [t, s, a, o] = n;
+      r.fitBounds({
+        south: t - i.bottom,
+        west: s - i.left,
+        north: a + i.top,
+        east: o + i.right
+      });
+    }
+  }, [r, n, i]);
+  const u = (t) => () => {
+    m == null || m(t);
+  };
+  return p == null ? void 0 : p.map((t, s) => {
+    const a = t.geometry.coordinates[0], o = t.geometry.coordinates[1];
+    return /* @__PURE__ */ x(
+      b,
+      {
+        position: {
+          lat: o,
+          lng: a
+        },
+        onClick: u(t),
+        children: [
+          t.properties.cluster && /* @__PURE__ */ d(
+            E,
+            {
+              colors: e,
+              icon: M,
+              isActive: g(t.properties.cluster_id)
+            }
+          ),
+          !t.properties.cluster && /* @__PURE__ */ d(
+            "div",
+            {
+              className: O,
+              style: {
+                "--background": e == null ? void 0 : e.background,
+                "--fill": e == null ? void 0 : e.fill
+              },
+              "data-is-cluster": !!t.properties.cluster,
+              "data-is-zoomed-out": h - 1 < y + 1,
+              "data-is-active": (f == null ? void 0 : f.id) === t.properties.id,
+              children: /* @__PURE__ */ d(_, { icon: t.properties.icon })
+            }
+          )
+        ]
+      },
+      `map-marker-${a}-${o}-${s}`
+    );
+  });
+}
+export {
+  N as default
+};

package/dist/{index-BtwgeEEU.js → index-LKvWHhi6.js}

@@ -1,21 +1,21 @@
 import { jsxs as f, jsx as i } from "react/jsx-runtime";
 import { useEffect as d } from "react";
 import { M as b, N as x, u as M } from "./scale-control-CyJd4u6j.js";
-import { u as m, d as r, a as v } from "./index-DgHrPgsK.js";
-const y = () => {
-  const { current: e } = M(), { setBounds: o, setZoom: s } = m(), t = () => {
+import { u as m, d as r, a as y } from "./index-Bd7meO8V.js";
+const g = () => {
+  const { current: o } = M(), { setBounds: e, setZoom: s } = m(), t = () => {
     var a;
-    e && (o((a = e.getBounds()) == null ? void 0 : a.toArray().flat()), s(e.getZoom()));
+    o && (e((a = o.getBounds()) == null ? void 0 : a.toArray().flat()), s(o.getZoom()));
   };
   return d(() => {
-    e && (t(), e.on("move", () => {
+    o && (t(), o.on("zoom", () => {
       t();
     }));
-  }, [e]), null;
+  }, [o]), null;
 };
-function z({ children: e }) {
+function w({ children: o }) {
   const {
-    mapProvider: o,
+    mapProvider: e,
     center: s,
     zoom: t = r.zoom,
     minZoom: a,
@@ -25,10 +25,10 @@ function z({ children: e }) {
     cooperativeGestures: c = r.cooperativeGestures,
     zoomPosition: n
   } = m();
-  return o.name !== "mapbox" ? null : /* @__PURE__ */ f(
+  return e.name !== "mapbox" ? null : /* @__PURE__ */ f(
     b,
     {
-      mapboxAccessToken: o.apiKey,
+      mapboxAccessToken: e.apiKey,
       initialViewState: {
         ...s,
         zoom: t,
@@ -38,16 +38,16 @@ function z({ children: e }) {
       cooperativeGestures: c,
       minZoom: a,
       maxZoom: p,
-      mapStyle: `mapbox://styles/${o.theme || v.mapbox}`,
+      mapStyle: `mapbox://styles/${e.theme || y.mapbox}`,
       interactiveLayerIds: ["road-label", "waterway-label"],
       children: [
-        /* @__PURE__ */ i(y, {}),
+        /* @__PURE__ */ i(g, {}),
         n && /* @__PURE__ */ i(x, { position: n }),
-        e
+        o
       ]
     }
   );
 }
 export {
-  z as default
+  w as default
 };

package/dist/{index-BsnsAUt5.js → index-UEadmVww.js}

@@ -29,7 +29,8 @@ function d({ sources: a }) {
       return;
     const n = a.map((t) => {
       const l = {
-        paths: x(t.geometry)
+        paths: x(t.geometry),
+        clickable: !1
       };
       if (Array.isArray(t.layer))
         t.layer.forEach((r) => {

package/dist/{index-JQfyhSrg.js → index-aDlW4ps0.js}

@@ -1,13 +1,13 @@
 import { jsxs as f, jsx as i } from "react/jsx-runtime";
 import { useEffect as d } from "react";
 import { M, N as h, u as g } from "./logo-control-NE-LlsRy.js";
-import { u as n, d as a, a as v } from "./index-DgHrPgsK.js";
-const y = () => {
+import { u as n, d as a, a as y } from "./index-Bd7meO8V.js";
+const v = () => {
   const { current: t } = g(), { setBounds: e, setZoom: r } = n(), o = () => {
     t && (e(t.getBounds().toArray().flat()), r(t.getZoom()));
   };
   return d(() => {
-    t && (o(), t.on("move", () => {
+    t && (o(), t.on("zoom", () => {
       o();
     }));
   }, [t]), null;
@@ -36,9 +36,9 @@ function B({ children: t }) {
       cooperativeGestures: c,
       minZoom: m,
       maxZoom: p,
-      mapStyle: `https://api.maptiler.com/maps/${e.theme || v.maptiler}/style.json?key=${e.apiKey}`,
+      mapStyle: `https://api.maptiler.com/maps/${e.theme || y.maptiler}/style.json?key=${e.apiKey}`,
       children: [
-        /* @__PURE__ */ i(y, {}),
+        /* @__PURE__ */ i(v, {}),
         s && /* @__PURE__ */ i(h, { position: s }),
         t
       ]

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { i as c } from "./index-DgHrPgsK.js";
+import { i as c } from "./index-Bd7meO8V.js";
 export {
   c as LocalLogicMap
 };