@m4l/components 0.1.20 → 0.1.21

package/contexts/ModalContext/index.8f76fbe4.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.180937f5.js";
+import { A as $ } from "../../components/CommonActions/components/ActionIntro/index.c794e2a1.js";
+import { A as b } from "../../components/CommonActions/components/ActionCancel/index.6649cc3d.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.44c5993b.js

@@ -0,0 +1,11 @@
+import { useContext as t } from "react";
+import { M as e } from "../../contexts/ModalContext/index.8f76fbe4.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;

package/index.js

@@ -5,46 +5,46 @@ import "react/jsx-runtime";
 import { L as O } from "./components/animate/LoadingScreen/index.f1cec7db.js";
 import "@m4l/core";
 import "react-hook-form";
-import { R as j } from "./components/hook-form/RHFAutocomplete/index.b7f11146.js";
+import { R as j } from "./components/hook-form/RHFAutocomplete/index.ee3d9b3c.js";
 import "react";
 import { I as G } from "./components/Image/index.c9da2d5a.js";
+import "./lodash.727eb847.js";
 import { R as V } from "./components/hook-form/RHFCheckbox/index.6a40e25f.js";
 import { R as W } from "./components/hook-form/RHFDateTime/index.5ed774e3.js";
 import "@mui/x-date-pickers";
 import { R as J, a as K } from "./components/hook-form/RHFTextField/index.bab2a2cf.js";
 import { I as X } from "./components/Icon/index.f569765b.js";
 import "@mui/material/styles";
-import { R as Z } from "./components/hook-form/RHFPeriod/index.e17b1c72.js";
+import { R as Z } from "./components/hook-form/RHFPeriod/index.6f6cde6d.js";
 import { E as $ } from "./components/ErrorLabel/index.c8615f16.js";
-import { P as ro, g as to } from "./components/Period/index.497b8df4.js";
-import { b as eo, M as mo, d as so, g as io } from "./components/CommonActions/components/Actions/index.a908e4b9.js";
+import { P as ro, g as to } from "./components/Period/index.5493563f.js";
+import { b as eo, M as mo, d as so, g as io } from "./components/CommonActions/components/Actions/index.03412615.js";
 import "@mui/material/Button";
 import "react-router-dom";
-import { M as no, a as xo } from "./contexts/ModalContext/index.699767c7.js";
+import { M as no, a as xo } from "./contexts/ModalContext/index.8f76fbe4.js";
 import "@mui/lab";
-import "./lodash.e09401f0.js";
 import "react-dropzone";
-import { R as co } from "./components/hook-form/RHFUpload/index.cbf11b68.js";
+import { R as co } from "./components/hook-form/RHFUpload/index.d055f3be.js";
 import { A as go } from "./components/mui_extended/Accordion/index.49f5df8e.js";
 import { A as uo } from "./components/mui_extended/Avatar/index.dadb0528.js";
-import { B as Ro, L as yo } from "./components/mui_extended/Button/index.16591787.js";
-import { L as Ao, P as Co } from "./components/mui_extended/Popover/index.305f2ea5.js";
-import { P as vo, g as Ho } from "./components/mui_extended/Pager/index.80c2f8a0.js";
+import { B as Ro, L as yo } from "./components/mui_extended/Button/index.fbd38cd1.js";
+import { L as Ao, P as Co } from "./components/mui_extended/Popover/index.cb3125b4.js";
+import { P as vo, g as Ho } from "./components/mui_extended/Pager/index.fd2bca74.js";
 import { T as bo } from "./components/mui_extended/Tab/index.e0653a0a.js";
-import { D as Io, N as To, T as So, g as Eo } from "./components/DataGrid/index.5cbf0dd8.js";
+import { D as Io, N as To, T as So, g as Eo } from "./components/DataGrid/index.f2f0bf6a.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
 import "@m4l/graphics";
 import { S as ho } from "./components/ScrollBar/index.39eeb2de.js";
-import { D as Uo, d as jo, g as ko } from "./components/DynamicFilter/index.8a571617.js";
+import { D as Uo, d as jo, g as ko } from "./components/DynamicFilter/index.f0b93aef.js";
 import "simplebar/dist/simplebar.min.css";
-import { R as zo } from "./components/contexts/RHFormContext/index.f8241292.js";
+import { R as zo } from "./components/contexts/RHFormContext/index.33dba822.js";
 import "yup";
 import "./react-draggable.20e95c61.js";
-import { M as wo, d as Wo, g as qo } from "./components/ModalDialog/index.16024a4e.js";
+import { M as wo, d as Wo, g as qo } from "./components/ModalDialog/index.180937f5.js";
 import { R as Ko } from "./components/Resizeable/index.45995d2b.js";
 import { N as Xo, d as Yo, g as Zo } from "./components/NoItemSelected/index.9609a7f7.js";
-import { O as $o, d as or, g as rr } from "./components/ObjectLogs/index.ac2bfa48.js";
+import { O as $o, d as or, g as rr } from "./components/ObjectLogs/index.6cd7fcc9.js";
 import "./react-json-view.f56a7f8e.js";
 import { P as ar } from "./components/PaperForm/index.3f8c7ef2.js";
 import { H as mr } from "./components/Page/index.fc660ee5.js";
@@ -57,7 +57,7 @@ import { v as gr } from "./components/animate/variants/container.11f82b76.js";
 import { v as ur, a as Dr, b as Rr } from "./components/animate/variants/transition.bd46b9ce.js";
 import { M as Pr } from "./components/animate/MotionContainer/index.8d9f9d80.js";
 import { M as Cr } from "./components/animate/MotionLazyContainer/index.572dd012.js";
-import { R as vr } from "./components/hook-form/RHFAutocompleteAsync/index.97a5a66e.js";
+import { R as vr } from "./components/hook-form/RHFAutocompleteAsync/index.64cff02c.js";
 import { R as Mr } from "./components/hook-form/RHFMultiCheckbox/index.2680b3b6.js";
 import { R as Br } from "./components/hook-form/RHFSelect/index.b6ca8bb2.js";
 import { R as Tr } from "./components/hook-form/RHFRadioGroup/index.b3335e13.js";
@@ -68,21 +68,21 @@ import { T as kr } from "./components/mui_extended/Typography/index.e5494696.js"
 import { B as zr, c as Vr } from "./components/formatters/BooleanFormatter/index.3ec56305.js";
 import { D as Wr, c as qr } from "./components/formatters/DateFormatter/index.08d8823b.js";
 import { P as Kr, a as Qr, U as Xr, e as Yr, b as Zr, c as _r, d as $r, g as ot } from "./components/formatters/index.6959c2de.js";
-import { A as tt } from "./components/CommonActions/components/ActionCancel/index.3775989f.js";
-import { A as et } from "./components/CommonActions/components/ActionIntro/index.ca7b6952.js";
-import { A as st } from "./components/CommonActions/components/ActionFormCancel/index.d69d9e0f.js";
+import { A as tt } from "./components/CommonActions/components/ActionCancel/index.6649cc3d.js";
+import { A as et } from "./components/CommonActions/components/ActionIntro/index.c794e2a1.js";
+import { A as st } from "./components/CommonActions/components/ActionFormCancel/index.91f6c07d.js";
 import { A as pt } from "./components/CommonActions/components/ActionFormIntro/index.ca4d2674.js";
 import { L as xt } from "./components/Loadable/index.f5518558.js";
 import { S as ct } from "./components/ScrollToTop/index.e06f98f6.js";
 import { u as dt } from "./hooks/useFormAddEdit/index.d4845f1a.js";
-import { u as Ft } from "./hooks/useModal/index.8201ccec.js";
+import { u as Ft } from "./hooks/useModal/index.44c5993b.js";
 import { L as Dt } from "./assets/Logo/index.228dcb5a.js";
-import "./utils/index.214d9542.js";
-import "./react-data-grid.d46d625e.js";
-import "clsx";
 import "./commonjs.565e6834.js";
 import "prop-types";
 import "react-dom";
+import "clsx";
+import "./utils/index.214d9542.js";
+import "./react-data-grid.d46d625e.js";
 import "simplebar-react";
 import "./node_modules.168cb897.js";
 import "./react-resizable.5277deaf.js";

package/lodash.727eb847.js

@@ -0,0 +1,117 @@
+import { c as v } from "./commonjs.565e6834.js";
+function F(r) {
+  var e = typeof r;
+  return r != null && (e == "object" || e == "function");
+}
+var G = F, U = typeof v == "object" && v && v.Object === Object && v, D = U, H = D, X = typeof self == "object" && self && self.Object === Object && self, q = H || X || Function("return this")(), L = q, z = L, J = function() {
+  return z.Date.now();
+}, K = J, Q = /\s/;
+function V(r) {
+  for (var e = r.length; e-- && Q.test(r.charAt(e)); )
+    ;
+  return e;
+}
+var Y = V, Z = Y, rr = /^\s+/;
+function er(r) {
+  return r && r.slice(0, Z(r) + 1).replace(rr, "");
+}
+var tr = er, nr = L, ir = nr.Symbol, N = ir, h = N, w = Object.prototype, ar = w.hasOwnProperty, or = w.toString, g = h ? h.toStringTag : void 0;
+function cr(r) {
+  var e = ar.call(r, g), i = r[g];
+  try {
+    r[g] = void 0;
+    var a = !0;
+  } catch {
+  }
+  var c = or.call(r);
+  return a && (e ? r[g] = i : delete r[g]), c;
+}
+var fr = cr, sr = Object.prototype, ur = sr.toString;
+function br(r) {
+  return ur.call(r);
+}
+var dr = br, x = N, mr = fr, gr = dr, lr = "[object Null]", vr = "[object Undefined]", I = x ? x.toStringTag : void 0;
+function yr(r) {
+  return r == null ? r === void 0 ? vr : lr : I && I in Object(r) ? mr(r) : gr(r);
+}
+var R = yr;
+function Tr(r) {
+  return r != null && typeof r == "object";
+}
+var W = Tr, jr = R, Sr = W, $r = "[object Symbol]";
+function Or(r) {
+  return typeof r == "symbol" || Sr(r) && jr(r) == $r;
+}
+var pr = Or, _r = tr, k = G, hr = pr, E = 0 / 0, xr = /^[-+]0x[0-9a-f]+$/i, Ir = /^0b[01]+$/i, kr = /^0o[0-7]+$/i, Er = parseInt;
+function Ar(r) {
+  if (typeof r == "number")
+    return r;
+  if (hr(r))
+    return E;
+  if (k(r)) {
+    var e = typeof r.valueOf == "function" ? r.valueOf() : r;
+    r = k(e) ? e + "" : e;
+  }
+  if (typeof r != "string")
+    return r === 0 ? r : +r;
+  r = _r(r);
+  var i = Ir.test(r);
+  return i || kr.test(r) ? Er(r.slice(2), i ? 2 : 8) : xr.test(r) ? E : +r;
+}
+var Gr = Ar, Lr = G, S = K, A = Gr, Nr = "Expected a function", wr = Math.max, Rr = Math.min;
+function Wr(r, e, i) {
+  var a, c, u, s, n, f, b = 0, $ = !1, d = !1, y = !0;
+  if (typeof r != "function")
+    throw new TypeError(Nr);
+  e = A(e) || 0, Lr(i) && ($ = !!i.leading, d = "maxWait" in i, u = d ? wr(A(i.maxWait) || 0, e) : u, y = "trailing" in i ? !!i.trailing : y);
+  function T(t) {
+    var o = a, m = c;
+    return a = c = void 0, b = t, s = r.apply(m, o), s;
+  }
+  function P(t) {
+    return b = t, n = setTimeout(l, e), $ ? T(t) : s;
+  }
+  function C(t) {
+    var o = t - f, m = t - b, _ = e - o;
+    return d ? Rr(_, u - m) : _;
+  }
+  function O(t) {
+    var o = t - f, m = t - b;
+    return f === void 0 || o >= e || o < 0 || d && m >= u;
+  }
+  function l() {
+    var t = S();
+    if (O(t))
+      return p(t);
+    n = setTimeout(l, C(t));
+  }
+  function p(t) {
+    return n = void 0, y && a ? T(t) : (a = c = void 0, s);
+  }
+  function M() {
+    n !== void 0 && clearTimeout(n), b = 0, a = f = c = n = void 0;
+  }
+  function B() {
+    return n === void 0 ? s : p(S());
+  }
+  function j() {
+    var t = S(), o = O(t);
+    if (a = arguments, c = this, f = t, o) {
+      if (n === void 0)
+        return P(f);
+      if (d)
+        return clearTimeout(n), n = setTimeout(l, e), T(f);
+    }
+    return n === void 0 && (n = setTimeout(l, e)), s;
+  }
+  return j.cancel = M, j.flush = B, j;
+}
+var Xr = Wr, Pr = Array.isArray, Cr = Pr, Mr = R, Br = Cr, Fr = W, Ur = "[object String]";
+function Dr(r) {
+  return typeof r == "string" || !Br(r) && Fr(r) && Mr(r) == Ur;
+}
+var qr = Dr;
+export {
+  Xr as d,
+  qr as i
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/core": "*",
@@ -9,7 +9,7 @@
     "lodash.throttle": "^4.1.1",
     "react-helmet-async": "^1.3.0",
     "react-hook-form": "^7.33.1",
-    "react-router-dom": "^6.3.0",
+    "react-router-dom": "6.3.0",
     "simplebar-react": "2.4.1",
     "yup": "^0.32.11"
   },
@@ -24,7 +24,7 @@
     "react-helmet-async": "^1.3.0",
     "react-hook-form": "^7.33.1",
     "react-intersection-observer": "^9.4.0",
-    "react-router-dom": "^6.3.0",
+    "react-router-dom": "6.3.0",
     "yup": "^0.32.11"
   },
   "files": [

package/components/hook-form/RHFAutocomplete/index.b7f11146.js

@@ -1,146 +0,0 @@
-import { useModuleDictionary as F, useModuleSkeleton as H } from "@m4l/core";
-import { useFormContext as M, Controller as $ } from "react-hook-form";
-import { Skeleton as O, Autocomplete as q, TextField as E } from "@mui/material";
-import { styled as l } from "@mui/material/styles";
-import { I as w } from "../../Image/index.c9da2d5a.js";
-import { useMemo as V } from "react";
-import { jsxs as T, jsx as i } from "react/jsx-runtime";
-const j = l("div")(() => ({
-  display: "flex",
-  width: "100%",
-  flexDirection: "column"
-})), D = l("div")(({
-  theme: e
-}) => ({
-  width: "100%",
-  display: "grid",
-  gridTemplateColumns: "1fr auto",
-  gridGap: e.spacing(2),
-  alignItems: "center",
-  height: `${e.spacing(4.5)}`,
-  border: `1px solid ${e.palette.divider}`,
-  borderRadius: `${e.spacing(1)}`,
-  padding: `0 ${e.spacing(2)}`,
-  [e.breakpoints.down("md")]: {
-    width: "100%"
-  }
-})), K = l("div")(({
-  theme: e
-}) => ({
-  display: "flex",
-  width: "100%",
-  "& .MuiAutocomplete-root": {
-    width: "100%"
-  },
-  "& .m4l_image": {
-    marginLeft: e.spacing(1.5)
-  }
-})), P = l("li")(({
-  theme: e
-}) => ({
-  "& .m4l_image": {
-    marginRight: e.spacing(1.5)
-  }
-}));
-function U(e, a, d) {
-  return function(n, s) {
-    return /* @__PURE__ */ T(P, {
-      ...n,
-      children: [/* @__PURE__ */ i(w, {
-        src: e(s),
-        width: a,
-        height: d
-      }), n.key]
-    });
-  };
-}
-function Y(e) {
-  const {
-    name: a,
-    getOptionLabel: d,
-    isOptionEqualToValue: u,
-    label: n,
-    skeletonWidth: s = 100,
-    skeletonHeight: b = "18px",
-    options: I,
-    disabled: v,
-    getOptionUrlImage: r,
-    imageWidth: c = "24px",
-    imageHeight: m = "24px",
-    onOpen: k,
-    onClose: _,
-    loading: L,
-    ...C
-  } = e, {
-    getLabel: g
-  } = F(), R = H(), {
-    control: S
-  } = M(), h = V(() => r !== void 0, [r]), y = (t) => t == null ? "" : d(t), f = (t) => t == null || r === void 0 ? "" : r(t), A = (t, o) => o == null || t === null ? !1 : u(t, o);
-  return R ? /* @__PURE__ */ i(j, {
-    children: /* @__PURE__ */ T(D, {
-      children: [/* @__PURE__ */ i(O, {
-        variant: "text",
-        width: s,
-        height: b
-      }, "sk1"), /* @__PURE__ */ i(O, {
-        variant: "circular",
-        width: 16,
-        height: 16
-      }, "sk2")]
-    })
-  }) : /* @__PURE__ */ i($, {
-    name: a,
-    control: S,
-    render: ({
-      field: {
-        onChange: t,
-        value: o
-      },
-      fieldState: {
-        error: x
-      }
-    }) => /* @__PURE__ */ i(K, {
-      className: "m4l_rhf_autocomplete",
-      children: /* @__PURE__ */ i(q, {
-        options: I,
-        getOptionLabel: y,
-        isOptionEqualToValue: A,
-        disableClearable: !0,
-        value: o || null,
-        onOpen: k,
-        onClose: _,
-        onChange: (p, W) => {
-          t(W);
-        },
-        loading: L,
-        loadingText: g("rhf_autocomplete.loading_options"),
-        disabled: v,
-        noOptionsText: g("rhf_autocomplete.no_options"),
-        renderOption: h ? U(f, c, m) : void 0,
-        renderInput: (p) => /* @__PURE__ */ i(E, {
-          ...p,
-          label: n,
-          fullWidth: !0,
-          SelectProps: {
-            native: !0
-          },
-          InputProps: {
-            ...p.InputProps,
-            startAdornment: h && o ? /* @__PURE__ */ i(w, {
-              src: f(o),
-              width: c,
-              height: m
-            }, "ImageTextField") : null
-          },
-          autoComplete: "off",
-          error: !!x,
-          helperText: x?.message,
-          ...C
-        })
-      })
-    })
-  });
-}
-export {
-  Y as R
-};

package/components/hook-form/RHFAutocompleteAsync/index.97a5a66e.js

@@ -1,51 +0,0 @@
-import { useState as o, useEffect as p } from "react";
-import { useNetwork as y, getPropertyByString as A } from "@m4l/core";
-import { useFormContext as L } from "react-hook-form";
-import { R as k } from "../RHFAutocomplete/index.b7f11146.js";
-import { jsx as w } from "react/jsx-runtime";
-function j(l) {
-  const {
-    name: n,
-    endPoint: e,
-    timeout: f = 5e3,
-    parms: s,
-    resultField: c = "data",
-    isRemote: d = !0,
-    ...g
-  } = l, {
-    setValue: O
-  } = L(), {
-    networkOperation: R
-  } = y(), [F, r] = o([]), [h, i] = o(!1), [m, u] = o(!1), t = h && !m && !!e;
-  return p(() => {
-    m && (u(!1), r([]), O(n, null));
-  }, [s, e]), p(() => {
-    let a = !0;
-    if (!!t)
-      return R({
-        method: "GET",
-        endPoint: e,
-        timeout: f,
-        parms: s,
-        isRemote: d
-      }).then((x) => {
-        a && (r(A(x, c)), u(!0));
-      }), () => {
-        a = !1;
-      };
-  }, [t]), console.log("Loading", t), /* @__PURE__ */ w(k, {
-    name: n,
-    loading: t,
-    options: F,
-    onOpen: () => {
-      i(!0);
-    },
-    onClose: () => {
-      i(!1);
-    },
-    ...g
-  });
-}
-export {
-  j as R
-};