@m4l/graphics 1.0.8 → 1.0.9

package/components/index.d8d41b1b.js

@@ -0,0 +1 @@
+

package/contexts/HostThemeContext/index.02e36f38.js

@@ -0,0 +1,44 @@
+import { createContext as c, useMemo as h } from "react";
+import { CssBaseline as a } from "@mui/material";
+import { G as d } from "../../components/GlobalStyle/index.b7393a44.js";
+import { createTheme as p, experimental_extendTheme as x, Experimental_CssVarsProvider as f, StyledEngineProvider as T } from "@mui/material/styles";
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+const u = c(null);
+function H(m) {
+  const {
+    children: i,
+    hostThemeOptions: l,
+    fnComponentsOverrides: o
+  } = m, n = h(() => {
+    const e = p({
+      ...l
+    }), r = x({
+      cssVarPrefix: "m4l",
+      colorSchemes: {
+        light: e,
+        finalTheme: e,
+        dark: e
+      }
+    });
+    return r.components = o(r), r;
+  }, []);
+  return /* @__PURE__ */ s(f, {
+    theme: n,
+    children: [/* @__PURE__ */ t(d, {}), /* @__PURE__ */ t(u.Provider, {
+      value: {
+        hostThemeOptions: n,
+        fnComponentsOverrides: o
+      },
+      children: /* @__PURE__ */ s(T, {
+        injectFirst: !0,
+        children: [/* @__PURE__ */ t(a, {
+          enableColorScheme: !0
+        }), i]
+      })
+    })]
+  });
+}
+export {
+  u as H,
+  H as a
+};

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

package/contexts/ThemeSettingsContext/index.d.ts

@@ -1,2 +1,3 @@
 export * from './ThemeSettingsContext';
-export type {} from './SettingsContext/types';
+export type { ThemeSettingsType, ThemeMode } from './types';
+export { defaultThemeSettings } from './constants';

package/contexts/ThemeSettingsContext/types.d.ts

@@ -22,7 +22,11 @@ export interface ThemeSettingsStore {
         name: string | undefined;
         value: string;
     }[];
-    setThemeSettings?: (newValue: ThemeSettingsType) => void;
+    /**
+     * "setterThemeSettings" es una función que se encarga de persistir en local storage los cambios de los settings
+     * Solo se instancia cuando esta en host, cuando esta storybook no se instancia
+     */
+    setterThemeSettings?: (newValue: ThemeSettingsType) => void;
     open: boolean;
 }
 export declare type DefaultThemeSettingsStoreProps = ThemeSettingsStore;
@@ -37,8 +41,7 @@ export interface ThemeSettingsStateWithActions extends ThemeSettingsStore {
         onChangeColor: (event: React.ChangeEvent<HTMLInputElement>) => void;
         onChangeLayout: (event: React.ChangeEvent<HTMLInputElement>) => void;
         handleOpen: () => void;
-        setThemeOptions: (obj: any) => void;
-        setSettings: (newValue: any) => void;
+        setThemeSettings: (newValue: Partial<ThemeSettingsType>) => void;
     };
 }
 export declare type ThemeSettingsProviderProps = {

package/contexts/index.1d935da9.js

@@ -0,0 +1,279 @@
+import { createContext as f, useRef as T, useMemo as k, useLayoutEffect as y, useEffect as b } from "react";
+import { c as v, d as R, i as P, l as M } from "../node_modules.7cdb697c.js";
+import { jsx as x } from "react/jsx-runtime";
+import { useNetwork as E, useLocalStorageWithListener as w } from "@m4l/core";
+import { getColorPresets as m, getColorState as d, typography as L, palette as S, SECONDARY as A, COMMON as N, ERROR as D, WARNING as z, INFO as W, SUCCESS as B, shadows as p, createCustomShadows as $, defaultThemeOptions as j, defaultPreset as _, colorPresets as F } from "@m4l/styles";
+import { alpha as I } from "@mui/system";
+import { u as U } from "../hooks/useFirstRender/index.1e9b02fb.js";
+const C = { xs: 600, sm: 900, md: 1200, lg: 1536, xl: 1920 }, K = (r) => {
+  const t = {
+    ...r
+  };
+  return v(
+    R(
+      P((o, n) => ({
+        ...t,
+        responsiveContainerActions: {
+          setBreakpoint: (e) => {
+            o(
+              (i) => {
+                console.log("current breakpoint", e), i.breakPoint = e, i.isUpSm = e !== "xs" && e !== "sm", i.isXs = e == "xs";
+              }
+            );
+          }
+        }
+      })),
+      { name: "Responsive Relative Store" }
+    )
+  );
+}, X = f(null), te = (r) => {
+  const {
+    children: t,
+    observedDivRef: o
+  } = r, n = T();
+  n.current || (n.current = K({
+    breakPoint: "md",
+    isUpSm: !1,
+    isXs: !1
+  }));
+  const e = () => {
+    const s = o;
+    if (s instanceof HTMLElement && s.clientWidth) {
+      const c = Object.keys(C);
+      for (let l = 0; l < c.length; l++) {
+        const g = c[l];
+        if (s.clientWidth <= C[g]) {
+          n.current?.getState().responsiveContainerActions.setBreakpoint(g);
+          break;
+        }
+      }
+      console.log("node.clientWidth", s.clientWidth), console.log("onResizeMemo", n.current?.getState().breakPoint);
+    }
+  }, i = k(() => M.exports.throttle(e, 200, {
+    leading: !1,
+    trailing: !0
+  }), [e]);
+  return y(() => {
+    const s = () => {
+      i();
+    }, c = o;
+    if (c && c instanceof Element) {
+      const l = new ResizeObserver((g) => {
+        s();
+      });
+      return l.observe(c), () => {
+        l.disconnect();
+      };
+    }
+  }, [o]), /* @__PURE__ */ x(X.Provider, {
+    value: n.current,
+    children: t
+  });
+}, u = {
+  themeMode: "light",
+  themeDirection: "ltr",
+  themeColorPresets: "patronus",
+  themeLayout: "horizontal",
+  themeStretch: !1
+};
+function O(r, t = "m4l") {
+  const o = document.querySelector('[data-mui-color-scheme="light"]');
+  if (!o) {
+    console.error('Element with data-mui-color-scheme="light" not found.');
+    return;
+  }
+  Object.keys(r).forEach((n) => {
+    const e = r[n];
+    if (typeof e == "string" || typeof e == "number") {
+      const i = `--${t}-${n}`;
+      o.style.setProperty(i, e.toString());
+    } else
+      typeof e == "object" && e !== null && O(e, `${t}-${n}`);
+  });
+}
+const a = (r) => {
+  const t = r.currentThemeSettings || u;
+  console.log("getColorPresets", m(t.themeColorPresets)), console.log(
+    "getColorState",
+    d(t.themeColorPresets, t.themeMode)
+  );
+  const o = t.themeMode === "light";
+  r.themeOptions = {
+    ...r.themeOptions,
+    typography: L,
+    palette: {
+      ...r.themeOptions.palette,
+      ...o ? S.light : S.dark,
+      primary: m(t.themeColorPresets),
+      state: d(t.themeColorPresets, t.themeMode),
+      representative: t.themeMode === "light" ? m(t.themeColorPresets)?.light : m(t.themeColorPresets)?.darker,
+      secondary: {
+        ...A,
+        contrastText: "",
+        mainChannel: "",
+        lightChannel: "",
+        darkChannel: "",
+        contrastTextChannel: ""
+      },
+      common: {
+        ...N,
+        black: "#000",
+        white: "#fff",
+        background: "",
+        backgroundChannel: "",
+        onBackground: "",
+        onBackgroundChannel: ""
+      },
+      error: {
+        ...D,
+        contrastText: "",
+        mainChannel: "",
+        lightChannel: "",
+        darkChannel: "",
+        contrastTextChannel: ""
+      },
+      warning: {
+        ...z,
+        contrastText: "",
+        mainChannel: "",
+        lightChannel: "",
+        darkChannel: "",
+        contrastTextChannel: ""
+      },
+      info: {
+        ...W,
+        contrastText: "",
+        mainChannel: "",
+        lightChannel: "",
+        darkChannel: "",
+        contrastTextChannel: ""
+      },
+      success: {
+        ...B,
+        contrastText: "",
+        mainChannel: "",
+        lightChannel: "",
+        darkChannel: "",
+        contrastTextChannel: ""
+      }
+    },
+    shape: { borderRadius: 8 },
+    direction: t.themeDirection,
+    shadows: o ? p.light : p.dark,
+    customShadows: {
+      primary: `0 8px 16px 0 ${I(
+        m(t.themeColorPresets)?.main || "#fff",
+        0.2
+      )}`,
+      ...$(t.themeMode)
+    },
+    stretch: t.themeStretch
+  }, console.log("state.themeOptions", r.themeOptions), O(r.themeOptions);
+}, h = (r) => {
+  r.setterThemeSettings && r.setterThemeSettings(r.currentThemeSettings);
+}, q = (r) => v(
+  R(
+    P((t, o) => ({
+      ...r,
+      settingsActions: {
+        init: () => {
+          t((n) => {
+            a(n);
+          });
+        },
+        setThemeSettings: (n) => {
+          t((e) => {
+            e.currentThemeSettings = { ...e.currentThemeSettings, ...n }, h(e), a(e);
+          });
+        },
+        onChangeMode: (n) => {
+          t((e) => {
+            e.currentThemeSettings = {
+              ...e.currentThemeSettings,
+              themeMode: n.target.value
+            }, h(e), a(e);
+          });
+        },
+        handleOpen: () => {
+          t((n) => {
+            n.open = !n.open;
+          });
+        },
+        onChangeDirection: (n) => {
+          t((e) => {
+            e.currentThemeSettings = {
+              ...e.currentThemeSettings,
+              themeDirection: n.target.value
+            }, h(e), a(e);
+          });
+        },
+        onChangeColor: (n) => {
+          t((e) => {
+            e.currentThemeSettings = {
+              ...e.currentThemeSettings,
+              themeColorPresets: n.target.value
+            }, h(e), a(e);
+          });
+        },
+        onChangeLayout: (n) => {
+          t((e) => {
+            e.currentThemeSettings = {
+              ...e.currentThemeSettings,
+              themeLayout: n.target.value
+            }, h(e), a(e);
+          });
+        },
+        onToggleStretch: () => {
+          t((n) => {
+            n.currentThemeSettings = {
+              ...n.currentThemeSettings,
+              themeStretch: !n.currentThemeSettings.themeStretch
+            }, h(n), a(n);
+          });
+        },
+        onResetSetting: () => {
+          t((n) => {
+            n.currentThemeSettings = {
+              ...u
+            }, h(n), a(n);
+          });
+        }
+      }
+    })),
+    { name: "ExampleStore" }
+  )
+), G = f(null);
+function ne({
+  children: r,
+  themeSettings: t
+}) {
+  const {
+    networkOperation: o
+  } = E(), [n, e] = w("theme_setting", u), i = U([t]), s = T();
+  return s.current || (s.current = q({
+    networkOperation: o,
+    currentThemeSettings: {
+      ...t ?? n
+    },
+    themeOptions: j,
+    currentPreset: _,
+    colorOption: F.map((c) => ({
+      name: c.name,
+      value: c.main
+    })),
+    open: !1,
+    setterThemeSettings: t ? void 0 : e
+  }), s.current.getState().settingsActions.init()), b(() => {
+    !i && s.current && t && s.current.getState().settingsActions.setThemeSettings(t);
+  }, [t]), /* @__PURE__ */ x(G.Provider, {
+    value: s.current,
+    children: r
+  });
+}
+export {
+  X as R,
+  G as T,
+  te as a,
+  ne as b,
+  u as d
+};

package/contexts/index.d.ts

@@ -6,5 +6,5 @@ export type { BreakpointType } from './ResponsiveContainerContext/types';
 export type { NetworkLocaleType, LocaleType } from './LocalesContext/types';
 export { getLocaleFromNetwork } from './LocalesContext/helper';
 export * from './HostThemeContext';
-export * from './ThemeSettingsContext/ThemeSettingsContext';
+export * from './ThemeSettingsContext';
 export type { HostThemeType } from './HostThemeContext/types';

package/hooks/index.e4fb3c4e.js

@@ -0,0 +1,54 @@
+import { useRef as n, useEffect as r, useState as i, useContext as u, useLayoutEffect as c } from "react";
+import { H as m } from "../contexts/HostThemeContext/index.02e36f38.js";
+import { u as a } from "../node_modules.7cdb697c.js";
+import { T as l } from "../contexts/index.1d935da9.js";
+function S() {
+  const e = n(!0);
+  return r(
+    () => () => {
+      e.current = !1;
+    },
+    []
+  ), e;
+}
+function x(e) {
+  const [s, t] = i(!1), o = e || 100;
+  return r(() => (window.onscroll = () => {
+    window.pageYOffset > o ? t(!0) : t(!1);
+  }, () => {
+    window.onscroll = null;
+  }), [o]), s;
+}
+const h = () => {
+  const e = u(m);
+  if (!e)
+    throw new Error("useHostTheme context must be use inside HostThemeProvider");
+  return e;
+};
+function b(e) {
+  const s = n(null);
+  return c(() => {
+    const t = s?.current;
+    if (!t)
+      return;
+    const o = new ResizeObserver((f) => {
+      e(t, f[0]);
+    });
+    return o.observe(t), () => {
+      o.disconnect();
+    };
+  }, [e, s.current]), s;
+}
+function g(e, s) {
+  const t = u(l);
+  if (!t)
+    throw new Error("useSettingsStore context must be use inside SettignsContext");
+  return a(t, e, s);
+}
+export {
+  x as a,
+  h as b,
+  b as c,
+  g as d,
+  S as u
+};

package/hooks/useIsMobile/{index.e9f29b1d.js → index.1afbcd66.js}

@@ -1,17 +1,11 @@
 import { useState as n, useEffect as o } from "react";
-import { t as s } from "../../node_modules.9eeccca4.js";
+import { t as s } from "../../node_modules.7cdb697c.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,
-      {
-        trailing: !0
-      }
-    );
+    const e = s(() => {
+      r(t());
+    }, 200);
     return window.addEventListener("resize", e), e(), () => {
       window.removeEventListener("resize", e), e.cancel();
     };

package/hooks/useResponsive/{index.f415f47d.js → index.0881f166.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.acf54acf.js";
+import { u as r } from "../../node_modules.7cdb697c.js";
+import { R as n } from "../../contexts/index.1d935da9.js";
 import { useResponsive as i } from "@m4l/styles";
 function f(e, s) {
   const o = t(n);

package/index.js

@@ -1,51 +1,52 @@
-import { G as v } from "./components/GlobalStyle/index.b7393a44.js";
-import { F as d, a as R } from "./contexts/FormatterContext/index.92336f4c.js";
-import { L as g, a as h, g as S } from "./contexts/LocalesContext/index.53f0b702.js";
-import { R as F, a as P, T as b, b as L } from "./contexts/index.acf54acf.js";
-import { H as k, a as w } from "./contexts/HostThemeContext/index.f53d14b8.js";
-import { u as G } from "./hooks/useFirstRender/index.1e9b02fb.js";
-import { u as M } from "./hooks/useFormatter/index.57ac8cca.js";
-import { b as y, u as A, a as D, c as E, d as N } from "./hooks/index.315d954d.js";
-import { u as j } from "./hooks/useLocales/index.d5a80aff.js";
-import { u as B, a as J } from "./hooks/useResponsive/index.f415f47d.js";
-import { u as Q } from "./hooks/useIsMobile/index.e9f29b1d.js";
-import { C as V, g as X } from "./utils/index.6909c662.js";
+import { G as l } from "./components/GlobalStyle/index.b7393a44.js";
+import { L as C, a as T, g } from "./contexts/LocalesContext/index.53f0b702.js";
+import { F as R, a as S } from "./contexts/FormatterContext/index.92336f4c.js";
+import { R as F, a as P, T as b, b as L, d as H } from "./contexts/index.1d935da9.js";
+import { H as w, a as z } from "./contexts/HostThemeContext/index.02e36f38.js";
+import { u as I } from "./hooks/useFirstRender/index.1e9b02fb.js";
+import { u as O } from "./hooks/useFormatter/index.57ac8cca.js";
+import { b as A, u as D, a as E, c as N, d as W } from "./hooks/index.e4fb3c4e.js";
+import { u as q } from "./hooks/useLocales/index.d5a80aff.js";
+import { u as J, a as K } from "./hooks/useResponsive/index.0881f166.js";
+import { u as U } from "./hooks/useIsMobile/index.1afbcd66.js";
+import { C as X, g as Y } from "./utils/index.6909c662.js";
 import "@mui/material/styles";
 import "@mui/material";
 import "@m4l/styles";
 import "react/jsx-runtime";
 import "react";
-import "@m4l/core";
 import "@mui/x-date-pickers/AdapterDateFns";
 import "@mui/x-date-pickers";
+import "@m4l/core";
 import "date-fns/locale/en-US";
-import "./node_modules.9eeccca4.js";
+import "./node_modules.7cdb697c.js";
 import "./commonjs.e3daa2e5.js";
 import "@mui/system";
 export {
-  V as Capitalize,
-  d as FormatterContext,
-  R as FormatterProvider,
-  v as GlobalStyles,
-  k as HostThemeContext,
-  w as HostThemeProvider,
-  g as LocalesContext,
-  h as LocalesProvider,
+  X as Capitalize,
+  R as FormatterContext,
+  S as FormatterProvider,
+  l as GlobalStyles,
+  w as HostThemeContext,
+  z as HostThemeProvider,
+  C as LocalesContext,
+  T as LocalesProvider,
   F as ResponsiveContainerContext,
   P as ResponsiveContainerProvider,
   b as ThemeSettingsContext,
   L as ThemeSettingsProvider,
-  X as getAnchorElPositionWindow,
-  S as getLocaleFromNetwork,
-  G as useFirstRender,
-  M as useFormatter,
-  y as useHostTheme,
-  Q as useIsMobile,
-  A as useIsMountedRef,
-  j as useLocales,
-  D as useOffSetTop,
-  E as useResizeObserver,
-  B as useResponsiveContainerStore,
-  J as useResponsiveDesktop,
-  N as useThemeSettingsStore
+  H as defaultThemeSettings,
+  Y as getAnchorElPositionWindow,
+  g as getLocaleFromNetwork,
+  I as useFirstRender,
+  O as useFormatter,
+  A as useHostTheme,
+  U as useIsMobile,
+  D as useIsMountedRef,
+  q as useLocales,
+  E as useOffSetTop,
+  N as useResizeObserver,
+  J as useResponsiveContainerStore,
+  K as useResponsiveDesktop,
+  W as useThemeSettingsStore
 };

package/package.json

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

package/vite-env.d.ts

@@ -1 +1 @@
-/// <reference types="vite/client" />
+/// <reference types="vite/client" />

package/components/index.8083534b.js

@@ -1,4 +0,0 @@
-import "@mui/material/styles";
-import "@mui/material";
-import "@m4l/styles";
-import "react/jsx-runtime";

package/contexts/HostThemeContext/index.f53d14b8.js

@@ -1,44 +0,0 @@
-import { createContext as c, useMemo as a } from "react";
-import { CssBaseline as h } from "@mui/material";
-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);
-function j(i) {
-  const {
-    children: l,
-    hostThemeOptions: t,
-    fnComponentsOverrides: n
-  } = i, e = p({
-    ...t
-  }), s = a(() => {
-    const r = f({
-      cssVarPrefix: "m4l",
-      colorSchemes: {
-        light: e,
-        finalTheme: e,
-        dark: e
-      }
-    });
-    return r.components = n(r), r;
-  }, []);
-  return console.log("finalTheme", s), /* @__PURE__ */ m(x, {
-    theme: s,
-    children: [/* @__PURE__ */ o(d, {}), /* @__PURE__ */ o(u.Provider, {
-      value: {
-        hostThemeOptions: t,
-        fnComponentsOverrides: n
-      },
-      children: /* @__PURE__ */ m(T, {
-        injectFirst: !0,
-        children: [/* @__PURE__ */ o(h, {
-          enableColorScheme: !0
-        }), l]
-      })
-    })]
-  });
-}
-export {
-  u as H,
-  j as a
-};

package/contexts/index.acf54acf.js

@@ -1,283 +0,0 @@
-import "./FormatterContext/index.92336f4c.js";
-import "./LocalesContext/index.53f0b702.js";
-import { createContext as T, useRef as v, useMemo as y, useLayoutEffect as b } from "react";
-import { c as O, d as P, i as R, l as M } from "../node_modules.9eeccca4.js";
-import { jsx as x } from "react/jsx-runtime";
-import "date-fns/locale/en-US";
-import "./HostThemeContext/index.f53d14b8.js";
-import { useNetwork as E, useLocalStorageWithListener as w } from "@m4l/core";
-import { getColorPresets as m, getColorState as p, typography as L, palette as d, SECONDARY as N, COMMON as A, ERROR as D, WARNING as z, INFO as B, SUCCESS as $, shadows as S, createCustomShadows as j, defaultThemeOptions as C, defaultPreset as W, colorPresets as _ } from "@m4l/styles";
-import { alpha as I } from "@mui/system";
-const f = { xs: 600, sm: 900, md: 1200, lg: 1536, xl: 1920 }, U = (o) => {
-  const n = {
-    ...o
-  };
-  return O(
-    P(
-      R((r, t) => ({
-        ...n,
-        responsiveContainerActions: {
-          setBreakpoint: (e) => {
-            r((s) => {
-              s.breakPoint = e, s.isUpSm = e !== "xs" && e !== "sm", s.isXs = e == "xs";
-            });
-          }
-        }
-      })),
-      { name: "Responsive Relative Store" }
-    )
-  );
-}, K = T(null), ne = (o) => {
-  const {
-    children: n,
-    observedDivRef: r
-  } = o, t = v();
-  t.current || (t.current = U({
-    breakPoint: "md",
-    isUpSm: !1,
-    isXs: !1
-  }));
-  const e = () => {
-    const i = r;
-    if (i instanceof HTMLElement && i.clientWidth) {
-      const l = Object.keys(f);
-      for (let c = 0; c < l.length; c++) {
-        const g = l[c];
-        if (i.clientWidth <= f[g]) {
-          t.current?.getState().responsiveContainerActions.setBreakpoint(g);
-          break;
-        }
-      }
-    }
-  }, s = y(() => M.exports.throttle(e, 200, {
-    leading: !1,
-    trailing: !0
-  }), [e]);
-  return b(() => {
-    const i = () => {
-      s();
-    }, l = r;
-    if (l && l instanceof Element) {
-      const c = new ResizeObserver((g) => {
-        i();
-      });
-      return c.observe(l), () => {
-        c.disconnect();
-      };
-    }
-  }, [r]), /* @__PURE__ */ x(K.Provider, {
-    value: t.current,
-    children: n
-  });
-}, u = {
-  themeMode: "light",
-  themeDirection: "ltr",
-  themeColorPresets: "patronus",
-  themeStretch: !1,
-  themeLayout: "horizontal"
-};
-function k(o, n = "m4l") {
-  const r = document.querySelector('[data-mui-color-scheme="light"]');
-  if (!r) {
-    console.error('Element with data-mui-color-scheme="light" not found.');
-    return;
-  }
-  Object.keys(o).forEach((t) => {
-    const e = o[t];
-    if (typeof e == "string" || typeof e == "number") {
-      const s = `--${n}-${t}`;
-      r.style.setProperty(s, e.toString());
-    } else
-      typeof e == "object" && e !== null && k(e, `${n}-${t}`);
-  });
-}
-const h = (o) => {
-  const n = o.currentThemeSettings || u;
-  console.log("getColorPresets", m(n.themeColorPresets)), console.log(
-    "getColorState",
-    p(n.themeColorPresets, n.themeMode)
-  );
-  const r = n.themeMode === "light";
-  o.themeOptions = {
-    ...o.themeOptions,
-    typography: L,
-    palette: {
-      ...o.themeOptions.palette,
-      ...r ? d.light : d.dark,
-      primary: m(n.themeColorPresets),
-      state: p(n.themeColorPresets, n.themeMode),
-      representative: n.themeMode === "light" ? m(n.themeColorPresets)?.light : m(n.themeColorPresets)?.darker,
-      secondary: {
-        ...N,
-        contrastText: "",
-        mainChannel: "",
-        lightChannel: "",
-        darkChannel: "",
-        contrastTextChannel: ""
-      },
-      common: {
-        ...A,
-        black: "#000",
-        white: "#fff",
-        background: "",
-        backgroundChannel: "",
-        onBackground: "",
-        onBackgroundChannel: ""
-      },
-      error: {
-        ...D,
-        contrastText: "",
-        mainChannel: "",
-        lightChannel: "",
-        darkChannel: "",
-        contrastTextChannel: ""
-      },
-      warning: {
-        ...z,
-        contrastText: "",
-        mainChannel: "",
-        lightChannel: "",
-        darkChannel: "",
-        contrastTextChannel: ""
-      },
-      info: {
-        ...B,
-        contrastText: "",
-        mainChannel: "",
-        lightChannel: "",
-        darkChannel: "",
-        contrastTextChannel: ""
-      },
-      success: {
-        ...$,
-        contrastText: "",
-        mainChannel: "",
-        lightChannel: "",
-        darkChannel: "",
-        contrastTextChannel: ""
-      }
-    },
-    shape: { borderRadius: 8 },
-    direction: n.themeDirection,
-    shadows: r ? S.light : S.dark,
-    customShadows: {
-      primary: `0 8px 16px 0 ${I(
-        m(n.themeColorPresets)?.main || "#fff",
-        0.2
-      )}`,
-      ...j(n.themeMode)
-    },
-    stretch: n.themeStretch
-  }, console.log("state.themeOptions", o.themeOptions), k(o.themeOptions);
-}, a = (o) => {
-  o.setThemeSettings && o.setThemeSettings(o.currentThemeSettings);
-}, X = (o) => O(
-  P(
-    R((n, r) => ({
-      ...o,
-      settingsActions: {
-        init: () => {
-          n((t) => {
-            h(t);
-          });
-        },
-        setThemeOptions: (t) => {
-          n((e) => {
-            e.themeOptions = { ...e.themeOptions, ...t };
-          });
-        },
-        setSettings: (t) => {
-          n((e) => {
-            e.currentThemeSettings = { ...t }, a(e), h(e);
-          });
-        },
-        onChangeMode: (t) => {
-          n((e) => {
-            e.currentThemeSettings = {
-              ...e.currentThemeSettings,
-              themeMode: t.target.value
-            }, a(e), h(e);
-          });
-        },
-        handleOpen: () => {
-          n((t) => {
-            t.open = !t.open;
-          });
-        },
-        onChangeDirection: (t) => {
-          n((e) => {
-            e.currentThemeSettings = {
-              ...e.currentThemeSettings,
-              themeDirection: t.target.value
-            }, a(e), h(e);
-          });
-        },
-        onChangeColor: (t) => {
-          n((e) => {
-            e.currentThemeSettings = {
-              ...e.currentThemeSettings,
-              themeColorPresets: t.target.value
-            }, a(e), h(e);
-          });
-        },
-        onChangeLayout: (t) => {
-          n((e) => {
-            e.currentThemeSettings = {
-              ...e.currentThemeSettings,
-              themeLayout: t.target.value
-            }, a(e), h(e);
-          });
-        },
-        onToggleStretch: () => {
-          n((t) => {
-            t.currentThemeSettings = {
-              ...t.currentThemeSettings,
-              themeStretch: !t.currentThemeSettings.themeStretch
-            }, a(t), h(t);
-          });
-        },
-        onResetSetting: () => {
-          n((t) => {
-            t.currentThemeSettings = {
-              ...u
-            }, a(t), h(t);
-          });
-        }
-      }
-    })),
-    { name: "ExampleStore" }
-  )
-), q = T(null);
-function oe({
-  children: o,
-  themeSettings: n
-}) {
-  const {
-    networkOperation: r
-  } = E(), [t, e] = w("theme_setting", u);
-  console.log("defaultThemeOptions", C);
-  const s = v();
-  return s.current || (s.current = X({
-    networkOperation: r,
-    currentThemeSettings: {
-      ...n ?? t
-    },
-    themeOptions: C,
-    currentPreset: W,
-    colorOption: _.map((i) => ({
-      name: i.name,
-      value: i.main
-    })),
-    open: !1,
-    setThemeSettings: n ? void 0 : e
-  }), s.current.getState().settingsActions.init()), /* @__PURE__ */ x(q.Provider, {
-    value: s.current,
-    children: o
-  });
-}
-export {
-  K as R,
-  q as T,
-  ne as a,
-  oe as b
-};

package/hooks/index.315d954d.js

@@ -1,57 +0,0 @@
-import { useRef as r, useEffect as n, useState as f, useContext as u, useLayoutEffect as c } from "react";
-import { H as m } from "../contexts/HostThemeContext/index.f53d14b8.js";
-import { u as a } from "../node_modules.9eeccca4.js";
-import { T as p } from "../contexts/index.acf54acf.js";
-import "../contexts/FormatterContext/index.92336f4c.js";
-import "../contexts/LocalesContext/index.53f0b702.js";
-import "@m4l/styles";
-function b() {
-  const e = r(!0);
-  return n(
-    () => () => {
-      e.current = !1;
-    },
-    []
-  ), e;
-}
-function g(e) {
-  const [o, t] = f(!1), s = e || 100;
-  return n(() => (window.onscroll = () => {
-    window.pageYOffset > s ? t(!0) : t(!1);
-  }, () => {
-    window.onscroll = null;
-  }), [s]), o;
-}
-const v = () => {
-  const e = u(m);
-  if (!e)
-    throw new Error("useHostTheme context must be use inside HostThemeProvider");
-  return e;
-};
-function H(e) {
-  const o = r(null);
-  return c(() => {
-    const t = o?.current;
-    if (!t)
-      return;
-    const s = new ResizeObserver((i) => {
-      e(t, i[0]);
-    });
-    return s.observe(t), () => {
-      s.disconnect();
-    };
-  }, [e, o.current]), o;
-}
-function O(e, o) {
-  const t = u(p);
-  if (!t)
-    throw new Error("useSettingsStore context must be use inside SettignsContext");
-  return a(t, e, o);
-}
-export {
-  g as a,
-  v as b,
-  H as c,
-  O as d,
-  b as u
-};