@m4l/components 0.1.69 → 0.1.71

package/components/Icon/types.d.ts

@@ -7,6 +7,7 @@ export interface IconProps {
     size?: SizeIcon;
     rotationAngle?: number;
     testingProps?: TestingProps;
+    className?: string;
 }
 export declare type DivIconProps = Pick<IconProps, 'src' | 'rotationAngle'>;
 export declare type WrapperPlaceHolderProps = {

package/components/Image/{index.f30f79f0.js → index.1e3b7ff6.js}

@@ -1,6 +1,6 @@
 import { useBase, useModuleSkeleton, BaseProvider } from "@m4l/core";
 import { forwardRef, useState, useRef, useImperativeHandle, useEffect, useMemo } from "react";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.js";
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import { styled, Skeleton as Skeleton$1, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
@@ -277,8 +277,8 @@ function Image(props) {
       } : {},
       ...width && height ? {
         style: {
-          width,
-          height
+          minWidth: width,
+          minHeight: height
         }
       } : {
         sx: {

package/components/LanguagePopover/{index.526e544e.js → index.310e9a3a.js}

@@ -1,24 +1,24 @@
 import { useState, useEffect } from "react";
 import { styled, generateUtilityClasses, generateUtilityClass, Stack, MenuItem } from "@mui/material";
-import { I as Image } from "../Image/index.f30f79f0.js";
+import { I as Image } from "../Image/index.1e3b7ff6.js";
 import { useLocales } from "@m4l/graphics";
 import { useEnvironment, useNetwork } from "@m4l/core";
-import "../Icon/index.952f0635.js";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
-import { jsxs, jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.917f0d3c.js";
+import "../Icon/index.6f2a5618.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.js";
 import "clsx";
-import "../mui_extended/Accordion/index.51feece8.js";
+import { jsxs, jsx } from "react/jsx-runtime";
+import "../mui_extended/IconButton/index.7aab3e04.js";
+import "../mui_extended/Accordion/index.44e96bb8.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "react-router-dom";
 import "@mui/material/Button";
-import { I as ImageButton } from "../mui_extended/Button/index.b34c8b68.js";
+import { I as ImageButton } from "../mui_extended/Button/index.ec6525e0.js";
 import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
 import "@mui/lab";
-import "../mui_extended/Typography/index.79e2b06f.js";
-import { P as Popover } from "../mui_extended/Popover/index.226f247e.js";
-import "../mui_extended/MenuActions/index.651dec44.js";
-import "../mui_extended/Pager/index.e0663072.js";
+import "../mui_extended/Typography/index.d5e0f69f.js";
+import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.bff47c06.js";
+import "../mui_extended/Pager/index.907d5801.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
 import { unstable_composeClasses } from "@mui/base";
 const LanguagePopoverRoot = styled("div")(({

package/components/ModalDialog/{index.4d663d0a.js → index.598f9a86.js}

@@ -1,12 +1,15 @@
 import { Dialog, Paper } from "@mui/material";
-import { c as cjs } from "../../react-draggable.de1aac90.js";
-import { u as useModal } from "../../hooks/useModal/index.043e419b.js";
+import { c as cjs } from "../../react-draggable.29f78f6d.js";
+import { u as useModal } from "../../hooks/useModal/index.9b244379.js";
 import { styled } from "@mui/material/styles";
-import { a as getThemeVariantColor } from "../../utils/index.b5c62ef0.js";
-import { R as ResizeableWindow } from "../Resizeable/index.ff97422e.js";
+import { a as getThemeVariantColor } from "../../utils/index.ee16888d.js";
+import { R as ResizeableWindow } from "../Resizeable/index.ff4ce7a4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
+import { I as Icon } from "../Icon/index.6f2a5618.js";
+import { useEnvironment } from "@m4l/core";
+import { I as ICONS } from "../areas/index.bd29b1db.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.1b2a0921.js";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.6b7d480a.js";
 const WrapperDialog = styled(Dialog)(() => ({}));
 const Container = styled("div")(({ theme }) => ({
   display: "flex",
@@ -88,6 +91,10 @@ const ModalDialog = () => {
     fullScreen
   } = useModal();
   const isDesktop = useResponsiveDesktop();
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
   const contentComnponent = /* @__PURE__ */ jsx(Container, {
     id: "Container",
     children: typeof window === "function" ? window() : window
@@ -106,6 +113,13 @@ const ModalDialog = () => {
       height: initialHeigth,
       maxWidth,
       maxHeigth,
+      handle: (resizeHandle, ref) => /* @__PURE__ */ jsx("div", {
+        ref,
+        children: /* @__PURE__ */ jsx(Icon, {
+          src: `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.RESIZE}`,
+          className: `custom-handle custom-handle-${resizeHandle}`
+        })
+      }, resizeHandle),
       children: contentComnponent
     }), !isDesktop && contentComnponent]
   });

package/components/NavLink/{index.92008184.js → index.ac3778af.js}

@@ -2,21 +2,22 @@ import { NavLink as NavLink$1 } from "react-router-dom";
 import { generateUtilityClasses, generateUtilityClass, styled } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.952f0635.js";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.917f0d3c.js";
+import "../Icon/index.6f2a5618.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.js";
 import "clsx";
-import "../mui_extended/Accordion/index.51feece8.js";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import "../mui_extended/IconButton/index.7aab3e04.js";
+import "@m4l/graphics";
+import "../mui_extended/Accordion/index.44e96bb8.js";
 import "../mui_extended/Avatar/index.fe06afd7.js";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
-import "../Image/index.f30f79f0.js";
+import "../mui_extended/Button/index.ec6525e0.js";
+import "../Image/index.1e3b7ff6.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.79e2b06f.js";
-import "../mui_extended/Popover/index.226f247e.js";
-import "../mui_extended/MenuActions/index.651dec44.js";
-import "../mui_extended/Pager/index.e0663072.js";
+import { T as Typography } from "../mui_extended/Typography/index.d5e0f69f.js";
+import "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.bff47c06.js";
+import "../mui_extended/Pager/index.907d5801.js";
 import "../mui_extended/Tab/index.e0653a0a.js";
 import { unstable_composeClasses } from "@mui/base";
 const componentName = "M4LNavLink";

package/components/NoItemSelected/{index.6f2952ab.js → index.3809e3d1.js}

@@ -1,6 +1,6 @@
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { styled } from "@mui/material/styles";
-import { I as Image } from "../Image/index.f30f79f0.js";
+import { I as Image } from "../Image/index.1e3b7ff6.js";
 import { Skeleton } from "@mui/material";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/components/ObjectLogs/{index.d1eee18b.js → index.949d3595.js}

@@ -1,32 +1,35 @@
 import { useState, useEffect, useCallback, useMemo } from "react";
 import { useNetwork, useModuleDictionary, useEnvironment, usePaginate } from "@m4l/core";
 import { styled } from "@mui/material/styles";
-import { D as DataGrid, g as getDataGridComponentsDictionary } from "../DataGrid/index.75ea6038.js";
+import { D as DataGrid, g as getDataGridComponentsDictionary } from "../DataGrid/index.77ae9b4c.js";
 import { D as DateFormatter } from "../formatters/DateFormatter/index.578a9f53.js";
 import { Tooltip, IconButton } from "@mui/material";
 import { useHostTheme, useResponsiveDesktop } from "@m4l/graphics";
 import { R as ReactJson } from "../../react-json-view.57125fcf.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { u as useModal } from "../../hooks/useModal/index.043e419b.js";
-import { I as Icon } from "../Icon/index.952f0635.js";
-import "../../react-draggable.de1aac90.js";
-import "../ModalDialog/index.4d663d0a.js";
-import "../Resizeable/index.ff97422e.js";
-import "../CommonActions/components/Actions/index.1b2a0921.js";
+import { u as useModal } from "../../hooks/useModal/index.9b244379.js";
+import { I as Icon } from "../Icon/index.6f2a5618.js";
+import "../../react-draggable.29f78f6d.js";
+import "../ModalDialog/index.598f9a86.js";
+import "../Resizeable/index.ff4ce7a4.js";
+import "../CommonActions/components/Actions/index.6b7d480a.js";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
+import "../mui_extended/Button/index.ec6525e0.js";
 import "clsx";
 import "react-hook-form";
-import "../mui_extended/IconButton/index.917f0d3c.js";
+import "../mui_extended/IconButton/index.7aab3e04.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.7c12b512.js";
-import "../areas/components/index.ffb147c7.js";
+import "../areas/contexts/AreasContext/index.e14d6799.js";
+import "../areas/components/index.31f39977.js";
 import "zustand/shallow";
+import "../ScrollBar/index.bbe48f4d.js";
+import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
+import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 import "@mui/lab";
-import "../mui_extended/Typography/index.79e2b06f.js";
-import "../modal/WindowConfirm.7ae1326f.js";
-import { W as WindowBase } from "../modal/WindowBase.7ce0b21e.js";
-import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.aaeea668.js";
+import "../mui_extended/Typography/index.d5e0f69f.js";
+import "../modal/WindowConfirm.70bcbb69.js";
+import { W as WindowBase } from "../modal/WindowBase.32d35d71.js";
+import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.b2ba5167.js";
 const Container$1 = styled("div")(() => ({
   height: "100%",
   width: "100%",

package/components/PaperForm/{index.e9db704b.js → index.cf8af08b.js}

@@ -1,7 +1,7 @@
 import { styled } from "@mui/material/styles";
 import { useModuleSkeleton } from "@m4l/core";
 import { Skeleton } from "@mui/material";
-import { I as Icon } from "../Icon/index.952f0635.js";
+import { I as Icon } from "../Icon/index.6f2a5618.js";
 import { jsxs, jsx } from "react/jsx-runtime";
 const WrapperPaper = styled("div")(({
   theme

package/components/Period/{index.3ff6f53b.js → index.53ea0562.js}

@@ -1,27 +1,38 @@
 import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
 import { styled, Skeleton, Autocomplete, TextField } from "@mui/material";
 import { useMemo } from "react";
-import { I as Icon } from "../Icon/index.952f0635.js";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.1b2a0921.js";
+import { I as Icon } from "../Icon/index.6f2a5618.js";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.6b7d480a.js";
 import { jsxs, jsx } from "react/jsx-runtime";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.b34c8b68.js";
+import "../mui_extended/Button/index.ec6525e0.js";
 import "clsx";
 import "react-hook-form";
-import "../../contexts/ModalContext/index.76d5ccee.js";
-import "../../react-draggable.de1aac90.js";
-import "../ModalDialog/index.4d663d0a.js";
-import "../Resizeable/index.ff97422e.js";
+import "../../contexts/ModalContext/index.fca184e2.js";
+import "../../react-draggable.29f78f6d.js";
+import "../ModalDialog/index.598f9a86.js";
+import "../Resizeable/index.ff4ce7a4.js";
 import "@m4l/graphics";
-import "../modal/WindowConfirm.7ae1326f.js";
-import "../modal/WindowBase.7ce0b21e.js";
-import "../mui_extended/IconButton/index.917f0d3c.js";
+import "../modal/WindowConfirm.70bcbb69.js";
+import "../modal/WindowBase.32d35d71.js";
+import "../mui_extended/IconButton/index.7aab3e04.js";
+import "../mui_extended/Accordion/index.44e96bb8.js";
+import "../mui_extended/Avatar/index.fe06afd7.js";
+import "react-router-dom";
+import "../Image/index.1e3b7ff6.js";
+import "@mui/lab";
+import "../mui_extended/Typography/index.d5e0f69f.js";
+import "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.bff47c06.js";
+import "../mui_extended/Pager/index.907d5801.js";
+import "../mui_extended/Tab/index.e0653a0a.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.7c12b512.js";
-import "../areas/components/index.ffb147c7.js";
+import "../areas/contexts/AreasContext/index.e14d6799.js";
+import "../areas/components/index.31f39977.js";
 import "zustand/shallow";
-import "@mui/lab";
-import "../mui_extended/Typography/index.79e2b06f.js";
+import "../ScrollBar/index.bbe48f4d.js";
+import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
+import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
 const ContainerPeriod = styled("div")(({
   theme,
   error,

package/components/Resizeable/{index.ff97422e.js → index.ff4ce7a4.js}

@@ -1,5 +1,5 @@
 import { styled } from "@mui/material/styles";
-import { R as ResizableBox } from "../../react-resizable.e0470767.js";
+import { R as ResizableBox } from "../../react-resizable.baf54eb2.js";
 import { jsx } from "react/jsx-runtime";
 const WrapperResizeable = styled(ResizableBox)(({
   theme
@@ -27,18 +27,32 @@ const WrapperResizeable = styled(ResizableBox)(({
     bottom: "0",
     left: "0",
     cursor: "sw-resize",
-    transform: "rotate(90deg)"
+    transform: "rotate(90deg)",
+    position: "absolute"
   },
-  ".react-resizable-handle-se": {
+  ".M4LIcon-root.custom-handle.custom-handle-se": {
     bottom: "0",
     right: "0",
-    cursor: "se-resize"
+    cursor: "se-resize",
+    position: "absolute",
+    "& .M4LIcon-icon": {
+      width: "12px",
+      height: "12px",
+      minWidth: "12px",
+      minHeight: "12px"
+    }
   },
-  "& .react-resizable-handle-nw": {
+  "& .M4LIcon-root.custom-handle.custom-handle-nw": {
     top: "0",
     left: "0",
     cursor: "nw-resize",
-    transform: "rotate(180deg)"
+    transform: "rotate(180deg)",
+    "& .M4LIcon-icon": {
+      width: "12px",
+      height: "12px",
+      minWidth: "12px",
+      minHeight: "12px"
+    }
   },
   "& .react-resizable-handle-ne": {
     top: "0",

package/components/SideBar/{index.365f64f0.js → index.4daafbab.js}

@@ -1,19 +1,19 @@
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useEnvironment } from "@m4l/core";
 import { createContext, useContext, useState } from "react";
-import { T as TEST_PROP_ID } from "../../vendor.6a33c6d2.js";
-import { I as Image } from "../Image/index.f30f79f0.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.917f0d3c.js";
+import { T as TEST_PROP_ID } from "../../vendor.619c3533.js";
+import { I as Image } from "../Image/index.1e3b7ff6.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.7aab3e04.js";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { styled as styled$1, generateUtilityClasses, ListItemText, ListItemButton, Collapse, Skeleton, Drawer } from "@mui/material";
-import { I as Icon, A as ArrowIcon } from "../Icon/index.952f0635.js";
-import { T as Typography } from "../mui_extended/Typography/index.79e2b06f.js";
+import { styled as styled$1, generateUtilityClasses, ListItemText, ListItemButton, Collapse, useTheme, Skeleton, Drawer as Drawer$1 } from "@mui/material";
+import { I as Icon, A as ArrowIcon } from "../Icon/index.6f2a5618.js";
+import { T as Typography } from "../mui_extended/Typography/index.d5e0f69f.js";
 import clsx from "clsx";
-import { P as Popover } from "../mui_extended/Popover/index.226f247e.js";
+import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
 import { S as ScrollBar } from "../ScrollBar/index.bbe48f4d.js";
 import { styled, alpha } from "@mui/material/styles";
 import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../utils/index.b5c62ef0.js";
+import { g as getComponentUtilityClass } from "../../utils/index.ee16888d.js";
 const SideBarRoot = styled("div")(({
   theme
 }) => ({
@@ -285,7 +285,7 @@ const WrapperGroupTitle = styled$1("li", {
   ...collapsed && {
     opacity: 0,
     width: 0,
-    overflowX: "hidden"
+    overflow: "hidden"
   }
 }));
 const NavItemMainRoot = styled("div", {
@@ -356,11 +356,8 @@ const NavItemMainContent = (props) => {
   } = useEnvironment();
   const {
     collapsed,
-    isItemActive,
     classes
   } = useSideBar();
-  const active = isItemActive(item);
-  console.log("NavItemRootContent active", active);
   const isDesktop = useResponsiveDesktop();
   const handlerClick = (event) => {
     onClick && onClick(item);
@@ -454,8 +451,6 @@ const NavSubItemContent = (props) => {
     if (!hasChildren || hasChildren === void 0) {
       closePopover();
     }
-    console.log("hasChildren", hasChildren);
-    console.log("hasChildren validation", hasChildren === void 0);
     setOpenSub((val) => !val);
     if (!isDesktop && (!hasChildren || hasChildren === void 0)) {
       onToggleVisible();
@@ -552,13 +547,13 @@ function NavItemMain(props) {
     classes
   } = useSideBar();
   const [popoverStatus, setPopoverStatus] = useState(null);
+  const theme = useTheme();
   const active = isItemActive(item);
   const handleOpen = (event) => {
     setPopoverStatus(event.currentTarget);
   };
   const handleClose = () => {
     setPopoverStatus(null);
-    console.log("se ejecuto el handle close");
   };
   if (children) {
     return /* @__PURE__ */ jsxs(Fragment, {
@@ -578,8 +573,8 @@ function NavItemMain(props) {
           anchorEl: popoverStatus,
           onClose: handleClose,
           arrowType: "left-center",
-          disablePortal: true,
           sx: {
+            ...theme.components?.M4LSideBarPopover?.styleOverrides,
             ml: "14px"
           },
           anchorOrigin: {
@@ -645,9 +640,9 @@ function ItemListMain(props) {
   const active = isItemActive(list);
   const [open, setOpen] = useState(active);
   const hasChildren = list.children && Array.isArray(list.children) && list.children.length > 0;
-  console.log("test item active equal", itemMainActive === id);
   if (hasChildren) {
     return /* @__PURE__ */ jsxs("div", {
+      role: "presentation",
       className: clsx(classes.itemListMainRoot, itemMainActive === id && classes.itemMainActive),
       ...process.env.NODE_ENV !== "production" ? {
         [TEST_PROP_ID]: getNameDataTestId("itemListMainRoot")
@@ -688,18 +683,13 @@ function ItemListMain(props) {
 }
 const WrapperSKTNavSectionVertical = styled$1("div", {
   shouldForwardProp: (props) => props !== "collapse"
-})(({
-  theme,
-  collapse
-}) => ({
+})(() => ({
   margin: "0",
   padding: "0",
   position: "relative",
   height: "100%"
 }));
-const NavSectionVerticalItem = styled$1("div")(({
-  theme
-}) => ({
+const NavSectionVerticalItem = styled$1("div")(() => ({
   display: "grid",
   gridTemplateColumns: "16px 1fr",
   gap: "8px",
@@ -708,9 +698,7 @@ const NavSectionVerticalItem = styled$1("div")(({
   padding: "8px",
   height: "36px"
 }));
-const NavSectionVerticalTitle = styled$1("div")(({
-  theme
-}) => ({
+const NavSectionVerticalTitle = styled$1("div")(() => ({
   display: "flex",
   justifyContent: "flex-start",
   height: "60px",
@@ -792,7 +780,6 @@ const ContentGroups = () => {
     classes
   } = useSideBar();
   const [itemMainActive, setItemMainActive] = useState(-1);
-  console.log("valor del item main active", itemMainActive);
   if (menuData && menuData.length > 0) {
     return /* @__PURE__ */ jsxs(ContentGroupsRoot, {
       className: classes.contentGroups,
@@ -900,6 +887,15 @@ styled$1("div")(({
   height: "auto",
   padding: theme.spacing(0, 2)
 }));
+const Drawer = (props) => {
+  const {
+    children
+  } = props;
+  return /* @__PURE__ */ jsx(Drawer$1, {
+    ...props,
+    children
+  });
+};
 const ContentMobile = () => {
   const {
     visible,
@@ -910,7 +906,8 @@ const ContentMobile = () => {
     classes,
     companyName
   } = useSideBar();
-  return /* @__PURE__ */ jsxs(Drawer, {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(Drawer, {
     open: visible,
     onClose: onToggleVisible,
     PaperProps: {
@@ -919,40 +916,44 @@ const ContentMobile = () => {
       }
     },
     className: classes.drawer,
-    disablePortal: true,
-    children: [/* @__PURE__ */ jsx("div", {
-      className: classes.lineLeft,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameDataTestId("lineLeft")
-      } : {}
-    }), /* @__PURE__ */ jsxs(WrapperContentMobile, {
-      className: classes.contentMobile,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameDataTestId("contentMobile")
-      } : {},
+    sx: {
+      ...theme.components?.M4LSideBarDrawer?.styleOverrides
+    },
+    children: /* @__PURE__ */ jsxs(Fragment, {
       children: [/* @__PURE__ */ jsx("div", {
-        className: classes.containerSideBarLogo,
+        className: classes.lineLeft,
+        ...process.env.NODE_ENV !== "production" ? {
+          [TEST_PROP_ID]: getNameDataTestId("lineLeft")
+        } : {}
+      }), /* @__PURE__ */ jsxs(WrapperContentMobile, {
+        className: classes.contentMobile,
         ...process.env.NODE_ENV !== "production" ? {
-          [TEST_PROP_ID]: getNameDataTestId("containerSideBarLogo")
+          [TEST_PROP_ID]: getNameDataTestId("contentMobile")
         } : {},
-        children: /* @__PURE__ */ jsxs("div", {
-          className: classes.containerLogo,
+        children: [/* @__PURE__ */ jsx("div", {
+          className: classes.containerSideBarLogo,
           ...process.env.NODE_ENV !== "production" ? {
-            [TEST_PROP_ID]: getNameDataTestId("containerLogo")
+            [TEST_PROP_ID]: getNameDataTestId("containerSideBarLogo")
           } : {},
-          children: [/* @__PURE__ */ jsx(Image, {
-            width: "40px",
-            height: "40px",
-            src: companyLogoSmallUrl,
-            alt: "logo"
-          }, "Logo"), !collapsed && /* @__PURE__ */ jsx(Typography, {
-            variant: "subtitleDens",
-            skeletonWidth: "100px",
-            children: companyName
-          })]
-        })
-      }), /* @__PURE__ */ jsx(ContentGroups, {})]
-    })]
+          children: /* @__PURE__ */ jsxs("div", {
+            className: classes.containerLogo,
+            ...process.env.NODE_ENV !== "production" ? {
+              [TEST_PROP_ID]: getNameDataTestId("containerLogo")
+            } : {},
+            children: [/* @__PURE__ */ jsx(Image, {
+              width: "40px",
+              height: "40px",
+              src: companyLogoSmallUrl,
+              alt: "logo"
+            }, "Logo"), !collapsed && /* @__PURE__ */ jsx(Typography, {
+              variant: "subtitleDens",
+              skeletonWidth: "100px",
+              children: companyName
+            })]
+          })
+        }), /* @__PURE__ */ jsx(ContentGroups, {})]
+      })]
+    })
   });
 };
 const SideBar = (props) => {

package/components/SideBar/subcomponents/ContentMobile/subcomponents/Drawer.d.ts

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

package/components/SideBar/subcomponents/ContentMobile/subcomponents/types.d.ts

@@ -0,0 +1,8 @@
+import { DrawerProps as MUIDrawerProps, Theme } from "@mui/material";
+import { ComponentNameToClassKey, SxProps } from "@mui/material";
+import { OverridesStyleRules } from "@mui/material/styles/overrides";
+import { ReactElement } from "react";
+export interface DrawerProps extends Omit<MUIDrawerProps, 'sx'> {
+    sx?: SxProps<Theme> | Partial<OverridesStyleRules<string, ComponentNameToClassKey, Theme>>;
+    children: ReactElement;
+}

package/components/areas/components/AreasAdmin/classes/types.d.ts

@@ -9,5 +9,6 @@ export interface AreasAdmninClasses {
     areasAddButton: string;
     selected: string;
     isMobile: string;
+    disabled: string;
 }
 export declare type AreasAdminClassesKey = keyof AreasAdmninClasses;

package/components/areas/components/AreasAdmin/subcomponents/AreaChip/styles.d.ts

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

package/components/areas/components/AreasAdmin/subcomponents/AreaChip/types.d.ts

@@ -1,5 +1,10 @@
+import { FieldValues } from "react-hook-form";
 export interface AreaChipProps {
     areaId: string;
     areaName: string;
     selected: boolean;
+    disabled: boolean;
 }
+export declare type AreaEditChip = {
+    inputEditArea: string;
+} | FieldValues;

package/components/areas/components/AreasViewer/classes/index.d.ts

@@ -1,5 +1,5 @@
 import { AreasViewerClasses } from './types';
 import { OwnerState } from '../../../contexts/AreasContext/types';
 export declare const areasViewerClasses: AreasViewerClasses;
-export declare const useAreasViewerUtilityClasses: (ownerState: OwnerState) => Record<"root" | "areaRoot" | "areaGridLayoutPanelContainer" | "areaGridLayout" | "areaGridLayoutPopupsContainer" | "windowRoot" | "windowHeader" | "windowHeaderTitle" | "windowHeaderMainActions" | "windowContent" | "windowPopupRoot" | "windowModalRoot" | "panelWindowsRoot" | "panelWindowsButtonContainer", string>;
+export declare const useAreasViewerUtilityClasses: (ownerState: OwnerState) => Record<"root" | "areaRoot" | "areaGridLayoutPanelContainer" | "areaGridLayout" | "areaGridLayoutPopupsContainer" | "windowRoot" | "windowRootContainer" | "windowHeader" | "windowHeaderTitle" | "windowHeaderMainActions" | "windowContent" | "windowPopupRoot" | "windowModalRoot" | "selectedWindow" | "panelWindowsRoot" | "panelWindowsButtonContainer", string>;
 export declare type ViwerClasses = ReturnType<typeof useAreasViewerUtilityClasses>;

package/components/areas/components/AreasViewer/classes/types.d.ts

@@ -11,9 +11,12 @@ export interface AreasViewerClasses {
     windowHeaderTitle: string;
     windowHeaderMainActions: string;
     windowContent: string;
+    windowRootContainer: string;
     windowPopupRoot: string;
     windowModalRoot: string;
     selected: string;
+    selectedWindow: string;
     isMobile: string;
+    loading: string;
 }
 export declare type AreasViewerClassesKey = keyof AreasViewerClasses;

package/components/areas/components/AreasViewer/subcomponents/Area/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { AreaProps } from '../../../../types';
+import { AreaProps } from './types';
 /**
  * @description Funcion encargada de renderizar un área completa.
  * El AreaProvider crea el store del área, por medio del cual se controla todo el estado y almacenamiento del área
@@ -8,6 +8,6 @@ import { AreaProps } from '../../../../types';
  * @returns JSX
  */
 export declare const Area: {
-    (props: AreaProps): import("react").JSX.Element;
+    (props: AreaProps): import("react").JSX.Element | null;
     displayName: string;
 };

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/GridLayout/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { GridLayoutProps } from './types';
 /**
  * @description Retorna el componente GridLayout con las ventanas (layouts) y popups tomados del área de trabajo.
  * @returns JSX
  */
-export declare const GridLayout: () => import("react").JSX.Element;
+export declare const GridLayout: (props: GridLayoutProps) => import("react").JSX.Element;