@m4l/components 0.1.84 → 0.1.85

package/components/GridLayout/{index.c55f16eb.js → index.2383aaf9.js}

@@ -1,13 +1,13 @@
-import { useState, useRef, useEffect, useCallback } from "react";
+import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 import clsx from "clsx";
-import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.6c68811f.js";
+import { M as MemonizedGridItem } from "./subcomponents/Griditem/index.58168132.js";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { throttle } from "lodash";
+import { useResizeObserver } from "@m4l/graphics";
 import { styled, alpha } from "@mui/material/styles";
 import { r as react_resizable_css } from "../../react-resizable.ba08699a.js";
 import { generateUtilityClasses } from "@mui/material";
 import "@mui/base";
-import "@m4l/graphics";
-import "lodash";
 const COMPONENT_CLASS_NAME = "M4LGridLayout";
 const DEFAULT_COLS = 12;
 const DEFAULT_ROW_HEIGHT = 20;
@@ -453,8 +453,8 @@ function calcGridItemPosition(positionParams, x, y, w, h, maximize, state) {
     out.height = Math.round(state.resizing.height);
   } else {
     if (maximize === "maximize_me") {
-      out.width = positionParams.containerWidth - 2 * containerPadding[0] - 2;
-      out.height = positionParams.containerHeight - 2 * containerPadding[1] - 2;
+      out.width = positionParams.containerWidth - 2 * containerPadding[0] - 0;
+      out.height = positionParams.containerHeight - 2 * containerPadding[1] - 0;
     } else {
       out.width = calcGridItemWHPx(w, colWidth, containerMargin[0]);
       out.height = calcGridItemWHPx(h, rowHeight, containerMargin[1]);
@@ -551,8 +551,8 @@ const GridLayoutRoot = styled("div")`
     }
 
     .${gridLayoutClasses.gridItemRoot}.${gridLayoutClasses.gridItemPlaceholder} {
-        background: green;
-        opacity: 0.2;
+        background: ${(props) => props.theme.palette.state.toneOp};
+        opacity: 0.5;
         transition-duration: 100ms;
         z-index: 3000;
         -webkit-user-select: none;
@@ -961,6 +961,11 @@ function GridLayout(props) {
       onResize(newLayout, oldResizeItem, li, newPlaceholder, e, node);
     } catch (error) {
     }
+    console.log("GridLayout onresize");
+    if (e.type !== "touchmove") {
+      e.preventDefault();
+    }
+    e.stopPropagation();
   }, []);
   const localOnResizeStop = useCallback((i, _w, _h, {
     e,
@@ -1126,12 +1131,66 @@ function GridLayout(props) {
     children: [finalLayoutRender.map((li) => processGridItem(li, !!currentState.mounted)), placeholder()]
   });
 }
+function SizeProvider(ComposedComponent) {
+  return (props) => {
+    const {
+      measureBeforeMount = true,
+      ...rest
+    } = props;
+    const refMounted = useRef(false);
+    const [currentState, setCurrentState] = useState({
+      mounted: false,
+      width: DEFAULT_CONTAINER_WIDTH,
+      height: DEFAULT_CONTAINER_HEIGHT
+    });
+    const onWindowResizeMemo = useMemo(() => () => {
+      const node = elementRef.current;
+      console.log(`oooo`);
+      if (node instanceof HTMLElement && node.clientWidth) {
+        console.log(`onWindowResizeMemo w: ${node.offsetWidth} y:${node.offsetHeight}`);
+        setCurrentState((prev) => ({
+          ...prev,
+          width: node.clientWidth,
+          height: node.offsetHeight
+        }));
+      }
+    }, []);
+    const throttleResize = throttle(onWindowResizeMemo, THROTTLE_RESIZE_TIMEOUT, {
+      leading: false,
+      trailing: true
+    });
+    const onResize = useCallback((_target) => {
+      throttleResize();
+    }, []);
+    const elementRef = useResizeObserver(onResize);
+    useEffect(() => {
+      setCurrentState((prev) => ({
+        ...prev,
+        mounted: true
+      }));
+      refMounted.current = true;
+      onWindowResizeMemo();
+    }, []);
+    if (measureBeforeMount && !currentState.mounted) {
+      return /* @__PURE__ */ jsx("div", {
+        className: clsx(props.className, COMPONENT_CLASS_NAME),
+        style: props.style,
+        ref: elementRef
+      });
+    }
+    return /* @__PURE__ */ jsx(ComposedComponent, {
+      innerRef: elementRef,
+      containerWidth: currentState.width,
+      containerHeight: currentState.height,
+      ...rest
+    });
+  };
+}
 export {
   noop as A,
-  COMPONENT_CLASS_NAME as C,
   DEFAULT_COLS as D,
   GridLayout as G,
-  THROTTLE_RESIZE_TIMEOUT as T,
+  SizeProvider as S,
   calcGridItemWHPx as a,
   calcGridColWidth as b,
   calcXY as c,

package/components/GridLayout/index.d.ts

@@ -4,4 +4,4 @@ export { addLayoutItemToBreakPoints, addLayoutItemToBreakPointIfNoExists, cloneL
 export { isEqualLayouts, isEqualLayout } from './utils';
 export type { GridLayoutProps, LayoutItemRenderProps, Layout, LayoutItem, BaseLayoutItem, Layouts, } from './types';
 export type { ContainerChangeEvent } from './subcomponents/Responsive/types';
-export { SizeProvider } from './subcomponents/SizeProvider';
+export { SizeProvider } from './subcomponents/WidthProvider';

package/components/GridLayout/subcomponents/Griditem/{index.6c68811f.js → index.58168132.js}

@@ -1,7 +1,7 @@
 import React__default, { useRef, useEffect, useState, useCallback, useMemo } from "react";
 import { D as DraggableCore_1 } from "../../../../react-draggable.7abb5d0a.js";
 import { R as Resizable } from "../../../../react-resizable.ba08699a.js";
-import { g as getH, c as calcXY, a as calcGridItemWHPx, b as calcGridColWidth, d as calcWH, e as clamp, f as calcGridItemPosition, h as gridLayoutClasses, D as DEFAULT_COLS, i as DEFAULT_ROW_HEIGHT, j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, l as DEFAULT_MARGIN, m as DEFAULT_CONTAINER_PADDING, n as DEFAULT_TRANSFORM_SCALE, o as DEFAULT_COLAPSED_HEIGHT, p as perc, s as setTransform, q as setTopLeft } from "../../index.c55f16eb.js";
+import { g as getH, c as calcXY, a as calcGridItemWHPx, b as calcGridColWidth, d as calcWH, e as clamp, f as calcGridItemPosition, h as gridLayoutClasses, D as DEFAULT_COLS, i as DEFAULT_ROW_HEIGHT, j as DEFAULT_CONTAINER_WIDTH, k as DEFAULT_CONTAINER_HEIGHT, l as DEFAULT_MARGIN, m as DEFAULT_CONTAINER_PADDING, n as DEFAULT_TRANSFORM_SCALE, o as DEFAULT_COLAPSED_HEIGHT, p as perc, s as setTransform, q as setTopLeft } from "../../index.2383aaf9.js";
 import clsx from "clsx";
 import { d as deepEqual } from "../../../../node_modules.d73a220d.js";
 import { jsx, Fragment } from "react/jsx-runtime";

package/components/GridLayout/subcomponents/Responsive/{index.a6e33b8d.js → index.a6642437.js}

@@ -1,4 +1,4 @@
-import { r as cloneLayoutItem, t as cloneLayout, u as compact, v as correctBounds, w as isEqualLayout, x as DEFAULT_RESPONSIVE_BREAKPOINTS, m as DEFAULT_CONTAINER_PADDING, l as DEFAULT_MARGIN, y as DEFAULT_RESPONSIVE_COLS, o as DEFAULT_COLAPSED_HEIGHT, i as DEFAULT_ROW_HEIGHT, z as isEqualLayouts, G as GridLayout, A as noop } from "../../index.c55f16eb.js";
+import { r as cloneLayoutItem, t as cloneLayout, u as compact, v as correctBounds, w as isEqualLayout, x as DEFAULT_RESPONSIVE_BREAKPOINTS, m as DEFAULT_CONTAINER_PADDING, l as DEFAULT_MARGIN, y as DEFAULT_RESPONSIVE_COLS, o as DEFAULT_COLAPSED_HEIGHT, i as DEFAULT_ROW_HEIGHT, z as isEqualLayouts, G as GridLayout, A as noop } from "../../index.2383aaf9.js";
 import { useState, useRef, useEffect, useCallback } from "react";
 import { useFirstRender } from "@m4l/graphics";
 import { d as deepEqual } from "../../../../node_modules.d73a220d.js";

package/components/HelperText/{index.a47ff233.js → index.8b5911d1.js}

@@ -1,25 +1,26 @@
 import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.d1402200.js";
+import "../Icon/index.c3a579e7.js";
 import "clsx";
 import { jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.62aea582.js";
+import "../mui_extended/IconButton/index.be111a34.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.46771196.js";
+import "../mui_extended/Accordion/index.854f4c90.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/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
 import "../mui_extended/CheckBox.38abccd8.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.2493b1b1.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.a7f87c96.js";
-import "../mui_extended/Tab/index.756fe693.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const HelperTextRoot = styled("div")(({

package/components/Icon/{index.d1402200.js → index.c3a579e7.js}

@@ -3,7 +3,7 @@ import { styled, generateUtilityClasses, generateUtilityClass, Skeleton } from "
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
 import { useEnvironment } from "@m4l/core";
-import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.327679a6.js";
+import { u as useSideBar, g as getNameDataTestId$1 } from "../SideBar/index.e0587639.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { unstable_composeClasses } from "@mui/base";
 const IconRoot = styled("div")(({

package/components/LanguagePopover/{index.807f5272.js → index.7681b08e.js}

@@ -3,12 +3,12 @@ import { styled, generateUtilityClasses, generateUtilityClass, Stack, MenuItem }
 import { I as Image } from "../Image/index.c18ebf5a.js";
 import { useLocales } from "@m4l/graphics";
 import { useEnvironment, useNetwork } from "@m4l/core";
-import "../Icon/index.d1402200.js";
+import "../Icon/index.c3a579e7.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import "clsx";
 import { jsxs, jsx } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.62aea582.js";
-import "../mui_extended/Accordion/index.46771196.js";
+import "../mui_extended/IconButton/index.be111a34.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "react-router-dom";
@@ -16,12 +16,13 @@ import "@mui/material/Button";
 import { I as ImageButton } from "../mui_extended/Button/index.40af964e.js";
 import "../mui_extended/CheckBox.38abccd8.js";
 import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.2493b1b1.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.a7f87c96.js";
-import "../mui_extended/Tab/index.756fe693.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const LanguagePopoverRoot = styled("div")(({

package/components/ModalDialog/{index.42e804cf.js → index.b85ee3cb.js}

@@ -1,14 +1,14 @@
 import { useTheme, Dialog, Paper } from "@mui/material";
 import { c as cjs } from "../../react-draggable.7abb5d0a.js";
-import { u as useModal } from "../../hooks/useModal/index.7611bf21.js";
+import { u as useModal } from "../../hooks/useModal/index.c906706c.js";
 import { R as ResizeableWindow } from "../Resizeable/index.9a9c79a4.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import { I as Icon } from "../Icon/index.d1402200.js";
+import { I as Icon } from "../Icon/index.c3a579e7.js";
 import { useEnvironment } from "@m4l/core";
 import { I as ICONS } from "../areas/icons.8266ccc8.js";
-import { m as modalUtilityClasses } from "../modal/index.6f281ef8.js";
+import { m as modalUtilityClasses } from "../modal/index.c7e4beba.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.e70e8779.js";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.c91c27f9.js";
 const DragabblePaperComponent = (props) => {
   return /* @__PURE__ */ jsx(cjs.exports, {
     handle: ".m4l_draggable_handle",

package/components/NavLink/{index.ff5a939c.js → index.bb879650.js}

@@ -2,25 +2,26 @@ import { NavLink as NavLink$1 } from "react-router-dom";
 import { generateUtilityClasses, generateUtilityClass, styled } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.d1402200.js";
+import "../Icon/index.c3a579e7.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import "clsx";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.62aea582.js";
+import "../mui_extended/IconButton/index.be111a34.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.46771196.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Avatar/index.75e6ed57.js";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
 import "../mui_extended/CheckBox.38abccd8.js";
-import "../mui_extended/Badge/index.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.2493b1b1.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.a7f87c96.js";
-import "../mui_extended/Tab/index.756fe693.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const componentName = "M4LNavLink";

package/components/NoItemSelected/classes/constants.d.ts

@@ -0,0 +1 @@
+export declare const componentName = "M4LNoItemSelected";

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

@@ -0,0 +1,6 @@
+import { NoItemSelectedClassesType } from './types';
+export declare const noItemSelectedClasses: NoItemSelectedClassesType;
+export declare function getNoItemSelectedUtilityClass(slot: string): string;
+export declare const useNoItemSelectedUtilityClasses: () => {
+    root: string;
+};

package/components/NoItemSelected/classes/types.d.ts

@@ -0,0 +1,6 @@
+import { useNoItemSelectedUtilityClasses } from ".";
+export interface NoItemSelectedClassesType {
+    root: string;
+}
+export declare type NoItemSelectedClassesKey = keyof NoItemSelectedClassesType;
+export declare type Classes = ReturnType<typeof useNoItemSelectedUtilityClasses>;

package/components/NoItemSelected/{index.23dfc897.js → index.a2807715.js}

@@ -1,20 +1,14 @@
 import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { styled } from "@mui/material/styles";
 import { I as Image } from "../Image/index.c18ebf5a.js";
-import { Skeleton } from "@mui/material";
+import { generateUtilityClasses, generateUtilityClass, Skeleton } from "@mui/material";
 import { useMemo } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { unstable_composeClasses } from "@mui/base";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 const WrapperNoItemSelected = styled("div")(({
   theme
 }) => ({
-  width: "100%",
-  maxWidth: "400px",
-  minWidth: "300px",
-  display: "flex",
-  flexDirection: "column",
-  alignItems: "center",
-  justifyContent: "center",
-  padding: theme.spacing(3)
+  ...theme.components?.M4LNoItemSelected?.styleOverrides
 }));
 const Img = styled(Image)(() => ({
   display: "flex"
@@ -34,7 +28,27 @@ const WrapperSKTNoItemSelected = styled("div")(() => ({
   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`,
   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`
 }));
-function NoItemSelected() {
+const componentName = "M4LNoItemSelected";
+generateUtilityClasses(componentName, [
+  "root"
+]);
+function getNoItemSelectedUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const useNoItemSelectedUtilityClasses = () => {
+  const slots = {
+    root: ["root"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getNoItemSelectedUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+function NoItemSelected(props) {
+  const {
+    image,
+    message
+  } = props;
   const {
     host_static_assets,
     environment_assets
@@ -43,29 +57,30 @@ function NoItemSelected() {
     getLabel
   } = useModuleDictionary();
   const isSkeleton = useModuleSkeleton();
-  const src = useMemo(() => {
+  const defaultImage = useMemo(() => {
     return `${host_static_assets}/${environment_assets}/frontend/components/no_item_selected/assets/icons/no_selected.svg`;
   }, []);
-  if (isSkeleton) {
-    return /* @__PURE__ */ jsx(WrapperNoItemSelected, {
-      id: "WrapperNoItemSelected",
-      children: /* @__PURE__ */ jsx(WrapperSKTNoItemSelected, {
-        id: "WrapperSKTNoItemSelected",
-        children: /* @__PURE__ */ jsx(Skeleton, {
-          variant: "rectangular",
-          width: "100%",
-          height: "100%"
-        })
+  const classes = useNoItemSelectedUtilityClasses();
+  return /* @__PURE__ */ jsx(WrapperNoItemSelected, {
+    className: classes.root,
+    children: !isSkeleton ? /* @__PURE__ */ jsxs(Fragment, {
+      children: [!image ? /* @__PURE__ */ jsx(Img, {
+        src: defaultImage
+      }) : /* @__PURE__ */ jsx(Img, {
+        src: image
+      }), !message ? /* @__PURE__ */ jsx(Label, {
+        children: getLabel("no_item_selected.message")
+      }) : /* @__PURE__ */ jsx(Label, {
+        children: message
+      })]
+    }) : /* @__PURE__ */ jsx(WrapperSKTNoItemSelected, {
+      id: "WrapperSKTNoItemSelected",
+      children: /* @__PURE__ */ jsx(Skeleton, {
+        variant: "rectangular",
+        width: "100%",
+        height: "100%"
       })
-    });
-  }
-  return /* @__PURE__ */ jsxs(WrapperNoItemSelected, {
-    id: "WrapperNoItemSelected",
-    children: [/* @__PURE__ */ jsx(Img, {
-      src
-    }), /* @__PURE__ */ jsx(Label, {
-      children: getLabel("no_item_selected.message")
-    })]
+    })
   });
 }
 function getNoItemSelectedComponentsDictionary() {

package/components/NoItemSelected/index.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="react" />
-export declare function NoItemSelected(): import("react").JSX.Element;
+import { NoItemSelectedProps } from './types';
+export declare function NoItemSelected(props: NoItemSelectedProps): import("react").JSX.Element;

package/components/NoItemSelected/types.d.ts

@@ -0,0 +1,4 @@
+export interface NoItemSelectedProps {
+    image?: string;
+    message?: string;
+}

package/components/ObjectLogs/{index.dc02715d.js → index.2ed38a84.js}

@@ -1,54 +1,57 @@
 import { useState, useEffect, useCallback, useMemo } from "react";
 import { useNetwork, useModuleDictionary, useEnvironment, usePaginate } from "@m4l/core";
 import { styled } from "@mui/material/styles";
-import { c as DataGrid, g as getDataGridComponentsDictionary } from "../DataGrid/index.1d0a3dec.js";
+import { c as DataGrid, g as getDataGridComponentsDictionary } from "../DataGrid/index.37e14e83.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.7611bf21.js";
-import { I as Icon } from "../Icon/index.d1402200.js";
+import { u as useModal } from "../../hooks/useModal/index.c906706c.js";
+import { I as Icon } from "../Icon/index.c3a579e7.js";
 import "../../react-draggable.7abb5d0a.js";
 import "../Resizeable/index.9a9c79a4.js";
-import "../modal/index.6f281ef8.js";
-import "../CommonActions/components/Actions/index.e70e8779.js";
+import "../modal/index.c7e4beba.js";
+import "../CommonActions/components/Actions/index.c91c27f9.js";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
 import "clsx";
 import "react-hook-form";
-import "../mui_extended/IconButton/index.62aea582.js";
+import "../mui_extended/IconButton/index.be111a34.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.230d1584.js";
-import "../areas/components/AreasAdmin/index.8ab71eb9.js";
+import "../areas/contexts/AreasContext/index.6f56b1da.js";
+import "../areas/components/AreasAdmin/index.f505897a.js";
 import "zustand/shallow";
-import "../ScrollBar/index.d4410cb5.js";
-import "../mui_extended/Accordion/index.46771196.js";
+import "../ScrollBar/index.1247c1c5.js";
+import "../mui_extended/Accordion/index.854f4c90.js";
 import "../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.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.2493b1b1.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.a7f87c96.js";
-import "../mui_extended/Tab/index.756fe693.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
-import "../areas/components/AreasViewer/index.933e506b.js";
+import "../areas/components/AreasViewer/index.cacec884.js";
 import "../LinearProgressIndeterminate/index.60dabc06.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
-import { W as WindowBase } from "../modal/WindowBase.37158e8d.js";
-import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.912679cc.js";
+import { W as WindowBase } from "../modal/WindowBase.d485315d.js";
+import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.a8c2609c.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 const Container$1 = styled("div")(() => ({
   height: "100%",
   width: "100%",
   display: "flex",
   flexDirection: "column",
-  justifyContent: "flex-start"
+  justifyContent: "flex-start",
+  gap: "4px",
+  padding: "4px"
 }));
 const Actions = styled("div")(({
   theme

package/components/PaperForm/{index.249c2404.js → index.989377a5.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.d1402200.js";
+import { I as Icon } from "../Icon/index.c3a579e7.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { unstable_composeClasses } from "@mui/base";
 const PaperFormRoot = styled("div")(({

package/components/Period/{index.e129cdec.js → index.061c9b2f.js}

@@ -1,38 +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.d1402200.js";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.e70e8779.js";
+import { I as Icon } from "../Icon/index.c3a579e7.js";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.c91c27f9.js";
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import "@mui/material/Button";
 import "../mui_extended/Button/index.40af964e.js";
 import "clsx";
 import "react-hook-form";
-import "../../contexts/ModalContext/index.51da83de.js";
+import "../../contexts/ModalContext/index.1ea79d7e.js";
 import "../../react-draggable.7abb5d0a.js";
 import "../Resizeable/index.9a9c79a4.js";
 import "@m4l/graphics";
-import "../modal/index.6f281ef8.js";
+import "../modal/index.c7e4beba.js";
 import "../Image/index.c18ebf5a.js";
-import "../mui_extended/IconButton/index.62aea582.js";
-import "../mui_extended/Accordion/index.46771196.js";
+import "../mui_extended/IconButton/index.be111a34.js";
+import "../mui_extended/Accordion/index.854f4c90.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.cad260fe.js";
+import "../mui_extended/Badge/index.8c2b8b66.js";
 import "@mui/lab";
-import "../mui_extended/MenuActions/index.2493b1b1.js";
+import "../mui_extended/MenuActions/index.b16e84c1.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Pager/index.a7f87c96.js";
-import "../mui_extended/Tab/index.756fe693.js";
+import "../mui_extended/Stack/index.0e53197c.js";
+import "../mui_extended/Tab/index.c1dc7bbf.js";
+import "../mui_extended/Pager/index.5b77fa4c.js";
 import "../mui_extended/Tooltip/index.5a795dcd.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.230d1584.js";
-import "../areas/components/AreasAdmin/index.8ab71eb9.js";
+import "../areas/contexts/AreasContext/index.6f56b1da.js";
+import "../areas/components/AreasAdmin/index.f505897a.js";
 import "zustand/shallow";
-import "../ScrollBar/index.d4410cb5.js";
-import "../areas/components/AreasViewer/index.933e506b.js";
+import "../ScrollBar/index.1247c1c5.js";
+import "../areas/components/AreasViewer/index.cacec884.js";
 import "../LinearProgressIndeterminate/index.60dabc06.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";

package/components/PropertyValue/{index.93e40532.js → index.ac46f441.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.1af105d6.js";
+import { g as getNameDataTestId } from "../../vendor.f27b86c9.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useModuleSkeleton } from "@m4l/core";