@xenide-io/the-old-ui-theme 0.7.0 → 0.9.0

package/dist/chunk-NOI42JNZ.mjs

@@ -1,151 +0,0 @@
-import {
-  __spreadProps,
-  __spreadValues
-} from "./chunk-FWCSY2DS.mjs";
-
-// src/suite/components/theme-provider.tsx
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect as useEffect2,
-  useMemo,
-  useState
-} from "react";
-
-// src/suite/lib/use-lock-mobile-page-zoom.ts
-import { useEffect } from "react";
-var MOBILE_PAGE_ZOOM_QUERY = "(hover: none) and (pointer: coarse)";
-var LOCKED_VIEWPORT = "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover";
-function preventGesture(event) {
-  event.preventDefault();
-}
-function useLockMobilePageZoom() {
-  useEffect(() => {
-    if (typeof window.matchMedia !== "function") return;
-    const media = window.matchMedia(MOBILE_PAGE_ZOOM_QUERY);
-    const meta = document.querySelector('meta[name="viewport"]');
-    const original = meta == null ? void 0 : meta.getAttribute("content");
-    const apply = () => {
-      const lock = media.matches;
-      document.documentElement.toggleAttribute(
-        "data-suite-lock-page-zoom",
-        lock
-      );
-      document.removeEventListener("gesturestart", preventGesture);
-      document.removeEventListener("gesturechange", preventGesture);
-      if (lock) {
-        meta == null ? void 0 : meta.setAttribute("content", LOCKED_VIEWPORT);
-        document.addEventListener("gesturestart", preventGesture);
-        document.addEventListener("gesturechange", preventGesture);
-        return;
-      }
-      if (original) meta == null ? void 0 : meta.setAttribute("content", original);
-    };
-    apply();
-    media.addEventListener("change", apply);
-    return () => {
-      media.removeEventListener("change", apply);
-      document.documentElement.removeAttribute("data-suite-lock-page-zoom");
-      if (original) meta == null ? void 0 : meta.setAttribute("content", original);
-      document.removeEventListener("gesturestart", preventGesture);
-      document.removeEventListener("gesturechange", preventGesture);
-    };
-  }, []);
-}
-
-// src/suite/components/theme-provider.tsx
-import { jsx } from "react/jsx-runtime";
-var SuiteThemeContext = createContext(null);
-function systemTheme(fallback) {
-  if (typeof window === "undefined") return fallback;
-  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-}
-function resolveTheme(theme, fallback) {
-  return theme === "system" ? systemTheme(fallback) : theme;
-}
-function applyTheme(theme, config) {
-  const resolved = resolveTheme(theme, config.fallbackTheme);
-  if (typeof document === "undefined") return resolved;
-  document.documentElement.setAttribute(
-    "data-theme",
-    resolved === "dark" ? config.darkThemeId : config.lightThemeId
-  );
-  document.documentElement.classList.toggle("dark", resolved === "dark");
-  if (config.themeColorLight && config.themeColorDark) {
-    const meta = document.getElementById(
-      "theme-color-meta"
-    );
-    if (meta) {
-      meta.content = resolved === "light" ? config.themeColorLight : config.themeColorDark;
-    }
-  }
-  return resolved;
-}
-function readStoredTheme(storageKey) {
-  if (typeof window === "undefined") return "system";
-  const stored = localStorage.getItem(storageKey);
-  if (stored === "light" || stored === "dark" || stored === "system")
-    return stored;
-  return "system";
-}
-function SuiteThemeProvider({
-  config,
-  children
-}) {
-  useLockMobilePageZoom();
-  const [state, setState] = useState(() => {
-    const theme2 = readStoredTheme(config.storageKey);
-    if (typeof document === "undefined") {
-      return { theme: theme2, resolvedTheme: config.fallbackTheme };
-    }
-    const domTheme = document.documentElement.getAttribute("data-theme");
-    const resolvedTheme2 = domTheme === config.darkThemeId ? "dark" : domTheme === config.lightThemeId ? "light" : resolveTheme(theme2, config.fallbackTheme);
-    return { theme: theme2, resolvedTheme: resolvedTheme2 };
-  });
-  const { theme, resolvedTheme } = state;
-  useEffect2(() => {
-    applyTheme(theme, config);
-  }, [theme, config]);
-  useEffect2(() => {
-    if (theme !== "system") return;
-    const media = window.matchMedia("(prefers-color-scheme: dark)");
-    const update = () => {
-      const resolved = applyTheme("system", config);
-      setState((current) => __spreadProps(__spreadValues({}, current), { resolvedTheme: resolved }));
-    };
-    media.addEventListener("change", update);
-    return () => media.removeEventListener("change", update);
-  }, [theme, config]);
-  const setTheme = useCallback(
-    (next) => {
-      const resolved = applyTheme(next, config);
-      setState({ theme: next, resolvedTheme: resolved });
-      localStorage.setItem(config.storageKey, next);
-    },
-    [config]
-  );
-  const toggleTheme = useCallback(() => {
-    setState((prev) => {
-      const next = resolveTheme(prev.theme, config.fallbackTheme) === "dark" ? "light" : "dark";
-      const resolved = applyTheme(next, config);
-      localStorage.setItem(config.storageKey, next);
-      return { theme: next, resolvedTheme: resolved };
-    });
-  }, [config]);
-  const value = useMemo(
-    () => ({ theme, resolvedTheme, setTheme, toggleTheme }),
-    [theme, resolvedTheme, setTheme, toggleTheme]
-  );
-  return /* @__PURE__ */ jsx(SuiteThemeContext.Provider, { value, children });
-}
-function useSuiteTheme() {
-  const ctx = useContext(SuiteThemeContext);
-  if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
-  return ctx;
-}
-
-export {
-  SuiteThemeProvider,
-  useSuiteTheme
-};