@m4l/components 0.1.88 → 0.1.89

package/components/PaperForm/{index.2ba09776.js → index.e02c772c.js}

@@ -1,7 +1,7 @@
 import { styled } from "@mui/material/styles";
 import { useModuleSkeleton } from "@m4l/core";
 import { Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { I as Icon } from "../Icon/index.6459c16b.js";
+import { I as Icon } from "../Icon/index.a70c4729.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { unstable_composeClasses } from "@mui/base";
 const PaperFormRoot = styled("div")(({
@@ -27,9 +27,8 @@ const IconTitleContainer = styled("div")(({
   flexDirection: "row",
   flexGrow: 1,
   alignItems: "center",
-  cursor: "move",
-  ...theme.typography.subtitle1,
-  color: theme.palette.text.primary
+  color: theme.palette.text.primary,
+  ...theme.typography.subtitle1
 }));
 const IconHeader = styled("div")(({
   theme

package/components/Period/{index.ba2a843b.js → index.972dbe64.js}

@@ -1,39 +1,39 @@
 import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
 import { styled, generateUtilityClasses, generateUtilityClass, Autocomplete, TextField, Skeleton } from "@mui/material";
 import { useMemo } from "react";
-import { I as Icon } from "../Icon/index.6459c16b.js";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.e3be92cf.js";
+import { I as Icon } from "../Icon/index.a70c4729.js";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.366cb775.js";
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.f79eb74e.js";
 import "clsx";
 import "react-hook-form";
-import "../../contexts/ModalContext/index.c312fca2.js";
+import "../../contexts/ModalContext/index.1fc9f5d9.js";
 import "../../react-draggable.7abb5d0a.js";
-import "../Resizeable/index.9a9c79a4.js";
+import "../Resizeable/index.676c96fe.js";
 import "@m4l/graphics";
-import "../modal/index.c997f1df.js";
+import "../modal/index.dbdb6ac0.js";
 import "../Image/index.c18ebf5a.js";
-import "../mui_extended/IconButton/index.bb108329.js";
-import "../mui_extended/Accordion/index.284b6cd3.js";
+import "../mui_extended/IconButton/index.76624519.js";
+import "../mui_extended/Accordion/index.0e0090ca.js";
 import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
 import "../mui_extended/CheckBox.38abccd8.js";
-import "../mui_extended/Badge/index.8c2b8b66.js";
+import "../mui_extended/Badge/index.b09524fe.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.35095da9.js";
+import "../mui_extended/MenuActions/index.4c2e48d4.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
 import "../mui_extended/Stack/index.0e53197c.js";
-import "../mui_extended/Tab/index.7a8aef3b.js";
-import "../mui_extended/Pager/index.68e5c360.js";
+import "../mui_extended/Tab/index.3db2e0c7.js";
+import "../mui_extended/Pager/index.ac2a21f0.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.a5dab72c.js";
-import "../areas/components/AreasAdmin/index.3b358ff4.js";
+import "../areas/contexts/AreasContext/index.7a2d5394.js";
+import "../areas/components/AreasAdmin/index.cb3d7bd6.js";
 import "zustand/shallow";
 import "../ScrollBar/index.65bb2930.js";
-import "../areas/components/AreasViewer/index.df370ebe.js";
+import "../areas/components/AreasViewer/index.1eef603d.js";
 import "../LinearProgressIndeterminate/index.60dabc06.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";

package/components/PropertyValue/{index.ba3a1a95.js → index.d3d71d50.js}

@@ -1,7 +1,7 @@
 import { styled } from "@mui/material/styles";
 import { Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../vendor.c2b73255.js";
+import { g as getNameDataTestId } from "../../vendor.92191f81.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useModuleSkeleton } from "@m4l/core";
@@ -40,7 +40,7 @@ const Property = styled("div", {
 }) => ({
   width: "100%",
   minWidth: "100%",
-  ...theme.typography.subtitle2,
+  ...theme.typography.body,
   color: theme.palette.text.primary,
   height: "100%",
   display: "flex",
@@ -66,8 +66,10 @@ const Value = styled("div", {
   theme
 }) => ({
   flexGrow: "1",
-  ...theme.typography.body2,
+  ...theme.typography.body,
   color: theme.palette.text.secondary,
+  overflow: "hidden",
+  textOverflow: "ellipsis",
   position: "relative",
   padding: "1px",
   maxWidth: `${valueWidth}%`,
@@ -77,7 +79,6 @@ const Value = styled("div", {
   [theme.breakpoints.up("sm")]: {
     marginTop: "0px"
   },
-  overflow: "auto",
   overflowWrap: "break-word"
 }));
 const SKTWrapperProperty = styled("div")(() => ({

package/components/Resizeable/{index.9a9c79a4.js → index.676c96fe.js}

@@ -9,6 +9,29 @@ const WrapperResizeable = styled(ResizableBox)(({
     width: "100%",
     height: "100%"
   },
+  "& .custom-handle-se": {
+    width: "7px",
+    height: "7px",
+    position: "absolute",
+    bottom: "3px",
+    right: "3px",
+    cursor: "se-resize",
+    borderRight: `2px solid ${theme.palette.text.disabled}`,
+    borderBottom: `2px solid ${theme.palette.text.disabled}`,
+    borderBottomRightRadius: "15%"
+  },
+  "& .custom-handle-nw": {
+    width: "7px",
+    height: "7px",
+    position: "absolute",
+    top: "3px",
+    left: "3px",
+    cursor: "se-resize",
+    transform: "rotate(180deg)",
+    borderRight: `2px solid ${theme.palette.text.disabled}`,
+    borderBottom: `2px solid ${theme.palette.text.disabled}`,
+    borderBottomRightRadius: "15%"
+  },
   "& .react-resizable-handle": {
     position: "absolute",
     width: "20px",
@@ -30,28 +53,26 @@ const WrapperResizeable = styled(ResizableBox)(({
     transform: "rotate(90deg)",
     position: "absolute"
   },
-  ".M4LIcon-root.custom-handle.custom-handle-se": {
+  ".M4LImage-root.custom-handle.custom-handle-se": {
     bottom: "0",
     right: "0",
     cursor: "se-resize",
     position: "absolute",
-    "& .M4LIcon-icon": {
-      width: "12px",
-      height: "12px",
-      minWidth: "12px",
-      minHeight: "12px"
+    "& .M4LImage-img": {
+      opacity: "0.5",
+      filter: "invert(0.4) hue-rotate(20deg) saturate(1000%)",
+      "-webkit-user-drag": "none"
     }
   },
-  "& .M4LIcon-root.custom-handle.custom-handle-nw": {
+  "& .M4LImage-root.custom-handle.custom-handle-nw": {
     top: "0",
     left: "0",
     cursor: "nw-resize",
     transform: "rotate(180deg)",
-    "& .M4LIcon-icon": {
-      width: "12px",
-      height: "12px",
-      minWidth: "12px",
-      minHeight: "12px"
+    "& .M4LImage-img": {
+      opacity: "0.5",
+      filter: "invert(0.4) hue-rotate(20deg) saturate(1000%)",
+      "-webkit-user-drag": "none"
     }
   },
   "& .react-resizable-handle-ne": {

package/components/SideBar/{index.4e3fd5fc.js → index.2dfc5445.js}

@@ -3,10 +3,10 @@ import { useEnvironment, useBase, BaseProvider } from "@m4l/core";
 import { createContext, useContext, useState, useEffect } from "react";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { I as Image } from "../Image/index.c18ebf5a.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.bb108329.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.76624519.js";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 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.6459c16b.js";
+import { I as Icon, A as ArrowIcon } from "../Icon/index.a70c4729.js";
 import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import clsx from "clsx";
 import { useLocation } from "react-router-dom";

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

@@ -1,5 +1,5 @@
 import { AreasAdmninClasses } from './types';
 import { OwnerState } from '../../../contexts/AreasContext/types';
 export declare const areasAdminClasses: AreasAdmninClasses;
-export declare const useAreasAdminUtilityClasses: (ownerState: OwnerState) => Record<"root" | "rootContent" | "areaChipRoot" | "areaIconLayer" | "areaContainerChipsIcon" | "areaContainerChips" | "areaContainerContentChips" | "areaEditPopover" | "areaChipMobileRoot" | "areaChipMobileIconContainer" | "areaChipTitle" | "areaContainerChipEditButton" | "areaChipDeleteButton" | "areaChipEditButton" | "areasAddButton" | "areasPopoverMobileOptions" | "areasPopoverListWindows" | "areasPopoverListWindowsIcon", string>;
+export declare const useAreasAdminUtilityClasses: (ownerState: OwnerState) => Record<"root" | "rootContent" | "areaChipRoot" | "areaIconLayer" | "areaContainerChipsIcon" | "areaContainerChips" | "areaContainerContentChips" | "areaEditPopover" | "areaChipMobileRoot" | "areaChipMobileIconContainer" | "areaChipTitle" | "areaContainerChipEditButton" | "areaChipDeleteButton" | "areaChipEditButton" | "areasAddButton" | "areasPopoverMobileOptions" | "areasPopoverListWindows" | "areasPopoverListWindowsIcon" | "areaContentChips", string>;
 export declare type AdminClasses = ReturnType<typeof useAreasAdminUtilityClasses>;

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

@@ -18,6 +18,7 @@ export interface AreasAdmninClasses {
     areasPopoverMobileOptions: string;
     areasPopoverListWindows: string;
     areasPopoverListWindowsIcon: string;
+    areaContentChips: string;
     selected: string;
     isMobile: string;
     disabled: string;

package/components/areas/components/AreasAdmin/{index.3b358ff4.js → index.cb3d7bd6.js}

@@ -1,11 +1,11 @@
-import { I as IconButton } from "../../../mui_extended/IconButton/index.bb108329.js";
-import { u as useAreasStore } from "../../hooks/useAreas/index.4726ee2e.js";
+import { I as IconButton } from "../../../mui_extended/IconButton/index.76624519.js";
+import { u as useAreasStore } from "../../hooks/useAreas/index.1f112e0b.js";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { useState, useRef, useMemo } from "react";
 import * as Yup from "yup";
 import { generateUtilityClasses, useTheme } from "@mui/material";
-import "../../../mui_extended/Accordion/index.284b6cd3.js";
-import { I as Icon } from "../../../Icon/index.6459c16b.js";
+import "../../../mui_extended/Accordion/index.0e0090ca.js";
+import { I as Icon } from "../../../Icon/index.a70c4729.js";
 import clsx from "clsx";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { T as Typography } from "../../../mui_extended/Typography/index.443590d6.js";
@@ -14,14 +14,14 @@ import "react-router-dom";
 import "@mui/material/Button";
 import { B as Button } from "../../../mui_extended/Button/index.f79eb74e.js";
 import "../../../mui_extended/CheckBox.38abccd8.js";
-import "../../../mui_extended/Badge/index.8c2b8b66.js";
+import "../../../mui_extended/Badge/index.b09524fe.js";
 import "../../../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import { M as MenuActions } from "../../../mui_extended/MenuActions/index.35095da9.js";
+import { M as MenuActions } from "../../../mui_extended/MenuActions/index.4c2e48d4.js";
 import { P as Popover } from "../../../mui_extended/Popover/index.9f35d0eb.js";
 import "../../../mui_extended/Stack/index.0e53197c.js";
-import "../../../mui_extended/Tab/index.7a8aef3b.js";
-import "../../../mui_extended/Pager/index.68e5c360.js";
+import "../../../mui_extended/Tab/index.3db2e0c7.js";
+import "../../../mui_extended/Pager/index.ac2a21f0.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import "../../../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
@@ -29,39 +29,39 @@ import { g as getComponentUtilityClass } from "../../../../utils/index.c43a95f4.
 import { A as AREAS_ADMIN_CLASS_NAME } from "../../constants.66529246.js";
 import { I as ICONS } from "../../icons.8266ccc8.js";
 import "../../contexts/DynamicMFParmsContext/index.1607c78e.js";
-import "../../../../contexts/ModalContext/index.c312fca2.js";
-import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.ea2758ed.js";
+import "../../../../contexts/ModalContext/index.1fc9f5d9.js";
+import { R as RHFormProvider } from "../../../../contexts/RHFormContext/index.1755b324.js";
 import "react-hook-form";
-import "../../../hook-form/RHFAutocomplete/index.c6f46842.js";
-import "../../../HelperText/index.e47a7ccf.js";
+import "../../../hook-form/RHFAutocomplete/index.5c23bd25.js";
+import "../../../HelperText/index.69791151.js";
 import "lodash/debounce";
-import "../../../hook-form/RHFAutocompleteAsync/index.4c52e870.js";
-import "../../../hook-form/RHFCheckbox/index.066c715f.js";
+import "../../../hook-form/RHFAutocompleteAsync/index.85b11f3a.js";
+import "../../../hook-form/RHFCheckbox/index.a136882e.js";
 import "@mui/x-date-pickers";
-import "../../../hook-form/RHFDateTime/index.3661a6c9.js";
-import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.0a784644.js";
-import "../../../hook-form/RHFPeriod/index.4c9a1646.js";
-import "../../../Period/index.ba2a843b.js";
-import { A as Actions } from "../../../CommonActions/components/Actions/index.e3be92cf.js";
-import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.aac245a9.js";
-import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.a4386a07.js";
+import "../../../hook-form/RHFDateTime/index.1ca795b0.js";
+import { R as RHFTextField } from "../../../hook-form/RHFTextField/index.ccea64e7.js";
+import "../../../hook-form/RHFPeriod/index.90777c53.js";
+import "../../../Period/index.972dbe64.js";
+import { A as Actions } from "../../../CommonActions/components/Actions/index.366cb775.js";
+import { A as ActionCancel } from "../../../CommonActions/components/ActionCancel/index.ffc5618a.js";
+import { A as ActionIntro } from "../../../CommonActions/components/ActionIntro/index.81d2648b.js";
 import "../../../../react-draggable.7abb5d0a.js";
-import "../../../Resizeable/index.9a9c79a4.js";
-import "../../../modal/index.c997f1df.js";
+import "../../../Resizeable/index.676c96fe.js";
+import "../../../modal/index.dbdb6ac0.js";
 import { shallow } from "zustand/shallow";
 import { styled } from "@mui/material/styles";
 import { S as ScrollBar } from "../../../ScrollBar/index.65bb2930.js";
 import { g as getAreasDictionary, D as DICCTIONARY } from "../../dictionary.08cfc4c9.js";
 import TouchRipple from "@mui/material/ButtonBase/TouchRipple";
-import "../AreasViewer/index.df370ebe.js";
+import "../AreasViewer/index.1eef603d.js";
 import "../../../LinearProgressIndeterminate/index.60dabc06.js";
-import "../../contexts/AreasContext/index.a5dab72c.js";
+import "../../contexts/AreasContext/index.7a2d5394.js";
 import "../../contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "zustand";
 import "lodash/isString";
 import "react-dropzone";
-import "../../../hook-form/RHFUpload/index.a98e961d.js";
-import { u as useOnClickOutside } from "../../index.e380a1f6.js";
+import "../../../hook-form/RHFUpload/index.85e59119.js";
+import { u as useOnClickOutside } from "../../index.aaaa1f62.js";
 const areasAdminClasses = generateUtilityClasses(AREAS_ADMIN_CLASS_NAME, [
   "root",
   "rootContent",
@@ -82,6 +82,7 @@ const areasAdminClasses = generateUtilityClasses(AREAS_ADMIN_CLASS_NAME, [
   "areasPopoverMobileOptions",
   "areasPopoverListWindows",
   "areasPopoverListWindowsIcon",
+  "areaContentChips",
   "selected",
   "isMobile",
   "disabled",
@@ -106,7 +107,8 @@ const useAreasAdminUtilityClasses = (ownerState) => {
     areasAddButton: ["areasAddButton"],
     areasPopoverMobileOptions: ["areasPopoverMobileOptions"],
     areasPopoverListWindows: ["areasPopoverListWindows"],
-    areasPopoverListWindowsIcon: ["areasPopoverListWindowsIcon"]
+    areasPopoverListWindowsIcon: ["areasPopoverListWindowsIcon"],
+    areaContentChips: ["areaContentChips"]
   };
   return unstable_composeClasses(slots, getComponentUtilityClass(AREAS_ADMIN_CLASS_NAME), {});
 };
@@ -218,7 +220,6 @@ const AreaChip = (props) => {
   const anchorRef = useRef(null);
   const theme = useTheme();
   const onClickDeleteArea = (e) => {
-    console.log("listAreas", listAreas);
     if (listAreas.length > 1) {
       e.stopPropagation();
       setFocus(true);
@@ -242,7 +243,6 @@ const AreaChip = (props) => {
     inputEditArea: Yup.string().required(getLabel(getAreasDictionary(DICCTIONARY.validation_edit_area)))
   }), [getLabel]);
   const handlerOnClick = (e) => {
-    console.log("evento de handlerOnClick");
     setAnchorMenuAreas && setAnchorMenuAreas(e.currentTarget);
     selectArea(areaId);
   };
@@ -278,20 +278,23 @@ const AreaChip = (props) => {
           size: "extraSmall",
           onClick: (e) => {
             handlerOpenPopoverEditArea(e);
-          }
+          },
+          tooltip: getLabel(getAreasDictionary(DICCTIONARY.label_edit_area))
         }), /* @__PURE__ */ jsx(IconButton, {
           className: areasAdminClasses.areaChipDeleteButton,
           src: `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.DELETE_AREA}`,
           size: "extraSmall",
           onClick: (e) => {
             onClickDeleteArea(e);
-          }
+          },
+          tooltip: getLabel(getAreasDictionary(DICCTIONARY.label_delete_area))
         })]
       }) : /* @__PURE__ */ jsx(ChipActionsMobile, {
         areaId,
         handlerOpenPopoverEditArea
       })]
     }), /* @__PURE__ */ jsx("div", {
+      role: "presentation",
       onClick: (e) => {
         e.stopPropagation();
       },
@@ -402,7 +405,6 @@ const ChipMobile = (props) => {
   const anchorRef = useRef(null);
   const theme = useTheme();
   const onClickDeleteArea = (e) => {
-    console.log("listAreas", listAreas);
     if (listAreas.length > 1) {
       e.stopPropagation();
       setFocus(true);
@@ -426,7 +428,6 @@ const ChipMobile = (props) => {
     inputEditArea: Yup.string().required(getLabel(getAreasDictionary(DICCTIONARY.validation_edit_area)))
   }), [getLabel]);
   const handlerOnClick = (e) => {
-    console.log("evento de handlerOnClick");
     setAnchorMenuAreas && setAnchorMenuAreas(e.currentTarget);
     selectArea(areaId);
   };
@@ -564,7 +565,6 @@ const AreaChipMobile = () => {
     setFocus
   } = useAreasStore((state) => state.areaAdminActions, shallow);
   const [anchorMenuAreas, setAnchorMenuAreas] = useState(null);
-  console.log("anchorMenuAreas change", anchorMenuAreas);
   const {
     getLabel
   } = useModuleDictionary();
@@ -588,7 +588,6 @@ const AreaChipMobile = () => {
     setFocus(false);
     setAnchorMenuAreas(element);
   };
-  console.log("menuActions areas", menuActions);
   return /* @__PURE__ */ jsx("div", {
     className: areasAdminClasses.areaChipMobileRoot,
     children: /* @__PURE__ */ jsxs("div", {
@@ -699,11 +698,13 @@ function AreasAdmin() {
     addArea
   } = useAreasStore((state) => state.areasActions, shallow);
   const maximizedId = useAreasStore((state) => state.hashAreas[currentArea] ? state.hashAreas[currentArea].maximizedId : false, shallow);
-  console.log("currentArea test", currentArea);
   const {
     host_static_assets,
     environment_assets
   } = useEnvironment();
+  const {
+    getLabel
+  } = useModuleDictionary();
   const divRef = useRef(null);
   const divRefOut = useRef(null);
   const handleClickOutsideFn = () => {
@@ -730,6 +731,7 @@ function AreasAdmin() {
     onMouseUp: onRippleStop,
     className: classesRoot,
     children: /* @__PURE__ */ jsxs("div", {
+      role: "presentation",
       ref: divRef,
       className: areasAdminClasses.rootContent,
       onClick: () => setFocus(true),
@@ -740,7 +742,8 @@ function AreasAdmin() {
           children: /* @__PURE__ */ jsx("div", {
             className: areasAdminClasses.areaContainerContentChips,
             children: isDesktop ? /* @__PURE__ */ jsx(ScrollBar, {
-              children: /* @__PURE__ */ jsx(Fragment, {
+              children: /* @__PURE__ */ jsx("div", {
+                className: areasAdminClasses.areaContentChips,
                 children: areas.map((area) => /* @__PURE__ */ jsx(AreaChip, {
                   areaId: area,
                   selected: area === currentArea,
@@ -754,7 +757,8 @@ function AreasAdmin() {
         className: areasAdminClasses.areasAddButton,
         src: `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.ADD_AREA}`,
         size: "small",
-        onClick: addArea
+        onClick: addArea,
+        tooltip: getLabel(getAreasDictionary(DICCTIONARY.area_add_new))
       }) : null, !isDesktop && maximizedId ? /* @__PURE__ */ jsx(PanelWindowPopUp, {
         currentAreaId: currentArea
       }) : null]

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" | "resizeHandle" | "windowLinearProgressBar" | "areaRoot" | "areasLoadingErrorRoot" | "areasLoadingErrorLoading" | "areasLoadingError" | "areasLoadingErrorIcon" | "areasLoadingErrorTitle" | "areasLoadingErrorDescription" | "areasLoadingErrorDivider" | "areaGridLayoutPanelContainer" | "areaGridLayout" | "areaGridLayoutPopupsContainer" | "areasWindowPopUpList" | "windowRoot" | "windowRootContainer" | "windowHeader" | "windowHeaderTitle" | "windowHeaderMainActions" | "windowHeaderCancelHandle" | "windowContent" | "windowLinearProgressRoot" | "windowPopupRoot" | "windowModalRoot" | "selectedWindow" | "windowToastiesContainer" | "windowToastiesContainerTostys" | "windowToastyMeesageButtonsContainer" | "windowToastyMessage" | "windowToastyButtonsContainer" | "windowToastyPin" | "windowToastyClose" | "panelWindowsRoot" | "panelWindowsButtonContainer" | "windowToastyContainer", string>;
+export declare const useAreasViewerUtilityClasses: (ownerState: OwnerState) => Record<"root" | "resizeHandle" | "windowLinearProgressBar" | "windowContent" | "areaRoot" | "areasLoadingErrorRoot" | "areasLoadingErrorLoading" | "areasLoadingError" | "areasLoadingErrorIcon" | "areasLoadingErrorTitle" | "areasLoadingErrorDescription" | "areasLoadingErrorDivider" | "areaGridLayoutPanelContainer" | "areaGridLayout" | "areaGridLayoutPopupsContainer" | "areasWindowPopUpList" | "windowRoot" | "windowRootContainer" | "windowHeader" | "windowHeaderTitle" | "windowHeaderMainActions" | "windowHeaderCancelHandle" | "windowLinearProgressRoot" | "windowPopupRoot" | "windowModalRoot" | "selectedWindow" | "windowToastiesContainer" | "windowToastiesContainerTostys" | "windowToastyMeesageButtonsContainer" | "windowToastyMessage" | "windowToastyButtonsContainer" | "windowToastyPin" | "windowToastyClose" | "panelWindowsRoot" | "panelWindowsButtonContainer" | "windowToastyContainer", string>;
 export declare type ViwerClasses = ReturnType<typeof useAreasViewerUtilityClasses>;