import "./accessibility.css.js";
import "./global.css.js";
import { darkThemeClass as e, lightThemeClass as t } from "./theme.css.js";
import { createContext as n, useContext as r, useEffect as i, useMemo as a, useState as o } from "react";
import { jsx as s } from "react/jsx-runtime";
//#region src/theme/ThemeProvider.tsx
var c = n(void 0), l = "plumile-theme-mode", u = () => typeof window > "u" || typeof window.matchMedia != "function" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", d = (e, t) => e === "system" ? t : e, f = (e) => {
	if (typeof window > "u") return e;
	let t = window.localStorage.getItem(l);
	return t === "system" || t === "light" || t === "dark" ? t : e;
}, p = ({ children: n, defaultMode: r = "system" }) => {
	let [p, m] = o(() => f(r)), [h, g] = o(() => u()), _ = d(p, h);
	i(() => {
		if (p === "system" && typeof window < "u" && typeof window.matchMedia == "function") {
			let e = window.matchMedia("(prefers-color-scheme: dark)"), t = (t) => {
				if (t?.matches ?? e.matches) {
					g("dark");
					return;
				}
				g("light");
			};
			return t(e), e.addEventListener("change", t), () => {
				e.removeEventListener("change", t);
			};
		}
	}, [p]), i(() => {
		typeof window > "u" || window.localStorage.setItem(l, p);
	}, [p]), i(() => {
		if (typeof document > "u") return;
		let n = document.documentElement, r = t;
		return _ === "dark" && (r = e), n.classList.remove(t, e), n.classList.add(r), () => {
			n.classList.remove(t, e);
		};
	}, [_]);
	let v = a(() => ({
		mode: p,
		resolvedTheme: _,
		setMode: m
	}), [p, _]);
	return /* @__PURE__ */ s(c.Provider, {
		value: v,
		children: n
	});
}, m = () => {
	let e = r(c);
	if (e == null) throw Error("useTheme must be used within a ThemeProvider");
	return e;
}, h = {
	getSystemTheme: u,
	resolveTheme: d,
	readStoredMode: f
};
//#endregion
export { l as THEME_MODE_KEY, p as ThemeProvider, h as __test, m as useTheme };

//# sourceMappingURL=ThemeProvider.js.map