@m4l/graphics 0.1.10 → 0.1.12

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/HostThemeContext/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { HostThemeProviderProps } from './types';
-declare const HostThemeContext: import("react").Context<import("./types").HostThemeType>;
+declare const HostThemeContext: import("react").Context<import("./types").HostThemeType | null>;
 declare function HostThemeProvider(props: HostThemeProviderProps): JSX.Element;
 export { HostThemeProvider, HostThemeContext };

package/contexts/LocalesContext/helper.d.ts

@@ -0,0 +1,4 @@
+import { BaseLocale, LocaleType, NetworkLocaleType } from './types';
+export declare function getLocaleFromNetwork(locale: NetworkLocaleType, host_static_assets: string, environment_assets: string): Promise<LocaleType>;
+export declare function joinLocale(baseLocale: BaseLocale): string;
+export declare function splitLocale(locale: string): BaseLocale;

package/contexts/LocalesContext/index.3fcfbe02.js

@@ -0,0 +1,108 @@
+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 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, 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 = 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)
+  };
+}
+function f(t) {
+  let e = t.lang;
+  return t.script && t.script !== "" && (e = e + "-" + t.script), t.region && t.region !== "" && (e = e + "-" + t.region), e;
+}
+function y(t) {
+  try {
+    const e = new Intl.Locale(t);
+    return {
+      lang: e.language || "",
+      script: e.script,
+      region: e.region
+    };
+  } catch {
+    return {
+      lang: "en",
+      script: void 0,
+      region: "US"
+    };
+  }
+}
+const G = k(null);
+function J(t) {
+  const {
+    children: e,
+    isMicroFrontEnd: o,
+    localeHost: s,
+    getLocaleFromNetwork: r
+  } = t;
+  if (o && !s)
+    throw Error("Must set localeHost in microfrontend");
+  if (!o && !r)
+    throw Error("Must set getLocaleFromNetwork in host");
+  const {
+    domain_token: i,
+    host_static_assets: v,
+    environment_assets: h
+  } = P(), {
+    networkOperation: C
+  } = I(), {
+    events_add_listener: N,
+    events_remove_listener: T,
+    events_emit: H
+  } = j(), [a, d] = _(() => {
+    if (o)
+      return s;
+  }), [l, m] = w("localeHost", navigator.language), [M, A] = _(""), p = x((n) => {
+    d(n);
+  }, []);
+  if (L(() => (o && N(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p), () => {
+    o && T(u.EMMIT_EVENT_HOST_LOCALE_CHANGE, p);
+  }), []), L(() => {
+    let n = !0;
+    if (!o && !!r && !(l === M && l !== ""))
+      return C({
+        method: "POST",
+        endPoint: "na/locales",
+        data: {
+          ...y(l),
+          domain_token: i
+        }
+      }).then((E) => {
+        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() {
+        n = !1;
+      };
+  }, [l]), !a)
+    return /* @__PURE__ */ g("div", {});
+  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(U, {
+      dateAdapter: F,
+      adapterLocale: a.module,
+      dateFormats: {
+        hours24h: "23"
+      },
+      children: e
+    })
+  });
+}
+export {
+  G as L,
+  J as a,
+  B as g
+};

package/contexts/LocalesContext/index.d.ts

@@ -1,19 +1,5 @@
-import { ReactNode } from 'react';
-import type { Locale } from 'date-fns';
-export declare type LangType = {
-    label: string;
-    value: string;
-    locale: Locale;
-    icon: string;
-};
-export declare type LocalesContextProps = {
-    currentLang: LangType;
-    onChangeLang: (newlang: string) => void;
-    allLang: Array<LangType>;
-};
+/// <reference types="react" />
+import { LocalesProviderProps, LocalesContextProps } from './types';
 declare const LocalesContext: import("react").Context<LocalesContextProps | null>;
-declare type LocalesProviderProps = {
-    children: ReactNode;
-};
-declare function LocalesProvider({ children }: LocalesProviderProps): JSX.Element;
+declare function LocalesProvider(props: LocalesProviderProps): JSX.Element;
 export { LocalesProvider, LocalesContext };

package/contexts/LocalesContext/types.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import type { Locale } from 'date-fns';
+export declare type SupportedLocales = 'en-US' | 'es' | 'fr';
+export interface BaseLocale {
+    lang: string;
+    script?: string;
+    region?: string;
+}
+export interface NetworkLocaleType extends BaseLocale {
+    name: string;
+    url_icon: string;
+}
+export interface LocaleType extends NetworkLocaleType {
+    module: Locale;
+    localeString: string;
+}
+export declare type LocalesProviderProps = {
+    isMicroFrontEnd: boolean;
+    localeHost?: LocaleType;
+    getLocaleFromNetwork?: (locale: NetworkLocaleType, host_static_assets: string, environment_assets: string) => Promise<LocaleType>;
+    children: ReactNode;
+};
+export declare type LocalesContextProps = {
+    currentLocale?: LocaleType;
+    onChangeLocale: (newLocaleString: BaseLocale) => void;
+};

package/contexts/index.7975256a.js

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

package/contexts/index.d.ts

@@ -1,2 +1,4 @@
 export * from './LocalesContext';
+export type { NetworkLocaleType, LocaleType } from './LocalesContext/types';
+export { getLocaleFromNetwork } from './LocalesContext/helper';
 export * from './HostThemeContext';

package/hooks/{index.9ec64bcf.js → index.c9dba2ff.js}

@@ -1,8 +1,8 @@
 import { useRef as n, useEffect as s, useState as r } from "react";
 import "@mui/material/styles";
 import "@mui/material/useMediaQuery";
-import "../contexts/LocalesContext/index.c10c0bb5.js";
-import "../contexts/HostThemeContext/index.c6db12d4.js";
+import "../contexts/LocalesContext/index.3fcfbe02.js";
+import "../contexts/HostThemeContext/index.a6a62c70.js";
 function a() {
   const e = n(!0);
   return s(

package/hooks/useHostTheme/{index.b3063684.js → index.1c8e4ad7.js}

@@ -1,5 +1,5 @@
 import { useContext as t } from "react";
-import { H as o } from "../../contexts/HostThemeContext/index.c6db12d4.js";
+import { H as o } from "../../contexts/HostThemeContext/index.a6a62c70.js";
 const m = () => {
   const e = t(o);
   if (!e)

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

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

package/hooks/useLocales/index.d.ts

@@ -1 +1 @@
-export declare const useLocales: () => import("../../contexts/LocalesContext").LocalesContextProps;
+export declare const useLocales: () => import("../../contexts/LocalesContext/types").LocalesContextProps;

package/index.js

@@ -1,47 +1,46 @@
-import { P as n } from "./components/ProgressBarStyle/index.fb6fd9ed.js";
-import { L as P, a as h } from "./contexts/LocalesContext/index.c10c0bb5.js";
-import { H as v, a as T } from "./contexts/HostThemeContext/index.c6db12d4.js";
-import { u as L, a as g } from "./hooks/useResponsive/index.fc5e1b4f.js";
-import { u as R, a as S } from "./hooks/index.9ec64bcf.js";
-import { u as k } from "./hooks/useLocales/index.680b143a.js";
-import { u as z } from "./hooks/useHostTheme/index.b3063684.js";
-import { d as D } from "./theme/defaultThemeOptions.9b9e7503.js";
-import { c as G, s as I } from "./theme/shadows.bf8dc290.js";
-import { p as V } from "./theme/palette.2baf72f5.js";
-import { C as j, a as q, c as A, d as E, g as J } from "./utils/index.d8b24456.js";
-import { f as N } from "./theme/overrides.7958c0ab.js";
+import { P as l } from "./components/ProgressBarStyle/index.fb6fd9ed.js";
+import { L as n, a as c, g as P } from "./contexts/LocalesContext/index.3fcfbe02.js";
+import { H as C, a as g } from "./contexts/HostThemeContext/index.a6a62c70.js";
+import { u as L, a as T } from "./hooks/useResponsive/index.fc5e1b4f.js";
+import { u as w, a as O } from "./hooks/index.c9dba2ff.js";
+import { u as S } from "./hooks/useLocales/index.8154a401.js";
+import { u as F } from "./hooks/useHostTheme/index.1c8e4ad7.js";
+import { d as z } from "./theme/defaultThemeOptions.9b9e7503.js";
+import { c as D, s as G } from "./theme/shadows.bf8dc290.js";
+import { p as M } from "./theme/palette.2baf72f5.js";
+import { C as V, a as b, c as j, d as q, g as A } from "./utils/index.d8b24456.js";
+import { f as J } from "./theme/overrides.7958c0ab.js";
 import "@mui/material/styles";
 import "@mui/material";
 import "react/jsx-runtime";
 import "react";
 import "@mui/x-date-pickers/AdapterDateFns";
 import "@mui/x-date-pickers";
-import "date-fns/locale/es";
-import "date-fns/locale/fr";
-import "date-fns/locale/en-US";
 import "@m4l/core";
+import "date-fns/locale/en-US";
 import "@mui/material/useMediaQuery";
 import "./theme/typography.f5eadf47.js";
 export {
-  j as Capitalize,
-  q as GetFontValue,
-  v as HostThemeContext,
-  T as HostThemeProvider,
-  P as LocalesContext,
-  h as LocalesProvider,
-  n as ProgressBarStyle,
-  A as colorPresets,
-  G as customShadows,
-  E as defaultPreset,
-  D as defaultThemeOptions,
-  N as fnComponentsOverrides,
-  J as getColorPresets,
-  V as palette,
-  I as shadows,
-  z as useHostTheme,
-  R as useIsMountedRef,
-  k as useLocales,
-  S as useOffSetTop,
+  V as Capitalize,
+  b as GetFontValue,
+  C as HostThemeContext,
+  g as HostThemeProvider,
+  n as LocalesContext,
+  c as LocalesProvider,
+  l as ProgressBarStyle,
+  j as colorPresets,
+  D as customShadows,
+  q as defaultPreset,
+  z as defaultThemeOptions,
+  J as fnComponentsOverrides,
+  A as getColorPresets,
+  P as getLocaleFromNetwork,
+  M as palette,
+  G as shadows,
+  F as useHostTheme,
+  w as useIsMountedRef,
+  S as useLocales,
+  O as useOffSetTop,
   L as useResponsive,
-  g as useResponsiveDesktop
+  T as useResponsiveDesktop
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/graphics",
-  "version": "0.1.10",
+  "version": "0.1.12",
   "license": "UNLICENSED",
   "author": "M4L Team",
   "dependencies": {

package/contexts/HostThemeContext/index.c6db12d4.js

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

package/contexts/LocalesContext/index.c10c0bb5.js

@@ -1,53 +0,0 @@
-import { createContext as f, useMemo as u, useState as L } from "react";
-import { AdapterDateFns as d } from "@mui/x-date-pickers/AdapterDateFns";
-import { LocalizationProvider as v } from "@mui/x-date-pickers";
-import p from "date-fns/locale/es";
-import h from "date-fns/locale/fr";
-import S from "date-fns/locale/en-US";
-import { useLocalStorage as _, useEnvironment as $ } from "@m4l/core";
-import { jsx as t } from "react/jsx-runtime";
-const x = f(null);
-function D({
-  children: r
-}) {
-  const [l, c] = _("langStorage", "en"), {
-    host_static_assets: a,
-    environment_assets: n
-  } = $(), o = u(() => [{
-    label: "English",
-    value: "en",
-    locale: S,
-    icon: `${a}/${n}/frontend/commons/assets/icons/langs/lang_en.svg`
-  }, {
-    label: "Espa\xF1ol",
-    value: "es",
-    locale: p,
-    icon: `${a}/${n}/frontend/commons/assets/icons/langs/lang_es.svg`
-  }, {
-    label: "French",
-    value: "fr",
-    locale: h,
-    icon: `${a}/${n}/frontend/commons/assets/icons/langs/lang_fr.svg`
-  }], []), [s, i] = L(o.find((e) => e.value === l) || o[0]), m = (e) => {
-    c(e), i(o.find((g) => g.value === e) || o[0]);
-  };
-  return /* @__PURE__ */ t(x.Provider, {
-    value: {
-      currentLang: s,
-      onChangeLang: m,
-      allLang: o
-    },
-    children: /* @__PURE__ */ t(v, {
-      dateAdapter: d,
-      adapterLocale: s.locale,
-      dateFormats: {
-        hours24h: "23"
-      },
-      children: r
-    })
-  });
-}
-export {
-  x as L,
-  D as a
-};

package/contexts/index.993249c2.js

@@ -1,2 +0,0 @@
-import "./LocalesContext/index.c10c0bb5.js";
-import "./HostThemeContext/index.c6db12d4.js";