@m4l/components 0.1.82 → 0.1.84

package/components/DataGrid/subcomponents/Actions/{index.db54ec98.js → index.a8fc9f6a.js}

@@ -1,47 +1,47 @@
-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.03ad08af.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index.2493b1b1.js";
+import { u as useDataGrid, a as useFilters, d as dataGridClasses, D as DataGridRoot, b as dictionary } from "../../index.1d0a3dec.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.a7f87c96.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.62aea582.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.9b0cc3fe.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.6cf96d04.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.856df8ef.js";
+import { u as useModal } from "../../../../hooks/useModal/index.7611bf21.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.29517521.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.a9420126.js";
 import "../../../../react-draggable.7abb5d0a.js";
 import "../../../Resizeable/index.9a9c79a4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import "../../../Icon/index.2414ff25.js";
+import "../../../Icon/index.d1402200.js";
 import "clsx";
-import "../../../modal/index.e9fece72.js";
-import { A as Actions$1 } from "../../../CommonActions/components/Actions/index.5abb6ac4.js";
+import "../../../modal/index.6f281ef8.js";
+import { A as Actions$1 } from "../../../CommonActions/components/Actions/index.e70e8779.js";
 import "react-hook-form";
 import "@mui/material/Button";
 import "../../../mui_extended/Button/index.40af964e.js";
 import "zustand";
-import "../../../areas/contexts/AreasContext/index.9820bc7f.js";
-import "../../../areas/components/AreasAdmin/index.f011d49d.js";
+import "../../../areas/contexts/AreasContext/index.230d1584.js";
+import "../../../areas/components/AreasAdmin/index.8ab71eb9.js";
 import "zustand/shallow";
 import "../../../ScrollBar/index.d4410cb5.js";
-import "../../../mui_extended/Accordion/index.42cef1c7.js";
+import "../../../mui_extended/Accordion/index.46771196.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/CheckBox.38abccd8.js";
 import "../../../mui_extended/Badge/index.cad260fe.js";
 import "../../../Image/index.c18ebf5a.js";
 import "@mui/lab";
 import "../../../mui_extended/Popover/index.9f35d0eb.js";
-import "../../../mui_extended/Tab/index.0d5f96e6.js";
+import "../../../mui_extended/Tab/index.756fe693.js";
 import "../../../mui_extended/Tooltip/index.5a795dcd.js";
-import "../../../areas/components/AreasViewer/index.51a52736.js";
+import "../../../areas/components/AreasViewer/index.933e506b.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.4016485b.js";
+import { W as WindowBase } from "../../../modal/WindowBase.37158e8d.js";
 const ACTIONS_COLUMN_KEY = "actions-row";
 function ActionsFormatter(props) {
   const {
@@ -376,41 +376,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 +436,7 @@ function Settings() {
     host_static_assets,
     environment_assets
   } = useEnvironment();
+  const isDesktop = useResponsiveDesktop();
   const {
     classes
   } = useDataGrid();
@@ -451,14 +453,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.9b72180b.js → index.912679cc.js}

@@ -4,41 +4,41 @@ import { useContext, useMemo, useEffect, createContext, useRef, createElement, u
 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.62aea582.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../vendor.88ed58a5.js";
+import { g as getNameDataTestId } from "../../vendor.1af105d6.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.2493b1b1.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.d1402200.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.5abb6ac4.js";
-import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.6cf96d04.js";
-import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.856df8ef.js";
+import { g as getCommonActionsDictionary, A as Actions } from "../CommonActions/components/Actions/index.e70e8779.js";
+import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.29517521.js";
+import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.a9420126.js";
 import { useFormContext, useWatch } from "react-hook-form";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
-import "../../contexts/ModalContext/index.efc1135a.js";
+import "../../contexts/ModalContext/index.51da83de.js";
 import "../../react-draggable.7abb5d0a.js";
 import "../Resizeable/index.9a9c79a4.js";
-import "../modal/index.e9fece72.js";
+import "../modal/index.6f281ef8.js";
 import "../Image/index.c18ebf5a.js";
-import "../mui_extended/Accordion/index.42cef1c7.js";
+import "../mui_extended/Accordion/index.46771196.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/CheckBox.38abccd8.js";
 import "../mui_extended/Badge/index.cad260fe.js";
 import "@mui/lab";
-import "../mui_extended/Pager/index.da26e9d4.js";
-import "../mui_extended/Tab/index.0d5f96e6.js";
+import "../mui_extended/Pager/index.a7f87c96.js";
+import "../mui_extended/Tab/index.756fe693.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { useStore, createStore } from "zustand";
-import "../areas/contexts/AreasContext/index.9820bc7f.js";
-import "../areas/components/AreasAdmin/index.f011d49d.js";
-import "../areas/components/AreasViewer/index.51a52736.js";
+import "../areas/contexts/AreasContext/index.230d1584.js";
+import "../areas/components/AreasAdmin/index.8ab71eb9.js";
+import "../areas/components/AreasViewer/index.933e506b.js";
 import "../LinearProgressIndeterminate/index.60dabc06.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
@@ -46,19 +46,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.6edb51b1.js";
+import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.d5afb409.js";
 import "lodash/debounce";
-import "../hook-form/RHFAutocompleteAsync/index.c2ca5c66.js";
-import "../hook-form/RHFCheckbox/index.c6c3933b.js";
-import "../HelperText/index.6c3adb40.js";
+import "../hook-form/RHFAutocompleteAsync/index.a4f00088.js";
+import "../hook-form/RHFCheckbox/index.9bf6edb0.js";
+import "../HelperText/index.a47ff233.js";
 import "@mui/x-date-pickers";
-import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.3add0fa4.js";
-import { R as RHFTextField } from "../hook-form/RHFTextField/index.20daa95e.js";
-import "../hook-form/RHFPeriod/index.72edef4d.js";
-import "../Period/index.4fd9df2a.js";
+import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.a2c1ed2c.js";
+import { R as RHFTextField } from "../hook-form/RHFTextField/index.5a0fa776.js";
+import "../hook-form/RHFPeriod/index.b5204ce2.js";
+import "../Period/index.e129cdec.js";
 import "lodash/isString";
 import "react-dropzone";
-import "../hook-form/RHFUpload/index.cc5adc15.js";
+import "../hook-form/RHFUpload/index.b36539d6.js";
 import * as Yup from "yup";
 const COMPONENT_PREFIX = "M4LDynamicFilter";
 const COMPONENT_CLASS_NAME = "M4LDynamicFilter";

package/components/GridLayout/constants.d.ts

@@ -2,7 +2,7 @@ import { Margin } from './types';
 export declare const COMPONENT_TEST_ID = "M4LGridLayout";
 export declare const COMPONENT_CLASS_NAME = "M4LGridLayout";
 export declare const DEFAULT_COLS = 12;
-export declare const DEFAULT_ROW_HEIGHT = 150;
+export declare const DEFAULT_ROW_HEIGHT = 20;
 export declare const DEFAULT_CONTAINER_WIDTH = 1280;
 export declare const DEFAULT_CONTAINER_HEIGHT = 480;
 export declare const DEFAULT_RESPONSIVE_COLS: {
@@ -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.76bccc4f.js → index.c55f16eb.js}

@@ -1,8 +1,8 @@
 import { useState, useRef, useEffect, useCallback } from "react";
 import clsx from "clsx";
-import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.01fc14c3.js";
+import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.6c68811f.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { styled } from "@mui/material/styles";
+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";
@@ -10,7 +10,7 @@ import "@m4l/graphics";
 import "lodash";
 const COMPONENT_CLASS_NAME = "M4LGridLayout";
 const DEFAULT_COLS = 12;
-const DEFAULT_ROW_HEIGHT = 150;
+const DEFAULT_ROW_HEIGHT = 20;
 const DEFAULT_CONTAINER_WIDTH = 1280;
 const DEFAULT_CONTAINER_HEIGHT = 480;
 const DEFAULT_RESPONSIVE_COLS = { lg: 12, md: 10, sm: 6, xs: 4, xxs: 1 };
@@ -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) {
@@ -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;
@@ -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;
@@ -672,7 +679,7 @@ function GridLayout(props) {
     isResizable = true,
     allowOverlap = false,
     useCSSTransforms = true,
-    compactType = null,
+    compactType = "vertical",
     preventCollision = false,
     resizeHandles = ["se"],
     resizeHandle,
@@ -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();
     }
@@ -962,7 +967,6 @@ function GridLayout(props) {
     node
   }) => {
     if (!refState.current.activeDrag) {
-      console.log("GridLayout localOnResizeStop sin cambio");
       return;
     }
     const {
@@ -986,13 +990,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];
@@ -1125,9 +1128,10 @@ function GridLayout(props) {
 }
 export {
   noop as A,
+  COMPONENT_CLASS_NAME as C,
   DEFAULT_COLS as D,
   GridLayout as G,
-  THROTTLE_RESIZE_TIME as T,
+  THROTTLE_RESIZE_TIMEOUT as T,
   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 { WidthProvider } from './subcomponents/WidthProvider';
+export { SizeProvider } from './subcomponents/SizeProvider';

package/components/GridLayout/subcomponents/Griditem/{index.01fc14c3.js → index.6c68811f.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.76bccc4f.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.c55f16eb.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.e589d8bf.js → index.a6e33b8d.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.76bccc4f.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.c55f16eb.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/subcomponents/Responsive/responsiveUtils.d.ts

@@ -25,7 +25,7 @@ export declare function getColsFromBreakpoint(breakpoint: Breakpoint, cols: Brea
  * @param  {String} breakpoint New breakpoint.
  * @param  {String} breakpoint Last breakpoint (for fallback).
  * @param  {Number} cols       Column count at new breakpoint.
- * @param  {Boolean} verticalCompact Whether or not to compact the layout
+ * @param  {CompactType} compactType
  *   vertically.
  * @return {Array}             New layout.
  */

package/components/GridLayout/subcomponents/{WidthProvider/index.50dafd87.js → SizeProvider/index.bfa05dfa.js}

@@ -2,10 +2,9 @@ import { useRef, useState, useMemo, useCallback, useEffect } from "react";
 import clsx from "clsx";
 import { throttle } from "lodash";
 import { useResizeObserver } from "@m4l/graphics";
-import { j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, T as THROTTLE_RESIZE_TIME } from "../../index.76bccc4f.js";
+import { j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, T as THROTTLE_RESIZE_TIMEOUT, C as COMPONENT_CLASS_NAME } from "../../index.c55f16eb.js";
 import { jsx } from "react/jsx-runtime";
-const layoutClassName = "M4LGridLayout";
-function WidthProvider(ComposedComponent) {
+function SizeProvider(ComposedComponent) {
   return (props) => {
     const {
       measureBeforeMount = true,
@@ -27,7 +26,7 @@ function WidthProvider(ComposedComponent) {
         }));
       }
     }, []);
-    const throttleResize = throttle(onWindowResizeMemo, THROTTLE_RESIZE_TIME, {
+    const throttleResize = throttle(onWindowResizeMemo, THROTTLE_RESIZE_TIMEOUT, {
       leading: false,
       trailing: true
     });
@@ -42,12 +41,10 @@ function WidthProvider(ComposedComponent) {
       }));
       refMounted.current = true;
       onWindowResizeMemo();
-      return () => {
-      };
     }, []);
     if (measureBeforeMount && !currentState.mounted) {
       return /* @__PURE__ */ jsx("div", {
-        className: clsx(props.className, layoutClassName),
+        className: clsx(props.className, COMPONENT_CLASS_NAME),
         style: props.style,
         ref: elementRef
       });
@@ -61,5 +58,5 @@ function WidthProvider(ComposedComponent) {
   };
 }
 export {
-  WidthProvider as W
+  SizeProvider as S
 };

package/components/GridLayout/subcomponents/{WidthProvider → SizeProvider}/index.d.ts

@@ -11,5 +11,5 @@ export interface ComponentResponsiveReactGridLayoutProps extends Omit<Responsive
     measureBeforeMount?: boolean;
 }
 declare type MinimalParameters = Pick<CoreProps, 'containerWidth' | 'containerHeight' | 'innerRef' | 'style' | 'className'>;
-export declare function WidthProvider<T extends MinimalParameters>(ComposedComponent: FunctionComponent<T>): (props: Omit<T, 'containerWidth' | 'containerHeight' | 'innerRef'> & HOCProps) => import("react").JSX.Element;
+export declare function SizeProvider<T extends MinimalParameters>(ComposedComponent: FunctionComponent<T>): (props: Omit<T, 'containerWidth' | 'containerHeight' | 'innerRef'> & HOCProps) => import("react").JSX.Element;
 export {};

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;
@@ -226,6 +226,12 @@ export interface CoreProps {
      * Valor por defecto: false
      */
     autoSize?: boolean | undefined;
+    /**
+     * A CSS selector for tags that will act as the draggable handle.
+     * For example: `draggableHandle: '.MyDragHandleClassName'`
+     * If you forget the leading . it will not work.
+     */
+    draggableHandle?: string | undefined;
     /**
      * A CSS selector for tags that will not be draggable.
      * For example: `draggableCancel: '.MyNonDraggableAreaClassName'`
@@ -234,15 +240,10 @@ export interface CoreProps {
      * Valor por defecto:
      */
     draggableCancel?: string | undefined;
-    /**
-     * A CSS selector for tags that will act as the draggable handle.
-     * For example: `draggableHandle: '.MyDragHandleClassName'`
-     * If you forget the leading . it will not work.
-     */
-    draggableHandle?: string | undefined;
     /**
      * Compaction type.
      * Valor por defecto: 'vertical'
+     * TODO: Incluir compactación amabas
      */
     compactType?: CompactType;
     /**
@@ -264,10 +265,6 @@ export interface CoreProps {
         w: number;
         h: number;
     } | undefined;
-    /**
-     * If true, the layout will compact vertically.
-     */
-    verticalCompact?: boolean | undefined;
     /**
      * Default Infinity, but you can specify a max here if you like.
      * Note that this isn't fully fleshed out and won't error if you specify a layout that
@@ -337,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/GridLayout/utils.d.ts

@@ -27,8 +27,7 @@ export declare function compactItem(compareWith: Layout, l: LayoutItem, compactT
  * Does not modify layout items (clones). Creates a new layout array.
  *
  * @param  {Array} layout Layout.
- * @param  {Boolean} verticalCompact Whether or not to compact the layout
- *   vertically.
+ * @param  {CompactType} compactType
  * @param  {Boolean} allowOverlap When `true`, allows overlapping grid items.
  * @return {Array}       Compacted Layout.
  */

package/components/HelperText/{index.6c3adb40.js → index.a47ff233.js}

@@ -1,25 +1,25 @@
 import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.2414ff25.js";
+import "../Icon/index.d1402200.js";
 import "clsx";
 import { jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.a318316e.js";
+import "../mui_extended/IconButton/index.62aea582.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.42cef1c7.js";
+import "../mui_extended/Accordion/index.46771196.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/CheckBox.38abccd8.js";
 import "../mui_extended/Badge/index.cad260fe.js";
 import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.f6bfdd40.js";
+import "../mui_extended/MenuActions/index.2493b1b1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.da26e9d4.js";
-import "../mui_extended/Tab/index.0d5f96e6.js";
+import "../mui_extended/Pager/index.a7f87c96.js";
+import "../mui_extended/Tab/index.756fe693.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.d1402200.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.327679a6.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
 const IconRoot = styled("div")(({