@m4l/layouts 1.0.4 → 1.0.5

package/components/BaseModule/index.8ff0193e.js

@@ -0,0 +1,39 @@
+import { ModalProvider } from "@m4l/components";
+import { FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider, ModulePrivilegesProvider } from "@m4l/core";
+import { useLocales } from "@m4l/graphics";
+import { jsx } from "react/jsx-runtime";
+function BaseModule(props) {
+  const {
+    children,
+    isAuth = true,
+    moduleId,
+    moduleNameField,
+    skeletonFlags,
+    privileges,
+    componentsDictionary
+  } = props;
+  const localeString = useLocales().currentLocale?.localeString;
+  return /* @__PURE__ */ jsx(FlagsProvider, {
+    children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {
+      isAuth,
+      moduleId,
+      moduleNameField,
+      componentsDictionary,
+      currentLang: localeString,
+      children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, {
+        flags: skeletonFlags,
+        children: isAuth ? /* @__PURE__ */ jsx(ModulePrivilegesProvider, {
+          queryPrivileges: privileges,
+          children: /* @__PURE__ */ jsx(ModalProvider, {
+            children
+          })
+        }) : /* @__PURE__ */ jsx(ModalProvider, {
+          children
+        })
+      })
+    })
+  });
+}
+export {
+  BaseModule as B
+};

package/components/BaseModule/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { BaseModuleProps } from './types';
+export declare function BaseModule(props: BaseModuleProps): import("react").JSX.Element;
+export default BaseModule;

package/components/BaseModule/types.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export declare type BaseModuleProps = {
+    moduleId: string;
+    skeletonFlags: string[];
+    moduleNameField?: string;
+    privileges: string[];
+    componentsDictionary: string[];
+    isAuth?: boolean;
+    children: ReactNode;
+};

package/components/MFHostApp/index.401a303e.js

@@ -0,0 +1,79 @@
+import { unstable_HistoryRouter } from "react-router-dom";
+import { EnvironmentProvider, HostToolsProvider, NetworkProvider, DomainCountryProvider } from "@m4l/core";
+import { LocalesProvider, HostThemeProvider, ResponsiveContainerProvider, FormatterProvider } from "@m4l/graphics";
+import { WindowToolsMFProvider, DynamicMFParmsProvider } from "@m4l/components";
+import { B as BaseModule } from "../BaseModule/index.8ff0193e.js";
+import { jsx } from "react/jsx-runtime";
+function MFHostApp(props) {
+  const {
+    children,
+    currentLocale,
+    hostTheme,
+    environment,
+    hostTools,
+    axiosOperation,
+    formatters,
+    isAuth = true,
+    moduleId,
+    moduleNameField,
+    skeletonFlags,
+    privileges,
+    componentsDictionary,
+    dynamicMFStore,
+    windowTools,
+    observedDivRef
+  } = props;
+  return /* @__PURE__ */ jsx(EnvironmentProvider, {
+    ...environment,
+    children: /* @__PURE__ */ jsx(HostToolsProvider, {
+      ...hostTools,
+      children: /* @__PURE__ */ jsx(NetworkProvider, {
+        axiosOperation,
+        children: /* @__PURE__ */ jsx(LocalesProvider, {
+          isMicroFrontEnd: true,
+          localeHost: currentLocale,
+          children: /* @__PURE__ */ jsx(HostThemeProvider, {
+            isMicroFrontEnd: true,
+            ...hostTheme,
+            children: /* @__PURE__ */ jsx(ResponsiveContainerProvider, {
+              observedDivRef,
+              children: /* @__PURE__ */ jsx(unstable_HistoryRouter, {
+                history: hostTools.history,
+                children: /* @__PURE__ */ jsx(DomainCountryProvider, {
+                  isMicroFrontEnd: true,
+                  id: dynamicMFStore?.getState().dynamicMFParameters?.id || 1,
+                  currency: formatters.currencyFormatter.code,
+                  currency_decimal_digits: formatters.currencyFormatter.decimalDigits,
+                  decimal_symbol: formatters.numberFormatter.decimalSymbol,
+                  thousands_symbol: formatters.numberFormatter.thousandsSymbol,
+                  children: /* @__PURE__ */ jsx(BaseModule, {
+                    isAuth,
+                    moduleId,
+                    moduleNameField,
+                    componentsDictionary,
+                    skeletonFlags,
+                    privileges,
+                    children: /* @__PURE__ */ jsx(FormatterProvider, {
+                      isMicroFrontEnd: true,
+                      ...formatters,
+                      children: /* @__PURE__ */ jsx(WindowToolsMFProvider, {
+                        ...windowTools,
+                        children: /* @__PURE__ */ jsx(DynamicMFParmsProvider, {
+                          store: dynamicMFStore,
+                          children
+                        })
+                      })
+                    })
+                  })
+                })
+              })
+            })
+          })
+        })
+      })
+    })
+  });
+}
+export {
+  MFHostApp as M
+};

package/components/MFHostApp/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { MFHostAppProps } from './types';
+export declare function MFHostApp(props: MFHostAppProps): import("react").JSX.Element;
+export default MFHostApp;

package/components/MFHostApp/types.d.ts

@@ -0,0 +1,17 @@
+import type { AxiosOperation, EnvironmentType, HostToolsType } from '@m4l/core';
+import { Formatters, LocaleType } from '@m4l/graphics';
+import { DynamicMFStore, WindowToolsMF } from '@m4l/components';
+import { BaseModuleProps } from '../BaseModule/types';
+import { HostThemeType } from '@m4l/graphics';
+export interface ByHostProps {
+    environment: EnvironmentType;
+    hostTools: HostToolsType;
+    hostTheme: HostThemeType;
+    currentLocale: LocaleType;
+    axiosOperation: AxiosOperation;
+    formatters: Formatters;
+    dynamicMFStore: DynamicMFStore;
+    windowTools: WindowToolsMF;
+    observedDivRef: Element | Text | null;
+}
+export declare type MFHostAppProps = ByHostProps & BaseModuleProps;

package/components/MFIsolationApp/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { MFIsolationAppProps } from './types';
+export declare function MFIsolationApp(props: MFIsolationAppProps): import("react").JSX.Element;
+export default MFIsolationApp;

package/components/MFIsolationApp/index.e733d368.js

@@ -0,0 +1,181 @@
+import { useEffect, useMemo, useCallback } from "react";
+import { unstable_HistoryRouter } from "react-router-dom";
+import { ToastContainer, toast } from "react-toastify";
+import { HostThemeProvider, FormatterProvider, LocalesProvider, getLocaleFromNetwork, ResponsiveContainerProvider } from "@m4l/graphics";
+import { A as AuthProvider } from "../../contexts/AuthContext/index.6f966215.js";
+import { DomainCountryProvider, EnvironmentProvider, HostToolsProvider, NetworkProvider, axiosOperation } from "@m4l/core";
+import { createBrowserHistory } from "history";
+import EventEmitter from "eventemitter3";
+import { format } from "date-fns";
+import { defaultThemeOptions, fnComponentsOverrides } from "@m4l/styles";
+import { u as useAuth } from "../../hooks/useAuth/index.cb6a3420.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import NProgress from "nprogress";
+import { B as BaseModule } from "../BaseModule/index.8ff0193e.js";
+import { AreasProvider } from "@m4l/components";
+function MFAuthApp(props) {
+  const {
+    children,
+    user,
+    pwd
+  } = props;
+  const {
+    isAuthenticated,
+    isInitialized,
+    login,
+    user: authUser
+  } = useAuth();
+  useEffect(() => {
+    if (isInitialized && isAuthenticated === false) {
+      login(user, pwd, false);
+    }
+  }, [isInitialized, isAuthenticated]);
+  if (!isAuthenticated)
+    return /* @__PURE__ */ jsx("div", {
+      children: "Pendiente x atenticar"
+    });
+  const domianCountry = {
+    id: 1,
+    currency: "USD",
+    currency_decimal_digits: 2,
+    decimal_symbol: ".",
+    thousands_symbol: ","
+  };
+  if (authUser?.domain_country) {
+    domianCountry.id = authUser?.domain_country.id ?? domianCountry.id;
+    domianCountry.currency = authUser?.domain_country.currency ?? domianCountry.currency;
+    domianCountry.currency_decimal_digits = authUser?.domain_country.currency_decimal_digits ?? domianCountry.currency_decimal_digits;
+    domianCountry.decimal_symbol = authUser?.domain_country.decimal_symbol ?? domianCountry.decimal_symbol;
+    domianCountry.thousands_symbol = authUser?.domain_country?.thousands_symbol ?? domianCountry.thousands_symbol;
+  }
+  return /* @__PURE__ */ jsxs(HostThemeProvider, {
+    hostThemeOptions: defaultThemeOptions,
+    fnComponentsOverrides,
+    isMicroFrontEnd: true,
+    children: [/* @__PURE__ */ jsx(ToastContainer, {}), /* @__PURE__ */ jsx(DomainCountryProvider, {
+      ...domianCountry,
+      isMicroFrontEnd: false,
+      children: /* @__PURE__ */ jsx(FormatterProvider, {
+        isMicroFrontEnd: false,
+        dateFormatter: {
+          formatDate: format
+        },
+        currencyFormatter: {
+          code: domianCountry.currency,
+          decimalDigits: domianCountry.currency_decimal_digits
+        },
+        children
+      })
+    })]
+  });
+}
+const history = createBrowserHistory({
+  window
+});
+function MFIsolationApp(props) {
+  const {
+    children,
+    user,
+    pwd,
+    database = "domain",
+    host_api_local,
+    host_api_remote,
+    host_static_assets,
+    environment_assets,
+    moduleId,
+    skeletonFlags,
+    moduleNameField,
+    privileges,
+    componentsDictionary,
+    onLoad,
+    activeAreasNetwork = false,
+    activeCookiesFromNetwork = false,
+    observedDivRef
+  } = props;
+  const eventEmitter = useMemo(() => new EventEmitter(), []);
+  const events_add_listener = useCallback((eventName, handler) => {
+    eventEmitter.on(eventName, handler);
+  }, [eventEmitter]);
+  const events_remove_listener = useCallback((eventName, handler) => {
+    if (handler === null) {
+      eventEmitter.removeListener(eventName);
+      return;
+    }
+    eventEmitter.removeListener(eventName, handler);
+  }, [eventEmitter]);
+  const events_emit = useCallback((eventName, arg) => {
+    eventEmitter.emit(eventName, arg);
+  }, [eventEmitter]);
+  const startProgress = () => {
+    NProgress.configure({
+      showSpinner: true
+    });
+    NProgress.start();
+  };
+  const stopProgress = () => {
+    NProgress.done();
+  };
+  const environment = useMemo(() => ({
+    host: "",
+    isLocalhost: true,
+    domain_token: "lab1",
+    database,
+    host_api_local,
+    host_api_remote,
+    host_static_assets,
+    environment_assets
+  }), []);
+  const hostTools = useMemo(() => ({
+    history,
+    toast,
+    startProgress,
+    stopProgress,
+    events_add_listener,
+    events_remove_listener,
+    events_emit
+  }), []);
+  return /* @__PURE__ */ jsx(EnvironmentProvider, {
+    ...environment,
+    children: /* @__PURE__ */ jsx(HostToolsProvider, {
+      ...hostTools,
+      children: /* @__PURE__ */ jsx(NetworkProvider, {
+        axiosOperation,
+        children: /* @__PURE__ */ jsx(unstable_HistoryRouter, {
+          history,
+          children: /* @__PURE__ */ jsx(LocalesProvider, {
+            isMicroFrontEnd: false,
+            getLocaleFromNetwork,
+            children: /* @__PURE__ */ jsx(AuthProvider, {
+              children: /* @__PURE__ */ jsx(MFAuthApp, {
+                user,
+                pwd,
+                children: /* @__PURE__ */ jsx(BaseModule, {
+                  moduleId,
+                  privileges,
+                  skeletonFlags,
+                  componentsDictionary,
+                  moduleNameField,
+                  children: /* @__PURE__ */ jsx(AreasProvider, {
+                    onLoad,
+                    loadAreasFromNetwork: activeAreasNetwork,
+                    loadCookiesFromNetwork: activeCookiesFromNetwork,
+                    onSelectLayout: (modId) => {
+                      console.log("onSelectLayout", modId);
+                    },
+                    children: /* @__PURE__ */ jsx(ResponsiveContainerProvider, {
+                      observedDivRef,
+                      children
+                    })
+                  })
+                })
+              })
+            })
+          })
+        })
+      })
+    })
+  });
+}
+export {
+  MFIsolationApp as M
+};

package/components/MFIsolationApp/subcomponents/MFAuthApp/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { MFAuthAppProps } from './types';
+export declare function MFAuthApp(props: MFAuthAppProps): import("react").JSX.Element;
+export default MFAuthApp;

package/components/MFIsolationApp/subcomponents/MFAuthApp/types.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export declare type MFAuthAppProps = {
+    user: string;
+    pwd: string;
+    children: ReactNode;
+};

package/components/MFIsolationApp/types.d.ts

@@ -0,0 +1,14 @@
+import { BaseModuleProps } from '../BaseModule/types';
+export declare type MFIsolationAppProps = BaseModuleProps & {
+    user: string;
+    pwd: string;
+    host_api_local: string;
+    database?: string;
+    host_api_remote: string;
+    host_static_assets: string;
+    environment_assets: string;
+    onLoad: () => void;
+    activeAreasNetwork?: boolean;
+    activeCookiesFromNetwork?: boolean;
+    observedDivRef: Element | Text | null;
+};

package/components/MFNoAuthApp/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { MFNoAuthAppProps } from './types';
+export declare function MFNoAuthApp(props: MFNoAuthAppProps): import("react").JSX.Element;
+export default MFNoAuthApp;

package/components/MFNoAuthApp/types.d.ts

@@ -0,0 +1,10 @@
+import { Formatters } from '@m4l/graphics';
+import { WindowToolsMF } from '@m4l/components';
+import { BaseModuleProps } from '../BaseModule/types';
+export interface ByHostProps {
+    formatters: Formatters;
+    windowTools: WindowToolsMF;
+}
+export interface MFNoAuthAppProps extends ByHostProps, BaseModuleProps {
+    observedDivRef: Element | Text | null;
+}

package/components/index.7006a30d.js

@@ -0,0 +1,47 @@
+import { DomainCountryProvider } from "@m4l/core";
+import { FormatterProvider, ResponsiveContainerProvider } from "@m4l/graphics";
+import { B as BaseModule } from "./BaseModule/index.8ff0193e.js";
+import { jsx } from "react/jsx-runtime";
+function MFNoAuthApp(props) {
+  const {
+    children,
+    formatters,
+    moduleId,
+    moduleNameField,
+    skeletonFlags,
+    privileges,
+    componentsDictionary,
+    isAuth,
+    observedDivRef
+  } = props;
+  const domianCountry = {
+    id: 1,
+    currency: "USD",
+    currency_decimal_digits: 2,
+    decimal_symbol: ".",
+    thousands_symbol: ","
+  };
+  return /* @__PURE__ */ jsx(DomainCountryProvider, {
+    isMicroFrontEnd: true,
+    ...domianCountry,
+    children: /* @__PURE__ */ jsx(BaseModule, {
+      isAuth,
+      moduleId,
+      moduleNameField,
+      componentsDictionary,
+      skeletonFlags,
+      privileges,
+      children: /* @__PURE__ */ jsx(FormatterProvider, {
+        isMicroFrontEnd: true,
+        ...formatters,
+        children: /* @__PURE__ */ jsx(ResponsiveContainerProvider, {
+          observedDivRef,
+          children
+        })
+      })
+    })
+  });
+}
+export {
+  MFNoAuthApp as M
+};

package/components/index.d.ts

@@ -0,0 +1,6 @@
+export { MFIsolationApp } from './MFIsolationApp';
+export { MFNoAuthApp } from './MFNoAuthApp';
+export { MFHostApp } from './MFHostApp';
+export { BaseModule } from './BaseModule';
+export type { ByHostProps } from './MFHostApp/types';
+export type { BaseModuleProps } from './BaseModule/types';

package/contexts/AuthContext/index.6f966215.js

@@ -0,0 +1,160 @@
+import { createContext, useReducer, useEffect } from "react";
+import { useHostTools, useNetwork, useEnvironment, useLocalStorageWithListener, EmitEvents, getLocalStorage, setLocalStorage } from "@m4l/core";
+import { jsx } from "react/jsx-runtime";
+var EnumTypes = /* @__PURE__ */ ((EnumTypes2) => {
+  EnumTypes2["Initial"] = "INITIALIZE";
+  EnumTypes2["Login"] = "LOGIN";
+  EnumTypes2["Logout"] = "LOGOUT";
+  return EnumTypes2;
+})(EnumTypes || {});
+const initialState = {
+  isAuthenticated: false,
+  isInitialized: false,
+  user: null
+};
+const JWTReducer = (state, action) => {
+  switch (action.type) {
+    case "INITIALIZE":
+      return {
+        isAuthenticated: action.payload.isAuthenticated,
+        isInitialized: true,
+        user: action.payload.user
+      };
+    case "LOGIN":
+      return {
+        ...state,
+        isAuthenticated: true,
+        user: action.payload.user
+      };
+    case "LOGOUT":
+      return {
+        ...state,
+        isAuthenticated: false,
+        user: null
+      };
+    default:
+      return state;
+  }
+};
+const AuthContext = createContext(null);
+function dispatchInitial(dispatch) {
+  dispatch({
+    type: EnumTypes.Initial,
+    payload: {
+      isAuthenticated: false,
+      user: null
+    }
+  });
+}
+function AuthProvider(props) {
+  const {
+    children
+  } = props;
+  const [state, dispatch] = useReducer(JWTReducer, initialState);
+  const {
+    events_add_listener
+  } = useHostTools();
+  const {
+    networkOperation
+  } = useNetwork();
+  const {
+    domain_token
+  } = useEnvironment();
+  const [nextValSession, setNextValSession] = useLocalStorageWithListener(
+    "vSession",
+    new Date().getTime() + ""
+  );
+  useEffect(() => {
+    const initialize = async () => {
+      networkOperation({
+        method: "GET",
+        endPoint: `auth/login`,
+        parms: {
+          user_data: true
+        },
+        checkUnAuthorized: false
+      }).then((response) => {
+        dispatch({
+          type: EnumTypes.Initial,
+          payload: {
+            isAuthenticated: true,
+            user: response.user
+          }
+        });
+        const useSaved = getLocalStorage("userData", {
+          email: response.user.email,
+          remember: true
+        });
+        if (useSaved?.email !== response.user.email) {
+          setLocalStorage("userData", {
+            email: response.user.email
+          }, true);
+        }
+      }).catch(() => {
+        dispatchInitial(dispatch);
+      });
+    };
+    initialize();
+  }, [nextValSession]);
+  const login = async (email, password, remember) => {
+    await networkOperation({
+      endPoint: `auth/login`,
+      method: "POST",
+      data: {
+        email,
+        password,
+        domain_token
+      }
+    }).then((response) => {
+      const user = response.data;
+      if (remember) {
+        setLocalStorage("userData", {
+          email,
+          remember
+        });
+      } else {
+        setLocalStorage("userData", {
+          email: "",
+          remember
+        });
+      }
+      dispatch({
+        type: EnumTypes.Login,
+        payload: {
+          user
+        }
+      });
+      setNextValSession(new Date().getTime() + "");
+    });
+  };
+  const logout = async (isAuthenticated) => {
+    if (isAuthenticated) {
+      await networkOperation({
+        endPoint: `auth/logout`,
+        method: "POST"
+      });
+    }
+    dispatch({
+      type: EnumTypes.Logout
+    });
+    setNextValSession(new Date().getTime() + "");
+  };
+  const onNetserviceUnautorized = () => {
+    logout(false);
+  };
+  useEffect(() => {
+    events_add_listener(EmitEvents.EMMIT_EVENT_NET_SERVICE_UNAUTHORIZED, onNetserviceUnautorized);
+  }, []);
+  return /* @__PURE__ */ jsx(AuthContext.Provider, {
+    value: {
+      ...state,
+      login,
+      logout
+    },
+    children
+  });
+}
+export {
+  AuthProvider as A,
+  AuthContext as a
+};

package/contexts/AuthContext/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { AuthProviderProps, SessionContextType } from './types';
+declare const AuthContext: import("react").Context<SessionContextType | null>;
+declare function AuthProvider(props: AuthProviderProps): import("react").JSX.Element;
+export { AuthContext, AuthProvider };

package/contexts/AuthContext/types.d.ts

@@ -0,0 +1,51 @@
+import { DomainCountry, Maybe } from '@m4l/core';
+import { ReactNode } from 'react';
+export declare enum EnumTypes {
+    Initial = "INITIALIZE",
+    Login = "LOGIN",
+    Logout = "LOGOUT"
+}
+export declare type AuthProviderProps = {
+    children: ReactNode;
+};
+export declare type ActionMap<M extends {
+    [index: string]: any;
+}> = {
+    [Key in keyof M]: M[Key] extends undefined ? {
+        type: Key;
+    } : {
+        type: Key;
+        payload: M[Key];
+    };
+};
+export declare type SessionAuthPayload = {
+    [EnumTypes.Initial]: {
+        isAuthenticated: boolean;
+        user: AuthUser;
+    };
+    [EnumTypes.Login]: {
+        user: AuthUser;
+    };
+    [EnumTypes.Logout]: undefined;
+};
+export declare type SessionActions = ActionMap<SessionAuthPayload>[keyof ActionMap<SessionAuthPayload>];
+export interface User {
+    email: string;
+    id: number;
+    first_name: string;
+    last_name: string;
+    account_id: number;
+    domain_country: DomainCountry;
+    avatar_url?: Maybe<string>;
+    user_type_id?: number;
+}
+export declare type AuthUser = Maybe<User>;
+export declare type AuthState = {
+    isAuthenticated: boolean;
+    isInitialized: boolean;
+    user: AuthUser;
+};
+export interface SessionContextType extends AuthState {
+    login: (email: string, password: string, remember: boolean) => object | undefined;
+    logout: (isAuthenticated: boolean) => Promise<void>;
+}

package/contexts/index.d.ts

@@ -0,0 +1 @@
+export * from './AuthContext';

package/contexts/index.ee173661.js

@@ -0,0 +1 @@
+

package/hooks/index.77acdde7.js

@@ -0,0 +1 @@
+

package/{dist/hooks → hooks}/index.d.ts

@@ -1,2 +1,3 @@
 export * from './useMasterDetail';
+export * from './useAuth';
 export * from './useModule';