@m4l/layouts 7.0.0 → 7.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/@types/index.d.ts +7 -0
- package/components/MFHostApp/index.d.ts +9 -3
- package/components/MFHostApp/index.js +60 -0
- package/components/MFHostApp/types.d.ts +3 -4
- package/components/MFNoAuthApp/index.d.ts +8 -2
- package/components/MFNoAuthApp/index.js +39 -0
- package/components/MFWindowsTitle/MFWindowsTitle.d.ts +9 -3
- package/components/MFWindowsTitle/MFWindowsTitle.js +10 -0
- package/contexts/AuthContext/index.d.ts +10 -4
- package/contexts/AuthContext/{index-DARkRRM4.js → index.js} +26 -45
- package/contexts/AuthContext/types.d.ts +6 -6
- package/contexts/AuthContext/types.js +9 -0
- package/{m4l_layouts/types.d.ts → hooks/index.js} +1 -1
- package/hooks/useAuth/index.d.ts +8 -1
- package/hooks/useAuth/{index-8hAi3guc.js → index.js} +4 -2
- package/hooks/useMasterDetail/index.d.ts +1 -1
- package/hooks/useMasterDetail/{index-D4QUQYYc.js → index.js} +1 -1
- package/hooks/useModule/index.d.ts +8 -1
- package/hooks/useModule/index.js +12 -0
- package/index.js +17 -14
- package/layouts/MasterDetailLayout/MasterDetailLayout.d.ts +9 -3
- package/layouts/MasterDetailLayout/MasterDetailLayout.js +110 -0
- package/layouts/MasterDetailLayout/classes/constants.js +4 -0
- package/layouts/MasterDetailLayout/classes/index.d.ts +8 -1
- package/layouts/MasterDetailLayout/classes/index.js +23 -0
- package/layouts/MasterDetailLayout/classes/types.d.ts +3 -3
- package/layouts/MasterDetailLayout/components/ButtonDetail/index.d.ts +9 -0
- package/layouts/MasterDetailLayout/contexts/MasterDetailContext/index.d.ts +9 -3
- package/layouts/MasterDetailLayout/contexts/MasterDetailContext/index.js +28 -0
- package/layouts/MasterDetailLayout/contexts/MasterDetailContext/types.d.ts +1 -1
- package/layouts/MasterDetailLayout/dicctionary.d.ts +1 -1
- package/layouts/MasterDetailLayout/dicctionary.js +17 -0
- package/layouts/MasterDetailLayout/index.d.ts +2 -0
- package/layouts/MasterDetailLayout/styles.d.ts +1 -2
- package/layouts/MasterDetailLayout/styles.js +7 -0
- package/layouts/ModuleLayout/ModuleLayout.d.ts +2 -3
- package/layouts/ModuleLayout/ModuleLayout.js +21 -0
- package/layouts/ModuleLayout/classes/constants.js +4 -0
- package/layouts/ModuleLayout/classes/index.d.ts +7 -0
- package/layouts/ModuleLayout/classes/index.js +25 -0
- package/layouts/ModuleLayout/classes/types.d.ts +3 -3
- package/layouts/ModuleLayout/contexts/ModuleContext/index.d.ts +9 -3
- package/layouts/ModuleLayout/contexts/ModuleContext/index.js +38 -0
- package/layouts/ModuleLayout/contexts/ModuleContext/types.d.ts +1 -1
- package/layouts/ModuleLayout/dicctionary.d.ts +1 -1
- package/layouts/ModuleLayout/dicctionary.js +11 -0
- package/layouts/ModuleLayout/index.d.ts +2 -0
- package/layouts/ModuleLayout/subcomponents/InnerModule/index.d.ts +1 -2
- package/layouts/ModuleLayout/subcomponents/InnerModule/index.js +20 -0
- package/layouts/ModuleLayout/subcomponents/InnerModule/styles.d.ts +1 -2
- package/layouts/ModuleLayout/subcomponents/InnerModule/styles.js +7 -0
- package/layouts/ModuleLayout/subcomponents/InnerModule/types.d.ts +1 -1
- package/layouts/ModuleLayout/types.d.ts +4 -4
- package/layouts/NoAuthModuleLayout/dicctionary.d.ts +1 -1
- package/layouts/NoAuthModuleLayout/dicctionary.js +10 -0
- package/layouts/NoAuthModuleLayout/index.d.ts +8 -2
- package/layouts/NoAuthModuleLayout/index.js +55 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/index.d.ts +8 -2
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/index.js +16 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/styles.d.ts +1 -2
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/styles.js +15 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/index.d.ts +8 -2
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/index.js +49 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/styles.d.ts +9 -10
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/styles.js +115 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/index.d.ts +8 -2
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/index.js +45 -0
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/styles.d.ts +8 -9
- package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/MobileContent/styles.js +96 -0
- package/layouts/NoAuthModuleLayout/types.d.ts +1 -1
- package/layouts/index.js +1 -0
- package/package.json +33 -14
- package/test/setup.d.ts +0 -0
- package/test/utils.d.ts +12 -0
- package/vite-env.d.ts +3 -3
- package/components/MFHostApp/index-Bz3RUvvY.js +0 -90
- package/components/index-uQ5qk7MJ.js +0 -60
- package/hooks/useModule/index-FY5nsBmE.js +0 -10
- package/layouts/MasterDetailLayout/index-DeC4RoBs.js +0 -160
- package/layouts/ModuleLayout/index-DAtDuh6s.js +0 -129
- package/layouts/NoAuthModuleLayout/index-txgn4T5B.js +0 -419
- /package/{contexts/index-l0sNRNKZ.js → components/MFWindowsTitle/index.js} +0 -0
- /package/{hooks/index-l0sNRNKZ.js → components/index.js} +0 -0
- /package/{layouts/index-l0sNRNKZ.js → contexts/index.js} +0 -0
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ComponentActionProps } from '@m4l/components';
|
|
2
|
+
/**
|
|
3
|
+
* Botón de detalle
|
|
4
|
+
* @author Juan Escobar - automatic
|
|
5
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
6
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
7
|
+
* @updatedUser Juan Escobar - automatic
|
|
8
|
+
*/
|
|
9
|
+
export declare function ButtonDetail(props: ComponentActionProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { MasterDetailContextProps, MasterDetailProviderProps } from './types';
|
|
3
|
-
declare const MasterDetailContext: import(
|
|
4
|
-
|
|
2
|
+
declare const MasterDetailContext: import('react').Context<MasterDetailContextProps>;
|
|
3
|
+
/**
|
|
4
|
+
* Proveedor de contexto para el layout de maestro detalle
|
|
5
|
+
* @author Juan Escobar - automatic
|
|
6
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
7
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
8
|
+
* @updatedUser Juan Escobar - automatic
|
|
9
|
+
*/
|
|
10
|
+
declare function MasterDetailProvider(props: MasterDetailProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
11
|
export { MasterDetailProvider, MasterDetailContext };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { createContext, useState } from "react";
|
|
3
|
+
import { voidFunction } from "@m4l/core";
|
|
4
|
+
const initialState = {
|
|
5
|
+
masterSelection: void 0,
|
|
6
|
+
onChangeMasterSelection: voidFunction,
|
|
7
|
+
onClickViewDetail: voidFunction
|
|
8
|
+
};
|
|
9
|
+
const MasterDetailContext = createContext(initialState);
|
|
10
|
+
function MasterDetailProvider(props) {
|
|
11
|
+
const { children, onClickViewDetail } = props;
|
|
12
|
+
const [masterSelection, setMasterSelection] = useState(void 0);
|
|
13
|
+
return /* @__PURE__ */ jsx(
|
|
14
|
+
MasterDetailContext.Provider,
|
|
15
|
+
{
|
|
16
|
+
value: {
|
|
17
|
+
masterSelection,
|
|
18
|
+
onChangeMasterSelection: setMasterSelection,
|
|
19
|
+
onClickViewDetail
|
|
20
|
+
},
|
|
21
|
+
children
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
}
|
|
25
|
+
export {
|
|
26
|
+
MasterDetailContext as M,
|
|
27
|
+
MasterDetailProvider as a
|
|
28
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { g as getModuleLayoutComponentsDictionary } from "../ModuleLayout/dicctionary.js";
|
|
2
|
+
function getMasterDetailLayoutComponentsDictionary() {
|
|
3
|
+
return ["master_detail_layout"].concat(getModuleLayoutComponentsDictionary());
|
|
4
|
+
}
|
|
5
|
+
const defaultMasterDetailDictionary = {
|
|
6
|
+
master_detail_layout: {
|
|
7
|
+
split_vertical: "Split vertically",
|
|
8
|
+
split_horizontal: "Split horizontally",
|
|
9
|
+
no_split: "No split",
|
|
10
|
+
view_detail: "View detail"
|
|
11
|
+
}
|
|
12
|
+
//...defaultModuleLayoutDictionary,
|
|
13
|
+
};
|
|
14
|
+
export {
|
|
15
|
+
defaultMasterDetailDictionary as d,
|
|
16
|
+
getMasterDetailLayoutComponentsDictionary as g
|
|
17
|
+
};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const MasterDetailLayoutRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1
|
+
export declare const MasterDetailLayoutRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export declare const ModuleLayout: import("react").ForwardRefExoticComponent<ModuleLayoutProps & import("react").RefAttributes<ModuleLayoutRef>>;
|
|
1
|
+
import { ModuleLayoutProps, ModuleLayoutRef } from './types';
|
|
2
|
+
export declare const ModuleLayout: import('react').ForwardRefExoticComponent<ModuleLayoutProps & import('react').RefAttributes<ModuleLayoutRef>>;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { ModalProvider } from "@m4l/components";
|
|
3
|
+
import { forwardRef, useRef, useImperativeHandle } from "react";
|
|
4
|
+
import { I as InnerModule } from "./subcomponents/InnerModule/index.js";
|
|
5
|
+
import { a as ModuleProvider } from "./contexts/ModuleContext/index.js";
|
|
6
|
+
const ModuleLayout = forwardRef((props, ref) => {
|
|
7
|
+
const { moduleId, moduleActions, version, children } = props;
|
|
8
|
+
const moduleRef = useRef(null);
|
|
9
|
+
const openModal = (modalOpenProps) => {
|
|
10
|
+
moduleRef.current?.openModal(modalOpenProps);
|
|
11
|
+
};
|
|
12
|
+
useImperativeHandle(ref, () => ({
|
|
13
|
+
openModal,
|
|
14
|
+
current: moduleRef.current
|
|
15
|
+
}));
|
|
16
|
+
return /* @__PURE__ */ jsx(ModuleProvider, { moduleId, moduleActions, version, children: /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(InnerModule, { ref: moduleRef, children }) }) });
|
|
17
|
+
});
|
|
18
|
+
ModuleLayout.displayName = "ModuleLayout";
|
|
19
|
+
export {
|
|
20
|
+
ModuleLayout as M
|
|
21
|
+
};
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import { ModuleLayoutClassesType } from './types';
|
|
2
2
|
export declare const moduleLayoutClasses: ModuleLayoutClassesType;
|
|
3
3
|
export declare function getModuleLayoutUtilityClass(slot: string): string;
|
|
4
|
+
/**
|
|
5
|
+
* Hook para obtener las clases del componente ModuleLayout
|
|
6
|
+
* @author Juan Escobar - automatic
|
|
7
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
8
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
9
|
+
* @updatedUser Juan Escobar - automatic
|
|
10
|
+
*/
|
|
4
11
|
export declare const useModuleLayoutUtilityClasses: () => {
|
|
5
12
|
root: string;
|
|
6
13
|
moduleContent: string;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
|
|
2
|
+
import { unstable_composeClasses } from "@mui/base";
|
|
3
|
+
import { c as componentName } from "./constants.js";
|
|
4
|
+
generateUtilityClasses(componentName, [
|
|
5
|
+
/* elements */
|
|
6
|
+
"root",
|
|
7
|
+
"moduleContent"
|
|
8
|
+
/* states or variants of elements */
|
|
9
|
+
]);
|
|
10
|
+
function getModuleLayoutUtilityClass(slot) {
|
|
11
|
+
return generateUtilityClass(componentName, slot);
|
|
12
|
+
}
|
|
13
|
+
const useModuleLayoutUtilityClasses = () => {
|
|
14
|
+
const slots = {
|
|
15
|
+
root: ["root"],
|
|
16
|
+
moduleContent: ["moduleContent"]
|
|
17
|
+
};
|
|
18
|
+
const composedClasses = unstable_composeClasses(slots, getModuleLayoutUtilityClass, {});
|
|
19
|
+
return {
|
|
20
|
+
...composedClasses
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
export {
|
|
24
|
+
useModuleLayoutUtilityClasses as u
|
|
25
|
+
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { useModuleLayoutUtilityClasses } from
|
|
1
|
+
import { useModuleLayoutUtilityClasses } from '.';
|
|
2
2
|
export interface ModuleLayoutClassesType {
|
|
3
3
|
root: string;
|
|
4
4
|
moduleContent: string;
|
|
5
5
|
}
|
|
6
|
-
export
|
|
7
|
-
export
|
|
6
|
+
export type ModuleLayoutClassesKey = keyof ModuleLayoutClassesType;
|
|
7
|
+
export type Classes = ReturnType<typeof useModuleLayoutUtilityClasses>;
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ModuleLayoutContextProps, ModuleLayoutProviderProps } from './types';
|
|
3
|
-
declare const ModuleContext: import(
|
|
4
|
-
|
|
2
|
+
declare const ModuleContext: import('react').Context<ModuleLayoutContextProps | null>;
|
|
3
|
+
/**
|
|
4
|
+
* Proveedor de contexto para el layout de modulo
|
|
5
|
+
* @author Juan Escobar - automatic
|
|
6
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
7
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
8
|
+
* @updatedUser Juan Escobar - automatic
|
|
9
|
+
*/
|
|
10
|
+
declare function ModuleProvider(props: ModuleLayoutProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
11
|
export { ModuleProvider, ModuleContext };
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useWindowToolsMF } from "@m4l/components";
|
|
3
|
+
import { createContext, useState, useMemo, useEffect } from "react";
|
|
4
|
+
const ModuleContext = createContext(null);
|
|
5
|
+
function ModuleProvider(props) {
|
|
6
|
+
const { children, moduleActions, moduleId, version } = props;
|
|
7
|
+
const [configOptions] = useState(() => ({
|
|
8
|
+
moduleId,
|
|
9
|
+
dictionary: void 0
|
|
10
|
+
}));
|
|
11
|
+
const { setActions } = useWindowToolsMF();
|
|
12
|
+
const [dynamicActions, setDynamicActions] = useState([]);
|
|
13
|
+
const finalModuleActions = useMemo(() => {
|
|
14
|
+
return (moduleActions || []).concat(dynamicActions);
|
|
15
|
+
}, [moduleActions, dynamicActions]);
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
setActions(finalModuleActions, version);
|
|
18
|
+
}, [finalModuleActions]);
|
|
19
|
+
return /* @__PURE__ */ jsx(
|
|
20
|
+
ModuleContext.Provider,
|
|
21
|
+
{
|
|
22
|
+
value: {
|
|
23
|
+
// moduleActions: finalModuleActions,
|
|
24
|
+
// dynamicActions,
|
|
25
|
+
setDynamicActions,
|
|
26
|
+
moduleId: configOptions.moduleId
|
|
27
|
+
// moduleNameField: configOptions.moduleNameField,
|
|
28
|
+
// urlIcon: configOptions.urlIcon,
|
|
29
|
+
// breadcrumbLinks: configOptions.breadcrumbLinks,
|
|
30
|
+
},
|
|
31
|
+
children
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
}
|
|
35
|
+
export {
|
|
36
|
+
ModuleContext as M,
|
|
37
|
+
ModuleProvider as a
|
|
38
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { getModalDialogComponentsDictionary } from "@m4l/components";
|
|
2
|
+
function getModuleLayoutComponentsDictionary() {
|
|
3
|
+
return ["module_layout"].concat(getModalDialogComponentsDictionary());
|
|
4
|
+
}
|
|
5
|
+
const defaultModuleLayoutDictionary = {
|
|
6
|
+
module_layout: {}
|
|
7
|
+
};
|
|
8
|
+
export {
|
|
9
|
+
defaultModuleLayoutDictionary as d,
|
|
10
|
+
getModuleLayoutComponentsDictionary as g
|
|
11
|
+
};
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ModuleProps, ModuleRef } from './types';
|
|
3
|
-
export declare const InnerModule: import(
|
|
2
|
+
export declare const InnerModule: import('react').ForwardRefExoticComponent<ModuleProps & import('react').RefAttributes<ModuleRef>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef, useRef, useImperativeHandle } from "react";
|
|
3
|
+
import { I as InnerModuleRoot } from "./styles.js";
|
|
4
|
+
import { useModal } from "@m4l/components";
|
|
5
|
+
import { u as useModuleLayoutUtilityClasses } from "../../classes/index.js";
|
|
6
|
+
const InnerModule = forwardRef((props, ref) => {
|
|
7
|
+
const { children } = props;
|
|
8
|
+
const { openModal } = useModal();
|
|
9
|
+
const divRef = useRef(null);
|
|
10
|
+
useImperativeHandle(ref, () => ({
|
|
11
|
+
openModal,
|
|
12
|
+
current: divRef.current
|
|
13
|
+
}));
|
|
14
|
+
const classes = useModuleLayoutUtilityClasses();
|
|
15
|
+
return /* @__PURE__ */ jsx(InnerModuleRoot, { className: classes.root, ref: divRef, children: /* @__PURE__ */ jsx("div", { className: classes.moduleContent, children }) });
|
|
16
|
+
});
|
|
17
|
+
InnerModule.displayName = "InnerModule";
|
|
18
|
+
export {
|
|
19
|
+
InnerModule as I
|
|
20
|
+
};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const InnerModuleRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1
|
+
export declare const InnerModuleRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { ModalOpenOptions, ModuleAction } from '@m4l/components';
|
|
3
|
+
import { ModuleRef } from './subcomponents/InnerModule/types';
|
|
4
4
|
export interface ContainerProps {
|
|
5
5
|
vertical: boolean;
|
|
6
6
|
}
|
|
7
|
-
export
|
|
7
|
+
export type ModuleLayoutRef = {
|
|
8
8
|
openModal: (modalOpenProps: ModalOpenOptions) => void;
|
|
9
9
|
current: ModuleRef | null;
|
|
10
10
|
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
function getNoAuthModuleLayoutComponentsDictionary() {
|
|
2
|
+
return ["no_auth_module_layout"];
|
|
3
|
+
}
|
|
4
|
+
const defaultNoAuthModuleLayoutDictionary = {
|
|
5
|
+
no_auth_module_layout: {}
|
|
6
|
+
};
|
|
7
|
+
export {
|
|
8
|
+
defaultNoAuthModuleLayoutDictionary as d,
|
|
9
|
+
getNoAuthModuleLayoutComponentsDictionary as g
|
|
10
|
+
};
|
|
@@ -1,3 +1,9 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { NoAuthModuleLayoutProps } from './types';
|
|
3
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Layout de modulo sin autenticación
|
|
4
|
+
* @author Juan Escobar - automatic
|
|
5
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
6
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
7
|
+
* @updatedUser Juan Escobar - automatic
|
|
8
|
+
*/
|
|
9
|
+
export declare const NoAuthModuleLayout: (props: NoAuthModuleLayoutProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { I as InnerModule } from "./subcomponents/InnerModule/index.js";
|
|
3
|
+
import { useEnvironment, BaseProvider, FlagsProvider, ModuleDictionaryProvider, ModuleSkeletonProvider } from "@m4l/core";
|
|
4
|
+
import { useLocales, ResponsiveContainerProvider } from "@m4l/graphics";
|
|
5
|
+
const NoAuthModuleLayout = (props) => {
|
|
6
|
+
const {
|
|
7
|
+
moduleId,
|
|
8
|
+
moduleNameField,
|
|
9
|
+
children,
|
|
10
|
+
componentsDictionary,
|
|
11
|
+
skeletonFlags,
|
|
12
|
+
subtitle,
|
|
13
|
+
companyLogoSmallUrl,
|
|
14
|
+
companyLogoNormalUrl,
|
|
15
|
+
moduleIlustrationUrl,
|
|
16
|
+
handleSetting,
|
|
17
|
+
observedDivRef
|
|
18
|
+
} = props;
|
|
19
|
+
const { host_static_assets, environment_assets } = useEnvironment();
|
|
20
|
+
const localeString = useLocales().currentLocale?.localeString;
|
|
21
|
+
const finalCompanyLogoNormalUrl = companyLogoNormalUrl || `${host_static_assets}/${environment_assets}/frontend/commons/assets/icons/logotipo_m4l.svg`;
|
|
22
|
+
const finalCompanyLogoSmallUrl = companyLogoSmallUrl || `${host_static_assets}/${environment_assets}/frontend/commons/assets/icons/isotipo_m4l.svg`;
|
|
23
|
+
const finalIllustrationUrl = moduleIlustrationUrl || `${host_static_assets}/${environment_assets}/frontend/domain/host/commons/assets/img/illustration_noauth.png`;
|
|
24
|
+
const finalSkeletonFlags = skeletonFlags;
|
|
25
|
+
if (finalSkeletonFlags.findIndex((f) => f === "dictionary_loaded") < 0) {
|
|
26
|
+
finalSkeletonFlags.push("dictionary_loaded");
|
|
27
|
+
}
|
|
28
|
+
return /* @__PURE__ */ jsx(
|
|
29
|
+
BaseProvider,
|
|
30
|
+
{
|
|
31
|
+
value: {
|
|
32
|
+
subtitle,
|
|
33
|
+
companyLogoSmallUrl: finalCompanyLogoSmallUrl,
|
|
34
|
+
companyLogoNormalUrl: finalCompanyLogoNormalUrl,
|
|
35
|
+
moduleIlustrationUrl: finalIllustrationUrl,
|
|
36
|
+
children,
|
|
37
|
+
handleSetting
|
|
38
|
+
},
|
|
39
|
+
children: /* @__PURE__ */ jsx(FlagsProvider, { children: /* @__PURE__ */ jsx(
|
|
40
|
+
ModuleDictionaryProvider,
|
|
41
|
+
{
|
|
42
|
+
isAuth: false,
|
|
43
|
+
moduleId,
|
|
44
|
+
moduleNameField,
|
|
45
|
+
componentsDictionary,
|
|
46
|
+
currentLang: localeString,
|
|
47
|
+
children: /* @__PURE__ */ jsx(ModuleSkeletonProvider, { flags: finalSkeletonFlags, children: /* @__PURE__ */ jsx(ResponsiveContainerProvider, { observedDivRef, children: /* @__PURE__ */ jsx(InnerModule, {}) }) })
|
|
48
|
+
}
|
|
49
|
+
) })
|
|
50
|
+
}
|
|
51
|
+
);
|
|
52
|
+
};
|
|
53
|
+
export {
|
|
54
|
+
NoAuthModuleLayout as N
|
|
55
|
+
};
|
|
@@ -1,2 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Componente que contiene el contenido de la vista de escritorio/ móvil
|
|
3
|
+
* @author Juan Escobar - automatic
|
|
4
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
5
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
6
|
+
* @updatedUser Juan Escobar - automatic
|
|
7
|
+
*/
|
|
8
|
+
export declare const InnerModule: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useResponsiveDesktop } from "@m4l/graphics";
|
|
3
|
+
import { HelmetPage } from "@m4l/components";
|
|
4
|
+
import { I as InnerModuleRoot } from "./styles.js";
|
|
5
|
+
import { useModuleDictionary, useBase } from "@m4l/core";
|
|
6
|
+
import { D as DesktopContent } from "./subcomponents/DesktopContent/index.js";
|
|
7
|
+
import { M as MobileContent } from "./subcomponents/MobileContent/index.js";
|
|
8
|
+
const InnerModule = () => {
|
|
9
|
+
const { getModuleLabel } = useModuleDictionary();
|
|
10
|
+
const isDesktop = useResponsiveDesktop();
|
|
11
|
+
const { subtitle } = useBase();
|
|
12
|
+
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, {}) }) }) });
|
|
13
|
+
};
|
|
14
|
+
export {
|
|
15
|
+
InnerModule as I
|
|
16
|
+
};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const InnerModuleRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1
|
+
export declare const InnerModuleRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { styled } from "@mui/material";
|
|
2
|
+
const InnerModuleRoot = styled("div")(({ theme }) => ({
|
|
3
|
+
display: "flex",
|
|
4
|
+
justifyContent: "center",
|
|
5
|
+
alignItems: "center",
|
|
6
|
+
height: "100vh",
|
|
7
|
+
padding: "20px",
|
|
8
|
+
backgroundColor: theme.vars.palette.background.neutral,
|
|
9
|
+
[theme.breakpoints.down("md")]: {
|
|
10
|
+
padding: "0px"
|
|
11
|
+
}
|
|
12
|
+
}));
|
|
13
|
+
export {
|
|
14
|
+
InnerModuleRoot as I
|
|
15
|
+
};
|
package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/index.d.ts
CHANGED
|
@@ -1,2 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Componente que contiene el contenido de la vista de escritorio
|
|
3
|
+
* @author Juan Escobar - automatic
|
|
4
|
+
* @createdAt 2024-10-09 19:56:26 - automatic
|
|
5
|
+
* @updatedAt 2024-10-09 20:00:30 - automatic
|
|
6
|
+
* @updatedUser Juan Escobar - automatic
|
|
7
|
+
*/
|
|
8
|
+
export declare const DesktopContent: () => import("react/jsx-runtime").JSX.Element;
|
package/layouts/NoAuthModuleLayout/subcomponents/InnerModule/subcomponents/DesktopContent/index.js
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { LanguagePopover, Image, Typography, Stack, ScrollBar } from "@m4l/components";
|
|
3
|
+
import { D as DesktopContentRoot, a as DesktopBanner, C as ContainerLogo, b as CompanyName, c as CompanyLeyend, W as WrapperFormContent, F as FormContent, d as ContainerModuleName } from "./styles.js";
|
|
4
|
+
import { useBase, useModuleDictionary, useDomain } from "@m4l/core";
|
|
5
|
+
const DesktopContent = () => {
|
|
6
|
+
const { children, companyLogoSmallUrl } = useBase();
|
|
7
|
+
const { getLabel } = useModuleDictionary();
|
|
8
|
+
const { name, slogan } = useDomain();
|
|
9
|
+
return /* @__PURE__ */ jsxs(DesktopContentRoot, { children: [
|
|
10
|
+
/* @__PURE__ */ jsx(LanguagePopover, {}),
|
|
11
|
+
/* @__PURE__ */ jsxs(DesktopBanner, { children: [
|
|
12
|
+
/* @__PURE__ */ jsx(ContainerLogo, { children: /* @__PURE__ */ jsx(Image, { src: companyLogoSmallUrl, ratio: "1:1", width: "64px", height: "64px" }) }),
|
|
13
|
+
/* @__PURE__ */ jsxs(CompanyName, { children: [
|
|
14
|
+
/* @__PURE__ */ jsx(
|
|
15
|
+
Typography,
|
|
16
|
+
{
|
|
17
|
+
variant: "subtitleDens",
|
|
18
|
+
skeletonWidth: "70%",
|
|
19
|
+
skeletonHeight: "24px",
|
|
20
|
+
children: name
|
|
21
|
+
}
|
|
22
|
+
),
|
|
23
|
+
/* @__PURE__ */ jsx(Typography, { variant: "paragraph", skeletonWidth: "40%", skeletonHeight: "20px", children: getLabel("company_name_subtitle") })
|
|
24
|
+
] }),
|
|
25
|
+
/* @__PURE__ */ jsxs(CompanyLeyend, { children: [
|
|
26
|
+
/* @__PURE__ */ jsx(Typography, { variant: "h5", skeletonWidth: "50%", skeletonHeight: "36px", children: getLabel("module_leyend") }),
|
|
27
|
+
/* @__PURE__ */ jsx(Typography, { variant: "subtitle", skeletonWidth: "80%", skeletonHeight: "24px", children: slogan })
|
|
28
|
+
] })
|
|
29
|
+
] }),
|
|
30
|
+
/* @__PURE__ */ jsx(WrapperFormContent, { children: /* @__PURE__ */ jsxs(FormContent, { children: [
|
|
31
|
+
/* @__PURE__ */ jsxs(ContainerModuleName, { children: [
|
|
32
|
+
/* @__PURE__ */ jsx(Typography, { variant: "h5", skeletonWidth: "20%", skeletonHeight: "36px", children: getLabel("module_name") }),
|
|
33
|
+
/* @__PURE__ */ jsx(
|
|
34
|
+
Typography,
|
|
35
|
+
{
|
|
36
|
+
variant: "paragraph",
|
|
37
|
+
skeletonWidth: "40%",
|
|
38
|
+
skeletonHeight: "20px",
|
|
39
|
+
children: getLabel("module_description")
|
|
40
|
+
}
|
|
41
|
+
)
|
|
42
|
+
] }),
|
|
43
|
+
/* @__PURE__ */ jsx(Stack, { direction: "column", height: "auto", children: /* @__PURE__ */ jsx(ScrollBar, { children: /* @__PURE__ */ jsx(Fragment, { children }) }) })
|
|
44
|
+
] }) })
|
|
45
|
+
] });
|
|
46
|
+
};
|
|
47
|
+
export {
|
|
48
|
+
DesktopContent as D
|
|
49
|
+
};
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const
|
|
3
|
-
export declare const
|
|
4
|
-
export declare const
|
|
5
|
-
export declare const
|
|
6
|
-
export declare const
|
|
7
|
-
export declare const
|
|
8
|
-
export declare const
|
|
9
|
-
export declare const
|
|
10
|
-
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>, {}>;
|
|
1
|
+
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>, {}>;
|
|
2
|
+
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>, {}>;
|
|
3
|
+
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>, {}>;
|
|
4
|
+
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>, {}>;
|
|
5
|
+
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>, {}>;
|
|
6
|
+
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>, {}>;
|
|
7
|
+
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>, {}>;
|
|
8
|
+
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>, {}>;
|
|
9
|
+
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>, {}>;
|