@m4l/components 0.1.20 → 0.1.22

package/components/hook-form/RHFUpload/{index.cbf11b68.js → index.56e2e277.js}

@@ -1,13 +1,13 @@
 import { styled as y, FormHelperText as f } from "@mui/material";
 import { useCallback as x } from "react";
 import { useFormContext as v, Controller as C } from "react-hook-form";
-import { i as w } from "../../../lodash.e09401f0.js";
+import w from "lodash/isString";
 import { useDropzone as b } from "react-dropzone";
-import { styled as i, alpha as I } from "@mui/material/styles";
+import { styled as o, alpha as I } from "@mui/material/styles";
 import { I as h } from "../../Image/index.c9da2d5a.js";
 import { useEnvironment as _, useModuleDictionary as R } from "@m4l/core";
 import { jsxs as a, Fragment as j, jsx as e } from "react/jsx-runtime";
-const D = i("div")(({
+const D = o("div")(({
   theme: t
 }) => ({
   width: "inherit",
@@ -17,7 +17,7 @@ const D = i("div")(({
   borderRadius: t.spacing(1),
   padding: t.spacing(1),
   border: `1px dashed ${t.palette.grey[50032]}`
-})), S = i("div")(({
+})), S = o("div")(({
   theme: t
 }) => ({
   zIndex: 0,
@@ -40,7 +40,7 @@ const D = i("div")(({
       zIndex: 9
     }
   }
-})), U = i("div")(({
+})), U = o("div")(({
   theme: t
 }) => ({
   "&:hover": {
@@ -56,7 +56,7 @@ const D = i("div")(({
     duration: t.transitions.duration.shorter
   }),
   overflow: "auto"
-})), W = i("div")(({
+})), W = o("div")(({
   theme: t
 }) => ({
   padding: t.spacing(3, 5),
@@ -66,36 +66,36 @@ const D = i("div")(({
   width: "100%",
   height: "100%",
   gap: t.spacing(3)
-})), F = i("div")(({
+})), F = o("div")(({
   theme: t
 }) => ({
   display: "flex",
   justifyContent: "center",
   flexDirection: "column",
   gap: t.spacing(3)
-})), z = i("span")(({
+})), z = o("span")(({
   theme: t
 }) => ({
   ...t.typography.subtitle2,
   width: "fit-content"
-})), P = i("span")(({
+})), P = o("span")(({
   theme: t
 }) => ({
   ...t.typography.body2,
   minWidth: t.spacing(20)
-})), $ = i("span")(({
+})), $ = o("span")(({
   theme: t
 }) => ({
   ...t.typography.caption,
   width: "fit-content"
-})), H = i("div")(({
+})), H = o("div")(({
   theme: t
 }) => ({
   display: "flex",
   alignItems: "center",
   maxWidth: t.spacing(20)
 }));
-i("div")(() => ({
+o("div")(() => ({
   width: "100%",
   height: "100%",
   position: "absolute",
@@ -106,7 +106,7 @@ i("div")(() => ({
 }));
 function L({
   error: t,
-  file: o,
+  file: i,
   helperText: s,
   sx: l,
   ...c
@@ -144,15 +144,15 @@ function L({
         },
         children: [/* @__PURE__ */ e("input", {
           ...n()
-        }), o && /* @__PURE__ */ e(h, {
+        }), i && /* @__PURE__ */ e(h, {
           alt: "avatar",
-          src: w(o) ? o : o.preview || "",
+          src: w(i) ? i : i.preview || "",
           width: "100%"
         }), /* @__PURE__ */ e(U, {
           id: "PlaceholderStyle",
           className: "placeholder",
           sx: {
-            ...o ? {
+            ...i ? {
               bgcolor: I("#161C24", 0.72),
               color: "common.white",
               opacity: 0
@@ -175,7 +175,7 @@ function L({
               })
             }), /* @__PURE__ */ a(F, {
               children: [/* @__PURE__ */ e(z, {
-                children: p(o ? "upload_image.title_update" : "upload_image.title_upload")
+                children: p(i ? "upload_image.title_update" : "upload_image.title_upload")
               }), /* @__PURE__ */ e(P, {
                 children: p("upload_image.description")
               }), /* @__PURE__ */ e($, {
@@ -195,7 +195,7 @@ const O = y("div")(() => ({
 }));
 function q({
   name: t,
-  ...o
+  ...i
 }) {
   const {
     control: s,
@@ -220,7 +220,7 @@ function q({
         children: [/* @__PURE__ */ e(L, {
           onDrop: c,
           error: d,
-          ...o,
+          ...i,
           file: r.value
         }), d && /* @__PURE__ */ e(f, {
           error: !0,

package/components/mui_extended/Button/{index.16591787.js → index.6df3e958.js}

@@ -5,18 +5,18 @@ import { jsx as i } from "react/jsx-runtime";
 import { LoadingButton as b } from "@mui/lab";
 import { I as x } from "../IconButton/index.4b5ce8b5.js";
 import { styled as h, alpha as F } from "@mui/material/styles";
-import { u as L } from "../../DynamicFilter/index.8a571617.js";
+import { u as L } from "../../DynamicFilter/index.4d3c60b4.js";
 import { useMemo as u } from "react";
 import { I as $ } from "../../Image/index.c9da2d5a.js";
-const G = (t) => g() ? /* @__PURE__ */ i(_, {
-  ...t
-}) : /* @__PURE__ */ i(m, {
+const G = (t) => g() ? /* @__PURE__ */ i(m, {
   sx: {
     borderRadius: 2
   },
   variant: "rectangular",
   width: "100px",
   height: "36px"
+}) : /* @__PURE__ */ i(_, {
+  ...t
 }), D = S("div")(({
   theme: t
 }) => ({

package/components/mui_extended/Pager/{index.80c2f8a0.js → index.b072df6b.js}

@@ -1,6 +1,6 @@
 import { useMemo as y } from "react";
 import { Skeleton as i, TablePagination as R } from "@mui/material";
-import { P as S } from "../../CommonActions/components/Actions/index.a908e4b9.js";
+import { P as S } from "../../CommonActions/components/Actions/index.edceed6b.js";
 import { styled as a } from "@mui/material/styles";
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 a("div")(() => ({

package/components/mui_extended/Popover/{index.305f2ea5.js → index.d708b699.js}

@@ -11,9 +11,9 @@ import "../Avatar/index.dadb0528.js";
 import "react-router-dom";
 import "@mui/material/Button";
 import "@mui/lab";
-import { I as S } from "../Button/index.16591787.js";
-import "../../CommonActions/components/Actions/index.a908e4b9.js";
-import "../Pager/index.80c2f8a0.js";
+import { I as S } from "../Button/index.6df3e958.js";
+import "../../CommonActions/components/Actions/index.edceed6b.js";
+import "../Pager/index.b072df6b.js";
 import "../Tab/index.e0653a0a.js";
 const O = I("span")(({
   arrowType: t,

package/contexts/ModalContext/index.33dc1be9.js

@@ -0,0 +1,136 @@
+import { createContext as x, useState as g } from "react";
+import { useEnvironment as y, voidFunction as w } from "@m4l/core";
+import { Typography as M } from "@mui/material";
+import { styled as l } from "@mui/material/styles";
+import { B as I } from "../../components/mui_extended/BoxIcon/index.e638ecc8.js";
+import { jsx as t, jsxs as p, Fragment as _ } from "react/jsx-runtime";
+import { M as k } from "../../components/ModalDialog/index.e1f31e50.js";
+import { A as $ } from "../../components/CommonActions/components/ActionIntro/index.35c8757f.js";
+import { A as b } from "../../components/CommonActions/components/ActionCancel/index.7b862bd3.js";
+import { b as A } from "../../utils/index.214d9542.js";
+const j = l("div")(() => ({
+  display: "flex",
+  flexDirection: "column",
+  height: "100%"
+})), D = l("div")(({
+  theme: n
+}) => ({
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "center",
+  alignItems: "center",
+  gridGap: n.spacing(5),
+  flexGrow: 1,
+  [n.breakpoints.up("sm")]: {
+    display: "grid",
+    flexDirection: "row",
+    gridTemplateColumns: "1fr 1fr"
+  }
+})), O = l("div")(({
+  theme: n,
+  variant: o
+}) => ({
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  "& > span": {
+    background: o === "warning" ? n.palette.warning.main : o === "delete" ? n.palette.error.main : o === "info" ? n.palette.info.main : "theme.palette.text.primary"
+  }
+})), B = l("div")(() => ({
+  display: "flex",
+  alignItems: "center"
+})), E = (n) => {
+  const {
+    variant: o = "info",
+    msg: i = "Are you sure you want to perform this action? Once complete, the information will be deleted."
+  } = n, {
+    host_static_assets: r,
+    environment_assets: e
+  } = y(), c = `${r}/${e}/frontend/components/dialog/assets/icons/illustration_confirm_warning.svg`, m = `${r}/${e}/frontend/components/dialog/assets/icons/illustration_confirm_danger.svg`, s = `${r}/${e}/frontend/components/dialog/assets/icons/illustration_confirm_info.svg`;
+  return /* @__PURE__ */ t(j, {
+    children: /* @__PURE__ */ p(D, {
+      children: [/* @__PURE__ */ t(O, {
+        variant: o,
+        children: /* @__PURE__ */ t(I, {
+          src: o === "warning" ? c : o === "delete" ? m : s,
+          sx: {
+            width: "230px",
+            height: "194px"
+          }
+        })
+      }), /* @__PURE__ */ t(B, {
+        children: /* @__PURE__ */ t(M, {
+          variant: "body1",
+          children: i
+        })
+      })]
+    })
+  });
+}, F = x(null);
+function K({
+  children: n
+}) {
+  const [o, i] = g({
+    open: !1,
+    withClose: !0,
+    onQueryClose: w,
+    title: "",
+    iconComponent: void 0,
+    contentComponent: void 0,
+    variant: void 0
+  }), [r, e] = g(!1), c = (a) => {
+    i({
+      open: !0,
+      ...a
+    });
+  }, m = (a) => {
+    const {
+      variant: d = "warning",
+      title: u,
+      msg: h,
+      onClickIntro: f,
+      onClickCancel: v = s
+    } = a;
+    i({
+      open: !0,
+      title: u,
+      variant: d,
+      contentComponent: /* @__PURE__ */ t(E, {
+        variant: d,
+        msg: h
+      }),
+      actions: /* @__PURE__ */ p(_, {
+        children: [/* @__PURE__ */ t(b, {
+          onClick: v
+        }), " ", /* @__PURE__ */ t($, {
+          onClick: () => {
+            f && f(), s();
+          },
+          color: A(d)
+        })]
+      })
+    });
+  }, s = () => {
+    i((a) => ({
+      ...a,
+      open: !1
+    })), e(!1);
+  }, C = () => {
+    e(!0);
+  };
+  return /* @__PURE__ */ p(F.Provider, {
+    value: {
+      ...o,
+      openModal: c,
+      openModalConfirm: m,
+      closeModal: s,
+      hasChanges: r,
+      setChanges: C
+    },
+    children: [n, /* @__PURE__ */ t(k, {})]
+  });
+}
+export {
+  F as M,
+  K as a
+};

package/contexts/ModalContext/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { ModalContextProps, TProps } from './types';
-declare const ModalContext: import("react").Context<ModalContextProps>;
+declare const ModalContext: import("react").Context<ModalContextProps | null>;
 declare function ModalProvider({ children }: TProps): JSX.Element;
 export { ModalProvider, ModalContext };

package/hooks/useModal/index.34cc1e55.js

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

package/hooks/useModal/index.d.ts

@@ -1 +1,2 @@
-export declare const useModal: () => import("../..").ModalContextProps;
+export declare function useModal(): import("../..").ModalContextProps;
+export default useModal;