@m4l/components 9.1.117 → 9.1.119

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

@@ -0,0 +1,22 @@
+import { M4LOverridesStyleRules } from 'src/@types/augmentations';
+import { AreasViewerSlots } from './slots/AreasViewerEnum';
+import { Theme } from '@mui/material';
+import { AREAS_VIEWER_KEY_COMPONENT } from './constants';
+import { AreaProps } from './subcomponents/Area/types';
+export type AreasViewerType = keyof typeof AreasViewerSlots;
+export interface AreasViewerProps {
+    /**
+     * data-testid para pruebas unitarias.
+     */
+    dataTestId?: string;
+    /**
+     * Clase CSS para sobrescribir los estilos predeterminados.
+     */
+    className?: string;
+    /**
+     * Props adicionales que se pueden pasar.
+     */
+    [key: string]: unknown;
+}
+export type AreasViewerOwnerState = Pick<AreaProps, 'selected'>;
+export type AreasViewerStyles = M4LOverridesStyleRules<AreasViewerType, typeof AREAS_VIEWER_KEY_COMPONENT, Theme>;

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

@@ -1,3 +1,3 @@
 export * from './AreasAdmin/AreasAdmin';
-export * from './AreasViewer';
+export * from './AreasViewer/AreasViewer';
 export type { NewWindowProps as NewWindow } from '../types';

package/components/areas/constants.js

@@ -1,6 +1,4 @@
 const AREAS_VIEWER_CLASS_NAME = "M4LAreasViewer";
-const AREAS_ADMIN_CLASS_NAME = "M4LAreasAdmin";
 export {
-  AREAS_ADMIN_CLASS_NAME as A,
-  AREAS_VIEWER_CLASS_NAME as a
+  AREAS_VIEWER_CLASS_NAME as A
 };

package/components/areas/contexts/AreasContext/helpers/helper.d.ts

@@ -61,7 +61,6 @@ export declare const addArea: (state: WritableDraft<AreasStateWithActions>) => s
  * Actualiza la clases basado en owner state
  * @param state immer State
  */
-export declare const updateOwnerStateClasses: (state: WritableDraft<AreasStateWithActions>) => void;
 /**
  * TODO: Documentar
  */

package/components/areas/contexts/AreasContext/helpers/helper.js

@@ -1,5 +1,3 @@
-import { u as useAreasViewerUtilityClasses } from "../../../components/AreasViewer/classes/index.js";
-import { u as useAreasAdminUtilityClasses } from "../../../components/AreasAdmin/classes/index.js";
 import { c as createDynamicMFStore } from "../../DynamicMFParmsContext/store.js";
 import { g as getAreasDictionary, A as AREAS_DICCTIONARY } from "../../../dictionary.js";
 import { c as addLayoutItemToBreakPointIfNoExists } from "../../../../GridLayout/subcomponents/Responsive/responsiveUtils.js";
@@ -72,10 +70,6 @@ const addArea = (state) => {
   }
   return areaId;
 };
-const updateOwnerStateClasses = (state) => {
-  state.viwerClasses = useAreasViewerUtilityClasses(state.ownerState);
-  state.adminClasses = useAreasAdminUtilityClasses(state.ownerState);
-};
 const getParmsFromValue = (key, data) => {
   try {
     if (Array.isArray(data)) {
@@ -218,6 +212,5 @@ export {
   getDataFromResponse as k,
   getParmsFromValue as l,
   getCookiesContainer as m,
-  setColapsedLayoutBreakPoints as s,
-  updateOwnerStateClasses as u
+  setColapsedLayoutBreakPoints as s
 };

package/components/areas/contexts/AreasContext/store.js

@@ -1,9 +1,7 @@
 import { createStore } from "zustand";
 import { devtools } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
-import { u as useAreasViewerUtilityClasses } from "../../components/AreasViewer/classes/index.js";
-import { u as useAreasAdminUtilityClasses } from "../../components/AreasAdmin/classes/index.js";
-import { u as updateOwnerStateClasses, C as COOKIE_AREAS_ADMIN_CONTAINER_ID, b as COOKIE_AREAS_ADMIN_ID, D as DEFAULT_AREA, c as addArea, g as getSelectedAreaIdFromCookies, d as COOKIE_WINDOW_SELECTED, e as DEFAULT_WINDOW, a as RESPONSIVE_ROW_HEIGHTS, P as PADDING_GRIDLAYOUT, M as MARGIN_GRIDLAYOUT, N as NORMALIZED_COLS, f as deleteLayoutFromBreakPoints, h as COOKIE_WINDOWS, i as COOKIE_BREAKPOINT_LAYOUTS, j as DEBOUCED_SAVE_TIME, s as setColapsedLayoutBreakPoints, k as getDataFromResponse, l as getParmsFromValue, m as getCookiesContainer } from "./helpers/helper.js";
+import { C as COOKIE_AREAS_ADMIN_CONTAINER_ID, b as COOKIE_AREAS_ADMIN_ID, D as DEFAULT_AREA, c as addArea, g as getSelectedAreaIdFromCookies, d as COOKIE_WINDOW_SELECTED, e as DEFAULT_WINDOW, a as RESPONSIVE_ROW_HEIGHTS, P as PADDING_GRIDLAYOUT, M as MARGIN_GRIDLAYOUT, N as NORMALIZED_COLS, f as deleteLayoutFromBreakPoints, h as COOKIE_WINDOWS, i as COOKIE_BREAKPOINT_LAYOUTS, j as DEBOUCED_SAVE_TIME, s as setColapsedLayoutBreakPoints, k as getDataFromResponse, l as getParmsFromValue, m as getCookiesContainer } from "./helpers/helper.js";
 import { c as createDynamicMFStore } from "../DynamicMFParmsContext/store.js";
 import cloneDeep from "lodash-es/cloneDeep";
 import debounce from "lodash-es/debounce";
@@ -13,8 +11,6 @@ import { d as addLayoutItemToBreakPoints, e as cloneLayouts } from "../../../Gri
 import { k as isEqualLayouts } from "../../../GridLayout/utils.js";
 const createAreasStore = (initProps) => {
   const startProps = {
-    viwerClasses: useAreasViewerUtilityClasses(initProps.ownerState),
-    adminClasses: useAreasAdminUtilityClasses(initProps.ownerState),
     currentAreaId: "",
     currentModuleId: "",
     areasIds: [],
@@ -40,13 +36,11 @@ const createAreasStore = (initProps) => {
               get().areasActions.addArea();
               set((state) => {
                 state.ownerState.status = "loaded";
-                updateOwnerStateClasses(state);
               });
               return;
             }
             set((state) => {
               state.ownerState.status = "loading";
-              updateOwnerStateClasses(state);
             });
             const cookiePromise = getCookie({
               networkOperation: get().networkOperation,
@@ -90,7 +84,6 @@ const createAreasStore = (initProps) => {
             }).finally(() => {
               set((state) => {
                 state.ownerState.status = "loaded";
-                updateOwnerStateClasses(state);
               });
               if (get().areasIds.length > 0 && get().currentAreaId === "") {
                 const selectedAreaId = selectedAreaIdCookie && get().areasIds?.includes?.(selectedAreaIdCookie) ? selectedAreaIdCookie : get().areasIds[0];
@@ -213,7 +206,6 @@ const createAreasStore = (initProps) => {
           setExternalState: (newExternalState) => {
             set((state) => {
               state.ownerState = { ...state.ownerState, ...newExternalState };
-              updateOwnerStateClasses(state);
             });
           }
         },
@@ -361,7 +353,6 @@ const createAreasStore = (initProps) => {
                   title: true,
                   url_icon: true,
                   windowOptions: true,
-                  // layoutProps: false,
                   moduleId: true,
                   windowId: true,
                   mfProps: true,
@@ -619,158 +610,6 @@ const createAreasStore = (initProps) => {
               });
             });
           }
-          // addWindowLayoutPendiente: (
-          //     areaId: string,
-          //     windowId: string,
-          //     newWindow: NewLayoutMagnetizableProps,
-          // ) => {
-          //     const newLayoutItem: WinLayoutItem = {
-          //         ...newWindow.layoutProps,
-          //         i: windowId,
-          //         isDraggable: true,
-          //         isResizable: true,
-          //         winType: newWindow.winType,
-          //         freeMove: false,
-          //     };
-          //     set(state => {
-          //         const area = state.hashAreas[areaId];
-          //         if (!area) {
-          //             return;
-          //         }
-          //         const dynamicMFStore = createDynamicMFStore({
-          //             dynamicMFParameters: newWindow.dynamicParams,
-          //             windowId,
-          //         });
-          //         area.windowsLayouts.push(newLayoutItem);
-          //         area.hashWindowsLayouts[windowId] = {
-          //             ...newWindow,
-          //             areaId,
-          //             windowId,
-          //             emergeType: 'layout',
-          //             onClose: (removeLayoutId: string) => {
-          //                 get().areaActions.closeWindowLayout(areaId, removeLayoutId);
-          //             },
-          //             ...DEFAULT_WINDOW,
-          //             dynamicMFStore,
-          //         };
-          //         area.baseResponsivelayoutItems.push({ i: windowId });
-          //         //Agregar la ventana al hash general de todas las ventanas
-          //         state.hashWindows[windowId] = area.hashWindowsLayouts[windowId];
-          //         setAddBreakPoints(area, newLayoutItem);
-          //     });
-          //     get().areaActions.selectLayout(areaId, windowId);
-          //     if (
-          //         get().hashAreas[areaId].viewMode === 'single' ||
-          //         newWindow?.openType === 'maximized'
-          //     ) {
-          //         get().areaActions.maximizeLayout(areaId, windowId);
-          //     }
-          //     get().areaActions.saveLayouts(areaId);
-          //     get().areaActions.bouncedSaveBreakpointsLayouts(areaId);
-          // },
-          // closeLayout: (areaId: string, removePopUpId: string) => {
-          //     set(state => {
-          //         const area = state.hashAreas[areaId];
-          //         if (!area) {
-          //             return;
-          //         }
-          //         const removeIndex = area.windowsPopUps.findIndex(
-          //             wpId => wpId === removePopUpId,
-          //         );
-          //         if (removeIndex > -1) {
-          //             area.windowsPopUps.splice(removeIndex, 1);
-          //         }
-          //         delete area.hashWindowsPopups[removePopUpId];
-          //         delete state.hashWindows[removePopUpId];
-          //     });
-          // },
-          // selectWindowPopUp: (areaId: string, popUpId: string) => {
-          //     set(state => {
-          //         state.hashAreas[areaId].zPopUpIndex++;
-          //         state.hashAreas[areaId].currentPopUpId = popUpId;
-          //         state.hashAreas[areaId].zPopUpIndex++;
-          //         state.hashAreas[areaId].currentPopUpId = popUpId;
-          //         state.hashAreas[areaId].hashWindowsPopups[popUpId].zIndex =
-          //             state.hashAreas[areaId].zPopUpIndex;
-          //         //Seleccionar el layout padre si lo tiene
-          //         if (
-          //             state.hashAreas[areaId].hashWindowsPopups[popUpId].parentLayoutId &&
-          //             state.hashAreas[areaId].hashWindowsPopups[popUpId]
-          //                 .parentLayoutId !== ''
-          //         ) {
-          //             state.hashAreas[areaId].currentLayoutId =
-          //                 state.hashAreas[areaId].hashWindowsPopups[
-          //                     popUpId
-          //                 ].parentLayoutId;
-          //         } else {
-          //             state.hashAreas[areaId].currentLayoutId = '';
-          //         }
-          //     });
-          //     //Enfocar el componente despues de la renderización.
-          //     setTimeout(() => {
-          //         //Asegurar visibilidad si es un reemplazo
-          //         const container = document.getElementsByClassName(
-          //             `${areasViewerClasses.areaGridLayoutPanelContainer}-${areaId}`,
-          //         )[0];
-          //         const element = document.getElementsByClassName(
-          //             `${areasViewerClasses.windowPopupRoot}-${popUpId}`,
-          //         )[0]; //`M4L_WindowPopUp_${popUpId}`,
-          //         //TODO: Proteeccion de los vectores
-          //         if (element && container) {
-          //             const { top, left } = element.getBoundingClientRect();
-          //             const { top: containerTop, left: containerLeft } =
-          //                 container.getBoundingClientRect();
-          //             container.scrollTop = container.scrollTop + top - containerTop;
-          //             container.scrollLeft = container.scrollLeft + left - containerLeft;
-          //         }
-          //     }, 100);
-          //     // windowsPopUps.findIndex(wp => wp.container_id === lookForThisId) > -1) {
-          //     // setSelectedWindow(newSeletectedId);
-          // },
-          // resizeMaximixedLayout: (areaId: string) => {
-          //     set(state => {
-          //         const area = state.hashAreas[areaId];
-          //         if (!area) return;
-          //         if (areaId !== state.currentAreaId) {
-          //             return;
-          //         }
-          //         if (area.viewMode === 'single' && area.currentLayoutId !== '') {
-          //             console.log('Rezigning', areaId);
-          //             const layoutsBreakPoints = area.layouts;
-          //             const container = document.getElementsByClassName(
-          //                 `${areasViewerClasses.areaGridLayout}-${area.id}`,
-          //             )[0];
-          //             window.dispatchEvent(new Event('resize'));
-          //             for (const key in layoutsBreakPoints) {
-          //                 const layoutBreakpoint = layoutsBreakPoints[key];
-          //                 if (layoutBreakpoint) {
-          //                     const clientHeight = container.clientHeight;
-          //                     //Formula que sale de despejar de acuerdo al grid layout en el codigo fuente: heigthpx = colOrRowSize * gridUnits + Math.max(0, gridUnits - 1) * marginPx
-          //                     const heigthUnits =
-          //                         (clientHeight +
-          //                             MARGIN_GRIDLAYOUT -
-          //                             2 * PADDING_GRIDLAYOUT) /
-          //                         (ROW_HEIGTH_GRIDLAYOUT + MARGIN_GRIDLAYOUT);
-          //                     for (
-          //                         let index = 0;
-          //                         index < layoutBreakpoint.length;
-          //                         index++
-          //                     ) {
-          //                         const l = layoutBreakpoint[index];
-          //                         if (l.i === area.currentLayoutId) {
-          //                             l.h = heigthUnits;
-          //                             l.maxH = heigthUnits;
-          //                         }
-          //                     }
-          //                 }
-          //             }
-          //         }
-          //         //TODO: Corregir cuando arranca en celular,
-          //         // no se han cargado las ventanas y no se puede encontrar
-          //         // Adicionalmente no se ha posicionado el panelWindows, y calcula
-          //         // state.cols = MAXIMIZED_COLS;
-          //     });
-          // },
         },
         windowActions: {
           /**
@@ -958,7 +797,6 @@ const createAreasStore = (initProps) => {
           setFocus: (newValue) => {
             set((state) => {
               state.ownerState = { ...state.ownerState, focus: newValue };
-              updateOwnerStateClasses(state);
             });
           }
         }

package/components/areas/contexts/AreasContext/types.d.ts

@@ -1,8 +1,6 @@
 import { GetLabelType, NetworkProps } from '@m4l/core';
 import { ReactNode } from 'react';
 import { CookieType, HashWindowsByModals, ModalStateProps, AreaWindowAction, NewModalProps, NewLayoutMoveableProps, NewWindowProps, WinType, WindowStateProps, NewLayoutMagnetizableProps } from '../../types';
-import { ViwerClasses } from '../../components/AreasViewer/classes';
-import { AdminClasses } from '../../components/AreasAdmin/classes';
 import { DebouncedFunc } from 'lodash';
 import { LayoutItem } from '../../../GridLayout';
 import { ContainerChangeEvent } from '../../../GridLayout/subcomponents/Responsive/types';
@@ -94,11 +92,9 @@ export interface AreasState {
     /**
      *  "viwerClasses" enfocado al funcionamiento de las clases a nivel de viewer
      */
-    viwerClasses: ViwerClasses;
     /**
      *  "adminClasses" enfocado al funcionamiento de las clases a nivel de Admin
      */
-    adminClasses: AdminClasses;
     /**
      *  "windowsModals" id de ventans modales abiertas
      */

package/components/modal/classes/index.d.ts

@@ -8,7 +8,6 @@ export declare function getModalUtilityClass(slot: string): string;
 export declare const modalUtilityClasses: (ownerState: OwnerStateWindowConfirm) => {
     root: string;
     resizeHandle: string;
-    windowContent: string;
     windowBaseRoot: string;
     illustrationContainer: string;
     containerWindow: string;
@@ -21,4 +20,5 @@ export declare const modalUtilityClasses: (ownerState: OwnerStateWindowConfirm)
     messageContainer: string;
     illustration: string;
     windowConfirm: string;
+    windowContent: string;
 };

package/index.js

@@ -17,7 +17,7 @@ import { v as v2 } from "./components/animate/variants/bounce.js";
 import { v as v3 } from "./components/animate/variants/container.js";
 import { v as v4, a, b } from "./components/animate/variants/transition.js";
 import { A as A2 } from "./components/areas/components/AreasAdmin/AreasAdmin.js";
-import { A as A3 } from "./components/areas/components/AreasViewer/index.js";
+import { A as A3 } from "./components/areas/components/AreasViewer/AreasViewer.js";
 import { a as a2, W } from "./components/areas/contexts/WindowToolsMFContext/index.js";
 import { c as c2 } from "./components/areas/contexts/DynamicMFParmsContext/store.js";
 import { a as a3, A as A4 } from "./components/areas/contexts/AreasContext/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "9.1.117",
+  "version": "9.1.119",
   "license": "UNLICENSED",
   "lint-staged": {
     "*.{js,ts,tsx}": "eslint --fix --max-warnings 0"

package/components/areas/components/AreasAdmin/classes/index.js

@@ -1,69 +0,0 @@
-import { generateUtilityClasses } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../../../../utils/index.js";
-import { A as AREAS_ADMIN_CLASS_NAME } from "../../../constants.js";
-generateUtilityClasses(
-  AREAS_ADMIN_CLASS_NAME,
-  [
-    /* elements */
-    "root",
-    "rootContent",
-    "areaChipRoot",
-    "areaChipTitle",
-    "areaChipDeleteButton",
-    "areasAddButton",
-    "areaContainerChipEditButton",
-    "areaContainerChips",
-    "areaContainerContentChips",
-    "areaContainerChipsIcon",
-    "areaEditPopover",
-    "areaChipMobileRoot",
-    "areaChipMobileIconContainer",
-    "areaIconLayer",
-    "areaIconLayerContent",
-    "areaChipEditButton",
-    "areasPopoverMobileOptions",
-    "areasPopoverListWindows",
-    "areasPopoverListWindowsIcon",
-    "areaContentChips",
-    /* states or variants of elements */
-    "selected",
-    "isMobile",
-    "disabled",
-    "isFocus"
-  ],
-  AREAS_ADMIN_CLASS_NAME
-);
-const useAreasAdminUtilityClasses = (ownerState) => {
-  const slots = {
-    root: [
-      "root",
-      ownerState.status,
-      ownerState.isMobile && "isMobile",
-      ownerState.isSkeleton && "isSkeleton",
-      ownerState.focus && "isFocus"
-    ],
-    rootContent: ["rootContent"],
-    areaChipRoot: ["areaChipRoot"],
-    areaIconLayer: ["areaIconLayer"],
-    areaContainerChipsIcon: ["areaContainerChipsIcon"],
-    areaContainerChips: ["areaContainerChips"],
-    areaContainerContentChips: ["areaContainerContentChips"],
-    areaEditPopover: ["areaEditPopover"],
-    areaChipMobileRoot: ["areaChipMobileRoot"],
-    areaChipMobileIconContainer: ["areaChipMobileIconContainer"],
-    areaChipTitle: ["areaChipTitle"],
-    areaContainerChipEditButton: ["areaContainerChipEditButton"],
-    areaChipDeleteButton: ["areaChipDeleteButton"],
-    areaChipEditButton: ["areaChipEditButton"],
-    areasAddButton: ["areasAddButton"],
-    areasPopoverMobileOptions: ["areasPopoverMobileOptions"],
-    areasPopoverListWindows: ["areasPopoverListWindows"],
-    areasPopoverListWindowsIcon: ["areasPopoverListWindowsIcon"],
-    areaContentChips: ["areaContentChips"]
-  };
-  return unstable_composeClasses(slots, getComponentUtilityClass(AREAS_ADMIN_CLASS_NAME), {});
-};
-export {
-  useAreasAdminUtilityClasses as u
-};

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

@@ -1,7 +0,0 @@
-/**
-                                                                             * Muestra las áreas cargadas en el store, si no se han cargado muestra un componente indicando la carga.
-                                                                             * Se debe visualizar todas las areas, y con display:none para todas menos para la activa, para que no se tengan que estar montando y destruyendo
-                                                                             * las ventanas que al cambiar entre áreas
-                                                                             * @returns JSX Areas
-                                                                             */
-export declare function AreasViewer(): import("react/jsx-runtime").JSX.Element;

package/components/areas/components/AreasViewer/styles.d.ts

@@ -1 +0,0 @@
-export declare const AreasViewerRoot: 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/AreasViewer/styles.js

@@ -1,111 +0,0 @@
-import "react-resizable/css/styles.css";
-import { styled } from "@mui/material/styles";
-import { a as areasViewerClasses } from "./classes/index.js";
-const AreasViewerRoot = styled("div")`
-  /* display: flex; */
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  /* flex-grow: 1; */
-  position: relative;
-  //areaRoot
-  & .${areasViewerClasses.areaRoot} {
-    display: none;
-    position: absolute;
-    /* flex-grow: 1; */
-    flex-direction: row;
-    inset: 0;
-    /* width: 100%; */
-    overflow: hidden;
-    justify-content: top;
-    align-items: flex-start;
-    visibility: hidden;
-  }
-  & .${areasViewerClasses.areaRoot}.${areasViewerClasses.selected} {
-    display: block;
-    visibility: visible;
-  }
-  &.${areasViewerClasses.isMobile} .${areasViewerClasses.areaRoot} {
-  }
-  // areaGridLayoutPanelContainer
-  & .${areasViewerClasses.areaGridLayoutPanelContainer} {
-    display: flex;
-    flex-direction: row;
-    height: 100%;
-    width: 100%;
-    overflow: hidden;
-  }
-  &.${areasViewerClasses.isMobile} .${areasViewerClasses.areaGridLayoutPanelContainer} {
-    flex-direction: column-reverse;
-  }
-  // areaGridLayout
-  & .${areasViewerClasses.areaGridLayout} {
-    height: 100% !important;
-    overflow: auto;
-    flex-grow: 1;
-  }
-  &.${areasViewerClasses.isMobile} .${areasViewerClasses.areaGridLayout} {
-    flex-direction: column-reverse;
-    height: unset;
-    width: 100%;
-  }
-  // areaGridLayoutPopupsContainer
-  & .${areasViewerClasses.areaGridLayoutPopupsContainer} {
-    z-index: 1; //Garantizar q el contenedor de los popus este por encima de los layouts
-    //     // ' .react-draggable': {
-    //     //     position: 'absolute',
-    //     // },
-  }
-  // PanelWindowsRoot
-  & .${areasViewerClasses.panelWindowsRoot} {
-    display: flex;
-    flex-direction: column;
-    position: relative;
-  }
-  &.${areasViewerClasses.isMobile} .${areasViewerClasses.panelWindowsRoot} {
-    flex-direction: row;
-  }
-  // windowRoot
-  & .${areasViewerClasses.windowRoot} {
-    inset: 0;
-    position: absolute;
-    display: flex;
-    flex-direction: column;
-    /* height: 100%; */
-    /* width: 100%; */
-    overflow: hidden;
-    border: 1px solid gray;
-    background-color: ${(props) => props.theme.vars.palette.background.default};
-    padding: ${(props) => props.theme.spacing(0)};
-  }
-  & .${areasViewerClasses.windowRoot}.${areasViewerClasses.selected} {
-    border-top: 1px solid green;
-  }
-  // windowHeaderTitle
-  & .${areasViewerClasses.windowHeaderTitle} {
-    width: 100%;
-    max-width: 100%;
-    overflow: hidden;
-    white-space: nowrap;
-    color: ${(props) => props.theme.vars.palette.text.primary};
-    text-overflow: ellipsis;
-  }
-  // windowHeaderMainActions
-  & .${areasViewerClasses.windowHeaderMainActions} {
-    display: flex;
-    gap: 4px;
-  }
-  // windowHeaderMainActions
-  & .${areasViewerClasses.windowContent} {
-    flex-grow: 1;
-    position: relative;
-  }
-  // windowModalRoot
-  & .${areasViewerClasses.windowModalRoot} {
-    padding: 16px;
-  }
-  ${(props) => props.theme.components?.M4LAreasViewer?.styleOverrides}
-`;
-export {
-  AreasViewerRoot as A
-};

package/components/areas/components/AreasViewer/subcomponents/Area/index.js

@@ -1,28 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { I as InnerForHooks } from "./subcomponents/InnerForHooks/index.js";
-import clsx from "clsx";
-import { u as useAreasStore } from "../../../../hooks/useAreas/index.js";
-import { a as areasViewerClasses } from "../../classes/index.js";
-const Area = (props) => {
-  const { selected, areaId } = props;
-  const classesAreaRoot = useAreasStore((state) => state.viwerClasses.areaRoot);
-  const status = useAreasStore((state) => state.hashAreas[areaId].status);
-  if (status === "init") {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: clsx(
-        classesAreaRoot,
-        selected ? areasViewerClasses.selected : null,
-        status === "loading" ? areasViewerClasses.loading : null
-      ),
-      children: /* @__PURE__ */ jsx(InnerForHooks, { areaId })
-    }
-  );
-};
-Area.displayName = "Area";
-export {
-  Area as A
-};

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

@@ -1,5 +0,0 @@
-import { InnerForHooksProps } from './types';
-/**
- * TODO: Documentar
- */
-export declare const InnerForHooks: (props: InnerForHooksProps) => import("react/jsx-runtime").JSX.Element;

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/InnerForHooks/index.js

@@ -1,24 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { A as AreaGridLayout } from "../AreaGridLayout/index.js";
-import clsx from "clsx";
-import { a as areasViewerClasses } from "../../../../classes/index.js";
-import { u as useAreasStore } from "../../../../../../hooks/useAreas/index.js";
-import { L as LoadingError } from "../../../../../../../LoadingError/LoadingError.js";
-const InnerForHooks = (props) => {
-  const { areaId } = props;
-  const status = useAreasStore((state) => state.hashAreas[areaId].status);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: clsx(
-        areasViewerClasses.areaGridLayoutPanelContainer,
-        `${areasViewerClasses.areaGridLayoutPanelContainer}-${areaId}`
-      ),
-      children: status === "loaded" ? /* @__PURE__ */ jsx(AreaGridLayout, { areaId }) : /* @__PURE__ */ jsx(LoadingError, { status, action: () => {
-      } })
-    }
-  );
-};
-export {
-  InnerForHooks as I
-};

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

@@ -1,10 +0,0 @@
-import { PanelWindowsProps } from './types';
-/**
- * Funcion que se encarga de renderizar los botones que permiten cambiar de ventana o módulo
- * cuando el área está en modo single (maximizado o mobile)
- * @returns JSX
- */
-/**
- * TODO: Documentar
- */
-export declare const PanelWindows: (props: PanelWindowsProps) => import("react/jsx-runtime").JSX.Element | null;

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/PanelWindows/styles.d.ts

@@ -1,9 +0,0 @@
-interface WrapperWindowsPanelProps {
-    isDesktop: boolean;
-}
-export declare const WrapperWindowsPanel: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & WrapperWindowsPanelProps, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-interface WrapperWindowPanelProps {
-    selected: boolean;
-}
-export declare const WrapperWindowPanel: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & WrapperWindowPanelProps, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export {};

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/PanelWindows/types.d.ts

@@ -1,3 +0,0 @@
-export type PanelWindowsProps = {
-    areaId: string;
-};

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/styles.d.ts

@@ -1 +0,0 @@
-export declare const WindowRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

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

@@ -1,5 +0,0 @@
-import { HeaderProps } from './types';
-/**
- * TODO: Documentar
- */
-export declare function Header(props: HeaderProps): import("react/jsx-runtime").JSX.Element;

package/components/areas/components/AreasViewer/subcomponents/Area/subcomponents/Window/subcomponents/Header/styles.d.ts

@@ -1,4 +0,0 @@
-export declare const Container: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Separator: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Breadcrumbs: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ModuleActions: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;