@m4l/components 3.0.1 → 3.0.3

package/styles/{index-Cc9p_h7i.js → index-DITv2ClE.js}

@@ -1,14 +1,15 @@
-import { styled, alpha, Skeleton, Popover, IconButton, Stack, Tabs, Dialog, ListItemText, ListItemButton } from "@mui/material";
+import { styled, alpha, Skeleton, Popover, Stack, Tabs, Dialog, ListItemText, ListItemButton } from "@mui/material";
 import { styled as styled$1, alpha as alpha$1 } from "@mui/material/styles";
 import SimpleBarReact from "simplebar-react";
-import { h as gridLayoutClasses } from "../components/GridLayout/index-HK_hTGnZ.js";
+import { h as gridLayoutClasses } from "../components/GridLayout/index-CRsM-v5t.js";
 import { a as ResizableBox } from "../react-resizable-eBbFl2dX.js";
-import { a as areasAdminClasses } from "../components/areas/components/AreasAdmin/index-qqSduaty.js";
-import { a as areasViewerClasses } from "../components/areas/components/AreasViewer/index-D5If8gFK.js";
-import { g as gpsToolsClasses } from "../components/maps/components/GpsTools/index-BP1dIwh6.js";
-import { R as RHFormProvider } from "../contexts/RHFormContext/index-B4a0h0fX.js";
-import { S as Stack$1 } from "../components/mui_extended/Stack/index-CV2W-_eL.js";
-import { I as Image } from "../components/Image/index-B7FhR9uF.js";
+import { a as areasAdminClasses } from "../components/areas/components/AreasAdmin/index-w4ZiYbUn.js";
+import { a as areasViewerClasses } from "../components/areas/components/AreasViewer/index-C_Doyhlf.js";
+import styles from "react-toastify/dist/ReactToastify.min.css";
+import { g as gpsToolsClasses } from "../components/maps/components/GpsTools/index-CPthTXb6.js";
+import { R as RHFormProvider } from "../contexts/RHFormContext/index-D-Aek3pv.js";
+import { S as Stack$1 } from "../components/mui_extended/Stack/index-COSPZIcB.js";
+import { I as Image } from "../components/Image/index-D0wxe0iA.js";
 const RootStyle$1 = styled("div", {
   shouldForwardProp: (props) => props !== "variant"
 })(({ theme, variant }) => ({
@@ -300,19 +301,47 @@ const LoadingButtonRoot = styled("div")(({ theme }) => ({
   /* Styles overrides of m4l_styles */
   ...theme.components?.M4LLoadingButton?.styleOverrides
 }));
+const CONTAINER_QUERY_NAME$1 = "menuActions";
+const menuActionsStyles = {
+  root: ({ theme }) => ({
+    containerName: CONTAINER_QUERY_NAME$1,
+    "& .MuiPaper-root": {
+      display: "flex",
+      flexDirection: "column",
+      background: theme.palette.background.default,
+      gap: "8px",
+      maxWidth: 300
+    }
+  }),
+  badge: {},
+  menuItem: ({ theme, ownerState }) => ({
+    display: "flex",
+    justifyContent: "center",
+    minHeight: "24px",
+    minWidth: "24px",
+    padding: "0",
+    gap: "0px",
+    ...ownerState.variant === "delete" ? {
+      color: theme.palette.state.error.normal
+    } : {}
+  }),
+  menuItemLabel: {},
+  menuItemIcon: ({ theme, ownerState }) => ({
+    "&.M4LIcon-root": {
+      minHeight: "24px",
+      minWidth: "24px",
+      "& > .M4LIcon-icon": {
+        backgroundColor: ownerState.variant === "delete" ? theme.palette.state.error.normal : ""
+      }
+    }
+  }),
+  labelEmpty: () => ({
+    zIndex: 1
+  })
+};
 const PopoverRoot = styled$1(Popover)(({ theme }) => ({
   ...theme.components?.M4LPopover?.styleOverrides
 }));
-styled$1(IconButton)(() => ({}));
-const LabelMemuItem = styled$1("div")(({ theme }) => ({
-  height: "22px",
-  overflow: "hidden",
-  wordBreak: "break-all",
-  // padding: '0px',
-  marginLeft: theme.spacing(1.5),
-  display: "flex",
-  alignItems: "center"
-}));
 const MUISTack = styled(Stack)(({ theme }) => ({
   ...theme.components?.M4LStack?.styleOverrides
 }));
@@ -943,6 +972,7 @@ const toastStyles = {
     "--toastify-toast-bd-radius": "8px",
     // used to control the opacity of the progress trail
     "--toastify-color-progress-bgo": ".2",
+    styles,
     ...ownerState?.fixed === false ? {
       top: 0,
       position: "absolute",
@@ -1639,7 +1669,7 @@ export {
   LoadingButtonRoot as aC,
   CheckBoxRoot as aD,
   IconButtonRoot as aE,
-  LabelMemuItem as aF,
+  menuActionsStyles as aF,
   PagerRoot as aG,
   PopoverRoot as aH,
   MUISTack as aI,

package/components/mui_extended/MenuActions/classes/constants.d.ts

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

package/components/mui_extended/MenuActions/classes/index.d.ts

@@ -1,7 +0,0 @@
-import { MenuActionsClassesType } from './types';
-export declare const menuActionsClasses: MenuActionsClassesType;
-export declare function getMenuActionsUtilityClass(slot: string): string;
-export declare const useMenuActionsUtilityClasses: () => {
-    root: string;
-    itemDelete: string;
-};

package/components/mui_extended/MenuActions/classes/types.d.ts

@@ -1,7 +0,0 @@
-import { useMenuActionsUtilityClasses } from '.';
-export interface MenuActionsClassesType {
-    root: string;
-    itemDelete: string;
-}
-export declare type StackClassesKey = keyof MenuActionsClassesType;
-export declare type Classes = ReturnType<typeof useMenuActionsUtilityClasses>;

package/components/mui_extended/MenuActions/icons.d.ts

@@ -1,3 +0,0 @@
-export declare const ICONS: {
-    MENU: string;
-};

package/components/mui_extended/MenuActions/index-CUz70BPj.js

@@ -1,171 +0,0 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import React__default, { useState, useEffect, useMemo } from "react";
-import { useEnvironment, useModuleDictionary } from "@m4l/core";
-import { generateUtilityClasses, generateUtilityClass, useTheme, MenuItem } from "@mui/material";
-import { P as Popover } from "../Popover/index-C6_2t4L1.js";
-import { aF as LabelMemuItem } from "../../../styles/index-Cc9p_h7i.js";
-import { I as Icon } from "../../Icon/index-CedboS6y.js";
-import clsx from "clsx";
-import { unstable_composeClasses } from "@mui/base";
-import { B as Badge } from "../Badge/index-D6F1o3k2.js";
-import { I as IconButton } from "../IconButton/index-BfDbi0cC.js";
-const ICONS = {
-  MENU: "menu.svg"
-};
-const componentName = "M4LMenuActions";
-generateUtilityClasses(componentName, [
-  /* elements */
-  "root",
-  "itemDelete"
-  /* states or variants of elements */
-]);
-function getMenuActionsUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const useMenuActionsUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    itemDelete: ["itemDelete"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getMenuActionsUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-function MenuActions(props) {
-  const {
-    menuActions,
-    endListElement,
-    menuActionSx,
-    className,
-    iconButtonClassName = "",
-    objItem = {},
-    urlIcon,
-    toolTip = "",
-    marginTop = -1,
-    marginBottom,
-    marginLeft,
-    marginRight,
-    width = 200,
-    withBadge = false,
-    badgeContent,
-    arrowType = "right-top",
-    externalOpen = null,
-    externalClose,
-    ...other
-  } = props;
-  const { host_static_assets, environment_assets } = useEnvironment();
-  const { getLabel } = useModuleDictionary();
-  const [open, setOpen] = useState(null);
-  const handleOpen = (event) => {
-    setOpen(event.currentTarget);
-  };
-  const theme = useTheme();
-  const classes = useMenuActionsUtilityClasses();
-  useEffect(() => {
-    let mounted = true;
-    if (mounted) {
-      setOpen(externalOpen);
-    }
-    return function cleanUp() {
-      mounted = false;
-    };
-  }, [externalOpen]);
-  const urlFinalIcon = useMemo(() => {
-    if (urlIcon) return urlIcon;
-    return `${host_static_assets}/${environment_assets}/frontend/components/menu_actions/assets/icons/${ICONS.MENU}`;
-  }, [urlIcon, host_static_assets, environment_assets]);
-  const handleClose = (e) => {
-    e.stopPropagation();
-    setOpen(null);
-    externalClose && externalClose(null);
-  };
-  const handleClick = (e, menuAction) => {
-    e.stopPropagation();
-    setOpen(null);
-    menuAction.onClick();
-  };
-  const finalActions = useMemo(() => {
-    let ret;
-    if (typeof menuActions !== "function") {
-      ret = menuActions;
-    } else {
-      ret = menuActions(objItem);
-    }
-    return ret;
-  }, [menuActions, objItem]);
-  const IconButtonElement = (
-    // eslint-disable-next-line react/jsx-no-useless-fragment
-    /* @__PURE__ */ jsx(Fragment, { children: withBadge ? /* @__PURE__ */ jsx(Badge, { badgeContent, children: /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        src: urlFinalIcon,
-        onClick: handleOpen,
-        tooltip: toolTip,
-        className: iconButtonClassName
-      }
-    ) }) : /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        src: urlFinalIcon,
-        onClick: handleOpen,
-        tooltip: toolTip,
-        className: iconButtonClassName
-      }
-    ) })
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    IconButtonElement,
-    /* @__PURE__ */ jsxs(
-      Popover,
-      {
-        id: "Popover",
-        open: Boolean(open),
-        anchorEl: open,
-        onClose: handleClose,
-        arrowType,
-        className: clsx(classes.root, className),
-        sx: {
-          marginTop,
-          marginBottom,
-          marginLeft,
-          marginRight,
-          width,
-          maxWidth: 300,
-          "& .MuiMenuItem-root": { px: 1, typography: "body2", borderRadius: 0.75 },
-          ...theme.components?.M4LMenuActions?.styleOverrides,
-          ...menuActionSx
-        },
-        ...other,
-        children: [
-          finalActions.map((menuAction, index) => /* @__PURE__ */ jsxs(
-            MenuItem,
-            {
-              dense: true,
-              onClick: (e) => {
-                handleClick(e, menuAction);
-              },
-              sx: { color: menuAction.color ?? "text.main" },
-              disabled: menuAction.disabled,
-              className: clsx(
-                menuAction?.className,
-                menuAction.variant === "delete" && classes.itemDelete
-              ),
-              children: [
-                menuAction.urlIcon ? /* @__PURE__ */ jsx(Icon, { src: menuAction.urlIcon }) : null,
-                /* @__PURE__ */ jsx(LabelMemuItem, { children: menuAction.label || menuAction.dictionaryId && getLabel(menuAction.dictionaryId) })
-              ]
-            },
-            `menu_action_${index}`
-          )),
-          endListElement ? endListElement : null
-        ]
-      }
-    )
-  ] });
-}
-const MemonizedMenuActions = React__default.memo(MenuActions);
-export {
-  MenuActions as M,
-  MemonizedMenuActions as a
-};

package/components/mui_extended/MenuActions/styles.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export declare const WrapperMenuActions: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "style" | "disabled" | "children" | "tabIndex" | "className" | "color" | "size" | "action" | "sx" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const LabelMemuItem: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;