@m4l/components 5.0.0 → 5.0.2

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/WindowModal/index-CI_NRrEx.js

@@ -1,58 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import React__default from "react";
-import { u as useAreasStore } from "../../../../../../hooks/useAreas/index-DosRWKI3.js";
-import { W as Window } from "../Window/index-DQLweOBU.js";
-import { W as WrapperWindowModal } from "./styles-CAgHbRyV.js";
-import { a as Draggable } from "../../../../../../../../react-draggable-lPKOvvDX.js";
-import { useResponsiveDesktop } from "@m4l/graphics";
-import { a as areasViewerClasses } from "../../../../classes/index-vzutNGDt.js";
-import { R as ResizableBox } from "../../../../../../../extended/react-resizable/ResizableBox/ResizableBox-wUgQRWcc.js";
-const WindowModal = (props) => {
-  const { windowId } = props;
-  const { onClose } = useAreasStore((state) => state.hashWindowsModals[windowId]);
-  const isDesktop = useResponsiveDesktop();
-  const DragabblePaperComponent = (_props) => {
-    return /* @__PURE__ */ jsx(
-      Draggable,
-      {
-        handle: ".m4l_draggable_handle",
-        bounds: "parent",
-        children: /* @__PURE__ */ jsx(
-          ResizableBox,
-          {
-            width: props.windowProps?.width || 400,
-            height: props.windowProps?.height || 300,
-            children: /* @__PURE__ */ jsx(Window, { ...props })
-          }
-        )
-      }
-    );
-  };
-  function PaperComponent(_props) {
-    return /* @__PURE__ */ jsx(Window, { ...props });
-  }
-  return /* @__PURE__ */ jsx(
-    WrapperWindowModal,
-    {
-      className: areasViewerClasses.windowModalRoot,
-      open: true,
-      scroll: "paper",
-      onKeyDown: (event) => {
-        if (event.key === "Escape") {
-          onClose && onClose(windowId);
-        }
-      },
-      "aria-labelledby": "child-modal-title",
-      "aria-describedby": "child-modal-description",
-      PaperComponent: isDesktop ? DragabblePaperComponent : PaperComponent,
-      maxWidth: false,
-      fullWidth: !isDesktop,
-      fullScreen: false,
-      disableEnforceFocus: true
-    }
-  );
-};
-const MemonizedWindowModal = React__default.memo(WindowModal);
-export {
-  MemonizedWindowModal as M
-};

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/WindowModal/styles-CAgHbRyV.js

@@ -1,26 +0,0 @@
-import { Dialog } from "@mui/material";
-import { styled } from "@mui/material/styles";
-styled("div")(({ theme }) => ({
-  display: "flex",
-  flexDirection: "column",
-  height: "100%",
-  overflow: "hidden",
-  padding: theme.spacing(3)
-}));
-const WrapperWindowModal = styled(Dialog)(({ theme }) => ({
-  // height: '100%',
-  hola: 1,
-  backgroundColor: theme.vars.palette.background.paper,
-  "& .MuiDialog-container": {
-    // justifyContent: 'start',
-    // alignItems: 'start',
-  },
-  // position: 'absolute',
-  "&.m4l_selected": {
-    borderTop: "1px solid green"
-  },
-  ...theme.components?.M4LAreasViewerModal?.styleOverrides
-}));
-export {
-  WrapperWindowModal as W
-};

package/components/areas/components/index-l0sNRNKZ.js

@@ -1 +0,0 @@
-

package/components/areas/constants-rqODZNZe.js

@@ -1,6 +0,0 @@
-const AREAS_VIEWER_CLASS_NAME = "M4LAreasViewer";
-const AREAS_ADMIN_CLASS_NAME = "M4LAreasAdmin";
-export {
-  AREAS_ADMIN_CLASS_NAME as A,
-  AREAS_VIEWER_CLASS_NAME as a
-};

package/components/areas/contexts/AreasContext/helper-Bj2Lz2mw.js

@@ -1,220 +0,0 @@
-import { u as useAreasViewerUtilityClasses } from "../../components/AreasViewer/classes/index-vzutNGDt.js";
-import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/classes/index-CryauVAw.js";
-import { c as createDynamicMFStore } from "../DynamicMFParmsContext/store-8_SPgo06.js";
-import { g as getAreasDictionary, A as AREAS_DICCTIONARY } from "../../dictionary-gOjRdYCc.js";
-import { c as addLayoutItemToBreakPointIfNoExists } from "../../../GridLayout/subcomponents/Responsive/responsiveUtils-Bn3nVJDm.js";
-const PADDING_GRIDLAYOUT = 11;
-const MARGIN_GRIDLAYOUT = 11;
-const DEBOUCED_SAVE_TIME = 500;
-const COOKIE_AREAS_ADMIN_CONTAINER_ID = "areas";
-const COOKIE_AREAS_ADMIN_ID = "admin";
-const COOKIE_BREAKPOINT_LAYOUTS = "layoutPros";
-const COOKIE_WINDOWS = "windows";
-const BREAKPOINT_SIZES = { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 1 };
-const NORMALIZED_COLS = { lg: 64, md: 48, sm: 32, xs: 24, xxs: 1 };
-const DEFAULT_LAYOUTS = { lg: [], md: [], sm: [], xs: [], xxs: [] };
-const RESPONSIVE_COLAPSED_HEIGHTS = { xxs: 48, xs: 48, sm: 40, md: 40, lg: 40 };
-const RESPONSIVE_ROW_HEIGHTS = { xxs: 48, xs: 48, sm: 48, md: 40, lg: 40 };
-const DEFAULT_WINDOW = {
-  status: "init",
-  moduleActions: [],
-  cookies: { moduleCookies: {}, windowCookies: {} },
-  loading: false
-};
-const DEFAULT_AREA = {
-  status: "init",
-  zPopUpIndex: 0,
-  layouts: DEFAULT_LAYOUTS,
-  // colapsedItems: {},
-  // windowsLayoutIds: [],
-  layoutItemsIds: [],
-  currentLayoutId: "",
-  currentPopUpId: "",
-  breakpoints: BREAKPOINT_SIZES,
-  cols: NORMALIZED_COLS,
-  loadWindows: false
-};
-const addArea = (state) => {
-  const areaId = `area_${(/* @__PURE__ */ new Date()).getTime()}_${(Math.random() * 1e3).toFixed(0)}`;
-  const labelNewArea = state.getLabel(getAreasDictionary(AREAS_DICCTIONARY.label_new_area));
-  let isFree;
-  let name = `${labelNewArea} 1`;
-  for (let indexNames = 1; indexNames <= state.areasIds.length + 1; indexNames++) {
-    name = `${labelNewArea} ${indexNames + state.areasIds.length}`;
-    isFree = true;
-    for (let index = 0; index < state.areasIds.length; index++) {
-      if (state.hashAreas[state.areasIds[index]].name === name) {
-        isFree = false;
-        break;
-      }
-    }
-    if (isFree) {
-      break;
-    }
-  }
-  const newArea = {
-    id: areaId,
-    name,
-    ...DEFAULT_AREA
-  };
-  state.areasIds.push(areaId);
-  state.hashAreas[areaId] = newArea;
-  state.currentModuleId = "";
-  if (state.loadAreasFromNetwork) {
-    state.networkOperation({
-      method: "POST",
-      endPoint: `areas`,
-      data: { id: areaId, name },
-      toastSuccess: false,
-      toastError: false
-    });
-  }
-  return areaId;
-};
-const updateOwnerStateClasses = (state) => {
-  state.viwerClasses = useAreasViewerUtilityClasses(state.ownerState);
-  state.adminClasses = useAreasAdminUtilityClasses(state.ownerState);
-};
-const getParmsFromValue = (key, data) => {
-  try {
-    if (Array.isArray(data)) {
-      let ob = data.find((f) => f.id === key);
-      if (ob) {
-        ob = JSON.parse(ob.value);
-      }
-      return ob;
-    }
-  } catch (error) {
-  }
-  return void 0;
-};
-function setColapsedLayoutBreakPoints(state, layoutId, colapsed) {
-  const layoutsBreakPoints = state.layouts;
-  for (const key in layoutsBreakPoints) {
-    const layoutBreakpoint = layoutsBreakPoints[key];
-    const index = layoutBreakpoint.findIndex((lb) => lb.i === layoutId);
-    if (index > -1) {
-      if (key !== "xxs") {
-        layoutBreakpoint[index].colapsed = colapsed;
-      } else {
-        if (!layoutBreakpoint[index].freeMove) {
-          layoutBreakpoint[index].colapsed = colapsed;
-        }
-      }
-    }
-  }
-}
-function deleteLayoutFromBreakPoints(state, layoutId) {
-  const layoutsBreakPoints = state.layouts;
-  for (const key in layoutsBreakPoints) {
-    const layoutBreakpoint = layoutsBreakPoints[key];
-    for (let index = 0; index < layoutBreakpoint.length; index++) {
-      const l = layoutBreakpoint[index];
-      if (l.i === layoutId) {
-        layoutBreakpoint.splice(index, 1);
-        break;
-      }
-    }
-  }
-}
-function getDataFromResponse(data, state, areaId) {
-  let newBreakPointsLayouts = getParmsFromValue(COOKIE_BREAKPOINT_LAYOUTS, data);
-  const windows = getParmsFromValue(COOKIE_WINDOWS, data);
-  const newWindowsLayoutsIds = [];
-  const newHashLayoutItems = [];
-  if (!newBreakPointsLayouts) {
-    newBreakPointsLayouts = {};
-  }
-  for (const breakPoint in BREAKPOINT_SIZES) {
-    if (!newBreakPointsLayouts[breakPoint]) {
-      newBreakPointsLayouts[breakPoint] = [];
-    }
-  }
-  if (windows) {
-    for (const key in windows) {
-      const element = windows[key];
-      if (element && // element['layoutProps'] && //Garantizar que venga con los LayoutProps de la venta
-      element["mfProps"] && //Garantizar que venga con los mfProps de la venta
-      element["emergeType"] === "layout" && element["winType"] === "microfrontend") {
-        newWindowsLayoutsIds.push(key);
-        const onClose = state.areaActions.closeLayout;
-        state.hashWindows[key] = {
-          ...DEFAULT_WINDOW,
-          ...element,
-          windowId: key,
-          emergeType: "layout",
-          areaId,
-          dynamicMFStore: createDynamicMFStore({
-            dynamicMFParameters: element.dynamicParams,
-            windowId: key
-          }),
-          onClose: () => onClose(areaId, key)
-        };
-        newHashLayoutItems.push(key);
-        for (const breakPoint in BREAKPOINT_SIZES) {
-          addLayoutItemToBreakPointIfNoExists(
-            newBreakPointsLayouts,
-            breakPoint,
-            { i: element.windowId, x: 0, y: 0, w: 5, h: 5 },
-            NORMALIZED_COLS,
-            [MARGIN_GRIDLAYOUT, MARGIN_GRIDLAYOUT],
-            [PADDING_GRIDLAYOUT, PADDING_GRIDLAYOUT],
-            RESPONSIVE_ROW_HEIGHTS
-          );
-        }
-      }
-    }
-    for (const breakPoint in BREAKPOINT_SIZES) {
-      newBreakPointsLayouts[breakPoint] = newBreakPointsLayouts[breakPoint].filter((li) => {
-        return newWindowsLayoutsIds.indexOf(li.i) > -1;
-      });
-    }
-  } else {
-    for (const breakPoint in BREAKPOINT_SIZES) {
-      newBreakPointsLayouts[breakPoint] = [];
-    }
-  }
-  return {
-    newBreakPointsLayouts,
-    newHashLayoutItems
-    // baseResponsiveLayoutItems,
-  };
-}
-function getCookiesContainer(data, containerId) {
-  const cookies = {};
-  try {
-    if (Array.isArray(data)) {
-      for (let i = 0; i < data.length; i++) {
-        if (data[i]?.container_id === containerId && data[i]?.id) {
-          cookies[data[i]?.id] = JSON.parse(data[i].value);
-        }
-      }
-    }
-  } catch (error) {
-  }
-  return cookies;
-}
-function getSelectedAreaIdFromCookies(cookiesResponse) {
-  return typeof cookiesResponse?.data?.[0]?.value === "string" && JSON.parse(cookiesResponse?.data?.[0]?.value || "{}")?.selectedAreaId;
-}
-export {
-  COOKIE_AREAS_ADMIN_CONTAINER_ID as C,
-  DEFAULT_AREA as D,
-  MARGIN_GRIDLAYOUT as M,
-  NORMALIZED_COLS as N,
-  PADDING_GRIDLAYOUT as P,
-  RESPONSIVE_COLAPSED_HEIGHTS as R,
-  RESPONSIVE_ROW_HEIGHTS as a,
-  COOKIE_AREAS_ADMIN_ID as b,
-  addArea as c,
-  DEFAULT_WINDOW as d,
-  deleteLayoutFromBreakPoints as e,
-  COOKIE_WINDOWS as f,
-  getSelectedAreaIdFromCookies as g,
-  COOKIE_BREAKPOINT_LAYOUTS as h,
-  DEBOUCED_SAVE_TIME as i,
-  getDataFromResponse as j,
-  getCookiesContainer as k,
-  setColapsedLayoutBreakPoints as s,
-  updateOwnerStateClasses as u
-};

package/components/areas/contexts/AreasContext/index-B_WBK3u-.js

@@ -1,84 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { createContext, useRef, useCallback, useEffect } from "react";
-import { useStore } from "zustand";
-import { shallow } from "zustand/shallow";
-import { useResponsiveDesktop, useFirstRender } from "@m4l/graphics";
-import { useHostTools, useModuleDictionary, useNetwork, useModuleSkeleton, EmitEvents } from "@m4l/core";
-import { c as createAreasStore } from "./store-C7uCuREP.js";
-const AreasContext = createContext(null);
-function AreasProvider(props) {
-  const { children, loadAreasFromNetwork, loadCookiesFromNetwork, onLoad, onSelectLayout } = props;
-  const { events_add_listener, events_remove_listener } = useHostTools();
-  const { getLabel } = useModuleDictionary();
-  const { networkOperation } = useNetwork();
-  const isDesktop = useResponsiveDesktop();
-  const isSkeleton = useModuleSkeleton();
-  const isFirstRender = useFirstRender([getLabel]);
-  const areasStoreRef = useRef();
-  if (!areasStoreRef.current) {
-    areasStoreRef.current = createAreasStore({
-      getLabel,
-      loadAreasFromNetwork,
-      loadCookiesFromNetwork,
-      networkOperation,
-      ownerState: {
-        status: "init",
-        isMobile: !isDesktop,
-        isSkeleton,
-        focus: false
-      }
-      // onLoad,
-    });
-    areasStoreRef.current?.getState().areasActions.init();
-  }
-  const status = useStore(areasStoreRef.current, (state) => state.ownerState.status, shallow);
-  const currentModuleId = useStore(areasStoreRef.current, (state) => state.currentModuleId);
-  const refCurrentModuleId = useRef("");
-  const { setHandlerGetLabel, setExternalState } = useStore(
-    areasStoreRef.current,
-    (state) => state.areasActions,
-    shallow
-  );
-  const addWindow = useCallback((newWindow) => {
-    const currentAreaId = areasStoreRef.current?.getState().currentAreaId;
-    const areas = areasStoreRef.current?.getState().areasIds;
-    if (currentAreaId && areas) {
-      areasStoreRef.current?.getState().areaActions.addWindow(newWindow);
-    }
-  }, []);
-  useEffect(() => {
-    if (status === "loaded") {
-      onLoad && onLoad();
-    }
-  }, [status]);
-  useEffect(() => {
-    if (status === "loaded") {
-      if (currentModuleId !== refCurrentModuleId.current) {
-        onSelectLayout && onSelectLayout(currentModuleId);
-        refCurrentModuleId.current = currentModuleId;
-      }
-    }
-  }, [currentModuleId, status]);
-  useEffect(() => {
-    if (!isFirstRender) {
-      setHandlerGetLabel(getLabel);
-    }
-  }, [getLabel]);
-  useEffect(() => {
-    events_add_listener(EmitEvents.EMMIT_EVENT_HOST_EMERGE_WINDOW, addWindow);
-    return () => {
-      events_remove_listener(EmitEvents.EMMIT_EVENT_HOST_EMERGE_WINDOW, addWindow);
-    };
-  }, []);
-  useEffect(() => {
-    if (isFirstRender) {
-      return;
-    }
-    setExternalState({ isMobile: !isDesktop, isSkeleton });
-  }, [isDesktop, isSkeleton]);
-  return /* @__PURE__ */ jsx(AreasContext.Provider, { value: areasStoreRef.current, children });
-}
-export {
-  AreasProvider as A,
-  AreasContext as a
-};