@m4l/graphics 0.1.33 → 0.1.35

package/contexts/HostThemeContext/index.a6a62c70.js

@@ -0,0 +1,50 @@
+import { createContext as H, useState as E, useMemo as v, useCallback as M, useEffect as c } from "react";
+import { CssBaseline as C } from "@mui/material";
+import { createTheme as O, StyledEngineProvider as N, ThemeProvider as S } from "@mui/material/styles";
+import { useHostTools as x, EmitEvents as o } from "@m4l/core";
+import { jsx as n, jsxs as F } from "react/jsx-runtime";
+const I = H(null);
+function b(l) {
+  const {
+    children: h,
+    hostThemeOptions: t,
+    fnComponentsOverrides: i,
+    isMicroFrontEnd: s
+  } = l, [r, m] = E(t), {
+    events_add_listener: a,
+    events_remove_listener: _,
+    events_emit: f
+  } = x(), [d, u] = E(!0), p = v(() => {
+    const e = O(r);
+    return e.components = i(e), e;
+  }, [r]), T = M((e) => {
+    m(e);
+  }, []);
+  return c(() => (s && a(o.EMMIT_EVENT_HOST_THEME_CHANGE, T), () => {
+    s && _(o.EMMIT_EVENT_HOST_THEME_CHANGE, T);
+  }), []), c(() => {
+    if (d) {
+      u(!1);
+      return;
+    }
+    s || (m(t), f(o.EMMIT_EVENT_HOST_THEME_CHANGE, t));
+  }, [t]), /* @__PURE__ */ n(I.Provider, {
+    value: {
+      hostThemeOptions: r,
+      fnComponentsOverrides: i
+    },
+    children: /* @__PURE__ */ n(N, {
+      injectFirst: !0,
+      children: /* @__PURE__ */ F(S, {
+        theme: p,
+        children: [/* @__PURE__ */ n(C, {
+          enableColorScheme: !0
+        }), h]
+      })
+    })
+  });
+}
+export {
+  I as H,
+  b as a
+};

package/contexts/LocalesContext/{index.5b555637.js → index.3fcfbe02.js}

@@ -1,13 +1,13 @@
 import { createContext as k, useState as _, useCallback as x, useEffect as L } from "react";
 import { AdapterDateFns as F } from "@mui/x-date-pickers/AdapterDateFns";
-import { LocalizationProvider as P } from "@mui/x-date-pickers";
-import { useEnvironment as U, useNetwork as I, useHostTools as j, useLocalStorageWithListener as w, EmitEvents as u } from "@m4l/core";
-import v from "date-fns/locale/en-US";
+import { LocalizationProvider as U } from "@mui/x-date-pickers";
+import { useEnvironment as P, useNetwork as I, useHostTools as j, useLocalStorageWithListener as w, EmitEvents as u } from "@m4l/core";
+import S from "date-fns/locale/en-US";
 import { jsx as g } from "react/jsx-runtime";
-async function B(t, e, n) {
+async function B(t, e, o) {
   const s = f(t), r = { ...t };
   let i;
-  return s === "es" ? i = (await import("date-fns/locale/es")).default : s === "fr" ? i = (await import("date-fns/locale/fr")).default : s === "en-US" ? i = v : (i = v, r.lang = "en", r.script = void 0, r.region = "US", r.url_icon = `${e}/${n}/frontend/commons/assets/icons/langs/lang_en.svg`, r.name = "English US*"), {
+  return s === "es" ? i = (await import("date-fns/locale/es")).default : s === "fr" ? i = (await import("date-fns/locale/fr")).default : s === "en-US" ? i = S : (i = S, r.lang = "en", r.script = void 0, r.region = "US", r.url_icon = `${e}/${o}/frontend/commons/assets/icons/langs/lang_en.svg`, r.name = "English US*"), {
     ...r,
     module: i,
     localeString: f(r)
@@ -37,35 +37,35 @@ const G = k(null);
 function J(t) {
   const {
     children: e,
-    isMicroFrontEnd: n,
+    isMicroFrontEnd: o,
     localeHost: s,
     getLocaleFromNetwork: r
   } = t;
-  if (n && !s)
+  if (o && !s)
     throw Error("Must set localeHost in microfrontend");
-  if (!n && !r)
+  if (!o && !r)
     throw Error("Must set getLocaleFromNetwork in host");
   const {
     domain_token: i,
-    host_static_assets: S,
+    host_static_assets: v,
     environment_assets: h
-  } = U(), {
+  } = P(), {
     networkOperation: C
   } = I(), {
     events_add_listener: N,
     events_remove_listener: T,
     events_emit: H
   } = j(), [a, d] = _(() => {
-    if (n)
+    if (o)
       return s;
-  }), [l, m] = w("localeHost", navigator.language), [M, A] = _(""), p = x((o) => {
-    d(o);
+  }), [l, m] = w("localeHost", navigator.language), [M, A] = _(""), p = x((n) => {
+    d(n);
   }, []);
-  if (L(() => (n && N(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p), console.log("useEffect LocalesProvider"), () => {
-    n && T(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p);
+  if (L(() => (o && N(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p), () => {
+    o && T(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p);
   }), []), L(() => {
-    let o = !0;
-    if (!n && !!r && !(l === M && l !== ""))
+    let n = !0;
+    if (!o && !!r && !(l === M && l !== ""))
       return C({
         method: "POST",
         endPoint: "na/locales",
@@ -74,24 +74,24 @@ function J(t) {
           domain_token: i
         }
       }).then((E) => {
-        o && r(E.data, S, h).then((c) => {
+        n && r(E.data, v, h).then((c) => {
           d(c), A(c.localeString), l !== c.localeString && m(c.localeString), H(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, c);
         });
       }).finally(() => {
       }), function() {
-        o = !1;
+        n = !1;
       };
   }, [l]), !a)
     return /* @__PURE__ */ g("div", {});
-  const O = (o) => {
-    (o.lang !== a.lang || o.script !== a.script || o.region !== a.region) && m(f(o));
+  const O = (n) => {
+    (n.lang !== a.lang || n.script !== a.script || n.region !== a.region) && m(f(n));
   };
   return /* @__PURE__ */ g(G.Provider, {
     value: {
       currentLocale: a,
       onChangeLocale: O
     },
-    children: /* @__PURE__ */ g(P, {
+    children: /* @__PURE__ */ g(U, {
       dateAdapter: F,
       adapterLocale: a.module,
       dateFormats: {

package/contexts/index.84089632.js

@@ -0,0 +1,4 @@
+import "./FormatterContext/index.92336f4c.js";
+import "./LocalesContext/index.3fcfbe02.js";
+import "date-fns/locale/en-US";
+import "./HostThemeContext/index.a6a62c70.js";

package/hooks/{index.64cf4fc4.js → index.a4ef9776.js}

@@ -1,7 +1,7 @@
 import { useRef as n, useEffect as s, useState as u, useContext as f } from "react";
-import { H as i } from "../contexts/HostThemeContext/index.9fe9854f.js";
+import { H as i } from "../contexts/HostThemeContext/index.a6a62c70.js";
 import "../contexts/FormatterContext/index.92336f4c.js";
-import "../contexts/LocalesContext/index.5b555637.js";
+import "../contexts/LocalesContext/index.3fcfbe02.js";
 import "@mui/material/styles";
 import "@mui/material/useMediaQuery";
 function T() {

package/hooks/useFirstRender/index.d.ts

@@ -1 +1,2 @@
-export declare function useFirstRender(dependencies?: Array<any>): boolean;
+import { DependencyList } from 'react';
+export declare function useFirstRender(dependencies?: DependencyList): boolean;

package/hooks/useLocales/{index.f676279e.js → index.8154a401.js}

@@ -1,5 +1,5 @@
 import { useContext as o } from "react";
-import { L as t } from "../../contexts/LocalesContext/index.5b555637.js";
+import { L as t } from "../../contexts/LocalesContext/index.3fcfbe02.js";
 const n = () => {
   const e = o(t);
   if (!e)

package/index.js

@@ -1,13 +1,13 @@
 import { P as x } from "./components/ProgressBarStyle/index.fb6fd9ed.js";
-import { F as l, a as F } from "./contexts/FormatterContext/index.92336f4c.js";
-import { L as v, a as C, g as L } from "./contexts/LocalesContext/index.5b555637.js";
-import { H as c, a as H } from "./contexts/HostThemeContext/index.9fe9854f.js";
-import { u as T } from "./hooks/useFirstRender/index.1e9b02fb.js";
-import { u as h } from "./hooks/useFormatter/index.57ac8cca.js";
-import { b as S, u as b, a as w } from "./hooks/index.64cf4fc4.js";
-import { u as z } from "./hooks/useLocales/index.f676279e.js";
-import { u as D, a as I } from "./hooks/useResponsive/index.fc5e1b4f.js";
-import { C as N } from "./utils/index.54cae015.js";
+import { F as l, a as d } from "./contexts/FormatterContext/index.92336f4c.js";
+import { L as P, a as c, g } from "./contexts/LocalesContext/index.3fcfbe02.js";
+import { H as C, a as L } from "./contexts/HostThemeContext/index.a6a62c70.js";
+import { u as H } from "./hooks/useFirstRender/index.1e9b02fb.js";
+import { u as T } from "./hooks/useFormatter/index.57ac8cca.js";
+import { b as w, u as S, a as b } from "./hooks/index.a4ef9776.js";
+import { u as z } from "./hooks/useLocales/index.8154a401.js";
+import { u as B, a as D } from "./hooks/useResponsive/index.fc5e1b4f.js";
+import { C as I, g as M } from "./utils/index.6909c662.js";
 import "@mui/material/styles";
 import "@mui/material";
 import "react/jsx-runtime";
@@ -18,21 +18,22 @@ import "@mui/x-date-pickers";
 import "date-fns/locale/en-US";
 import "@mui/material/useMediaQuery";
 export {
-  N as Capitalize,
+  I as Capitalize,
   l as FormatterContext,
-  F as FormatterProvider,
-  c as HostThemeContext,
-  H as HostThemeProvider,
-  v as LocalesContext,
-  C as LocalesProvider,
+  d as FormatterProvider,
+  C as HostThemeContext,
+  L as HostThemeProvider,
+  P as LocalesContext,
+  c as LocalesProvider,
   x as ProgressBarStyle,
-  L as getLocaleFromNetwork,
-  T as useFirstRender,
-  h as useFormatter,
-  S as useHostTheme,
-  b as useIsMountedRef,
+  M as getAnchorElPositionWindow,
+  g as getLocaleFromNetwork,
+  H as useFirstRender,
+  T as useFormatter,
+  w as useHostTheme,
+  S as useIsMountedRef,
   z as useLocales,
-  w as useOffSetTop,
-  D as useResponsive,
-  I as useResponsiveDesktop
+  b as useOffSetTop,
+  B as useResponsive,
+  D as useResponsiveDesktop
 };

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@m4l/graphics",
-  "version": "0.1.33",
+  "version": "0.1.35",
   "license": "UNLICENSED",
   "author": "M4L Team",
   "dependencies": {
     "@m4l/core": "*",
-    "@mui/x-date-pickers": "^5.0.0-beta.3",
+    "@mui/x-date-pickers": "6.2.0",
     "date-fns": "^2.29.2"
   },
   "peerDependencies": {
-    "@mui/material": "^5.10.4",
-    "@mui/system": "^5.10.4",
+    "@mui/material": "5.10.4",
+    "@mui/system": "5.10.4",
     "@types/react": "^17.0.0 || ^18.0.0",
     "react": "^17.0.0 || ^18.0.0",
     "react-toastify": "9.0.5"

package/utils/anchorEl.d.ts

@@ -0,0 +1,13 @@
+export declare type AnchorEl = HTMLElement | (() => HTMLElement);
+export interface AnchorOrigin {
+    vertical: 'top' | 'center' | 'bottom' | number;
+    horizontal: 'left' | 'center' | 'right' | number;
+}
+export interface AnchorPosition {
+    top: number;
+    left: number;
+}
+export declare const getAnchorElPositionWindow: (anchorElement: HTMLElement, newWindowRect: Pick<DOMRect, 'width' | 'height'>, anchorOrigin: AnchorOrigin, transformOrigin: AnchorOrigin, marginThreshold?: number) => {
+    top: number;
+    left: number;
+};

package/utils/index.6909c662.js

@@ -0,0 +1,51 @@
+const y = (t) => t && t[0].toUpperCase() + t.slice(1) || "";
+function A(t, e) {
+  let o = 0;
+  return typeof e == "number" ? o = e : e === "center" ? o = t.height / 2 : e === "bottom" && (o = t.height), o;
+}
+function C(t, e) {
+  let o = 0;
+  return typeof e == "number" ? o = e : e === "center" ? o = t.width / 2 : e === "right" && (o = t.width), o;
+}
+function b(t) {
+  return typeof t == "function" ? t() : t;
+}
+const v = (t, e) => {
+  const f = b(t).getBoundingClientRect();
+  return {
+    top: f.top + A(f, e.vertical),
+    left: f.left + C(f, e.horizontal)
+  };
+}, w = (t, e) => ({
+  vertical: A(t, e.vertical),
+  horizontal: C(t, e.horizontal)
+}), O = (t, e, o, f, i = 16) => {
+  const r = v(t, o), l = w(e, f), h = document.getElementById("ContainerAreas")?.getBoundingClientRect() || {
+    top: 0,
+    left: 0
+  };
+  let s = r.top - l.vertical, c = r.left - l.horizontal;
+  const u = s + e.height, d = c + e.width, p = window, g = p.innerHeight - i, a = p.innerWidth - i;
+  if (s < i) {
+    const n = s - i;
+    s -= n;
+  } else if (u > g) {
+    const n = u - g;
+    s -= n;
+  }
+  if (c < i) {
+    const n = c - i;
+    c -= n;
+  } else if (d > a) {
+    const n = d - a;
+    c -= n;
+  }
+  return {
+    top: Math.round(s) - h.top,
+    left: Math.round(c) - h.left
+  };
+};
+export {
+  y as C,
+  O as g
+};

package/utils/index.d.ts

@@ -1 +1,2 @@
 export * from './strings';
+export * from './anchorEl';

package/contexts/HostThemeContext/index.9fe9854f.js

@@ -1,50 +0,0 @@
-import { createContext as H, useState as E, useMemo as v, useCallback as M, useEffect as c } from "react";
-import { CssBaseline as C } from "@mui/material";
-import { createTheme as O, StyledEngineProvider as N, ThemeProvider as S } from "@mui/material/styles";
-import { useHostTools as x, EmitEvents as n } from "@m4l/core";
-import { jsx as r, jsxs as F } from "react/jsx-runtime";
-const I = H(null);
-function b(h) {
-  const {
-    children: a,
-    hostThemeOptions: t,
-    fnComponentsOverrides: i,
-    isMicroFrontEnd: o
-  } = h, [s, m] = E(t), {
-    events_add_listener: f,
-    events_remove_listener: _,
-    events_emit: d
-  } = x(), [u, p] = E(!0), T = v(() => {
-    const e = O(s);
-    return e.components = i(e), e;
-  }, [s]), l = M((e) => {
-    m(e);
-  }, []);
-  return c(() => (o && f(n.EMMIT_EVENT_HOST_THEME_CHANGE, l), () => {
-    o && _(n.EMMIT_EVENT_HOST_THEME_CHANGE, l);
-  }), []), c(() => {
-    if (u) {
-      p(!1);
-      return;
-    }
-    o || (m(t), d(n.EMMIT_EVENT_HOST_THEME_CHANGE, t));
-  }, [t]), console.log("final theme", T), /* @__PURE__ */ r(I.Provider, {
-    value: {
-      hostThemeOptions: s,
-      fnComponentsOverrides: i
-    },
-    children: /* @__PURE__ */ r(N, {
-      injectFirst: !0,
-      children: /* @__PURE__ */ F(S, {
-        theme: T,
-        children: [/* @__PURE__ */ r(C, {
-          enableColorScheme: !0
-        }), a]
-      })
-    })
-  });
-}
-export {
-  I as H,
-  b as a
-};

package/contexts/index.8c4de295.js

@@ -1,4 +0,0 @@
-import "./FormatterContext/index.92336f4c.js";
-import "./LocalesContext/index.5b555637.js";
-import "date-fns/locale/en-US";
-import "./HostThemeContext/index.9fe9854f.js";

package/utils/index.54cae015.js

@@ -1,4 +0,0 @@
-const a = (e) => e && e[0].toUpperCase() + e.slice(1) || "";
-export {
-  a as C
-};