@m4l/components 0.2.35 → 1.0.0

package/components/maps/components/GpsTools/{index.d93188ad.js → index.75880ce0.js}

@@ -1,45 +1,37 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { createContext, useRef, useEffect, useContext, useState, useMemo, useCallback } from "react";
 import { useModuleDictionary, useModuleSkeleton, useEnvironment, useHostTools, useNetwork, useModulePrivileges, usePaginate } from "@m4l/core";
-import { u as useMapStore, C as CommonFeatureRender, M as MAP_ZINDEX_OVER_MAP, b as MAP_DICCTIONARY } from "../Map/index.accb1f77.js";
+import { M as MAP_DICCTIONARY } from "../../../areas/dictionary.7e74022a.js";
 import { shallow } from "zustand/shallow";
 import { createStore, useStore } from "zustand";
 import { useResponsiveDesktop, useFirstRender } from "@m4l/graphics";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
 import { enableMapSet } from "immer";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { u as useMapStore, C as CommonFeatureRender } from "../../index.8ec46ce4.js";
+import { a9 as GeofencesFeaturesLayers, aa as COMPONENT_CLASS_NAME, M as MAP_ZINDEX_OVER_MAP, ab as COMPONENT_MAP_TOOLS_ID, ac as initialValues, ad as STROKE_COLOR_DEFAULT, ae as STROKE_OPACITY_DEFAULT, af as STROKE_WHEIGTH_DEFAULT, ag as STROKE_DASH_ARRAY_DEFAULT, ah as FILL_COLOR_DEFAULT, ai as FILL_OPACITY_DEFAULT, aj as STYLE_OPACITIES, ak as STYLE_WHEIGHTS, al as STYLE_PATTERNS, am as ENDPOINT_GEOFENCE_NEW_EDIT, an as ENDPOINT_GEOFENCE_GET } from "../../../areas/constants.5387d83e.js";
 import "@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css";
 import "@geoman-io/leaflet-geoman-free";
 import { styled } from "@mui/material/styles";
 import { generateUtilityClasses } from "@mui/material";
 import "@mui/base";
 import clsx from "clsx";
-import { D as DynamicFilter } from "../../../DynamicFilter/index.c52a8e96.js";
-import { C as ColumnDateFormatter } from "../../../DataGrid/formatters/ColumnDateFormatter/index.704db1ca.js";
+import { G as GPSTOOLSICONS } from "../../../areas/icons.504ec098.js";
+import { D as DynamicFilter } from "../../../DynamicFilter/index.d9168c12.js";
+import { j as ColumnDateFormatter, d as Actions, H as HelperError, B as Button, k as ActionFormIntro, a as RHFTextField, S as Stack, R as RHFAutocomplete, l as RHFColorPicker, m as Tabs, n as Tab, o as Tooltip, p as TabContent, q as TabProvider, g as DataGrid } from "../../../../vendor.a1ce6777.js";
 import { useFormContext, useWatch } from "react-hook-form";
-import { H as HelperError } from "../../../hook-form/HelperError/index.66bbcac3.js";
-import { u as usePopupsStore } from "../../../popups/PopupsProvider/index.d7409f48.js";
-import { A as ActionFormIntro } from "../../../CommonActions/components/ActionFormIntro/index.dcb4d280.js";
-import { A as Actions } from "../../../CommonActions/components/Actions/index.fa7ab18c.js";
-import { B as Button } from "../../../mui_extended/Button/index.c3084916.js";
+import { u as usePopupsStore } from "../../../popups/PopupsProvider/index.18669fb4.js";
 import { useMap } from "react-leaflet";
 import { u as useFormReadyForUpdate } from "../../../../hooks/useFormReadyForUpdate/index.f60f500e.js";
 import * as L from "leaflet";
-import { u as useTab } from "../../../../hooks/useTab/index.976d5e1e.js";
-import { P as PaperForm } from "../../../PaperForm/index.d08b43f6.js";
-import { R as RHFAutocomplete } from "../../../hook-form/RHFAutocomplete/index.1f2afb6b.js";
-import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.1bfa601f.js";
-import { S as Stack } from "../../../mui_extended/Stack/index.0e53197c.js";
-import { P as PropertyValue } from "../../../PropertyValue/index.15c61a4b.js";
-import { R as RHFColorPicker } from "../../../hook-form/RHFColorPicker/index.dc13d5a3.js";
-import { T as Tabs, a as Tab, b as TabContent, c as TabProvider } from "../../../mui_extended/Tab/index.9214d9cc.js";
-import { T as Tooltip } from "../../../mui_extended/Tooltip/index.24a2bc3f.js";
+import { u as useTab } from "../../../../hooks/useTab/index.bce8b99e.js";
+import { P as PaperForm } from "../../../PaperForm/index.8121e3da.js";
+import { P as PropertyValue } from "../../../PropertyValue/index.9572c347.js";
 import * as Yup from "yup";
-import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.7b2a8723.js";
-import { u as useFormAddEdit } from "../../../../hooks/useFormAddEdit/index.000ce60b.js";
-import { u as useModal } from "../../../../hooks/useModal/index.f73d7e42.js";
-import { W as WindowConfirm } from "../../../modal/WindowConfirm.ee6de236.js";
-import { c as DataGrid } from "../../../DataGrid/index.abe0f9b9.js";
+import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.dc955a09.js";
+import { u as useFormAddEdit } from "../../../../hooks/useFormAddEdit/index.f156a2cd.js";
+import { u as useModal } from "../../../../hooks/useModal/index.ef54bcf2.js";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm.e35da619.js";
 enableMapSet();
 const createGpsToolsStore = (initProps) => {
   const startProps = {
@@ -92,7 +84,10 @@ const createGpsToolsStore = (initProps) => {
           },
           updatePartialGeofence: (geofenceId, geofence) => {
             set((state) => {
-              state.geofenceState.hashGeofences[geofenceId] = { ...state.geofenceState.hashGeofences[geofenceId], ...geofence };
+              state.geofenceState.hashGeofences[geofenceId] = {
+                ...state.geofenceState.hashGeofences[geofenceId],
+                ...geofence
+              };
             });
           },
           updateRows: (newRows) => {
@@ -135,12 +130,8 @@ const createGpsToolsStore = (initProps) => {
 };
 const GpsToolsContext = createContext(null);
 function GpsToolsProvider(props) {
-  const {
-    children
-  } = props;
-  const {
-    getLabel
-  } = useModuleDictionary();
+  const { children } = props;
+  const { getLabel } = useModuleDictionary();
   const isDesktop = useResponsiveDesktop();
   const isSkeleton = useModuleSkeleton();
   const isFirstRender = useFirstRender([getLabel]);
@@ -156,10 +147,11 @@ function GpsToolsProvider(props) {
       }
     });
   }
-  const {
-    setHandlerGetLabel,
-    setExternalState
-  } = useStore(mapStoreRef.current, (state) => state.gpsToolsActions, shallow);
+  const { setHandlerGetLabel, setExternalState } = useStore(
+    mapStoreRef.current,
+    (state) => state.gpsToolsActions,
+    shallow
+  );
   useEffect(() => {
     if (!isFirstRender) {
       setHandlerGetLabel(getLabel);
@@ -169,15 +161,9 @@ function GpsToolsProvider(props) {
     if (isFirstRender) {
       return;
     }
-    setExternalState({
-      isMobile: !isDesktop,
-      isSkeleton
-    });
+    setExternalState({ isMobile: !isDesktop, isSkeleton });
   }, [isDesktop, isSkeleton]);
-  return /* @__PURE__ */ jsx(GpsToolsContext.Provider, {
-    value: mapStoreRef.current,
-    children
-  });
+  return /* @__PURE__ */ jsx(GpsToolsContext.Provider, { value: mapStoreRef.current, children });
 }
 function useGpsToolsStore(selector, equalityFn) {
   const context = useContext(GpsToolsContext);
@@ -185,22 +171,9 @@ function useGpsToolsStore(selector, equalityFn) {
     throw new Error("useGpsToolsStore context must be use inside GpsToolsContext");
   return useStore(context, selector, equalityFn);
 }
-const ENDPOINT_GEOFENCE_GET = "geofences";
-const ENDPOINT_GEOFENCE_NEW_EDIT = "geofences";
-var GeofencesFeaturesLayers = /* @__PURE__ */ ((GeofencesFeaturesLayers2) => {
-  GeofencesFeaturesLayers2["LAYER_GEOFENCES"] = "geofences";
-  GeofencesFeaturesLayers2["LAYER_GEOFENCES_TRANSIT_FEATURES"] = "geofencesCrossingFeatures";
-  GeofencesFeaturesLayers2["LAYER_GEOFENCES_INTERNAL_FEATURES"] = "geofencesInternalFeatures";
-  return GeofencesFeaturesLayers2;
-})(GeofencesFeaturesLayers || {});
 function useLayers() {
-  const {
-    addLayer,
-    removeLayer
-  } = useMapStore((state) => state.mapActions, shallow);
-  const {
-    init
-  } = useGpsToolsStore((state) => state.gpsToolsActions, shallow);
+  const { addLayer, removeLayer } = useMapStore((state) => state.mapActions, shallow);
+  const { init } = useGpsToolsStore((state) => state.gpsToolsActions, shallow);
   useEffect(() => {
     addLayer({
       layerId: GeofencesFeaturesLayers.LAYER_GEOFENCES,
@@ -246,70 +219,6 @@ function useLayers() {
     };
   }, []);
 }
-const COMPONENT_CLASS_NAME = "M4LGpsTools";
-const COMPONENT_MAP_TOOLS_ID = "gps_tools";
-const STYLE_OPACITIES = [
-  {
-    value: 0,
-    label: "0%"
-  },
-  {
-    value: 0.1,
-    label: "10%"
-  },
-  {
-    value: 0.2,
-    label: "20%"
-  },
-  {
-    value: 0.3,
-    label: "30%"
-  },
-  {
-    value: 0.4,
-    label: "40%"
-  },
-  {
-    value: 0.5,
-    label: "50%"
-  },
-  {
-    value: 1,
-    label: "100%"
-  }
-];
-const STYLE_WHEIGHTS = [
-  {
-    value: 0,
-    label: "0px"
-  },
-  {
-    value: 1,
-    label: "1px"
-  },
-  {
-    value: 2,
-    label: "2px"
-  },
-  {
-    value: 3,
-    label: "3px"
-  },
-  {
-    value: 4,
-    label: "4px"
-  }
-];
-const STYLE_PATTERNS = [
-  {
-    value: "",
-    label: "------"
-  },
-  {
-    value: "4 1 2",
-    label: "-- - - --"
-  }
-];
 const gpsToolsClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
   "gpsToolsRoot",
   "gpsToolsTab",
@@ -323,59 +232,33 @@ const gpsToolsClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
   "hidden"
 ]);
 const DivGpsToolsRoot = styled("div")`
-    position:relative;
-    display:flex;
-    flex-direction:column;
-    flex-grow:1;
-    width:100%;
-    height:100%;
-    
-    
-    z-index:${MAP_ZINDEX_OVER_MAP};
-
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  width: 100%;
+  height: 100%;
 
-    .${gpsToolsClasses.gpsToolsTabContent}.${gpsToolsClasses.hidden} {
-        display:none;
-    }
-
-
-    .${gpsToolsClasses.gpsToolsGeofencesList} .M4LDataGrid-root{
-        height:unset!important;
-        flex-grow:1;
-    }
+  z-index: ${MAP_ZINDEX_OVER_MAP};
 
+  .${gpsToolsClasses.gpsToolsTabContent}.${gpsToolsClasses.hidden} {
+    display: none;
+  }
 
-    .${gpsToolsClasses.toolGeofencesAddEditGeneral} {
-       flex-grow:1;
-    }
+  .${gpsToolsClasses.gpsToolsGeofencesList} .M4LDataGrid-root {
+    height: unset !important;
+    flex-grow: 1;
+  }
 
+  .${gpsToolsClasses.toolGeofencesAddEditGeneral} {
+    flex-grow: 1;
+  }
 
-    ${(props) => props.theme.components?.M4LGpsTools?.styleOverrides}
+  ${(props) => props.theme.components?.M4LGpsTools?.styleOverrides}
 `;
-const GPSTOOLSICONS = {
-  GEOMETRY_CIRCLE: "geometry_circle.svg",
-  GEOMETRY_RECTANGLE: "geometry_rectangle.svg",
-  GEOMETRY_POLYGON: "geometry_polygon.svg",
-  ADD: "add.svg",
-  MEASURE: "measure.svg",
-  GENERAL: "general.svg",
-  CONFIG: "config.svg",
-  STROKE: "stroke.svg",
-  FILL: "fill.svg",
-  EDIT: "edit.svg",
-  DELETE: "delete.svg",
-  ACTIVE: "active.svg",
-  NAME: "name.svg"
-};
 function Filter(props) {
-  const {
-    refresh,
-    setBackendQueryParams
-  } = props;
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { refresh, setBackendQueryParams } = props;
+  const { host_static_assets, environment_assets } = useEnvironment();
   const [initialFilter] = useState(() => {
     return [];
   });
@@ -385,88 +268,84 @@ function Filter(props) {
     });
     refresh();
   };
-  return /* @__PURE__ */ jsx(DynamicFilter, {
-    withAllField: true,
-    onChangeFilters: onChangeFilter,
-    fields: [{
-      name: "id",
-      dictionaryId: MAP_DICCTIONARY.LABEL_ID,
-      type: "number",
-      multiple: true,
-      presence: "optional",
-      urlIcon: `${host_static_assets}/${environment_assets}/components/${COMPONENT_MAP_TOOLS_ID}/assets/icons/${GPSTOOLSICONS.ACTIVE}`
-    }, {
-      name: "name",
-      dictionaryId: MAP_DICCTIONARY.LABEL_NAME,
-      type: "string",
-      multiple: true,
-      presence: "optional",
-      urlIcon: `${host_static_assets}/${environment_assets}/components/${COMPONENT_MAP_TOOLS_ID}/assets/icons/${GPSTOOLSICONS.NAME}`
-    }],
-    initialApplyedFilters: initialFilter
-  });
-}
-function useColumns(props) {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const columns = useMemo(() => [
+  return /* @__PURE__ */ jsx(
+    DynamicFilter,
     {
-      key: "id",
-      name: getLabel(MAP_DICCTIONARY.LABEL_ID),
-      type: "number",
-      width: 40,
-      visible: false
-    },
-    {
-      key: "name",
-      name: getLabel(MAP_DICCTIONARY.LABEL_NAME),
-      type: "string",
-      width: 300
-    },
-    {
-      key: "created_at",
-      name: getLabel(MAP_DICCTIONARY.LABEL_CREATED_AT),
-      type: "date",
-      formatter: ColumnDateFormatter({
-        presentationType: "datetime",
-        fieldValue: "row.created_at"
-      }),
-      visible: false
-    },
-    {
-      key: "updated_at",
-      name: getLabel(MAP_DICCTIONARY.LABEL_UPDATED_AT),
-      type: "date",
-      formatter: ColumnDateFormatter({
-        presentationType: "datetime",
-        fieldValue: "row.updated_at"
-      }),
-      visible: false
+      withAllField: true,
+      onChangeFilters: onChangeFilter,
+      fields: [
+        {
+          name: "id",
+          dictionaryId: MAP_DICCTIONARY.LABEL_ID,
+          type: "number",
+          multiple: true,
+          presence: "optional",
+          urlIcon: `${host_static_assets}/${environment_assets}/components/${COMPONENT_MAP_TOOLS_ID}/assets/icons/${GPSTOOLSICONS.ACTIVE}`
+        },
+        {
+          name: "name",
+          dictionaryId: MAP_DICCTIONARY.LABEL_NAME,
+          type: "string",
+          multiple: true,
+          presence: "optional",
+          urlIcon: `${host_static_assets}/${environment_assets}/components/${COMPONENT_MAP_TOOLS_ID}/assets/icons/${GPSTOOLSICONS.NAME}`
+        }
+      ],
+      initialAppliedFilters: initialFilter
     }
-  ], [getLabel]);
-  return {
-    columns
-  };
+  );
+}
+function useColumns(_props) {
+  const { getLabel } = useModuleDictionary();
+  const columns = useMemo(
+    () => [
+      {
+        key: "id",
+        name: getLabel(MAP_DICCTIONARY.LABEL_ID),
+        type: "number",
+        width: 40,
+        visible: false
+      },
+      {
+        key: "name",
+        name: getLabel(MAP_DICCTIONARY.LABEL_NAME),
+        type: "string",
+        width: 300
+      },
+      {
+        key: "created_at",
+        name: getLabel(MAP_DICCTIONARY.LABEL_CREATED_AT),
+        type: "date",
+        formatter: ColumnDateFormatter({
+          presentationType: "datetime",
+          fieldValue: "row.created_at"
+        }),
+        visible: false
+      },
+      {
+        key: "updated_at",
+        name: getLabel(MAP_DICCTIONARY.LABEL_UPDATED_AT),
+        type: "date",
+        formatter: ColumnDateFormatter({
+          presentationType: "datetime",
+          fieldValue: "row.updated_at"
+        }),
+        visible: false
+      }
+    ],
+    [getLabel]
+  );
+  return { columns };
 }
 function MyActions(props) {
-  const {
-    geofenceId
-  } = props;
-  const {
-    control
-  } = useFormContext();
+  const { geofenceId } = props;
+  const { control } = useFormContext();
   const inEdition = useWatch({
     control,
     name: "inEdition"
   });
-  const {
-    closePopup,
-    showPopup
-  } = usePopupsStore((state) => state.popupsActions);
-  const {
-    addCheckedGeofence
-  } = useGpsToolsStore((state) => state.geofenceActions);
+  const { closePopup, showPopup } = usePopupsStore((state) => state.popupsActions);
+  const { addCheckedGeofence } = useGpsToolsStore((state) => state.geofenceActions);
   const onClickCancel = () => {
     closePopup("geofencesAddEdit");
     if (geofenceId !== void 0) {
@@ -474,45 +353,12 @@ function MyActions(props) {
     }
     showPopup("gpsTools");
   };
-  return /* @__PURE__ */ jsxs(Actions, {
-    children: [/* @__PURE__ */ jsx(HelperError, {
-      name: "geometry"
-    }), /* @__PURE__ */ jsx(Button, {
-      onClick: onClickCancel,
-      disabled: inEdition,
-      children: "Cancelar"
-    }), /* @__PURE__ */ jsx(ActionFormIntro, {
-      disabled: inEdition
-    })]
-  });
+  return /* @__PURE__ */ jsxs(Actions, { children: [
+    /* @__PURE__ */ jsx(HelperError, { name: "geometry" }),
+    /* @__PURE__ */ jsx(Button, { onClick: onClickCancel, disabled: inEdition, children: "Cancelar" }),
+    /* @__PURE__ */ jsx(ActionFormIntro, { disabled: inEdition })
+  ] });
 }
-const STROKE_COLOR_DEFAULT = "#aaccaa";
-const STROKE_OPACITY_DEFAULT = { value: 1, label: "100%" };
-const STROKE_WHEIGTH_DEFAULT = { value: 1, label: "1 px" };
-const STROKE_DASH_ARRAY_DEFAULT = { value: "", label: "-----" };
-const FILL_COLOR_DEFAULT = "#aa3000";
-const FILL_OPACITY_DEFAULT = { value: 0.2, label: "20%" };
-const initialValues = {
-  name: "",
-  geofenceType: null,
-  alias: null,
-  customerId: null,
-  timeMinInSeconds: 5,
-  timeMinOutSeconds: 5,
-  inEdition: false,
-  geometry: null,
-  lat: null,
-  lng: null,
-  properties: {
-    radius: null,
-    strokeColor: STROKE_COLOR_DEFAULT,
-    strokeOpacity: STROKE_OPACITY_DEFAULT,
-    strokeWeight: STROKE_WHEIGTH_DEFAULT,
-    strokeDashArray: STROKE_DASH_ARRAY_DEFAULT,
-    fillColor: FILL_COLOR_DEFAULT,
-    fillOpacity: FILL_OPACITY_DEFAULT
-  }
-};
 const formatDataEnpoint = (response) => {
   try {
     const { data } = response;
@@ -531,7 +377,6 @@ const formatDataEnpoint = (response) => {
         fillOpacity: FILL_OPACITY_DEFAULT
       }
     };
-    console.log("formatDataEnpoint", obRet);
     if (obRet.geofenceType?.id === "gt_circle") {
       if (data.properties.radius) {
         obRet.properties.radius = data.properties.radius;
@@ -549,30 +394,32 @@ const formatDataEnpoint = (response) => {
 const getLayerFromGeometry = (geometry, geofenceTypeId, radius, options) => {
   if (geometry) {
     if (geofenceTypeId === "gt_circle" && geometry.type === "Point") {
-      return L.circle([geometry.coordinates[1], geometry.coordinates[0]], radius || 0, options);
+      return L.circle(
+        [geometry.coordinates[1], geometry.coordinates[0]],
+        radius || 0,
+        options
+      );
     } else if (geofenceTypeId === "gt_polygon" && geometry.type === "Polygon") {
       const coordinates = geometry.coordinates.map(
         (ring) => ring.map((position) => [position[1], position[0]])
       );
       return L.polygon(coordinates, options);
     } else if (geofenceTypeId === "gt_rectangle" && geometry.type === "Polygon") {
-      const latLngs = geometry.coordinates[0].map((coord) => [coord[1], coord[0]]);
-      const lats = latLngs.map(
-        (coord) => {
-          if (Array.isArray(coord)) {
-            return coord[0];
-          }
-          return 0;
-        }
+      const latLngs = geometry.coordinates[0].map(
+        (coord) => [coord[1], coord[0]]
       );
-      const lngs = latLngs.map(
-        (coord) => {
-          if (Array.isArray(coord)) {
-            return coord[1];
-          }
-          return 0;
+      const lats = latLngs.map((coord) => {
+        if (Array.isArray(coord)) {
+          return coord[0];
         }
-      );
+        return 0;
+      });
+      const lngs = latLngs.map((coord) => {
+        if (Array.isArray(coord)) {
+          return coord[1];
+        }
+        return 0;
+      });
       const southWest = [Math.min(...lats), Math.min(...lngs)];
       const northEast = [Math.max(...lats), Math.max(...lngs)];
       return L.rectangle([southWest, northEast], options);
@@ -615,14 +462,6 @@ function useDrawing() {
   const [geometrTypeIdCached, setgeofenceTypeIdCached] = useState(geofenceTypeId);
   useEffect(() => {
     if (geometry) {
-      console.log("useEffect geometry load", geometry, {
-        color: strokeColor,
-        opacity: strokeOpacity,
-        weight: strokeWeight,
-        dashArray: strokeDashArray,
-        fillColor,
-        fillOpacity
-      });
       currentLayer.current = getLayerFromGeometry(geometry, geofenceTypeId, radius, {
         color: strokeColor,
         opacity: strokeOpacity,
@@ -683,17 +522,15 @@ function useDrawing() {
           if (shape === "Circle") {
             map.on("pm:drawstart", ({ workingLayer }) => {
               workingLayer.on("pm:centerplaced", (e) => {
-                var layer = e.workingLayer;
-                layer.setStyle(
-                  {
-                    color: strokeColor,
-                    opacity: strokeOpacity,
-                    weight: strokeWeight,
-                    dashArray: strokeDashArray,
-                    fillColor,
-                    fillOpacity
-                  }
-                );
+                const layer = e.workingLayer;
+                layer.setStyle({
+                  color: strokeColor,
+                  opacity: strokeOpacity,
+                  weight: strokeWeight,
+                  dashArray: strokeDashArray,
+                  fillColor,
+                  fillOpacity
+                });
                 setValue("lat", layer.getLatLng().lat);
                 setValue("lng", layer.getLatLng().lng);
                 layer.on("pm:change", (_e) => {
@@ -705,31 +542,27 @@ function useDrawing() {
           } else if (shape === "Polygon") {
             map.on("pm:drawstart", ({ workingLayer }) => {
               workingLayer.on("pm:vertexadded", (e) => {
-                var layer = e.workingLayer;
-                layer.setStyle(
-                  {
-                    color: strokeColor,
-                    opacity: strokeOpacity,
-                    weight: strokeWeight,
-                    dashArray: strokeDashArray,
-                    fillColor,
-                    fillOpacity
-                  }
-                );
+                const layer = e.workingLayer;
+                layer.setStyle({
+                  color: strokeColor,
+                  opacity: strokeOpacity,
+                  weight: strokeWeight,
+                  dashArray: strokeDashArray,
+                  fillColor,
+                  fillOpacity
+                });
               });
             });
           }
           map.pm.enableDraw(shape);
-          map.pm.setPathOptions(
-            {
-              color: strokeColor,
-              opacity: strokeOpacity,
-              weight: strokeWeight,
-              dashArray: strokeDashArray,
-              fillColor,
-              fillOpacity
-            }
-          );
+          map.pm.setPathOptions({
+            color: strokeColor,
+            opacity: strokeOpacity,
+            weight: strokeWeight,
+            dashArray: strokeDashArray,
+            fillColor,
+            fillOpacity
+          });
           map.on("pm:create", (e) => {
             currentLayer.current = e.layer;
             setValue("geometry", currentLayer.current.toGeoJSON()?.geometry, {
@@ -744,7 +577,6 @@ function useDrawing() {
           setValue("inEdition", true);
           currentLayer.current.on("pm:disable", (e) => {
             currentLayer.current = e.layer;
-            console.log("Geometr\xEDa editada **", currentLayer.current.toGeoJSON());
             setValue("geometry", currentLayer.current.toGeoJSON()?.geometry, {
               shouldTouch: false,
               shouldValidate: true
@@ -807,10 +639,16 @@ function useSumbitErrorsFocus() {
     if (isSubmitted) {
       const firstError = Object.keys(errors).reduce((field, a) => {
         const fieldKey = field;
-        return !!errors[fieldKey] ? fieldKey : a;
+        return errors[fieldKey] ? fieldKey : a;
       }, null);
       if (firstError) {
-        let found = ["name", "geometry", "geofenceType", "timeMinInSeconds", "timeMinOutSeconds"].some((field) => field.includes(firstError));
+        const found = [
+          "name",
+          "geometry",
+          "geofenceType",
+          "timeMinInSeconds",
+          "timeMinOutSeconds"
+        ].some((field) => field.includes(firstError));
         if (found) {
           handleChange(null, "general");
         }
@@ -822,287 +660,323 @@ function useSumbitErrorsFocus() {
   }, [isSubmitted, errors]);
 }
 function GeneralData() {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const {
-    inEdition,
-    handleDraw,
-    handleFinish,
-    geometrTypeIdCached
-  } = useDrawing();
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { inEdition, handleDraw, handleFinish, geometrTypeIdCached } = useDrawing();
   useSumbitErrorsFocus();
   const urlIcon = `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GENERAL}`;
   const geofencesTypes = useMemo(() => {
-    return [{
-      id: "gt_circle",
-      name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_CIRCLE),
-      url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_CIRCLE}`
-    }, {
-      id: "gt_polygon",
-      name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_POLYGON),
-      url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_POLYGON}`
-    }, {
-      id: "gt_rectangle",
-      name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_RECTANGLE),
-      url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_RECTANGLE}`
-    }];
+    return [
+      {
+        id: "gt_circle",
+        name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_CIRCLE),
+        url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_CIRCLE}`
+      },
+      {
+        id: "gt_polygon",
+        name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_POLYGON),
+        url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_POLYGON}`
+      },
+      {
+        id: "gt_rectangle",
+        name: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_RECTANGLE),
+        url: `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.GEOMETRY_RECTANGLE}`
+      }
+    ];
   }, [getLabel]);
-  return /* @__PURE__ */ jsxs(PaperForm, {
-    urlIcon,
-    title: getLabel(MAP_DICCTIONARY.PAPER_GENERAL),
-    children: [/* @__PURE__ */ jsx(RHFTextField, {
-      name: "name",
-      disabled: false,
-      type: "text",
-      label: getLabel(`${MAP_DICCTIONARY.LABEL_NAME}`)
-    }), /* @__PURE__ */ jsxs(Stack, {
-      direction: "column",
-      spacing: 1,
-      alignItems: "center",
-      children: [/* @__PURE__ */ jsxs(Stack, {
-        direction: "row",
-        spacing: 1,
-        alignItems: "center",
-        children: [/* @__PURE__ */ jsx(RHFAutocomplete, {
-          name: "geofenceType",
-          autoComplete: "off",
-          options: geofencesTypes,
-          getOptionLabel: (option) => option.name,
-          isOptionEqualToValue: (option, value) => option.id === value.id,
-          getOptionUrlImage: (option) => option.url,
-          label: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_TYPE)
-        }), /* @__PURE__ */ jsx(Button, {
-          onClick: handleDraw,
-          disabled: inEdition || !geometrTypeIdCached,
-          children: getLabel(MAP_DICCTIONARY.LABEL_DRAW)
-        }), /* @__PURE__ */ jsx(Button, {
-          onClick: handleFinish,
-          disabled: !inEdition,
-          children: getLabel(MAP_DICCTIONARY.LABEL_FINISH)
-        })]
-      }), geometrTypeIdCached && geometrTypeIdCached === "gt_circle" && /* @__PURE__ */ jsxs(Stack, {
-        direction: "row",
-        spacing: 1,
-        alignItems: "center",
-        children: [/* @__PURE__ */ jsx(RHFTextField, {
-          name: "properties.radius",
-          label: getLabel(MAP_DICCTIONARY.LABEL_RADIUS),
-          autoComplete: "on",
-          skeletonWidth: "70%",
-          skeletonHeight: "18px",
-          disabled: true,
-          size: "medium"
-        }), /* @__PURE__ */ jsx(RHFTextField, {
-          name: "lat",
-          label: getLabel(MAP_DICCTIONARY.LABEL_LAT),
-          autoComplete: "on",
-          skeletonWidth: "70%",
-          skeletonHeight: "18px",
-          disabled: true,
-          size: "medium"
-        }), /* @__PURE__ */ jsx(RHFTextField, {
-          name: "lng",
-          label: getLabel(MAP_DICCTIONARY.LABEL_LON),
-          autoComplete: "on",
-          skeletonWidth: "70%",
-          skeletonHeight: "18px",
-          disabled: true,
-          size: "medium"
-        })]
-      })]
-    })]
-  });
+  return /* @__PURE__ */ jsxs(PaperForm, { urlIcon, title: getLabel(MAP_DICCTIONARY.PAPER_GENERAL), children: [
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "name",
+        disabled: false,
+        type: "text",
+        label: getLabel(`${MAP_DICCTIONARY.LABEL_NAME}`)
+      }
+    ),
+    /* @__PURE__ */ jsxs(Stack, { direction: "column", spacing: 1, alignItems: "center", children: [
+      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+        /* @__PURE__ */ jsx(
+          RHFAutocomplete,
+          {
+            name: "geofenceType",
+            autoComplete: "off",
+            options: geofencesTypes,
+            getOptionLabel: (option) => option.name,
+            isOptionEqualToValue: (option, value) => option.id === value.id,
+            getOptionUrlImage: (option) => option.url,
+            label: getLabel(MAP_DICCTIONARY.LABEL_GEOMETRY_TYPE)
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { onClick: handleDraw, disabled: inEdition || !geometrTypeIdCached, children: getLabel(MAP_DICCTIONARY.LABEL_DRAW) }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleFinish, disabled: !inEdition, children: getLabel(MAP_DICCTIONARY.LABEL_FINISH) })
+      ] }),
+      geometrTypeIdCached && geometrTypeIdCached === "gt_circle" && /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+        /* @__PURE__ */ jsx(
+          RHFTextField,
+          {
+            name: "properties.radius",
+            label: getLabel(MAP_DICCTIONARY.LABEL_RADIUS),
+            autoComplete: "on",
+            skeletonWidth: "70%",
+            skeletonHeight: "18px",
+            disabled: true,
+            size: "medium"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          RHFTextField,
+          {
+            name: "lat",
+            label: getLabel(MAP_DICCTIONARY.LABEL_LAT),
+            autoComplete: "on",
+            skeletonWidth: "70%",
+            skeletonHeight: "18px",
+            disabled: true,
+            size: "medium"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          RHFTextField,
+          {
+            name: "lng",
+            label: getLabel(MAP_DICCTIONARY.LABEL_LON),
+            autoComplete: "on",
+            skeletonWidth: "70%",
+            skeletonHeight: "18px",
+            disabled: true,
+            size: "medium"
+          }
+        )
+      ] })
+    ] })
+  ] });
 }
 function ConfigData() {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
   const urlIcon = `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.CONFIG}`;
-  return /* @__PURE__ */ jsxs(PaperForm, {
-    urlIcon,
-    title: getLabel(MAP_DICCTIONARY.PAPER_CONFIG),
-    children: [/* @__PURE__ */ jsx(RHFTextField, {
-      name: "alias",
-      disabled: false,
-      type: "text",
-      label: getLabel(`${MAP_DICCTIONARY.LABEL_ALIAS}`)
-    }), /* @__PURE__ */ jsx(RHFTextField, {
-      name: "customerId",
-      disabled: false,
-      type: "text",
-      label: getLabel(`${MAP_DICCTIONARY.LABEL_CUSTOMER_ID}`)
-    }), /* @__PURE__ */ jsx(RHFTextField, {
-      name: "timeMinInSeconds",
-      disabled: false,
-      type: "number",
-      label: getLabel(`${MAP_DICCTIONARY.LABEL_TIME_MIN_IN_SECONDS}`)
-    }), /* @__PURE__ */ jsx(RHFTextField, {
-      name: "timeMinOutSeconds",
-      disabled: false,
-      type: "number",
-      label: getLabel(`${MAP_DICCTIONARY.LABEL_TIME_MIN_OUT_SECONDS}`)
-    })]
-  });
+  return /* @__PURE__ */ jsxs(PaperForm, { urlIcon, title: getLabel(MAP_DICCTIONARY.PAPER_CONFIG), children: [
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "alias",
+        disabled: false,
+        type: "text",
+        label: getLabel(`${MAP_DICCTIONARY.LABEL_ALIAS}`)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "customerId",
+        disabled: false,
+        type: "text",
+        label: getLabel(`${MAP_DICCTIONARY.LABEL_CUSTOMER_ID}`)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "timeMinInSeconds",
+        disabled: false,
+        type: "number",
+        label: getLabel(`${MAP_DICCTIONARY.LABEL_TIME_MIN_IN_SECONDS}`)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "timeMinOutSeconds",
+        disabled: false,
+        type: "number",
+        label: getLabel(`${MAP_DICCTIONARY.LABEL_TIME_MIN_OUT_SECONDS}`)
+      }
+    )
+  ] });
 }
 function FillData() {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
   const urlIcon = `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.FILL}`;
-  return /* @__PURE__ */ jsxs(PaperForm, {
-    urlIcon,
-    title: getLabel(MAP_DICCTIONARY.PAPER_STROKE),
-    children: [/* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_COLOR}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFColorPicker, {
-        name: "properties.fillColor"
-      })
-    }, "properties.fillColor"), /* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_OPACITY}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFAutocomplete, {
-        name: "properties.fillOpacity",
-        autoComplete: "off",
-        options: STYLE_OPACITIES,
-        getOptionLabel: (option) => option.label,
-        isOptionEqualToValue: (option, value) => option.value === value.value,
-        label: "ssss"
-      })
-    }, "properties.fillOpacity")]
-  });
+  return /* @__PURE__ */ jsxs(PaperForm, { urlIcon, title: getLabel(MAP_DICCTIONARY.PAPER_STROKE), children: [
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_COLOR}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(RHFColorPicker, { name: "properties.fillColor" })
+      },
+      "properties.fillColor"
+    ),
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_OPACITY}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(
+          RHFAutocomplete,
+          {
+            name: "properties.fillOpacity",
+            autoComplete: "off",
+            options: STYLE_OPACITIES,
+            getOptionLabel: (option) => option.label,
+            isOptionEqualToValue: (option, value) => option.value === value.value,
+            label: "ssss"
+          }
+        )
+      },
+      "properties.fillOpacity"
+    )
+  ] });
 }
 function StrokeData() {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
   const urlIcon = `${host_static_assets}/${environment_assets}/frontend/domain/components/map/assets/icons/${GPSTOOLSICONS.STROKE}`;
-  return /* @__PURE__ */ jsxs(PaperForm, {
-    urlIcon,
-    title: getLabel(MAP_DICCTIONARY.PAPER_STROKE),
-    children: [/* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_COLOR}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFColorPicker, {
-        name: "properties.strokeColor"
-      })
-    }, "properties.strokeColor"), /* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_OPACITY}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFAutocomplete, {
-        name: "properties.strokeOpacity",
-        autoComplete: "off",
-        options: STYLE_OPACITIES,
-        getOptionLabel: (option) => option.label,
-        isOptionEqualToValue: (option, value) => option.value === value.value,
-        label: "ssss"
-      })
-    }, "properties.strokeOpacity"), /* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_WEIGHT}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFAutocomplete, {
-        name: "properties.strokeWeight",
-        autoComplete: "off",
-        options: STYLE_WHEIGHTS,
-        getOptionLabel: (option) => option.label,
-        isOptionEqualToValue: (option, value) => option.value === value.value,
-        label: "ssss"
-      })
-    }, "properties.strokeWeight"), /* @__PURE__ */ jsx(PropertyValue, {
-      property: getLabel(`${MAP_DICCTIONARY.LABEL_DASH_ARRAY}`),
-      isForm: true,
-      propertyWidth: 150,
-      value: /* @__PURE__ */ jsx(RHFAutocomplete, {
-        name: "properties.strokeDashArray",
-        autoComplete: "off",
-        options: STYLE_PATTERNS,
-        getOptionLabel: (option) => option.label,
-        isOptionEqualToValue: (option, value) => option.value === value.value,
-        label: "ssss"
-      })
-    }, "properties.strokeDashArray")]
-  });
+  return /* @__PURE__ */ jsxs(PaperForm, { urlIcon, title: getLabel(MAP_DICCTIONARY.PAPER_STROKE), children: [
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_COLOR}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(RHFColorPicker, { name: "properties.strokeColor" })
+      },
+      "properties.strokeColor"
+    ),
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_OPACITY}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(
+          RHFAutocomplete,
+          {
+            name: "properties.strokeOpacity",
+            autoComplete: "off",
+            options: STYLE_OPACITIES,
+            getOptionLabel: (option) => option.label,
+            isOptionEqualToValue: (option, value) => option.value === value.value,
+            label: "ssss"
+          }
+        )
+      },
+      "properties.strokeOpacity"
+    ),
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_WEIGHT}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(
+          RHFAutocomplete,
+          {
+            name: "properties.strokeWeight",
+            autoComplete: "off",
+            options: STYLE_WHEIGHTS,
+            getOptionLabel: (option) => option.label,
+            isOptionEqualToValue: (option, value) => option.value === value.value,
+            label: "ssss"
+          }
+        )
+      },
+      "properties.strokeWeight"
+    ),
+    /* @__PURE__ */ jsx(
+      PropertyValue,
+      {
+        property: getLabel(`${MAP_DICCTIONARY.LABEL_DASH_ARRAY}`),
+        isForm: true,
+        propertyWidth: 150,
+        value: /* @__PURE__ */ jsx(
+          RHFAutocomplete,
+          {
+            name: "properties.strokeDashArray",
+            autoComplete: "off",
+            options: STYLE_PATTERNS,
+            getOptionLabel: (option) => option.label,
+            isOptionEqualToValue: (option, value) => option.value === value.value,
+            label: "ssss"
+          }
+        )
+      },
+      "properties.strokeDashArray"
+    )
+  ] });
 }
 function StyleData() {
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [/* @__PURE__ */ jsx(StrokeData, {}), /* @__PURE__ */ jsx(FillData, {})]
-  });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(StrokeData, {}),
+    /* @__PURE__ */ jsx(FillData, {})
+  ] });
 }
 function MyTabs() {
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    currentTab,
-    handleChange
-  } = useTab();
+  const { getLabel } = useModuleDictionary();
+  const { currentTab, handleChange } = useTab();
   const geofenceAddEditTabs = useMemo(() => {
-    return [{
-      value: "general",
-      icon: void 0,
-      components: /* @__PURE__ */ jsxs(Fragment, {
-        children: [/* @__PURE__ */ jsx(GeneralData, {}), /* @__PURE__ */ jsx(ConfigData, {})]
-      }),
-      toolTip: getLabel(MAP_DICCTIONARY.TAB_GENERAL_CONFIG_TOOLTIP),
-      className: gpsToolsClasses.toolGeofencesAddEditGeneral
-    }, {
-      value: "style",
-      icon: void 0,
-      components: /* @__PURE__ */ jsx(StyleData, {}),
-      toolTip: getLabel(MAP_DICCTIONARY.TAB_STYLE_CONFIG_TOOLTIP),
-      className: gpsToolsClasses.toolGeofencesAddEditStyle
-    }];
+    return [
+      {
+        value: "general",
+        icon: void 0,
+        components: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(GeneralData, {}),
+          /* @__PURE__ */ jsx(ConfigData, {})
+        ] }),
+        toolTip: getLabel(MAP_DICCTIONARY.TAB_GENERAL_CONFIG_TOOLTIP),
+        className: gpsToolsClasses.toolGeofencesAddEditGeneral
+      },
+      {
+        value: "style",
+        icon: void 0,
+        components: /* @__PURE__ */ jsx(StyleData, {}),
+        toolTip: getLabel(MAP_DICCTIONARY.TAB_STYLE_CONFIG_TOOLTIP),
+        className: gpsToolsClasses.toolGeofencesAddEditStyle
+      }
+    ];
   }, [getLabel]);
-  return /* @__PURE__ */ jsxs("div", {
-    className: gpsToolsClasses.gpsToolsGeofencesAddEditContent,
-    children: [/* @__PURE__ */ jsx(Tabs, {
-      value: currentTab,
-      scrollButtons: "auto",
-      variant: "scrollable",
-      allowScrollButtonsMobile: true,
-      onChange: (_e, newValue) => handleChange(_e, newValue),
-      children: geofenceAddEditTabs.map((tab) => /* @__PURE__ */ jsx(Tab, {
-        value: tab.value,
-        icon: tab.icon,
-        label: /* @__PURE__ */ jsx(Tooltip, {
-          title: tab.toolTip,
-          children: /* @__PURE__ */ jsx("span", {
-            children: tab.toolTip
-          })
-        }),
-        SKTWidth: "100px",
-        SKTHeight: "14px"
-      }, tab.value))
-    }), geofenceAddEditTabs.map((tab) => {
+  return /* @__PURE__ */ jsxs("div", { className: gpsToolsClasses.gpsToolsGeofencesAddEditContent, children: [
+    /* @__PURE__ */ jsx(
+      Tabs,
+      {
+        value: currentTab,
+        scrollButtons: "auto",
+        variant: "scrollable",
+        allowScrollButtonsMobile: true,
+        onChange: (_e, newValue) => handleChange(_e, newValue),
+        children: geofenceAddEditTabs.map((tab) => /* @__PURE__ */ jsx(
+          Tab,
+          {
+            value: tab.value,
+            icon: tab.icon,
+            label: /* @__PURE__ */ jsx(Tooltip, { title: tab.toolTip, children: /* @__PURE__ */ jsx("span", { children: tab.toolTip }) }),
+            SKTWidth: "100px",
+            SKTHeight: "14px"
+          },
+          tab.value
+        ))
+      }
+    ),
+    geofenceAddEditTabs.map((tab) => {
       const isMatched = tab.value === currentTab;
-      return /* @__PURE__ */ jsx(TabContent, {
-        className: clsx(gpsToolsClasses.gpsToolsTabContent, tab.className, isMatched ? gpsToolsClasses.visible : gpsToolsClasses.hidden),
-        children: tab.components
-      }, tab.value);
-    })]
-  });
+      return /* @__PURE__ */ jsx(
+        TabContent,
+        {
+          className: clsx(
+            gpsToolsClasses.gpsToolsTabContent,
+            tab.className,
+            isMatched ? gpsToolsClasses.visible : gpsToolsClasses.hidden
+          ),
+          children: tab.components
+        },
+        tab.value
+      );
+    })
+  ] });
 }
 function GeneralDataValidation(getLabel) {
   return {
@@ -1169,10 +1043,7 @@ function useSubmit(props) {
       bodyToSnakeCase: true,
       isRemote: false
     }).then((response) => {
-      toast(
-        response.message,
-        { type: "success" }
-      );
+      toast(response.message, { type: "success" });
       closePopup("geofencesAddEdit");
       showPopup("gpsTools");
       if (objectId !== void 0) {
@@ -1187,27 +1058,23 @@ function useSubmit(props) {
   return { onSubmit };
 }
 const RHFormProviderStyled = styled(RHFormProvider)`
-    height:100%!important;
-
-    .${gpsToolsClasses.gpsToolsGeofencesAddEditContent} {
-        display:flex;
-        flex-direction:column;
-        flex-grow:1;
-        height:100%;
-    }
+  height: 100% !important;
 
+  .${gpsToolsClasses.gpsToolsGeofencesAddEditContent} {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    height: 100%;
+  }
 
-    .${gpsToolsClasses.gpsToolsTabContent}.${gpsToolsClasses.hidden} {
-        display:none;
-    }
-
+  .${gpsToolsClasses.gpsToolsTabContent}.${gpsToolsClasses.hidden} {
+    display: none;
+  }
 
-    ${(props) => props.theme.components?.M4LGpsToolsGeofencesAddEdit?.styleOverrides}
+  ${(props) => props.theme.components?.M4LGpsToolsGeofencesAddEdit?.styleOverrides}
 `;
 function GeofenceAddEdit(props) {
-  const {
-    geofenceId
-  } = props;
+  const { geofenceId } = props;
   const [finalInitalValues, omitCallEnpoint] = useGpsToolsStore((state) => {
     if (geofenceId === void 0) {
       return [initialValues, false];
@@ -1232,17 +1099,12 @@ function GeofenceAddEdit(props) {
           customerId: geofence.customerId
         }
       };
-      console.log("emulateResponse", emulateResponse);
       return [formatDataEnpoint(emulateResponse), true];
     } else {
       return [initialValues, false];
     }
   });
-  console.log("finalInitalValues", finalInitalValues);
-  const {
-    formValues,
-    statusLoad
-  } = useFormAddEdit({
+  const { formValues, statusLoad } = useFormAddEdit({
     objectId: geofenceId,
     formatDataEnpoint,
     initialValues: finalInitalValues,
@@ -1250,144 +1112,116 @@ function GeofenceAddEdit(props) {
     isRemote: false,
     omitCallEnpoint
   });
-  const {
-    validationSchema
-  } = useValidation();
-  const {
-    onSubmit
-  } = useSubmit({
-    objectId: geofenceId
-  });
-  return /* @__PURE__ */ jsxs(RHFormProviderStyled, {
-    statusLoad,
-    onSubmit,
-    values: formValues,
-    validationSchema,
-    className: gpsToolsClasses.gpsToolsGeofencesAddEdit,
-    children: [/* @__PURE__ */ jsx(TabProvider, {
-      initialValue: "general",
-      children: /* @__PURE__ */ jsx(MyTabs, {})
-    }), /* @__PURE__ */ jsx(MyActions, {
-      ...props
-    })]
-  });
+  const { validationSchema } = useValidation();
+  const { onSubmit } = useSubmit({ objectId: geofenceId });
+  return /* @__PURE__ */ jsxs(
+    RHFormProviderStyled,
+    {
+      statusLoad,
+      onSubmit,
+      values: formValues,
+      validationSchema,
+      className: gpsToolsClasses.gpsToolsGeofencesAddEdit,
+      children: [
+        /* @__PURE__ */ jsx(TabProvider, { initialValue: "general", children: /* @__PURE__ */ jsx(MyTabs, {}) }),
+        /* @__PURE__ */ jsx(MyActions, { ...props })
+      ]
+    }
+  );
 }
 function useRowActionsGetter(props) {
-  const {
-    fullRefresh
-  } = props;
-  const {
-    networkOperation
-  } = useNetwork();
-  const {
-    openModal,
-    closeModal
-  } = useModal();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    hasPrivilege
-  } = useModulePrivileges();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const {
-    hidePopup,
-    addPopup
-  } = usePopupsStore((state) => state.popupsActions, shallow);
-  const {
-    removeCheckedGeofence
-  } = useGpsToolsStore((state) => state.geofenceActions, shallow);
-  const {
-    toast
-  } = useHostTools();
+  const { fullRefresh } = props;
+  const { networkOperation } = useNetwork();
+  const { openModal, closeModal } = useModal();
+  const { getLabel } = useModuleDictionary();
+  const { hasPrivilege } = useModulePrivileges();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { hidePopup, addPopup } = usePopupsStore((state) => state.popupsActions, shallow);
+  const { removeCheckedGeofence } = useGpsToolsStore((state) => state.geofenceActions, shallow);
+  const { toast } = useHostTools();
   const isDesktop = useResponsiveDesktop();
-  const [urlIconEdit] = useState(`${host_static_assets}/${environment_assets}/frontend/components/maptools/assets/icons/${GPSTOOLSICONS.EDIT}`);
-  const [urlIconDelete] = useState(`${host_static_assets}/${environment_assets}/frontend/domain/microfrontends/maptools/assets/icons/${GPSTOOLSICONS.DELETE}`);
+  const [urlIconEdit] = useState(
+    `${host_static_assets}/${environment_assets}/frontend/components/maptools/assets/icons/${GPSTOOLSICONS.EDIT}`
+  );
+  const [urlIconDelete] = useState(
+    `${host_static_assets}/${environment_assets}/frontend/domain/microfrontends/maptools/assets/icons/${GPSTOOLSICONS.DELETE}`
+  );
   const goEdit = (objectId) => {
-    console.log("onClickAddGeofence");
     hidePopup("gpsTools");
     addPopup({
       popupId: "geofencesAddEdit",
       title: "geofencesAddEdit",
-      componentProps: {
-        fullRefresh,
-        geofenceId: objectId
-      },
+      componentProps: { fullRefresh, geofenceId: objectId },
       functionComponent: GeofenceAddEdit,
       defaultPosition: {
-        vertical: {
-          top: 50,
-          bottom: 50
-        },
-        horizontal: {
-          right: 50,
-          width: 380
-        }
+        vertical: { top: 50, bottom: 50 },
+        horizontal: { right: 50, width: 380 }
       },
       iconUrl: ""
     });
     removeCheckedGeofence(objectId);
   };
-  const onDelete = useCallback((row) => {
-    openModal({
-      window: /* @__PURE__ */ jsx(WindowConfirm, {
-        title: getLabel(MAP_DICCTIONARY.MODAL_DELETE_GEO_TITLE),
-        msg: getLabel(MAP_DICCTIONARY.MODAL_DELETE_GEO_MESSAGE),
-        onClickIntro: () => onConfirmDelete(row)
-      }),
-      variant: "delete",
-      initialWidth: 300,
-      initialHeigth: 350
-    });
-  }, [getLabel]);
+  const onDelete = useCallback(
+    (row) => {
+      openModal({
+        window: /* @__PURE__ */ jsx(
+          WindowConfirm,
+          {
+            title: getLabel(MAP_DICCTIONARY.MODAL_DELETE_GEO_TITLE),
+            msg: getLabel(MAP_DICCTIONARY.MODAL_DELETE_GEO_MESSAGE),
+            onClickIntro: () => onConfirmDelete(row)
+          }
+        ),
+        variant: "delete",
+        initialWidth: 300,
+        initialHeigth: 350
+      });
+    },
+    [getLabel]
+  );
   const onConfirmDelete = useCallback((row) => {
     networkOperation({
       method: "DELETE",
       endPoint: `geofences/${row.id}`
     }).then((response) => {
-      toast(response.message, {
-        type: "success"
-      });
+      toast(response.message, { type: "success" });
       fullRefresh();
     });
     closeModal();
   }, []);
-  const rowActionsGetter = useCallback((row) => {
-    const conditionalItems = [];
-    conditionalItems.push({
-      urlIcon: urlIconEdit,
-      dictionaryId: MAP_DICCTIONARY.ROW_ACTION_GEO_EDIT,
-      onClick: () => {
-        goEdit(row.id);
-      },
-      disabled: !row.authUserOptions.edit
-    });
-    return conditionalItems;
-  }, [hasPrivilege, goEdit, onDelete, urlIconDelete, urlIconEdit, isDesktop]);
-  return {
-    rowActionsGetter
-  };
+  const rowActionsGetter = useCallback(
+    (row) => {
+      const conditionalItems = [];
+      conditionalItems.push({
+        urlIcon: urlIconEdit,
+        dictionaryId: MAP_DICCTIONARY.ROW_ACTION_GEO_EDIT,
+        onClick: () => {
+          goEdit(row.id);
+        },
+        disabled: !row.authUserOptions.edit
+      });
+      return conditionalItems;
+    },
+    [hasPrivilege, goEdit, onDelete, urlIconDelete, urlIconEdit, isDesktop]
+  );
+  return { rowActionsGetter };
 }
 function useCheckedGeofences() {
   const layersIds = useMapStore((state) => state.layersIds, shallow);
-  const [checkedGeofences, hashGeofences] = useGpsToolsStore((state) => [state.geofenceState.checkedGeofences, state.geofenceState.hashGeofences], shallow);
-  const {
-    setCheckedGeofences,
-    updatePartialGeofence
-  } = useGpsToolsStore((state) => state.geofenceActions, shallow);
-  const {
-    setFeatureData,
-    removeFeature,
-    getFeatureIds
-  } = useMapStore((state) => state.mapActions, shallow);
-  const {
-    networkOperation
-  } = useNetwork();
+  const [checkedGeofences, hashGeofences] = useGpsToolsStore(
+    (state) => [state.geofenceState.checkedGeofences, state.geofenceState.hashGeofences],
+    shallow
+  );
+  const { setCheckedGeofences, updatePartialGeofence } = useGpsToolsStore(
+    (state) => state.geofenceActions,
+    shallow
+  );
+  const { setFeatureData, removeFeature, getFeatureIds } = useMapStore(
+    (state) => state.mapActions,
+    shallow
+  );
+  const { networkOperation } = useNetwork();
   useEffect(() => {
-    console.log("useCheckedGeofences, layersIds:", layersIds);
     if (!layersIds.includes(GeofencesFeaturesLayers.LAYER_GEOFENCES)) {
       return;
     }
@@ -1405,7 +1239,6 @@ function useCheckedGeofences() {
             isRemote: false,
             responseToCamelCase: true
           }).then((response) => {
-            console.log("onCheckedRowsChange response:", response.data);
             const geoLoaded = {
               geometry: response.data.geometry,
               name: response.data.name,
@@ -1425,12 +1258,14 @@ function useCheckedGeofences() {
             updatePartialGeofence(geofence.id, geoLoaded);
           });
         } else {
-          setFeatureData(GeofencesFeaturesLayers.LAYER_GEOFENCES, chkRow, geofence.geometry, geofence.properties, {
-            label: geofence.name
-          });
-          updatePartialGeofence(geofence.id, {
-            hasRenderizedGeofence: true
-          });
+          setFeatureData(
+            GeofencesFeaturesLayers.LAYER_GEOFENCES,
+            chkRow,
+            geofence.geometry,
+            geofence.properties,
+            { label: geofence.name }
+          );
+          updatePartialGeofence(geofence.id, { hasRenderizedGeofence: true });
         }
       }
     });
@@ -1450,16 +1285,21 @@ function useCheckedGeofences() {
 function useCheckedFeatures(layerId, featuresType, endpoint) {
   const layersIds = useMapStore((state) => state.layersIds, shallow);
   const [checkedFeatures, setCheckedFeatures, hashGeofences] = useGpsToolsStore((state) => {
-    return featuresType === "CrossingFeatures" ? [state.geofenceState.checkedCrossingFeatures, state.geofenceActions.setCheckedCrossingFeatures, state.geofenceState.hashGeofences] : [state.geofenceState.checkedInternalFeatures, state.geofenceActions.setCheckedInternalFeatures, state.geofenceState.hashGeofences];
+    return featuresType === "CrossingFeatures" ? [
+      state.geofenceState.checkedCrossingFeatures,
+      state.geofenceActions.setCheckedCrossingFeatures,
+      state.geofenceState.hashGeofences
+    ] : [
+      state.geofenceState.checkedInternalFeatures,
+      state.geofenceActions.setCheckedInternalFeatures,
+      state.geofenceState.hashGeofences
+    ];
   }, shallow);
-  const {
-    setFeatureData,
-    removeFeature,
-    getFeatureIds
-  } = useMapStore((state) => state.mapActions, shallow);
-  const {
-    networkOperation
-  } = useNetwork();
+  const { setFeatureData, removeFeature, getFeatureIds } = useMapStore(
+    (state) => state.mapActions,
+    shallow
+  );
+  const { networkOperation } = useNetwork();
   useEffect(() => {
     if (!layersIds.includes(layerId)) {
       return;
@@ -1479,13 +1319,17 @@ function useCheckedFeatures(layerId, featuresType, endpoint) {
             isRemote: false,
             responseToCamelCase: true
           }).then((response) => {
-            console.log("onCheckedGeometriesChange response:", response.data);
             geofence[`loaded${featuresType}`] = response.data;
             const newGeofenceLoadedFeatures = geofence[`loaded${featuresType}`];
             if (newGeofenceLoadedFeatures && Array.isArray(geofence[`loaded${featuresType}`])) {
               if (checkedFeatures.has(geofence.id)) {
                 newGeofenceLoadedFeatures.forEach((feature) => {
-                  setFeatureData(layerId, `geo_${geofence.id}_fid_${feature.id}`, feature.geometry, feature.properties);
+                  setFeatureData(
+                    layerId,
+                    `geo_${geofence.id}_fid_${feature.id}`,
+                    feature.geometry,
+                    feature.properties
+                  );
                 });
                 geofence[`hasRenderized${featuresType}`] = true;
               }
@@ -1494,7 +1338,12 @@ function useCheckedFeatures(layerId, featuresType, endpoint) {
           });
         } else {
           currentGeofenceLoadedFeatures.forEach((feature) => {
-            setFeatureData(layerId, `geo_${geofence.id}_fid_${feature.id}`, feature.geometry, feature.properties);
+            setFeatureData(
+              layerId,
+              `geo_${geofence.id}_fid_${feature.id}`,
+              feature.geometry,
+              feature.properties
+            );
           });
           geofence[`hasRenderized${featuresType}`] = true;
         }
@@ -1512,54 +1361,48 @@ function useCheckedFeatures(layerId, featuresType, endpoint) {
   return [checkedFeatures, setCheckedFeatures];
 }
 function useMaster() {
-  const {
-    hidePopup,
-    addPopup
-  } = usePopupsStore((state) => state.popupsActions, shallow);
+  const { hidePopup, addPopup } = usePopupsStore((state) => state.popupsActions, shallow);
   const onClickAddGeofence = () => {
-    console.log("onClickAddGeofence");
     hidePopup("gpsTools");
     addPopup({
       popupId: "geofencesAddEdit",
       title: "geofencesAddEdit",
       functionComponent: () => /* @__PURE__ */ jsx(GeofenceAddEdit, {}),
       defaultPosition: {
-        vertical: {
-          top: 50,
-          bottom: 50
-        },
-        horizontal: {
-          right: 50,
-          width: 380
-        }
+        vertical: { top: 50, bottom: 50 },
+        horizontal: { right: 50, width: 380 }
       },
       iconUrl: ""
     });
   };
-  const [checkedGeofences, hashGeofences, initialRows] = useGpsToolsStore((state) => [state.geofenceState.checkedGeofences, state.geofenceState.hashGeofences, state.geofenceState.rows], shallow);
-  const {
-    setCheckedGeofences,
-    addGeofence,
-    updatePartialGeofence,
-    updateRows
-  } = useGpsToolsStore((state) => state.geofenceActions, shallow);
+  const [checkedGeofences, hashGeofences, initialRows] = useGpsToolsStore(
+    (state) => [
+      state.geofenceState.checkedGeofences,
+      state.geofenceState.hashGeofences,
+      state.geofenceState.rows
+    ],
+    shallow
+  );
+  const { setCheckedGeofences, addGeofence, updatePartialGeofence, updateRows } = useGpsToolsStore(
+    (state) => state.geofenceActions,
+    shallow
+  );
   useCheckedGeofences();
-  const [checkedCrossingFeatures, setCheckedCrossingFeatures] = useCheckedFeatures(GeofencesFeaturesLayers.LAYER_GEOFENCES_TRANSIT_FEATURES, "CrossingFeatures", "crossing_features");
-  const [checkedInternalFeatures, setCheckedInternalFeatures] = useCheckedFeatures(GeofencesFeaturesLayers.LAYER_GEOFENCES_INTERNAL_FEATURES, "InternalFeatures", "internal_features");
+  const [checkedCrossingFeatures, setCheckedCrossingFeatures] = useCheckedFeatures(
+    GeofencesFeaturesLayers.LAYER_GEOFENCES_TRANSIT_FEATURES,
+    "CrossingFeatures",
+    "crossing_features"
+  );
+  const [checkedInternalFeatures, setCheckedInternalFeatures] = useCheckedFeatures(
+    GeofencesFeaturesLayers.LAYER_GEOFENCES_INTERNAL_FEATURES,
+    "InternalFeatures",
+    "internal_features"
+  );
   const rowKeyGetter = useCallback((row) => row.id, []);
   const [selectedRows, setSelectedRows] = useState(/* @__PURE__ */ new Set());
   const [backendQueryParams, setBackendQueryParams] = useState({});
-  const {
-    columns
-  } = useColumns();
-  const {
-    pagerState,
-    rows,
-    onPageChange,
-    onRowsPerPageChange,
-    Refresh,
-    setRows
-  } = usePaginate({
+  const { columns } = useColumns();
+  const { pagerState, rows, onPageChange, onRowsPerPageChange, Refresh, setRows } = usePaginate({
     endPoint: "geofences",
     fireOnChangeParms: false,
     fireOnFirstLoad: false,
@@ -1638,11 +1481,7 @@ function useMaster() {
     onSelectedRowsChange(selectedRows);
     updateRows(rows);
   }, [rows]);
-  const {
-    rowActionsGetter
-  } = useRowActionsGetter({
-    fullRefresh
-  });
+  const { rowActionsGetter } = useRowActionsGetter({ fullRefresh });
   return {
     rowKeyGetter,
     columns,
@@ -1662,17 +1501,17 @@ function useMaster() {
   };
 }
 const StackGeofenceListRoot = styled(Stack)`
-    padding:12px;
-    position: relative!important;
-    flex-grow:1;
-    width:100%;
+  padding: 12px;
+  position: relative !important;
+  flex-grow: 1;
+  width: 100%;
 
-    .M4LDataGrid-root{
-        height:unset!important;
-        flex-grow:1;
-    }
+  .M4LDataGrid-root {
+    height: unset !important;
+    flex-grow: 1;
+  }
 
-    ${(props) => props.theme.components?.M4LGpsToolsGeofencesList?.styleOverrides}
+  ${(props) => props.theme.components?.M4LGpsToolsGeofencesList?.styleOverrides}
 `;
 function GeofencesList() {
   const {
@@ -1692,98 +1531,118 @@ function GeofencesList() {
     rowKeyGetter,
     goToAddEdit
   } = useMaster();
-  return /* @__PURE__ */ jsxs(StackGeofenceListRoot, {
-    direction: "column",
-    gap: "8px",
-    className: gpsToolsClasses.gpsToolsGeofencesList,
-    children: [/* @__PURE__ */ jsx(Filter, {
-      refresh,
-      setBackendQueryParams
-    }), /* @__PURE__ */ jsx(DataGrid, {
-      id: "geofences",
-      columns,
-      rows,
-      onRowsChange: setRows,
-      checkedRows,
-      onCheckedRowsChange,
-      rowActionsGetter,
-      rowKeyGetter,
-      selectedRows,
-      onSelectedRowsChange,
-      withActions: true,
-      actionsProps: {
-        withPager: true,
-        withLocalFilters: true,
-        pagerOptions: {
-          records: rows.length,
-          totalRecords: pagerState.totalRecords,
-          rowsPerPageOptions: [1, 2, 3, 4, 5, 10, 25],
-          page: pagerState.page,
-          rowsPerPage: pagerState.rowsPerPage,
-          onPageChange,
-          onRowsPerPageChange
-        }
-      }
-    }, "list"), /* @__PURE__ */ jsx(Actions, {
-      children: /* @__PURE__ */ jsx(Button, {
-        onClick: () => goToAddEdit(),
-        children: "Agregar geocerca"
-      })
-    })]
-  });
+  return /* @__PURE__ */ jsxs(
+    StackGeofenceListRoot,
+    {
+      direction: "column",
+      gap: "8px",
+      className: gpsToolsClasses.gpsToolsGeofencesList,
+      children: [
+        /* @__PURE__ */ jsx(Filter, { refresh, setBackendQueryParams }),
+        /* @__PURE__ */ jsx(
+          DataGrid,
+          {
+            id: "geofences",
+            columns,
+            rows,
+            onRowsChange: setRows,
+            checkedRows,
+            onCheckedRowsChange,
+            rowActionsGetter,
+            rowKeyGetter,
+            selectedRows,
+            onSelectedRowsChange,
+            withActions: true,
+            actionsProps: {
+              withPager: true,
+              withLocalFilters: true,
+              pagerOptions: {
+                records: rows.length,
+                totalRecords: pagerState.totalRecords,
+                rowsPerPageOptions: [1, 2, 3, 4, 5, 10, 25],
+                page: pagerState.page,
+                rowsPerPage: pagerState.rowsPerPage,
+                onPageChange,
+                onRowsPerPageChange
+              }
+            }
+          },
+          "list"
+        ),
+        /* @__PURE__ */ jsx(Actions, { children: /* @__PURE__ */ jsx(Button, { onClick: () => goToAddEdit(), children: "Agregar geocerca" }) })
+      ]
+    }
+  );
 }
 function TabsGpsTools() {
-  const {
-    getLabel
-  } = useModuleDictionary();
+  const { getLabel } = useModuleDictionary();
   const status = useGpsToolsStore((state) => state.ownerState.status, shallow);
   const currentTabTool = useGpsToolsStore((state) => state.currentTabGpsTool, shallow);
-  const {
-    setCurrentTabTool
-  } = useGpsToolsStore((state) => state.gpsToolsActions, shallow);
+  const { setCurrentTabTool } = useGpsToolsStore((state) => state.gpsToolsActions, shallow);
   const toolTabs = useMemo(() => {
-    return [{
-      id: "geofences",
-      icon: void 0,
-      component: /* @__PURE__ */ jsx(GeofencesList, {}),
-      label: getLabel(MAP_DICCTIONARY.LABEL_TAB_GEO),
-      className: gpsToolsClasses.gpsToolsGeofencesList
-    }];
+    return [
+      {
+        id: "geofences",
+        icon: void 0,
+        component: /* @__PURE__ */ jsx(GeofencesList, {}),
+        label: getLabel(MAP_DICCTIONARY.LABEL_TAB_GEO),
+        className: gpsToolsClasses.gpsToolsGeofencesList
+      }
+    ];
   }, [getLabel]);
   useLayers();
   if (status !== "ready") {
     return null;
   }
-  return /* @__PURE__ */ jsxs(DivGpsToolsRoot, {
-    className: gpsToolsClasses.gpsToolsRoot,
-    children: [/* @__PURE__ */ jsx(Tabs, {
-      value: currentTabTool,
-      scrollButtons: "auto",
-      variant: "scrollable",
-      allowScrollButtonsMobile: true,
-      onChange: (_e, value) => setCurrentTabTool(value),
-      children: toolTabs.map((tab) => /* @__PURE__ */ jsx(Tab, {
-        value: tab.id,
-        icon: tab.icon,
-        label: tab.label,
-        className: clsx(gpsToolsClasses.gpsToolsTab, tab.className),
-        SKTWidth: "100px",
-        SKTHeight: "14px"
-      }, tab.id))
-    }), toolTabs.map((tab) => {
-      const isMatched = tab.id === currentTabTool;
-      return /* @__PURE__ */ jsx(TabContent, {
-        className: clsx(gpsToolsClasses.gpsToolsTabContent, tab.className, isMatched ? gpsToolsClasses.visible : gpsToolsClasses.hidden),
-        children: tab.component
-      }, tab.id);
-    })]
-  });
+  return /* @__PURE__ */ jsxs(
+    DivGpsToolsRoot,
+    {
+      className: gpsToolsClasses.gpsToolsRoot,
+      children: [
+        /* @__PURE__ */ jsx(
+          Tabs,
+          {
+            value: currentTabTool,
+            scrollButtons: "auto",
+            variant: "scrollable",
+            allowScrollButtonsMobile: true,
+            onChange: (_e, value) => setCurrentTabTool(value),
+            children: toolTabs.map((tab) => /* @__PURE__ */ jsx(
+              Tab,
+              {
+                value: tab.id,
+                icon: tab.icon,
+                label: tab.label,
+                className: clsx(gpsToolsClasses.gpsToolsTab, tab.className),
+                SKTWidth: "100px",
+                SKTHeight: "14px"
+              },
+              tab.id
+            ))
+          }
+        ),
+        toolTabs.map((tab) => {
+          const isMatched = tab.id === currentTabTool;
+          return /* @__PURE__ */ jsx(
+            TabContent,
+            {
+              className: clsx(
+                gpsToolsClasses.gpsToolsTabContent,
+                tab.className,
+                isMatched ? gpsToolsClasses.visible : gpsToolsClasses.hidden
+              ),
+              children: tab.component
+            },
+            tab.id
+          );
+        })
+      ]
+    }
+  );
 }
 function GpsTools() {
   const isSkeleton = useModuleSkeleton();
-  return /* @__PURE__ */ jsx(Fragment, {
-    children: !isSkeleton && /* @__PURE__ */ jsx(TabsGpsTools, {})
-  });
+  return /* @__PURE__ */ jsx(Fragment, { children: !isSkeleton && /* @__PURE__ */ jsx(TabsGpsTools, {}) });
 }
 export {
   GpsTools as G,