@m4l/layouts 0.0.29 → 0.0.32

package/dist/layouts/MasterDetailLayout/index.js

@@ -43,6 +43,7 @@ function ButtonDetail(props) {
     onClick,
     description
   } = props;
+  console.log("ButtonDetail", masterSelection);
   return /* @__PURE__ */ jsx(Button, {
     onClick,
     variant: "outlined",
@@ -65,7 +66,8 @@ function MasterDetailLayout(props) {
     masterComponent,
     componentsDictionary,
     breadcrumbLinks,
-    privileges
+    privileges,
+    skeletonFlags
   } = props;
   const {
     host_static_assets,
@@ -116,7 +118,7 @@ function MasterDetailLayout(props) {
       initialWidth: 500,
       initialHeigth: 680,
       contentComponent: detailComponent,
-      actionComponents: void 0
+      actions: void 0
     });
   }, [detailComponent]);
   const viewDetailAction = useMemo(() => {
@@ -138,24 +140,22 @@ function MasterDetailLayout(props) {
   }, [splitActions, moduleActions, isDesktop, viewDetailAction]);
   const finalComponentsDictionary = useMemo(() => componentsDictionary.concat(getMasterDetailLayoutComponentsDictionary()), [componentsDictionary]);
   console.log("MasterDetailLayout Render");
-  const memonizedSplit = useMemo(() => {
-    return /* @__PURE__ */ jsx(SplitLayout, {
-      splitPosition: isDesktop ? splitPosition : "none",
-      firstPart: masterComponent,
-      secondPart: detailComponent
-    });
-  }, [isDesktop, splitPosition, masterComponent, detailComponent]);
-  return /* @__PURE__ */ jsx(ModuleLayout, {
-    ref: moduleLayoutRef,
-    moduleId,
-    moduleNameField,
-    urlIcon,
-    moduleActions: finalModuleActions,
-    privileges,
-    componentsDictionary: finalComponentsDictionary,
-    breadcrumbLinks,
-    children: /* @__PURE__ */ jsx(MasterDetailProvider, {
-      children: memonizedSplit
+  return /* @__PURE__ */ jsx(MasterDetailProvider, {
+    children: /* @__PURE__ */ jsx(ModuleLayout, {
+      ref: moduleLayoutRef,
+      moduleId,
+      moduleNameField,
+      urlIcon,
+      moduleActions: finalModuleActions,
+      privileges,
+      skeletonFlags,
+      componentsDictionary: finalComponentsDictionary,
+      breadcrumbLinks,
+      children: /* @__PURE__ */ jsx(SplitLayout, {
+        splitPosition: isDesktop ? splitPosition : "none",
+        firstPart: masterComponent,
+        secondPart: detailComponent
+      })
     })
   });
 }

package/dist/layouts/ModuleLayout/index.js

@@ -1,7 +1,7 @@
 import { BoxIcon, Breadcrumbs as Breadcrumbs$1, MenuActions, useModal, ModalProvider, getModalDialogComponentsDictionary } from "@m4l/components";
 import { createContext, useState, useMemo, forwardRef, useRef, useImperativeHandle } from "react";
 import { styled, useTheme } from "@mui/material/styles";
-import { voidFunction, useModuleDictionary, useFlagsPresent, FlagsProvider, ModuleDictionaryProvider, ModulePrivilegesProvider } from "@m4l/core";
+import { voidFunction, useModuleDictionary, useFlagsPresent, FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider, ModulePrivilegesProvider } from "@m4l/core";
 import { Skeleton, Typography, IconButton } from "@mui/material";
 import { u as useResponsiveDesktop } from "../../vendor.js";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
@@ -341,7 +341,8 @@ const ModuleLayout = forwardRef((props, ref) => {
     children,
     componentsDictionary,
     breadcrumbLinks,
-    privileges
+    privileges,
+    skeletonFlags
   } = props;
   const moduleRef = useRef(null);
   const openModal = (modalOpenProps) => {
@@ -355,18 +356,21 @@ const ModuleLayout = forwardRef((props, ref) => {
     children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {
       moduleId,
       componentsDictionary,
-      children: /* @__PURE__ */ jsx(ModulePrivilegesProvider, {
-        queryPrivileges: privileges,
-        children: /* @__PURE__ */ jsx(ModuleProvider, {
-          moduleId,
-          urlIcon,
-          moduleNameField,
-          initialModuleActions,
-          breadcrumbLinks,
-          children: /* @__PURE__ */ jsx(ModalProvider, {
-            children: /* @__PURE__ */ jsx(Module, {
-              ref: moduleRef,
-              children
+      children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, {
+        flags: skeletonFlags,
+        children: /* @__PURE__ */ jsx(ModulePrivilegesProvider, {
+          queryPrivileges: privileges,
+          children: /* @__PURE__ */ jsx(ModuleProvider, {
+            moduleId,
+            urlIcon,
+            moduleNameField,
+            initialModuleActions,
+            breadcrumbLinks,
+            children: /* @__PURE__ */ jsx(ModalProvider, {
+              children: /* @__PURE__ */ jsx(Module, {
+                ref: moduleRef,
+                children
+              })
             })
           })
         })

package/dist/layouts/ModuleLayout/types.d.ts

@@ -18,6 +18,7 @@ export interface ModuleAction extends MenuAction {
 export interface ModuleLayoutProps extends HeaderProps {
     moduleId: string;
     urlIcon: string;
+    skeletonFlags: string[];
     moduleNameField?: string;
     privileges: string[];
     breadcrumbLinks: TLink[];

package/dist/layouts/NoAuthModuleLayout/index.js

@@ -1,7 +1,7 @@
 import { CompanyLogo, LanguagePopover, Typography, Image } from "@m4l/components";
 import { Card, Container, Stack } from "@mui/material";
 import { styled } from "@mui/material/styles";
-import { useModuleDictionary, useFlagsPresent, getLocalStorage, useNetwork, useEnvironment, useFlags, FlagsProvider, ModuleDictionaryProvider } from "@m4l/core";
+import { useModuleDictionary, useFlagsPresent, getLocalStorage, useNetwork, useEnvironment, useFlags, FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider } from "@m4l/core";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { u as useResponsive, P as Page } from "../../node_modules.js";
 import { createContext, useState, useEffect } from "react";
@@ -215,7 +215,8 @@ const NoAuthModuleLayout = (props) => {
     moduleId,
     moduleName,
     children,
-    componentsDictionary
+    componentsDictionary,
+    skeletonFlags
   } = props;
   return /* @__PURE__ */ jsx(FlagsProvider, {
     children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {
@@ -223,10 +224,13 @@ const NoAuthModuleLayout = (props) => {
       moduleId,
       moduleName,
       componentsDictionary,
-      children: /* @__PURE__ */ jsx(ModuleProvider, {
-        moduleId,
-        children: /* @__PURE__ */ jsx(ModuleWrapper, {
-          children
+      children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, {
+        flags: skeletonFlags,
+        children: /* @__PURE__ */ jsx(ModuleProvider, {
+          moduleId,
+          children: /* @__PURE__ */ jsx(ModuleWrapper, {
+            children
+          })
         })
       })
     })

package/dist/layouts/NoAuthModuleLayout/types.d.ts

@@ -7,5 +7,6 @@ export interface NoAuthModuleLayoutProps {
     moduleId: string;
     moduleName?: string;
     componentsDictionary: string[];
+    skeletonFlags: string[];
     children: ReactNode;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@m4l/layouts",
   "private": false,
-  "version": "0.0.29",
+  "version": "0.0.32",
   "license": "UNLICENSED",
   "scripts": {
     "dev": "vite",
@@ -14,7 +14,7 @@
     "format": "npm run prettier:fix && npm run lint:fix"
   },
   "dependencies": {
-    "@m4l/components": "^0.0.47",
+    "@m4l/components": "^0.0.48",
     "react": "^17.0.0 || 18.x",
     "react-dom": "^18.0.0"
   },