@m4l/layouts 9.1.9 → 9.1.10-beta.1

package/components/ModuleDetailTabs/useModuleDatailTabs.js

@@ -0,0 +1,86 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useMemo, useEffect } from "react";
+import { u as useMasterDetail } from "../../hooks/useMasterDetail/index.js";
+import { useModuleDictionary, useNetwork } from "@m4l/core";
+import { useWindowToolsMF, ObjectLogs, Icon } from "@m4l/components";
+function useModuleDetailTabs(props) {
+  const { tabs, defaultTab, urlAssetsPrefix, objectLogsProps, getEndPoint } = props;
+  const [currentTab, setCurrentTab] = useState(defaultTab);
+  const [detailData, setDetailData] = useState(void 0);
+  const [endPointData, setEndPointData] = useState(void 0);
+  const [hasPrivilegeDetail, setHasPrivilegeDetail] = useState(true);
+  const { masterSelection } = useMasterDetail();
+  const { getLabel } = useModuleDictionary();
+  const { startProgress, stopProgress } = useWindowToolsMF();
+  const { networkOperation } = useNetwork();
+  const handleChangeTab = (newValue) => {
+    setCurrentTab(newValue);
+  };
+  const finalTabs = useMemo(() => {
+    if (masterSelection === void 0 || masterSelection.length === 0) {
+      return [];
+    }
+    const arrTabs = [...tabs];
+    if (objectLogsProps) {
+      arrTabs.push({
+        ...objectLogsProps,
+        value: "objectLogs",
+        tabContent: ObjectLogs,
+        unmountable: false,
+        componentProps: {
+          resourceId: objectLogsProps.resourceId.toString(),
+          objectId: objectLogsProps.getObjectId(masterSelection[0])
+        }
+      });
+    }
+    return arrTabs.map((tab) => ({
+      ...tab,
+      unmountable: tab.unmountable === void 0 ? true : tab.unmountable,
+      icon: typeof tab.icon === "string" ? /* @__PURE__ */ jsx(Icon, { src: `${urlAssetsPrefix}/${tab.icon}` }) : tab.icon,
+      label: tab.dictionaryId ? getLabel(tab.dictionaryId) : void 0
+    }));
+  }, [masterSelection, tabs, objectLogsProps, urlAssetsPrefix, getLabel]);
+  useEffect(() => {
+    if (masterSelection === void 0 || masterSelection.length === 0) {
+      return;
+    }
+    setDetailData(masterSelection[0]);
+  }, [masterSelection]);
+  const conditionNoMasterSelection = masterSelection === void 0 || masterSelection.length === 0;
+  useEffect(() => {
+    if (!getEndPoint) {
+      return;
+    }
+    if (masterSelection === void 0 || masterSelection.length === 0) {
+      return;
+    }
+    networkOperation({
+      options: {
+        startProgress,
+        stopProgress
+      },
+      ...getEndPoint(masterSelection[masterSelection.length - 1])
+    }).then((response) => {
+      {
+        setHasPrivilegeDetail(true);
+        setEndPointData(response);
+      }
+    }).catch((error) => {
+      if (error.status === 403) {
+        setHasPrivilegeDetail(false);
+      }
+    });
+  }, [masterSelection, startProgress, stopProgress, networkOperation, getEndPoint]);
+  return {
+    conditionNoMasterSelection,
+    currentTab,
+    detailData,
+    endPointData,
+    hasPrivilegeDetail,
+    finalTabs,
+    handleChangeTab
+  };
+}
+export {
+  useModuleDetailTabs as u
+};

package/components/index.d.ts

@@ -1,3 +1,4 @@
 export { MFNoAuthApp } from './MFNoAuthApp';
-export { MFHostApp } from './MFHostApp';
-export type { ByHostProps } from './MFHostApp/types';
+export { MFHostApp } from './MFHostApp/MFHostApp';
+export * from './MFHostApp';
+export * from './ModuleDetailTabs';

package/hooks/index.d.ts

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

package/hooks/useDynamicAccordions/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useDynamicAccordions';
+export type { useDynamicAccordionsProps, ConfigDynamicAccordion as DynamicAccordion, DynamicAccordionValue } from './types';

package/hooks/useDynamicAccordions/index.js

@@ -0,0 +1 @@
+

package/hooks/useDynamicAccordions/types.d.ts

@@ -0,0 +1,42 @@
+import { AccordionProps } from '@m4l/components';
+import { ModuleDetailTabContent } from '../../components/ModuleDetailTabs';
+export type DynamicAccordionValue<T extends any = any, K extends any = any> = (data: T, endPointData?: K) => string | React.ReactNode;
+export interface ConfigDynamicAccordion<T extends any = any, K extends any = any> {
+    /**
+     * "icon": Icono de la propiedad
+     */
+    icon?: string;
+    /**
+     * "dictionaryId": Id de la propiedad en el diccionario para mostrar en el label
+     */
+    dictionaryId: string;
+    /**
+     * "accordionProps" Propiedades del accordion
+     */
+    accordionProps?: AccordionProps['accordionProps'];
+    /**
+     * "properties": Propiedades que se ven en el accordion
+     */
+    properties: {
+        /**
+         * "icon": Icono de la propiedad
+         */
+        icon?: string | React.ReactNode;
+        /**
+         * "dictionaryId": Id de la propiedad en el diccionario para mostrar en el label
+         */
+        dictionaryId: string;
+        /**
+         * "getValue": Función que se encarga de obtener el valor de la propiedad
+         */
+        getValue: DynamicAccordionValue<T, K>;
+        /**
+         * "privilegeToView": Si se requiere un privilegio para ver el valor
+         */
+        privilegeToView?: string;
+    }[];
+}
+export interface useDynamicAccordionsProps<T extends any = any, K extends any = any> {
+    configDynamicAccordions: ConfigDynamicAccordion<T, K>[];
+}
+export type useBaseDynamicAccordionsProps<T extends any = any, K extends any = any> = useDynamicAccordionsProps<T, K> & ModuleDetailTabContent;

package/hooks/useDynamicAccordions/useBaseAccordions.d.ts

@@ -0,0 +1,5 @@
+import { useBaseDynamicAccordionsProps } from './types';
+/**
+ * Hook que se encarga de gestionar los accordions del detalle de inventario
+ */
+export declare function useBaseAccordions(props: useBaseDynamicAccordionsProps): import("react/jsx-runtime").JSX.Element[];

package/hooks/useDynamicAccordions/useBaseAccordions.js

@@ -0,0 +1,38 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Accordion, PropertyValue } from "@m4l/components";
+import { useModuleDictionary } from "@m4l/core";
+function useBaseAccordions(props) {
+  const { data, endPointData, configDynamicAccordions: accordions } = props;
+  const { getLabel } = useModuleDictionary();
+  const AccordionsComponents = useMemo(() => {
+    return accordions.map((accordion) => {
+      return /* @__PURE__ */ jsx(
+        Accordion,
+        {
+          icon: accordion.icon,
+          label: getLabel(accordion.dictionaryId),
+          accordionProps: {
+            ...accordion.accordionProps
+          },
+          children: accordion.properties.map((property) => {
+            const value = property.getValue(data, endPointData);
+            return value ? /* @__PURE__ */ jsx(
+              PropertyValue,
+              {
+                property: getLabel(property.dictionaryId),
+                value
+              },
+              property.dictionaryId
+            ) : null;
+          })
+        },
+        accordion.dictionaryId
+      );
+    });
+  }, [accordions, data, endPointData, getLabel]);
+  return AccordionsComponents;
+}
+export {
+  useBaseAccordions as u
+};

package/hooks/useDynamicAccordions/useDynamicAccordions.d.ts

@@ -0,0 +1,6 @@
+import { ModuleDetailTabContent } from '../../components/ModuleDetailTabs';
+import { useDynamicAccordionsProps } from './types';
+/**
+ * Componente que muestra los datos generales de un inventario
+ */
+export declare function useDynamicAccordions(props: useDynamicAccordionsProps): (propsGeneral: ModuleDetailTabContent) => import("react/jsx-runtime").JSX.Element;

package/hooks/useDynamicAccordions/useDynamicAccordions.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+import { ScrollBar, Stack } from "@m4l/components";
+import { u as useBaseAccordions } from "./useBaseAccordions.js";
+function useDynamicAccordions(props) {
+  const { configDynamicAccordions } = props;
+  return function General(propsGeneral) {
+    const { data, endPointData } = propsGeneral;
+    const accordionsComponents = useBaseAccordions({
+      data,
+      endPointData,
+      configDynamicAccordions
+    });
+    return /* @__PURE__ */ jsx(ScrollBar, { children: /* @__PURE__ */ jsx(Stack, { direction: "column", gap: "4px", style: { height: "auto" }, children: accordionsComponents }) });
+  };
+}
+export {
+  useDynamicAccordions as u
+};

package/hooks/useMasterDetail/index.d.ts

@@ -1 +1 @@
-export declare const useMasterDetail: () => import('../../layouts/MasterDetailLayout/contexts/MasterDetailContext/types').MasterDetailContextProps;
+export declare const useMasterDetail: () => import('../..').MasterDetailContextProps;

package/index.d.ts

@@ -2,3 +2,4 @@ export * from './components';
 export * from './contexts';
 export * from './layouts';
 export * from './hooks';
+export * from './utils';

package/index.js

@@ -1,30 +1,35 @@
 import { M } from "./components/MFNoAuthApp/index.js";
-import { M as M2 } from "./components/MFHostApp/index.js";
+import { M as M2 } from "./components/MFHostApp/MFHostApp.js";
+import { M as M3 } from "./components/ModuleDetailTabs/ModuleDetailTabs.js";
 import { A, a } from "./contexts/AuthContext/index.js";
-import { M as M3 } from "./layouts/ModuleLayout/ModuleLayout.js";
-import { M as M4 } from "./layouts/MasterDetailLayout/MasterDetailLayout.js";
+import { M as M4 } from "./layouts/ModuleLayout/ModuleLayout.js";
 import { N } from "./layouts/NoAuthModuleLayout/index.js";
 import { d, g } from "./layouts/ModuleLayout/dicctionary.js";
-import { d as d2, g as g2 } from "./layouts/MasterDetailLayout/dicctionary.js";
-import { d as d3, g as g3 } from "./layouts/NoAuthModuleLayout/dicctionary.js";
+import { M as M5 } from "./layouts/MasterDetailLayout/MasterDetailLayout.js";
+import { g as g2 } from "./layouts/MasterDetailLayout/dicctionary.js";
+import { d as d2, g as g3 } from "./layouts/NoAuthModuleLayout/dicctionary.js";
 import { u } from "./hooks/useMasterDetail/index.js";
 import { u as u2 } from "./hooks/useAuth/index.js";
 import { u as u3 } from "./hooks/useModule/index.js";
+import { u as u4 } from "./hooks/useDynamicAccordions/useDynamicAccordions.js";
+import { c } from "./utils/createAppMF.js";
 export {
   A as AuthContext,
   a as AuthProvider,
   M2 as MFHostApp,
   M as MFNoAuthApp,
-  M4 as MasterDetailLayout,
-  M3 as ModuleLayout,
+  M5 as MasterDetailLayout,
+  M3 as ModuleDetailTabs,
+  M4 as ModuleLayout,
   N as NoAuthModuleLayout,
-  d2 as defaultMasterDetailDictionary,
+  c as createAppMF,
   d as defaultModuleLayoutDictionary,
-  d3 as defaultNoAuthModuleLayoutDictionary,
+  d2 as defaultNoAuthModuleLayoutDictionary,
   g2 as getMasterDetailLayoutComponentsDictionary,
   g as getModuleLayoutComponentsDictionary,
   g3 as getNoAuthModuleLayoutComponentsDictionary,
   u2 as useAuth,
+  u4 as useDynamicAccordions,
   u as useMasterDetail,
   u3 as useModule
 };

package/layouts/MasterDetailLayout/MasterDetailLayout.js

@@ -4,7 +4,7 @@ import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { WindowBase, SplitLayout } from "@m4l/components";
 import { M as ModuleLayout } from "../ModuleLayout/ModuleLayout.js";
 import { a as MasterDetailProvider } from "./contexts/MasterDetailContext/index.js";
-import { useResponsiveDesktop } from "@m4l/graphics";
+import { useIsMobile } from "@m4l/graphics";
 import { g as getMasterDetailLayoutUtilityClasses } from "./classes/index.js";
 import { M as MasterDetailLayoutRoot } from "./styles.js";
 function getTotalModuleActions(splitActions, moduleActions = []) {
@@ -23,7 +23,7 @@ function MasterDetailLayout(props) {
   } = props;
   const { host_static_assets, environment_assets } = useEnvironment();
   const [splitPosition, setSplitPosition] = useState("vertical");
-  const isDesktop = useResponsiveDesktop();
+  const isMobile = useIsMobile();
   const moduleLayoutRef = useRef(null);
   const { getLabel } = useModuleDictionary();
   const onChangePostionInternal = useCallback((newPostion) => {
@@ -32,7 +32,6 @@ function MasterDetailLayout(props) {
   const splitActions = useMemo(
     () => [
       {
-        type: "menuItem",
         iconUrl: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/split_vertical.svg`,
         onClick: () => onChangePostionInternal("vertical"),
         visibility: "main",
@@ -43,7 +42,6 @@ function MasterDetailLayout(props) {
         key: "vertical"
       },
       {
-        type: "menuItem",
         iconUrl: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/split_horizontal.svg`,
         onClick: () => onChangePostionInternal("horizontal"),
         visibility: "main",
@@ -54,7 +52,6 @@ function MasterDetailLayout(props) {
         key: "horizontal"
       },
       {
-        type: "menuItem",
         iconUrl: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/no_split.svg`,
         onClick: () => onChangePostionInternal("none"),
         visibility: "main",
@@ -75,6 +72,9 @@ function MasterDetailLayout(props) {
         WindowBase,
         {
           title: getLabel("master_detail_layout.view_detail"),
+          onClose: () => {
+            moduleLayoutRef.current?.closeModal();
+          },
           children: typeof detailComponent === "function" ? detailComponent({}) : detailComponent
         }
       )
@@ -99,7 +99,7 @@ function MasterDetailLayout(props) {
       children: /* @__PURE__ */ jsx(
         SplitLayout,
         {
-          splitPosition: isDesktop ? splitPosition : "none",
+          splitPosition: isMobile ? "none" : splitPosition,
           firstPart: masterComponent,
           secondPart: detailComponent
         }

package/layouts/MasterDetailLayout/dicctionary.js

@@ -1,17 +1,8 @@
 import { g as getModuleLayoutComponentsDictionary } from "../ModuleLayout/dicctionary.js";
+import { getNoItemSelectedComponentsDictionary } from "@m4l/components";
 function getMasterDetailLayoutComponentsDictionary() {
-  return ["master_detail_layout"].concat(getModuleLayoutComponentsDictionary());
+  return ["master_detail_layout"].concat(getModuleLayoutComponentsDictionary()).concat(getNoItemSelectedComponentsDictionary());
 }
-const defaultMasterDetailDictionary = {
-  master_detail_layout: {
-    split_vertical: "Split vertically",
-    split_horizontal: "Split horizontally",
-    no_split: "No split",
-    view_detail: "View detail"
-  }
-  //...defaultModuleLayoutDictionary,
-};
 export {
-  defaultMasterDetailDictionary as d,
   getMasterDetailLayoutComponentsDictionary as g
 };

package/layouts/MasterDetailLayout/index.d.ts

@@ -1,2 +1,4 @@
 export { MasterDetailLayout } from './MasterDetailLayout';
 export type { MasterDetailLayoutProps } from './types';
+export type { MasterDetailContextProps } from './contexts/MasterDetailContext/types';
+export { getMasterDetailLayoutComponentsDictionary } from './dicctionary';

package/layouts/MasterDetailLayout/index.js

@@ -0,0 +1 @@
+

package/layouts/ModuleLayout/ModuleLayout.js

@@ -6,11 +6,15 @@ import { a as ModuleProvider } from "./contexts/ModuleContext/index.js";
 const ModuleLayout = forwardRef((props, ref) => {
   const { moduleId, moduleActions, version, children } = props;
   const moduleRef = useRef(null);
+  const closeModal = () => {
+    moduleRef.current?.closeModal();
+  };
   const openModal = (modalOpenProps) => {
     moduleRef.current?.openModal(modalOpenProps);
   };
   useImperativeHandle(ref, () => ({
     openModal,
+    closeModal,
     current: moduleRef.current
   }));
   return /* @__PURE__ */ jsx(ModuleProvider, { moduleId, moduleActions, version, children: /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(BaseModuleLayout, { ref: moduleRef, children }) }) });

package/layouts/ModuleLayout/slots/ModuleLayoutSlots.d.ts

@@ -1 +1 @@
-export declare const ModuleLayoutRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ModuleLayoutRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

package/layouts/ModuleLayout/subcomponents/BaseModuleLayout/index.js

@@ -5,10 +5,11 @@ import { M as ModuleLayoutRootStyled } from "../../slots/ModuleLayoutSlots.js";
 import { M as MODULE_LAYOUT_KEY } from "../../constants.js";
 const BaseModuleLayout = forwardRef((props, ref) => {
   const { children } = props;
-  const { openModal } = useModal();
+  const { openModal, closeModal } = useModal();
   const divRef = useRef(null);
   useImperativeHandle(ref, () => ({
     openModal,
+    closeModal,
     current: divRef.current
   }));
   const classRoot = getComponentSlotRoot(MODULE_LAYOUT_KEY);

package/layouts/ModuleLayout/subcomponents/BaseModuleLayout/types.d.ts

@@ -2,6 +2,7 @@ import { ReactNode } from 'react';
 import { ModalOpenOptions } from '@m4l/components';
 export type ModuleRef = {
     openModal: (modalOpenProps: ModalOpenOptions) => void;
+    closeModal: () => void;
     current: HTMLDivElement | null;
 };
 export interface ModuleProps {

package/layouts/ModuleLayout/types.d.ts

@@ -10,6 +10,7 @@ export interface ContainerProps {
 }
 export type ModuleLayoutRef = {
     openModal: (modalOpenProps: ModalOpenOptions) => void;
+    closeModal: () => void;
     current: ModuleRef | null;
 };
 export interface ModuleLayoutProps {

package/layouts/NoAuthModuleLayout/slots/NoAuthModuleLayoutSlots.d.ts

@@ -1,19 +1,19 @@
-export declare const BaseNoAuthModuleLayoutRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const MobileContentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const MobileBannerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContainerImageLanguageStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContainerLogoStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const CompanyNameStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const FormContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const WrapperFormContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContainerModuleNameStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const DesktopContentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const DesktopBannerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContainerLogoDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const CompanyNameDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const CompanyLeyendDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const FormContentDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const WrapperFormContentDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContainerModuleNameDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContentFormDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const BaseNoAuthModuleLayoutRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const MobileContentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const MobileBannerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContainerImageLanguageStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContainerLogoStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const CompanyNameStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const FormContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const WrapperFormContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContainerModuleNameStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const DesktopContentRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const DesktopBannerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContainerLogoDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const CompanyNameDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const CompanyLeyendDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const FormContentDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const WrapperFormContentDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContainerModuleNameDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContentFormDesktopStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const TypographyBannerStyled: import('@emotion/styled').StyledComponent<Pick<import('@m4l/components/src/components/mui_extended/Typography/types').TypographyProps, keyof import('@m4l/components/src/components/mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, {}, {}>;

package/layouts/index.d.ts

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

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@m4l/layouts",
-  "version": "9.1.9",
+  "version": "9.1.10-beta.1",
   "license": "UNLICENSED",
   "author": "M4L Team",
   "lint-staged": {
     "*.{js,ts,tsx}": "eslint --fix --max-warnings 0"
   },
   "peerDependencies": {
-    "@m4l/components": "^9.1.140",
+    "@m4l/components": "^9.2.15-beta.2",
     "@m4l/core": "^2.0.0",
     "@m4l/graphics": "^7.0.0",
     "@m4l/styles": "^7.0.0"
@@ -45,10 +45,6 @@
     "node": ">=12.0.0"
   },
   "packageManager": "yarn@4.5.0",
-  "dependencies": {
-    "cross-fetch": "^4.1.0",
-    "storybook-multilevel-sort": "^2.0.1"
-  },
   "private": false,
   "exports": {
     ".": {

package/storybook/layouts/ModuleLayout/ModuleLayout.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { AreasAdmin, PaperForm } from '@m4l/components';
+declare const meta: Meta<typeof AreasAdmin>;
+type Story = StoryObj<typeof PaperForm>;
+export declare const Default: Story;
+export default meta;

package/storybook/layouts/ModuleLayout/moks/mokData.d.ts

@@ -0,0 +1,14 @@
+export declare const MOCK_CLIENTS: {
+    nombre: string;
+    correo: string;
+    telefono: string;
+    direccion: string;
+    ciudad: string;
+}[];
+export declare const MOCK_USERS: {
+    nombre: string;
+    apellido: string;
+    email: string;
+    telefono: string;
+    activo: boolean;
+}[];

package/storybook/layouts/ModuleLayout/subcomponents/ClientsHeaderActions.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Componente que define las acciones del header para "clientes"
+ */
+export declare function ClientsHeaderActions(): import("react/jsx-runtime").JSX.Element;

package/storybook/layouts/ModuleLayout/subcomponents/RenderModuleLayout.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Render para utilizar el componente ModuleLayout
+ * en AreasViewer en el storybook
+ */
+declare const RenderModuleLayout: () => import("react/jsx-runtime").JSX.Element;
+export default RenderModuleLayout;

package/storybook/layouts/ModuleLayout/subcomponents/UsersHeaderActions.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Componente que define las acciones del header para "usuarios"
+ */
+export declare function UsersHeaderActions(): import("react/jsx-runtime").JSX.Element;

package/storybook/layouts/ModuleLayout/subcomponents/WithExtendedContainer.d.ts

@@ -0,0 +1,5 @@
+import { StoryContext, StoryFn } from '@storybook/react';
+/**
+ * con contenedor extendido
+ */
+export declare const WithExtendedContainer: (MyStory: StoryFn, context: StoryContext) => import("react/jsx-runtime").JSX.Element;

package/storybook/layouts/NoAuthModuleLayout/NoAuthModuleLayout.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, StoryObj } from '@storybook/react/*';
+import { NoAuthModuleLayout } from '../../../src/layouts/NoAuthModuleLayout/index';
+declare const meta: Meta<typeof NoAuthModuleLayout>;
+type Story = StoryObj<typeof NoAuthModuleLayout>;
+/**
+ * NoAuthModuleLayout component por defecto con el logo de la compañía.
+ */
+export declare const Default: Story;
+export default meta;

package/utils/createAppMF.d.ts

@@ -0,0 +1,13 @@
+export type CreateAppMFProps = {
+    prefixMF: string;
+    moduleId: string;
+    App: () => JSX.Element;
+    privileges: string[];
+    appVersion: string;
+    componentsDictionary: string[];
+    skeletonFlags: string[];
+};
+/**
+ * Create a new app for a microfrontend
+ */
+export declare function createAppMF(props: CreateAppMFProps): void;