@m4l/gclick 0.3.1-beta.0 → 0.3.1-beta.2

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/index.js

@@ -1,119 +1,104 @@
-import { jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { LayerGroup } from "react-leaflet";
-import L__default from "leaflet";
-import { shallow } from "zustand/shallow";
-import { M as MarkerClusterGroup } from "./subcomponents/MarkerClusterGroup/index.js";
-import { R as RenderByEachFeatureComponent, M as MemonizedRenderByEachFeatureComponent } from "./subcomponents/RenderByEachFeatureComponent/index.js";
-import { deepShallow } from "@m4l/components";
-import { u as useFilterDecimation } from "../../../../hooks/useZoomBasedMarkerFilter/useFilterDecimation.js";
-import { u as useMapStore } from "../../../../hooks/useMapStore/index.js";
-const Layer = (props) => {
-  const { layerId } = props;
-  const featureIdOrCollection = useMapStore((state) => {
-    const geoJsonObject = state.hashLayers[layerId]?.geoJsonObject;
-    if (geoJsonObject && geoJsonObject.object.type === "Feature") {
-      return geoJsonObject.object.id;
-    } else if (geoJsonObject && geoJsonObject.object.type === "FeatureCollection") {
-      return geoJsonObject && geoJsonObject.object.features.map((feature) => feature.id);
-    }
-  }, deepShallow);
-  const renderFeature = useMapStore((state) => state.hashLayers[layerId]?.renderFeature, shallow);
-  const decimationConfig = useMapStore(
-    (state) => state.hashLayers[layerId]?.decimationConfig,
-    shallow
-  );
-  const [visible, cluster = false] = useMapStore(
-    (state) => [state.hashLayers[layerId]?.visible, state.hashLayers[layerId]?.cluster],
-    shallow
-  );
-  const isFeaturCollection = Array.isArray(featureIdOrCollection);
-  const featureIdsToFilter = isFeaturCollection && !cluster ? featureIdOrCollection : [];
-  const filteredFeatureIds = useFilterDecimation(
-    featureIdsToFilter,
-    layerId,
-    decimationConfig?.decimationFilter,
-    decimationConfig?.debounceMs !== void 0 ? { debounceMs: decimationConfig.debounceMs } : void 0
-  );
-  const featureIdsToRender = useMemo(() => {
-    if (!isFeaturCollection) {
-      return [];
-    }
-    if (cluster) {
-      return featureIdOrCollection;
-    }
-    return filteredFeatureIds;
-  }, [isFeaturCollection, cluster, featureIdOrCollection, filteredFeatureIds]);
-  if (!featureIdOrCollection || !renderFeature) {
+import { jsx as n } from "@emotion/react/jsx-runtime";
+import { useMemo as b } from "react";
+import { LayerGroup as v } from "react-leaflet";
+import h from "leaflet";
+import { shallow as u } from "zustand/shallow";
+import { MarkerClusterGroup as M } from "./subcomponents/MarkerClusterGroup/index.js";
+import { useMapStore as p } from "../../../../hooks/useMapStore/index.js";
+import { deepShallow as g } from "@m4l/components";
+import "../../../../external/googleMutant/googleMutant.js";
+import "@googlemaps/js-api-loader";
+import "react-dom";
+import "clsx";
+import "../../../../slots/styled.js";
+import "@m4l/core";
+import "../../../Controls/subcomponents/ButtonsToolsList/subcomponents/MapSourcesTool/slots/styled.js";
+import "../../../Controls/subcomponents/ButtonsToolsList/subcomponents/MapLayersTool/slots/styled.js";
+import "react-hook-form";
+import "../../../../classes/index.js";
+import "@mui/material";
+import "../../../Controls/subcomponents/ButtonsToolsList/subcomponents/MeasureTool/slots/styled.js";
+import { RenderByEachFeatureComponent as I, MemonizedRenderByEachFeatureComponent as y } from "./subcomponents/RenderByEachFeatureComponent/index.js";
+import { useFilterDecimation as L } from "../../../../hooks/useZoomBasedMarkerFilter/useFilterDecimation.js";
+import "lodash-es/throttle";
+import "kdbush";
+import "../../../../contexts/MapContext/MapContext.js";
+import "../../../../popups/MapPopupDevice/slots/MapPopupDeviceSlots.js";
+import "../../../../../../../../formatters/CourseFormatter/slots/CourseFormatterSlots.js";
+import "@m4l/layouts";
+import "zustand";
+import "../../../../../GpsMapTools/contexts/GpsMapToolsContext/GpsMapToolsContext.js";
+import "@geoman-io/leaflet-geoman-free";
+import "yup";
+import "@m4l/graphics";
+import "../../../../../../../DeviceStatus/slots/DeviceStatusSlots.js";
+import "../../../../../../../Device/hooks/constants.js";
+import "leaflet-polylinedecorator";
+const le = (C) => {
+  const { layerId: r } = C, t = p((o) => {
+    const e = o.hashLayers[r]?.geoJsonObject;
+    return e && e.object.type === "Feature" ? e.object.id : e && e.object.type === "FeatureCollection" ? e && e.object.features.map((i) => i.id) : null;
+  }, g), s = p((o) => o.hashLayers[r].renderFeature, u), c = p(
+    (o) => o.hashLayers[r]?.decimationConfig,
+    u
+  ), [F, m = !1] = p(
+    (o) => [o.hashLayers[r]?.visible, o.hashLayers[r]?.cluster],
+    u
+  ), a = Array.isArray(t), d = L(
+    a && !m ? t : [],
+    r,
+    c?.decimationFilter,
+    c?.debounceMs !== void 0 ? { debounceMs: c.debounceMs } : void 0
+  ), f = b(() => a ? m ? t : d : [], [a, m, t, d]);
+  if (!t || !s || F === !1)
     return null;
-  }
-  if (visible === false) {
-    return null;
-  }
-  if (!isFeaturCollection) {
-    return /* @__PURE__ */ jsx(
-      RenderByEachFeatureComponent,
-      {
-        renderFeature,
-        id: featureIdOrCollection,
-        layerId
-      }
-    );
-  } else {
-    const createClusterCustomIcon = (markerCluster) => {
-      const childCount = markerCluster.getChildCount();
-      let c = " marker-cluster-";
-      if (childCount < 10) {
-        c += "small";
-      } else if (childCount < 100) {
-        c += "medium";
-      } else {
-        c += "large";
-      }
-      const MyDivIcon = new L__default.DivIcon({
-        html: "<div><span>" + childCount + "</span></div>",
-        className: "marker-cluster" + c,
-        iconSize: new L__default.Point(40, 40)
+  if (a) {
+    const o = (e) => {
+      const i = e.getChildCount();
+      let l = " marker-cluster-";
+      return i < 10 ? l += "small" : i < 100 ? l += "medium" : l += "large", new h.DivIcon({
+        html: "<div><span>" + i + "</span></div>",
+        className: "marker-cluster" + l,
+        iconSize: new h.Point(40, 40)
       });
-      return MyDivIcon;
     };
-    if (!cluster) {
-      return /* @__PURE__ */ jsx(LayerGroup, { children: featureIdsToRender.map((featureId) => {
-        return /* @__PURE__ */ jsx(
-          MemonizedRenderByEachFeatureComponent,
+    return m ? /* @__PURE__ */ n(
+      M,
+      {
+        disableClusteringAtZoom: 18,
+        showCoverageOnHover: !1,
+        zoomToBoundsOnClick: !1,
+        spiderfyOnMaxZoom: !1,
+        iconCreateFunction: o,
+        children: f.map((e) => /* @__PURE__ */ n(
+          y,
           {
-            renderFeature,
-            id: featureId,
-            layerId
+            renderFeature: s,
+            id: e,
+            layerId: r
           },
-          `k_${layerId}_${featureId}`
-        );
-      }) });
-    } else {
-      return /* @__PURE__ */ jsx(
-        MarkerClusterGroup,
-        {
-          disableClusteringAtZoom: 18,
-          showCoverageOnHover: false,
-          zoomToBoundsOnClick: false,
-          spiderfyOnMaxZoom: false,
-          iconCreateFunction: createClusterCustomIcon,
-          children: featureIdsToRender.map((featureId) => {
-            return /* @__PURE__ */ jsx(
-              MemonizedRenderByEachFeatureComponent,
-              {
-                renderFeature,
-                id: featureId,
-                layerId
-              },
-              `k_${layerId}_${featureId}`
-            );
-          })
-        }
-      );
-    }
-  }
+          `k_${r}_${e}`
+        ))
+      }
+    ) : /* @__PURE__ */ n(v, { children: f.map((e) => /* @__PURE__ */ n(
+      y,
+      {
+        renderFeature: s,
+        id: e,
+        layerId: r
+      },
+      `k_${r}_${e}`
+    )) });
+  } else
+    return /* @__PURE__ */ n(
+      I,
+      {
+        renderFeature: s,
+        id: t,
+        layerId: r
+      }
+    );
 };
 export {
-  Layer as L
+  le as Layer
 };

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/index.d.ts

@@ -7,3 +7,4 @@ import { MarkerClusterGroupProps } from './types';
  * @returns ForwardRefExoticComponent (significa que es un componente que ha sido envuelto con React.forwardRef.).
  */
 export declare const MarkerClusterGroup: import('react').ForwardRefExoticComponent<L.MarkerClusterGroupOptions & import('@react-leaflet/core').PathProps & import('./types').PropsWithChildren & import('react').RefAttributes<MarkerClusterGroupProps>>;
+//# sourceMappingURL=index.d.ts.map

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/index.tsx"],"names":[],"mappings":"AACA,OAAO,CAAwC,MAAM,SAAS,CAAC;AAC/D;;;;;;GAMG;AACH,OAAO,uBAAuB,CAAC;AAE/B,OAAO,EAAE,uBAAuB,EAAyB,MAAM,SAAS,CAAC;AACzE;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,iNAiC7B,CAAC"}

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/index.js

@@ -1,24 +1,20 @@
-import { createPathComponent } from "@react-leaflet/core";
-import L__default from "leaflet";
+import { createPathComponent as i } from "@react-leaflet/core";
+import a from "leaflet";
 import "leaflet.markercluster";
-const MarkerClusterGroup = createPathComponent(({ children: _c, ...props }, ctx) => {
-  const clusterProps = {};
-  const clusterEvents = {};
-  Object.entries(props).forEach(([propName, prop]) => {
-    if (propName !== void 0 && prop !== "") {
-      propName.startsWith("on") ? clusterEvents[propName] = prop : clusterProps[propName] = prop;
-    }
+const m = i(({ children: l, ...o }, c) => {
+  const n = {}, s = {};
+  Object.entries(o).forEach(([t, r]) => {
+    t !== void 0 && r !== "" && (t.startsWith("on") ? s[t] = r : n[t] = r);
   });
-  const markerClusterGroup = new L__default.MarkerClusterGroup(clusterProps);
-  Object.entries(clusterEvents).forEach(([eventAsProp, callback]) => {
-    const clusterEvent = `cluster${eventAsProp.substring(2).toLowerCase()}`;
-    markerClusterGroup.on(clusterEvent, callback);
-  });
-  return {
-    instance: markerClusterGroup,
-    context: { ...ctx, layerContainer: markerClusterGroup }
+  const e = new a.MarkerClusterGroup(n);
+  return Object.entries(s).forEach(([t, r]) => {
+    const u = `cluster${t.substring(2).toLowerCase()}`;
+    e.on(u, r);
+  }), {
+    instance: e,
+    context: { ...c, layerContainer: e }
   };
 });
 export {
-  MarkerClusterGroup as M
+  m as MarkerClusterGroup
 };

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/types.d.ts

@@ -9,3 +9,4 @@ export declare type PropsWithChildren = {
     children?: ReactNode;
 };
 export type PathWithChildrenProps = MarkerClusterGroupOptions & PathProps & PropsWithChildren;
+//# sourceMappingURL=types.d.ts.map

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/MarkerClusterGroup/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,qBAAqB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,MAAM,WAAW,uBAAwB,SAAQ,YAAY,EAAE,yBAAyB;IACtF,YAAY,CAAC,EAAE,qBAAqB,CAAC;IACrC,SAAS,CAAC,EAAE,qBAAqB,CAAC;CAEnC;AACD,MAAM,CAAC,OAAO,MAAM,iBAAiB,GAAG;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AACF,MAAM,MAAM,qBAAqB,GAAG,yBAAyB,GAAG,SAAS,GAAG,iBAAiB,CAAC"}

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/index.d.ts

@@ -9,3 +9,4 @@ import { RenderByEachFeatureProps } from './types';
  */
 export declare const RenderByEachFeatureComponent: React.FC<RenderByEachFeatureProps>;
 export declare const MemonizedRenderByEachFeatureComponent: React.NamedExoticComponent<RenderByEachFeatureProps>;
+//# sourceMappingURL=index.d.ts.map

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AACxD;;;;;;GAMG;AACH,eAAO,MAAM,4BAA4B,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAM3E,CAAC;AACF,eAAO,MAAM,qCAAqC,sDAA2C,CAAC"}

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/index.js

@@ -1,13 +1,9 @@
-import React from "react";
-const RenderByEachFeatureComponent = ({
-  renderFeature,
-  ...props
-}) => {
-  const feature = renderFeature(props);
-  return feature;
-};
-const MemonizedRenderByEachFeatureComponent = React.memo(RenderByEachFeatureComponent);
+import o from "react";
+const n = ({
+  renderFeature: e,
+  ...t
+}) => e(t), m = o.memo(n);
 export {
-  MemonizedRenderByEachFeatureComponent as M,
-  RenderByEachFeatureComponent as R
+  m as MemonizedRenderByEachFeatureComponent,
+  n as RenderByEachFeatureComponent
 };

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/types.d.ts

@@ -3,3 +3,4 @@ import { RendePropFeatureArgs } from '../../../../../../contexts/MapContext/type
 export type RenderByEachFeatureProps = {
     renderFeature: (props: RendePropFeatureArgs) => ReactNode;
 } & RendePropFeatureArgs;
+//# sourceMappingURL=types.d.ts.map

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/subcomponents/RenderByEachFeatureComponent/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACxF,MAAM,MAAM,wBAAwB,GAAG;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;CAC3D,GAAG,oBAAoB,CAAC"}

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/types.d.ts

@@ -1,2 +1,3 @@
 import { LayerStore } from '../../../../contexts/MapContext/types';
 export type LayerProps = Pick<LayerStore, 'layerId'>;
+//# sourceMappingURL=types.d.ts.map

package/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/Layers/subcomponents/Layer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AACxE,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC"}

package/components/maps/components/GpsMap/subcomponents/MapEventController/MapEventController.d.ts

@@ -4,3 +4,4 @@
 export declare function MapEventController({ disableMapEvents }: {
     disableMapEvents: boolean;
 }): null;
+//# sourceMappingURL=MapEventController.d.ts.map

package/components/maps/components/GpsMap/subcomponents/MapEventController/MapEventController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapEventController.d.ts","sourceRoot":"","sources":["../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/MapEventController/MapEventController.tsx"],"names":[],"mappings":"AAEA;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,gBAAgB,EAAE,EAAE;IAAE,gBAAgB,EAAE,OAAO,CAAA;CAAE,QAKrF"}

package/components/maps/components/GpsMap/subcomponents/MapEventController/MapEventController.js

@@ -1,8 +1,15 @@
-import { u as useDisableMapEventsOnFlag } from "../../hooks/useDisableMapEventsOnFlag/index.js";
-function MapEventController({ disableMapEvents }) {
-  useDisableMapEventsOnFlag(disableMapEvents);
-  return null;
+import "react";
+import "react-leaflet";
+import "leaflet";
+import { useDisableMapEventsOnFlag as t } from "../../hooks/useDisableMapEventsOnFlag/index.js";
+import "zustand";
+import "../../contexts/MapContext/MapContext.js";
+import "lodash-es/debounce";
+import "@m4l/components";
+import "kdbush";
+function s({ disableMapEvents: r }) {
+  return t(r), null;
 }
 export {
-  MapEventController as M
+  s as MapEventController
 };

package/components/maps/components/GpsMap/subcomponents/TileLayers/index.d.ts

@@ -3,4 +3,5 @@
  * al mapa seleccionado en el store
  * @returns
  */
-export declare function TileLayers(): import("react/jsx-runtime").JSX.Element;
+export declare function TileLayers(): import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/components/maps/components/GpsMap/subcomponents/TileLayers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/TileLayers/index.tsx"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,wBAAgB,UAAU,qDAsBzB"}

package/components/maps/components/GpsMap/subcomponents/TileLayers/index.js

@@ -1,27 +1,24 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { T as TileLayerOthers } from "./subcomponents/TileLayerOthers/index.js";
-import { T as TileLayerGoogle } from "./subcomponents/TileLayerGoogle/index.js";
-import React, { useEffect } from "react";
-import { useMap } from "react-leaflet";
-function TileLayers() {
-  const map = useMap();
-  useEffect(() => {
-    const handleResize = () => {
-      map.invalidateSize();
-    };
-    const resizeObserver = new ResizeObserver((_entries) => {
-      handleResize();
+import { jsxs as i, jsx as t } from "@emotion/react/jsx-runtime";
+import { TileLayerOthers as n } from "./subcomponents/TileLayerOthers/index.js";
+import { TileLayerGoogle as s } from "./subcomponents/TileLayerGoogle/index.js";
+import a, { useEffect as m } from "react";
+import { useMap as f } from "react-leaflet";
+function g() {
+  const e = f();
+  return m(() => {
+    const o = () => {
+      e.invalidateSize();
+    }, r = new ResizeObserver((p) => {
+      o();
     });
-    resizeObserver.observe(map.getContainer());
-    return () => {
-      resizeObserver.unobserve(map.getContainer());
+    return r.observe(e.getContainer()), () => {
+      r.unobserve(e.getContainer());
     };
-  }, [map]);
-  return /* @__PURE__ */ jsxs(React.Fragment, { children: [
-    /* @__PURE__ */ jsx(TileLayerOthers, {}),
-    /* @__PURE__ */ jsx(TileLayerGoogle, {})
+  }, [e]), /* @__PURE__ */ i(a.Fragment, { children: [
+    /* @__PURE__ */ t(n, {}),
+    /* @__PURE__ */ t(s, {})
   ] });
 }
 export {
-  TileLayers as T
+  g as TileLayers
 };

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/darkStyles.d.ts

@@ -11,3 +11,4 @@ export declare const DARK_STYLES: ({
         color: string;
     }[];
 })[];
+//# sourceMappingURL=darkStyles.d.ts.map

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/darkStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"darkStyles.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/darkStyles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW;;;;;;;;;;;;IA+EvB,CAAC"}

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/index.d.ts

@@ -2,3 +2,4 @@
  * TODO: Documentar
  */
 export declare function TileLayerGoogle(): null;
+//# sourceMappingURL=index.d.ts.map

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/index.tsx"],"names":[],"mappings":"AAEA,OAAO,mCAAmC,CAAC;AAK3C;;GAEG;AACH,wBAAgB,eAAe,SA4K9B"}

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerGoogle/index.js

@@ -1,123 +1,55 @@
-import React, { useEffect } from "react";
-import { useMap } from "react-leaflet";
-import L__default from "leaflet";
-import { u as useMapStore } from "../../../../hooks/useMapStore/index.js";
-import { Loader } from "@googlemaps/js-api-loader";
-import { deepShallow } from "@m4l/components";
-function TileLayerGoogle() {
-  const map = useMap();
-  const mutantRefLayer = React.useRef(null);
-  const loaderRef = React.useRef(null);
-  const { sourceId, layer, trafficLayer, transitLayer, bicyclingLayer, googleApiKey, googleMapVersion } = useMapStore(
-    (state) => {
-      const source = state.mapSources.find((source2) => source2.id === state.currentMapSourceLayer.mapSourceId) || state.mapSources[0];
-      const layer2 = source.layers.find((layer3) => layer3.id === state.currentMapSourceLayer.mapSourceLayerId) || source.layers[0];
+import f, { useEffect as m } from "react";
+import { useMap as G } from "react-leaflet";
+import "../../../../external/googleMutant/googleMutant.js";
+import T from "leaflet";
+import { useMapStore as M } from "../../../../hooks/useMapStore/index.js";
+import { Loader as v } from "@googlemaps/js-api-loader";
+import { deepShallow as R } from "@m4l/components";
+function B() {
+  const n = G(), i = f.useRef(null), s = f.useRef(null), { sourceId: c, layer: r, trafficLayer: a, transitLayer: o, bicyclingLayer: t, googleApiKey: L, googleMapVersion: g } = M(
+    (e) => {
+      const p = e.mapSources.find((d) => d.id === e.currentMapSourceLayer.mapSourceId) || e.mapSources[0], u = p.layers.find((d) => d.id === e.currentMapSourceLayer.mapSourceLayerId) || p.layers[0];
       return {
-        sourceId: source.id,
-        layer: layer2,
-        trafficLayer: layer2?.roadSelectedOptions?.trafficLayer || false,
-        transitLayer: layer2?.roadSelectedOptions?.transitLayer || false,
-        bicyclingLayer: layer2?.roadSelectedOptions?.bicyclingLayer || false,
-        googleApiKey: state.googleMapsApiKey,
-        googleMapVersion: state.googleMapVersion
+        sourceId: p.id,
+        layer: u,
+        trafficLayer: u?.roadSelectedOptions?.trafficLayer || !1,
+        transitLayer: u?.roadSelectedOptions?.transitLayer || !1,
+        bicyclingLayer: u?.roadSelectedOptions?.bicyclingLayer || !1,
+        googleApiKey: e.googleMapsApiKey,
+        googleMapVersion: e.googleMapVersion
       };
     },
-    deepShallow
-  );
-  const someActiveLayers = trafficLayer || transitLayer || bicyclingLayer;
-  const lastLayersStatus = React.useRef({ trafficLayer, transitLayer, bicyclingLayer });
-  const layersStatus = React.useRef({ trafficLayer, transitLayer, bicyclingLayer });
-  layersStatus.current = { trafficLayer, transitLayer, bicyclingLayer };
-  useEffect(() => {
-    loaderRef.current = new Loader({
-      apiKey: googleApiKey,
-      version: googleMapVersion
+    R
+  ), S = a || o || t, y = f.useRef({ trafficLayer: a, transitLayer: o, bicyclingLayer: t }), l = f.useRef({ trafficLayer: a, transitLayer: o, bicyclingLayer: t });
+  return l.current = { trafficLayer: a, transitLayer: o, bicyclingLayer: t }, m(() => {
+    s.current = new v({
+      apiKey: L,
+      version: g
     });
-  }, [googleApiKey, googleMapVersion]);
-  useEffect(() => {
-    let leafletLayerGoogle;
-    if (sourceId !== "google") {
-      return;
-    }
-    if (!(trafficLayer || transitLayer || bicyclingLayer)) {
-      leafletLayerGoogle = L__default.tileLayer(layer.urlTemplate, layer.options);
-      if (layer.getTileUrl) {
-        leafletLayerGoogle.getTileUrl = layer.getTileUrl;
-      }
-      map.addLayer(leafletLayerGoogle);
-      if (layer.options && layer.options.maxZoom) {
-        map.setMaxZoom(layer.options.maxZoom);
-      }
-    }
-    return () => {
-      if (leafletLayerGoogle) {
-        map.removeLayer(leafletLayerGoogle);
-      }
-    };
-  }, [sourceId, layer.urlTemplate, layer.options, layer.getTileUrl, map, trafficLayer, transitLayer, bicyclingLayer]);
-  useEffect(() => {
-    if (sourceId !== "google" || !someActiveLayers || !loaderRef.current) {
+  }, [L, g]), m(() => {
+    let e;
+    if (c === "google")
+      return a || o || t || (e = T.tileLayer(r.urlTemplate, r.options), r.getTileUrl && (e.getTileUrl = r.getTileUrl), n.addLayer(e), r.options && r.options.maxZoom && n.setMaxZoom(r.options.maxZoom)), () => {
+        e && n.removeLayer(e);
+      };
+  }, [c, r.urlTemplate, r.options, r.getTileUrl, n, a, o, t]), m(() => {
+    if (c !== "google" || !S || !s.current)
       return;
-    }
-    let googleMutantLayer;
-    loaderRef.current.importLibrary("maps").then(() => {
-      googleMutantLayer = L__default.gridLayer.googleMutant({
+    let e;
+    return s.current.importLibrary("maps").then(() => {
+      e = T.gridLayer.googleMutant({
         maxZoom: 20,
-        type: layer.type
+        type: r.type
         // styles: [],
         // ...layer.options,
-      });
-      mutantRefLayer.current = googleMutantLayer;
-      if (layersStatus.current.trafficLayer) {
-        googleMutantLayer.addGoogleLayer("TrafficLayer");
-      }
-      if (layersStatus.current.transitLayer) {
-        googleMutantLayer.addGoogleLayer("TransitLayer");
-      }
-      if (layersStatus.current.bicyclingLayer) {
-        googleMutantLayer.addGoogleLayer("BicyclingLayer");
-      }
-      lastLayersStatus.current = { ...layersStatus.current };
-      map.addLayer(googleMutantLayer);
-    });
-    return () => {
-      if (googleMutantLayer) {
-        map.removeLayer(googleMutantLayer);
-        mutantRefLayer.current = null;
-      }
+      }), i.current = e, l.current.trafficLayer && e.addGoogleLayer("TrafficLayer"), l.current.transitLayer && e.addGoogleLayer("TransitLayer"), l.current.bicyclingLayer && e.addGoogleLayer("BicyclingLayer"), y.current = { ...l.current }, n.addLayer(e);
+    }), () => {
+      e && (n.removeLayer(e), i.current = null);
     };
-  }, [map, layer.type, sourceId, googleApiKey, googleMapVersion, someActiveLayers]);
-  React.useEffect(() => {
-    if (sourceId !== "google") {
-      return;
-    }
-    if (mutantRefLayer.current) {
-      if (trafficLayer !== lastLayersStatus.current.trafficLayer) {
-        if (trafficLayer) {
-          mutantRefLayer.current.addGoogleLayer("TrafficLayer");
-        } else if (trafficLayer === false) {
-          mutantRefLayer.current.removeGoogleLayer("TrafficLayer");
-        }
-      }
-      if (transitLayer !== lastLayersStatus.current.transitLayer) {
-        if (transitLayer) {
-          mutantRefLayer.current.addGoogleLayer("TransitLayer");
-        } else if (transitLayer === false) {
-          mutantRefLayer.current.removeGoogleLayer("TransitLayer");
-        }
-      }
-      if (bicyclingLayer !== lastLayersStatus.current.bicyclingLayer) {
-        if (bicyclingLayer) {
-          mutantRefLayer.current.addGoogleLayer("BicyclingLayer");
-        } else if (bicyclingLayer === false) {
-          mutantRefLayer.current.removeGoogleLayer("BicyclingLayer");
-        }
-      }
-      lastLayersStatus.current = { ...layersStatus.current };
-    }
-  }, [trafficLayer, transitLayer, bicyclingLayer]);
-  return null;
+  }, [n, r.type, c, L, g, S]), f.useEffect(() => {
+    c === "google" && i.current && (a !== y.current.trafficLayer && (a ? i.current.addGoogleLayer("TrafficLayer") : a === !1 && i.current.removeGoogleLayer("TrafficLayer")), o !== y.current.transitLayer && (o ? i.current.addGoogleLayer("TransitLayer") : o === !1 && i.current.removeGoogleLayer("TransitLayer")), t !== y.current.bicyclingLayer && (t ? i.current.addGoogleLayer("BicyclingLayer") : t === !1 && i.current.removeGoogleLayer("BicyclingLayer")), y.current = { ...l.current });
+  }, [a, o, t]), null;
 }
 export {
-  TileLayerGoogle as T
+  B as TileLayerGoogle
 };

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerOthers/index.d.ts

@@ -4,3 +4,4 @@
  * @returns null
  */
 export declare const TileLayerOthers: () => null;
+//# sourceMappingURL=index.d.ts.map

package/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerOthers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../../../../../packages/gclick/src/components/maps/components/GpsMap/subcomponents/TileLayers/subcomponents/TileLayerOthers/index.tsx"],"names":[],"mappings":"AAMA;;;;GAIG;AACH,eAAO,MAAM,eAAe,YA8C3B,CAAC"}