@m4l/graphics 1.0.5 → 1.0.7

package/components/GlobalStyle/{index.f7e6732c.js → index.b7393a44.js}

@@ -1,17 +1,17 @@
-import { useTheme as e } from "@mui/material/styles";
-import { GlobalStyles as o } from "@mui/material";
+import { useTheme as o } from "@mui/material/styles";
+import { GlobalStyles as e } from "@mui/material";
 import { globalRemSize as r } from "@m4l/styles";
 import { jsx as a } from "react/jsx-runtime";
 function s() {
-  const t = e();
-  return /* @__PURE__ */ a(o, {
+  const t = o();
+  return /* @__PURE__ */ a(e, {
     styles: {
       body: {
         textRendering: "geometricPrecision",
         width: "100%",
         height: "100vh",
         "input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active": {
-          textFillColor: t.vars.palette.text.primary
+          color: t.vars.palette.text.primary
         },
         "*::-webkit-scrollbar": {
           width: "7px",

package/contexts/HostThemeContext/{index.ba9af8f2.js → index.f53d14b8.js}

@@ -1,6 +1,6 @@
 import { createContext as c, useMemo as a } from "react";
 import { CssBaseline as h } from "@mui/material";
-import { G as d } from "../../components/GlobalStyle/index.f7e6732c.js";
+import { G as d } from "../../components/GlobalStyle/index.b7393a44.js";
 import { createTheme as p, experimental_extendTheme as f, Experimental_CssVarsProvider as x, StyledEngineProvider as T } from "@mui/material/styles";
 import { jsxs as m, jsx as o } from "react/jsx-runtime";
 const u = c(null);

package/contexts/ResponsiveContainerContext/constants.d.ts

@@ -1,2 +1,2 @@
-import { BreakPointsType } from "./types";
+import { BreakPointsType } from './types';
 export declare const BREAKPOINTS: BreakPointsType;

package/contexts/ResponsiveContainerContext/types.d.ts

@@ -19,8 +19,7 @@ export interface ResponsiveContainerState {
     isUpSm: boolean;
     isXs: boolean;
 }
-export interface InitialResponsiveContainerProps extends Pick<ResponsiveContainerState, 'breakPoint' | 'isUpSm' | 'isXs'> {
-}
+export declare type InitialResponsiveContainerProps = Pick<ResponsiveContainerState, 'breakPoint' | 'isUpSm' | 'isXs'>;
 export interface ResponsiveContainerStateWithActions extends ResponsiveContainerState {
     responsiveContainerActions: {
         setBreakpoint: (breakPoint: BreakpointType) => void;

package/contexts/index.68603471.js

@@ -0,0 +1,73 @@
+import "./FormatterContext/index.92336f4c.js";
+import "./LocalesContext/index.53f0b702.js";
+import { createContext as p, useRef as v, useMemo as f, useLayoutEffect as d } from "react";
+import { c as R, d as u, i as x, l as h } from "../node_modules.9eeccca4.js";
+import { jsx as S } from "react/jsx-runtime";
+import "date-fns/locale/en-US";
+import "./HostThemeContext/index.f53d14b8.js";
+const m = { xs: 600, sm: 900, md: 1200, lg: 1536, xl: 1920 }, b = (c) => {
+  const a = {
+    ...c
+  };
+  return R(
+    u(
+      x((o, n) => ({
+        ...a,
+        responsiveContainerActions: {
+          setBreakpoint: (e) => {
+            o((r) => {
+              r.breakPoint = e, r.isUpSm = e !== "xs" && e !== "sm", r.isXs = e == "xs";
+            });
+          }
+        }
+      })),
+      { name: "Responsive Relative Store" }
+    )
+  );
+}, C = p(null), B = (c) => {
+  const {
+    children: a,
+    observedDivRef: o
+  } = c, n = v();
+  n.current || (n.current = b({
+    breakPoint: "md",
+    isUpSm: !1,
+    isXs: !1
+  }));
+  const e = () => {
+    const i = o;
+    if (i instanceof HTMLElement && i.clientWidth) {
+      const t = Object.keys(m);
+      for (let s = 0; s < t.length; s++) {
+        const l = t[s];
+        if (i.clientWidth <= m[l]) {
+          n.current?.getState().responsiveContainerActions.setBreakpoint(l);
+          break;
+        }
+      }
+    }
+  }, r = f(() => h.exports.throttle(e, 200, {
+    leading: !1,
+    trailing: !0
+  }), [e]);
+  return d(() => {
+    const i = () => {
+      r();
+    }, t = o;
+    if (t && t instanceof Element) {
+      const s = new ResizeObserver((l) => {
+        i();
+      });
+      return s.observe(t), () => {
+        s.disconnect();
+      };
+    }
+  }, [o]), /* @__PURE__ */ S(C.Provider, {
+    value: n.current,
+    children: a
+  });
+};
+export {
+  C as R,
+  B as a
+};

package/hooks/{index.587e1f34.js → index.eebf9e43.js}

@@ -1,8 +1,8 @@
 import { useRef as r, useEffect as n, useState as f, useContext as i, useLayoutEffect as c } from "react";
-import { H as m } from "../contexts/HostThemeContext/index.ba9af8f2.js";
+import { H as m } from "../contexts/HostThemeContext/index.f53d14b8.js";
 import "../contexts/FormatterContext/index.92336f4c.js";
 import "../contexts/LocalesContext/index.53f0b702.js";
-import "../contexts/index.ec84697f.js";
+import "../contexts/index.68603471.js";
 import "../node_modules.9eeccca4.js";
 import "@m4l/styles";
 function h() {

package/hooks/useIsMobile/{index.3de7c47a.js → index.e9f29b1d.js}

@@ -3,9 +3,15 @@ import { t as s } from "../../node_modules.9eeccca4.js";
 const t = () => typeof navigator > "u" ? !1 : /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), l = () => {
   const [i, r] = n(t());
   return o(() => {
-    const e = s(() => {
-      r(t());
-    }, 200);
+    const e = s(
+      () => {
+        r(t());
+      },
+      200,
+      {
+        trailing: !0
+      }
+    );
     return window.addEventListener("resize", e), e(), () => {
       window.removeEventListener("resize", e), e.cancel();
     };

package/hooks/useResponsive/{index.417449f3.js → index.b336bec4.js}

@@ -1,6 +1,6 @@
 import { useContext as t } from "react";
 import { u as r } from "../../node_modules.9eeccca4.js";
-import { R as n } from "../../contexts/index.ec84697f.js";
+import { R as n } from "../../contexts/index.68603471.js";
 import { useResponsive as i } from "@m4l/styles";
 function f(e, s) {
   const o = t(n);

package/index.js

@@ -1,14 +1,14 @@
-import { G as l } from "./components/GlobalStyle/index.f7e6732c.js";
+import { G as l } from "./components/GlobalStyle/index.b7393a44.js";
 import { F as C, a as R } from "./contexts/FormatterContext/index.92336f4c.js";
 import { L as c, a as F, g as L } from "./contexts/LocalesContext/index.53f0b702.js";
-import { R as b, a as g } from "./contexts/index.ec84697f.js";
-import { H, a as T } from "./contexts/HostThemeContext/index.ba9af8f2.js";
+import { R as b, a as g } from "./contexts/index.68603471.js";
+import { H, a as T } from "./contexts/HostThemeContext/index.f53d14b8.js";
 import { u as k } from "./hooks/useFirstRender/index.1e9b02fb.js";
 import { u as z } from "./hooks/useFormatter/index.57ac8cca.js";
-import { b as I, u as M, a as O, c as y } from "./hooks/index.587e1f34.js";
+import { b as I, u as M, a as O, c as y } from "./hooks/index.eebf9e43.js";
 import { u as D } from "./hooks/useLocales/index.d5a80aff.js";
-import { u as N, a as W } from "./hooks/useResponsive/index.417449f3.js";
-import { u as q } from "./hooks/useIsMobile/index.3de7c47a.js";
+import { u as N, a as W } from "./hooks/useResponsive/index.b336bec4.js";
+import { u as q } from "./hooks/useIsMobile/index.e9f29b1d.js";
 import { C as J, g as K } from "./utils/index.6909c662.js";
 import "@mui/material/styles";
 import "@mui/material";

package/package.json

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

package/contexts/index.ec84697f.js

@@ -1,76 +0,0 @@
-import "./FormatterContext/index.92336f4c.js";
-import "./LocalesContext/index.53f0b702.js";
-import { createContext as d, useRef as p, useMemo as v, useLayoutEffect as f } from "react";
-import { c as u, d as R, i as g, l as h } from "../node_modules.9eeccca4.js";
-import { jsx as x } from "react/jsx-runtime";
-import "date-fns/locale/en-US";
-import "./HostThemeContext/index.ba9af8f2.js";
-const m = { xs: 600, sm: 900, md: 1200, lg: 1536, xl: 1920 }, S = (c) => {
-  const a = {
-    ...c
-  };
-  return u(
-    R(
-      g((r, t) => ({
-        ...a,
-        responsiveContainerActions: {
-          setBreakpoint: (e) => {
-            r(
-              (i) => {
-                console.log("current breakpoint", e), i.breakPoint = e, i.isUpSm = e !== "xs" && e !== "sm", i.isXs = e == "xs";
-              }
-            );
-          }
-        }
-      })),
-      { name: "Responsive Relative Store" }
-    )
-  );
-}, b = d(null), A = (c) => {
-  const {
-    children: a,
-    observedDivRef: r
-  } = c, t = p();
-  t.current || (t.current = S({
-    breakPoint: "md",
-    isUpSm: !1,
-    isXs: !1
-  }));
-  const e = () => {
-    const o = r;
-    if (o instanceof HTMLElement && o.clientWidth) {
-      const s = Object.keys(m);
-      for (let n = 0; n < s.length; n++) {
-        const l = s[n];
-        if (o.clientWidth <= m[l]) {
-          t.current?.getState().responsiveContainerActions.setBreakpoint(l);
-          break;
-        }
-      }
-      console.log("node.clientWidth", o.clientWidth), console.log("onResizeMemo", t.current?.getState().breakPoint);
-    }
-  }, i = v(() => h.exports.throttle(e, 200, {
-    leading: !1,
-    trailing: !0
-  }), [e]);
-  return f(() => {
-    const o = () => {
-      i();
-    }, s = r;
-    if (s && s instanceof Element) {
-      const n = new ResizeObserver((l) => {
-        o();
-      });
-      return n.observe(s), () => {
-        n.disconnect();
-      };
-    }
-  }, [r]), /* @__PURE__ */ x(b.Provider, {
-    value: t.current,
-    children: a
-  });
-};
-export {
-  b as R,
-  A as a
-};