@m4l/components 0.1.25 → 0.1.27

package/components/mui_extended/Popover/index.cb2ccc66.js

@@ -0,0 +1,252 @@
+import { useState as d, useEffect as I } from "react";
+import { Popover as x, styled as h, Stack as O, MenuItem as S } from "@mui/material";
+import { I as P } from "../../Image/index.c9da2d5a.js";
+import { useLocales as v } from "@m4l/graphics";
+import { useEnvironment as L, useNetwork as k } from "@m4l/core";
+import "../../Icon/index.619c31c4.js";
+import { styled as C } from "@mui/material/styles";
+import { jsxs as m, jsx as i, Fragment as R } from "react/jsx-runtime";
+import "../Accordion/index.a02ac6ae.js";
+import "../Avatar/index.fe06afd7.js";
+import "react-router-dom";
+import "@mui/material/Button";
+import { C as E } from "../CircularProgress/index.ad569afd.js";
+import "@mui/lab";
+import { I as N } from "../Button/index.51dae0bb.js";
+import "../../CommonActions/components/Actions/index.edeb05c2.js";
+import "../Pager/index.1dc45f5e.js";
+import "../Tab/index.e0653a0a.js";
+const y = C("span")(({
+  arrowType: t,
+  theme: n
+}) => {
+  const o = `solid 1px ${n.palette.grey[50012]}`, a = {
+    borderRadius: "0 0 3px 0",
+    top: -6,
+    borderBottom: o,
+    borderRight: o
+  }, l = {
+    borderRadius: "3px 0 0 0",
+    bottom: -6,
+    borderTop: o,
+    borderLeft: o
+  }, s = {
+    borderRadius: "0 3px 0 0",
+    left: -6,
+    borderTop: o,
+    borderRight: o
+  }, r = {
+    borderRadius: "0 0 0 3px",
+    right: -6,
+    borderBottom: o,
+    borderLeft: o
+  };
+  return {
+    display: "none",
+    [n.breakpoints.up("sm")]: {
+      zIndex: 1,
+      width: 12,
+      height: 12,
+      content: "''",
+      position: "absolute",
+      display: "block",
+      transform: "rotate(-135deg)",
+      background: n.palette.background.paper
+    },
+    ...t === "top-left" && {
+      ...a,
+      left: 20
+    },
+    ...t === "top-center" && {
+      ...a,
+      left: 0,
+      right: 0,
+      margin: "auto"
+    },
+    ...t === "top-right" && {
+      ...a,
+      right: 20
+    },
+    ...t === "bottom-left" && {
+      ...l,
+      left: 20
+    },
+    ...t === "bottom-center" && {
+      ...l,
+      left: 0,
+      right: 0,
+      margin: "auto"
+    },
+    ...t === "bottom-right" && {
+      ...l,
+      right: 20
+    },
+    ...t === "left-top" && {
+      ...s,
+      top: 20
+    },
+    ...t === "left-center" && {
+      ...s,
+      top: 0,
+      bottom: 0,
+      margin: "auto"
+    },
+    ...t === "left-bottom" && {
+      ...s,
+      bottom: 20
+    },
+    ...t === "right-top" && {
+      ...r,
+      top: 20
+    },
+    ...t === "right-center" && {
+      ...r,
+      top: 0,
+      bottom: 0,
+      margin: "auto"
+    },
+    ...t === "right-bottom" && {
+      ...r,
+      bottom: 20
+    }
+  };
+});
+function _({
+  children: t,
+  arrowType: n = "top-right",
+  sx: p,
+  className: c,
+  ...o
+}) {
+  return /* @__PURE__ */ m(x, {
+    className: `m4l_popover ${c || ""}`,
+    anchorOrigin: {
+      vertical: "bottom",
+      horizontal: "right"
+    },
+    transformOrigin: {
+      vertical: "top",
+      horizontal: "right"
+    },
+    PaperProps: {
+      sx: {
+        p: 1,
+        overflow: "inherit",
+        ...p
+      }
+    },
+    ...o,
+    children: [n !== "no-arrow" && /* @__PURE__ */ i(y, {
+      arrowType: n
+    }), t]
+  });
+}
+const z = h("span")(({
+  theme: t
+}) => ({
+  marginLeft: t.spacing(1)
+})), B = h("div")(({
+  theme: t
+}) => ({
+  padding: t.spacing(0.75, 0),
+  margin: t.spacing(0, 1.25)
+})), M = h("div")(() => ({
+  display: "flex",
+  flexDirection: "column"
+}));
+function T() {
+  const {
+    currentLocale: t,
+    onChangeLocale: n
+  } = v(), {
+    domain_token: p
+  } = L(), {
+    networkOperation: c
+  } = k(), [o, a] = d(null), [l, s] = d(!1), [r, f] = d([]), b = (e) => {
+    console.log("handleOpen", r, l), a(e.currentTarget);
+  }, u = () => {
+    a(null);
+  };
+  return I(() => {
+    let e = !0;
+    if (!(o === null || l || r.length > 0))
+      return s(!0), c({
+        method: "GET",
+        endPoint: "na/locales",
+        parms: {
+          domain_token: p
+        }
+      }).then((g) => {
+        console.log("Response", g.data), e && f(g.data);
+      }).finally(() => {
+        s(!1);
+      }), function() {
+        e = !1;
+      };
+  }, [o]), console.log("Render lang", r, l), /* @__PURE__ */ m(R, {
+    children: [/* @__PURE__ */ i(N, {
+      className: "m4l_language_popover",
+      onClick: b,
+      sx: {
+        width: 40,
+        height: 40,
+        ...o && {
+          bgcolor: "action.selected"
+        }
+      },
+      src: t?.url_icon || "",
+      alt: t?.name,
+      width: "24px",
+      height: "24px",
+      skeletonVariant: "circle",
+      tooltip: "dddd"
+    }), /* @__PURE__ */ i(_, {
+      arrowType: "top-right",
+      open: Boolean(o),
+      anchorEl: o,
+      anchorOrigin: {
+        vertical: "bottom",
+        horizontal: "right"
+      },
+      onClose: u,
+      sx: {
+        mt: 1.5,
+        ml: 0.75,
+        width: 180,
+        rowGap: "100px",
+        "& .MuiMenuItem-root": {
+          px: 1,
+          typography: "body2",
+          borderRadius: 0.75
+        }
+      },
+      children: /* @__PURE__ */ m(M, {
+        children: [r.length === 0 && /* @__PURE__ */ i(B, {
+          children: /* @__PURE__ */ i(E, {
+            size: "20px"
+          })
+        }), r.length > 0 && /* @__PURE__ */ i(O, {
+          spacing: 0.75,
+          children: r.map((e) => /* @__PURE__ */ m(S, {
+            selected: e.lang === t?.lang && e?.script === t?.script && e?.region === t?.region,
+            onClick: () => {
+              n(e), u();
+            },
+            children: [/* @__PURE__ */ i(P, {
+              alt: e.name,
+              src: e.url_icon,
+              width: "24px",
+              height: "24px"
+            }), /* @__PURE__ */ i(z, {
+              children: e.name
+            })]
+          }, e.lang || e.script || e.region))
+        })]
+      })
+    })]
+  });
+}
+export {
+  T as L,
+  _ as P
+};

package/contexts/ModalContext/{index.f17b3653.js → index.9ebc793c.js}

@@ -4,9 +4,9 @@ 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.a24ca508.js";
-import { A as $ } from "../../components/CommonActions/components/ActionIntro/index.f8403e8e.js";
-import { A as b } from "../../components/CommonActions/components/ActionCancel/index.9cfffe65.js";
+import { M as k } from "../../components/ModalDialog/index.ad61757f.js";
+import { A as $ } from "../../components/CommonActions/components/ActionIntro/index.85557b90.js";
+import { A as b } from "../../components/CommonActions/components/ActionCancel/index.431160ba.js";
 import { b as A } from "../../utils/index.214d9542.js";
 const j = l("div")(() => ({
   display: "flex",

package/hooks/useModal/{index.b1f96279.js → index.34f5978e.js}

@@ -1,5 +1,5 @@
 import { useContext as t } from "react";
-import { M as e } from "../../contexts/ModalContext/index.f17b3653.js";
+import { M as e } from "../../contexts/ModalContext/index.9ebc793c.js";
 function s() {
   const o = t(e);
   if (!o)

package/index.js

@@ -1,4 +1,4 @@
-import { I as N, a as h } from "./components/mui_extended/IconButton/index.4b5ce8b5.js";
+import { I as N, a as h } from "./components/mui_extended/IconButton/index.a321e5cb.js";
 import "framer-motion";
 import "@mui/material";
 import "react/jsx-runtime";
@@ -14,42 +14,42 @@ import "lodash/debounce";
 import { R as W } from "./components/hook-form/RHFCheckbox/index.6dcec9e2.js";
 import "@mui/x-date-pickers";
 import { R as J } from "./components/hook-form/RHFDateTime/index.9231a7c7.js";
-import { R as Q, a as X } from "./components/hook-form/RHFTextField/index.ba2a8f67.js";
-import { I as Z } from "./components/Icon/index.f569765b.js";
-import { R as $ } from "./components/hook-form/RHFPeriod/index.067790c9.js";
+import { R as Q, a as X } from "./components/hook-form/RHFTextField/index.f9aaaa90.js";
+import { I as Z } from "./components/Icon/index.619c31c4.js";
+import { R as $ } from "./components/hook-form/RHFPeriod/index.e08fb1ab.js";
 import { E as ro } from "./components/ErrorLabel/index.c8615f16.js";
-import { P as ao, g as eo } from "./components/Period/index.080a987d.js";
-import { b as so, M as io, d as po, g as no } from "./components/CommonActions/components/Actions/index.309d3b6f.js";
+import { P as ao, g as eo } from "./components/Period/index.81de7941.js";
+import { b as so, M as io, d as po, g as no } from "./components/CommonActions/components/Actions/index.edeb05c2.js";
 import "@mui/material/Button";
-import { M as xo, a as fo } from "./contexts/ModalContext/index.f17b3653.js";
+import { M as xo, a as fo } from "./contexts/ModalContext/index.9ebc793c.js";
 import "@mui/lab";
 import "lodash/isString";
 import "react-dropzone";
-import { R as go } from "./components/hook-form/RHFUpload/index.6347159a.js";
-import { A as uo } from "./components/mui_extended/Accordion/index.49f5df8e.js";
-import { A as yo } from "./components/mui_extended/Avatar/index.dadb0528.js";
-import { B as Ao, L as Po } from "./components/mui_extended/Button/index.2afaa420.js";
-import { L as Lo, P as Ho } from "./components/mui_extended/Popover/index.12b0ab55.js";
-import { P as Mo, g as bo } from "./components/mui_extended/Pager/index.a23cf8de.js";
+import { R as go } from "./components/hook-form/RHFUpload/index.ec4d5326.js";
+import { A as uo } from "./components/mui_extended/Accordion/index.a02ac6ae.js";
+import { A as yo } from "./components/mui_extended/Avatar/index.fe06afd7.js";
+import { B as Ao, L as Po } from "./components/mui_extended/Button/index.51dae0bb.js";
+import { L as Lo, P as Ho } from "./components/mui_extended/Popover/index.cb2ccc66.js";
+import { P as Mo, g as bo } from "./components/mui_extended/Pager/index.1dc45f5e.js";
 import { T as Io } from "./components/mui_extended/Tab/index.e0653a0a.js";
-import { D as So, N as Eo, T as No, g as ho } from "./components/DataGrid/index.fe073438.js";
+import { D as So, N as Eo, T as No, g as ho } from "./components/DataGrid/index.2ce9da7d.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
 import "@m4l/graphics";
 import { S as Uo } from "./components/ScrollBar/index.39eeb2de.js";
-import { D as ko, d as Go, g as zo } from "./components/DynamicFilter/index.d0753667.js";
+import { D as ko, d as Go, g as zo } from "./components/DynamicFilter/index.e1d4a948.js";
 import "simplebar/dist/simplebar.min.css";
 import { R as wo } from "./components/contexts/RHFormContext/index.33dba822.js";
 import "yup";
 import "./react-draggable.20e95c61.js";
-import { M as qo, d as Jo, g as Ko } from "./components/ModalDialog/index.a24ca508.js";
+import { M as qo, d as Jo, g as Ko } from "./components/ModalDialog/index.ad61757f.js";
 import { R as Xo } from "./components/Resizeable/index.45995d2b.js";
 import { N as Zo, d as _o, g as $o } from "./components/NoItemSelected/index.9609a7f7.js";
-import { O as rr, d as tr, g as ar } from "./components/ObjectLogs/index.a7d36267.js";
+import { O as rr, d as tr, g as ar } from "./components/ObjectLogs/index.6ebaec71.js";
 import "./react-json-view.f56a7f8e.js";
-import { P as mr } from "./components/PaperForm/index.3f8c7ef2.js";
-import { H as ir } from "./components/Page/index.fc660ee5.js";
-import { P as nr } from "./components/PropertyValue/index.ab3dd7e9.js";
+import { P as mr } from "./components/PaperForm/index.ec9cb8c9.js";
+import { H as ir } from "./components/Page/index.4237c241.js";
+import { P as nr } from "./components/PropertyValue/index.dfcfe1ba.js";
 import "./react-splitter-layout.7810ac1b.js";
 import { S as xr } from "./components/SplitLayout/index.4032673d.js";
 import { v as lr } from "./components/animate/variants/fade.b561c0fc.js";
@@ -67,17 +67,17 @@ import { B as jr } from "./components/mui_extended/Breadcrumbs/index.5e37d903.js
 import { C as Gr } from "./components/mui_extended/CircularProgress/index.ad569afd.js";
 import { L as Vr } from "./components/mui_extended/LinkWithRoute/index.16436ab8.js";
 import { T as Wr } from "./components/mui_extended/Typography/index.e5494696.js";
-import { B as Jr, c as Kr } from "./components/formatters/BooleanFormatter/index.3ec56305.js";
-import { D as Xr, c as Yr } from "./components/formatters/DateFormatter/index.08d8823b.js";
-import { P as _r, a as $r, U as ot, e as rt, b as tt, c as at, d as et, g as mt } from "./components/formatters/index.6959c2de.js";
-import { A as it } from "./components/CommonActions/components/ActionCancel/index.9cfffe65.js";
-import { A as nt } from "./components/CommonActions/components/ActionIntro/index.f8403e8e.js";
-import { A as xt } from "./components/CommonActions/components/ActionFormCancel/index.ef60c2ee.js";
+import { B as Jr, c as Kr } from "./components/formatters/BooleanFormatter/index.8da35c9c.js";
+import { D as Xr, c as Yr } from "./components/formatters/DateFormatter/index.1b9baacc.js";
+import { P as _r, a as $r, U as ot, e as rt, b as tt, c as at, d as et, g as mt } from "./components/formatters/index.c2a9b55d.js";
+import { A as it } from "./components/CommonActions/components/ActionCancel/index.431160ba.js";
+import { A as nt } from "./components/CommonActions/components/ActionIntro/index.85557b90.js";
+import { A as xt } from "./components/CommonActions/components/ActionFormCancel/index.6a0f34aa.js";
 import { A as lt } from "./components/CommonActions/components/ActionFormIntro/index.ca4d2674.js";
 import { L as gt } from "./components/Loadable/index.f5518558.js";
 import { S as ut } from "./components/ScrollToTop/index.e06f98f6.js";
 import { u as yt } from "./hooks/useFormAddEdit/index.d4845f1a.js";
-import { u as At } from "./hooks/useModal/index.b1f96279.js";
+import { u as At } from "./hooks/useModal/index.34f5978e.js";
 import { L as Ct } from "./assets/Logo/index.228dcb5a.js";
 import "./utils/index.214d9542.js";
 import "./react-data-grid.d46d625e.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "0.1.25",
+  "version": "0.1.27",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/core": "*",

package/components/Page/index.fc660ee5.js

@@ -1,27 +0,0 @@
-import { Helmet as a } from "react-helmet-async";
-import { useLocales as c } from "@m4l/graphics";
-import { useModuleSkeleton as u } from "@m4l/core";
-import { jsxs as t, Fragment as d, jsx as r } from "react/jsx-runtime";
-const p = (l) => {
-  const {
-    children: o,
-    title: n,
-    meta: m,
-    subtitle: e
-  } = l, {
-    currentLang: s
-  } = c(), i = u();
-  return /* @__PURE__ */ t(d, {
-    children: [!i && /* @__PURE__ */ t(a, {
-      children: [/* @__PURE__ */ r("title", {
-        children: `${n}${e ? ` | ${e}` : ""} `
-      }), /* @__PURE__ */ r("html", {
-        lang: s.value
-      }), m]
-    }), o]
-  });
-};
-p.displayName = "Page";
-export {
-  p as H
-};

package/components/mui_extended/Avatar/index.dadb0528.js

@@ -1,37 +0,0 @@
-import { forwardRef as p } from "react";
-import { useTheme as s } from "@mui/material/styles";
-import { Skeleton as f, Avatar as m } from "@mui/material";
-import { useModuleSkeleton as u } from "@m4l/core";
-import { jsx as t } from "react/jsx-runtime";
-const l = () => /* @__PURE__ */ t(f, {
-  variant: "circular",
-  width: "32px",
-  height: "32px"
-}), d = p(({
-  color: e = "default",
-  children: a,
-  sx: o,
-  ...n
-}, i) => {
-  const r = s();
-  return u() ? /* @__PURE__ */ t(l, {}) : e === "default" ? /* @__PURE__ */ t(m, {
-    ref: i,
-    sx: o,
-    ...n,
-    children: a
-  }) : /* @__PURE__ */ t(m, {
-    ref: i,
-    sx: {
-      fontWeight: r.typography.fontWeightMedium,
-      color: r.palette[e].contrastText,
-      backgroundColor: r.palette[e].main,
-      ...o
-    },
-    ...n,
-    children: a
-  });
-});
-d.displayName = "Avatar";
-export {
-  d as A
-};

package/components/mui_extended/IconButton/index.4b5ce8b5.js

@@ -1,103 +0,0 @@
-import { m as p } from "framer-motion";
-import { forwardRef as f, useMemo as v } from "react";
-import { IconButton as l, Box as I, Skeleton as b, Tooltip as h } from "@mui/material";
-import { jsx as e } from "react/jsx-runtime";
-import { useModuleDictionary as x, useModuleSkeleton as B } from "@m4l/core";
-import { I as d } from "../../Icon/index.f569765b.js";
-const g = {
-  hover: {
-    scale: 1.1
-  },
-  tap: {
-    scale: 0.95
-  }
-}, S = {
-  hover: {
-    scale: 1.09
-  },
-  tap: {
-    scale: 0.97
-  }
-}, k = {
-  hover: {
-    scale: 1.08
-  },
-  tap: {
-    scale: 0.99
-  }
-};
-function w({
-  size: n,
-  children: t
-}) {
-  const a = n === "small", o = n === "large";
-  return /* @__PURE__ */ e(I, {
-    component: p.div,
-    whileTap: "tap",
-    whileHover: "hover",
-    variants: a && g || o && k || S,
-    sx: {
-      display: "inline-flex"
-    },
-    children: t
-  });
-}
-const M = f(({
-  children: n,
-  size: t = "medium",
-  ...a
-}, o) => /* @__PURE__ */ e(w, {
-  size: t,
-  children: /* @__PURE__ */ e(l, {
-    size: t,
-    ref: o,
-    ...a,
-    children: n
-  })
-}));
-M.displayName = "IconButtonAnimate";
-const A = () => /* @__PURE__ */ e(b, {
-  variant: "circular",
-  width: "30px",
-  height: "30px"
-});
-function N({
-  src: n,
-  tooltip: t,
-  size: a = "small",
-  dictionaryTooltip: o,
-  bgColor: s = "primary.active",
-  rotate: c,
-  ...r
-}) {
-  const {
-    getLabel: i
-  } = x(), u = B(), m = v(() => {
-    if (!r.disabled)
-      return o && i ? i(o) : t;
-  }, [o, i, r.disabled]);
-  return u ? /* @__PURE__ */ e(A, {}) : m ? /* @__PURE__ */ e(h, {
-    title: m || "",
-    children: /* @__PURE__ */ e(l, {
-      size: a,
-      ...r,
-      children: /* @__PURE__ */ e(d, {
-        src: n,
-        bgColor: r.disabled ? "action.disabled" : s,
-        rotate: c
-      })
-    })
-  }) : /* @__PURE__ */ e(l, {
-    size: a,
-    ...r,
-    children: /* @__PURE__ */ e(d, {
-      src: n,
-      bgColor: r.disabled ? "action.disabled" : s,
-      rotate: c
-    })
-  });
-}
-export {
-  N as I,
-  M as a
-};