@m4l/components 7.0.0 → 7.1.2

package/components/maps/components/MapGpsTools/contexts/MapGpsToolsContext/store.js

@@ -0,0 +1,155 @@
+import { createStore } from "zustand";
+import { devtools } from "zustand/middleware";
+import { immer } from "zustand/middleware/immer";
+import { enableMapSet } from "immer";
+enableMapSet();
+const createMapGpsToolsStore = (initProps) => {
+  const startProps = {
+    currentTabGpsTool: "geofences",
+    geofenceState: {
+      // currentGeofenceTool: 'list',
+      rows: [],
+      checkedGeofences: /* @__PURE__ */ new Set(),
+      checkedCrossingFeatures: /* @__PURE__ */ new Set(),
+      checkedInternalFeatures: /* @__PURE__ */ new Set(),
+      hashGeofences: {}
+    },
+    ...initProps
+  };
+  return createStore(
+    devtools(
+      immer((set, _get) => ({
+        ...startProps,
+        gpsToolsActions: {
+          /**
+           * TODO: Documentar
+           */
+          init: () => {
+            set((state) => {
+              state.ownerState.status = "ready";
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setGpsToolsState: (status) => {
+            set((state) => {
+              state.ownerState.status = status;
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setHandlerGetLabel: (newHandler) => {
+            set((state) => {
+              state.getLabel = newHandler;
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setExternalState: (newExternalState) => {
+            set((state) => {
+              state.ownerState = { ...state.ownerState, ...newExternalState };
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setCurrentTabTool: (newTabTool) => {
+            set((state) => {
+              state.currentTabGpsTool = newTabTool;
+            });
+          }
+        },
+        geofenceActions: {
+          // goToAddEdit: (geofenceId?: GeofenceId) => {
+          //     set(state => {
+          //         state.geofenceState.currentGeofenceTool = 'add_edit';
+          //         state.geofenceState.geofenceId = geofenceId;
+          //     });
+          // },
+          // goToList: (geofenceId?: GeofenceId) => {
+          //     set(state => {
+          //         state.geofenceState.currentGeofenceTool = 'list';
+          //         state.geofenceState.geofenceId = geofenceId;
+          //     });
+          // },
+          /**
+           * TODO: Documentar
+           */
+          addGeofence: (geofenceId, geofence) => {
+            set((state) => {
+              state.geofenceState.hashGeofences[geofenceId] = geofence;
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          updatePartialGeofence: (geofenceId, geofence) => {
+            set((state) => {
+              state.geofenceState.hashGeofences[geofenceId] = {
+                ...state.geofenceState.hashGeofences[geofenceId],
+                ...geofence
+              };
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          updateRows: (newRows) => {
+            set((state) => {
+              state.geofenceState.rows = newRows;
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          addCheckedGeofence: (geofenceId) => {
+            set((state) => {
+              state.geofenceState.checkedGeofences.add(geofenceId);
+              state.geofenceState.checkedGeofences = new Set(state.geofenceState.checkedGeofences);
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          removeCheckedGeofence: (geofenceId) => {
+            set((state) => {
+              state.geofenceState.checkedGeofences.delete(geofenceId);
+              state.geofenceState.checkedGeofences = new Set(state.geofenceState.checkedGeofences);
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setCheckedGeofences: (newGeofences) => {
+            set((state) => {
+              state.geofenceState.checkedGeofences = new Set(newGeofences);
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setCheckedCrossingFeatures: (newFeatures) => {
+            set((state) => {
+              state.geofenceState.checkedCrossingFeatures = new Set(newFeatures);
+            });
+          },
+          /**
+           * TODO: Documentar
+           */
+          setCheckedInternalFeatures: (newFeatures) => {
+            set((state) => {
+              state.geofenceState.checkedInternalFeatures = new Set(newFeatures);
+            });
+          }
+        }
+      })),
+      { name: `Map Tools Store` }
+    )
+  );
+};
+export {
+  createMapGpsToolsStore as c
+};

package/components/maps/components/MapGpsTools/contexts/MapGpsToolsContext/types.d.ts

@@ -2,8 +2,8 @@ import { GetLabelType } from '@m4l/core';
 import { ReactNode } from 'react';
 import { FeatureId } from '../../../Map';
 import { CrossingFeature, GeofenceListModel, InternalFeature } from '../../subcomponents/TabsGpsTools/subcomponents/model';
-export declare type GpsToolsStatus = 'init' | 'ready';
-export declare type CurrentTabGpsTool = 'geofences' | 'pois';
+export type GpsToolsStatus = 'init' | 'ready';
+export type CurrentTabGpsTool = 'geofences' | 'pois';
 export interface GeofenceFeature extends Pick<GeofenceListModel, 'id' | 'name' | 'type' | 'geometry' | 'properties' | 'createdAt' | 'updatedAt' | 'countCrossingFeatures' | 'countInternalFeatures' | 'timeMinInSeconds' | 'timeMinOutSeconds' | 'alias' | 'customerId'> {
     hasRenderizedGeofence: boolean;
     /**
@@ -23,7 +23,7 @@ export interface GeofenceFeature extends Pick<GeofenceListModel, 'id' | 'name' |
      */
     hasRenderizedInternalFeatures: boolean;
 }
-export declare type OwnerState = {
+export type OwnerState = {
     status: GpsToolsStatus;
     /**
      *  "isMobile" cuando el navegador está en modo celular
@@ -40,15 +40,12 @@ export declare type OwnerState = {
     focus: boolean;
 };
 /**
- * @type
- * @name ExternalOwnerState
- * @description Estados que se actulizan por fuera del store, a través de hooks
+ * Estados que se actulizan por fuera del store, a través de hooks
  */
-export declare type ExternalOwnerState = Pick<OwnerState, 'isMobile' | 'isSkeleton'>;
-export declare type CurrentGeofenceTool = 'list' | 'add_edit';
+export type ExternalOwnerState = Pick<OwnerState, 'isMobile' | 'isSkeleton'>;
+export type CurrentGeofenceTool = 'list' | 'add_edit';
 /**
- * @description Tipo de dato del Id de la geocerca
- * @interface GeofenceId
+ * Tipo de dato del Id de la geocerca
  */
 export interface GeofenceState {
     rows: GeofenceListModel[];
@@ -70,13 +67,11 @@ export interface GeofenceState {
     checkedInternalFeatures: ReadonlySet<GeofenceId>;
 }
 /**
- * @description Tipo de dato del Id de la geocerca
- * @interface GeofenceId
+ * Tipo de dato del Id de la geocerca
  */
-export declare type GeofenceId = number;
+export type GeofenceId = number;
 /**
- * @interface
- * @description Interface que define el estado del componente (variables y funciones )
+ * Interface que define el estado del componente (variables y funciones )
  */
 export interface MapGpsToolsState {
     ownerState: OwnerState;
@@ -100,24 +95,24 @@ export interface MapGpsToolsStateWithActions extends MapGpsToolsState {
          */
         init(): void;
         /**
-         * @description Cambia el estado del las herramientas de gps
+         * Cambia el estado del las herramientas de gps
          */
         setGpsToolsState: (state: GpsToolsStatus) => void;
         /**
-         * @description Actualiza la variable de estado "getLabel"
+         * Actualiza la variable de estado "getLabel"
          * @param newHandler handle o función que va a traducir las etiquetas, esto es necesario debido que getLabel de useModuleDictionary
          * cambia por el useCallback, cuando el diccionario se carga.
          * @returns void
          */
         setHandlerGetLabel: (newHandler: GetLabelType) => void;
         /**
-         * @description Modifica los estados que se actualizan externamente al Store
+         * Modifica los estados que se actualizan externamente al Store
          * @param newIsMobile
          * @returns
          */
         setExternalState: (newExternalState: ExternalOwnerState) => void;
         /**
-         * @description Modifica los estados que se actualizan externamente al Store
+         * Modifica los estados que se actualizan externamente al Store
          * @param newIsMobile
          * @returns
          */
@@ -125,41 +120,41 @@ export interface MapGpsToolsStateWithActions extends MapGpsToolsState {
     };
     geofenceActions: {
         /**
-         * @description Agrega una geocerca al store
+         * Agrega una geocerca al store
          */
         addGeofence: (geofenceId: GeofenceId, geofence: GeofenceFeature) => void;
         /**
-         * @description Actualizar parcialmente una geocerca
+         * Actualizar parcialmente una geocerca
          */
         updatePartialGeofence: (geofenceId: GeofenceId, geofence: Partial<GeofenceFeature>) => void;
         /**
-         * @description Actualizar la filas que son mostradas en el grid de geocercas
+         * Actualizar la filas que son mostradas en el grid de geocercas
          */
         updateRows: (newRows: GeofenceListModel[]) => void;
         /**
-         * @description Agrega una geocerca del set de chequeo
+         * Agrega una geocerca del set de chequeo
          */
         addCheckedGeofence: (geofenceId: GeofenceId) => void;
         /**
-         * @description Cambia el set de chequeo de las geocercas
+         * Cambia el set de chequeo de las geocercas
          */
         setCheckedGeofences: (newGeofences: ReadonlySet<GeofenceId>) => void;
         /**
-         * @description Remueve una geocerca del set de chequeo
+         * Remueve una geocerca del set de chequeo
          */
         removeCheckedGeofence: (geofenceId: GeofenceId) => void;
         /**
-         * @description Cambia el set de chequeo de los crossing features
+         * Cambia el set de chequeo de los crossing features
          */
         setCheckedCrossingFeatures: (newFeatures: ReadonlySet<GeofenceId>) => void;
         /**
-         * @description Cambia el set de chequeo de los internal features
+         * Cambia el set de chequeo de los internal features
          */
         setCheckedInternalFeatures: (newFeatures: ReadonlySet<GeofenceId>) => void;
     };
 }
-export declare type DefaultMapGpsToolsStoreProps = Omit<MapGpsToolsState, 'currentLayer'>;
-export declare type InitialMapGpsToolsStoreProps = Pick<MapGpsToolsState, 'getLabel' | 'ownerState'> & Partial<DefaultMapGpsToolsStoreProps>;
+export type DefaultMapGpsToolsStoreProps = Omit<MapGpsToolsState, 'currentLayer'>;
+export type InitialMapGpsToolsStoreProps = Pick<MapGpsToolsState, 'getLabel' | 'ownerState'> & Partial<DefaultMapGpsToolsStoreProps>;
 export interface MapGpsToolsProviderProps {
     children: ReactNode;
 }

package/components/maps/components/MapGpsTools/dictionary.d.ts

@@ -1,4 +1,7 @@
 export declare const MAPGPSTOOLS_DICTIONARY_ID = "gps_tools";
+/**
+ * TODO: Documentar
+ */
 export declare function getMapGpsToolsComponentsDictionary(): string[];
 export declare const MAP_GPSTOOLS_DICCTIONARY: {
     /** Common */

package/components/maps/components/MapGpsTools/dictionary.js

@@ -0,0 +1,73 @@
+import { g as getDataGridComponentsDictionary } from "../../../DataGrid/dictionary.js";
+import { a as getDynamicFilterComponentsDictionary } from "../../../DynamicFilter/dictionary.js";
+import { g as getRHFAutocompleteComponentsDictionary } from "../../../hook-form/RHFAutocomplete/dictionary.js";
+const MAPGPSTOOLS_DICTIONARY_ID = "gps_tools";
+function getMapGpsToolsComponentsDictionary() {
+  return [MAPGPSTOOLS_DICTIONARY_ID].concat(
+    getDataGridComponentsDictionary().concat(getRHFAutocompleteComponentsDictionary()).concat(getDynamicFilterComponentsDictionary())
+  );
+}
+const MAP_GPSTOOLS_DICCTIONARY = {
+  /** Common */
+  /** GeofenceList */
+  MODULE_NAME_GEOFENCE_ADD: "module_name_geofence_add",
+  MODULE_NAME_GEOFENCE_EDIT: "module_name_geofence_edit",
+  // Row Actions
+  ROW_ACTION_GEO_EDIT: "row_action_geo_edit",
+  // ROW_ACTION_GEO_ENABLE: 'row_action_geo_enable',
+  // ROW_ACTION_GEO_DISABLE: 'row_action_geo_disable',
+  ROW_ACTION_GEO_DELETE: "row_action_geo_delete",
+  /** GeofenceAddEdit */
+  LABEL_TAB_GEO: "label_tab_geo",
+  TAB_GENERAL_CONFIG_TOOLTIP: "tab_general_config_tooltip",
+  PAPER_GENERAL: "paper_general",
+  LABEL_ID: "label_id",
+  LABEL_NAME: "label_name",
+  LABEL_ALIAS: "label_alias",
+  LABEL_CUSTOMER_ID: "label_customer_id",
+  LABEL_GEOMETRY_TYPE: "label_geometry_type",
+  LABEL_GEOMETRY_CIRCLE: "label_geometry_circle",
+  LABEL_GEOMETRY_RECTANGLE: "label_geometry_rectangle",
+  LABEL_GEOMETRY_POLYGON: "label_geometry_polygon",
+  LABEL_DRAW: "label_draw",
+  LABEL_FINISH: "label_finish",
+  PAPER_CONFIG: "paper_config",
+  LABEL_TIME_MIN_IN_SECONDS: "label_time_min_in_seconds",
+  LABEL_TIME_MIN_OUT_SECONDS: "label_time_min_out_seconds",
+  TAB_STYLE_CONFIG_TOOLTIP: "tab_style_tooltip",
+  PAPER_STROKE: "paper_stroke",
+  LABEL_COLOR: "label_color",
+  LABEL_OPACITY: "label_opacity",
+  LABEL_WEIGHT: "label_weight",
+  LABEL_DASH_ARRAY: "label_dash_array",
+  PAPER_FILL: "paper_fill",
+  LABEL_RADIUS: "label_radius",
+  LABEL_LAT: "label_lat",
+  LABEL_LON: "label_lon",
+  LABEL_PLACE_MARKER: "label_place_marker",
+  LABEL_FIRST_VERTEX: "label_first_vertex",
+  LABEL_CONTINUE_LINE: "label_continue_line",
+  LABEL_FINISH_LINE: "label_finish_line",
+  LABEL_FINISH_POLY: "label_finish_poly",
+  LABEL_FINISH_RECT: "label_finish_rect",
+  LABEL_START_CIRCLE: "label_start_circle",
+  LABEL_FINISH_CIRCLE: "label_finish_circle",
+  LABEL_PLACE_CIRCLE_MARKER: "label_place_circle_marker",
+  VALIDATION_GEOMETRY_REQUIRED: "validation_geometry_required",
+  VALIDATION_FIELD_REQUIRED: "validation_field_required",
+  VALIDATION_FIELD_TYPE_NUMBER_ERROR: "validation_field_type_number_error",
+  VALIDATION_FIELD_MIN_NUMBER_ERROR: "validation_field_min_number_error",
+  LABEL_VIEW_TRANSIT_FEATURES: "label_view_crossing_features",
+  LABEL_VIEW_INTERNAL_FEATURES: "label_view_internal_features",
+  LABEL_CREATED_AT: "label_created_at",
+  LABEL_UPDATED_AT: "label_updated_at",
+  MODAL_DELETE_GEO_TITLE: "modal_delete_geo_title",
+  MODAL_DELETE_GEO_MESSAGE: "modal_delete_geo_message",
+  MODAL_DISABLE_GEO_TITLE: "modal_disable_geo_title",
+  MODAL_DISABLE_MESSAGE: "modal_disable_geo_message",
+  ACTION_CANCEL: "action_cancel"
+};
+export {
+  MAP_GPSTOOLS_DICCTIONARY as M,
+  getMapGpsToolsComponentsDictionary as g
+};

package/components/maps/components/MapGpsTools/hooks/useLayers/index.d.ts

@@ -1 +1,4 @@
+/**
+ * TODO: Documentar
+ */
 export declare function useLayers(): void;

package/components/maps/components/MapGpsTools/hooks/useLayers/index.js

@@ -0,0 +1,57 @@
+import { useEffect } from "react";
+import { shallow } from "zustand/shallow";
+import { u as useMapGpsToolsStore } from "../useMapGpsToolsStore/index.js";
+import { C as CommonFeatureRender } from "../../../Map/featureRenders/CommonFeatureRender/index.js";
+import { G as GeofencesFeaturesLayers } from "../../subcomponents/TabsGpsTools/subcomponents/constants.js";
+import { u as useMapStore } from "../../../Map/hooks/useMapStore/index.js";
+function useLayers() {
+  const { addLayer, removeLayer } = useMapStore((state) => state.mapActions, shallow);
+  const { init } = useMapGpsToolsStore((state) => state.gpsToolsActions, shallow);
+  useEffect(() => {
+    addLayer({
+      layerId: GeofencesFeaturesLayers.LAYER_GEOFENCES,
+      name: "Geocercas",
+      renderFeature: CommonFeatureRender,
+      geoJsonObject: {
+        object: {
+          type: "FeatureCollection",
+          features: []
+        }
+      },
+      autoFocus: false
+    });
+    addLayer({
+      layerId: GeofencesFeaturesLayers.LAYER_GEOFENCES_TRANSIT_FEATURES,
+      name: "Geometrías de tránsito",
+      renderFeature: CommonFeatureRender,
+      geoJsonObject: {
+        object: {
+          type: "FeatureCollection",
+          features: []
+        }
+      },
+      autoFocus: false
+    });
+    addLayer({
+      layerId: GeofencesFeaturesLayers.LAYER_GEOFENCES_INTERNAL_FEATURES,
+      name: "Geometrías internas",
+      renderFeature: CommonFeatureRender,
+      geoJsonObject: {
+        object: {
+          type: "FeatureCollection",
+          features: []
+        }
+      },
+      autoFocus: false
+    });
+    init();
+    return () => {
+      removeLayer(GeofencesFeaturesLayers.LAYER_GEOFENCES);
+      removeLayer(GeofencesFeaturesLayers.LAYER_GEOFENCES_INTERNAL_FEATURES);
+      removeLayer(GeofencesFeaturesLayers.LAYER_GEOFENCES_TRANSIT_FEATURES);
+    };
+  }, []);
+}
+export {
+  useLayers as u
+};

package/components/maps/components/MapGpsTools/hooks/useMapGpsToolsStore/index.d.ts

@@ -1,2 +1,5 @@
 import { MapGpsToolsStateWithActions } from '../../contexts/MapGpsToolsContext/types';
+/**
+ * TODO: Documentar
+ */
 export declare function useMapGpsToolsStore<T>(selector: (state: MapGpsToolsStateWithActions) => T, equalityFn?: (left: T, right: T) => boolean): T;

package/components/maps/components/MapGpsTools/hooks/useMapGpsToolsStore/index.js

@@ -0,0 +1,13 @@
+import { useContext } from "react";
+import { useStore } from "zustand";
+import { M as MapGpsToolsContext } from "../../contexts/MapGpsToolsContext/index.js";
+function useMapGpsToolsStore(selector, equalityFn) {
+  const context = useContext(MapGpsToolsContext);
+  if (!context) {
+    throw new Error("useGpsToolsStore context must be use inside GpsToolsContext");
+  }
+  return useStore(context, selector, equalityFn);
+}
+export {
+  useMapGpsToolsStore as u
+};

package/components/maps/components/MapGpsTools/icons.js

@@ -0,0 +1,26 @@
+const MAP_GPSTOOLS_ICONS = {
+  /**
+   * GpsTools
+   */
+  MAP_GPS_TOOLS_TOOL: "cmp_map_gpstools_tool.svg",
+  GEOFENCES: "cmp_map_gpstools_geofences.svg",
+  GEOFENCE_ID: "cmp_map_gpstools_geofence_id.svg",
+  GEOFENCE_NAME: "cmp_map_gpstools_geofence_name.svg",
+  GEOFENCE_ADD: "cmp_map_gpstools_add-geofence.svg",
+  GEOFENCE_EDIT: "cmp_map_gpstools_edit-geofence.svg",
+  GEOFENCE_DELETE: "cmp_map_gpstools_delete-geofence.svg",
+  GENERAL: "cmp_map_gpstools_general.svg",
+  DATA: "cmp_map_gpstools_data.svg",
+  STYLE: "cmp_map_gpstools_style.svg",
+  GEOFENCE_DRAW: "cmp_map_gpstools_draw.svg",
+  GEOFENCE_FINISH: "cmp_map_gpstools_finish.svg",
+  GEOFENCE_TYPE_CIRCLE: "cmp_map_gpstools_circle.svg",
+  GEOFENCE_TYPE_RECTANGLE: "cmp_map_gpstools_rectangle.svg",
+  GEOFENCE_TYPE_POLYGON: "cmp_map_gpstools_polygon.svg",
+  CONFIG: "cmp_map_gpstools_config.svg",
+  STROKE: "cmp_map_gpstools_stroke.svg",
+  FILL: "cmp_map_gpstools_fill.svg"
+};
+export {
+  MAP_GPSTOOLS_ICONS as M
+};

package/components/maps/components/MapGpsTools/index.js

@@ -0,0 +1 @@
+

package/components/maps/components/MapGpsTools/styles.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
-export declare const DivTabGpsToolsRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DivTabGpsToolsRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/maps/components/MapGpsTools/styles.js

@@ -0,0 +1,21 @@
+import { styled } from "@mui/material/styles";
+import { g as gpsToolsClasses } from "./classes/index.js";
+const DivTabGpsToolsRoot = styled("div")`
+  .${gpsToolsClasses.gpsToolsTabContent}.${gpsToolsClasses.hidden} {
+    display: none;
+  }
+
+  .${gpsToolsClasses.gpsToolsGeofencesList} .M4LDataGrid-root {
+    height: unset !important;
+    flex-grow: 1;
+  }
+
+  .${gpsToolsClasses.toolGeofencesAddEditGeneral} {
+    flex-grow: 1;
+  }
+
+  ${(props) => props.theme.components?.M4LMapGpsTools?.styleOverrides}
+`;
+export {
+  DivTabGpsToolsRoot as D
+};

package/components/maps/components/MapGpsTools/subcomponents/TabsGpsTools/index.d.ts

@@ -1,11 +1,9 @@
 /**
- * @description Componente que renderiza las herramientas de GPS a traves de los tabs
+ * Componente que renderiza las herramientas de GPS a traves de los tabs
  * Funcionalidad:
  *  - Cuando se cambia el tab, se actualiza el subtitulo del popup
  *  - Los tabs no visible se ocultan a traves de css, para que no destruyan los componentes evitando
  *    la recargar de los mismos entre cambio de pestañas.
- *
- *
  * @returns Tabs con las herramientas de GPS
  */
 export declare function TabsGpsTools(): import("react/jsx-runtime").JSX.Element | null;

package/components/maps/components/MapGpsTools/subcomponents/TabsGpsTools/index.js

@@ -0,0 +1,90 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useEffect } from "react";
+import { useModuleDictionary, useEnvironment } from "@m4l/core";
+import "leaflet";
+import { shallow } from "zustand/shallow";
+import "@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css";
+import "@geoman-io/leaflet-geoman-free";
+import clsx from "clsx";
+import { D as DivTabGpsToolsRoot } from "../../styles.js";
+import { T as Tab } from "../../../../../mui_extended/Tab/index.js";
+import { G as GeofencesList } from "./subcomponents/GeofencesList/index.js";
+import { u as useLayers } from "../../hooks/useLayers/index.js";
+import { M as MAP_GPSTOOLS_DICCTIONARY } from "../../dictionary.js";
+import { g as gpsToolsClasses } from "../../classes/index.js";
+import { M as MAP_GPSTOOLS_ICONS } from "../../icons.js";
+import { G as GPS_TOOLS_POPUP_ID } from "../../../Map/constants.js";
+import { u as useMapGpsToolsStore } from "../../hooks/useMapGpsToolsStore/index.js";
+import { u as usePopupsStore } from "../../../../../popups/components/PopupsProvider/hooks/usePopupsStore/index.js";
+import { T as Tabs } from "../../../../../mui_extended/Tabs/Tabs.js";
+import { T as TabContent } from "../../../../../mui_extended/TabContent/TabContent.js";
+import { I as Icon } from "../../../../../Icon/Icon.js";
+function TabsGpsTools() {
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const status = useMapGpsToolsStore((state) => state.ownerState.status, shallow);
+  const currentTabTool = useMapGpsToolsStore((state) => state.currentTabGpsTool, shallow);
+  const { setCurrentTabTool } = useMapGpsToolsStore((state) => state.gpsToolsActions, shallow);
+  const { updatePopup } = usePopupsStore((state) => state.popupsActions, shallow);
+  const toolTabs = useMemo(() => {
+    return [
+      {
+        id: "geofences",
+        iconUrl: `${host_static_assets}/${environment_assets}/frontend/components/map_gpstools/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES}`,
+        component: /* @__PURE__ */ jsx(GeofencesList, {}),
+        label: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_TAB_GEO),
+        className: gpsToolsClasses.gpsToolsGeofencesList
+      }
+    ];
+  }, [getLabel]);
+  useEffect(() => {
+    updatePopup(GPS_TOOLS_POPUP_ID, {
+      subTitle: currentTabTool === "geofences" ? getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_TAB_GEO) : ""
+    });
+  }, [currentTabTool]);
+  useLayers();
+  if (status !== "ready") {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(DivTabGpsToolsRoot, { 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: /* @__PURE__ */ jsx(Icon, { src: tab.iconUrl }),
+            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
+      );
+    })
+  ] });
+}
+export {
+  TabsGpsTools as T
+};

package/components/maps/components/MapGpsTools/subcomponents/TabsGpsTools/subcomponents/GeofenceAddEdit/constants.js

@@ -0,0 +1,40 @@
+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 = {
+  /** General Data */
+  name: "",
+  geofenceType: null,
+  /** Config Data */
+  alias: null,
+  customerId: null,
+  timeMinInSeconds: 5,
+  timeMinOutSeconds: 5,
+  /** de Apoyo */
+  inEdition: false,
+  geometry: null,
+  lat: null,
+  lng: null,
+  properties: {
+    radius: null,
+    /** Style Data */
+    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
+  }
+};
+export {
+  FILL_COLOR_DEFAULT as F,
+  STROKE_COLOR_DEFAULT as S,
+  STROKE_OPACITY_DEFAULT as a,
+  STROKE_WHEIGTH_DEFAULT as b,
+  STROKE_DASH_ARRAY_DEFAULT as c,
+  FILL_OPACITY_DEFAULT as d,
+  initialValues as i
+};