@m4l/components 0.2.35 → 1.0.0

package/components/Image/index.b799c514.js

@@ -1,203 +0,0 @@
-import { styled, generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import clsx from "clsx";
-import { unstable_composeClasses } from "@mui/base";
-import { jsx } from "react/jsx-runtime";
-import { useBase, useEnvironment, evaluateWithContext } from "@m4l/core";
-import { c as classes, g as getSize } from "../PrintingSystem/index.27f1f209.js";
-import QRCode from "qrcode.react";
-const ImageRoot = styled("div")(({
-  theme
-}) => ({
-  ...theme.components?.M4LImage?.styleOverrides
-}));
-const ratioOptions = {
-  "1.168:1": {
-    width: 1.168,
-    height: 1
-  },
-  "16:9": {
-    width: 16,
-    height: 9
-  },
-  "1:1": {
-    width: 1,
-    height: 1
-  },
-  "1:1.168": {
-    width: 1,
-    height: 1.168
-  },
-  "2:1": {
-    width: 2,
-    height: 1
-  },
-  "2:3": {
-    width: 2,
-    height: 3
-  },
-  "3:1": {
-    width: 3,
-    height: 1
-  },
-  "3:2": {
-    width: 3,
-    height: 2
-  },
-  "3:4": {
-    width: 3,
-    height: 4
-  },
-  "4:3": {
-    width: 4,
-    height: 3
-  },
-  "5:2": {
-    width: 5,
-    height: 2
-  }
-};
-const getRatioValues = (ratio) => {
-  const numType = ratioOptions[ratio];
-  const numRef = numType.width / numType.height;
-  if (numRef >= 1) {
-    return {
-      width: "100%",
-      height: `${Math.trunc(numRef * 100)}%`
-    };
-  } else {
-    return {
-      width: `${Math.trunc(numRef * 100)}%`,
-      height: "100%"
-    };
-  }
-};
-const IMAGE_PREFIX = "Image";
-const getNameDataTestId = (KEY) => {
-  return `${IMAGE_PREFIX}-${KEY}`;
-};
-const componentName = "M4LImage";
-generateUtilityClasses(componentName, [
-  "root",
-  "img"
-]);
-function getImagenClassesUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const useUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    img: ["img"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getImagenClassesUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-function Image(props) {
-  const {
-    src,
-    alt,
-    width,
-    height,
-    ratio = "1:1",
-    className
-  } = props;
-  const ratioImage = getRatioValues(ratio);
-  const classes2 = useUtilityClasses();
-  return /* @__PURE__ */ jsx(ImageRoot, {
-    className: clsx(classes2.root, className),
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId("root")
-    } : {},
-    style: width && height ? {
-      minWidth: width,
-      minHeight: height,
-      width,
-      height
-    } : {
-      width: "100%",
-      height: "100%"
-    },
-    children: /* @__PURE__ */ jsx("img", {
-      alt,
-      src,
-      className: classes2.img,
-      width: !width ? "100%" : ratioImage.width,
-      height: !height ? "100%" : ratioImage.height,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameDataTestId("img")
-      } : {}
-    })
-  });
-}
-const ImageNode = (props) => {
-  const {
-    className,
-    style,
-    src,
-    width = "100%",
-    height = "100%"
-  } = props;
-  const {
-    unitSize,
-    sourceData
-  } = useBase();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const resourceImg = evaluateWithContext(sourceData, src);
-  return /* @__PURE__ */ jsx("img", {
-    src: `${host_static_assets}/${environment_assets}/${resourceImg}`,
-    className: clsx(classes.imageNodeRoot, className),
-    style: {
-      width: getSize(width, unitSize),
-      height: getSize(height, unitSize),
-      ...style
-    }
-  });
-};
-const convertToPx = (size, magnitud) => {
-  if (isNaN(size)) {
-    return 0;
-  }
-  if (magnitud === "px") {
-    return size;
-  }
-  switch (magnitud) {
-    case "cm":
-      return size * 37.8;
-    case "mm":
-      return size * 3.78;
-    case "in":
-      return size * 96;
-    case "pt":
-      return size * 1.33;
-    case "pc":
-      return size * 16;
-    default:
-      return 100;
-  }
-};
-const QRImageNode = (props) => {
-  const {
-    url,
-    size = 8,
-    color
-  } = props;
-  const {
-    unitSize
-  } = useBase();
-  return /* @__PURE__ */ jsx(QRCode, {
-    value: url,
-    size: convertToPx(size, unitSize),
-    fgColor: color,
-    renderAs: "canvas"
-  });
-};
-export {
-  Image as I,
-  QRImageNode as Q,
-  ImageNode as a
-};

package/components/LanguagePopover/index.93c48ec5.js

@@ -1,196 +0,0 @@
-import { useState, useEffect } from "react";
-import { styled, generateUtilityClasses, generateUtilityClass, Stack, MenuItem } from "@mui/material";
-import { I as Image } from "../Image/index.b799c514.js";
-import { useLocales } from "@m4l/graphics";
-import { I as ImageButton } from "../mui_extended/Button/index.c3084916.js";
-import { useEnvironment, useNetwork } from "@m4l/core";
-import { unstable_composeClasses } from "@mui/base";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { C as CircularProgress } from "../mui_extended/CircularProgress/index.ad569afd.js";
-import { P as Popover } from "../mui_extended/Popover/index.d85de73b.js";
-const LanguagePopoverRoot = styled("div")(({
-  theme
-}) => ({
-  ...theme.components?.M4LanguagePopover?.styleOverrides
-}));
-const LabelItem = styled("div")(({
-  theme
-}) => ({
-  marginLeft: theme.spacing(1)
-}));
-const ContainerProgress = styled("div")(({
-  theme
-}) => ({
-  padding: theme.spacing(0.75, 0),
-  margin: theme.spacing(0, 1.25)
-}));
-const ContainerMenuItems = styled("div")(() => ({
-  display: "flex",
-  flexDirection: "column"
-}));
-const ContainerImage = styled("div")(() => ({
-  display: "flex",
-  gap: "4px",
-  width: "16px",
-  height: "16px"
-}));
-const componentName = "M4LanguagePopover";
-generateUtilityClasses(componentName, [
-  "root",
-  "containerItems",
-  "containerProgress",
-  "labelItem",
-  "imageButton"
-]);
-function getM4LanguagePopoverClassesUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const useUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    containerItems: ["containerItems"],
-    containerProgress: ["containerProgress"],
-    labelItem: ["labelItem"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getM4LanguagePopoverClassesUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const LANGUAGEPOPOVER_PREFIX = "LanguagePopover";
-const getNameDataTestId = (KEY) => {
-  return `${LANGUAGEPOPOVER_PREFIX}-${KEY}`;
-};
-function LanguagePopover(props) {
-  const {
-    testingProps
-  } = props;
-  const {
-    currentLocale,
-    onChangeLocale
-  } = useLocales();
-  const {
-    domain_token
-  } = useEnvironment();
-  const {
-    networkOperation
-  } = useNetwork();
-  const [open, setOpen] = useState(testingProps?.open || null);
-  const [loading, setLoading] = useState(testingProps?.loading || false);
-  const [allLocales, setAllLocales] = useState(testingProps?.allLocales || []);
-  const handleOpen = (event) => {
-    setOpen(event.currentTarget);
-  };
-  const handleClose = () => {
-    setOpen(null);
-  };
-  useEffect(() => {
-    let mounted = true;
-    if (open === null || loading || allLocales.length > 0) {
-      return;
-    }
-    setLoading(true);
-    networkOperation({
-      method: "GET",
-      endPoint: `na/locales`,
-      parms: {
-        domain_token
-      }
-    }).then((response) => {
-      if (mounted) {
-        !testingProps && setAllLocales(response.data);
-      }
-    }).finally(() => {
-      setLoading(false);
-    });
-    return function cleanUp() {
-      mounted = false;
-    };
-  }, [open]);
-  const classes = useUtilityClasses();
-  return /* @__PURE__ */ jsxs(LanguagePopoverRoot, {
-    className: classes.root,
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId("root")
-    } : {},
-    children: [/* @__PURE__ */ jsx(ImageButton, {
-      className: classes.imageButton,
-      onClick: handleOpen,
-      sx: {
-        width: 28,
-        height: 28,
-        ...open && {
-          bgcolor: "action.selected"
-        }
-      },
-      src: currentLocale?.url_icon || "",
-      alt: currentLocale?.name,
-      width: "24px",
-      height: "24px",
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameDataTestId("imageButton")
-      } : {}
-    }), /* @__PURE__ */ jsx(Popover, {
-      arrowType: "top-right",
-      open: Boolean(open),
-      anchorEl: open,
-      anchorOrigin: {
-        vertical: "bottom",
-        horizontal: "right"
-      },
-      onClose: handleClose,
-      sx: {
-        mt: 1.5,
-        ml: 0.75,
-        width: 180,
-        rowGap: "100px",
-        "& .MuiMenuItem-root": {
-          px: 1,
-          typography: "body2",
-          borderRadius: 0.75
-        }
-      },
-      children: /* @__PURE__ */ jsxs(ContainerMenuItems, {
-        className: classes.containerItems,
-        ...process.env.NODE_ENV !== "production" ? {
-          [TEST_PROP_ID]: getNameDataTestId("containerItems")
-        } : {},
-        children: [allLocales.length === 0 && /* @__PURE__ */ jsx(ContainerProgress, {
-          className: classes.containerProgress,
-          ...process.env.NODE_ENV !== "production" ? {
-            [TEST_PROP_ID]: getNameDataTestId("containerProgress")
-          } : {},
-          children: /* @__PURE__ */ jsx(CircularProgress, {
-            size: "20px"
-          })
-        }), allLocales.length > 0 && /* @__PURE__ */ jsx(Stack, {
-          spacing: 0.75,
-          children: allLocales.map((option) => /* @__PURE__ */ jsxs(MenuItem, {
-            selected: option.lang === currentLocale?.lang && option?.script === currentLocale?.script && option?.region === currentLocale?.region,
-            onClick: () => {
-              onChangeLocale(option);
-              handleClose();
-            },
-            children: [/* @__PURE__ */ jsx(ContainerImage, {
-              children: /* @__PURE__ */ jsx(Image, {
-                alt: option.name,
-                src: option.url_icon,
-                ratio: "1:1"
-              })
-            }), /* @__PURE__ */ jsx(LabelItem, {
-              className: classes.labelItem,
-              ...process.env.NODE_ENV !== "production" ? {
-                [TEST_PROP_ID]: getNameDataTestId("labelItem")
-              } : {},
-              children: option.name
-            })]
-          }, option.lang || option.script || option.region))
-        })]
-      })
-    })]
-  });
-}
-export {
-  LanguagePopover as L
-};

package/components/LinearProgressIndeterminate/index.c46da124.js

@@ -1,43 +0,0 @@
-import clsx from "clsx";
-import { generateUtilityClasses, styled } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { g as getComponentUtilityClass } from "../../utils/index.6469f148.js";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { jsx } from "react/jsx-runtime";
-const LINEAR_PROGRESS_INDETERMINATE_CLASS_NAME = "M4LinearProgressIndeterminate";
-generateUtilityClasses(LINEAR_PROGRESS_INDETERMINATE_CLASS_NAME, [
-  "root",
-  "windowLinearProgressBar"
-], LINEAR_PROGRESS_INDETERMINATE_CLASS_NAME);
-const useLinearProgressIndeterminateUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    windowLinearProgressBar: ["windowLinearProgressBar"]
-  };
-  return unstable_composeClasses(slots, getComponentUtilityClass(LINEAR_PROGRESS_INDETERMINATE_CLASS_NAME), {});
-};
-const LinearProgressIndeterminateRoot = styled("div")(({ theme }) => ({
-  ...theme.components?.M4LinearProgressIndeterminate?.styleOverrides
-}));
-const ICON_PREFIX = "M4LinearProgressIndeterminate";
-const getNameLinearProgressIndeterminateDataTestId = (KEY) => {
-  return `${ICON_PREFIX}-${KEY}`;
-};
-const classes = useLinearProgressIndeterminateUtilityClasses();
-const LinearProgressIndeterminate = () => {
-  return /* @__PURE__ */ jsx(LinearProgressIndeterminateRoot, {
-    className: clsx(classes.root, "borealisBar"),
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameLinearProgressIndeterminateDataTestId("root")
-    } : {},
-    children: /* @__PURE__ */ jsx("div", {
-      className: classes.windowLinearProgressBar,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameLinearProgressIndeterminateDataTestId("windowLinearProgressBar")
-      } : {}
-    })
-  });
-};
-export {
-  LinearProgressIndeterminate as L
-};

package/components/ModalDialog/index.78c9650a.js

@@ -1,92 +0,0 @@
-import { useTheme, Dialog, Paper } from "@mui/material";
-import { c as cjs } from "../../react-draggable.e4725f3a.js";
-import { u as useModal } from "../../hooks/useModal/index.f73d7e42.js";
-import { R as ResizeableWindow } from "../Resizeable/index.cb5aad75.js";
-import { useIsMobile } from "@m4l/graphics";
-import { m as modalUtilityClasses } from "../modal/index.61389369.js";
-import { useState, useEffect } from "react";
-import { jsx } from "react/jsx-runtime";
-import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.fa7ab18c.js";
-const DragabblePaperComponent = (props) => {
-  return /* @__PURE__ */ jsx(cjs.exports, {
-    handle: ".m4l_draggable_handle",
-    cancel: '[class*="MuiDialogContent-root"]',
-    children: /* @__PURE__ */ jsx(Paper, {
-      sx: {
-        maxHeight: "unset",
-        maxWidth: "unset"
-      },
-      ...props
-    })
-  });
-};
-function PaperComponent(props) {
-  return /* @__PURE__ */ jsx(Paper, {
-    sx: {
-      maxHeight: "unset",
-      maxWidth: "unset",
-      height: "100%"
-    },
-    ...props
-  });
-}
-const ModalDialog = () => {
-  const {
-    open,
-    initialWidth = 600,
-    initialHeigth = 400,
-    maxWidth,
-    maxHeigth,
-    window,
-    fullScreen,
-    variant
-  } = useModal();
-  const isMobile = useIsMobile();
-  const [fullScreenState, setFullScreenState] = useState(fullScreen);
-  useEffect(() => {
-    setFullScreenState(isMobile);
-  }, [isMobile]);
-  const theme = useTheme();
-  const classes = modalUtilityClasses({
-    variant
-  });
-  const contentComnponent = /* @__PURE__ */ jsx("div", {
-    className: classes.containerWindow,
-    children: typeof window === "function" ? window() : window
-  });
-  console.log("fullScreen test", fullScreen);
-  return /* @__PURE__ */ jsx(Dialog, {
-    open,
-    className: classes.root,
-    sx: {
-      ...theme.components?.M4LModalDialog?.styleOverrides
-    },
-    "aria-labelledby": "child-modal-title",
-    "aria-describedby": "child-modal-description",
-    PaperComponent: !isMobile ? DragabblePaperComponent : PaperComponent,
-    fullScreen: fullScreenState,
-    disableEnforceFocus: true,
-    children: !isMobile ? /* @__PURE__ */ jsx(ResizeableWindow, {
-      width: initialWidth,
-      height: initialHeigth,
-      maxWidth,
-      maxHeigth,
-      handle: (resizeHandle, ref) => /* @__PURE__ */ jsx("div", {
-        ref,
-        className: `custom-handle custom-handle-${resizeHandle}`
-      }, resizeHandle),
-      children: contentComnponent
-    }) : contentComnponent
-  });
-};
-function getModalDialogComponentsDictionary() {
-  return ["modal_dialog"].concat(getCommonActionsDictionary());
-}
-const defaultModalDialogDictionary = {
-  modal_dialog: {}
-};
-export {
-  ModalDialog as M,
-  defaultModalDialogDictionary as d,
-  getModalDialogComponentsDictionary as g
-};

package/components/NavLink/index.b75c91e1.js

@@ -1,59 +0,0 @@
-import { NavLink as NavLink$1 } from "react-router-dom";
-import { generateUtilityClasses, generateUtilityClass, styled } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { T as Typography } from "../mui_extended/Typography/index.379dd374.js";
-const componentName = "M4LNavLink";
-generateUtilityClasses(componentName, [
-  "root"
-]);
-function getNavLinkClassesUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const useUtilityClasses = () => {
-  const slots = {
-    root: ["root"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getNavLinkClassesUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const NavLinkRoot = styled("div")(({ theme }) => ({
-  ...theme.components?.M4LNavLink?.styleOverrides
-}));
-const NAVLINK_PREFIX = "Navlink";
-const getNameDataTestId = (KEY) => {
-  return `${NAVLINK_PREFIX}-${KEY}`;
-};
-const NavLink = (props) => {
-  const {
-    children,
-    text,
-    skeletonWidth,
-    skeletongHeight,
-    ...others
-  } = props;
-  const classes = useUtilityClasses();
-  return /* @__PURE__ */ jsx(NavLinkRoot, {
-    className: classes.root,
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId("root")
-    } : {},
-    children: /* @__PURE__ */ jsxs(NavLink$1, {
-      ...others,
-      children: [/* @__PURE__ */ jsx(Typography, {
-        variant: "action",
-        skeletonWidth,
-        skeletongHeight,
-        children: text
-      }), /* @__PURE__ */ jsx(Fragment, {
-        children
-      })]
-    })
-  });
-};
-export {
-  NavLink as N
-};