haze-ui 1.26.0 → 1.28.0

package/dist/headless/index.js

@@ -0,0 +1,19 @@
+"use client";
+import { mergeRefs as e } from "../utils/refs.js";
+import { getDirection as t, localeDirection as n, useDirection as r } from "../utils/direction.js";
+import { computeFloatingPosition as i, resolvePadding as a } from "../utils/collision.js";
+import { Presence as o, whenExitSettles as s } from "../utils/presence.js";
+import { FloatingPanel as c, floatingPlacementClasses as l, placeFloatingPanel as u, supportsAnchorPositioning as d, supportsNativePopover as f, useFloating as p, useFloatingPosition as m } from "../utils/floating.js";
+import { TABBABLE_SELECTOR as h, focusFirst as g, getTabbables as _, isTabbable as v } from "../utils/focus.js";
+import { useFocusScope as y } from "../utils/focus-scope.js";
+import { useMediaQuery as b } from "../hooks/useMediaQuery.js";
+import { useViewTransitionFlip as x } from "../utils/view-transition.js";
+import { getEnabledMenuItems as S, useMenuKeyboard as C, useRovingTabindex as w } from "../utils/menuKeyboard.js";
+import { SUBMENU_CLOSE_GRACE_MS as T, SUBMENU_OPEN_DELAY_MS as E, SubmenuProvider as D, useSubmenu as O, useSubmenuContext as k } from "../utils/submenu.js";
+import { hotkey as A, useHotkeys as j } from "../hooks/useHotkeys.js";
+import { useClickOutside as M } from "../hooks/useClickOutside.js";
+import { useLocalStorage as N } from "../hooks/useLocalStorage.js";
+import { useInView as P } from "../hooks/useInView.js";
+import { usePrevious as F } from "../hooks/usePrevious.js";
+import { useSessionStorage as I } from "../hooks/useSessionStorage.js";
+export { c as FloatingPanel, o as Presence, T as SUBMENU_CLOSE_GRACE_MS, E as SUBMENU_OPEN_DELAY_MS, D as SubmenuProvider, h as TABBABLE_SELECTOR, i as computeFloatingPosition, l as floatingPlacementClasses, g as focusFirst, t as getDirection, S as getEnabledMenuItems, _ as getTabbables, A as hotkey, v as isTabbable, n as localeDirection, e as mergeRefs, u as placeFloatingPanel, a as resolvePadding, d as supportsAnchorPositioning, f as supportsNativePopover, M as useClickOutside, r as useDirection, p as useFloating, m as useFloatingPosition, y as useFocusScope, j as useHotkeys, P as useInView, N as useLocalStorage, b as useMediaQuery, C as useMenuKeyboard, F as usePrevious, w as useRovingTabindex, I as useSessionStorage, O as useSubmenu, k as useSubmenuContext, x as useViewTransitionFlip, s as whenExitSettles };

package/dist/hooks/useClickOutside.js

@@ -0,0 +1,24 @@
+"use client";
+import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
+//#region src/lib/hooks/useClickOutside.ts
+function i(i, a = {}) {
+	let { enabled: o = !0, ignore: s } = a, [c, l] = r(null), u = n(i), d = n(s);
+	return t(() => {
+		u.current = i, d.current = s;
+	}), t(() => {
+		if (!o || c === null) return;
+		let e = (e) => {
+			let t = d.current;
+			if (!t) return !1;
+			for (let n of t) if (n.current && e instanceof Node && n.current.contains(e)) return !0;
+			return !1;
+		}, t = (t) => {
+			!t.composedPath().includes(c) && !e(t.target) && u.current(t);
+		};
+		return document.addEventListener("pointerdown", t), () => document.removeEventListener("pointerdown", t);
+	}, [o, c]), e((e) => {
+		l(e);
+	}, []);
+}
+//#endregion
+export { i as useClickOutside };

package/dist/hooks/useDarkMode.js

@@ -0,0 +1,27 @@
+"use client";
+import { darkTheme as e, lightTheme as t } from "../tokens/colors.js";
+import { useMediaQuery as n } from "./useMediaQuery.js";
+import { useLocalStorage as r } from "./useLocalStorage.js";
+import { useCallback as i, useEffect as a } from "react";
+//#region src/lib/hooks/useDarkMode.ts
+var o = "haze-ui-color-mode", s = "(prefers-color-scheme: dark)", c = (e) => e === "light" || e === "dark" || e === "system";
+function l(e) {
+	return typeof document > "u" ? null : e === void 0 ? document.documentElement : typeof e == "object" && "current" in e ? e.current : e;
+}
+function u(u) {
+	let { storageKey: d = o, target: f, defaultMode: p = "system" } = u ?? {}, [m, h] = r(d, void 0, p), g = c(m) ? m : p, _ = n(s), v = g === "dark" || g === "system" && _, y = i((e) => {
+		let t = typeof e == "function" ? e(v) : e;
+		h(t ? "dark" : "light");
+	}, [v, h]);
+	return a(() => {
+		let n = l(f);
+		n !== null && (n.classList.toggle(t, !v), n.classList.toggle(e, v));
+	}, [v, f]), [
+		v,
+		y,
+		g,
+		h
+	];
+}
+//#endregion
+export { u as useDarkMode };

package/dist/hooks/useFullscreen.js

@@ -0,0 +1,42 @@
+"use client";
+import { useCallback as e, useEffect as t, useMemo as n, useState as r } from "react";
+//#region src/lib/hooks/useFullscreen.ts
+function i(e) {
+	return e ? "current" in e ? e.current : e : document.documentElement;
+}
+function a(a) {
+	let [o, s] = r(!1), c = e(() => {
+		let e = i(a);
+		s(document.fullscreenElement === e);
+	}, [a]);
+	t(() => (c(), document.addEventListener("fullscreenchange", c), () => document.removeEventListener("fullscreenchange", c)), [c]);
+	let l = e(() => {
+		let e = i(a);
+		e && typeof e.requestFullscreen == "function" && e.requestFullscreen().catch(() => void 0);
+	}, [a]), u = e(() => {
+		typeof document.exitFullscreen == "function" && document.fullscreenElement === i(a) && document.exitFullscreen().catch(() => void 0);
+	}, [a]), d = e(() => {
+		document.fullscreenElement === i(a) ? u() : l();
+	}, [
+		a,
+		l,
+		u
+	]);
+	return [
+		o,
+		d,
+		n(() => ({
+			isFullscreen: o,
+			enter: l,
+			exit: u,
+			toggle: d
+		}), [
+			o,
+			l,
+			u,
+			d
+		])
+	];
+}
+//#endregion
+export { a as useFullscreen };

package/dist/hooks/useHotkeys.js

@@ -0,0 +1,77 @@
+"use client";
+import { useEffect as e, useRef as t } from "react";
+//#region src/lib/hooks/useHotkeys.ts
+var n = {
+	mod: "mod",
+	ctrl: "ctrl",
+	control: "ctrl",
+	meta: "meta",
+	cmd: "meta",
+	command: "meta",
+	"⌘": "meta",
+	shift: "shift",
+	alt: "alt",
+	option: "alt",
+	"⌥": "alt"
+};
+function r() {
+	return typeof navigator > "u" ? !1 : /mac|iphone|ipad|ipod/i.test(navigator.platform);
+}
+function i(e) {
+	let t = e.split("+").map((e) => e.trim()), i = t.pop() ?? "";
+	if (i === "") return null;
+	let a = /* @__PURE__ */ new Set();
+	for (let e of t) {
+		let t = n[e.toLowerCase()];
+		if (t === void 0) return null;
+		a.add(t === "mod" ? r() ? "meta" : "ctrl" : t);
+	}
+	return {
+		modifiers: a,
+		key: i
+	};
+}
+function a(e, t) {
+	let n = i(e);
+	if (n === null) return !1;
+	let { modifiers: r, key: a } = n;
+	return r.has("ctrl") && !t.ctrlKey || r.has("shift") && !t.shiftKey || r.has("alt") && !t.altKey || r.has("meta") && !t.metaKey || !r.has("ctrl") && t.ctrlKey || !r.has("alt") && t.altKey || !r.has("meta") && t.metaKey ? !1 : a.length === 1 ? t.key.toLowerCase() === a.toLowerCase() : t.key === a;
+}
+function o(e) {
+	if (!(e instanceof HTMLElement)) return !1;
+	if (e.isContentEditable) return !0;
+	let t = e.tagName;
+	return t === "INPUT" || t === "TEXTAREA" || t === "SELECT";
+}
+function s(...e) {
+	return e.join(",");
+}
+function c(n, r = {}) {
+	let { enabled: i = !0, target: s, eventName: c = "keydown", allowInInput: l = !1 } = r, u = t(n);
+	e(() => {
+		u.current = n;
+	}), e(() => {
+		if (!i) return;
+		let e = s === void 0 ? window : "current" in s ? s.current : s;
+		if (e === null) return;
+		let t = (e) => {
+			let t = e;
+			if (!l && o(t.target)) return;
+			let n = u.current;
+			for (let e of Object.keys(n)) if (e.split(",").some((e) => a(e.trim(), t))) {
+				let r = n[e];
+				if (!r) continue;
+				t.preventDefault(), t.stopPropagation(), r(t);
+				return;
+			}
+		};
+		return e.addEventListener(c, t), () => e.removeEventListener(c, t);
+	}, [
+		i,
+		s,
+		c,
+		l
+	]);
+}
+//#endregion
+export { s as hotkey, c as useHotkeys };

package/dist/hooks/useInView.js

@@ -0,0 +1,27 @@
+"use client";
+import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
+//#region src/lib/hooks/useInView.ts
+function i(i = {}) {
+	let { once: a = !1, root: o, rootMargin: s, threshold: c } = i, [l, u] = r(null), [d, f] = r(!1), p = n(!1);
+	return t(() => {
+		if (l === null || typeof IntersectionObserver > "u") return;
+		let e = new IntersectionObserver((t) => {
+			for (let n of t) n.isIntersecting ? (p.current || f(!0), a && (p.current = !0, e.disconnect())) : a || f(!1);
+		}, {
+			root: o,
+			rootMargin: s,
+			threshold: c
+		});
+		return e.observe(l), () => e.disconnect();
+	}, [
+		l,
+		a,
+		o,
+		s,
+		c
+	]), [e((e) => {
+		u(e);
+	}, []), d];
+}
+//#endregion
+export { i as useInView };

package/dist/hooks/useLocalStorage.js

@@ -0,0 +1,8 @@
+"use client";
+import { useStorageState as e } from "./useStorageState.js";
+//#region src/lib/hooks/useLocalStorage.ts
+function t(t, n, r) {
+	return e("local", t, n, r);
+}
+//#endregion
+export { t as useLocalStorage };

package/dist/hooks/useMediaQuery.js

@@ -4,9 +4,10 @@ import { useCallback as e, useSyncExternalStore as t } from "react";
 var n = () => !1;
 function r(r) {
 	let i = e((e) => {
+		if (typeof window.matchMedia != "function") return () => void 0;
 		let t = window.matchMedia(r);
 		return t.addEventListener("change", e), () => t.removeEventListener("change", e);
-	}, [r]), a = e(() => window.matchMedia(r).matches, [r]);
+	}, [r]), a = e(() => typeof window.matchMedia == "function" && window.matchMedia(r).matches, [r]);
 	return t(i, a, n);
 }
 //#endregion

package/dist/hooks/usePrevious.js

@@ -0,0 +1,11 @@
+"use client";
+import { useEffect as e, useRef as t } from "react";
+//#region src/lib/hooks/usePrevious.ts
+function n(n) {
+	let r = t(void 0), i = r.current;
+	return e(() => {
+		r.current = n;
+	}, [n]), i;
+}
+//#endregion
+export { n as usePrevious };

package/dist/hooks/useSessionStorage.js

@@ -0,0 +1,8 @@
+"use client";
+import { useStorageState as e } from "./useStorageState.js";
+//#region src/lib/hooks/useSessionStorage.ts
+function t(t, n, r) {
+	return e("session", t, n, r);
+}
+//#endregion
+export { t as useSessionStorage };

package/dist/hooks/useStorageState.js

@@ -0,0 +1,80 @@
+"use client";
+import { useEffect as e } from "react";
+import { isControl as t, useControl as n } from "react-use-control";
+//#region src/lib/hooks/useStorageState.ts
+function r(e) {
+	if (typeof window > "u") return null;
+	try {
+		return e === "local" ? window.localStorage : window.sessionStorage;
+	} catch {
+		return null;
+	}
+}
+function i(e, t) {
+	let n = r(e);
+	if (n === null) return {
+		present: !1,
+		value: void 0
+	};
+	let i;
+	try {
+		i = n.getItem(t);
+	} catch {
+		return {
+			present: !1,
+			value: void 0
+		};
+	}
+	if (i === null) return {
+		present: !1,
+		value: void 0
+	};
+	try {
+		return {
+			present: !0,
+			value: JSON.parse(i)
+		};
+	} catch {
+		return {
+			present: !1,
+			value: void 0
+		};
+	}
+}
+function a(a, o, s, c) {
+	let l = t(s), u = l ? void 0 : s, [d, f] = n(l ? s : void 0, () => {
+		let e = i(a, o);
+		if (e.present) return e.value;
+		if (u !== void 0) return u;
+		if (c !== void 0) return typeof c == "function" ? c() : c;
+	});
+	return e(() => {
+		if (l || d === void 0) return;
+		let e = r(a);
+		if (e !== null) try {
+			e.setItem(o, JSON.stringify(d));
+		} catch {}
+	}, [
+		l,
+		a,
+		o,
+		d
+	]), e(() => {
+		if (l || typeof window > "u") return;
+		let e = (e) => {
+			if (e.key !== o) return;
+			let t = r(a);
+			if ((t === null || e.storageArea === null || e.storageArea === t) && e.newValue !== null) try {
+				f(JSON.parse(e.newValue));
+			} catch {}
+		};
+		return window.addEventListener("storage", e), () => window.removeEventListener("storage", e);
+	}, [
+		l,
+		a,
+		o,
+		f
+	]), [d, f];
+}
+//#endregion
+export { a as useStorageState };