@m4l/components 0.2.14 → 0.2.16

package/@types/export.d.ts

@@ -167,6 +167,9 @@ declare module '@mui/material/styles' {
         M4LAreasAdmin?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LAreasAdmin'];
         };
+        M4LDragResizeWindow?: {
+            styleOverrides?: ComponentsOverrides<Theme>['M4LDragResizeWindow'];
+        };
         M4LDynamicFilter?: {
             styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilter'];
         };

package/components/AccountPopover/{index.7060320a.js → index.34362031.js}

@@ -1,30 +1,14 @@
 import { useEnvironment, useModuleDictionary, useNetwork } from "@m4l/core";
 import { useState, useEffect } from "react";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { generateUtilityClasses, generateUtilityClass, styled, useTheme, ButtonBase } from "@mui/material";
-import { I as Icon } from "../Icon/index.e215d0f0.js";
+import { unstable_composeClasses } from "@mui/base";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import "../mui_extended/IconButton/index.5afe56b7.js";
-import clsx from "clsx";
-import "@m4l/graphics";
-import "../mui_extended/Accordion/index.3087f40e.js";
-import "../mui_extended/Typography/index.443590d6.js";
 import { A as Avatar } from "../mui_extended/Avatar/index.75e6ed57.js";
-import "react-router-dom";
-import "@mui/material/Button";
-import "../mui_extended/Button/index.0f2552ed.js";
-import "../mui_extended/CheckBox.38abccd8.js";
 import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
-import "../mui_extended/Badge/index.b09524fe.js";
-import "../Image/index.d684bdf2.js";
-import "@mui/lab";
-import "../mui_extended/MenuActions/index.cc54c35c.js";
-import { P as Popover } from "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Stack/index.0e53197c.js";
-import "../mui_extended/Tab/index.ae9ea641.js";
-import "../mui_extended/Pager/index.5fbbefe2.js";
-import "../mui_extended/Tooltip/index.5a795dcd.js";
-import { unstable_composeClasses } from "@mui/base";
+import { P as Popover } from "../mui_extended/Popover/index.b3eca6b1.js";
+import { I as Icon } from "../Icon/index.282c5b58.js";
+import clsx from "clsx";
 const componentName = "M4LAccountPopover";
 generateUtilityClasses(componentName, [
   "root",
@@ -113,6 +97,7 @@ const MenuPopOver = (props) => {
     host_static_assets,
     environment_assets
   } = useEnvironment();
+  console.log("MenuPopOver", data);
   const {
     avatar_url,
     first_name,
@@ -134,6 +119,8 @@ const MenuPopOver = (props) => {
   const handleOpen = (event) => {
     setOpen(event.currentTarget);
   };
+  const dataIsArray = Array.isArray(data) && data.length > 0;
+  console.log("dataIsArray", dataIsArray);
   return /* @__PURE__ */ jsxs("div", {
     role: "presentation",
     className: classes.containerAvatarPopover,
@@ -292,6 +279,7 @@ const AccountPopover = (props) => {
     };
   }, [open]);
   const accountPopoverClasses = useAccountPopoverUtilityClasses();
+  console.log("user data", userData);
   return /* @__PURE__ */ jsx(AcountPopOverRoot, {
     className: clsx(accountPopoverClasses.root, className),
     ...process.env.NODE_ENV !== "production" ? {

package/components/AppBar/{index.c8e7b25c.js → index.c64b66ee.js}

@@ -1,30 +1,13 @@
+import { styled } from "@mui/material/styles";
 import { useResponsiveDesktop } from "@m4l/graphics";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { I as IconButton } from "../mui_extended/IconButton/index.5afe56b7.js";
-import "../mui_extended/Accordion/index.3087f40e.js";
-import "../Icon/index.e215d0f0.js";
-import "react";
-import "clsx";
-import { jsxs, jsx } from "react/jsx-runtime";
-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.0f2552ed.js";
-import "../mui_extended/CheckBox.38abccd8.js";
-import "../mui_extended/Badge/index.b09524fe.js";
-import { I as Image } from "../Image/index.d684bdf2.js";
-import "@mui/lab";
-import "../mui_extended/MenuActions/index.cc54c35c.js";
-import "../mui_extended/Popover/index.9f35d0eb.js";
-import "../mui_extended/Stack/index.0e53197c.js";
-import "../mui_extended/Tab/index.ae9ea641.js";
-import "../mui_extended/Pager/index.5fbbefe2.js";
-import "../mui_extended/Tooltip/index.5a795dcd.js";
-import { styled } from "@mui/material/styles";
 import { unstable_composeClasses } from "@mui/base";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { I as Image } from "../Image/index.8915f577.js";
+import { T as Typography } from "../mui_extended/Typography/index.379dd374.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.a719445f.js";
 const AppBarRoot = styled("header")(({
   theme
 }) => ({

package/components/CommonActions/components/ActionCancel/{index.82313aef.js → index.106c5327.js}

@@ -1,6 +1,6 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.0f2552ed.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.93e9112b.js";
+import { B as Button } from "../../../mui_extended/Button/index.5c68764a.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index.8368ac0f.js";
 import { jsx } from "react/jsx-runtime";
 const ActionCancel = (props) => {
   const {

package/components/CommonActions/components/ActionFormCancel/index.6d00f737.js

@@ -0,0 +1,61 @@
+import { useFormContext, useFormState } from "react-hook-form";
+import { useModuleDictionary } from "@m4l/core";
+import { B as Button } from "../../../mui_extended/Button/index.5c68764a.js";
+import { useCallback, useEffect } from "react";
+import { u as useModal } from "../../../../hooks/useModal/index.1c88654a.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index.8368ac0f.js";
+import { jsx } from "react/jsx-runtime";
+import { u as useWindowToolsMF } from "../../../areas/hooks/useWindowToolsMF/index.b7afaf88.js";
+import { W as WindowConfirm } from "../../../modal/WindowConfirm.ec73ba4f.js";
+function ActionFormCancel() {
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const {
+    openModal
+  } = useModal();
+  const {
+    close: closeWindow,
+    setFnQueryClose: setQueryClose
+  } = useWindowToolsMF();
+  const {
+    control
+  } = useFormContext();
+  const {
+    isDirty
+  } = useFormState({
+    control
+  });
+  const onConfirmQuit = useCallback(() => {
+    closeWindow();
+  }, []);
+  const onClickCancel = useCallback(() => {
+    if (isDirty) {
+      openModal({
+        window: /* @__PURE__ */ jsx(WindowConfirm, {
+          variant: "warning",
+          title: getLabel("common_actions.confirm_quit_title"),
+          msg: getLabel("common_actions.confirm_quit_msg"),
+          onClickIntro: onConfirmQuit
+        }),
+        variant: "warning"
+      });
+    } else {
+      onConfirmQuit();
+    }
+  }, [getLabel, isDirty, openModal]);
+  useEffect(() => {
+    setQueryClose(onClickCancel);
+  }, [onClickCancel]);
+  const classes = useCommonActionsUtilityClasses();
+  return /* @__PURE__ */ jsx(Button, {
+    variant: "outlined",
+    color: "inherit",
+    onClick: onClickCancel,
+    className: classes.actionFormCancel,
+    children: getLabel("common_actions.cancel")
+  });
+}
+export {
+  ActionFormCancel as A
+};

package/components/CommonActions/components/ActionFormIntro/{index.29891df9.js → index.9ee7df17.js}

@@ -1,8 +1,8 @@
 import { useFormContext, useFormState } from "react-hook-form";
 import { useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { Skeleton } from "@mui/material";
-import { L as LoadingButton } from "../../../mui_extended/Button/index.0f2552ed.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.93e9112b.js";
+import { L as LoadingButton } from "../../../mui_extended/Button/index.5c68764a.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index.8368ac0f.js";
 import { jsx } from "react/jsx-runtime";
 function ActionFormIntro(props) {
   const {

package/components/CommonActions/components/ActionIntro/{index.c70ae272.js → index.bd2a14b2.js}

@@ -1,7 +1,7 @@
 import { useModuleDictionary } from "@m4l/core";
-import { B as Button } from "../../../mui_extended/Button/index.0f2552ed.js";
+import { B as Button } from "../../../mui_extended/Button/index.5c68764a.js";
 import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock.86c553a9.js";
-import { u as useCommonActionsUtilityClasses } from "../Actions/index.93e9112b.js";
+import { u as useCommonActionsUtilityClasses } from "../Actions/index.8368ac0f.js";
 import { jsx } from "react/jsx-runtime";
 const ACTIONINTRO_TEST_ID = "m4lactions";
 const ActionIntro = (props) => {

package/components/CommonActions/components/Actions/index.8368ac0f.js

@@ -0,0 +1,74 @@
+import { T as TEST_PROP_ID } from "../../../../test/constants_no_mock.86c553a9.js";
+import { generateUtilityClasses } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { g as getComponentUtilityClass } from "../../../../utils/index.9ad3909a.js";
+import { styled } from "@mui/material/styles";
+import { jsx } from "react/jsx-runtime";
+const componentName = "M4LCommonActions";
+generateUtilityClasses(componentName, [
+  "root",
+  "skeleton",
+  "actionCancel",
+  "actionFormCancel",
+  "actionFormIntro",
+  "actionIntro",
+  "wrapperActions"
+]);
+const useCommonActionsUtilityClasses = () => {
+  const slots = {
+    root: ["root"],
+    skeleton: ["skeleton"],
+    actionCancel: ["actionCancel"],
+    actionFormCancel: ["actionFormCancel"],
+    actionFormIntro: ["actionFormIntro"],
+    actionIntro: ["actionIntro"],
+    wrapperActions: ["wrapperActions"]
+  };
+  return unstable_composeClasses(slots, getComponentUtilityClass(componentName), {});
+};
+const WrapperStandarActions = styled("div")(({
+  theme
+}) => ({
+  paddingTop: theme.spacing(3),
+  display: "flex",
+  flexDirection: "row",
+  justifyContent: "flex-end",
+  "& > button": {
+    marginLeft: "10px"
+  },
+  ...theme.components?.M4LCommonActions?.styleOverrides
+}));
+const COMMONACTIONS_PREFIX = "M4LCommonActions";
+const getNameCommonActionsDataTestId = (KEY) => {
+  return `${COMMONACTIONS_PREFIX}-${KEY}`;
+};
+const Actions = (props) => {
+  const {
+    children
+  } = props;
+  const classes = useCommonActionsUtilityClasses();
+  return /* @__PURE__ */ jsx(WrapperStandarActions, {
+    className: classes.root,
+    ...process.env.NODE_ENV !== "production" ? {
+      [TEST_PROP_ID]: getNameCommonActionsDataTestId("root")
+    } : {},
+    children
+  });
+};
+function getCommonActionsDictionary() {
+  return ["common_actions"];
+}
+const defaultCommonActionsDictionary = {
+  common_actions: {
+    cancel: "Cancel",
+    intro: "Intro",
+    confirm_quit_title: "Confirm",
+    confirm_quit_msg: "Are your sure exit?"
+  }
+};
+export {
+  Actions as A,
+  defaultCommonActionsDictionary as d,
+  getCommonActionsDictionary as g,
+  useCommonActionsUtilityClasses as u
+};

package/components/DataGrid/assets/icons/datagrid.svg

@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 13H6C3.245 13 1 10.755 1 8C1 5.245 3.245 3 6 3H10C12.755 3 15 5.245 15 8C15 10.755 12.755 13 10 13ZM6 4C3.795 4 2 5.795 2 8C2 10.205 3.795 12 6 12H10C12.205 12 14 10.205 14 8C14 5.795 12.205 4 10 4H6Z" fill="#2F3737"/>
+<path d="M10 11C8.345 11 7 9.655 7 8C7 6.345 8.345 5 10 5C11.655 5 13 6.345 13 8C13 9.655 11.655 11 10 11ZM10 6C8.895 6 8 6.895 8 8C8 9.105 8.895 10 10 10C11.105 10 12 9.105 12 8C12 6.895 11.105 6 10 6Z" fill="#2F3737"/>
+</svg>

package/components/DataGrid/formatters/ColumnSetCheckFormatter/index.d.ts

@@ -0,0 +1,9 @@
+import { FormatterProps } from 'react-data-grid';
+import { ColumnSetCheckFormatterProps } from './types';
+import { RowKey } from '../../types';
+/**
+ * @description ColumnSetCheckFormatter: Es un formateador de columna booleano que permite la interacción directa
+ * acualizando un Set/Setter por medio de un hook generico el cual es invocado con el argumento field para ,
+ * sin la necesidad de entrar en edición como lo hace un editor
+ */
+export declare function ColumnSetCheckFormatter<Row, TKey extends RowKey = RowKey>(parameters: ColumnSetCheckFormatterProps<Row, TKey>): (props: FormatterProps<Row>) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/formatters/ColumnSetCheckFormatter/types.d.ts

@@ -0,0 +1,6 @@
+import { RowKey } from '../../types';
+export declare type ColumnSetCheckFormatterProps<Row, TKey extends RowKey = RowKey> = {
+    field: string;
+    rowKeyGetter: (row: Row) => TKey;
+    useHook: (field: string) => [ReadonlySet<TKey>, (newHas: ReadonlySet<TKey>) => void];
+};