@m4l/layouts 0.1.43 → 0.1.45

package/components/BaseModule/{index.6309486a.js → index.6659c50e.js}

@@ -1,5 +1,6 @@
 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 {
@@ -10,12 +11,14 @@ function BaseModule(props) {
     privileges,
     componentsDictionary
   } = props;
+  const localeString = useLocales().currentLocale?.localeString;
   return /* @__PURE__ */ jsx(FlagsProvider, {
     children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {
       isAuth: true,
       moduleId,
       moduleNameField,
       componentsDictionary,
+      currentLang: localeString,
       children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, {
         flags: skeletonFlags,
         children: /* @__PURE__ */ jsx(ModulePrivilegesProvider, {

package/components/MFHostApp/{index.420c2626.js → index.dbfb66ee.js}

@@ -2,7 +2,7 @@ import { unstable_HistoryRouter } from "react-router-dom";
 import { EnvironmentProvider, HostToolsProvider, NetworkProvider, DomainCountryProvider } from "@m4l/core";
 import { LocalesProvider, HostThemeProvider, FormatterProvider } from "@m4l/graphics";
 import { WindowToolsMFProvider, DynamicMFParmsProvider } from "@m4l/components";
-import { B as BaseModule } from "../BaseModule/index.6309486a.js";
+import { B as BaseModule } from "../BaseModule/index.6659c50e.js";
 import { jsx } from "react/jsx-runtime";
 function MFHostApp(props) {
   const {

package/components/MFIsolationApp/{index.e36cf308.js → index.c5ce8b36.js}

@@ -11,7 +11,7 @@ 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.6309486a.js";
+import { B as BaseModule } from "../BaseModule/index.6659c50e.js";
 import { AreasProvider } from "@m4l/components";
 function MFAuthApp(props) {
   const {

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,8 @@
+import { Formatters } from '@m4l/graphics';
+import { WindowToolsMF } from '@m4l/components';
+import { BaseModuleProps } from '../BaseModule/types';
+export interface ByHostProps {
+    formatters: Formatters;
+    windowTools: WindowToolsMF;
+}
+export declare type MFNoAuthAppProps = ByHostProps & BaseModuleProps;

package/components/index.2a8eff7c.js

@@ -0,0 +1,41 @@
+import { DomainCountryProvider } from "@m4l/core";
+import { FormatterProvider } from "@m4l/graphics";
+import { B as BaseModule } from "./BaseModule/index.6659c50e.js";
+import { jsx } from "react/jsx-runtime";
+function MFNoAuthApp(props) {
+  const {
+    children,
+    formatters,
+    moduleId,
+    moduleNameField,
+    skeletonFlags,
+    privileges,
+    componentsDictionary
+  } = 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, {
+      moduleId,
+      moduleNameField,
+      componentsDictionary,
+      skeletonFlags,
+      privileges,
+      children: /* @__PURE__ */ jsx(FormatterProvider, {
+        isMicroFrontEnd: true,
+        ...formatters,
+        children
+      })
+    })
+  });
+}
+export {
+  MFNoAuthApp as M
+};

package/components/index.d.ts

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

package/contexts/index.ee173661.js

@@ -0,0 +1 @@
+

package/hooks/index.77acdde7.js

@@ -0,0 +1 @@
+

package/hooks/useMasterDetail/{index.be4908d9.js → index.d45f2a86.js}

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { M as MasterDetailContext } from "../../layouts/MasterDetailLayout/index.fe6ac47b.js";
+import { M as MasterDetailContext } from "../../layouts/MasterDetailLayout/index.748f7ada.js";
 const useMasterDetail = () => useContext(MasterDetailContext);
 export {
   useMasterDetail as u

package/index.js

@@ -1,11 +1,12 @@
-import { M } from "./components/MFIsolationApp/index.e36cf308.js";
-import { M as M2 } from "./components/MFHostApp/index.420c2626.js";
-import { B } from "./components/BaseModule/index.6309486a.js";
+import { M } from "./components/MFIsolationApp/index.c5ce8b36.js";
+import { M as M2 } from "./components/index.2a8eff7c.js";
+import { M as M3 } from "./components/MFHostApp/index.dbfb66ee.js";
+import { B } from "./components/BaseModule/index.6659c50e.js";
 import { a, A } from "./contexts/AuthContext/index.6f966215.js";
 import { a as a2, d, g } from "./layouts/ModuleLayout/index.e7218171.js";
-import { a as a3, d as d2, g as g2 } from "./layouts/MasterDetailLayout/index.fe6ac47b.js";
-import { N, d as d3, g as g3 } from "./layouts/NoAuthModuleLayout/index.82656886.js";
-import { u } from "./hooks/useMasterDetail/index.be4908d9.js";
+import { a as a3, d as d2, g as g2 } from "./layouts/MasterDetailLayout/index.748f7ada.js";
+import { N, d as d3, g as g3 } from "./layouts/NoAuthModuleLayout/index.7ba635bb.js";
+import { u } from "./hooks/useMasterDetail/index.d45f2a86.js";
 import { u as u2 } from "./hooks/useAuth/index.cb6a3420.js";
 import { u as u3 } from "./hooks/useModule/index.b5f598b1.js";
 import "react";
@@ -27,8 +28,9 @@ export {
   a as AuthContext,
   A as AuthProvider,
   B as BaseModule,
-  M2 as MFHostApp,
+  M3 as MFHostApp,
   M as MFIsolationApp,
+  M2 as MFNoAuthApp,
   a3 as MasterDetailLayout,
   a2 as ModuleLayout,
   N as NoAuthModuleLayout,

package/layouts/MasterDetailLayout/contexts/MasterDetailContext/types.d.ts

@@ -5,7 +5,8 @@ export interface MasterDetailContextStateProps {
 }
 export interface MasterDetailProviderProps {
     children: ReactNode;
+    onClickViewDetail: () => void;
 }
-export interface MasterDetailContextProps extends MasterDetailContextStateProps {
+export interface MasterDetailContextProps extends MasterDetailContextStateProps, Pick<MasterDetailProviderProps, 'onClickViewDetail'> {
     onChangeMasterSelection: (newMasterSelection: MasterSelecion) => void;
 }

package/layouts/MasterDetailLayout/{index.fe6ac47b.js → index.748f7ada.js}

@@ -8,18 +8,21 @@ import { generateUtilityClasses, generateUtilityClass, styled } from "@mui/mater
 import { unstable_composeClasses } from "@mui/base";
 const initialState = {
   masterSelection: void 0,
-  onChangeMasterSelection: voidFunction
+  onChangeMasterSelection: voidFunction,
+  onClickViewDetail: voidFunction
 };
 const MasterDetailContext = createContext(initialState);
 function MasterDetailProvider(props) {
   const {
-    children
+    children,
+    onClickViewDetail
   } = props;
   const [masterSelection, setMasterSelection] = useState(void 0);
   return /* @__PURE__ */ jsx(MasterDetailContext.Provider, {
     value: {
       masterSelection,
-      onChangeMasterSelection: setMasterSelection
+      onChangeMasterSelection: setMasterSelection,
+      onClickViewDetail
     },
     children
   });
@@ -43,8 +46,8 @@ const useMasterDetailLayoutUtilityClasses = () => {
 const MasterDetailLayoutRoot = styled("div")(({ theme }) => ({
   ...theme.components?.M4LMasterDetailLayout?.styleOverrides
 }));
-function getTotalModuleActions(splitActions, moduleActions = [], viewDetailAction, isDesktop) {
-  let totalActions = isDesktop !== void 0 && isDesktop ? [...splitActions] : [viewDetailAction];
+function getTotalModuleActions(splitActions, moduleActions = []) {
+  let totalActions = [...splitActions];
   totalActions = moduleActions.concat(totalActions);
   return totalActions;
 }
@@ -110,24 +113,13 @@ function MasterDetailLayout(props) {
       )
     });
   }, [detailComponent, getLabel]);
-  const viewDetailAction = useMemo(() => {
-    return {
-      urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/view_detail.svg`,
-      onClick: onClickViewDetail,
-      disabled: false,
-      visibility: "allways",
-      label: getLabel("master_detail_layout.view_detail"),
-      tag: "none",
-      className: "",
-      key: "detail"
-    };
-  }, [environment_assets, onClickViewDetail]);
   const finalModuleActions = useMemo(() => {
-    const actions = getTotalModuleActions(splitActions, moduleActions, viewDetailAction, isDesktop);
+    const actions = getTotalModuleActions(splitActions, moduleActions);
     return actions;
-  }, [splitActions, moduleActions, isDesktop, viewDetailAction]);
+  }, [splitActions, moduleActions]);
   const classes = useMasterDetailLayoutUtilityClasses();
   return /* @__PURE__ */ jsx(MasterDetailProvider, {
+    onClickViewDetail,
     children: /* @__PURE__ */ jsx(MasterDetailLayoutRoot, {
       className: classes.root,
       children: /* @__PURE__ */ jsx(ModuleLayout, {

package/layouts/NoAuthModuleLayout/{index.82656886.js → index.7ba635bb.js}

@@ -1,8 +1,8 @@
 import { useResponsiveDesktop, useLocales } from "@m4l/graphics";
-import { LanguagePopover, Image, Typography, ScrollBar, HelmetPage } from "@m4l/components";
+import { LanguagePopover, IconButton, Image, Typography, Stack, ScrollBar, HelmetPage } from "@m4l/components";
 import { styled, alpha } from "@mui/material/styles";
 import { useBase, useModuleDictionary, useDomain, useEnvironment, BaseProvider, FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider } from "@m4l/core";
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 const InnerModuleRoot = styled("div")(({
   theme
 }) => ({
@@ -33,6 +33,12 @@ const DesktopContentRoot = styled("div")(({ theme }) => ({
     top: "20px",
     right: "20px",
     zIndex: 1
+  },
+  "& .M4LIconButton-root.config-icon": {
+    position: "absolute",
+    top: "22px",
+    right: "56px",
+    zIndex: 1
   }
 }));
 const DesktopBanner = styled("div")(({ theme }) => ({
@@ -117,7 +123,8 @@ styled("div")(() => ({
 const DesktopContent = () => {
   const {
     children,
-    companyLogoSmallUrl
+    companyLogoSmallUrl,
+    handleSetting
   } = useBase();
   const {
     getLabel
@@ -126,8 +133,16 @@ const DesktopContent = () => {
     name,
     slogan
   } = useDomain();
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
   return /* @__PURE__ */ jsxs(DesktopContentRoot, {
-    children: [/* @__PURE__ */ jsx(LanguagePopover, {}), /* @__PURE__ */ jsxs(DesktopBanner, {
+    children: [/* @__PURE__ */ jsx(LanguagePopover, {}), /* @__PURE__ */ jsx(IconButton, {
+      src: `${host_static_assets}/${environment_assets}/frontend/components/account_popover/assets/icons/configuration.svg`,
+      onClick: handleSetting,
+      className: "config-icon"
+    }), /* @__PURE__ */ jsxs(DesktopBanner, {
       children: [/* @__PURE__ */ jsx(ContainerLogo$1, {
         children: /* @__PURE__ */ jsx(Image, {
           src: companyLogoSmallUrl,
@@ -174,7 +189,15 @@ const DesktopContent = () => {
             skeletongHeight: "20px",
             children: getLabel("module_description")
           })]
-        }), children]
+        }), /* @__PURE__ */ jsx(Stack, {
+          direction: "column",
+          height: "auto",
+          children: /* @__PURE__ */ jsx(ScrollBar, {
+            children: /* @__PURE__ */ jsx(Fragment, {
+              children
+            })
+          })
+        })]
       })
     })]
   });
@@ -201,7 +224,17 @@ const MobileBanner = styled("div")(({ theme }) => ({
   "& .M4LanguagePopover-root": {
     position: "absolute",
     top: "12px",
-    right: "12px"
+    right: "12px",
+    zIndex: 1
+  },
+  "& .M4LIconButton-root.config-icon": {
+    position: "absolute",
+    top: "8px",
+    right: "40px",
+    zIndex: 1,
+    "& .M4LIcon-root .M4LIcon-icon": {
+      backgroundColor: theme.palette.patronus?.marbleLight[10]
+    }
   },
   "& .MuiTypography-root": {
     color: theme.palette.patronus?.marbleLight[10],
@@ -258,11 +291,16 @@ const ContainerModuleName = styled("div")(() => ({
 const MobileContent = () => {
   const {
     children,
-    companyLogoSmallUrl
+    companyLogoSmallUrl,
+    handleSetting
   } = useBase();
   const {
     getLabel
   } = useModuleDictionary();
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
   const {
     name
   } = useDomain();
@@ -287,6 +325,10 @@ const MobileContent = () => {
           skeletongHeight: "20px",
           children: getLabel("company_name_subtitle")
         })]
+      }), /* @__PURE__ */ jsx(IconButton, {
+        src: `${host_static_assets}/${environment_assets}/frontend/components/account_popover/assets/icons/configuration.svg`,
+        onClick: handleSetting,
+        className: "config-icon"
       }), /* @__PURE__ */ jsx(LanguagePopover, {})]
     }), /* @__PURE__ */ jsx(WrapperFormContent, {
       children: /* @__PURE__ */ jsx(ScrollBar, {
@@ -320,8 +362,11 @@ const InnerModule = () => {
   return /* @__PURE__ */ jsx(HelmetPage, {
     title: getModuleLabel(),
     subtitle,
-    children: /* @__PURE__ */ jsx(InnerModuleRoot, {
-      children: isDesktop ? /* @__PURE__ */ jsx(DesktopContent, {}) : /* @__PURE__ */ jsx(MobileContent, {})
+    children: /* @__PURE__ */ jsx(Fragment, {
+      children: /* @__PURE__ */ jsx(InnerModuleRoot, {
+        id: "modulerootnouth",
+        children: isDesktop ? /* @__PURE__ */ jsx(DesktopContent, {}) : /* @__PURE__ */ jsx(MobileContent, {})
+      })
     })
   });
 };
@@ -335,7 +380,8 @@ const NoAuthModuleLayout = (props) => {
     subtitle,
     companyLogoSmallUrl,
     companyLogoNormalUrl,
-    moduleIlustrationUrl
+    moduleIlustrationUrl,
+    handleSetting
   } = props;
   const {
     host_static_assets,
@@ -355,7 +401,8 @@ const NoAuthModuleLayout = (props) => {
       companyLogoSmallUrl: finalCompanyLogoSmallUrl,
       companyLogoNormalUrl: finalCompanyLogoNormalUrl,
       moduleIlustrationUrl: finalIllustrationUrl,
-      children
+      children,
+      handleSetting
     },
     children: /* @__PURE__ */ jsx(FlagsProvider, {
       children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {

package/layouts/NoAuthModuleLayout/types.d.ts

@@ -9,6 +9,7 @@ export declare interface NoAuthBaseProviderProps {
     companyLogoNormalUrl: string;
     moduleIlustrationUrl?: string;
     children: ReactNode;
+    handleSetting?: () => void;
 }
 export interface NoAuthModuleLayoutProps extends NoAuthBaseProviderProps {
     moduleId: string;

package/layouts/index.417b6868.js

@@ -0,0 +1 @@
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/layouts",
-  "version": "0.1.43",
+  "version": "0.1.45",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/components": "*",

package/components/index.aeb3cf83.js

@@ -1,6 +0,0 @@
-import "./MFIsolationApp/index.e36cf308.js";
-import "react-router-dom";
-import "@m4l/core";
-import "@m4l/graphics";
-import "@m4l/components";
-import "react/jsx-runtime";

package/contexts/index.b46a2699.js

@@ -1 +0,0 @@
-import "./AuthContext/index.6f966215.js";

package/hooks/index.33191825.js

@@ -1,4 +0,0 @@
-import "react";
-import "../layouts/MasterDetailLayout/index.fe6ac47b.js";
-import "../contexts/AuthContext/index.6f966215.js";
-import "../layouts/ModuleLayout/index.e7218171.js";

package/layouts/index.b2591ba1.js

@@ -1,8 +0,0 @@
-import "./ModuleLayout/index.e7218171.js";
-import "@m4l/components";
-import "react";
-import "@m4l/core";
-import "./MasterDetailLayout/index.fe6ac47b.js";
-import "@m4l/graphics";
-import "react/jsx-runtime";
-import "./NoAuthModuleLayout/index.82656886.js";