@m4l/layouts 1.0.4 → 1.0.5

package/layouts/NoAuthModuleLayout/index.83cd3ea3.js

@@ -0,0 +1,425 @@
+import { useResponsiveDesktop, useLocales, ResponsiveContainerProvider } from "@m4l/graphics";
+import { LanguagePopover, Image, Typography, Stack, ScrollBar, HelmetPage } from "@m4l/components";
+import { styled } from "@mui/material";
+import { useBase, useModuleDictionary, useDomain, useEnvironment, BaseProvider, FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider } from "@m4l/core";
+import { styled as styled$1, alpha } from "@mui/material/styles";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+const InnerModuleRoot = styled("div")(({
+  theme
+}) => ({
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  height: "100vh",
+  padding: "20px",
+  backgroundColor: theme.vars.palette.background.background,
+  [theme.breakpoints.down("md")]: {
+    padding: "0px"
+  }
+}));
+const DesktopContentRoot = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  borderRadius: "16px",
+  backgroundColor: theme.vars.palette.background.neutral,
+  boxShadow: theme.vars.customShadows?.z4,
+  padding: "20px 0 20px 20px",
+  width: "100%",
+  height: "100%",
+  maxWidth: "965px",
+  maxHeight: "900px",
+  position: "relative",
+  overflow: "auto",
+  "& .M4LanguagePopover-root": {
+    position: "absolute",
+    top: "20px",
+    right: "20px",
+    zIndex: 1
+  },
+  "& .M4LIconButton-root.config-icon": {
+    position: "absolute",
+    top: "25px",
+    right: "56px",
+    zIndex: 1
+  }
+}));
+const DesktopBanner = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "center",
+  alignItems: "center",
+  borderRadius: "12px",
+  width: "100%",
+  maxWidth: "400px",
+  height: "100%",
+  backgroundColor: theme.vars.palette.state?.focus,
+  boxShadow: theme.vars.customShadows?.z4,
+  padding: "0 60px",
+  gap: "40px",
+  overflow: "hidden",
+  "& .MuiTypography-root": {
+    color: theme.palette.patronus?.marbleLight[10],
+    display: "flex",
+    justifyContent: "center",
+    textAlign: "center",
+    textTransform: "uppercase"
+  },
+  "& .M4LTypography-root .MuiSkeleton-root": {
+    backgroundColor: alpha(
+      `${theme.colorSchemes.finalTheme.palette.patronus?.marbleLight[10]}`,
+      0.24
+    ),
+    margin: "auto"
+  }
+}));
+const ContainerLogo$1 = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  width: "84px",
+  height: "84px",
+  borderRadius: "6px",
+  backgroundColor: theme.vars.palette.state?.active,
+  justifyContent: "center",
+  alignItems: "center",
+  boxShadow: `0px 4px 8px  ${alpha(
+    theme.colorSchemes.finalTheme.palette.patronus?.coolGrey[70] || "",
+    0.16
+  )}`,
+  "& .M4LImage-root": {
+    backgroundColor: theme.vars.palette.patronus?.marbleLight[10],
+    borderRadius: "6px"
+  }
+}));
+const CompanyName$1 = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: "5px",
+  width: "100%"
+}));
+const CompanyLeyend = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: "5px",
+  width: "100%"
+}));
+const FormContent$1 = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  padding: "0 60px 0 80px",
+  margin: "auto 0",
+  width: "100%",
+  height: "auto",
+  gap: "20px"
+}));
+const WrapperFormContent$1 = styled$1("div")(() => ({
+  display: "flex",
+  width: "100%",
+  height: "100%"
+}));
+const ContainerModuleName$1 = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  width: "100%",
+  gap: "4px"
+}));
+styled$1("div")(() => ({
+  display: "flex",
+  width: "100%",
+  height: "100%",
+  justifyContent: "center",
+  alignItems: "center"
+}));
+const DesktopContent = () => {
+  const {
+    children,
+    companyLogoSmallUrl
+  } = useBase();
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const {
+    name,
+    slogan
+  } = useDomain();
+  return /* @__PURE__ */ jsxs(DesktopContentRoot, {
+    children: [/* @__PURE__ */ jsx(LanguagePopover, {}), /* @__PURE__ */ jsxs(DesktopBanner, {
+      children: [/* @__PURE__ */ jsx(ContainerLogo$1, {
+        children: /* @__PURE__ */ jsx(Image, {
+          src: companyLogoSmallUrl,
+          ratio: "1:1",
+          width: "64px",
+          height: "64px"
+        })
+      }), /* @__PURE__ */ jsxs(CompanyName$1, {
+        children: [/* @__PURE__ */ jsx(Typography, {
+          variant: "subtitleDens",
+          skeletonWidth: "70%",
+          skeletongHeight: "24px",
+          children: name
+        }), /* @__PURE__ */ jsx(Typography, {
+          variant: "paragraph",
+          skeletonWidth: "40%",
+          skeletongHeight: "20px",
+          children: getLabel("company_name_subtitle")
+        })]
+      }), /* @__PURE__ */ jsxs(CompanyLeyend, {
+        children: [/* @__PURE__ */ jsx(Typography, {
+          variant: "h5",
+          skeletonWidth: "50%",
+          skeletongHeight: "36px",
+          children: getLabel("module_leyend")
+        }), /* @__PURE__ */ jsx(Typography, {
+          variant: "subtitle",
+          skeletonWidth: "80%",
+          skeletongHeight: "24px",
+          children: slogan
+        })]
+      })]
+    }), /* @__PURE__ */ jsx(WrapperFormContent$1, {
+      children: /* @__PURE__ */ jsxs(FormContent$1, {
+        children: [/* @__PURE__ */ jsxs(ContainerModuleName$1, {
+          children: [/* @__PURE__ */ jsx(Typography, {
+            variant: "h5",
+            skeletonWidth: "20%",
+            skeletongHeight: "36px",
+            children: getLabel("module_name")
+          }), /* @__PURE__ */ jsx(Typography, {
+            variant: "paragraph",
+            skeletonWidth: "40%",
+            skeletongHeight: "20px",
+            children: getLabel("module_description")
+          })]
+        }), /* @__PURE__ */ jsx(Stack, {
+          direction: "column",
+          height: "auto",
+          children: /* @__PURE__ */ jsx(ScrollBar, {
+            children: /* @__PURE__ */ jsx(Fragment, {
+              children
+            })
+          })
+        })]
+      })
+    })]
+  });
+};
+const MobileContentRoot = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  width: "100%",
+  height: "100%",
+  backgroundColor: theme.vars.palette.background.neutral,
+  padding: "12px",
+  gap: "32px"
+}));
+const MobileBanner = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  padding: "12px",
+  gap: "20px",
+  width: "100%",
+  backgroundColor: theme.vars.palette.state?.focus,
+  boxShadow: theme.customShadows?.z4,
+  position: "relative",
+  borderRadius: "8px",
+  "& .M4LanguagePopover-root": {
+    position: "absolute",
+    top: "12px",
+    right: "12px",
+    zIndex: 1
+  },
+  "& .M4LIconButton-root.config-icon": {
+    position: "absolute",
+    top: "13px",
+    right: "40px",
+    zIndex: 1,
+    "& .M4LIcon-root .M4LIcon-icon": {
+      backgroundColor: theme.vars.palette.patronus?.marbleLight[10]
+    }
+  },
+  "& .MuiTypography-root": {
+    color: theme.vars.palette.patronus?.marbleLight[10],
+    display: "flex",
+    textTransform: "uppercase"
+  },
+  "& .MuiSkeleton-root": {
+    backgroundColor: alpha(`${theme.colorSchemes.finalTheme.palette.patronus?.marbleLight[10]}`, 0.24),
+    margin: "auto"
+  }
+}));
+styled$1("div")(() => ({
+  display: "flex"
+}));
+const ContainerLogo = styled$1("div")(({ theme }) => ({
+  display: "flex",
+  width: "52px",
+  height: "52px",
+  borderRadius: "6px",
+  backgroundColor: theme.vars.palette.state?.active,
+  justifyContent: "center",
+  alignItems: "center",
+  boxShadow: `0px 4px 8px  ${alpha(theme.colorSchemes.finalTheme.palette.patronus?.coolGrey[70] || "", 0.16)}`,
+  "& .M4LImage-root": {
+    backgroundColor: theme.vars.palette.patronus?.marbleLight[10],
+    borderRadius: "6px"
+  }
+}));
+const CompanyName = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  width: "100%"
+}));
+const FormContent = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  padding: "12px",
+  margin: "auto 0",
+  width: "100%",
+  gap: "20px"
+}));
+const WrapperFormContent = styled$1("div")(() => ({
+  display: "flex",
+  width: "100%",
+  height: "100%",
+  overflow: "hidden"
+}));
+const ContainerModuleName = styled$1("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  width: "100%",
+  gap: "4px"
+}));
+const MobileContent = () => {
+  const {
+    children,
+    companyLogoSmallUrl
+  } = useBase();
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const {
+    name
+  } = useDomain();
+  return /* @__PURE__ */ jsxs(MobileContentRoot, {
+    children: [/* @__PURE__ */ jsxs(MobileBanner, {
+      children: [/* @__PURE__ */ jsx(ContainerLogo, {
+        children: /* @__PURE__ */ jsx(Image, {
+          src: companyLogoSmallUrl,
+          ratio: "1:1",
+          width: "44px",
+          height: "44px"
+        })
+      }), /* @__PURE__ */ jsxs(CompanyName, {
+        children: [/* @__PURE__ */ jsx(Typography, {
+          variant: "subtitleDens",
+          skeletonWidth: "70%",
+          skeletongHeight: "24px",
+          children: name
+        }), /* @__PURE__ */ jsx(Typography, {
+          variant: "paragraph",
+          skeletonWidth: "40%",
+          skeletongHeight: "20px",
+          children: getLabel("company_name_subtitle")
+        })]
+      }), /* @__PURE__ */ jsx(LanguagePopover, {})]
+    }), /* @__PURE__ */ jsx(WrapperFormContent, {
+      children: /* @__PURE__ */ jsx(ScrollBar, {
+        children: /* @__PURE__ */ jsxs(FormContent, {
+          children: [/* @__PURE__ */ jsxs(ContainerModuleName, {
+            children: [/* @__PURE__ */ jsx(Typography, {
+              variant: "h5",
+              skeletonWidth: "20%",
+              skeletongHeight: "36px",
+              children: getLabel("module_name")
+            }), /* @__PURE__ */ jsx(Typography, {
+              variant: "paragraph",
+              skeletonWidth: "40%",
+              skeletongHeight: "20px",
+              children: getLabel("module_description")
+            })]
+          }), children]
+        })
+      })
+    })]
+  });
+};
+const InnerModule = () => {
+  const {
+    getModuleLabel
+  } = useModuleDictionary();
+  const isDesktop = useResponsiveDesktop();
+  const {
+    subtitle
+  } = useBase();
+  return /* @__PURE__ */ jsx(HelmetPage, {
+    title: getModuleLabel(),
+    subtitle,
+    children: /* @__PURE__ */ jsx(Fragment, {
+      children: /* @__PURE__ */ jsx(InnerModuleRoot, {
+        id: "modulerootnouth",
+        children: isDesktop ? /* @__PURE__ */ jsx(DesktopContent, {}) : /* @__PURE__ */ jsx(MobileContent, {})
+      })
+    })
+  });
+};
+const NoAuthModuleLayout = (props) => {
+  const {
+    moduleId,
+    moduleNameField,
+    children,
+    componentsDictionary,
+    skeletonFlags,
+    subtitle,
+    companyLogoSmallUrl,
+    companyLogoNormalUrl,
+    moduleIlustrationUrl,
+    handleSetting,
+    observedDivRef
+  } = props;
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
+  const localeString = useLocales().currentLocale?.localeString;
+  const finalCompanyLogoNormalUrl = companyLogoNormalUrl || `${host_static_assets}/${environment_assets}/frontend/commons/assets/icons/logotipo_m4l.svg`;
+  const finalCompanyLogoSmallUrl = companyLogoSmallUrl || `${host_static_assets}/${environment_assets}/frontend/commons/assets/icons/isotipo_m4l.svg`;
+  const finalIllustrationUrl = moduleIlustrationUrl || `${host_static_assets}/${environment_assets}/frontend/domain/host/commons/assets/img/illustration_noauth.png`;
+  const finalSkeletonFlags = skeletonFlags;
+  if (finalSkeletonFlags.findIndex((f) => f === "dictionary_loaded") < 0) {
+    finalSkeletonFlags.push("dictionary_loaded");
+  }
+  return /* @__PURE__ */ jsx(BaseProvider, {
+    value: {
+      subtitle,
+      companyLogoSmallUrl: finalCompanyLogoSmallUrl,
+      companyLogoNormalUrl: finalCompanyLogoNormalUrl,
+      moduleIlustrationUrl: finalIllustrationUrl,
+      children,
+      handleSetting
+    },
+    children: /* @__PURE__ */ jsx(FlagsProvider, {
+      children: /* @__PURE__ */ jsx(ModuleDictionaryProvider, {
+        isAuth: false,
+        moduleId,
+        moduleNameField,
+        componentsDictionary,
+        currentLang: localeString,
+        children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, {
+          flags: finalSkeletonFlags,
+          children: /* @__PURE__ */ jsx(ResponsiveContainerProvider, {
+            observedDivRef,
+            children: /* @__PURE__ */ jsx(InnerModule, {})
+          })
+        })
+      })
+    })
+  });
+};
+function getNoAuthModuleLayoutComponentsDictionary() {
+  return ["no_auth_module_layout"];
+}
+const defaultNoAuthModuleLayoutDictionary = {
+  no_auth_module_layout: {}
+};
+export {
+  NoAuthModuleLayout as N,
+  defaultNoAuthModuleLayoutDictionary as d,
+  getNoAuthModuleLayoutComponentsDictionary as g
+};

package/layouts/NoAuthModuleLayout/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { NoAuthModuleLayoutProps } from './types';
+export declare const NoAuthModuleLayout: (props: NoAuthModuleLayoutProps) => import("react").JSX.Element;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const InnerModule: () => import("react").JSX.Element;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const InnerModuleRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const DesktopContent: () => import("react").JSX.Element;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/styles.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const DesktopContentRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DesktopBanner: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerLogo: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CompanyName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CompanyLeyend: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FormContent: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const WrapperFormContent: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerModuleName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContentForm: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const MobileContent: () => import("react").JSX.Element;

package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/styles.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export declare const MobileContentRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const MobileBanner: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerImageLanguage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerLogo: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CompanyName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FormContent: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const WrapperFormContent: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerModuleName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/layouts/NoAuthModuleLayout/types.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+export interface ContainerProps {
+    vertical: boolean;
+}
+export declare type MenuActionType = 'main' | 'allways' | 'normal';
+export declare interface NoAuthBaseProviderProps {
+    subtitle?: string;
+    companyLogoSmallUrl: string;
+    companyLogoNormalUrl: string;
+    moduleIlustrationUrl?: string;
+    children: ReactNode;
+    handleSetting?: () => void;
+}
+export interface NoAuthModuleLayoutProps extends NoAuthBaseProviderProps {
+    moduleId: string;
+    moduleNameField?: string;
+    componentsDictionary: string[];
+    skeletonFlags: string[];
+    observedDivRef: Element | Text | null;
+}

package/layouts/index.417b6868.js

@@ -0,0 +1 @@
+

package/layouts/index.d.ts

@@ -0,0 +1,6 @@
+export { ModuleLayout } from './ModuleLayout/ModuleLayout';
+export * from './ModuleLayout/dicctionary';
+export { MasterDetailLayout } from './MasterDetailLayout/MasterDetailLayout';
+export * from './MasterDetailLayout/dicctionary';
+export { NoAuthModuleLayout } from './NoAuthModuleLayout';
+export * from './NoAuthModuleLayout/dicctionary';

package/package.json

@@ -1,67 +1,34 @@
 {
   "name": "@m4l/layouts",
-  "private": false,
-  "version": "1.0.4",
+  "version": "1.0.5",
   "license": "UNLICENSED",
-  "scripts": {
-    "dev": "vite",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
-    "lint": "npx eslint src",
-    "lint:fix": "npm run lint -- --fix",
-    "prettier": "npx prettier src --check",
-    "prettier:fix": "npm run prettier -- --write",
-    "format": "npm run prettier:fix && npm run lint:fix"
-  },
+  "author": "M4L Team",
+  "private": false,
   "dependencies": {
-    "@m4l/components": "^0.0.4",
-    "react": "^17.0.0 || 18.x",
-    "react-dom": "^18.0.0"
-  },
-  "devDependencies": {
-    "@emotion/styled": "^11.9.3",
-    "@testing-library/react": "^13.3.0",
-    "@testing-library/user-event": "^14.2.1",
-    "@types/node": "^17.0.40",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.27.1",
-    "@typescript-eslint/parser": "^5.27.1",
-    "@vitejs/plugin-react": "^1.3.0",
-    "eslint": "^8.17.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-import-resolver-alias": "^1.1.2",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.30.0",
-    "eslint-plugin-react-hooks": "^4.5.0",
-    "eslint-plugin-unused-imports": "^2.0.0",
-    "prettier": "^2.6.2",
-    "rollup-plugin-terser": "^7.0.2",
-    "typescript": "^4.6.3",
-    "vite": "^2.9.9",
-    "vite-plugin-dts": "^1.2.0",
-    "vite-plugin-mkcert": "^1.6.4",
-    "vitest": "^0.17.1"
+    "@m4l/components": "*",
+    "@m4l/core": "*",
+    "@m4l/graphics": "*",
+    "@m4l/styles": "*",
+    "@mui/material": "5.15.19"
   },
   "peerDependencies": {
-    "react": "^17.0.0 || 18.x",
-    "react-dom": "^18.0.0",
-    "@m4l/components": "^0.0.4"
+    "@types/react": "^17.0.0 || ^18.0.0",
+    "@types/react-dom": "^17.0.0 || ^18.0.0",
+    "eventemitter3": "^4.0.7",
+    "history": "5.3.0",
+    "nprogress": "^0.2.0",
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0",
+    "react-toastify": "9.0.5"
   },
   "files": [
-    "dist"
+    "*"
   ],
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "source": "./index.js",
+  "main": "./index.js",
+  "module": "./index.js",
   "type": "module",
-  "exports": {
-    ".": {
-      "import": "./dist/index.js"
-    }
-  },
+  "types": "./index.d.ts",
   "sideEffects": false,
   "publishConfig": {
     "access": "public"
@@ -69,4 +36,4 @@
   "engines": {
     "node": ">=12.0.0"
   }
-}
+}

package/dist/hooks/useResponsive.d.ts

@@ -1,8 +0,0 @@
-import { Breakpoint } from '@mui/material';
-declare type Query = 'up' | 'down' | 'between' | 'only';
-declare type Key = Breakpoint | number;
-declare type Start = Breakpoint | number;
-declare type End = Breakpoint | number;
-export declare function useResponsive(query: Query, key?: Key, start?: Start, end?: End): boolean | undefined;
-export declare function useResponsiveDesktop(): boolean | undefined;
-export {};

package/dist/index.d.ts

@@ -1,2 +0,0 @@
-export * from './layouts';
-export * from './hooks';

package/dist/index.js

@@ -1,12 +0,0 @@
-export { a as MasterDetailLayout } from "./layouts/MasterDetailLayout/index.js";
-export { a as ModuleLayout } from "./layouts/ModuleLayout/index.js";
-export { u as useMasterDetail } from "./hooks/useMasterDetail/index.js";
-export { u as useModule } from "./hooks/useModule/index.js";
-import "react";
-import "@m4l/core";
-import "@m4l/components";
-import "react/jsx-runtime";
-import "./vendor.js";
-import "@mui/material/styles";
-import "@mui/material/useMediaQuery";
-import "@mui/material";

package/dist/layouts/MasterDetailLayout/components/ButtonDetail/index.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { ComponentActionProps } from '@m4l/components';
-export declare function ButtonDetail(props: ComponentActionProps): JSX.Element;