@m4l/components 4.0.0 → 4.1.1

package/components/GridLayout/subcomponents/Responsive/helper-6U-MAGmf.js

@@ -1,62 +0,0 @@
-import { d as DEFAULT_COLAPSED_HEIGHT, h as DEFAULT_RESPONSIVE_BREAKPOINTS, a as DEFAULT_CONTAINER_PADDING, b as DEFAULT_MARGIN, i as DEFAULT_RESPONSIVE_COLS, c as DEFAULT_ROW_HEIGHT } from "../../constants-BOQgOrZA.js";
-import { i as isEqualLayout } from "../../utils-CF3BArf2.js";
-import { g as getBreakpointFromWidth, a as getColsFromBreakpoint, f as findOrGenerateResponsiveLayout, b as getIndentationValue } from "./responsiveUtils-Bn3nVJDm.js";
-function generateInitialState(props) {
-  const {
-    containerWidth,
-    breakpoint,
-    breakpoints = DEFAULT_RESPONSIVE_BREAKPOINTS,
-    containerPadding = DEFAULT_CONTAINER_PADDING,
-    containerMargin = DEFAULT_MARGIN,
-    layouts: defaultLayouts = {},
-    cols = DEFAULT_RESPONSIVE_COLS,
-    compactType = null,
-    colapsedHeight = DEFAULT_COLAPSED_HEIGHT,
-    rowHeight = DEFAULT_ROW_HEIGHT
-  } = props;
-  const newBreakpoint = breakpoint || getBreakpointFromWidth(breakpoints, containerWidth);
-  const newCols = getColsFromBreakpoint(newBreakpoint, cols);
-  let fireOnLoadLayoutChange = true;
-  const initialColapsedHeight = getHeight(colapsedHeight, newBreakpoint);
-  const initialrowHeight = getHeight(rowHeight, newBreakpoint);
-  const initialLayout = findOrGenerateResponsiveLayout(
-    defaultLayouts,
-    breakpoints,
-    newBreakpoint,
-    newBreakpoint,
-    newCols,
-    compactType,
-    { [newBreakpoint]: newCols },
-    initialColapsedHeight,
-    initialrowHeight
-  );
-  if (defaultLayouts[newBreakpoint]) {
-    if (isEqualLayout(defaultLayouts[newBreakpoint], initialLayout)) {
-      fireOnLoadLayoutChange = false;
-    }
-  }
-  const ret = {
-    breakpointLayout: initialLayout,
-    breakpoint: newBreakpoint,
-    cols: newCols,
-    contaierMargin: getIndentationValue(containerMargin, newBreakpoint),
-    contaierPadding: getIndentationValue(containerPadding, newBreakpoint),
-    fireOnLoadLayoutChange,
-    colapsedHeight: initialColapsedHeight,
-    rowHeight: initialrowHeight
-  };
-  return ret;
-}
-const getHeight = (objectOrHeight, currentBreakpoint) => {
-  if (typeof objectOrHeight == "number") {
-    return objectOrHeight;
-  }
-  if (objectOrHeight[currentBreakpoint]) {
-    return objectOrHeight[currentBreakpoint];
-  }
-  return DEFAULT_COLAPSED_HEIGHT;
-};
-export {
-  getHeight as a,
-  generateInitialState as g
-};

package/components/GridLayout/subcomponents/Responsive/index-Co4cLAS4.js

@@ -1,160 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { k as isEqualLayouts, c as cloneLayout, n as noop } from "../../utils-CF3BArf2.js";
-import { g as getBreakpointFromWidth, a as getColsFromBreakpoint, b as getIndentationValue, f as findOrGenerateResponsiveLayout } from "./responsiveUtils-Bn3nVJDm.js";
-import { useState, useRef, useEffect, useCallback } from "react";
-import { useFirstRender } from "@m4l/graphics";
-import { G as GridLayout } from "../../GridLayout-CYwAPA42.js";
-import { h as DEFAULT_RESPONSIVE_BREAKPOINTS, i as DEFAULT_RESPONSIVE_COLS, a as DEFAULT_CONTAINER_PADDING, b as DEFAULT_MARGIN, d as DEFAULT_COLAPSED_HEIGHT, c as DEFAULT_ROW_HEIGHT } from "../../constants-BOQgOrZA.js";
-import { g as generateInitialState, a as getHeight } from "./helper-6U-MAGmf.js";
-import { deepEqual } from "fast-equals";
-function Responsive(props) {
-  const {
-    layoutItemRender,
-    containerWidth,
-    containerHeight,
-    breakpoint,
-    compactType = null,
-    breakpoints = DEFAULT_RESPONSIVE_BREAKPOINTS,
-    cols = DEFAULT_RESPONSIVE_COLS,
-    containerPadding = DEFAULT_CONTAINER_PADDING,
-    containerMargin = DEFAULT_MARGIN,
-    layouts = {},
-    // onBreakpointChange = noop,
-    onLayoutChange = noop,
-    onContainerChange = noop,
-    colapsedHeight = DEFAULT_COLAPSED_HEIGHT,
-    rowHeight = DEFAULT_ROW_HEIGHT,
-    ...other
-  } = props;
-  const [currentState, setCurrentState] = useState(
-    () => generateInitialState(props)
-  );
-  const refState = useRef({
-    layouts: {
-      ...layouts,
-      [currentState.breakpoint]: currentState.breakpointLayout
-    },
-    cols,
-    currentBreakpointCols: currentState.cols,
-    currentBreakpoint: currentState.breakpoint,
-    breakpoints,
-    containerWidth,
-    containerHeight,
-    colapsedHeight: currentState.colapsedHeight,
-    rowHeight: currentState.rowHeight
-  });
-  const isFirstRenderFull = useFirstRender([
-    containerWidth,
-    containerHeight,
-    layouts,
-    breakpoint,
-    breakpoints,
-    cols
-  ]);
-  const isFirstRenderBreakpointLayout = useFirstRender([currentState.breakpointLayout]);
-  useEffect(() => {
-    if (!isFirstRenderBreakpointLayout) {
-      onLayoutChange(currentState.breakpointLayout, refState.current.layouts);
-    }
-  }, [currentState.breakpointLayout]);
-  useEffect(() => {
-    if (isFirstRenderFull) {
-      onContainerChange({
-        containerWidth: refState.current.containerWidth,
-        containerHeight: refState.current.containerHeight,
-        breakpoint: currentState.breakpoint,
-        cols: currentState.cols
-      });
-      if (currentState.fireOnLoadLayoutChange) {
-        onLayoutChange(currentState.breakpointLayout, {
-          ...layouts,
-          [currentState.breakpoint]: currentState.breakpointLayout
-        });
-      }
-      return;
-    }
-    const lastBreakpoint = refState.current.currentBreakpoint;
-    const lastContainerWidth = refState.current.containerWidth;
-    const lastContainerHeight = refState.current.containerHeight;
-    const lastBreakpointCols = refState.current.currentBreakpointCols;
-    const newBreakpoint = breakpoint || getBreakpointFromWidth(breakpoints, containerWidth);
-    const newCols = getColsFromBreakpoint(newBreakpoint, cols);
-    const newLayouts = { ...layouts };
-    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)) {
-      newContainerMargin = getIndentationValue(containerMargin, newBreakpoint);
-      newContainerPadding = getIndentationValue(containerPadding, newBreakpoint);
-      const newColapsedHeight = getHeight(colapsedHeight, newBreakpoint);
-      const newRowHeight = getHeight(rowHeight, newBreakpoint);
-      if (!(lastBreakpoint in newLayouts)) {
-        console.error("useEffect casi imposible", lastBreakpoint, newLayouts);
-        newLayouts[lastBreakpoint] = cloneLayout(currentState.breakpointLayout);
-      }
-      const layout = findOrGenerateResponsiveLayout(
-        newLayouts,
-        breakpoints,
-        newBreakpoint,
-        lastBreakpoint,
-        newCols,
-        compactType,
-        cols,
-        newColapsedHeight,
-        newRowHeight
-      );
-      newLayouts[newBreakpoint] = layout;
-      refState.current.layouts = newLayouts;
-      refState.current.breakpoints = breakpoints;
-      refState.current.currentBreakpoint = newBreakpoint;
-      refState.current.currentBreakpointCols = newCols;
-      refState.current.colapsedHeight = newColapsedHeight;
-      setCurrentState({
-        breakpoint: newBreakpoint,
-        breakpointLayout: layout,
-        cols: newCols,
-        contaierMargin: newContainerMargin,
-        contaierPadding: newContainerPadding,
-        colapsedHeight: newColapsedHeight,
-        rowHeight: newRowHeight
-      });
-    }
-    if (newBreakpoint !== lastBreakpoint || newCols !== lastBreakpointCols || lastContainerWidth !== containerWidth || lastContainerHeight != containerHeight) {
-      onContainerChange({
-        containerWidth,
-        containerHeight,
-        // containerMargin: newContainerMargin,
-        // containerPadding: newContainerPadding,
-        breakpoint: newBreakpoint,
-        cols: newCols
-      });
-    }
-  }, [containerWidth, containerHeight, layouts, breakpoint, breakpoints, cols]);
-  const localOnLayoutChange = useCallback(
-    (newlayout) => {
-      const newLayoutClone = cloneLayout(newlayout);
-      refState.current.layouts[refState.current.currentBreakpoint] = newLayoutClone;
-      setCurrentState((prev) => ({ ...prev, breakpointLayout: newLayoutClone }));
-    },
-    [onLayoutChange]
-  );
-  return /* @__PURE__ */ jsx(
-    GridLayout,
-    {
-      rowHeight: currentState.rowHeight,
-      containerWidth,
-      containerHeight,
-      colapsedHeight: currentState.colapsedHeight,
-      layoutItemRender,
-      margin: currentState.contaierMargin,
-      containerPadding: getIndentationValue(containerPadding, currentState.breakpoint),
-      onLayoutChange: localOnLayoutChange,
-      layout: currentState.breakpointLayout,
-      cols: currentState.cols,
-      compactType,
-      ...other
-    }
-  );
-}
-export {
-  Responsive as R
-};

package/components/GridLayout/subcomponents/Responsive/responsiveUtils-Bn3nVJDm.js

@@ -1,144 +0,0 @@
-import { a as cloneLayoutItem, c as cloneLayout, d as compact, l as correctBounds } from "../../utils-CF3BArf2.js";
-function getBreakpointFromWidth(breakpoints, width) {
-  const sorted = sortBreakpoints(breakpoints);
-  let matching = sorted[0];
-  for (let i = 1, len = sorted.length; i < len; i++) {
-    const breakpointName = sorted[i];
-    if (width > breakpoints[breakpointName]) matching = breakpointName;
-  }
-  return matching;
-}
-function getColsFromBreakpoint(breakpoint, cols) {
-  if (!cols[breakpoint]) {
-    throw new Error(
-      "ResponsiveReactGridLayout: `cols` entry for breakpoint " + breakpoint + " is missing!"
-    );
-  }
-  return cols[breakpoint];
-}
-function findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, compactType, brekpointsCols, colapsedHeight, rowHeight) {
-  let layout = layouts[breakpoint];
-  const breakpointsSorted = sortBreakpoints(breakpoints);
-  const indexBreakointInit = breakpointsSorted.indexOf(breakpoint);
-  let compareBreakpoint;
-  if (!layout) {
-    if (lastBreakpoint !== breakpoint && layouts[lastBreakpoint]) {
-      compareBreakpoint = lastBreakpoint;
-    } else {
-      const rotatedBreakpoints = [
-        ...breakpointsSorted.splice(indexBreakointInit),
-        ...breakpointsSorted.reverse()
-      ];
-      for (let i = 0, len = rotatedBreakpoints.length; i < len; i++) {
-        const b = rotatedBreakpoints[i];
-        if (layouts[b]) {
-          compareBreakpoint = b;
-          break;
-        }
-      }
-    }
-    if (compareBreakpoint) {
-      layout = [];
-      for (let i = 0, len = layouts[compareBreakpoint].length; i < len; i++) {
-        const li = cloneLayoutItem(layouts[compareBreakpoint][i]);
-        if (brekpointsCols[compareBreakpoint]) {
-          const newW = Math.round(li.w * cols / brekpointsCols[compareBreakpoint]);
-          li.w = newW;
-        }
-        layout.push(li);
-      }
-    }
-    if (!layout) {
-      layout = [];
-    }
-  } else {
-    layout = cloneLayout(layout);
-  }
-  layout = cloneLayout(layout);
-  const ret = compact(
-    correctBounds(layout, { cols }, colapsedHeight, colapsedHeight),
-    compactType,
-    cols,
-    colapsedHeight,
-    rowHeight
-  );
-  return ret;
-}
-function sortBreakpoints(breakpoints) {
-  const keys = Object.keys(breakpoints);
-  return keys.sort(function(a, b) {
-    return breakpoints[a] - breakpoints[b];
-  });
-}
-function getIndentationValue(param, breakpoint) {
-  if (!param) return [0, 0];
-  return Array.isArray(param) ? param : param[breakpoint];
-}
-function addLayoutItemToBreakPointIfNoExists(layouts, breakpoint, layoutItem, cols, margin, containerPadding, rowHeight, containerHeight, currentBreakpoint) {
-  if (!layouts[breakpoint]) return;
-  if (layouts[breakpoint].findIndex((l) => l.i === layoutItem.i) === -1) {
-    const l = cloneLayoutItem(layoutItem);
-    const rowHeightBreakpoint = typeof rowHeight === "number" ? rowHeight : rowHeight[breakpoint];
-    const heigthUnits = containerHeight !== void 0 ? (containerHeight + getIndentationValue(margin, breakpoint)[1] - 2 * getIndentationValue(containerPadding, breakpoint)[1]) / (rowHeightBreakpoint + getIndentationValue(margin, breakpoint)[1]) : l.h;
-    if (l.freeMove) {
-      l.x = Math.round(cols[breakpoint] / 4);
-      l.y = Math.round(heigthUnits / 4);
-      l.w = Math.round(cols[breakpoint] / 2);
-      l.h = heigthUnits / 2;
-      if (breakpoint === "xxs") {
-        l.visible = false;
-        for (let index = 0; index < layouts[breakpoint].length; index++) {
-          if (layouts[breakpoint][index].freeMove) {
-            layouts[breakpoint][index].visible = false;
-          }
-        }
-        if (currentBreakpoint === "xxs") {
-          l.visible = true;
-        }
-      }
-    } else {
-      l.w = cols[breakpoint];
-      l.h = Math.round(heigthUnits * 0.8);
-    }
-    if (l.freeMove) {
-      layouts[breakpoint].push(l);
-    } else {
-      layouts[breakpoint].unshift(l);
-    }
-  }
-}
-function addLayoutItemToBreakPoints(layouts, layoutItem, cols, margin, containerPadding, rowHeight, containerHeight, currentBreakpoint) {
-  const newLayouts = {};
-  for (const key in layouts) {
-    const layoutBreakpoint = cloneLayout(layouts[key]);
-    newLayouts[key] = layoutBreakpoint;
-    addLayoutItemToBreakPointIfNoExists(
-      newLayouts,
-      key,
-      layoutItem,
-      cols,
-      margin,
-      containerPadding,
-      rowHeight,
-      containerHeight,
-      currentBreakpoint
-    );
-  }
-  return newLayouts;
-}
-function cloneLayouts(layouts, layoutItemReplaceProps) {
-  const newLayouts = {};
-  for (const breakPoint in layouts) {
-    newLayouts[breakPoint] = cloneLayout(layouts[breakPoint], layoutItemReplaceProps);
-  }
-  return newLayouts;
-}
-export {
-  getColsFromBreakpoint as a,
-  getIndentationValue as b,
-  addLayoutItemToBreakPointIfNoExists as c,
-  addLayoutItemToBreakPoints as d,
-  cloneLayouts as e,
-  findOrGenerateResponsiveLayout as f,
-  getBreakpointFromWidth as g
-};

package/components/GridLayout/subcomponents/withSizeProvider/index-DXbMA_Cf.js

@@ -1,71 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useRef, useState, useMemo, useCallback, useEffect } from "react";
-import clsx from "clsx";
-import { throttle } from "lodash";
-import { useResizeObserver } from "@m4l/graphics";
-import { e as DEFAULT_CONTAINER_WIDTH, f as DEFAULT_CONTAINER_HEIGHT, T as THROTTLE_RESIZE_TIMEOUT, C as COMPONENT_CLASS_NAME } from "../../constants-BOQgOrZA.js";
-function withSizeProvider(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;
-        if (node instanceof HTMLElement && node.clientWidth) {
-          setCurrentState((prev) => ({
-            ...prev,
-            width: node.clientWidth,
-            //
-            height: node.offsetHeight
-          }));
-        }
-      },
-      []
-    );
-    const throttleResize = throttle(onWindowResizeMemo, THROTTLE_RESIZE_TIMEOUT, {
-      leading: false,
-      // No enviar el primer evento de resizing
-      trailing: true
-      // Incluir siempre el ultimo evento en la cola, para que no quede se quedee a la mitad de resizing
-    });
-    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 (
-      //@ts-expect-error
-      /* @__PURE__ */ jsx(
-        ComposedComponent,
-        {
-          innerRef: elementRef,
-          containerWidth: currentState.width,
-          containerHeight: currentState.height,
-          ...rest
-        }
-      )
-    );
-  };
-}
-export {
-  withSizeProvider as w
-};