@m4l/components 0.1.75 → 0.1.76

package/components/ModalDialog/{index.f652ea12.js → index.d9c5d400.js}

@@ -1,16 +1,16 @@
-import { Dialog, Paper } from "@mui/material";
-import { c as cjs } from "../../react-draggable.e625b0d1.js";
-import { u as useModal } from "../../hooks/useModal/index.26075cdd.js";
+import { useTheme, Dialog, Paper } from "@mui/material";
+import { c as cjs } from "../../react-draggable.6d7949a3.js";
+import { u as useModal } from "../../hooks/useModal/index.7b7d26ba.js";
 import { styled } from "@mui/material/styles";
-import { a as getThemeVariantColor } from "../../utils/index.b61dccbe.js";
-import { R as ResizeableWindow } from "../Resizeable/index.41a8048b.js";
+import { a as getThemeVariantColor } from "../../utils/index.008b4c2a.js";
+import { R as ResizeableWindow } from "../Resizeable/index.f6e48e56.js";
 import { useResponsiveDesktop } from "@m4l/graphics";
-import { I as Icon } from "../Icon/index.f9119f5e.js";
+import { I as Icon } from "../Icon/index.9dae8337.js";
 import { useEnvironment } from "@m4l/core";
-import { I as ICONS } from "../areas/icons.3ec589d3.js";
+import { I as ICONS } from "../areas/icons.19cde4b4.js";
+import { m as modalUtilityClasses } from "../modal/index.1b25b61d.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.37ffde59.js";
-const WrapperDialog = styled(Dialog)(() => ({}));
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.e376a68e.js";
 const Container = styled("div")(({ theme }) => ({
   display: "flex",
   flexDirection: "column",
@@ -88,19 +88,28 @@ const ModalDialog = () => {
     maxWidth,
     maxHeigth,
     window,
-    fullScreen
+    fullScreen,
+    variant
   } = useModal();
   const isDesktop = useResponsiveDesktop();
   const {
     host_static_assets,
     environment_assets
   } = useEnvironment();
+  const theme = useTheme();
+  const classes = modalUtilityClasses({
+    variant
+  });
   const contentComnponent = /* @__PURE__ */ jsx(Container, {
-    id: "Container",
+    className: classes.containerWindow,
     children: typeof window === "function" ? window() : window
   });
-  return /* @__PURE__ */ jsxs(WrapperDialog, {
+  return /* @__PURE__ */ jsxs(Dialog, {
     open,
+    className: classes.root,
+    sx: {
+      ...theme.components?.M4LModalDialog?.styleOverrides
+    },
     "aria-labelledby": "child-modal-title",
     "aria-describedby": "child-modal-description",
     PaperComponent: isDesktop ? DragabblePaperComponent : PaperComponent,

package/components/NavLink/{index.f8aee9f4.js → index.21c8fd90.js}

@@ -2,23 +2,24 @@ import { NavLink as NavLink$1 } from "react-router-dom";
 import { generateUtilityClasses, generateUtilityClass, styled } from "@mui/material";
 import "react";
 import "@m4l/core";
-import "../Icon/index.f9119f5e.js";
+import "../Icon/index.9dae8337.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.3b05af71.js";
+import "../mui_extended/IconButton/index.1a9d4fa5.js";
 import "@m4l/graphics";
-import "../mui_extended/Accordion/index.03bd0e2a.js";
-import "../mui_extended/Avatar/index.1e1a91a3.js";
+import "../mui_extended/Accordion/index.3faafd8b.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.aebbab34.js";
-import "../Image/index.8aae9322.js";
+import "../mui_extended/Button/index.fdb5dcbd.js";
+import "../Image/index.c18ebf5a.js";
 import "@mui/lab";
-import { T as Typography } from "../mui_extended/Typography/index.443590d6.js";
 import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/MenuActions/index.ca5ce35a.js";
-import "../mui_extended/Pager/index.80ec975a.js";
-import "../mui_extended/Tab/index.e0653a0a.js";
+import "../mui_extended/MenuActions/index.ba1da3b3.js";
+import "../mui_extended/Pager/index.67bda2c5.js";
+import "../mui_extended/Tab/index.9e2f6e34.js";
+import "../mui_extended/Tooltip/index.5a795dcd.js";
 import { unstable_composeClasses } from "@mui/base";
 const componentName = "M4LNavLink";
 generateUtilityClasses(componentName, [

package/components/NoItemSelected/{index.cce86db4.js → index.23dfc897.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.8aae9322.js";
+import { I as Image } from "../Image/index.c18ebf5a.js";
 import { Skeleton } from "@mui/material";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/components/ObjectLogs/{index.c31b3f8b.js → index.a2709fc2.js}

@@ -1,36 +1,46 @@
 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.c0c626cd.js";
+import { D as DataGrid, g as getDataGridComponentsDictionary } from "../DataGrid/index.ffaf000e.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.26075cdd.js";
-import { I as Icon } from "../Icon/index.f9119f5e.js";
-import "../../react-draggable.e625b0d1.js";
-import "../ModalDialog/index.f652ea12.js";
-import "../Resizeable/index.41a8048b.js";
-import "../CommonActions/components/Actions/index.37ffde59.js";
+import { u as useModal } from "../../hooks/useModal/index.7b7d26ba.js";
+import { I as Icon } from "../Icon/index.9dae8337.js";
+import "../../react-draggable.6d7949a3.js";
+import "../ModalDialog/index.d9c5d400.js";
+import "../Resizeable/index.f6e48e56.js";
+import "../modal/index.1b25b61d.js";
+import "../CommonActions/components/Actions/index.e376a68e.js";
 import "@mui/material/Button";
-import "../mui_extended/Button/index.aebbab34.js";
+import "../mui_extended/Button/index.fdb5dcbd.js";
 import "clsx";
 import "react-hook-form";
-import "../mui_extended/IconButton/index.3b05af71.js";
+import "../mui_extended/IconButton/index.1a9d4fa5.js";
 import "zustand";
-import "../areas/contexts/AreasContext/index.d98b89fc.js";
-import "../areas/components/AreasAdmin/index.158621e0.js";
+import "../areas/contexts/AreasContext/index.f0397b7c.js";
+import "../areas/components/AreasAdmin/index.946eebb9.js";
 import "zustand/shallow";
 import "../ScrollBar/index.bbe48f4d.js";
-import "../areas/components/AreasViewer/index.621c0de4.js";
+import "../mui_extended/Accordion/index.3faafd8b.js";
+import "../mui_extended/Typography/index.443590d6.js";
+import "../mui_extended/Avatar/index.75e6ed57.js";
+import "react-router-dom";
+import "../Image/index.c18ebf5a.js";
+import "@mui/lab";
+import "../mui_extended/Popover/index.9f35d0eb.js";
+import "../mui_extended/MenuActions/index.ba1da3b3.js";
+import "../mui_extended/Pager/index.67bda2c5.js";
+import "../mui_extended/Tab/index.9e2f6e34.js";
+import "../mui_extended/Tooltip/index.5a795dcd.js";
+import "../areas/components/AreasViewer/index.bf4191ea.js";
+import "../LinearProgressIndeterminate/index.d34d398f.js";
 import "../areas/contexts/WindowToolsMFContext/index.8f3e2a04.js";
 import "../areas/contexts/DynamicMFParmsContext/index.1607c78e.js";
-import "@mui/lab";
-import "../mui_extended/Typography/index.443590d6.js";
-import "../modal/WindowConfirm.023e293f.js";
-import { W as WindowBase } from "../modal/WindowBase.c223e4da.js";
-import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.3034c6ba.js";
+import { W as WindowBase } from "../modal/WindowBase.7acb9f1d.js";
+import { D as DynamicFilter, g as getDynamicFilterComponentsDictionary } from "../DynamicFilter/index.d7c03a61.js";
 const Container$1 = styled("div")(() => ({
   height: "100%",
   width: "100%",
@@ -241,28 +251,28 @@ function ObjectLogs(props) {
         automatic: false,
         fields: [{
           name: "user_logs.created_at",
-          dictionaryId: getLabel("object_logs.created_at"),
+          dictionaryId: "object_logs.created_at",
           type: "datetime",
           multiple: false,
           presence: "fixed",
           urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/email.svg`
         }, {
           name: "users.email",
-          dictionaryId: getLabel("object_logs.email"),
+          dictionaryId: "object_logs.email",
           type: "string",
           multiple: true,
           presence: "optional",
           urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/email.svg`
         }, {
           name: "user_logs.log_preview",
-          dictionaryId: getLabel("object_logs.log_preview"),
+          dictionaryId: "object_logs.log_preview",
           type: "string",
           multiple: true,
           presence: "optional",
           urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/log_preview.svg`
         }, {
           name: "user_logs.log_detail",
-          dictionaryId: getLabel("object_logs.log_detail"),
+          dictionaryId: "object_logs.log_detail",
           type: "string",
           multiple: true,
           presence: "optional",

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

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

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

@@ -0,0 +1,11 @@
+import { PaperFormClassesType } from './types';
+export declare const periodClasses: PaperFormClassesType;
+export declare function getPaperFormUtilityClass(slot: string): string;
+export declare const paperFormUtilityClasses: () => {
+    root: string;
+    content: string;
+    headerContainer: string;
+    iconTitleContainer: string;
+    iconHeaderContainer: string;
+    skeletonContainer: string;
+};

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

@@ -0,0 +1,10 @@
+import { paperFormUtilityClasses } from ".";
+export interface PaperFormClassesType {
+    root: string;
+    headerContainer: string;
+    iconTitleContainer: string;
+    iconHeaderContainer: string;
+    skeletonContainer: string;
+}
+export declare type PaperFormClassesKey = keyof PaperFormClassesType;
+export declare type Classes = ReturnType<typeof paperFormUtilityClasses>;

package/components/PaperForm/{index.d79c6f76.js → index.5e1bc99f.js}

@@ -1,9 +1,10 @@
 import { styled } from "@mui/material/styles";
 import { useModuleSkeleton } from "@m4l/core";
-import { Skeleton } from "@mui/material";
-import { I as Icon } from "../Icon/index.f9119f5e.js";
-import { jsxs, jsx } from "react/jsx-runtime";
-const WrapperPaper = styled("div")(({
+import { Skeleton, generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { I as Icon } from "../Icon/index.9dae8337.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { unstable_composeClasses } from "@mui/base";
+const PaperFormRoot = styled("div")(({
   theme
 }) => ({
   display: "flex",
@@ -15,7 +16,8 @@ const WrapperPaper = styled("div")(({
     boxShadow: theme.shadows[8],
     padding: theme.spacing(3),
     backgroundColor: theme.palette.background.paper
-  }
+  },
+  ...theme.components?.M4LPaperForm?.styleOverrides
 }));
 const HeaderContainer = styled("div")(({
   theme
@@ -65,44 +67,75 @@ const SkTPaperFormHeader = styled("div")(({
 const Header = (props) => {
   const {
     urlIcon,
-    title
+    title,
+    classes
   } = props;
   const isSkeleton = useModuleSkeleton();
-  return isSkeleton ? /* @__PURE__ */ jsxs(SkTPaperFormHeader, {
-    children: [/* @__PURE__ */ jsx(Skeleton, {
-      variant: "circular",
-      width: 16,
-      height: 16
-    }), /* @__PURE__ */ jsx(Skeleton, {
-      variant: "text",
-      width: 68,
-      height: 14
-    })]
-  }) : /* @__PURE__ */ jsx(HeaderContainer, {
+  return /* @__PURE__ */ jsx(HeaderContainer, {
     id: "Header",
-    children: /* @__PURE__ */ jsxs(IconTitleContainer, {
-      className: "m4l_draggable_handle",
-      children: [/* @__PURE__ */ jsx(IconHeader, {
+    className: classes.headerContainer,
+    children: !isSkeleton ? /* @__PURE__ */ jsxs(IconTitleContainer, {
+      className: classes.iconTitleContainer,
+      children: [urlIcon ? /* @__PURE__ */ jsx(IconHeader, {
+        className: classes.iconHeaderContainer,
         children: /* @__PURE__ */ jsx(Icon, {
           src: urlIcon
         })
-      }), title]
+      }) : null, title]
+    }) : /* @__PURE__ */ jsxs(SkTPaperFormHeader, {
+      className: classes.skeletonContainer,
+      children: [/* @__PURE__ */ jsx(Skeleton, {
+        variant: "circular",
+        width: 16,
+        height: 16
+      }), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "text",
+        width: 68,
+        height: 14
+      })]
     })
   });
 };
+const componentName = "M4LPaperForm";
+generateUtilityClasses(componentName, [
+  "root",
+  "headerContainer",
+  "iconTitleContainer",
+  "iconHeaderContainer",
+  "skeletonContainer"
+]);
+function getPaperFormUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const paperFormUtilityClasses = () => {
+  const slots = {
+    root: ["root"],
+    headerContainer: ["headerContainer"],
+    iconTitleContainer: ["iconTitleContainer"],
+    iconHeaderContainer: ["iconHeaderContainer"],
+    skeletonContainer: ["skeletonContainer"],
+    content: ["content"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getPaperFormUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
 function PaperForm(props) {
   const {
     urlIcon,
     title,
     children
   } = props;
-  return /* @__PURE__ */ jsxs(WrapperPaper, {
-    id: "ContainerPropertyValue",
+  const classes = paperFormUtilityClasses();
+  return /* @__PURE__ */ jsxs(PaperFormRoot, {
+    className: classes.root,
     children: [/* @__PURE__ */ jsx(Header, {
       urlIcon,
-      title
+      title,
+      classes
     }), /* @__PURE__ */ jsx(Content, {
-      id: "Content",
+      className: classes.content,
       children
     })]
   });

package/components/PaperForm/types.d.ts

@@ -1,7 +1,10 @@
 import type { ReactNode } from 'react';
+import { Classes } from './classes/types';
 export interface PaperFormProps {
-    urlIcon: string;
+    urlIcon?: string;
     title: string;
     children: ReactNode;
 }
-export declare type HeaderProps = Omit<PaperFormProps, 'children'>;
+export interface HeaderProps extends Omit<PaperFormProps, 'children'> {
+    classes: Classes;
+}

package/components/Period/Period.d.ts

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

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

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

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

@@ -0,0 +1,10 @@
+import { PeriodClassesType } from './types';
+import { OwnerState } from '../types';
+export declare const periodClasses: PeriodClassesType;
+export declare function getPeriodUtilityClass(slot: string): string;
+export declare const periodUtilityClasses: (ownerState: OwnerState) => {
+    root: string;
+    gap: string;
+    containerDateLabel: string;
+    containerDateValue: string;
+};

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

@@ -0,0 +1,13 @@
+import { periodUtilityClasses } from ".";
+export interface PeriodClassesType {
+    root: string;
+    gap: string;
+    containerDateLabel: string;
+    containerDateValue: string;
+    stateError: string;
+    stateReadOnly: string;
+    variantMonoperiod: string;
+    variantMultiperiod: string;
+}
+export declare type PeriodClassesKey = keyof PeriodClassesType;
+export declare type Classes = ReturnType<typeof periodUtilityClasses>;