import { r as screen, t as breakpoints } from "./grid.js";
import { useEffect, useState } from "react";
let Breakpoint = /* @__PURE__ */ function(Breakpoint$1) {
	Breakpoint$1[Breakpoint$1["xxs"] = breakpoints.xxs] = "xxs";
	Breakpoint$1[Breakpoint$1["xs"] = breakpoints.xs] = "xs";
	Breakpoint$1[Breakpoint$1["sm"] = breakpoints.sm] = "sm";
	Breakpoint$1[Breakpoint$1["md"] = breakpoints.md] = "md";
	Breakpoint$1[Breakpoint$1["lg"] = breakpoints.lg] = "lg";
	Breakpoint$1[Breakpoint$1["xl"] = breakpoints.xl] = "xl";
	return Breakpoint$1;
}({});
function getCurrentBreakpoint() {
	return Object.entries(screen).reverse().map(([size, mediaQuery]) => {
		return {
			breakpoint: Breakpoint[size],
			mq: window.matchMedia(mediaQuery)
		};
	}).find((entry) => entry.mq.matches)?.breakpoint ?? Breakpoint.xxs;
}
const useBreakpoint = () => {
	const [breakpoint, setBreakpoint] = useState(Breakpoint.xxs);
	useEffect(() => {
		setBreakpoint(getCurrentBreakpoint());
	}, []);
	useEffect(() => {
		const mediaQueryList = Object.values(screen).map((mediaQuery) => {
			const mq = window.matchMedia(mediaQuery);
			const handler = () => {
				setBreakpoint(getCurrentBreakpoint());
			};
			if (mq.addEventListener) mq.addEventListener("change", handler);
			else if (mq.addListener) mq.addListener(handler);
			return {
				mq,
				handler
			};
		});
		return () => {
			mediaQueryList.forEach(({ mq, handler }) => {
				if (mq.removeEventListener) mq.removeEventListener("change", handler);
				else if (mq.removeListener) mq.removeListener(handler);
			});
		};
	}, []);
	return breakpoint;
};
export { useBreakpoint as n, Breakpoint as t };

//# sourceMappingURL=useBreakpoint.js.map