@m4l/components 4.1.0 → 4.1.2

package/components/GridLayout/calculateUtils-wGPJ2spi.js

@@ -1,71 +0,0 @@
-function calcGridColWidth(positionParams) {
-  const { containerMargin: margin, containerPadding, containerWidth, cols } = positionParams;
-  return (containerWidth - margin[0] * (cols - 1) - containerPadding[0] * 2) / cols;
-}
-function calcGridItemWHPx(gridUnits, colOrRowSize, marginPx) {
-  if (!Number.isFinite(gridUnits)) return gridUnits;
-  return Math.round(colOrRowSize * gridUnits + Math.max(0, gridUnits - 1) * marginPx);
-}
-function calcGridItemPosition(positionParams, x, y, w, h, maximize, state) {
-  const {
-    containerMargin,
-    containerPadding,
-    rowHeight
-  } = positionParams;
-  const colWidth = calcGridColWidth(positionParams);
-  const out = {};
-  if (state && state.resizing) {
-    out.width = Math.round(state.resizing.width);
-    out.height = Math.round(state.resizing.height);
-  } else {
-    if (maximize === "maximize_me") {
-      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]);
-    }
-  }
-  if (state && state.dragging) {
-    out.top = Math.round(state.dragging.top);
-    out.left = Math.round(state.dragging.left);
-  } else {
-    if (maximize === "maximize_me") {
-      out.left = containerPadding[0];
-      out.top = containerPadding[1];
-    } else {
-      out.left = Math.round((colWidth + containerMargin[0]) * x + containerPadding[0]);
-      out.top = Math.round((rowHeight + containerMargin[1]) * y + containerPadding[1]);
-    }
-  }
-  return out;
-}
-function calcXY(positionParams, top, left, w, h) {
-  const { containerMargin: margin, cols, rowHeight, maxRows } = positionParams;
-  const colWidth = calcGridColWidth(positionParams);
-  let x = Math.round((left - margin[0]) / (colWidth + margin[0]));
-  let y = Math.round((top - margin[1]) / (rowHeight + margin[1]));
-  x = clamp(x, 0, cols - w);
-  y = clamp(y, 0, maxRows - h);
-  return { x, y };
-}
-function calcWH(positionParams, width, height, x, y) {
-  const { containerMargin: margin, maxRows, cols, rowHeight } = positionParams;
-  const colWidth = calcGridColWidth(positionParams);
-  let w = Math.round((width + margin[0]) / (colWidth + margin[0]));
-  let h = Math.round((height + margin[1]) / (rowHeight + margin[1]));
-  w = clamp(w, 0, cols - x);
-  h = clamp(h, 0, maxRows - y);
-  return { w, h };
-}
-function clamp(num, lowerBound, upperBound) {
-  return Math.max(Math.min(num, upperBound), lowerBound);
-}
-export {
-  calcGridItemWHPx as a,
-  calcGridColWidth as b,
-  calcXY as c,
-  calcWH as d,
-  clamp as e,
-  calcGridItemPosition as f
-};

package/components/GridLayout/classes/index-qNqBA3Jg.js

@@ -1,24 +0,0 @@
-import { generateUtilityClasses } from "@mui/material";
-import "@mui/base";
-import { C as COMPONENT_CLASS_NAME } from "../constants-BOQgOrZA.js";
-const gridLayoutClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
-  /* elements */
-  "root",
-  "gridItemRoot",
-  "gridItemType",
-  "gridItemPlaceholder",
-  "gridItemFreeMove",
-  /* states or variants of elements */
-  "maximizeMe",
-  "maximizeOther",
-  "colapsed",
-  "resizeHide",
-  "invisible",
-  "cssTransforms",
-  "resizing",
-  "dragging",
-  "static"
-]);
-export {
-  gridLayoutClasses as g
-};

package/components/GridLayout/constants-BOQgOrZA.js

@@ -1,26 +0,0 @@
-const COMPONENT_CLASS_NAME = "M4LGridLayout";
-const DEFAULT_COLS = 12;
-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 };
-const DEFAULT_RESPONSIVE_BREAKPOINTS = { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 };
-const DEFAULT_CONTAINER_PADDING = [10, 10];
-const DEFAULT_MARGIN = [10, 10];
-const DEFAULT_TRANSFORM_SCALE = 1;
-const DEFAULT_COLAPSED_HEIGHT = 35;
-const THROTTLE_RESIZE_TIMEOUT = 200;
-export {
-  COMPONENT_CLASS_NAME as C,
-  DEFAULT_COLS as D,
-  THROTTLE_RESIZE_TIMEOUT as T,
-  DEFAULT_CONTAINER_PADDING as a,
-  DEFAULT_MARGIN as b,
-  DEFAULT_ROW_HEIGHT as c,
-  DEFAULT_COLAPSED_HEIGHT as d,
-  DEFAULT_CONTAINER_WIDTH as e,
-  DEFAULT_CONTAINER_HEIGHT as f,
-  DEFAULT_TRANSFORM_SCALE as g,
-  DEFAULT_RESPONSIVE_BREAKPOINTS as h,
-  DEFAULT_RESPONSIVE_COLS as i
-};

package/components/GridLayout/index-l0sNRNKZ.js

@@ -1 +0,0 @@
-

package/components/GridLayout/styles-BqM7s5fd.js

@@ -1,163 +0,0 @@
-import { styled, alpha } from "@mui/material/styles";
-import { g as gridLayoutClasses } from "./classes/index-qNqBA3Jg.js";
-const react_resizable_css = {};
-const GridLayoutRoot = styled("div")`
-  overflow: auto;
-  position: relative;
-  transition: height 200ms ease;
-
-  .${gridLayoutClasses.gridItemRoot} {
-    transition: all 200ms ease;
-    transition-property: left, top;
-  }
-  .${gridLayoutClasses.gridItemRoot} img {
-    pointer-events: none;
-    user-select: none;
-  }
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.cssTransforms} {
-    transition-property: transform;
-    transition: left 0.1s ease, top 0.1s ease;
-  }
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.maximizeOther} {
-    display: none;
-  }
-
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.gridItemFreeMove} {
-    z-index: 1;
-    will-change: width, height;
-  }
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.resizing} {
-    z-index: 2000;
-    will-change: width, height;
-  }
-
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.dragging} {
-    transition: none;
-    z-index: 4000;
-    will-change: transform;
-  }
-
-  .${gridLayoutClasses.gridItemRoot}.dropping {
-    visibility: hidden;
-  }
-
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.gridItemPlaceholder} {
-    background: ${(props) => props.theme.vars.palette.primary?.toneOpacity};
-    opacity: 0.5;
-    transition-duration: 100ms;
-    z-index: 3000;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    -o-user-select: none;
-    user-select: none;
-  }
-
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle {
-    position: absolute;
-    width: 7px;
-    height: 7px;
-    background-image: unset;
-
-    & .M4LIcon-icon {
-      width: 10px;
-      height: 10px;
-      min-width: 10px;
-      min-height: 10px;
-      background-color: ${(props) => alpha(props.theme.colorSchemes.finalTheme.palette.text.primary, 0.3)};
-    }
-  }
-
-  /*  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle::after {
-        content: '';
-        position: absolute;
-        right: 3px;
-        bottom: 3px;
-        width: 5px;
-        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;
-    border-color: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-  }
-
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-sw {
-    bottom: 3px;
-    left: 3px;
-    cursor: sw-resize;
-    transform: rotate(90deg);
-    border-right: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom-right-radius: 15%;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-se {
-    bottom: 3px;
-    right: 3px;
-    cursor: se-resize;
-    border-right: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom-right-radius: 15%;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-nw {
-    top: 3px;
-    left: 3px;
-    cursor: nw-resize;
-    transform: rotate(180deg);
-    border-right: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom-right-radius: 15%;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-ne {
-    top: 3px;
-    right: 3px;
-    cursor: ne-resize;
-    transform: rotate(270deg);
-    border-right: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom: ${(props) => `2px solid ${props.theme.vars.palette.text.disabled}`};
-    border-bottom-right-radius: 15%;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-w,
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-e {
-    top: 50%;
-    margin-top: -10px;
-    cursor: ew-resize;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-w {
-    left: 0;
-    transform: rotate(135deg);
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-e {
-    right: 0;
-    transform: rotate(315deg);
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-n,
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-s {
-    left: 50%;
-    margin-left: -10px;
-    cursor: ns-resize;
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-n {
-    top: 0;
-    transform: rotate(225deg);
-  }
-  .${gridLayoutClasses.gridItemRoot} > .react-resizable-handle.react-resizable-handle-s {
-    bottom: 0;
-    transform: rotate(45deg);
-  }
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.maximizeMe} > .react-resizable-handle,
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.resizeHide} > .react-resizable-handle {
-    display: none;
-  }
-  .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.invisible} {
-    display: none;
-  }
-
-  ${react_resizable_css}
-  ${(props) => props.theme.components?.M4LGridLayout?.styleOverrides}
-`;
-export {
-  GridLayoutRoot as G
-};

package/components/GridLayout/subcomponents/GridItem/index-B2wGJ3pz.js

@@ -1,398 +0,0 @@
-import { jsx, Fragment } from "react/jsx-runtime";
-import React__default, { useRef, useEffect, useState, useCallback, useMemo } from "react";
-import { D as DraggableCore_1 } from "../../../../react-draggable-lPKOvvDX.js";
-import { R as Resizable } from "../../../../react-resizable-Dpx4PV2R.js";
-import { h as getH, p as perc, s as setTransform, j as setTopLeft } from "../../utils-CF3BArf2.js";
-import { c as calcXY, a as calcGridItemWHPx, b as calcGridColWidth, d as calcWH, e as clamp, f as calcGridItemPosition } from "../../calculateUtils-wGPJ2spi.js";
-import clsx from "clsx";
-import { deepEqual } from "fast-equals";
-import { D as DEFAULT_COLS, c as DEFAULT_ROW_HEIGHT, e as DEFAULT_CONTAINER_WIDTH, f as DEFAULT_CONTAINER_HEIGHT, b as DEFAULT_MARGIN, a as DEFAULT_CONTAINER_PADDING, g as DEFAULT_TRANSFORM_SCALE, d as DEFAULT_COLAPSED_HEIGHT } from "../../constants-BOQgOrZA.js";
-import { g as gridLayoutClasses } from "../../classes/index-qNqBA3Jg.js";
-function GridItem(props) {
-  const {
-    layoutItemRender: ComponentItemRender,
-    type,
-    i,
-    x,
-    y,
-    w,
-    h,
-    cols = DEFAULT_COLS,
-    rowHeight = DEFAULT_ROW_HEIGHT,
-    containerWidth = DEFAULT_CONTAINER_WIDTH,
-    containerHeight = DEFAULT_CONTAINER_HEIGHT,
-    margin = DEFAULT_MARGIN,
-    containerPadding = DEFAULT_CONTAINER_PADDING,
-    transformScale = DEFAULT_TRANSFORM_SCALE,
-    colapsedHeight = DEFAULT_COLAPSED_HEIGHT,
-    isBounded,
-    maxRows = Infinity,
-    className = "",
-    draggableCancel = "",
-    draggableHandle = "",
-    minH = 1,
-    minW = 1,
-    maxH = Infinity,
-    maxW = Infinity,
-    isResizable = true,
-    isDraggable = true,
-    resizeHandles,
-    resizeHandle,
-    useCSSTransforms = true,
-    usePercentages,
-    style,
-    freeMove,
-    maximize = "none",
-    colapsed,
-    visible = true,
-    onDragStart,
-    onDrag,
-    onDragStop,
-    onFreeMoveClick
-  } = props;
-  const refProps = useRef({
-    cols,
-    x,
-    y,
-    w,
-    h: getH(h, colapsedHeight, rowHeight, colapsed),
-    minW,
-    maxW,
-    minH,
-    maxH,
-    containerWidth,
-    containerHeight,
-    margin,
-    containerPadding,
-    rowHeight,
-    maxRows,
-    colapsed
-  });
-  useEffect(() => {
-    refProps.current = {
-      cols,
-      x,
-      y,
-      w,
-      h: getH(h, colapsedHeight, rowHeight, colapsed),
-      minW,
-      maxW,
-      minH,
-      maxH,
-      containerWidth,
-      containerHeight,
-      margin,
-      containerPadding,
-      rowHeight,
-      maxRows,
-      colapsed
-    };
-  }, [
-    cols,
-    x,
-    y,
-    w,
-    h,
-    minW,
-    maxW,
-    minH,
-    maxH,
-    containerWidth,
-    containerHeight,
-    margin,
-    containerPadding,
-    rowHeight,
-    maxRows,
-    colapsed,
-    colapsedHeight
-  ]);
-  const [currentState, setCurrentState] = useState({
-    resizing: void 0,
-    dragging: void 0
-  });
-  const refState = useRef({
-    resizing: void 0,
-    dragging: void 0
-  });
-  const elementRef = useRef(null);
-  const getPositionParams = useCallback(
-    (preferContainerWidth, preferContainerHeight) => {
-      return {
-        cols: refProps.current.cols,
-        containerPadding: refProps.current.containerPadding,
-        containerWidth: preferContainerWidth || refProps.current.containerWidth,
-        containerHeight: preferContainerHeight || refProps.current.containerHeight,
-        containerMargin: refProps.current.margin,
-        maxRows: refProps.current.maxRows,
-        rowHeight: refProps.current.rowHeight
-      };
-    },
-    []
-  );
-  const createStyle = (pos2) => {
-    let newStyle;
-    if (useCSSTransforms) {
-      newStyle = setTransform(pos2);
-    } else {
-      newStyle = setTopLeft(pos2);
-      if (usePercentages) {
-        newStyle.left = perc(pos2.left / containerWidth);
-        newStyle.width = perc(pos2.width / containerWidth);
-      }
-    }
-    return newStyle;
-  };
-  const gridItemOnDragStart = useCallback((e, { node }) => {
-    if (!onDragStart) return;
-    const newPosition = { top: 0, left: 0 };
-    const { offsetParent } = node;
-    if (!offsetParent) return;
-    const parentRect = offsetParent.getBoundingClientRect();
-    const clientRect = node.getBoundingClientRect();
-    const cLeft = clientRect.left / transformScale;
-    const pLeft = parentRect.left / transformScale;
-    const cTop = clientRect.top / transformScale;
-    const pTop = parentRect.top / transformScale;
-    newPosition.left = cLeft - pLeft + offsetParent.scrollLeft;
-    newPosition.top = cTop - pTop + offsetParent.scrollTop;
-    refState.current.dragging = newPosition;
-    setCurrentState((prev) => ({ ...prev, dragging: newPosition }));
-    const { x: newX, y: newY } = calcXY(
-      getPositionParams(),
-      newPosition.top,
-      newPosition.left,
-      refProps.current.w,
-      refProps.current.h
-    );
-    onDragStart(i, newX, newY, {
-      e,
-      node,
-      newPosition
-    });
-  }, []);
-  const gridItemOnDrag = useCallback(
-    (e, { node, deltaX, deltaY }) => {
-      if (!onDrag) return;
-      if (!refState.current.dragging) {
-        return;
-      }
-      let top = refState.current.dragging.top + deltaY;
-      let left = refState.current.dragging.left + deltaX;
-      const positionParams = getPositionParams();
-      if (isBounded) {
-        const { offsetParent } = node;
-        if (offsetParent) {
-          const bottomBoundary = offsetParent.clientHeight - calcGridItemWHPx(
-            refProps.current.h,
-            refProps.current.rowHeight,
-            refProps.current.margin[1]
-          );
-          top = clamp(top, 0, bottomBoundary);
-          const colWidth = calcGridColWidth(positionParams);
-          const rightBoundary = containerWidth - calcGridItemWHPx(refProps.current.w, colWidth, refProps.current.margin[0]);
-          left = clamp(left, 0, rightBoundary);
-        }
-      }
-      const newPosition = { top, left };
-      refState.current.dragging = newPosition;
-      setCurrentState((prev) => ({ ...prev, dragging: newPosition }));
-      const { x: newX, y: newY } = calcXY(
-        positionParams,
-        top,
-        left,
-        refProps.current.w,
-        refProps.current.h
-      );
-      onDrag(i, newX, newY, {
-        e,
-        node,
-        newPosition
-      });
-    },
-    []
-  );
-  const gridItemOnDragStop = useCallback((e, { node }) => {
-    if (!onDragStop) return;
-    if (!refState.current.dragging) {
-      return;
-    }
-    const { left, top } = refState.current.dragging;
-    const newPosition = { top, left };
-    refState.current.dragging = void 0;
-    setCurrentState((prev) => ({ ...prev, dragging: void 0 }));
-    const { x: newX, y: newY } = calcXY(
-      getPositionParams(),
-      top,
-      left,
-      refProps.current.w,
-      refProps.current.h
-    );
-    return onDragStop(i, newX, newY, {
-      e,
-      node,
-      newPosition
-    });
-  }, []);
-  const onResizeHandler = useCallback(
-    (e, { node, size }, handlerName) => {
-      const handler = props[handlerName];
-      if (!handler) {
-        return;
-      }
-      if (refProps.current.colapsed) {
-        return;
-      }
-      let { w: newW, h: newH } = calcWH(
-        getPositionParams(),
-        size.width,
-        size.height,
-        refProps.current.x,
-        refProps.current.y
-      );
-      const newMinW = Math.max(refProps.current.minW, 1);
-      const newMaxW = Math.min(refProps.current.maxW, refProps.current.cols - refProps.current.x);
-      newW = clamp(newW, newMinW, newMaxW);
-      newH = clamp(newH, refProps.current.minH, refProps.current.maxH);
-      const resizing = handlerName === "onResizeStop" ? void 0 : size;
-      setCurrentState((prev) => ({
-        ...prev,
-        resizing
-      }));
-      refState.current.resizing = resizing;
-      handler(i, newW, newH, { e, node, size });
-    },
-    []
-  );
-  const localOnResizeStop = useCallback((e, callbackData) => {
-    onResizeHandler(e, callbackData, "onResizeStop");
-  }, []);
-  const localOnResizeStart = useCallback((e, callbackData) => {
-    onResizeHandler(e, callbackData, "onResizeStart");
-  }, []);
-  const localFreeMoveOnClick = useCallback(() => {
-    if (!onFreeMoveClick) return;
-    onFreeMoveClick(i);
-  }, []);
-  const mixinResizable = useCallback(
-    (child, position, positionParams) => {
-      const maxWidth = calcGridItemPosition(positionParams, 0, 0, cols - x, 0, maximize).width;
-      const mins = calcGridItemPosition(positionParams, 0, 0, minW, minH, maximize);
-      const maxes = calcGridItemPosition(positionParams, 0, 0, maxW, maxH, maximize);
-      const minConstraints = [mins.width, mins.height];
-      const maxConstraints = [
-        Math.min(maxes.width, maxWidth),
-        Math.min(maxes.height, Infinity)
-      ];
-      return /* @__PURE__ */ jsx(
-        Resizable,
-        {
-          draggableOpts: {
-            disabled: !isResizable || maximize !== "none" || colapsed
-          },
-          className: isResizable ? void 0 : "react-resizable-hide",
-          width: position.width,
-          height: position.height,
-          minConstraints,
-          maxConstraints,
-          onResizeStop: localOnResizeStop,
-          onResizeStart: localOnResizeStart,
-          onResize: localOnResize,
-          transformScale,
-          resizeHandles,
-          handle: resizeHandle,
-          children: child
-        }
-      );
-    },
-    [
-      cols,
-      x,
-      minW,
-      minH,
-      maxW,
-      maxH,
-      isResizable,
-      transformScale,
-      resizeHandles,
-      resizeHandle,
-      maximize,
-      colapsed
-    ]
-  );
-  const mixinDraggable = useCallback(
-    (child) => {
-      return /* @__PURE__ */ jsx(
-        DraggableCore_1,
-        {
-          disabled: !isDraggable || maximize !== "none",
-          onStart: gridItemOnDragStart,
-          onDrag: gridItemOnDrag,
-          onStop: gridItemOnDragStop,
-          handle: draggableHandle,
-          cancel: ".react-resizable-handle" + (draggableCancel ? "," + draggableCancel : ""),
-          scale: transformScale,
-          nodeRef: elementRef,
-          children: child
-        }
-      );
-    },
-    [isDraggable, draggableHandle, transformScale, draggableCancel, maximize]
-  );
-  const localOnResize = useCallback((e, callbackData) => {
-    onResizeHandler(e, callbackData, "onResize");
-  }, []);
-  const positionParms = getPositionParams(containerWidth, containerHeight);
-  const pos = calcGridItemPosition(
-    positionParms,
-    x,
-    y,
-    w,
-    getH(h, colapsedHeight, rowHeight, colapsed),
-    maximize,
-    currentState
-  );
-  const classNameFinal = clsx(gridLayoutClasses.gridItemRoot, className, {
-    [`${gridLayoutClasses.gridItemType}-${type}`]: true,
-    [gridLayoutClasses.static]: props.static,
-    [gridLayoutClasses.resizing]: Boolean(currentState.resizing),
-    [gridLayoutClasses.dragging]: Boolean(currentState.dragging),
-    [gridLayoutClasses.maximizeMe]: maximize === "maximize_me",
-    [gridLayoutClasses.maximizeOther]: maximize === "maximize_other",
-    [gridLayoutClasses.colapsed]: colapsed,
-    [`${gridLayoutClasses.colapsed}-${colapsedHeight}`]: colapsed,
-    [gridLayoutClasses.gridItemFreeMove]: freeMove,
-    [gridLayoutClasses.resizeHide]: colapsed,
-    [gridLayoutClasses.invisible]: !visible,
-    [gridLayoutClasses.cssTransforms]: useCSSTransforms,
-    "react-draggable": isDraggable
-    //Requerido para el componente Draggable
-    // dropping: Boolean(droppingPosition),
-  });
-  const styleFinal = {
-    ...style,
-    ...createStyle(pos)
-    //TODO: Delegar el estilo en el ItemRender
-  };
-  const memoLayouItemRender = useMemo(() => {
-    return /* @__PURE__ */ jsx(ComponentItemRender, { type, i });
-  }, [type, i]);
-  const gridItemRoot = /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: classNameFinal,
-      ref: elementRef,
-      style: styleFinal,
-      role: "none",
-      onClick: localFreeMoveOnClick,
-      children: memoLayouItemRender
-    }
-  );
-  const gridItem = mixinDraggable(mixinResizable(gridItemRoot, pos, getPositionParams()));
-  return /* @__PURE__ */ jsx(Fragment, { children: gridItem });
-}
-const MemonizedGridItem = React__default.memo(GridItem, (prevProps, nextProps) => {
-  return deepEqual(prevProps, nextProps);
-});
-export {
-  MemonizedGridItem as M
-};