@m4l/components 1.1.1 → 2.0.0

package/components/hook-form/RHFAutocompleteAsync/types.d.ts

@@ -1,9 +1,12 @@
-import { RHFAutocompleteProps } from '../RHFAutocomplete/types';
-export declare type RHFAutocompleteAsyncProps<T> = {
+import { ImageProps, RHFAutocompleteBaseProps, RHFAutocompleteTypeTextProps } from '../RHFAutocomplete/types';
+export interface RHFAutocompleteAsyncBaseProps {
     endPoint: string;
     timeout?: number;
     parms?: Record<string, any>;
     resultField?: string;
     isRemote?: boolean;
     onChangeFilterParms?: (newValue: string) => Record<string, any>;
-} & Omit<RHFAutocompleteProps<T>, 'options' | 'onChangeSearchInput'>;
+}
+export declare type RHFAutocompleteAsyncProps<T> = (Omit<RHFAutocompleteBaseProps<T>, 'options' | 'onChangeSearchInput'> & ImageProps<T> & RHFAutocompleteAsyncBaseProps) | (Omit<RHFAutocompleteBaseProps<T>, 'options' | 'onChangeSearchInput'> & RHFAutocompleteTypeTextProps & RHFAutocompleteAsyncBaseProps);
+export declare type ComponentImageProps<T> = RHFAutocompleteAsyncBaseProps & Omit<RHFAutocompleteBaseProps<T>, 'options' | 'onChangeSearchInput'> & ImageProps<T>;
+export declare type ComponentTextProps<T> = RHFAutocompleteAsyncBaseProps & Omit<RHFAutocompleteBaseProps<T>, 'options' | 'onChangeSearchInput'> & RHFAutocompleteTypeTextProps;

package/components/hook-form/RHFCheckbox/{index.71751a9d.js → index.06c0b776.js}

@@ -1,14 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useFormContext, Controller } from "react-hook-form";
-import { aj as RHFCheckboxRoot, ak as ContainerCheckTypography } from "../../../styles/index.7868464e.js";
+import { aj as RHFCheckboxRoot, ak as ContainerCheckTypography } from "../../../styles/index.d972f170.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useModuleSkeleton } from "@m4l/core";
 import { useFormFocus } from "../../../index.js";
-import { C as CheckBox } from "../../mui_extended/CheckBox.ae30825c.js";
+import { C as CheckBox } from "../../mui_extended/CheckBox.4d930bed.js";
 generateUtilityClasses("M4LRHFCheckbox", [
   "root",
   "checkTypography",

package/components/hook-form/RHFColorPicker/{index.3a8f36b1.js → index.f606dce6.js}

@@ -3,17 +3,17 @@ import { useState } from "react";
 import { useFormContext, useWatch, Controller } from "react-hook-form";
 import { useModuleSkeleton, useEnvironment, useModuleDictionary } from "@m4l/core";
 import { SketchPicker } from "react-color";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 import { generateUtilityClasses, generateUtilityClass, Skeleton } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
-import { al as RHFColorPickerRoot } from "../../../styles/index.7868464e.js";
+import { al as RHFColorPickerRoot } from "../../../styles/index.d972f170.js";
 import { useTheme } from "@mui/material/styles";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.a6235bcc.js";
-import { P as Popover } from "../../mui_extended/Popover/index.82970357.js";
-import { I as Icon } from "../../Icon/index.e06c693f.js";
-import { B as Button } from "../../mui_extended/Button/index.a391ee9f.js";
+import { F as FieldLabel } from "../../FieldLabel/index.44f3e099.js";
+import { P as Popover } from "../../mui_extended/Popover/index.6d8fe229.js";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
+import { B as Button } from "../../mui_extended/Button/index.24b9496b.js";
 const componentName = "M4LRHFColorPicker";
 const colorPickerClasses = generateUtilityClasses(componentName, [
   "root",

package/components/hook-form/RHFDateTime/{index.2f4ce21c.js → index.fb4867fa.js}

@@ -7,12 +7,12 @@ import { useFormatter, useResponsiveDesktop } from "@m4l/graphics";
 import { useState, useEffect } from "react";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";
-import { am as RHFDateTimeRoot } from "../../../styles/index.7868464e.js";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { am as RHFDateTimeRoot } from "../../../styles/index.d972f170.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.a6235bcc.js";
-import { I as Icon } from "../../Icon/index.e06c693f.js";
+import { F as FieldLabel } from "../../FieldLabel/index.44f3e099.js";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
 const SkeletonRHFDateTime = (props) => {
   const { skeletonWidth, skeletonHeight, className, label } = props;
   return /* @__PURE__ */ jsxs(Fragment, { children: [

package/components/hook-form/RHFPeriod/{index.acf46fb2.js → index.75e07583.js}

@@ -1,13 +1,13 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { an as RHFPeriodRoot } from "../../../styles/index.7868464e.js";
+import { an as RHFPeriodRoot } from "../../../styles/index.d972f170.js";
 import { useFormContext, Controller } from "react-hook-form";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { useModuleSkeleton } from "@m4l/core";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.a6235bcc.js";
-import { P as Period } from "../../Period/index.732248a8.js";
+import { F as FieldLabel } from "../../FieldLabel/index.44f3e099.js";
+import { P as Period } from "../../Period/index.f0095a0a.js";
 const componentName = "M4LRHFPeriod";
 generateUtilityClasses(componentName, [
   "root",

package/components/hook-form/RHFRadioGroup/RHFRadioGroup.d.ts

@@ -1,3 +1,3 @@
 import { RadioGroupProps, RadioProps } from '@mui/material';
 import { RHFRadioGroupProps } from './types';
-export declare function RHFRadioGroup<TOption extends RadioProps>({ name, options, getOptionLabel, getOptionValue, ...other }: RHFRadioGroupProps<TOption> & RadioGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function RHFRadioGroup<TOption extends RadioProps>({ name, options, getOptionLabel, getOptionValue, getOptionIconUrl, renderOptionLabel, ControlLabel, ...other }: RHFRadioGroupProps<TOption> & RadioGroupProps): import("react/jsx-runtime").JSX.Element;

package/components/hook-form/RHFRadioGroup/formatters/OptionIconLabelFormatter/index.d.ts

@@ -0,0 +1,2 @@
+import { GetOptionStringType } from "../../types";
+export declare function OptionIconLabelFormatter<T>(option: T, getOptionLabel: GetOptionStringType<T>, getOptionIconUrl: GetOptionStringType<T>): import("react/jsx-runtime").JSX.Element;

package/components/hook-form/RHFRadioGroup/index.a0a28a48.js

@@ -0,0 +1,52 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useFormContext, Controller } from "react-hook-form";
+import { RadioGroup, FormControlLabel, FormHelperText, Radio } from "@mui/material";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
+function OptionIconLabelFormatter(option, getOptionLabel, getOptionIconUrl) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      Icon,
+      {
+        src: `${getOptionIconUrl(option)}`
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { children: getOptionLabel(option) })
+  ] });
+}
+function RHFRadioGroup({
+  name,
+  options,
+  getOptionLabel,
+  getOptionValue,
+  getOptionIconUrl,
+  renderOptionLabel = OptionIconLabelFormatter,
+  ControlLabel = Radio,
+  ...other
+}) {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsx(
+    Controller,
+    {
+      name,
+      control,
+      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(RadioGroup, { ...field, row: true, ...other, children: options.map((option) => {
+          return /* @__PURE__ */ jsx(
+            FormControlLabel,
+            {
+              defaultValue: field.value,
+              value: getOptionValue(option),
+              control: /* @__PURE__ */ jsx(ControlLabel, { ...option }),
+              label: renderOptionLabel(option, getOptionLabel, getOptionIconUrl)
+            },
+            getOptionValue(option)
+          );
+        }) }),
+        !!error && /* @__PURE__ */ jsx(FormHelperText, { error: true, sx: { px: 2 }, children: error.message })
+      ] })
+    }
+  );
+}
+export {
+  RHFRadioGroup as R
+};

package/components/hook-form/RHFRadioGroup/types.d.ts

@@ -1,8 +1,14 @@
 import { RadioProps } from '@mui/material';
-export interface RHFRadioGroupProps<TOption extends RadioProps> {
+import { ReactNode } from 'react';
+export declare type GetOptionStringType<T> = (option: T) => string;
+export declare type RenderOptionLabelType<T> = (option: T, getOptionLabel: GetOptionStringType<T>, getOptionIconUrl: GetOptionStringType<T>) => ReactNode;
+export interface RHFRadioGroupProps<T extends RadioProps> {
     name: string;
     defaultValue?: string;
-    options: TOption[];
-    getOptionLabel: (option: TOption) => string;
-    getOptionValue: (option: TOption) => string;
+    ControlLabel?: (props: RadioProps) => React.ReactElement<any, any>;
+    options: T[];
+    getOptionLabel: GetOptionStringType<T>;
+    getOptionValue: GetOptionStringType<T>;
+    getOptionIconUrl: GetOptionStringType<T>;
+    renderOptionLabel: RenderOptionLabelType<T>;
 }

package/components/hook-form/RHFTextField/{index.06342648.js → index.257c6486.js}

@@ -2,16 +2,16 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useModuleSkeleton, useEnvironment } from "@m4l/core";
 import { Skeleton, generateUtilityClasses, TextField, InputAdornment, generateUtilityClass } from "@mui/material";
 import { forwardRef, useState, useEffect } from "react";
-import { I as IconButton } from "../../mui_extended/IconButton/index.97e91dae.js";
+import { I as IconButton } from "../../mui_extended/IconButton/index.f5dcf537.js";
 import { useFormContext, Controller } from "react-hook-form";
-import { ao as SkeletonTextFieldRoot, ap as WrapperSkeletonRHFTextField, aq as RHFTextFieldRoot, ar as RHFTextFieldPasswordRoot } from "../../../styles/index.7868464e.js";
+import { ao as SkeletonTextFieldRoot, ap as WrapperSkeletonRHFTextField, aq as RHFTextFieldRoot, ar as RHFTextFieldPasswordRoot } from "../../../styles/index.d972f170.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../utils/index.14912462.js";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useFormFocus } from "../../../index.js";
-import { F as FieldLabel } from "../../FieldLabel/index.a6235bcc.js";
+import { F as FieldLabel } from "../../FieldLabel/index.44f3e099.js";
 const RHFTEXTFIELD_ROOT_TEST_ID = "RHFTextFieldRoot";
 const RHFTEXTFIELD_INPUT_TEST_ID = "RHFTextFieldInput";
 const RHFTEXTFIELD_PREFIX = "RHFTextField";

package/components/hook-form/RHFUpload/{index.ef58c607.js → index.a6954d0d.js}

@@ -3,15 +3,15 @@ import { useCallback } from "react";
 import { useFormContext, Controller } from "react-hook-form";
 import isString from "lodash/isString";
 import { useDropzone } from "react-dropzone";
-import { I as Image } from "../../Image/index.8a3d05d3.js";
+import { I as Image } from "../../Image/index.fb9e71ba.js";
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
-import { as as UploadImageRoot, at as WrapperRHFUploadImage } from "../../../styles/index.7868464e.js";
+import { as as UploadImageRoot, at as WrapperRHFUploadImage } from "../../../styles/index.d972f170.js";
 import { Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
-import { T as Typography } from "../../mui_extended/Typography/index.8a0f958b.js";
-import { B as Button } from "../../mui_extended/Button/index.a391ee9f.js";
-import { H as HelperText } from "../../HelperText/index.b1961313.js";
+import { T as Typography } from "../../mui_extended/Typography/index.dbc44e77.js";
+import { B as Button } from "../../mui_extended/Button/index.24b9496b.js";
+import { H as HelperText } from "../../HelperText/index.e9eddfe4.js";
 const ICON_PREFIX = "M4LRHFUploadImage";
 const getNameRHFUploadImageDataTestId = (KEY) => {
   return `${ICON_PREFIX}-${KEY}`;

package/components/maps/components/GpsTools/{index.3cc627c5.js → index.30fe41d1.js}

@@ -5,42 +5,42 @@ 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 { au as RHFormProviderStyled, av as StackGeofenceListRoot, aw as DivTabGpsToolsRoot } from "../../../../styles/index.7868464e.js";
-import { D as DynamicFilter } from "../../../DynamicFilter/index.e737845f.js";
-import { C as ColumnIconFormatter } from "../../../DataGrid/formatters/index.4b65c281.js";
+import { au as RHFormProviderStyled, av as StackGeofenceListRoot, aw as DivTabGpsToolsRoot } from "../../../../styles/index.d972f170.js";
+import { D as DynamicFilter } from "../../../DynamicFilter/index.a7e772f7.js";
+import { C as ColumnIconFormatter } from "../../../DataGrid/formatters/index.91129d5e.js";
 import { C as ColumnDateFormatter } from "../../../DataGrid/formatters/ColumnDateFormatter/index.e00d0cf2.js";
 import { useResponsiveDesktop, useFirstRender } from "@m4l/graphics";
 import { useFormContext, useWatch, useFormState } from "react-hook-form";
-import { H as HelperError } from "../../../hook-form/HelperError/index.a0faefe4.js";
-import { u as useModal } from "../../../../hooks/useModal/index.538e8219.js";
-import { u as usePopupsStore } from "../../../popups/PopupsProvider/index.6591c56e.js";
+import { H as HelperError } from "../../../hook-form/HelperError/index.c6f8f840.js";
+import { u as useModal } from "../../../../hooks/useModal/index.d3c18b29.js";
+import { u as usePopupsStore } from "../../../popups/PopupsProvider/index.776c62e7.js";
 import { createStore, useStore } from "zustand";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
 import { enableMapSet } from "immer";
-import { A as ActionFormIntro } from "../../../CommonActions/components/ActionFormIntro/index.3187e7a7.js";
-import { W as WindowConfirm } from "../../../modal/WindowConfirm.141e19a9.js";
-import { A as Actions } from "../../../CommonActions/components/Actions/index.84b8fd47.js";
-import { B as Button } from "../../../mui_extended/Button/index.a391ee9f.js";
+import { A as ActionFormIntro } from "../../../CommonActions/components/ActionFormIntro/index.0daa98b8.js";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm.b8a431dd.js";
+import { A as Actions } from "../../../CommonActions/components/Actions/index.434f4824.js";
+import { B as Button } from "../../../mui_extended/Button/index.24b9496b.js";
 import { useMap } from "react-leaflet";
 import * as L from "leaflet";
 import { u as useFormReadyForUpdate } from "../../../../hooks/useFormReadyForUpdate/index.f60f500e.js";
-import { u as useTab } from "../../../../hooks/useTab/index.bc8d38fc.js";
+import { u as useTab } from "../../../../hooks/useTab/index.da9b5a24.js";
 import { generateUtilityClasses } from "@mui/material";
 import "@mui/base";
-import { P as PaperForm } from "../../../PaperForm/index.f1467e34.js";
-import { R as RHFAutocomplete } from "../../../hook-form/RHFAutocomplete/index.dab5e2d6.js";
-import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.06342648.js";
-import { S as Stack } from "../../../mui_extended/Stack/index.e64a379b.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.97e91dae.js";
-import { P as PropertyValue } from "../../../PropertyValue/index.f85c4118.js";
-import { R as RHFColorPicker } from "../../../hook-form/RHFColorPicker/index.3a8f36b1.js";
-import { T as Tabs, a as Tab, b as TabContent, c as TabProvider } from "../../../mui_extended/Tab/index.f31eb904.js";
-import { I as Icon } from "../../../Icon/index.e06c693f.js";
+import { P as PaperForm } from "../../../PaperForm/index.d6293e64.js";
+import { R as RHFAutocomplete } from "../../../hook-form/RHFAutocomplete/index.c8bcfed8.js";
+import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.257c6486.js";
+import { S as Stack } from "../../../mui_extended/Stack/index.9d6ed8c2.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.f5dcf537.js";
+import { P as PropertyValue } from "../../../PropertyValue/index.5d847b88.js";
+import { R as RHFColorPicker } from "../../../hook-form/RHFColorPicker/index.f606dce6.js";
+import { T as Tabs, a as Tab, b as TabContent, c as TabProvider } from "../../../mui_extended/Tab/index.0941bb3a.js";
+import { I as Icon } from "../../../Icon/index.2b591dd6.js";
 import * as Yup from "yup";
-import { u as useFormAddEdit } from "../../../../hooks/useFormAddEdit/index.dfb5570d.js";
-import { u as useMapStore, C as CommonFeatureRender, G as GPS_TOOLS_POPUP_ID } from "../Map/index.c50fc538.js";
-import { D as DataGrid } from "../../../DataGrid/index.9aa088f6.js";
+import { u as useFormAddEdit } from "../../../../hooks/useFormAddEdit/index.bd4ae2a5.js";
+import { u as useMapStore, C as CommonFeatureRender, G as GPS_TOOLS_POPUP_ID } from "../Map/index.14f082d4.js";
+import { D as DataGrid } from "../../../DataGrid/index.d538cef8.js";
 const COMPONENT_CLASS_NAME = "M4LMapGpsTools";
 const COMPONENT_MAP_TOOLS_ID = "gps_tools";
 const STYLE_OPACITIES = [
@@ -715,14 +715,13 @@ function GeneralData() {
         /* @__PURE__ */ jsx(
           RHFAutocomplete,
           {
+            type: "image",
             name: "geofenceType",
             autoComplete: "off",
             options: geofencesTypes,
             getOptionLabel: (option) => option.name,
             isOptionEqualToValue: (option, value) => option.id === value.id,
             getOptionUrlImage: (option) => option.url,
-            imageHeight: "12px",
-            imageWidth: "12px",
             label: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMETRY_TYPE)
           }
         ),
@@ -866,6 +865,7 @@ function FillData() {
         value: /* @__PURE__ */ jsx(
           RHFAutocomplete,
           {
+            type: "text",
             name: "properties.fillOpacity",
             autoComplete: "off",
             options: STYLE_OPACITIES,
@@ -902,6 +902,7 @@ function StrokeData() {
         value: /* @__PURE__ */ jsx(
           RHFAutocomplete,
           {
+            type: "text",
             name: "properties.strokeOpacity",
             autoComplete: "off",
             options: STYLE_OPACITIES,
@@ -921,6 +922,7 @@ function StrokeData() {
         value: /* @__PURE__ */ jsx(
           RHFAutocomplete,
           {
+            type: "text",
             name: "properties.strokeWeight",
             autoComplete: "off",
             options: STYLE_WHEIGHTS,
@@ -940,6 +942,7 @@ function StrokeData() {
         value: /* @__PURE__ */ jsx(
           RHFAutocomplete,
           {
+            type: "text",
             name: "properties.strokeDashArray",
             autoComplete: "off",
             options: STYLE_PATTERNS,

package/components/maps/components/Map/external/Control/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ControlProps } from './types';
 /**
- * @description crea un componente react dentro de un control de leaflet, utilizando una tecnica e portaa diferente a createPortal
+ * @description crea un componente react dentro de un control de leaflet, utilizando una tecnica e portal diferente a createPortal
  * Dependiendo de la posicion del control, este se agrega en la parte correspondiente del mapa, por defecto es topright
  *
  * @param props

package/components/maps/components/Map/{index.c50fc538.js → index.14f082d4.js}

@@ -9,24 +9,24 @@ import { createPortal } from "react-dom";
 import { useModuleDictionary, useModuleSkeleton, useEnvironment, useModulePrivileges } from "@m4l/core";
 import clsx from "clsx";
 import { useFormContext, useWatch } from "react-hook-form";
-import { A as Actions } from "../../../CommonActions/components/Actions/index.84b8fd47.js";
-import { B as Button } from "../../../mui_extended/Button/index.a391ee9f.js";
+import { A as Actions } from "../../../CommonActions/components/Actions/index.434f4824.js";
+import { B as Button } from "../../../mui_extended/Button/index.24b9496b.js";
 import * as Yup from "yup";
 import { u as useFormReadyForUpdate } from "../../../../hooks/useFormReadyForUpdate/index.f60f500e.js";
-import { R as RHFAutocompleteAsync } from "../../../hook-form/RHFAutocompleteAsync/index.a61e7dda.js";
-import { S as Stack } from "../../../mui_extended/Stack/index.e64a379b.js";
-import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.939811b3.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.97e91dae.js";
-import { u as usePopupsStore, P as PopupsProvider } from "../../../popups/PopupsProvider/index.6591c56e.js";
-import { T as ToggleIconButton } from "../../../mui_extended/ToggleIconButton/index.621ff8bc.js";
-import { D as DataGrid } from "../../../DataGrid/index.9aa088f6.js";
+import { R as RHFAutocompleteAsync } from "../../../hook-form/RHFAutocompleteAsync/index.2b2ff592.js";
+import { S as Stack } from "../../../mui_extended/Stack/index.9d6ed8c2.js";
+import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.54d30cb2.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.f5dcf537.js";
+import { u as usePopupsStore, P as PopupsProvider } from "../../../popups/PopupsProvider/index.776c62e7.js";
+import { T as ToggleIconButton } from "../../../mui_extended/ToggleIconButton/index.c51670d1.js";
+import { D as DataGrid } from "../../../DataGrid/index.d538cef8.js";
 import { generateUtilityClasses, Tooltip, FormControl, RadioGroup, FormControlLabel, Radio, useTheme } from "@mui/material";
 import { C as ColumnSetCheckFormatter } from "../../../DataGrid/formatters/ColumnSetCheckFormatter/index.4045b2f2.js";
-import { I as Icon, M as MarkerIconLabel } from "../../../Icon/index.e06c693f.js";
+import { I as Icon, M as MarkerIconLabel } from "../../../Icon/index.2b591dd6.js";
 import { u as useStateRef } from "../../../../hooks/useStateRef/index.538edb89.js";
-import { C as CheckBox } from "../../../mui_extended/CheckBox.ae30825c.js";
-import { P as Popover } from "../../../mui_extended/Popover/index.82970357.js";
-import { P as PopupsViewer } from "../../../popups/PopupsViewer/index.caf23a5d.js";
+import { C as CheckBox } from "../../../mui_extended/CheckBox.4d930bed.js";
+import { P as Popover } from "../../../mui_extended/Popover/index.6d8fe229.js";
+import { P as PopupsViewer } from "../../../popups/PopupsViewer/index.6a175b73.js";
 import { createPathComponent } from "@react-leaflet/core";
 import "leaflet.markercluster";
 import { cloneDeep, throttle } from "lodash";
@@ -1140,6 +1140,7 @@ function MeasureData() {
     /* @__PURE__ */ jsx(
       RHFAutocompleteAsync,
       {
+        type: "text",
         endPoint: "magnitudes/factors?origin_unit_reference_id=m_kilometers",
         name: "magnitudFactor",
         autoComplete: "off",
@@ -1708,10 +1709,21 @@ function Controls(props) {
       L__default.DomEvent.disableScrollPropagation(cContainer);
     }
   }, [map]);
-  return /* @__PURE__ */ jsxs(PopupsProvider, { baseZindex: MAP_ZINDEX_OVER_MAP, children: [
+  return /* @__PURE__ */ jsxs(PopupsProvider, { baseZindex: MAP_ZINDEX_OVER_MAP, containerElement: map.getContainer(), initialPopups: [
+    {
+      popupId: "popup1",
+      status: "init",
+      iconUrl: "`https://s3.amazonaws.com/static.made4labs/environments/d1/frontend/components/dynamic_filter/assets/icons/edit.svg`,",
+      title: "Popup 1",
+      subTitle: "Subtitulo",
+      zIndex: 1,
+      componentProps: {},
+      functionComponent: () => /* @__PURE__ */ jsx("div", { children: "MyComponent" })
+    }
+  ], children: [
     /* @__PURE__ */ jsx(TopLeftTools, {}),
     /* @__PURE__ */ jsx(TopRightTools, { gpsTools }),
-    controlContainer && createPortal(/* @__PURE__ */ jsx(PopupsViewer, { containerElement: map.getContainer() }), controlContainer)
+    controlContainer && createPortal(/* @__PURE__ */ jsx(PopupsViewer, {}), controlContainer)
   ] });
 }
 const MarkerClusterGroup = createPathComponent(({ children: _c, ...props }, ctx) => {
@@ -1768,10 +1780,8 @@ const MyLayer = (props) => {
     if (lefaletLayerRef.current.clickCount === 1) {
       lefaletLayerRef.current.clickTimeout = setTimeout(() => {
         const cluster2 = a.propagatedFrom;
-        if (cluster2 && cluster2 instanceof L__default.MarkerCluster) {
-          const childMarkers = cluster2.getAllChildMarkers();
-          console.log("Markers in this cluster: ", childMarkers);
-        }
+        if (cluster2 && cluster2 instanceof L__default.MarkerCluster)
+          ;
         if (!popupRef.current) {
           popupRef.current = L__default.popup().setLatLng(a.sourceTarget._cLatLng).setContent("Hello, World!");
           map.addLayer(popupRef.current);
@@ -2167,10 +2177,6 @@ const CommonFeatureRender = (props) => {
       fetchData();
     }
   }, [feature]);
-  useEffect(() => {
-    return () => {
-    };
-  }, []);
   if (!feature) {
     return null;
   }
@@ -2229,9 +2235,7 @@ const CommonFeatureRender = (props) => {
           },
           draggable: false,
           eventHandlers: {
-            add: onAddPointLayer,
-            click: (_e) => {
-            }
+            add: onAddPointLayer
           },
           ...styleProperties,
           ...propFeature

package/components/modal/{WindowBase.af49e2e8.js → WindowBase.0dc3b3ea.js}

@@ -2,9 +2,9 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { m as modalUtilityClasses } from "./index.81eb6def.js";
 import { useEnvironment } from "@m4l/core";
 import clsx from "clsx";
-import { I as Icon } from "../Icon/index.e06c693f.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.97e91dae.js";
-import { u as useModal } from "../../hooks/useModal/index.538e8219.js";
+import { I as Icon } from "../Icon/index.2b591dd6.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.f5dcf537.js";
+import { u as useModal } from "../../hooks/useModal/index.d3c18b29.js";
 const Header = (props) => {
   const { title, onClickCancel, urlIcon, classes } = props;
   const { host_static_assets, environment_assets } = useEnvironment();

package/components/modal/{WindowConfirm.141e19a9.js → WindowConfirm.b8a431dd.js}

@@ -1,13 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { A as Actions } from "../CommonActions/components/Actions/index.84b8fd47.js";
+import { A as Actions } from "../CommonActions/components/Actions/index.434f4824.js";
 import { Typography } from "@mui/material";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
-import { u as useModal } from "../../hooks/useModal/index.538e8219.js";
-import { I as Image } from "../Image/index.8a3d05d3.js";
+import { u as useModal } from "../../hooks/useModal/index.d3c18b29.js";
+import { I as Image } from "../Image/index.fb9e71ba.js";
 import { m as modalUtilityClasses } from "./index.81eb6def.js";
-import { W as WindowBase } from "./WindowBase.af49e2e8.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.c3cddacf.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.db2b2999.js";
+import { W as WindowBase } from "./WindowBase.0dc3b3ea.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.ce196f96.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.1c40d33b.js";
 const dictionary = {
   MESSAGE: "common_actions.confirm_quit_msg"
 };

package/components/mui_extended/Accordion/{index.e76a8701.js → index.bb0cd2ab.js}

@@ -1,14 +1,14 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { generateUtilityClasses, generateUtilityClass, Accordion as Accordion$1, AccordionSummary, AccordionDetails } from "@mui/material";
-import { I as IconButton } from "../IconButton/index.97e91dae.js";
+import { I as IconButton } from "../IconButton/index.f5dcf537.js";
 import { useEnvironment } from "@m4l/core";
 import { unstable_composeClasses } from "@mui/base";
-import { ax as AccordionRoot } from "../../../styles/index.7868464e.js";
+import { ax as AccordionRoot } from "../../../styles/index.d972f170.js";
 import clsx from "clsx";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { g as getNameDataTestId } from "../../../test/getNameDataTestId.0faeade8.js";
-import { I as Icon } from "../../Icon/index.e06c693f.js";
-import { T as Typography } from "../Typography/index.8a0f958b.js";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
+import { T as Typography } from "../Typography/index.dbc44e77.js";
 const componentName = "M4LAccordion";
 generateUtilityClasses(componentName, [
   "root",

package/components/mui_extended/Avatar/{index.fc674f4b.js → index.bcf4d669.js}

@@ -4,7 +4,7 @@ import { Skeleton, generateUtilityClasses, generateUtilityClass, Avatar as Avata
 import { useModuleSkeleton } from "@m4l/core";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
-import { ay as AvatarRoot } from "../../../styles/index.7868464e.js";
+import { ay as AvatarRoot } from "../../../styles/index.d972f170.js";
 import clsx from "clsx";
 const AVATAR_PREFIX = "M4LAvatar";
 const getNameAvatarDataTestId = (KEY) => {

package/components/mui_extended/Badge/{index.615959af.js → index.89ca5b23.js}

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { generateUtilityClasses, Badge as Badge$1 } from "@mui/material";
 import "@mui/base";
-import { az as BadgeRoot } from "../../../styles/index.7868464e.js";
+import { az as BadgeRoot } from "../../../styles/index.d972f170.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 const componentName = "M4LBadge";
 const badgeClasses = generateUtilityClasses(componentName, [

package/components/mui_extended/Button/{index.a391ee9f.js → index.24b9496b.js}

@@ -2,14 +2,14 @@ import { jsx } from "react/jsx-runtime";
 import { useModuleSkeleton } from "@m4l/core";
 import { generateUtilityClasses, generateUtilityClass, Skeleton, IconButton, Tooltip } from "@mui/material";
 import MuiButton from "@mui/material/Button";
-import { aA as ButtonRoot, aB as WrapperImageButton, aC as LoadingButtonRoot } from "../../../styles/index.7868464e.js";
+import { aA as ButtonRoot, aB as WrapperImageButton, aC as LoadingButtonRoot } from "../../../styles/index.d972f170.js";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";
 import { useMemo } from "react";
-import { I as Image } from "../../Image/index.8a3d05d3.js";
+import { I as Image } from "../../Image/index.fb9e71ba.js";
 import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
 import { LoadingButton as LoadingButton$1 } from "@mui/lab";
-import { T as Typography } from "../Typography/index.8a0f958b.js";
+import { T as Typography } from "../Typography/index.dbc44e77.js";
 const componentName$2 = "M4LButton";
 const buttonClasses = generateUtilityClasses(componentName$2, [
   "root",

package/components/mui_extended/{CheckBox.ae30825c.js → CheckBox.4d930bed.js}

@@ -5,8 +5,8 @@ import { useResponsiveDesktop } from "@m4l/graphics";
 import { unstable_composeClasses } from "@mui/base";
 import { useModuleSkeleton } from "@m4l/core";
 import { forwardRef } from "react";
-import { aD as CheckBoxRoot } from "../../styles/index.7868464e.js";
-import { F as FieldLabel } from "../FieldLabel/index.a6235bcc.js";
+import { aD as CheckBoxRoot } from "../../styles/index.d972f170.js";
+import { F as FieldLabel } from "../FieldLabel/index.44f3e099.js";
 const COMPONENT_CLASS_NAME = "M4LCheckBox";
 generateUtilityClasses(COMPONENT_CLASS_NAME, [
   "root",

package/components/mui_extended/IconButton/{index.97e91dae.js → index.f5dcf537.js}

@@ -2,8 +2,8 @@ import { jsx, Fragment } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { Skeleton, generateUtilityClasses, generateUtilityClass, Tooltip, IconButton as IconButton$1 } from "@mui/material";
-import { I as Icon } from "../../Icon/index.e06c693f.js";
-import { aE as IconButtonRoot } from "../../../styles/index.7868464e.js";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
+import { aE as IconButtonRoot } from "../../../styles/index.d972f170.js";
 import { unstable_composeClasses } from "@mui/base";
 import clsx from "clsx";
 import { useResponsiveDesktop } from "@m4l/graphics";

package/components/mui_extended/MenuActions/{index.1092605e.js → index.540d82fd.js}

@@ -2,13 +2,13 @@ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import React__default, { useState, useEffect, useMemo } from "react";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { generateUtilityClasses, generateUtilityClass, useTheme, MenuItem } from "@mui/material";
-import { P as Popover } from "../Popover/index.82970357.js";
-import { aF as LabelMemuItem } from "../../../styles/index.7868464e.js";
-import { I as Icon } from "../../Icon/index.e06c693f.js";
+import { P as Popover } from "../Popover/index.6d8fe229.js";
+import { aF as LabelMemuItem } from "../../../styles/index.d972f170.js";
+import { I as Icon } from "../../Icon/index.2b591dd6.js";
 import clsx from "clsx";
 import { unstable_composeClasses } from "@mui/base";
-import { B as Badge } from "../Badge/index.615959af.js";
-import { I as IconButton } from "../IconButton/index.97e91dae.js";
+import { B as Badge } from "../Badge/index.89ca5b23.js";
+import { I as IconButton } from "../IconButton/index.f5dcf537.js";
 const ICONS = {
   MENU: "menu.svg"
 };

package/components/mui_extended/Pager/classes/index.d.ts

@@ -4,13 +4,13 @@ export declare function getPagerUtilityClass(slot: string): string;
 export declare const pagerUtilityClasses: () => {
     select: string;
     root: string;
-    skeletonRoot: string;
     labelRowsPerPageContainer: string;
     selectMenuPopover: string;
     selectMenuItem: string;
     labelDisplayRows: string;
     pagerActions: string;
     customTablePaginationRoot: string;
+    skeletonRoot: string;
     skeletonRowsPerPage: string;
     skeletonButtonContainer: string;
     skeletonIconButton: string;