@m4l/components 0.2.35 → 1.0.0

package/components/mui_extended/Tab/index.9214d9cc.js

@@ -1,156 +0,0 @@
-import clsx from "clsx";
-import { generateUtilityClasses, generateUtilityClass, styled, Tabs as Tabs$1, Tab as Tab$1, Skeleton } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { jsx } from "react/jsx-runtime";
-import { useModuleSkeleton } from "@m4l/core";
-import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
-import { g as getNameDataTestId } from "../../../test/getNameDataTestId.14875ec7.js";
-import { createContext, useState } from "react";
-const componentName$2 = "M4LTabs";
-generateUtilityClasses(componentName$2, [
-  "root"
-]);
-function getTabsUtilityClass(slot) {
-  return generateUtilityClass(componentName$2, slot);
-}
-const useTabsUtilityClasses = () => {
-  const slots = {
-    root: ["root"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getTabsUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const MUITabs = styled(Tabs$1)(({ theme }) => ({
-  ...theme.components?.M4LTabs?.styleOverrides
-}));
-const Tabs = (props) => {
-  const {
-    children,
-    className,
-    ...others
-  } = props;
-  const classes = useTabsUtilityClasses();
-  return /* @__PURE__ */ jsx(MUITabs, {
-    className: clsx(classes.root, className),
-    ...others,
-    children
-  });
-};
-const componentName$1 = "M4LTabContent";
-generateUtilityClasses(componentName$1, [
-  "root"
-]);
-function getTabContentUtilityClass(slot) {
-  return generateUtilityClass(componentName$1, slot);
-}
-const useTabContentUtilityClasses = () => {
-  const slots = {
-    root: ["root"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getTabContentUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const TabContentRoot = styled("div")(({ theme }) => ({
-  ...theme.components?.M4LTabContent?.styleOverrides
-}));
-const TabContent = (props) => {
-  const {
-    children,
-    className,
-    ...others
-  } = props;
-  const classes = useTabContentUtilityClasses();
-  return /* @__PURE__ */ jsx(TabContentRoot, {
-    className: clsx(classes.root, className),
-    ...others,
-    children
-  });
-};
-const TabRoot = styled("div")(({
-  theme
-}) => ({
-  ...theme.components?.M4LTab?.styleOverrides
-}));
-const SKTTabWrapper = styled("div")(({
-  theme
-}) => ({
-  padding: theme.spacing(1.5, 2)
-}));
-const componentName = "M4LTab";
-generateUtilityClasses(componentName, [
-  "root",
-  "skeleton"
-]);
-function getTabUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const tabUtilityClasses = () => {
-  const slots = {
-    root: ["root"],
-    skeleton: ["skeleton"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getTabUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const COMPONENT_PREFIX = "m4l-tab";
-function Tab(props) {
-  const {
-    SKTWidth,
-    SKTHeight,
-    className,
-    dataTestId = "",
-    ...other
-  } = props;
-  const isSkeleton = useModuleSkeleton();
-  const classes = tabUtilityClasses();
-  return /* @__PURE__ */ jsx(TabRoot, {
-    className: clsx(classes.root, className),
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId(COMPONENT_PREFIX, "root", dataTestId)
-    } : {},
-    children: !isSkeleton ? /* @__PURE__ */ jsx(Tab$1, {
-      ...other
-    }) : /* @__PURE__ */ jsx(SKTTabWrapper, {
-      className: classes.skeleton,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_ID]: getNameDataTestId(COMPONENT_PREFIX, "skeleton", dataTestId)
-      } : {},
-      children: /* @__PURE__ */ jsx(Skeleton, {
-        variant: "text",
-        width: SKTWidth,
-        height: SKTHeight
-      })
-    })
-  });
-}
-const TabContext = createContext(null);
-function TabProvider(props) {
-  const {
-    children,
-    initialValue
-  } = props;
-  const [currentTab, setCurrentTab] = useState(initialValue);
-  const handleChange = (_event, newTab) => {
-    setCurrentTab(newTab);
-  };
-  return /* @__PURE__ */ jsx(TabContext.Provider, {
-    value: {
-      currentTab: currentTab.toString(),
-      handleChange
-    },
-    children
-  });
-}
-export {
-  Tabs as T,
-  Tab as a,
-  TabContent as b,
-  TabProvider as c,
-  TabContext as d
-};

package/components/mui_extended/ToggleButton/index.191711f3.js

@@ -1,19 +0,0 @@
-import clsx from "clsx";
-import { B as Button, b as buttonClasses } from "../Button/index.c3084916.js";
-import { w as withToggle } from "../../../hocs/withToggle/index.50aec5e4.js";
-import { jsx } from "react/jsx-runtime";
-const ToggleAbleButton = ({
-  onToggle,
-  isToggled,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx(Button, {
-    onClick: onToggle,
-    ...props,
-    className: clsx(isToggled ? buttonClasses.togglePressed : buttonClasses.toggleNotPressed)
-  });
-};
-const ToggleButton = withToggle(ToggleAbleButton);
-export {
-  ToggleButton as T
-};

package/components/mui_extended/ToggleIconButton/index.d9dbf650.js

@@ -1,19 +0,0 @@
-import clsx from "clsx";
-import { I as IconButton, i as iconButtonClasses } from "../IconButton/index.f8a3021b.js";
-import { w as withToggle } from "../../../hocs/withToggle/index.50aec5e4.js";
-import { jsx } from "react/jsx-runtime";
-const ToggleAbleIconButton = ({
-  onToggle,
-  isToggled,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx(IconButton, {
-    onClick: onToggle,
-    ...props,
-    className: clsx(onToggle ? iconButtonClasses.togglePressed : iconButtonClasses.toggleNotPressed)
-  });
-};
-const ToggleIconButton = withToggle(ToggleAbleIconButton);
-export {
-  ToggleIconButton as T
-};

package/components/mui_extended/Tooltip/index.24a2bc3f.js

@@ -1,43 +0,0 @@
-import { generateUtilityClasses, generateUtilityClass, useTheme, Tooltip as Tooltip$1 } from "@mui/material";
-import clsx from "clsx";
-import { unstable_composeClasses } from "@mui/base";
-import { jsx } from "react/jsx-runtime";
-const componentName = "M4LTooltip";
-generateUtilityClasses(componentName, [
-  "root"
-]);
-function getTooltipUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const tooltipUtilityClasses = () => {
-  const slots = {
-    root: ["root"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getTooltipUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const Tooltip = (props) => {
-  const {
-    children,
-    className,
-    ...others
-  } = props;
-  const classes = tooltipUtilityClasses();
-  const theme = useTheme();
-  const stylesoverrides = theme.components?.M4LTooltip?.styleOverrides;
-  return /* @__PURE__ */ jsx(Tooltip$1, {
-    PopperProps: {
-      sx: {
-        ...stylesoverrides
-      },
-      className: clsx(classes.root, className)
-    },
-    ...others,
-    children
-  });
-};
-export {
-  Tooltip as T
-};

package/components/mui_extended/Typography/index.379dd374.js

@@ -1,68 +0,0 @@
-import { useModuleSkeleton } from "@m4l/core";
-import { styled, Skeleton, generateUtilityClasses, generateUtilityClass, Typography as Typography$1 } from "@mui/material";
-import { jsx } from "react/jsx-runtime";
-import { unstable_composeClasses } from "@mui/base";
-import clsx from "clsx";
-import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
-const WarpperTypography = styled("div")(({
-  theme
-}) => ({
-  ...theme.components?.M4LTypography?.styleOverrides
-}));
-const SkeletonTypography = (props) => {
-  const {
-    skeletonWidth,
-    skeletongHeight
-  } = props;
-  return /* @__PURE__ */ jsx(Skeleton, {
-    variant: "text",
-    width: skeletonWidth,
-    height: skeletongHeight
-  });
-};
-generateUtilityClasses("M4LTypography", [
-  "root"
-]);
-function getTypographyClassesUtilityClass(slot) {
-  return generateUtilityClass("M4LTypography", slot);
-}
-const useUtilityClasses = () => {
-  const slots = {
-    root: ["root"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getTypographyClassesUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const TYPOGRAPHY_PREFIX = "Typography";
-const getNameDataTestId = (KEY) => {
-  return `${TYPOGRAPHY_PREFIX}-${KEY}`;
-};
-function Typography(props) {
-  const {
-    skeletonWidth = "100%",
-    skeletongHeight = "18px",
-    variant = "body",
-    className,
-    ...other
-  } = props;
-  const isSkeleton = useModuleSkeleton();
-  const classes = useUtilityClasses();
-  return /* @__PURE__ */ jsx(WarpperTypography, {
-    className: clsx(classes.root, className),
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId("root")
-    } : {},
-    children: !isSkeleton ? /* @__PURE__ */ jsx(Typography$1, {
-      ...other,
-      variant
-    }) : /* @__PURE__ */ jsx(SkeletonTypography, {
-      skeletonWidth,
-      skeletongHeight
-    })
-  });
-}
-export {
-  Typography as T
-};

package/components/mui_extended/index.b606cd9d.js

@@ -1 +0,0 @@
-

package/components/popups/PopupsViewer/index.1500ce72.js

@@ -1,186 +0,0 @@
-import { TransitionGroup, CSSTransition } from "react-transition-group";
-import { shallow } from "zustand/shallow";
-import { useState, useRef } from "react";
-import clsx from "clsx";
-import { useEnvironment } from "@m4l/core";
-import { u as usePopupsStore } from "../PopupsProvider/index.d7409f48.js";
-import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { d as draggableWindowClasses, D as DragResizeWindow } from "../../DragResizeWindow/index.13ef022e.js";
-import { I as Icon } from "../../Icon/index.ad330e78.js";
-import { I as IconButton } from "../../mui_extended/IconButton/index.f8a3021b.js";
-import { u as useSizeContainer } from "../../../hooks/useSizeContainer/index.62b4e0c4.js";
-import { styled } from "@mui/material/styles";
-const COMPONENT_CLASS_NAME = "M4LPopupsViewer";
-const MAP_ZINDEX_OVER_MAP = 1100;
-const popupsClasses = generateUtilityClasses(COMPONENT_CLASS_NAME, [
-  "containerRoot",
-  "popupRoot",
-  "popupHeaderContainer",
-  "popupHeaderTitle",
-  "popupHeaderSubTitle",
-  "popupContent",
-  "popupHidden",
-  "popupWithSubTitle"
-]);
-function getPopupsUtilityClass(slot) {
-  return generateUtilityClass(COMPONENT_CLASS_NAME, slot);
-}
-const popupsUtilityClasses = (_ownerState) => {
-  const slots = {
-    containerRoot: ["containerRoot"],
-    popupsContainer: ["popupsContainer"],
-    popupRoot: ["popupRoot"],
-    popupHeaderContainer: ["popupHeaderContainer"],
-    popupHeaderTitle: ["popupHeaderTitle"],
-    popupHeaderSubTitle: ["popupHeaderSubTitle"],
-    popupContent: ["popupContent"],
-    popupHidden: ["popupHidden"],
-    popupWithSubTitle: ["popupWithSubTitle"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getPopupsUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-const POPUPS_ICONS = {
-  CLOSE: "close.svg"
-};
-const Header = (props) => {
-  const {
-    popupId
-  } = props;
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
-  const popup = usePopupsStore((state) => state.hashPopups[popupId], shallow);
-  usePopupsStore((state) => state.popupsActions, shallow);
-  const {
-    iconUrl
-  } = popup || {};
-  const [inProp, setInProp] = useState(false);
-  const onClose = () => {
-    setInProp((l) => !l);
-  };
-  console.log("Render", inProp);
-  if (!popup) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs("div", {
-    className: clsx(popupsClasses.popupHeaderContainer, draggableWindowClasses.draggableHandle),
-    children: [/* @__PURE__ */ jsx(Icon, {
-      src: iconUrl,
-      size: "small"
-    }), /* @__PURE__ */ jsx("span", {
-      className: clsx(popupsClasses.popupHeaderTitle, popup.subTitle ? popupsClasses.popupWithSubTitle : null),
-      children: popup.title
-    }), popup.subTitle && /* @__PURE__ */ jsx("span", {
-      className: popupsClasses.popupHeaderSubTitle,
-      children: popup.subTitle
-    }), /* @__PURE__ */ jsx(IconButton, {
-      className: draggableWindowClasses.draggableCancel,
-      onClick: onClose,
-      "aria-label": "click",
-      src: `${host_static_assets}/${environment_assets}/frontend/commons/assets/icons/${POPUPS_ICONS.CLOSE}`
-    })]
-  });
-};
-const Popup = (props) => {
-  const {
-    popupId,
-    containerElement,
-    containerSize
-  } = props;
-  const popup = usePopupsStore((state) => state.hashPopups[popupId], shallow);
-  const {
-    draggable = true,
-    resizable = true,
-    defaultPosition,
-    bounds,
-    ...others
-  } = popup || {};
-  const nodeRef = useRef(null);
-  if (!popup) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs(DragResizeWindow, {
-    ref: nodeRef,
-    className: clsx(popupsClasses.popupRoot, popup.status === "hidden" && popupsClasses.popupHidden),
-    onMouseDown: popup?.onMouseDown,
-    containerElement,
-    containerSize,
-    bounds,
-    draggable,
-    resizeable: resizable,
-    defaultPosition,
-    ...others,
-    children: [/* @__PURE__ */ jsx(Header, {
-      popupId: popup.popupId
-    }), /* @__PURE__ */ jsx("div", {
-      className: popupsClasses.popupContent,
-      children: popup.functionComponent && popup.functionComponent({
-        ...popup.componentProps
-      })
-    })]
-  });
-};
-const PopupsViewerRoot = styled("div")`
-   
-
-    ${(props) => props.theme.components?.M4LPopupsViewer?.styleOverrides}
-
-`;
-const PopupsViewer = (props) => {
-  const {
-    containerElement
-  } = props;
-  const popupsIds = usePopupsStore((state) => state.popupsIds.filter((pId) => state.hashPopups[pId].status !== "closing"), shallow);
-  const {
-    removePopup
-  } = usePopupsStore((state) => state.popupsActions, shallow);
-  const containerSize = useSizeContainer(containerElement);
-  if (!containerElement) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(PopupsViewerRoot, {
-    className: popupsClasses.containerRoot,
-    children: /* @__PURE__ */ jsx(TransitionGroup, {
-      children: popupsIds.map((id) => {
-        return /* @__PURE__ */ jsx(
-          CSSTransition,
-          {
-            in: true,
-            timeout: {
-              appear: 500,
-              enter: 300,
-              exit: 1300
-            },
-            unmountOnExit: true,
-            onEnter: () => console.log("onEnter"),
-            onExit: () => {
-              console.log("onExit");
-            },
-            onExited: () => {
-              console.log("onExited");
-              removePopup(id);
-            },
-            classNames: "popup-fade",
-            children: /* @__PURE__ */ jsx(Popup, {
-              popupId: id,
-              containerElement,
-              containerSize
-            }, id)
-          },
-          id
-        );
-      })
-    })
-  });
-};
-export {
-  MAP_ZINDEX_OVER_MAP as M,
-  PopupsViewer as P,
-  popupsUtilityClasses as p
-};

package/hooks/useFormAddEdit/index.000ce60b.js

@@ -1,94 +0,0 @@
-import { useNetwork, useFlags, useModuleDictionary } from "@m4l/core";
-import { useState, useEffect } from "react";
-import { u as useModal } from "../useModal/index.f73d7e42.js";
-import { jsx } from "react/jsx-runtime";
-import { W as WindowConfirm } from "../../components/modal/WindowConfirm.ee6de236.js";
-function useFormAddEdit(props) {
-  const {
-    initialValues,
-    objectId,
-    endPoint,
-    formatDataEnpoint,
-    queryParamas,
-    isRemote = true,
-    omitCallEnpoint = false
-  } = props;
-  const {
-    openModal
-  } = useModal();
-  const [formValues, setFormValues] = useState(initialValues);
-  const [statusLoad, setStatusLoad] = useState(objectId === void 0 ? "new" : "edit");
-  const {
-    networkOperation
-  } = useNetwork();
-  const {
-    addFlag
-  } = useFlags();
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const setRefresh = () => {
-    if (statusLoad === "ready") {
-      setStatusLoad("edit");
-    }
-  };
-  useEffect(() => {
-    let mounted = true;
-    if (statusLoad === "edit") {
-      if (omitCallEnpoint) {
-        addFlag("form_loaded");
-        setStatusLoad("ready");
-        return;
-      }
-      networkOperation({
-        method: "GET",
-        endPoint: queryParamas ? `${endPoint}/${objectId}?${queryParamas}` : `${endPoint}/${objectId}`,
-        isRemote
-      }).then((response) => {
-        if (mounted) {
-          if (formatDataEnpoint) {
-            setFormValues(formatDataEnpoint(response));
-          } else {
-            setFormValues(response.data);
-          }
-          setStatusLoad("reload_values_provider");
-        }
-      }, () => {
-        setStatusLoad("error");
-        openModal({
-          window: /* @__PURE__ */ jsx(WindowConfirm, {
-            variant: "delete",
-            title: getLabel("form_add_edit.label_error_title"),
-            msg: getLabel("form_add_edit.error_authorization_message"),
-            onClickIntro: () => close()
-          }),
-          variant: "delete"
-        });
-        addFlag("form_loaded");
-      });
-    } else if (statusLoad === "new" || statusLoad === "reload_values_provider") {
-      addFlag("form_loaded");
-      setStatusLoad("ready");
-    }
-    return () => {
-      mounted = false;
-    };
-  }, [statusLoad]);
-  useEffect(() => {
-    if (statusLoad === "ready" && objectId !== void 0) {
-      setStatusLoad("edit");
-    }
-  }, [objectId]);
-  return {
-    formValues,
-    statusLoad,
-    setRefresh
-  };
-}
-const getformAddEditDictionary = () => {
-  return "form_add_edit";
-};
-export {
-  getformAddEditDictionary as g,
-  useFormAddEdit as u
-};

package/hooks/useModal/index.f73d7e42.js

@@ -1,11 +0,0 @@
-import { useContext } from "react";
-import { M as ModalContext } from "../../contexts/ModalContext/index.2368bb19.js";
-function useModal() {
-  const context = useContext(ModalContext);
-  if (!context)
-    throw new Error("useModal context must be use inside ModalContext");
-  return context;
-}
-export {
-  useModal as u
-};

package/style.css

@@ -1,65 +0,0 @@
-.react-resizable {
-  position: relative;
-}
-.react-resizable-handle {
-  position: absolute;
-  width: 20px;
-  height: 20px;
-  background-repeat: no-repeat;
-  background-origin: content-box;
-  box-sizing: border-box;
-  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+');
-  background-position: bottom right;
-  padding: 0 3px 3px 0;
-}
-.react-resizable-handle-sw {
-  bottom: 0;
-  left: 0;
-  cursor: sw-resize;
-  transform: rotate(90deg);
-}
-.react-resizable-handle-se {
-  bottom: 0;
-  right: 0;
-  cursor: se-resize;
-}
-.react-resizable-handle-nw {
-  top: 0;
-  left: 0;
-  cursor: nw-resize;
-  transform: rotate(180deg);
-}
-.react-resizable-handle-ne {
-  top: 0;
-  right: 0;
-  cursor: ne-resize;
-  transform: rotate(270deg);
-}
-.react-resizable-handle-w,
-.react-resizable-handle-e {
-  top: 50%;
-  margin-top: -10px;
-  cursor: ew-resize;
-}
-.react-resizable-handle-w {
-  left: 0;
-  transform: rotate(135deg);
-}
-.react-resizable-handle-e {
-  right: 0;
-  transform: rotate(315deg);
-}
-.react-resizable-handle-n,
-.react-resizable-handle-s {
-  left: 50%;
-  margin-left: -10px;
-  cursor: ns-resize;
-}
-.react-resizable-handle-n {
-  top: 0;
-  transform: rotate(225deg);
-}
-.react-resizable-handle-s {
-  bottom: 0;
-  transform: rotate(45deg);
-}

package/test/constants_no_mock.86c553a9.js

@@ -1,4 +0,0 @@
-const TEST_PROP_ID = "data-testid";
-export {
-  TEST_PROP_ID as T
-};

package/test/getNameDataTestId.14875ec7.js

@@ -1,6 +0,0 @@
-const getNameDataTestId = (ELEMENT_PREFIX, ELEMENT_KEY, ELEMENT_ID) => {
-  return `${ELEMENT_PREFIX}-${[ELEMENT_KEY]}-${ELEMENT_ID}`;
-};
-export {
-  getNameDataTestId as g
-};