@m4l/components 0.1.83 → 0.1.85

package/components/DataGrid/subcomponents/Actions/{index.201394f5.js → index.155c63af.js}

@@ -1,47 +1,48 @@
-import { M as MenuActions } from "../../../mui_extended/MenuActions/index.f6bfdd40.js";
-import { u as useDataGrid, a as useFilters, d as dataGridClasses, b as dictionary } from "../../index.d5d0d62f.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index.b16e84c1.js";
+import { u as useDataGrid, a as useFilters, d as dataGridClasses, D as DataGridRoot, b as dictionary } from "../../index.37e14e83.js";
 import { useTheme, Checkbox, Skeleton } from "@mui/material";
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { P as Pager } from "../../../mui_extended/Pager/index.da26e9d4.js";
-import { I as IconButton } from "../../../mui_extended/IconButton/index.a318316e.js";
+import { P as Pager } from "../../../mui_extended/Pager/index.5b77fa4c.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.be111a34.js";
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { forwardRef, useRef, useState, useImperativeHandle, useMemo, useEffect, useCallback } from "react";
 import { D as DataGrid$1 } from "../../../../react-data-grid.d46d625e.js";
 import { styled } from "@mui/material/styles";
-import { u as useModal } from "../../../../hooks/useModal/index.7a07c208.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.b2fc495d.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.724d8e17.js";
+import { u as useModal } from "../../../../hooks/useModal/index.c906706c.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.67b91376.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.53e7fe2b.js";
 import "../../../../react-draggable.7abb5d0a.js";
 import "../../../Resizeable/index.9a9c79a4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import "../../../Icon/index.2414ff25.js";
+import "../../../Icon/index.c3a579e7.js";
 import "clsx";
-import "../../../modal/index.1bd35bd5.js";
-import { A as Actions$1 } from "../../../CommonActions/components/Actions/index.23a2d6ae.js";
+import "../../../modal/index.c7e4beba.js";
+import { A as Actions$1 } from "../../../CommonActions/components/Actions/index.c91c27f9.js";
 import "react-hook-form";
 import "@mui/material/Button";
 import "../../../mui_extended/Button/index.40af964e.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.36fe6953.js";
-import "../../../areas/components/AreasAdmin/index.7bfec13f.js";
+import "../../../areas/contexts/AreasContext/index.6f56b1da.js";
+import "../../../areas/components/AreasAdmin/index.f505897a.js";
 import "zustand/shallow";
-import "../../../ScrollBar/index.d4410cb5.js";
-import "../../../mui_extended/Accordion/index.5111314b.js";
+import "../../../ScrollBar/index.1247c1c5.js";
+import "../../../mui_extended/Accordion/index.854f4c90.js";
 import "../../../mui_extended/Typography/index.443590d6.js";
 import "../../../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
-import "../../../mui_extended/CheckBox.5f6c78b0.js";
-import "../../../mui_extended/Badge/index.cad260fe.js";
+import "../../../mui_extended/CheckBox.38abccd8.js";
+import "../../../mui_extended/Badge/index.8c2b8b66.js";
 import "../../../Image/index.c18ebf5a.js";
 import "@mui/lab";
 import "../../../mui_extended/Popover/index.9f35d0eb.js";
-import "../../../mui_extended/Tab/index.0989d15d.js";
+import "../../../mui_extended/Stack/index.0e53197c.js";
+import "../../../mui_extended/Tab/index.c1dc7bbf.js";
 import "../../../mui_extended/Tooltip/index.5a795dcd.js";
-import "../../../areas/components/AreasViewer/index.9ed7dfd7.js";
+import "../../../areas/components/AreasViewer/index.cacec884.js";
 import "../../../LinearProgressIndeterminate/index.60dabc06.js";
 import "../../../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../../../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
-import { W as WindowBase } from "../../../modal/WindowBase.92ce9b8f.js";
+import { W as WindowBase } from "../../../modal/WindowBase.d485315d.js";
 const ACTIONS_COLUMN_KEY = "actions-row";
 function ActionsFormatter(props) {
   const {
@@ -376,41 +377,42 @@ const ColumnsConfig = forwardRef((props, ref) => {
     }), /* @__PURE__ */ jsxs(ColumnActions, {
       className: classes.columnsConfigActions,
       children: [/* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_move_first",
+        tooltip: getLabel("data_grid.settings_move_first"),
         onClick: handleMoveFirst,
         "aria-label": "move first place",
         disabled: rowSelectedIndex < 1,
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_first_place.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
+        tooltip: getLabel("data_grid.settings_move_up"),
         dictionaryTooltipId: "data_grid.settings_move_up",
         onClick: () => handleMoveUpDownd(-1),
         "aria-label": "move up place",
         disabled: rowSelectedIndex < 1,
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_up_place.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_move_last",
+        tooltip: getLabel("data_grid.settings_move_last"),
         onClick: handleMoveLast,
         "aria-label": "move last place",
         disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_last_place.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_move_down",
+        tooltip: getLabel("data_grid.settings_move_down"),
         onClick: () => handleMoveUpDownd(1),
         "aria-label": "move down place",
         disabled: !!(rowSelectedIndex === rows.length - 1 || rowSelectedIndex === -1),
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/move_down_place.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_visible_all",
+        tooltip: getLabel("data_grid.settings_visible_all"),
         onClick: checkAll,
         "aria-label": "check visible all",
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/check_all.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_no_visible_all",
+        tooltip: getLabel("data_grid.settings_no_visible_all"),
         onClick: unCheckAll,
         "aria-label": "un check all",
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/uncheck_all.svg`
       }), /* @__PURE__ */ jsx(IconButton, {
-        dictionaryTooltipId: "data_grid.settings_restore",
+        tooltip: getLabel("data_grid.settings_restore"),
         onClick: restoreAll,
         "aria-label": "Restore columns",
         src: `${host_static_assets}/${environment_assets}/frontend/components/data_grid/assets/icons/restore_columns.svg`
@@ -435,6 +437,7 @@ function Settings() {
     host_static_assets,
     environment_assets
   } = useEnvironment();
+  const isDesktop = useResponsiveDesktop();
   const {
     classes
   } = useDataGrid();
@@ -451,14 +454,27 @@ function Settings() {
     openModal({
       initialWidth: 500,
       initialHeigth: 680,
+      fullScreen: !isDesktop ? true : false,
       window: /* @__PURE__ */ jsxs(WindowBase, {
         title: getLabel("data_grid.settings_title"),
-        children: [/* @__PURE__ */ jsx(ColumnsConfig, {
-          ref,
-          columnsConfig,
-          onChangeColumnsConfig,
-          onCloseSettings,
-          classes
+        children: [/* @__PURE__ */ jsx(DataGridRoot, {
+          className: classes.root,
+          children: /* @__PURE__ */ jsx("div", {
+            className: classes.tableContaniner,
+            style: {
+              inset: "0"
+            },
+            children: /* @__PURE__ */ jsx("div", {
+              className: classes.wrapperDataGridCss,
+              children: /* @__PURE__ */ jsx(ColumnsConfig, {
+                ref,
+                columnsConfig,
+                onChangeColumnsConfig,
+                onCloseSettings,
+                classes
+              })
+            })
+          })
         }), /* @__PURE__ */ jsxs(Actions$1, {
           children: [/* @__PURE__ */ jsx(ActionCancel, {
             onClick: closeModal

package/components/DynamicFilter/{index.7d134537.js → index.a8c2609c.js}

@@ -1,44 +1,45 @@
 import { shallow } from "zustand/shallow";
-import { S as ScrollBar } from "../ScrollBar/index.d4410cb5.js";
+import { S as ScrollBar } from "../ScrollBar/index.1247c1c5.js";
 import { useContext, useMemo, useEffect, createContext, useRef, createElement, useState, useCallback } from "react";
 import clsx from "clsx";
 import { useModuleDictionary, useEnvironment, useModuleSkeleton, useFlagsPresent, CommonFlags } from "@m4l/core";
 import { useResponsiveDesktop, useFirstRender, useFormatter } from "@m4l/graphics";
-import { I as IconButton } from "../mui_extended/IconButton/index.a318316e.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.be111a34.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../vendor.5365cc7e.js";
+import { g as getNameDataTestId } from "../../vendor.f27b86c9.js";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { generateUtilityClasses, alpha, styled as styled$1, Skeleton, MenuItem } from "@mui/material";
-import { L as LabelMemuItem } from "../mui_extended/MenuActions/index.f6bfdd40.js";
+import { L as LabelMemuItem } from "../mui_extended/MenuActions/index.b16e84c1.js";
 import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
-import { I as Icon } from "../Icon/index.2414ff25.js";
+import { I as Icon } from "../Icon/index.c3a579e7.js";
 import { styled, useTheme } from "@mui/material/styles";
-import { R as RHFormProvider } from "../../contexts/RHFormContext/index.b9266262.js";
-import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.23a2d6ae.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.b2fc495d.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.724d8e17.js";
+import { R as RHFormProvider } from "../../contexts/RHFormContext/index.e019f87d.js";
+import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.c91c27f9.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.67b91376.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.53e7fe2b.js";
 import { useFormContext, useWatch } from "react-hook-form";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
-import "../../contexts/ModalContext/index.577bf36b.js";
+import "../../contexts/ModalContext/index.1ea79d7e.js";
 import "../../react-draggable.7abb5d0a.js";
 import "../Resizeable/index.9a9c79a4.js";
-import "../modal/index.1bd35bd5.js";
+import "../modal/index.c7e4beba.js";
 import "../Image/index.c18ebf5a.js";
-import "../mui_extended/Accordion/index.5111314b.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
-import "../mui_extended/CheckBox.5f6c78b0.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/CheckBox.38abccd8.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "@mui/lab";
-import "../mui_extended/Pager/index.da26e9d4.js";
-import "../mui_extended/Tab/index.0989d15d.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { useStore, createStore } from "zustand";
-import "../areas/contexts/AreasContext/index.36fe6953.js";
-import "../areas/components/AreasAdmin/index.7bfec13f.js";
-import "../areas/components/AreasViewer/index.9ed7dfd7.js";
+import "../areas/contexts/AreasContext/index.6f56b1da.js";
+import "../areas/components/AreasAdmin/index.f505897a.js";
+import "../areas/components/AreasViewer/index.cacec884.js";
 import "../LinearProgressIndeterminate/index.60dabc06.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
@@ -46,19 +47,19 @@ import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass, i as isValidDate } from "../../utils/index.c43a95f4.js";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.42df8eb4.js";
+import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.aca6984f.js";
 import "lodash/debounce";
-import "../hook-form/RHFAutocompleteAsync/index.0441524c.js";
-import "../hook-form/RHFCheckbox/index.c66147f7.js";
-import "../HelperText/index.28e9105d.js";
+import "../hook-form/RHFAutocompleteAsync/index.8511bcf8.js";
+import "../hook-form/RHFCheckbox/index.0f45e6b0.js";
+import "../HelperText/index.8b5911d1.js";
 import "@mui/x-date-pickers";
-import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.4698ca29.js";
-import { R as RHFTextField } from "../hook-form/RHFTextField/index.1fa07688.js";
-import "../hook-form/RHFPeriod/index.f653934b.js";
-import "../Period/index.0e6512b2.js";
+import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.07412ef0.js";
+import { R as RHFTextField } from "../hook-form/RHFTextField/index.94c8c59b.js";
+import "../hook-form/RHFPeriod/index.15b8f11e.js";
+import "../Period/index.061c9b2f.js";
 import "lodash/isString";
 import "react-dropzone";
-import "../hook-form/RHFUpload/index.93c2dcb5.js";
+import "../hook-form/RHFUpload/index.7ef1e124.js";
 import * as Yup from "yup";
 const COMPONENT_PREFIX = "M4LDynamicFilter";
 const COMPONENT_CLASS_NAME = "M4LDynamicFilter";

package/components/GridLayout/constants.d.ts

@@ -23,4 +23,4 @@ export declare const DEFAULT_CONTAINER_PADDING: Margin;
 export declare const DEFAULT_MARGIN: Margin;
 export declare const DEFAULT_TRANSFORM_SCALE = 1;
 export declare const DEFAULT_COLAPSED_HEIGHT = 35;
-export declare const THROTTLE_RESIZE_TIME = 200;
+export declare const THROTTLE_RESIZE_TIMEOUT = 200;

package/components/GridLayout/{index.70085b00.js → index.2383aaf9.js}

@@ -1,13 +1,13 @@
-import { useState, useRef, useEffect, useCallback } from "react";
+import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 import clsx from "clsx";
-import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.c09681ff.js";
+import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.58168132.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { styled } from "@mui/material/styles";
+import { throttle } from "lodash";
+import { useResizeObserver } from "@m4l/graphics";
+import { styled, alpha } from "@mui/material/styles";
 import { r as react_resizable_css } from "../../react-resizable.ba08699a.js";
 import { generateUtilityClasses } from "@mui/material";
 import "@mui/base";
-import "@m4l/graphics";
-import "lodash";
 const COMPONENT_CLASS_NAME = "M4LGridLayout";
 const DEFAULT_COLS = 12;
 const DEFAULT_ROW_HEIGHT = 20;
@@ -19,7 +19,7 @@ const DEFAULT_CONTAINER_PADDING = [10, 10];
 const DEFAULT_MARGIN = [10, 10];
 const DEFAULT_TRANSFORM_SCALE = 1;
 const DEFAULT_COLAPSED_HEIGHT = 35;
-const THROTTLE_RESIZE_TIME = 200;
+const THROTTLE_RESIZE_TIMEOUT = 200;
 const noop = () => {
 };
 function bottom(layout, colapsedHeight, rowHeight) {
@@ -453,8 +453,8 @@ function calcGridItemPosition(positionParams, x, y, w, h, maximize, state) {
     out.height = Math.round(state.resizing.height);
   } else {
     if (maximize === "maximize_me") {
-      out.width = positionParams.containerWidth - 2 * containerPadding[0] - 2;
-      out.height = positionParams.containerHeight - 2 * containerPadding[1] - 2;
+      out.width = positionParams.containerWidth - 2 * containerPadding[0] - 0;
+      out.height = positionParams.containerHeight - 2 * containerPadding[1] - 0;
     } else {
       out.width = calcGridItemWHPx(w, colWidth, containerMargin[0]);
       out.height = calcGridItemWHPx(h, rowHeight, containerMargin[1]);
@@ -512,12 +512,9 @@ const gridLayoutClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
   "static"
 ]);
 const GridLayoutRoot = styled("div")`
-    /* height: 100%; */
     overflow: auto;
-    /* flex-grow: 1; */
     position: relative;
     transition: height 200ms ease;
-    /* border: 1px dashed gray; //TODO:Para borrar */
 
     .${gridLayoutClasses.gridItemRoot} {
         transition: all 200ms ease;
@@ -554,8 +551,8 @@ const GridLayoutRoot = styled("div")`
     }
 
     .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.gridItemPlaceholder} {
-        background: green;
-        opacity: 0.2;
+        background: ${(props) => props.theme.palette.state.toneOp};
+        opacity: 0.5;
         transition-duration: 100ms;
         z-index: 3000;
         -webkit-user-select: none;
@@ -567,11 +564,21 @@ const GridLayoutRoot = styled("div")`
 
     .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle {
         position: absolute;
-        width: 20px;
-        height: 20px;
+        width: 10px;
+        height: 10px;
+        padding: 12px;
+        background-image: unset;
+        
+        & .M4LIcon-icon {
+            width: 10px;
+            height: 10px;
+            min-width: 10px;
+            min-height: 10px;
+            background-color: ${(props) => alpha(props.theme.palette.text.primary, 0.3)};
+        }
     }
 
-    .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle::after {
+    /*  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle::after {
         content: '';
         position: absolute;
         right: 3px;
@@ -580,7 +587,7 @@ const GridLayoutRoot = styled("div")`
         height: 5px;
         border-right: 2px solid rgba(0, 0, 0, 0.4);
         border-bottom: 2px solid rgba(0, 0, 0, 0.4);
-    }
+    } */
 
     .react-resizable-hide > .react-resizable-handle {
         display: none;
@@ -819,7 +826,6 @@ function GridLayout(props) {
     node
   }) => {
     if (!refState.current.activeDrag) {
-      console.log("GridLayout localOnDragStop sin movimiento");
       return;
     }
     const {
@@ -852,7 +858,6 @@ function GridLayout(props) {
       oldLayout: void 0,
       activeDrag: void 0
     };
-    console.log("localOnDragStop", finalLayout);
     if (e.type !== "touchmove") {
       e.preventDefault();
     }
@@ -956,13 +961,17 @@ function GridLayout(props) {
       onResize(newLayout, oldResizeItem, li, newPlaceholder, e, node);
     } catch (error) {
     }
+    console.log("GridLayout onresize");
+    if (e.type !== "touchmove") {
+      e.preventDefault();
+    }
+    e.stopPropagation();
   }, []);
   const localOnResizeStop = useCallback((i, _w, _h, {
     e,
     node
   }) => {
     if (!refState.current.activeDrag) {
-      console.log("GridLayout localOnResizeStop sin cambio");
       return;
     }
     const {
@@ -986,13 +995,12 @@ function GridLayout(props) {
       onResizeStop(layout2, oldResizeItem, l, void 0, e, node);
     }
   }, []);
-  const onClickSetOnTopFreeMove = useCallback((i, source) => {
+  const onClickSetOnTopFreeMove = useCallback((i, _source) => {
     const {
       layout: layout2
     } = refState.current;
     const index = refState.current.zIndexes.indexOf(i);
     const l = getLayoutItem(layout2, i);
-    console.log("onClickSetOnTopFreeMove", index, refState.current.zIndexes.length, source);
     if (l && l?.freeMove) {
       if (index !== refState.current.zIndexes.length - 1 || index === -1) {
         const newIndexes = [...refState.current.zIndexes];
@@ -1123,11 +1131,66 @@ function GridLayout(props) {
     children: [finalLayoutRender.map((li) => processGridItem(li, !!currentState.mounted)), placeholder()]
   });
 }
+function SizeProvider(ComposedComponent) {
+  return (props) => {
+    const {
+      measureBeforeMount = true,
+      ...rest
+    } = props;
+    const refMounted = useRef(false);
+    const [currentState, setCurrentState] = useState({
+      mounted: false,
+      width: DEFAULT_CONTAINER_WIDTH,
+      height: DEFAULT_CONTAINER_HEIGHT
+    });
+    const onWindowResizeMemo = useMemo(() => () => {
+      const node = elementRef.current;
+      console.log(`oooo`);
+      if (node instanceof HTMLElement && node.clientWidth) {
+        console.log(`onWindowResizeMemo w: ${node.offsetWidth} y:${node.offsetHeight}`);
+        setCurrentState((prev) => ({
+          ...prev,
+          width: node.clientWidth,
+          height: node.offsetHeight
+        }));
+      }
+    }, []);
+    const throttleResize = throttle(onWindowResizeMemo, THROTTLE_RESIZE_TIMEOUT, {
+      leading: false,
+      trailing: true
+    });
+    const onResize = useCallback((_target) => {
+      throttleResize();
+    }, []);
+    const elementRef = useResizeObserver(onResize);
+    useEffect(() => {
+      setCurrentState((prev) => ({
+        ...prev,
+        mounted: true
+      }));
+      refMounted.current = true;
+      onWindowResizeMemo();
+    }, []);
+    if (measureBeforeMount && !currentState.mounted) {
+      return /* @__PURE__ */ jsx("div", {
+        className: clsx(props.className, COMPONENT_CLASS_NAME),
+        style: props.style,
+        ref: elementRef
+      });
+    }
+    return /* @__PURE__ */ jsx(ComposedComponent, {
+      innerRef: elementRef,
+      containerWidth: currentState.width,
+      containerHeight: currentState.height,
+      ...rest
+    });
+  };
+}
 export {
   noop as A,
   DEFAULT_COLS as D,
   GridLayout as G,
-  THROTTLE_RESIZE_TIME as T,
+  SizeProvider as S,
   calcGridItemWHPx as a,
   calcGridColWidth as b,
   calcXY as c,

package/components/GridLayout/index.d.ts

@@ -4,4 +4,4 @@ export { addLayoutItemToBreakPoints, addLayoutItemToBreakPointIfNoExists, cloneL
 export { isEqualLayouts, isEqualLayout } from './utils';
 export type { GridLayoutProps, LayoutItemRenderProps, Layout, LayoutItem, BaseLayoutItem, Layouts, } from './types';
 export type { ContainerChangeEvent } from './subcomponents/Responsive/types';
-export { SizeProvider } from './subcomponents/SizeProvider';
+export { SizeProvider } from './subcomponents/WidthProvider';

package/components/GridLayout/subcomponents/Griditem/{index.c09681ff.js → index.58168132.js}

@@ -1,7 +1,7 @@
 import React__default, { useRef, useEffect, useState, useCallback, useMemo } from "react";
 import { D as DraggableCore_1 } from "../../../../react-draggable.7abb5d0a.js";
 import { R as Resizable } from "../../../../react-resizable.ba08699a.js";
-import { g as getH, c as calcXY, a as calcGridItemWHPx, b as calcGridColWidth, d as calcWH, e as clamp, f as calcGridItemPosition, h as gridLayoutClasses, D as DEFAULT_COLS, i as DEFAULT_ROW_HEIGHT, j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, l as DEFAULT_MARGIN, m as DEFAULT_CONTAINER_PADDING, n as DEFAULT_TRANSFORM_SCALE, o as DEFAULT_COLAPSED_HEIGHT, p as perc, s as setTransform, q as setTopLeft } from "../../index.70085b00.js";
+import { g as getH, c as calcXY, a as calcGridItemWHPx, b as calcGridColWidth, d as calcWH, e as clamp, f as calcGridItemPosition, h as gridLayoutClasses, D as DEFAULT_COLS, i as DEFAULT_ROW_HEIGHT, j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, l as DEFAULT_MARGIN, m as DEFAULT_CONTAINER_PADDING, n as DEFAULT_TRANSFORM_SCALE, o as DEFAULT_COLAPSED_HEIGHT, p as perc, s as setTransform, q as setTopLeft } from "../../index.2383aaf9.js";
 import clsx from "clsx";
 import { d as deepEqual } from "../../../../node_modules.d73a220d.js";
 import { jsx, Fragment } from "react/jsx-runtime";
@@ -140,7 +140,6 @@ function GridItem(props) {
     const pTop = parentRect.top / transformScale;
     newPosition.left = cLeft - pLeft + offsetParent.scrollLeft;
     newPosition.top = cTop - pTop + offsetParent.scrollTop;
-    console.log(`gridItemOnDragStart cleft:${cLeft},pleft:${pLeft}, offsetParent.scrollTop:${offsetParent.scrollTop}  `, newPosition);
     refState.current.dragging = newPosition;
     setCurrentState((prev) => ({
       ...prev,
@@ -164,7 +163,6 @@ function GridItem(props) {
     if (!onDrag)
       return;
     if (!refState.current.dragging) {
-      console.warn("gridItemOnDrag onDrag called before onDragStart");
       return;
     }
     let top = refState.current.dragging.top + deltaY;
@@ -207,7 +205,6 @@ function GridItem(props) {
     if (!onDragStop)
       return;
     if (!refState.current.dragging) {
-      console.warn("onDragEnd called before onDragStart");
       return;
     }
     const {
@@ -239,11 +236,9 @@ function GridItem(props) {
   }, handlerName) => {
     const handler = props[handlerName];
     if (!handler) {
-      console.warn("onResizeHandler invalid");
       return;
     }
     if (refProps.current.colapsed) {
-      console.warn("onResizeHandler  colapsed invalid");
       return;
     }
     let {

package/components/GridLayout/subcomponents/Responsive/{index.eb04fd5e.js → index.a6642437.js}

@@ -1,4 +1,4 @@
-import { r as cloneLayoutItem, t as cloneLayout, u as compact, v as correctBounds, w as isEqualLayout, x as DEFAULT_RESPONSIVE_BREAKPOINTS, m as DEFAULT_CONTAINER_PADDING, l as DEFAULT_MARGIN, y as DEFAULT_RESPONSIVE_COLS, o as DEFAULT_COLAPSED_HEIGHT, i as DEFAULT_ROW_HEIGHT, z as isEqualLayouts, G as GridLayout, A as noop } from "../../index.70085b00.js";
+import { r as cloneLayoutItem, t as cloneLayout, u as compact, v as correctBounds, w as isEqualLayout, x as DEFAULT_RESPONSIVE_BREAKPOINTS, m as DEFAULT_CONTAINER_PADDING, l as DEFAULT_MARGIN, y as DEFAULT_RESPONSIVE_COLS, o as DEFAULT_COLAPSED_HEIGHT, i as DEFAULT_ROW_HEIGHT, z as isEqualLayouts, G as GridLayout, A as noop } from "../../index.2383aaf9.js";
 import { useState, useRef, useEffect, useCallback } from "react";
 import { useFirstRender } from "@m4l/graphics";
 import { d as deepEqual } from "../../../../node_modules.d73a220d.js";
@@ -248,7 +248,6 @@ function Responsive(props) {
     let newContainerMargin = currentState.contaierMargin;
     let newContainerPadding = currentState.contaierPadding;
     if (newBreakpoint !== lastBreakpoint || newCols !== lastBreakpointCols || !deepEqual(cols, refState.current.cols) || !deepEqual(breakpoints, refState.current.breakpoints) || !isEqualLayouts(layouts, refState.current.layouts)) {
-      console.debug("useEffect responsive con cambio de algo", newBreakpoint, lastBreakpoint);
       newContainerMargin = getIndentationValue(containerMargin, newBreakpoint);
       newContainerPadding = getIndentationValue(containerPadding, newBreakpoint);
       if (!(lastBreakpoint in newLayouts)) {

package/components/GridLayout/types.d.ts

@@ -1,4 +1,4 @@
-import { SyntheticEvent } from 'react';
+import React, { SyntheticEvent } from 'react';
 import { DraggableEvent } from 'react-draggable';
 export declare type Position = {
     left: number;
@@ -334,7 +334,7 @@ export interface CoreProps {
     /**
      * Defines custom component for resize handle
      */
-    resizeHandle?: React.ReactNode | ((resizeHandle: ResizeHandle) => React.ReactNode);
+    resizeHandle?: React.ReactNode;
     /**
      * Calls when drag starts.
      */

package/components/HelperText/{index.28e9105d.js → index.8b5911d1.js}

@@ -1,25 +1,26 @@
 import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.2414ff25.js";
+import "../Icon/index.c3a579e7.js";
 import "clsx";
 import { jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.a318316e.js";
+import "../mui_extended/IconButton/index.be111a34.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.5111314b.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
-import "../mui_extended/CheckBox.5f6c78b0.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/CheckBox.38abccd8.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.f6bfdd40.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.da26e9d4.js";
-import "../mui_extended/Tab/index.0989d15d.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const HelperTextRoot = styled("div")(({

package/components/Icon/{index.2414ff25.js → index.c3a579e7.js}

@@ -3,7 +3,7 @@ import { styled, generateUtilityClasses, generateUtilityClass, Skeleton } from "
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
 import { useEnvironment } from "@m4l/core";
-import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.72564ef2.js";
+import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.e0587639.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
 const IconRoot = styled("div")(({

package/components/LanguagePopover/{index.065e0296.js → index.7681b08e.js}

@@ -3,25 +3,26 @@ import { styled, generateUtilityClasses, generateUtilityClass, Stack, MenuItem }
 import { I as Image } from "../Image/index.c18ebf5a.js";
 import { useLocales } from "@m4l/graphics";
 import { useEnvironment, useNetwork } from "@m4l/core";
-import "../Icon/index.2414ff25.js";
+import "../Icon/index.c3a579e7.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import "clsx";
 import { jsxs, jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.a318316e.js";
-import "../mui_extended/Accordion/index.5111314b.js";
+import "../mui_extended/IconButton/index.be111a34.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
 import "@mui/material/Button";
 import { I as ImageButton } from "../mui_extended/Button/index.40af964e.js";
-import "../mui_extended/CheckBox.5f6c78b0.js";
+import "../mui_extended/CheckBox.38abccd8.js";
 import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.f6bfdd40.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.da26e9d4.js";
-import "../mui_extended/Tab/index.0989d15d.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const LanguagePopoverRoot = styled("div")(({