@m4l/components 0.1.42 → 0.1.44

package/components/areas/contexts/AreaContext/index.ec85aee7.js

@@ -0,0 +1,392 @@
+import React__default, { createContext, forwardRef, useRef, useImperativeHandle, useEffect, useCallback } from "react";
+import { shallow } from "zustand/shallow";
+import { W as Window } from "../../components/Window/index.76143c30.js";
+import { u as useModal } from "../../../../hooks/useModal/index.2f5abe84.js";
+import { useNetwork } from "@m4l/core";
+import { createStore, useStore } from "zustand";
+import { immer } from "zustand/middleware/immer";
+import { devtools } from "zustand/middleware";
+import debounce from "lodash/debounce";
+import { u as useAreasStore } from "../../hooks/useArea/index.89306f6a.js";
+import { jsx } from "react/jsx-runtime";
+const DEBOUCED_SAVE_TIME = 500;
+const COOKIE_BREAKPOINT_LAYOUTS = "layoutPros";
+const COOKIE_WINDOWS = "windows";
+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 getDataFromResponse(data, state) {
+  const newBreakPointsLayouts = getParmsFromValue(COOKIE_BREAKPOINT_LAYOUTS, data);
+  const windows = getParmsFromValue(COOKIE_WINDOWS, data);
+  const newGridLayouts = [];
+  const newHashWindowLayouts = {};
+  if (windows) {
+    for (const key in windows) {
+      const element = windows[key];
+      if (element && element["layoutProps"] && element["mfProps"] && element["emergeType"] === "layout" && element["winType"] === "microfrontend") {
+        element["layoutProps"].i = key;
+        newGridLayouts.push(element["layoutProps"]);
+        newHashWindowLayouts[key] = {
+          ...element,
+          windowId: key,
+          emergeType: "layout",
+          onClose: state.actions.closeWindowLayout
+        };
+      }
+    }
+    console.log("GET cookies", newBreakPointsLayouts, newHashWindowLayouts);
+  }
+  return {
+    newBreakPointsLayouts,
+    newGridLayouts,
+    newHashWindowLayouts
+  };
+}
+const createAreaStore = (initProps) => {
+  console.debug("Creating Area State");
+  const startProps = {
+    zPopUpIndex: 999,
+    status: "init",
+    breakpointsLayouts: {},
+    gridLayouts: [],
+    windowsPopUps: [],
+    hashWindowsPopups: {},
+    hashWindowsLayouts: {},
+    currentLayoutId: "",
+    currentPopUpId: "",
+    ...initProps
+  };
+  return createStore(
+    devtools(
+      immer((set, get) => ({
+        ...startProps,
+        actions: {
+          closeWindowPopUp: (removePopUpId) => {
+            set((state) => {
+              const removeIndex = state.windowsPopUps.findIndex(
+                (wpId) => wpId === removePopUpId
+              );
+              if (removeIndex > -1) {
+                state.windowsPopUps.splice(removeIndex, 1);
+              }
+              delete state.hashWindowsPopups[removePopUpId];
+            });
+          },
+          addWindowPopUp: (windowId, newWindowPopupProps) => {
+            let popUpId = windowId;
+            set((state) => {
+              if (newWindowPopupProps.replaceMeId) {
+                for (const key in state.hashWindowsPopups) {
+                  const WindoPopUp = state.hashWindowsPopups[key];
+                  if (WindoPopUp.replaceMeId === newWindowPopupProps.replaceMeId) {
+                    popUpId = key;
+                    state.hashWindowsPopups[key].dynamicParams = newWindowPopupProps.dynamicParams;
+                    break;
+                  }
+                }
+              }
+              if (popUpId === windowId) {
+                state.windowsPopUps.push(windowId);
+                state.hashWindowsPopups[windowId] = {
+                  ...newWindowPopupProps,
+                  emergeType: "popup",
+                  windowId,
+                  onClose: get().actions.closeWindowPopUp,
+                  zIndex: state.zPopUpIndex
+                };
+                state.currentPopUpId = windowId;
+              }
+              console.log("addWindowPopUp fin");
+            });
+            get().actions.selectWindowPopUp(popUpId);
+          },
+          closeWindowLayout: (removeLayoutId) => {
+            set((state) => {
+              const removeIndex = state.gridLayouts.findIndex(
+                (gl) => gl.i === removeLayoutId
+              );
+              if (removeIndex > -1) {
+                state.gridLayouts.splice(removeIndex, 1);
+              }
+              delete state.hashWindowsLayouts[removeLayoutId];
+            });
+            get().actions.saveLayouts();
+          },
+          addWindowLayout: (windowId, newWindow) => {
+            const newLayout = {
+              ...newWindow.layoutProps,
+              i: windowId,
+              isDraggable: true,
+              isResizable: true,
+              winType: newWindow.winType
+            };
+            set((state) => {
+              state.gridLayouts.push(newLayout);
+              state.hashWindowsLayouts[windowId] = {
+                ...newWindow,
+                windowId,
+                emergeType: "layout",
+                onClose: get().actions.closeWindowLayout
+              };
+            });
+            get().actions.selectWindowLayout(windowId);
+            get().actions.saveLayouts();
+          },
+          saveLayouts: () => {
+            let nrKeys = 0;
+            const saveObjetc = {};
+            for (const key in get().hashWindowsLayouts) {
+              const element = get().hashWindowsLayouts[key];
+              if (element.winType === "microfrontend") {
+                const newElement = { ...element };
+                delete newElement.onClose;
+                delete newElement.devCookies;
+                saveObjetc[key] = newElement;
+                nrKeys++;
+              }
+            }
+            console.log("saveWindows", nrKeys, saveObjetc, JSON.stringify(saveObjetc));
+            if (nrKeys > 0) {
+              get().networkOperation({
+                method: "PUT",
+                endPoint: `cookies/${get().id}/${COOKIE_WINDOWS}`,
+                data: {
+                  value: JSON.stringify(saveObjetc)
+                },
+                toastSuccess: false,
+                toastError: false
+              });
+            } else {
+              get().networkOperation({
+                method: "DELETE",
+                endPoint: `cookies`,
+                data: { f: [{ n: "container_id", o: "c", o1: get().id }] },
+                toastSuccess: false,
+                toastError: false
+              });
+            }
+          },
+          bouncedSaveBreakpointsLayouts: debounce(
+            () => {
+              const purgedLayouts = { ...get().breakpointsLayouts };
+              const finalLayouts = {};
+              for (const key in purgedLayouts) {
+                const element = purgedLayouts[key];
+                purgedLayouts[key] = element.filter((l) => {
+                  if (l.i === "none") {
+                    return false;
+                  }
+                  if (get().hashWindowsLayouts[l.i]) {
+                    return true;
+                  }
+                  return false;
+                });
+                if (purgedLayouts[key].length > 0) {
+                  finalLayouts[key] = purgedLayouts[key];
+                }
+              }
+              if (Object.keys(finalLayouts).length > 0) {
+                console.log(finalLayouts);
+                get().networkOperation({
+                  method: "PUT",
+                  endPoint: `cookies/${get().id}/${COOKIE_BREAKPOINT_LAYOUTS}`,
+                  data: {
+                    value: JSON.stringify(finalLayouts)
+                  },
+                  toastSuccess: false,
+                  toastError: false
+                });
+              }
+            },
+            DEBOUCED_SAVE_TIME
+          ),
+          onBreakpointsLayoutsChange: (_currentLayouts, newAllLayouts) => {
+            set((state) => {
+              state.breakpointsLayouts = newAllLayouts;
+            });
+            get().actions.bouncedSaveBreakpointsLayouts();
+          },
+          selectWindowLayout: (layoutId) => {
+            set((state) => {
+              state.currentLayoutId = layoutId;
+              if (state.currentPopUpId !== "" && state.hashWindowsPopups[state.currentPopUpId]) {
+                const windowPopup = state.hashWindowsPopups[state.currentPopUpId];
+                if (windowPopup.parentLayoutId !== layoutId) {
+                  state.currentPopUpId = "";
+                }
+              }
+            });
+          },
+          selectWindowPopUp: (popUpId) => {
+            set((state) => {
+              state.zPopUpIndex++;
+              state.currentPopUpId = popUpId;
+              state.zPopUpIndex++;
+              state.currentPopUpId = popUpId;
+              state.hashWindowsPopups[popUpId].zIndex = state.zPopUpIndex;
+              if (state.hashWindowsPopups[popUpId].parentLayoutId && state.hashWindowsPopups[popUpId].parentLayoutId !== "") {
+                state.currentLayoutId = state.hashWindowsPopups[popUpId].parentLayoutId;
+              } else {
+                state.currentLayoutId = "";
+              }
+            });
+            setTimeout(() => {
+              const container = document.getElementsByClassName(
+                `M4L_GridLayout_${get().id}`
+              )[0];
+              const element = document.getElementsByClassName(
+                `M4L_WindowPopUp_${popUpId}`
+              )[0];
+              if (element && container) {
+                const { top, left } = element.getBoundingClientRect();
+                const { top: containerTop, left: containerLeft } = container.getBoundingClientRect();
+                console.log(
+                  "scroll top:",
+                  `M4L_WindowPopUp_${popUpId}`,
+                  top,
+                  containerTop
+                );
+                container.scrollTop = container.scrollTop + top - containerTop;
+                container.scrollLeft = container.scrollLeft + left - containerLeft;
+              }
+            }, 100);
+          }
+        },
+        internalActions: {
+          loadFromApi: () => {
+            if (get().status !== "init") {
+              return;
+            }
+            if (!get().loadAreasFromNetwork || !get().loadWindows) {
+              set((state) => {
+                state.status = "loaded";
+              });
+              return;
+            }
+            get().networkOperation({
+              method: "GET",
+              endPoint: `cookies`,
+              parms: { f: [{ n: "container_id", o: "e", o1: get().id }] },
+              toastSuccess: false,
+              toastError: false
+            }).then((response) => {
+              set((state) => {
+                const {
+                  newBreakPointsLayouts,
+                  newGridLayouts,
+                  newHashWindowLayouts
+                } = getDataFromResponse(response.data, state);
+                state.breakpointsLayouts = newBreakPointsLayouts;
+                state.gridLayouts = newGridLayouts;
+                state.hashWindowsLayouts = newHashWindowLayouts;
+                console.log("Area loaded");
+                state.status = "loaded";
+              });
+            }).catch((_response) => {
+              set((state) => {
+                state.status = "loaded";
+              });
+            });
+          }
+        }
+      })),
+      { name: `Area state ${initProps.id}` }
+    )
+  );
+};
+const AreaContext = createContext(null);
+const AreaProvider = forwardRef((props, ref) => {
+  const {
+    children,
+    id,
+    active,
+    loadWindows = true
+  } = props;
+  const loadAreasFromNetwork = useAreasStore((state) => state.loadAreasFromNetwork);
+  const {
+    networkOperation
+  } = useNetwork();
+  const areaStoreRef = useRef();
+  if (!areaStoreRef.current) {
+    areaStoreRef.current = createAreaStore({
+      id,
+      networkOperation,
+      loadAreasFromNetwork,
+      loadWindows
+    });
+  }
+  const {
+    addWindowLayout,
+    addWindowPopUp
+  } = useStore(areaStoreRef.current, (state) => state.actions, shallow);
+  const {
+    loadFromApi
+  } = useStore(areaStoreRef.current, (state) => state.internalActions, shallow);
+  const status = useStore(areaStoreRef.current, (state) => state.status, shallow);
+  const {
+    openModal,
+    closeModal
+  } = useModal();
+  useImperativeHandle(ref, () => ({
+    store: areaStoreRef.current,
+    addWindow
+  }), []);
+  useEffect(() => {
+    console.log("useEffect AreaProvider");
+    return () => {
+      console.log("useEffect cluanUp AreaProvider****");
+    };
+  }, []);
+  useEffect(() => {
+    if (active && status === "init") {
+      loadFromApi();
+    }
+  }, [active]);
+  console.log("Rendeer AreaProvider status", status, loadAreasFromNetwork);
+  const closeWindowModal = useCallback(() => {
+    closeModal();
+  }, []);
+  const openWindowModal = useCallback((container_id, newWindowProps) => {
+    openModal({
+      window: /* @__PURE__ */ jsx(Window, {
+        ...newWindowProps,
+        windowId: container_id,
+        onClose: closeWindowModal
+      })
+    });
+  }, []);
+  const addWindow = useCallback((newWindow) => {
+    const newId = `${id}_window_${new Date().getTime()}_${(Math.random() * 1e3).toFixed(0)}`;
+    if (newWindow.emergeType === "layout") {
+      addWindowLayout(newId, newWindow);
+    } else if (newWindow.emergeType === "popup") {
+      addWindowPopUp(newId, newWindow);
+    } else {
+      openWindowModal(newId, newWindow);
+    }
+    return newId;
+  }, []);
+  return /* @__PURE__ */ jsx(AreaContext.Provider, {
+    value: {
+      store: areaStoreRef.current,
+      addWindow
+    },
+    children
+  });
+});
+AreaProvider.displayName = "AreaProvider";
+React__default.memo(AreaProvider);
+export {
+  AreaProvider as A,
+  AreaContext as a
+};

package/components/areas/contexts/AreaContext/store.d.ts

@@ -0,0 +1,49 @@
+import { NetworkProps } from '@m4l/core';
+import { Layout, Layouts } from 'react-grid-layout';
+import { DebouncedFunc } from 'lodash';
+import { HashWindowsByLayouts, HashWindowsByPopups, NewLayoutProps, NewPopUpProps } from '../../components/Area/types';
+export declare type AreaStatus = 'init' | 'load' | 'loaded' | 'error';
+export interface AreaState {
+    zPopUpIndex: number;
+    id: string;
+    loadAreasFromNetwork: boolean;
+    loadWindows: boolean;
+    status: AreaStatus;
+    breakpointsLayouts: Layouts;
+    gridLayouts: Layout[];
+    windowsPopUps: string[];
+    hashWindowsPopups: HashWindowsByPopups;
+    hashWindowsLayouts: HashWindowsByLayouts;
+    networkOperation: (props: NetworkProps) => Promise<any>;
+    currentLayoutId: string;
+    currentPopUpId: string;
+}
+export interface AreaStateWithActions extends AreaState {
+    actions: {
+        closeWindowPopUp: (removePopUpId: string) => void;
+        addWindowPopUp: (container_id: string, newWindowPopupProps: NewPopUpProps) => void;
+        closeWindowLayout: (removeLayoutId: string) => void;
+        addWindowLayout: (container_id: string, newWindow: NewLayoutProps) => void;
+        saveLayouts: () => void;
+        onBreakpointsLayoutsChange: (currentLayouts: Layout[], newAllLayouts: Layouts) => void;
+        bouncedSaveBreakpointsLayouts: DebouncedFunc<() => void>;
+        selectWindowLayout: (layoutId: string) => void;
+        selectWindowPopUp: (popUpId: string) => void;
+    };
+    internalActions: {
+        loadFromApi: () => void;
+    };
+}
+declare type DefaultStoreProps = Omit<AreaState, 'id'>;
+declare type InitialStoreProps = Pick<AreaState, 'id' | 'networkOperation' | 'loadAreasFromNetwork' | 'loadWindows'> & Partial<DefaultStoreProps>;
+export declare const createAreaStore: (initProps: InitialStoreProps) => Omit<Omit<import("zustand").StoreApi<AreaStateWithActions>, "setState"> & {
+    setState<A extends string | {
+        type: unknown;
+    }>(partial: AreaStateWithActions | Partial<AreaStateWithActions> | ((state: AreaStateWithActions) => AreaStateWithActions | Partial<AreaStateWithActions>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "setState"> & {
+    setState(nextStateOrUpdater: AreaStateWithActions | Partial<AreaStateWithActions> | ((state: import("immer/dist/internal").WritableDraft<AreaStateWithActions>) => void), shouldReplace?: boolean | undefined, action?: string | {
+        type: unknown;
+    } | undefined): void;
+};
+export declare type AreaStore = ReturnType<typeof createAreaStore>;
+export {};

package/components/areas/contexts/AreaContext/types.d.ts

@@ -1,7 +1,8 @@
 import { ReactNode } from 'react';
-import type { Layout, Layouts } from 'react-grid-layout';
-import { NewWindowProps, PopUpProps, WinType } from '../../components/Area/types';
-import { AreaProps, HashWindowsByLayouts } from '../../components/Area/types';
+import type { Layout } from 'react-grid-layout';
+import { NewWindowProps, WinType } from '../../components/Area/types';
+import { AreaProps } from '../../components/Area/types';
+import { AreaStore } from './store';
 export declare type AreaStatus = 'init' | 'load' | 'loaded' | 'error';
 export interface AreaProviderProps extends AreaProps {
     children: ReactNode;
@@ -10,19 +11,10 @@ export declare type WinLayout = Layout & {
     winType: WinType;
 };
 export declare type AreaProviderRef = {
-    addWindow: (newWindowMF: NewWindowProps) => string;
+    store: AreaStore;
+    addWindow: (newWindow: NewWindowProps) => string;
 };
-export interface AreaContextProps extends Omit<AreaProps, 'children' | 'active'> {
-    status: AreaStatus;
-    isWindowSelected: (id: string) => boolean;
-    selectWindow: (newSeletectedId: string) => void;
-    getWindowPopUpZindex: () => number;
-    allLayouts: Layouts;
-    layouts: Layout[];
-    hashWindowsLayouts: HashWindowsByLayouts;
+export interface AreaContextProps {
+    store: AreaStore;
     addWindow: (newWindow: NewWindowProps) => string;
-    onCloseWindowLayout: (removeLayoutId: string) => void;
-    onLayoutChange: (currentLayouts: Layout[], allLayouts: Layouts) => void;
-    windowsPopUps: PopUpProps[];
-    onCloseWindowPopUp: (removePopUpId: string) => void;
 }

package/components/areas/contexts/AreasContext/index.d.ts

@@ -1,5 +1,13 @@
 /// <reference types="react" />
-import { AreasContextProps, AreasProviderProps } from './types';
-declare const AreasContext: import("react").Context<AreasContextProps | null>;
+import { AreasProviderProps } from './types';
+declare const AreasContext: import("react").Context<(Omit<Omit<import("zustand").StoreApi<import("./store").AreasStateWithActions>, "setState"> & {
+    setState<A extends string | {
+        type: unknown;
+    }>(partial: import("./store").AreasStateWithActions | Partial<import("./store").AreasStateWithActions> | ((state: import("./store").AreasStateWithActions) => import("./store").AreasStateWithActions | Partial<import("./store").AreasStateWithActions>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "setState"> & {
+    setState(nextStateOrUpdater: import("./store").AreasStateWithActions | Partial<import("./store").AreasStateWithActions> | ((state: import("immer/dist/internal").WritableDraft<import("./store").AreasStateWithActions>) => void), shouldReplace?: boolean | undefined, action?: string | {
+        type: unknown;
+    } | undefined): void;
+}) | null>;
 declare function AreasProvider(props: AreasProviderProps): JSX.Element;
 export { AreasProvider, AreasContext };

package/components/areas/contexts/AreasContext/index.e65fd347.js

@@ -0,0 +1,204 @@
+import { createContext, useRef, useCallback, useEffect } from "react";
+import { useHostTools, useModuleDictionary, useNetwork, EmitEvents } from "@m4l/core";
+import { createStore, useStore } from "zustand";
+import { devtools } from "zustand/middleware";
+import { immer } from "zustand/middleware/immer";
+import { L as LABEL_NEW_AREA } from "../../index.a2586fb3.js";
+import { shallow } from "zustand/shallow";
+import { useFirstRender } from "@m4l/graphics";
+import { jsx } from "react/jsx-runtime";
+const addAreaNoBoilerPlate = (state) => {
+  let newName = "";
+  const newId = `area_${new Date().getTime()}_${(Math.random() * 1e3).toFixed(0)}`;
+  newName = `${state.getLabel(LABEL_NEW_AREA)} ${state.areas.length + 1}`;
+  console.log("addAreaNoBoilerPlate", newName);
+  state.areas.push({ id: newId, name: newName, loadWindows: false });
+  state.currentArea = newId;
+  if (state.loadAreasFromNetwork) {
+    state.networkOperation({
+      method: "POST",
+      endPoint: `areas`,
+      data: { id: newId, name: newName },
+      toastSuccess: false,
+      toastError: false
+    });
+  }
+  return newId;
+};
+const createAreasStore = (initProps) => {
+  const startProps = {
+    status: "init",
+    currentArea: "",
+    areas: [],
+    ...initProps
+  };
+  return createStore(
+    devtools(
+      immer((set, get) => ({
+        ...startProps,
+        actions: {
+          addArea: () => {
+            let newId = "";
+            set((state) => {
+              newId = addAreaNoBoilerPlate(state);
+            });
+            return newId;
+          },
+          deleteArea: (areaId) => {
+            set((state) => {
+              const removeIndex = state.areas.findIndex((area) => area.id === areaId);
+              if (removeIndex > -1) {
+                state.areas.splice(removeIndex, 1);
+              }
+              if (state.currentArea === areaId) {
+                if (state.areas.length > 0) {
+                  state.currentArea = state.areas[0].id;
+                } else {
+                  state.currentArea = "";
+                }
+              }
+              if (state.loadAreasFromNetwork) {
+                state.networkOperation({
+                  method: "DELETE",
+                  endPoint: `areas/${areaId}`,
+                  parms: {},
+                  toastSuccess: false,
+                  toastError: false
+                });
+              }
+            });
+          },
+          selectArea: (newAreaId) => {
+            console.log("Areas selected, ", newAreaId);
+            set((state) => {
+              if (state.areas.findIndex((area) => area.id === newAreaId) > -1) {
+                state.currentArea = newAreaId;
+              }
+            });
+          }
+        },
+        internalActions: {
+          setHandlerGetLabel: (newHandler) => {
+            set((state) => {
+              state.getLabel = newHandler;
+            });
+          },
+          loadFromApi: () => {
+            if (get().status === "init") {
+              if (!get().loadAreasFromNetwork) {
+                get().actions.addArea();
+                set((state) => {
+                  state.status = "loaded";
+                });
+              } else {
+                set((state) => {
+                  state.status = "loading";
+                  state.networkOperation({
+                    method: "GET",
+                    endPoint: `areas`,
+                    parms: {},
+                    toastSuccess: false
+                  }).then((response) => {
+                    set((otherState) => {
+                      if (response?.data && Array.isArray(response.data) && response.data.length > 0) {
+                        otherState.areas = response.data;
+                        otherState.currentArea = response.data[0].id;
+                      } else {
+                        addAreaNoBoilerPlate(otherState);
+                      }
+                    });
+                  }).finally(() => {
+                    set((otherState) => {
+                      otherState.status = "loaded";
+                    });
+                  });
+                });
+              }
+            }
+          },
+          setAreaRef: (areaId, ref) => {
+            set((state) => {
+              const areaIndex = state.areas.findIndex((area) => area.id === areaId);
+              if (areaIndex > -1 && !state.areas[areaIndex].ref) {
+                state.areas[areaIndex].ref = ref;
+              }
+            });
+          }
+        }
+      })),
+      { name: `Areas store` }
+    )
+  );
+};
+const AreasContext = createContext(null);
+function AreasProvider(props) {
+  const {
+    children,
+    loadAreasFromNetwork,
+    onLoad
+  } = props;
+  const {
+    events_add_listener,
+    events_remove_listener
+  } = useHostTools();
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const {
+    networkOperation
+  } = useNetwork();
+  const isFirstRender = useFirstRender([getLabel]);
+  const areasStoreRef = useRef();
+  if (!areasStoreRef.current) {
+    areasStoreRef.current = createAreasStore({
+      getLabel,
+      loadAreasFromNetwork,
+      networkOperation
+    });
+  }
+  const status = useStore(areasStoreRef.current, (state) => state.status, shallow);
+  const {
+    setHandlerGetLabel
+  } = useStore(areasStoreRef.current, (state) => state.internalActions, shallow);
+  const addWindow = useCallback((newWindow) => {
+    console.log("addWindow raw");
+    const currentArea = areasStoreRef.current?.getState().currentArea;
+    const areas = areasStoreRef.current?.getState().areas;
+    if (currentArea && areas) {
+      const areaIndex = areas.findIndex((area) => area.id == currentArea);
+      if (areaIndex > -1 && areas[areaIndex].ref) {
+        const areaRef = areas[areaIndex].ref;
+        if (areaRef) {
+          areaRef.addWindow(newWindow);
+        }
+      }
+    }
+  }, []);
+  useEffect(() => {
+    if (status === "loaded") {
+      console.log("useEffect Areas loaded");
+      onLoad && onLoad();
+    }
+  }, [status]);
+  useEffect(() => {
+    if (!isFirstRender) {
+      setHandlerGetLabel(getLabel);
+    }
+  }, [getLabel]);
+  useEffect(() => {
+    events_add_listener(EmitEvents.EMMIT_EVENT_HOST_EMERGE_WINDOW, addWindow);
+    areasStoreRef.current?.getState().internalActions.loadFromApi();
+    console.log("useEffect AreasProvider Emmiter");
+    return () => {
+      events_remove_listener(EmitEvents.EMMIT_EVENT_HOST_EMERGE_WINDOW, addWindow);
+    };
+  }, []);
+  return /* @__PURE__ */ jsx(AreasContext.Provider, {
+    value: areasStoreRef.current,
+    children
+  });
+}
+export {
+  AreasContext as A,
+  AreasProvider as a
+};