@m4l/components 0.2.25 → 0.2.27

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.
Files changed (161) hide show
  1. package/@types/export.d.ts +3 -0
  2. package/components/AccountPopover/{index.505e278a.js → index.3994a80b.js} +2 -2
  3. package/components/AppBar/{index.7106417d.js → index.23323f96.js} +3 -4
  4. package/components/CommonActions/components/ActionCancel/{index.de862adf.js → index.bd767c14.js} +2 -2
  5. package/components/CommonActions/components/ActionFormCancel/{index.3fd5c858.js → index.d737bddc.js} +4 -4
  6. package/components/CommonActions/components/ActionFormIntro/{index.07394f62.js → index.d5b80747.js} +2 -2
  7. package/components/CommonActions/components/ActionIntro/{index.79fc2386.js → index.9bd56cd0.js} +2 -2
  8. package/components/CommonActions/components/Actions/{index.2f6286eb.js → index.16946bfd.js} +12 -13
  9. package/components/DataGrid/formatters/ColumnBooleanFormatter/{index.36270dd1.js → index.29cf6542.js} +1 -1
  10. package/components/DataGrid/formatters/ColumnConcatenatedValueFormatter/{index.8b008692.js → index.2c4fd22e.js} +1 -1
  11. package/components/DataGrid/formatters/ColumnInteractiveCheckFormatter/{index.cb308086.js → index.e30c976f.js} +1 -1
  12. package/components/DataGrid/formatters/ColumnPointsFormatter/{index.f3d6036f.js → index.4335c26b.js} +1 -1
  13. package/components/DataGrid/{index.b1eafce1.js → index.a3792770.js} +4 -5
  14. package/components/DataGrid/subcomponents/Actions/{index.9af87fa1.js → index.a317b384.js} +11 -12
  15. package/components/DataGrid/subcomponents/editors/TextEditor/{index.91380a55.js → index.eac1749c.js} +12 -1
  16. package/components/DragResizeWindow/{index.051c743d.js → index.bf1a4a47.js} +2 -3
  17. package/components/DynamicFilter/{index.b93e5649.js → index.cce92677.js} +19 -17
  18. package/components/FieldLabel/FieldLabel.d.ts +2 -0
  19. package/components/FieldLabel/classes/constants.d.ts +1 -0
  20. package/components/FieldLabel/classes/index.d.ts +10 -0
  21. package/components/FieldLabel/classes/types.d.ts +11 -0
  22. package/components/FieldLabel/index.8d3d6bb4.js +82 -0
  23. package/components/FieldLabel/index.d.ts +1 -0
  24. package/components/FieldLabel/types.d.ts +8 -0
  25. package/components/GridLayout/subcomponents/Responsive/{index.0fd1b7f8.js → index.d2ec9ddb.js} +1 -0
  26. package/components/GridLayout/subcomponents/SizeProvider/{index.7669a2cd.js → index.06986ab4.js} +9 -5
  27. package/components/HamburgerMenu/{index.25029e23.js → index.06905db3.js} +2 -2
  28. package/components/Icon/{index.b920baf8.js → index.58eaf354.js} +8 -48
  29. package/components/Icon/types.d.ts +0 -5
  30. package/components/Image/classes/index.d.ts +7 -0
  31. package/components/Image/{utils/classes → classes}/types.d.ts +0 -5
  32. package/components/Image/index.fa98eb78.js +203 -0
  33. package/components/Image/tests/utils.d.ts +1 -1
  34. package/components/Image/types.d.ts +3 -43
  35. package/components/LanguagePopover/{index.e54c5cc7.js → index.2740fb8e.js} +3 -4
  36. package/components/LoadingError/{index.123e16f8.js → index.4f4724c4.js} +2 -2
  37. package/components/MFLoader/{index.52096ea5.js → index.f6a46c70.js} +1 -1
  38. package/components/ModalDialog/{index.2e931b5f.js → index.86de725b.js} +3 -3
  39. package/components/NoItemSelected/{index.1024b856.js → index.aa3679f1.js} +2 -3
  40. package/components/ObjectLogs/{index.d10f4a2f.js → index.0e365006.js} +7 -8
  41. package/components/PDFViewer/{index.98852f91.js → index.85d4e010.js} +1 -1
  42. package/components/Page/{index.def863f2.js → index.aa33f20b.js} +1 -1
  43. package/components/PaperForm/{index.8a617a66.js → index.b6811634.js} +2 -3
  44. package/components/Period/classes/index.d.ts +3 -1
  45. package/components/Period/classes/types.d.ts +6 -1
  46. package/components/Period/{index.d80dff10.js → index.ba79014c.js} +76 -61
  47. package/components/Period/subcomponents/SkeletonPeriod/index.d.ts +2 -0
  48. package/components/Period/subcomponents/SkeletonPeriod/types.d.ts +4 -0
  49. package/components/Period/types.d.ts +4 -1
  50. package/components/PrintingSystem/{index.2e17cae5.js → index.b3ed9375.js} +14 -14
  51. package/components/PrintingSystem/subcomponents/BodyNode/{index.c5ffe20a.js → index.7a5c7bdd.js} +1 -1
  52. package/components/PrintingSystem/subcomponents/ChartNode/{index.020c037c.js → index.85914c4b.js} +1 -1
  53. package/components/PrintingSystem/subcomponents/DividerNode/{index.78b023bb.js → index.45284722.js} +1 -1
  54. package/components/PrintingSystem/subcomponents/FooterNode/{index.b29fc1e9.js → index.a83e65dc.js} +1 -1
  55. package/components/PrintingSystem/subcomponents/GridNode/{index.11626284.js → index.cb7d0af9.js} +1 -1
  56. package/components/PrintingSystem/subcomponents/HeaderNode/{index.ef44c8ab.js → index.d67484e5.js} +1 -1
  57. package/components/PrintingSystem/subcomponents/PaperNode/{index.d72d224b.js → index.ab17815a.js} +1 -1
  58. package/components/PrintingSystem/subcomponents/PropertyValueNode/{index.8e53440c.js → index.8a2617ae.js} +1 -1
  59. package/components/PrintingSystem/subcomponents/SectionNode/{index.0b66458e.js → index.2c52ee12.js} +1 -1
  60. package/components/PrintingSystem/subcomponents/TextBoxNode/{index.b4c72fef.js → index.f0ac0243.js} +1 -1
  61. package/components/PropertyValue/{index.3b6670d4.js → index.a3527d10.js} +2 -3
  62. package/components/Resizeable/{index.0eb66c37.js → index.8db8f77d.js} +1 -1
  63. package/components/ScrollBar/{index.010f1b9d.js → index.7dfc2f29.js} +4 -3
  64. package/components/ScrollBar/index.d.ts +2 -2
  65. package/components/SideBar/classes/index.d.ts +7 -2
  66. package/components/SideBar/classes/types.d.ts +6 -1
  67. package/components/SideBar/constants.d.ts +2 -0
  68. package/components/SideBar/context/sideBarContext/types.d.ts +3 -1
  69. package/components/SideBar/{index.cdb70977.js → index.0d49daff.js} +255 -427
  70. package/components/SideBar/subcomponents/ContentDesktop/subcomponents/CollapseButton/index.d.ts +1 -1
  71. package/components/SideBar/subcomponents/ContentDesktop/subcomponents/ContentComponent/index.d.ts +1 -0
  72. package/components/SideBar/types.d.ts +1 -4
  73. package/components/SplitLayout/{index.30fd5861.js → index.3856385c.js} +1 -2
  74. package/components/ToastContainer/{index.97fdba82.js → index.b42aca02.js} +2 -2
  75. package/components/areas/components/AreasAdmin/{index.e4f0ccc1.js → index.6d902d47.js} +17 -18
  76. package/components/areas/components/AreasViewer/{index.f87c63ca.js → index.2a286dfa.js} +120 -221
  77. package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/subcomponents/WindowHeaderSkeleton/index.d.ts +2 -0
  78. package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/subcomponents/WindowHeaderSkeleton/types.d.ts +3 -0
  79. package/components/areas/contexts/AreasContext/helper.d.ts +2 -2
  80. package/components/areas/contexts/AreasContext/{index.3e3d8c62.js → index.3eb6b2a4.js} +5 -5
  81. package/components/areas/hooks/useAreas/{index.b18fe111.js → index.febe901b.js} +1 -1
  82. package/components/commercial/TopBar/{index.8e2163f7.js → index.08853566.js} +5 -18
  83. package/components/formatters/BooleanFormatter/{index.b3052107.js → index.4bb3d2f9.js} +2 -2
  84. package/components/formatters/PointsFormatter/{index.5c94c5e8.js → index.8a4fa393.js} +4 -4
  85. package/components/formatters/{index.95cc337e.js → index.3e9e2305.js} +1 -1
  86. package/components/hook-form/RHFAutocomplete/classes/types.d.ts +1 -0
  87. package/components/hook-form/RHFAutocomplete/{index.cf399b24.js → index.f9be5465.js} +41 -23
  88. package/components/hook-form/RHFAutocomplete/types.d.ts +7 -7
  89. package/components/hook-form/RHFAutocompleteAsync/{index.b2b75475.js → index.c01fd38a.js} +2 -3
  90. package/components/hook-form/RHFCheckbox/classes/types.d.ts +2 -0
  91. package/components/hook-form/RHFCheckbox/{index.a38715e3.js → index.4f650b78.js} +37 -10
  92. package/components/hook-form/RHFCheckbox/types.d.ts +4 -1
  93. package/components/hook-form/RHFColorPicker/RFHColorPicker.d.ts +8 -0
  94. package/components/hook-form/RHFColorPicker/classes/index.d.ts +2 -1
  95. package/components/hook-form/RHFColorPicker/classes/types.d.ts +4 -0
  96. package/components/hook-form/RHFColorPicker/dictionary.d.ts +1 -0
  97. package/components/hook-form/RHFColorPicker/index.5be9e237.js +206 -0
  98. package/components/hook-form/RHFColorPicker/index.d.ts +2 -8
  99. package/components/hook-form/RHFColorPicker/subcomponents/Skeleton/indext.d.ts +2 -1
  100. package/components/hook-form/RHFColorPicker/subcomponents/Skeleton/types.d.ts +3 -0
  101. package/components/hook-form/RHFColorPicker/types.d.ts +13 -2
  102. package/components/hook-form/RHFDateTime/classes/types.d.ts +3 -0
  103. package/components/hook-form/RHFDateTime/{index.5a673a96.js → index.ace3f52e.js} +52 -47
  104. package/components/hook-form/RHFDateTime/subcomponents/Skeleton/types.d.ts +3 -2
  105. package/components/hook-form/RHFDateTime/types.d.ts +4 -2
  106. package/components/hook-form/RHFPeriod/classes/index.d.ts +2 -1
  107. package/components/hook-form/RHFPeriod/classes/types.d.ts +2 -0
  108. package/components/hook-form/RHFPeriod/index.88812636.js +112 -0
  109. package/components/hook-form/RHFPeriod/types.d.ts +7 -1
  110. package/components/hook-form/RHFTextField/classes/types.d.ts +1 -0
  111. package/components/hook-form/RHFTextField/{index.fbb29ee1.js → index.d4192912.js} +40 -25
  112. package/components/hook-form/RHFTextField/types.d.ts +4 -3
  113. package/components/hook-form/RHFTextFieldPassword/types.d.ts +0 -1
  114. package/components/hook-form/RHFUpload/{index.05d7e2a7.js → index.f7efd0e2.js} +4 -5
  115. package/components/hook-form/index.d.ts +1 -1
  116. package/components/index.d.ts +1 -0
  117. package/components/modal/{WindowBase.998b8a38.js → WindowBase.4881da1f.js} +3 -3
  118. package/components/modal/{WindowConfirm.55ac3c8f.js → WindowConfirm.3b0e842b.js} +6 -6
  119. package/components/mui_extended/Accordion/{index.fb4eb664.js → index.a32a5761.js} +2 -2
  120. package/components/mui_extended/Button/{index.e520bd15.js → index.81367a73.js} +3 -7
  121. package/components/mui_extended/CheckBox/types.d.ts +2 -1
  122. package/components/mui_extended/{CheckBox.e662d20c.js → CheckBox.b3c0f2ad.js} +21 -23
  123. package/components/mui_extended/IconButton/classes/types.d.ts +0 -1
  124. package/components/mui_extended/IconButton/{index.9ea23f87.js → index.32fc9419.js} +2 -5
  125. package/components/mui_extended/IconButton/types.d.ts +1 -1
  126. package/components/mui_extended/ImageButton/ImageButton.d.ts +1 -1
  127. package/components/mui_extended/MenuActions/{index.fa7c26a5.js → index.fdea20e7.js} +4 -5
  128. package/components/mui_extended/Pager/{index.0c703574.js → index.c843dde3.js} +2 -3
  129. package/components/mui_extended/Popover/{index.b3eca6b1.js → index.d85de73b.js} +1 -2
  130. package/components/mui_extended/Tab/{index.409b9c74.js → index.2068925d.js} +2 -3
  131. package/components/mui_extended/ToggleButton/{index.bcaea74b.js → index.3d71f374.js} +1 -1
  132. package/components/mui_extended/ToggleIconButton/{index.131772d7.js → index.1cff26af.js} +1 -1
  133. package/contexts/ModalContext/{index.978a412d.js → index.e748f329.js} +1 -1
  134. package/contexts/RHFormContext/{index.7769076a.js → index.7b2a8723.js} +1 -2
  135. package/hooks/index.d.ts +1 -0
  136. package/hooks/useFormAddEdit/{index.4caddd24.js → index.5c3d8e48.js} +2 -2
  137. package/hooks/useFormFocus/index.d.ts +7 -0
  138. package/hooks/useFormFocus/types.d.ts +8 -0
  139. package/hooks/useModal/{index.786a4439.js → index.66a0c82e.js} +1 -1
  140. package/hooks/useTab/{index.eee18a49.js → index.c0564138.js} +1 -1
  141. package/index.js +124 -120
  142. package/{node_modules.71622512.js → node_modules.47f7709b.js} +1 -1
  143. package/package.json +1 -1
  144. package/{vendor.a735310a.js → vendor.47f1f3d4.js} +90 -70
  145. package/components/Image/index.d034ca68.js +0 -388
  146. package/components/Image/subcomponents/BasicIntersectComponent/index.d.ts +0 -3
  147. package/components/Image/subcomponents/LazyLoadComponent/index.d.ts +0 -7
  148. package/components/Image/subcomponents/Skeleton/index.d.ts +0 -2
  149. package/components/Image/subcomponents/Skeleton/types.d.ts +0 -6
  150. package/components/Image/utils/classes/index.d.ts +0 -12
  151. package/components/Image/utils/isIntersectionObserverAvailable.d.ts +0 -1
  152. package/components/SideBar/subcomponents/ContentGroups/subcomponents/Skeleton/index.d.ts +0 -1
  153. package/components/SideBar/subcomponents/ContentGroups/subcomponents/Skeleton/types.d.ts +0 -3
  154. package/components/SideBar/subcomponents/ContentGroups/type.d.ts +0 -7
  155. package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/skeleton.d.ts +0 -1
  156. package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/subcomponents/WindowPopUpsList/index.d.ts +0 -2
  157. package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/subcomponents/WindowPopUpsList/types.d.ts +0 -2
  158. package/components/hook-form/RHFColorPicker/index.48a1ee1b.js +0 -153
  159. package/components/hook-form/RHFPeriod/index.4205c8ab.js +0 -76
  160. package/components/mui_extended/Popover/index.d.ts +0 -2
  161. /package/components/Image/{utils/classes → classes}/constant.d.ts +0 -0
@@ -1,388 +0,0 @@
1
- import { useBase, useModuleSkeleton, BaseProvider, useEnvironment, evaluateWithContext } from "@m4l/core";
2
- import { forwardRef, useState, useRef, useImperativeHandle, useEffect, useMemo } from "react";
3
- import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
4
- import { jsx, Fragment, jsxs } from "react/jsx-runtime";
5
- import { styled, Skeleton as Skeleton$1, generateUtilityClasses, generateUtilityClass } from "@mui/material";
6
- import { unstable_composeClasses } from "@mui/base";
7
- import clsx from "clsx";
8
- import { c as classes, g as getSize } from "../PrintingSystem/index.2e17cae5.js";
9
- import { Q as QRCode } from "../../node_modules.71622512.js";
10
- function isIntersectionObserverAvailable() {
11
- return typeof window !== "undefined" && "IntersectionObserver" in window && "IntersectionObserverEntry" in window;
12
- }
13
- const IMAGE_PREFIX = "Image";
14
- const getNameDataTestId = (KEY) => {
15
- return `${IMAGE_PREFIX}-${KEY}`;
16
- };
17
- const checkIntersections = (entries) => {
18
- entries.forEach((entry) => {
19
- if (entry.isIntersecting) {
20
- entry.target?.setIsVisible(true);
21
- }
22
- });
23
- };
24
- const LAZY_LOAD_OBSERVERS = {};
25
- const getObserver = (threshold) => {
26
- LAZY_LOAD_OBSERVERS[threshold] = LAZY_LOAD_OBSERVERS[threshold] || new IntersectionObserver(checkIntersections, {
27
- rootMargin: threshold + "px"
28
- });
29
- return LAZY_LOAD_OBSERVERS[threshold];
30
- };
31
- const BasicIntersectComponent = forwardRef((props, ref) => {
32
- const {
33
- height,
34
- width,
35
- setIsVisible,
36
- threshold
37
- } = props;
38
- const {
39
- classes: classes2
40
- } = useBase();
41
- const [observer] = useState(getObserver(threshold));
42
- const intersectComponentRef = useRef(null);
43
- useImperativeHandle(ref, () => intersectComponentRef.current);
44
- useEffect(() => {
45
- if (observer && intersectComponentRef.current) {
46
- intersectComponentRef.current.setIsVisible = setIsVisible;
47
- observer.observe(intersectComponentRef.current);
48
- }
49
- return () => {
50
- if (observer && intersectComponentRef.current) {
51
- observer.unobserve(intersectComponentRef.current);
52
- }
53
- };
54
- }, []);
55
- const styleProp = {
56
- display: "inline-block"
57
- };
58
- if (typeof width !== "undefined") {
59
- styleProp.width = width;
60
- }
61
- if (typeof height !== "undefined") {
62
- styleProp.height = height;
63
- styleProp.minHeight = height;
64
- }
65
- return /* @__PURE__ */ jsx("span", {
66
- className: classes2.span,
67
- ref: intersectComponentRef,
68
- style: styleProp,
69
- ...process.env.NODE_ENV !== "production" ? {
70
- [TEST_PROP_ID]: getNameDataTestId("span")
71
- } : {}
72
- });
73
- });
74
- BasicIntersectComponent.displayName = "IntersectComponent";
75
- const WrapperLazyLoadComponent = styled("div")(() => ({}));
76
- function LazyLoadComponent(props) {
77
- const {
78
- children,
79
- useIntersectionObserver,
80
- testingProps,
81
- ...other
82
- } = props;
83
- const [isVisible, setIsVisible] = useState(testingProps?.isVisible || !(useIntersectionObserver && isIntersectionObserverAvailable()));
84
- const {
85
- classes: classes2
86
- } = useBase();
87
- return /* @__PURE__ */ jsx(WrapperLazyLoadComponent, {
88
- className: classes2.lazyLoad,
89
- ...process.env.NODE_ENV !== "production" ? {
90
- [TEST_PROP_ID]: getNameDataTestId("lazyLoad")
91
- } : {},
92
- children: isVisible ? /* @__PURE__ */ jsx(Fragment, {
93
- children
94
- }) : /* @__PURE__ */ jsx(BasicIntersectComponent, {
95
- useIntersectionObserver,
96
- setIsVisible,
97
- ...other
98
- })
99
- });
100
- }
101
- const ImageRoot = styled("div")(({
102
- theme
103
- }) => ({
104
- ...theme.components?.M4LImage?.styleOverrides
105
- }));
106
- const WrapperSkeletonImage = styled("div")(() => ({
107
- mask: `url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70%3B' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M45 8.7c1.4-1.5 3.4-2.3 5.4-2.3s3.9 0.8 5.4 2.3s2.4 3.5 2.5 5.7c0 2.2-0.9 4.2-2.4 5.7s-3.5 2.3-5.5 2.2c-2.1 0.1-4-0.7-5.5-2.2c-1.4-1.5-2.3-3.5-2.4-5.7C42.6 12.2 43.5 10.2 45 8.7z'/%3E%3Cpath d='M68.4 62.1c-0.3 0.5-0.7 0.8-1.2 1.1s-1 0.4-1.6 0.4H4.3c-0.6 0-1.1-0.1-1.6-0.4s-0.9-0.6-1.2-1.1c-0.2-0.5-0.4-1-0.4-1.5s0.1-1.1 0.4-1.5l23-36.4c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l11.5 18.2c0.2 0.3 0.5 0.5 0.8 0.7c0.3 0.2 0.6 0.3 1 0.3c0.3 0 0.7-0.1 1-0.3c0.3-0.2 0.6-0.4 0.8-0.7l3.1-4.9c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l14.6 23.1c0.3 0.5 0.3 1 0.3 1.5S68.7 61.7 68.4 62.1z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain`,
108
- WebkitMask: `url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70%3B' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M45 8.7c1.4-1.5 3.4-2.3 5.4-2.3s3.9 0.8 5.4 2.3s2.4 3.5 2.5 5.7c0 2.2-0.9 4.2-2.4 5.7s-3.5 2.3-5.5 2.2c-2.1 0.1-4-0.7-5.5-2.2c-1.4-1.5-2.3-3.5-2.4-5.7C42.6 12.2 43.5 10.2 45 8.7z'/%3E%3Cpath d='M68.4 62.1c-0.3 0.5-0.7 0.8-1.2 1.1s-1 0.4-1.6 0.4H4.3c-0.6 0-1.1-0.1-1.6-0.4s-0.9-0.6-1.2-1.1c-0.2-0.5-0.4-1-0.4-1.5s0.1-1.1 0.4-1.5l23-36.4c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l11.5 18.2c0.2 0.3 0.5 0.5 0.8 0.7c0.3 0.2 0.6 0.3 1 0.3c0.3 0 0.7-0.1 1-0.3c0.3-0.2 0.6-0.4 0.8-0.7l3.1-4.9c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l14.6 23.1c0.3 0.5 0.3 1 0.3 1.5S68.7 61.7 68.4 62.1z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain`,
109
- height: "100%",
110
- width: "100%",
111
- display: "flex",
112
- alignItems: "center",
113
- justifyContent: "center"
114
- }));
115
- const Skeleton = (props) => {
116
- const {
117
- skeletonVariant,
118
- width,
119
- height
120
- } = props;
121
- const {
122
- classes: classes2
123
- } = useBase();
124
- return skeletonVariant === "image" ? /* @__PURE__ */ jsx(WrapperSkeletonImage, {
125
- className: classes2.skeletonImage,
126
- ...process.env.NODE_ENV !== "production" ? {
127
- [TEST_PROP_ID]: getNameDataTestId("skeletonImage")
128
- } : {},
129
- style: {
130
- width,
131
- height
132
- },
133
- children: /* @__PURE__ */ jsx(Skeleton$1, {
134
- variant: "rectangular",
135
- width: "100%",
136
- height: "100%"
137
- })
138
- }) : /* @__PURE__ */ jsx(Skeleton$1, {
139
- variant: "circular",
140
- width: "100%",
141
- height: "100%",
142
- className: classes2.skeletonCircle,
143
- ...process.env.NODE_ENV !== "production" ? {
144
- [TEST_PROP_ID]: getNameDataTestId("skeletonCircle")
145
- } : {}
146
- });
147
- };
148
- const componentName = "M4LImage";
149
- generateUtilityClasses(componentName, [
150
- "root",
151
- "lazyLoad",
152
- "img",
153
- "span",
154
- "skeletonImage",
155
- "skeletonCircle",
156
- "loaded"
157
- ]);
158
- function getImagenClassesUtilityClass(slot) {
159
- return generateUtilityClass(componentName, slot);
160
- }
161
- const useUtilityClasses = (ownerState) => {
162
- const slots = {
163
- root: ["root", ownerState.isImageLoaded == true && "loaded"],
164
- lazyLoad: ["lazyLoad"],
165
- img: ["img"],
166
- intersectComponent: ["intersectComponent"],
167
- skeletonImage: ["skeletonImage"],
168
- skeletonCircle: ["skeletonCircle"]
169
- };
170
- const composedClasses = unstable_composeClasses(slots, getImagenClassesUtilityClass, {});
171
- return {
172
- ...composedClasses
173
- };
174
- };
175
- const ratioOptions = {
176
- "1.168:1": {
177
- width: 1.168,
178
- height: 1
179
- },
180
- "16:9": {
181
- width: 16,
182
- height: 9
183
- },
184
- "1:1": {
185
- width: 1,
186
- height: 1
187
- },
188
- "1:1.168": {
189
- width: 1,
190
- height: 1.168
191
- },
192
- "2:1": {
193
- width: 2,
194
- height: 1
195
- },
196
- "2:3": {
197
- width: 2,
198
- height: 3
199
- },
200
- "3:1": {
201
- width: 3,
202
- height: 1
203
- },
204
- "3:2": {
205
- width: 3,
206
- height: 2
207
- },
208
- "3:4": {
209
- width: 3,
210
- height: 4
211
- },
212
- "4:3": {
213
- width: 4,
214
- height: 3
215
- },
216
- "5:2": {
217
- width: 5,
218
- height: 2
219
- }
220
- };
221
- const getRatioValues = (ratio) => {
222
- const numType = ratioOptions[ratio];
223
- const numRef = numType.width / numType.height;
224
- if (numRef >= 1) {
225
- return {
226
- width: "100%",
227
- height: `${Math.trunc(numRef * 100)}%`
228
- };
229
- } else {
230
- return {
231
- width: `${Math.trunc(numRef * 100)}%`,
232
- height: "100%"
233
- };
234
- }
235
- };
236
- function Image(props) {
237
- const {
238
- src,
239
- alt,
240
- useIntersectionObserver = true,
241
- threshold = 100,
242
- skeletonVariant = "image",
243
- testingProps,
244
- width,
245
- height,
246
- ratio = "1:1",
247
- className
248
- } = props;
249
- const ratioImage = getRatioValues(ratio);
250
- const isSKeleton = useModuleSkeleton();
251
- const [statusLoad, setStatusLoad] = useState(testingProps?.statusLoad || "initial");
252
- useEffect(() => {
253
- let timer;
254
- if (statusLoad === "loaded" && !isSKeleton) {
255
- timer = setTimeout(() => {
256
- setStatusLoad("removed");
257
- }, 3e3);
258
- }
259
- return () => {
260
- if (timer) {
261
- clearTimeout(timer);
262
- }
263
- };
264
- }, [statusLoad, isSKeleton]);
265
- const onLoad = () => {
266
- setStatusLoad("loaded");
267
- };
268
- const isImageLoaded = !isSKeleton && statusLoad !== "initial";
269
- const ownerState = {
270
- isImageLoaded
271
- };
272
- const classes2 = useUtilityClasses(ownerState);
273
- const lazyLoadComponent = useMemo(() => {
274
- return /* @__PURE__ */ jsx(ImageRoot, {
275
- className: clsx(classes2.root, className),
276
- ...process.env.NODE_ENV !== "production" ? {
277
- [TEST_PROP_ID]: getNameDataTestId("root")
278
- } : {},
279
- style: width && height ? {
280
- minWidth: width,
281
- minHeight: height,
282
- width,
283
- height
284
- } : {
285
- width: "100%",
286
- height: "100%"
287
- },
288
- children: /* @__PURE__ */ jsxs(LazyLoadComponent, {
289
- width: "100%",
290
- height: "100%",
291
- useIntersectionObserver,
292
- threshold,
293
- testingProps,
294
- children: [statusLoad !== "removed" ? /* @__PURE__ */ jsx(Skeleton, {
295
- skeletonVariant,
296
- width: !width ? "100%" : ratioImage.width,
297
- height: !height ? "100%" : ratioImage.height
298
- }) : null, /* @__PURE__ */ jsx("img", {
299
- alt,
300
- src,
301
- onLoad,
302
- className: classes2.img,
303
- width: !width ? "100%" : ratioImage.width,
304
- height: !height ? "100%" : ratioImage.height,
305
- ...process.env.NODE_ENV !== "production" ? {
306
- [TEST_PROP_ID]: getNameDataTestId("img")
307
- } : {}
308
- })]
309
- })
310
- });
311
- }, [statusLoad, isSKeleton, src]);
312
- return /* @__PURE__ */ jsx(BaseProvider, {
313
- value: {
314
- classes: classes2
315
- },
316
- children: lazyLoadComponent
317
- });
318
- }
319
- const ImageNode = (props) => {
320
- const {
321
- className,
322
- style,
323
- src,
324
- width = "100%",
325
- height = "100%"
326
- } = props;
327
- const {
328
- unitSize,
329
- sourceData
330
- } = useBase();
331
- const {
332
- host_static_assets,
333
- environment_assets
334
- } = useEnvironment();
335
- const resourceImg = evaluateWithContext(sourceData, src);
336
- return /* @__PURE__ */ jsx("img", {
337
- src: `${host_static_assets}/${environment_assets}/${resourceImg}`,
338
- className: clsx(classes.imageNodeRoot, className),
339
- style: {
340
- width: getSize(width, unitSize),
341
- height: getSize(height, unitSize),
342
- ...style
343
- }
344
- });
345
- };
346
- const convertToPx = (size, magnitud) => {
347
- if (isNaN(size)) {
348
- return 0;
349
- }
350
- if (magnitud === "px") {
351
- return size;
352
- }
353
- switch (magnitud) {
354
- case "cm":
355
- return size * 37.8;
356
- case "mm":
357
- return size * 3.78;
358
- case "in":
359
- return size * 96;
360
- case "pt":
361
- return size * 1.33;
362
- case "pc":
363
- return size * 16;
364
- default:
365
- return 100;
366
- }
367
- };
368
- const QRImageNode = (props) => {
369
- const {
370
- url,
371
- size = 8,
372
- color
373
- } = props;
374
- const {
375
- unitSize
376
- } = useBase();
377
- return /* @__PURE__ */ jsx(QRCode, {
378
- value: url,
379
- size: convertToPx(size, unitSize),
380
- fgColor: color,
381
- renderAs: "canvas"
382
- });
383
- };
384
- export {
385
- Image as I,
386
- QRImageNode as Q,
387
- ImageNode as a
388
- };
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- import { IntersectComponentProps } from '../../types';
3
- export declare const BasicIntersectComponent: import("react").ForwardRefExoticComponent<IntersectComponentProps & import("react").RefAttributes<HTMLSpanElement>>;
@@ -1,7 +0,0 @@
1
- import { LazyLoadComponentProps } from '../../types';
2
- /**
3
- * Sub-componente encargado de validar y condicionar la funcionalidad del intersection observer.
4
- * @param props
5
- * @returns
6
- */
7
- export declare function LazyLoadComponent(props: LazyLoadComponentProps): import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { SkeletonProps } from './types';
2
- export declare const Skeleton: (props: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,6 +0,0 @@
1
- import { SkeletonVariant } from '../../types';
2
- export interface SkeletonProps {
3
- skeletonVariant: SkeletonVariant;
4
- width: string;
5
- height: string;
6
- }
@@ -1,12 +0,0 @@
1
- import { ImageClassesType } from './types';
2
- import { OwnerState } from '../../types';
3
- export declare const imageClasses: ImageClassesType;
4
- export declare function getImagenClassesUtilityClass(slot: string): string;
5
- export declare const useUtilityClasses: (ownerState: OwnerState) => {
6
- img: string;
7
- root: string;
8
- lazyLoad: string;
9
- intersectComponent: string;
10
- skeletonImage: string;
11
- skeletonCircle: string;
12
- };
@@ -1 +0,0 @@
1
- export declare function isIntersectionObserverAvailable(): boolean;
@@ -1 +0,0 @@
1
- export declare const SkeletonNavSectionVertical: () => import("react/jsx-runtime").JSX.Element;
@@ -1,3 +0,0 @@
1
- export interface WrapperSKTNavSectionVerticalProps {
2
- collapse?: boolean;
3
- }
@@ -1,7 +0,0 @@
1
- import { SideBarProps } from '../../types';
2
- import { NavListProps } from './subcomponents/ItemListRoot/subcomponents/NavItemRoot/type';
3
- export interface GroupData {
4
- title: string;
5
- children: NavListProps[];
6
- }
7
- export declare type NavSectionVerticalTitleProps = Pick<SideBarProps, 'collapsed'>;
@@ -1 +0,0 @@
1
- export declare function SKTModuleHeader(): import("react/jsx-runtime").JSX.Element;
@@ -1,2 +0,0 @@
1
- import { WindowPopUpsListProps } from './types';
2
- export declare const WindowPopUpsList: (props: WindowPopUpsListProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -1,2 +0,0 @@
1
- import { HeaderProps } from "../../types";
2
- export declare type WindowPopUpsListProps = Pick<HeaderProps, 'windowId' | 'areaId'>;
@@ -1,153 +0,0 @@
1
- import { useState } from "react";
2
- import { useFormContext, useWatch, Controller } from "react-hook-form";
3
- import { useModuleSkeleton, useEnvironment, useModuleDictionary } from "@m4l/core";
4
- import { S as SketchPicker } from "../../../node_modules.71622512.js";
5
- import "lodash-es/debounce";
6
- import "lodash-es/each";
7
- import { jsx, jsxs } from "react/jsx-runtime";
8
- import { H as HelperText } from "../../HelperText/index.7d2afdb3.js";
9
- import { generateUtilityClasses, generateUtilityClass, styled, Skeleton as Skeleton$1 } from "@mui/material";
10
- import { unstable_composeClasses } from "@mui/base";
11
- import { useTheme } from "@mui/material/styles";
12
- import { P as Popover } from "../../mui_extended/Popover/index.b3eca6b1.js";
13
- import { I as Icon } from "../../Icon/index.b920baf8.js";
14
- import { B as Button } from "../../mui_extended/Button/index.e520bd15.js";
15
- const componentName = "M4LRHFColorPicker";
16
- const colorPickerClasses = generateUtilityClasses(componentName, [
17
- "root",
18
- "popoverRoot",
19
- "containerFieldColor",
20
- "fieldColor",
21
- "containerPicker",
22
- "skeleton"
23
- ]);
24
- function getRHFColorPickerUtilityClass(slot) {
25
- return generateUtilityClass(componentName, slot);
26
- }
27
- const useUtilityClasses = () => {
28
- const slots = {
29
- root: ["root"],
30
- popoverRoot: ["popoverRoot"],
31
- containerFieldColor: ["containerFieldColor"],
32
- fieldColor: ["boxColor"],
33
- containerPicker: ["containerPicker"],
34
- skeleton: ["skeleton"]
35
- };
36
- const composedClasses = unstable_composeClasses(slots, getRHFColorPickerUtilityClass, {});
37
- return {
38
- ...composedClasses
39
- };
40
- };
41
- const RHFColorPickerRoot = styled("div")(({ theme }) => ({
42
- ...theme.components?.M4LRHFColorPicker?.styleOverrides
43
- }));
44
- const Skeleton = () => {
45
- return /* @__PURE__ */ jsx(Skeleton$1, {
46
- className: colorPickerClasses.skeleton,
47
- variant: "rectangular",
48
- width: 20,
49
- height: 20
50
- });
51
- };
52
- const RHFColorPicker = (props) => {
53
- const {
54
- name
55
- } = props;
56
- const {
57
- control,
58
- setValue
59
- } = useFormContext();
60
- const isSkeleton = useModuleSkeleton();
61
- const {
62
- host_static_assets,
63
- environment_assets
64
- } = useEnvironment();
65
- const theme = useTheme();
66
- const currentColor = useWatch({
67
- name,
68
- control
69
- });
70
- const [tempColor, setTempColor] = useState(() => currentColor || "#ffffff");
71
- const [anchorEl, setAnchorEl] = useState(null);
72
- const {
73
- getLabel
74
- } = useModuleDictionary();
75
- const handleColorChange = (color) => {
76
- console.log("react color pick", color.hex);
77
- setTempColor(color.hex);
78
- };
79
- const handleApprove = () => {
80
- setAnchorEl(null);
81
- if (tempColor !== currentColor) {
82
- setValue(name, tempColor);
83
- }
84
- };
85
- const classes = useUtilityClasses();
86
- if (isSkeleton) {
87
- return /* @__PURE__ */ jsx(Skeleton, {});
88
- }
89
- return /* @__PURE__ */ jsx(Controller, {
90
- name,
91
- control,
92
- defaultValue: "",
93
- render: ({
94
- field,
95
- fieldState: {
96
- error
97
- }
98
- }) => /* @__PURE__ */ jsxs(RHFColorPickerRoot, {
99
- className: classes.root,
100
- children: [/* @__PURE__ */ jsxs("div", {
101
- className: classes.containerFieldColor,
102
- onClick: (event) => setAnchorEl(event.currentTarget),
103
- children: [/* @__PURE__ */ jsx("div", {
104
- className: classes.fieldColor,
105
- style: {
106
- backgroundColor: field.value,
107
- width: "20px",
108
- height: "20px",
109
- cursor: "pointer"
110
- }
111
- }), /* @__PURE__ */ jsx(Icon, {
112
- src: `${host_static_assets}/${environment_assets}/frontend/components/rhfcolorpicker/assets/icons/chevron_right.svg`
113
- })]
114
- }), error?.message && /* @__PURE__ */ jsx(HelperText, {
115
- variant: "error",
116
- message: error?.message + ""
117
- }), /* @__PURE__ */ jsx(Popover, {
118
- open: Boolean(anchorEl),
119
- arrowType: "top-center",
120
- className: classes.popoverRoot,
121
- anchorEl,
122
- onClose: () => setAnchorEl(null),
123
- anchorOrigin: {
124
- vertical: "bottom",
125
- horizontal: "center"
126
- },
127
- transformOrigin: {
128
- vertical: "top",
129
- horizontal: "center"
130
- },
131
- sx: {
132
- mt: "12px",
133
- ...theme.components?.M4LRHFColorPickerPopoverRoot?.styleOverrides
134
- },
135
- children: /* @__PURE__ */ jsxs("div", {
136
- className: classes.containerPicker,
137
- children: [/* @__PURE__ */ jsx(SketchPicker, {
138
- color: tempColor,
139
- onChange: handleColorChange,
140
- disableAlpha: true
141
- }), /* @__PURE__ */ jsx(Button, {
142
- variant: "contained",
143
- onClick: handleApprove,
144
- children: getLabel("rhfcolorpicker.accept")
145
- })]
146
- })
147
- })]
148
- })
149
- });
150
- };
151
- export {
152
- RHFColorPicker as R
153
- };
@@ -1,76 +0,0 @@
1
- import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
2
- import { useFormContext, Controller } from "react-hook-form";
3
- import { H as HelperText } from "../../HelperText/index.7d2afdb3.js";
4
- import { unstable_composeClasses } from "@mui/base";
5
- import { jsx, jsxs } from "react/jsx-runtime";
6
- import { P as Period } from "../../Period/index.d80dff10.js";
7
- const RHFPeriodRoot = styled("div")(({
8
- theme
9
- }) => ({
10
- width: "100%",
11
- display: "flex",
12
- flexDirection: "column",
13
- justifyContent: "center",
14
- alignItems: "flex-start",
15
- gap: theme.spacing(1),
16
- ...theme.components?.M4LRHFPeriod?.styleOverrides
17
- }));
18
- const componentName = "M4LRHFPeriod";
19
- generateUtilityClasses(componentName, [
20
- "root"
21
- ]);
22
- function getRHFPeriodUtilityClass(slot) {
23
- return generateUtilityClass(componentName, slot);
24
- }
25
- const RHFPeriodUtilityClasses = () => {
26
- const slots = {
27
- root: ["root"]
28
- };
29
- const composedClasses = unstable_composeClasses(slots, getRHFPeriodUtilityClass, {});
30
- return {
31
- ...composedClasses
32
- };
33
- };
34
- const RHFPeriod = (props) => {
35
- const {
36
- name,
37
- readOnly,
38
- skeletonWidth,
39
- skeletonHeight,
40
- state
41
- } = props;
42
- const {
43
- control
44
- } = useFormContext();
45
- const classes = RHFPeriodUtilityClasses();
46
- return /* @__PURE__ */ jsx(Controller, {
47
- name,
48
- control,
49
- render: ({
50
- field: {
51
- onChange,
52
- value
53
- },
54
- fieldState: {
55
- error
56
- }
57
- }) => {
58
- return /* @__PURE__ */ jsxs(RHFPeriodRoot, {
59
- className: classes.root,
60
- children: [/* @__PURE__ */ jsx(Period, {
61
- value,
62
- onChange,
63
- state: !!error === true ? "error" : state,
64
- readOnly,
65
- skeletonWidth,
66
- skeletonHeight
67
- }), error && /* @__PURE__ */ jsx(HelperText, {
68
- message: error.message || ""
69
- })]
70
- });
71
- }
72
- });
73
- };
74
- export {
75
- RHFPeriod as R
76
- };
@@ -1,2 +0,0 @@
1
- export * from './Popover';
2
- export * from './types';