@mortenbrudvik/waveui 0.14.0 → 0.15.0

package/dist/components/overlays/Popover.mjs

@@ -10,23 +10,27 @@ import { useId as c } from "../../hooks/useId.mjs";
 import { focusElement as te, getFirstTabbable as l, isConnectedAndFocusable as u } from "../../lib/focus.mjs";
 import { useMergedRefs as d } from "../../hooks/useMergedRefs.mjs";
 import { useIsClient as f } from "../../hooks/useIsClient.mjs";
+import { usePresence as p } from "../../hooks/usePresence.mjs";
 import { resolvePositioning as ne, usePopupPosition as re } from "../../hooks/usePopupPosition.mjs";
-import { useDismiss as p } from "../../hooks/useDismiss.mjs";
-import { useRestoreFocus as m } from "../../hooks/useRestoreFocus.mjs";
-import { Portal as h } from "../portal/Portal.mjs";
-import { useHoverIntent as g } from "../../hooks/useHoverIntent.mjs";
-import { PopoverBeak as _, getTabbableThrough as v, isFocusInSurfaceTree as y, usePopoverTabOrder as ie } from "./Popover.shared.mjs";
-import { getTriggerFocusTarget as b, useTriggerElement as x, useTriggerFocusRef as ae } from "../../hooks/useTriggerElement.mjs";
-import { usePopupTarget as S } from "../../hooks/useResolvedTarget.mjs";
-import { useContextMenuAnchor as oe } from "../../hooks/useContextMenuAnchor.mjs";
-import * as C from "react";
-import { Fragment as se, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { useDismiss as m } from "../../hooks/useDismiss.mjs";
+import { useRestoreFocus as h } from "../../hooks/useRestoreFocus.mjs";
+import { Portal as g } from "../portal/Portal.mjs";
+import { popupMotion as _ } from "../../lib/motion.mjs";
+import { useFocusBeforeClose as v } from "../../hooks/useFocusBeforeClose.mjs";
+import { useHoverIntent as ie } from "../../hooks/useHoverIntent.mjs";
+import { useMotionClasses as y } from "../../hooks/useMotion.mjs";
+import { PopoverBeak as ae, getTabbableThrough as b, isFocusInSurfaceTree as x, usePopoverTabOrder as oe } from "./Popover.shared.mjs";
+import { getTriggerFocusTarget as S, useTriggerElement as C, useTriggerFocusRef as se } from "../../hooks/useTriggerElement.mjs";
+import { usePopupTarget as w } from "../../hooks/useResolvedTarget.mjs";
+import { useContextMenuAnchor as ce } from "../../hooks/useContextMenuAnchor.mjs";
+import * as T from "react";
+import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
 //#region src/components/overlays/Popover.tsx
-var E = C.createContext(null);
-E.displayName = "PopoverContext";
-var D = null;
-function O() {
-	return D ??= {
+var k = T.createContext(null);
+k.displayName = "PopoverContext";
+var A = null;
+function j() {
+	return A ??= {
 		open: !1,
 		setOpen: () => {},
 		contentId: "wave-popover-inert-content",
@@ -57,221 +61,230 @@ function O() {
 		arrowStyles: {},
 		placedSide: "bottom",
 		fitViewport: !1
-	}, D;
+	}, A;
 }
-function k(e) {
-	return C.useContext(E) || (n(e, "Popover"), O());
+function M(e) {
+	return T.useContext(k) || (n(e, "Popover"), j());
 }
-function ce(e, t) {
+function N(e, t) {
 	let n = (t ?? "").split(/\s+/).filter((t) => t && e.getElementById(t));
 	return n.length > 0 ? n.join(" ") : void 0;
 }
-function A(e, t) {
+function le(e, t) {
 	if (!e) return t;
-	let n = e.ownerDocument, r = (t ? n.getElementById(t) : null) ?? b(e) ?? e;
-	return ce(n, r.getAttribute("aria-labelledby")) ?? (r.id || e.id || void 0);
+	let n = e.ownerDocument, r = (t ? n.getElementById(t) : null) ?? S(e) ?? e;
+	return N(n, r.getAttribute("aria-labelledby")) ?? (r.id || e.id || void 0);
 }
-function j(e, t) {
+function ue(e, t) {
 	return t.split(/\s+/).some((t) => {
 		let n = t ? e.getElementById(t) : null;
 		return n ? n.getAttribute("aria-label")?.trim() || n.textContent?.trim() ? !0 : !!n.querySelector("[aria-label]:not([aria-label=\"\"]), [alt]:not([alt=\"\"]), [title]:not([title=\"\"])") : !1;
 	});
 }
-var M = () => () => {};
-function le(e) {
+var P = () => () => {};
+function de(e) {
 	return !!e && typeof e.nodeType == "number";
 }
-function ue(e) {
+function fe(e) {
 	return { get current() {
 		return e();
 	} };
 }
-function de(e, t, n) {
-	return b(e) ?? v(e, t, n);
+function pe(e, t, n) {
+	return S(e) ?? b(e, t, n);
 }
-var N = ({ open: e, defaultOpen: t, onOpenChange: n, side: ee = "bottom", align: i = "start", ignoreOutsideRefs: a, openOnHover: h = !1, openDelay: _ = 250, closeDelay: v = 500, openOnContext: x = !1, target: se, positioning: T, children: D }) => {
-	let { target: O, pending: k } = S("Popover", se, T), [ce, A] = s(e, t ?? !1, n), j = C.useRef(!1), M = o((e) => {
-		j.current = !1, A(e);
-	}), N = C.useCallback(() => j.current, []), P = f(), F = ce && P, [I, L] = C.useState("other"), [fe, R] = C.useState(!1), [z, B] = C.useState(F), V = I;
-	F !== z && (B(F), F && (V = fe ? "hover" : "other")), V !== I && L(V), fe && R(!1);
-	let pe = c("popover-content"), [me, H] = C.useState(void 0), U = me ?? pe, he = c("popover-trigger"), [ge, _e] = C.useState(void 0), [W, ve] = C.useState(null), [G, ye] = C.useState(null), K = C.useRef(null), q = C.useRef(null), be = C.useRef(null), xe = le(O) ? O : null, J = C.useRef(null);
-	C.useInsertionEffect(() => {
-		J.current = xe;
-	}, [xe]);
-	let { setReference: Se, setFloating: Ce, floatingProps: Y, arrowStyles: we, side: Te } = re({
-		open: F,
+var F = ({ open: e, defaultOpen: t, onOpenChange: n, side: ee = "bottom", align: i = "start", ignoreOutsideRefs: a, openOnHover: p = !1, openDelay: g = 250, closeDelay: _ = 500, openOnContext: y = !1, target: ae, positioning: b, children: C }) => {
+	let { target: E, pending: O } = w("Popover", ae, b), [A, j] = s(e, t ?? !1, n), M = T.useRef(!1), N = o((e) => {
+		M.current = !1, j(e);
+	}), le = T.useCallback(() => M.current, []), ue = f(), P = A && ue, [F, I] = T.useState("other"), [L, R] = T.useState(!1), [me, he] = T.useState(P), z = F;
+	P !== me && (he(P), P && (z = L ? "hover" : "other")), z !== F && I(z), L && R(!1);
+	let ge = c("popover-content"), [_e, ve] = T.useState(void 0), B = _e ?? ge, V = c("popover-trigger"), [H, ye] = T.useState(void 0), [U, be] = T.useState(null), [W, xe] = T.useState(null), G = T.useRef(null), K = T.useRef(null), Se = T.useRef(null), Ce = de(E) ? E : null, q = T.useRef(null);
+	T.useInsertionEffect(() => {
+		q.current = Ce;
+	}, [Ce]);
+	let { setReference: we, setFloating: Te, floatingProps: J, arrowStyles: Ee, side: De } = re({
+		open: P,
 		side: ee,
 		align: i,
-		arrowRef: be,
-		...ne(T, { offset: 8 })
-	}), Ee = C.useMemo(() => k ? {
-		...Y,
+		arrowRef: Se,
+		...ne(b, { offset: 8 })
+	}), Oe = T.useMemo(() => O ? {
+		...J,
 		style: {
-			...Y.style,
+			...J.style,
 			visibility: "hidden"
 		}
-	} : Y, [k, Y]), De = C.useRef(null), Oe = o(() => {
-		let e = x ? De.current?.current : null;
+	} : J, [O, J]), ke = T.useRef(null), Y = o(() => {
+		let e = y ? ke.current?.current : null;
 		if (e && u(e)) return e;
-		let t = K.current, n = t ? b(t) : null;
+		let t = G.current, n = t ? S(t) : null;
 		if (n) return n;
-		let r = J.current;
+		let r = q.current;
 		return r && u(r) ? r : t;
-	}), ke = C.useMemo(() => ue(Oe), [Oe]), Ae = o((e) => !(e.ctrlKey && K.current?.contains(e.target))), { layerId: X } = p({
-		open: F,
-		onDismiss: () => M(!1),
-		refs: x ? [
+	}), Ae = T.useMemo(() => fe(Y), [Y]), je = o((e) => !(e.ctrlKey && G.current?.contains(e.target))), { layerId: X } = m({
+		open: P,
+		onDismiss: () => N(!1),
+		refs: y ? [
+			K,
 			q,
-			J,
 			...a ?? []
 		] : [
-			q,
 			K,
-			J,
+			G,
+			q,
 			...a ?? []
 		],
-		anchorRef: ke,
+		anchorRef: Ae,
 		kind: "popover",
-		outsidePress: !x || Ae
-	}), Z = C.useRef(!1), { anchor: je, fromContext: Me, origin: Ne, opener: Q, triggerHandlers: Pe, surfaceHandlers: Fe } = oe({
-		enabled: x,
-		open: F,
-		trigger: G,
+		outsidePress: !y || je
+	}), Z = T.useRef(!1), { anchor: Me, fromContext: Ne, origin: Pe, opener: Q, triggerHandlers: Fe, surfaceHandlers: Ie } = ce({
+		enabled: y,
+		open: P,
+		trigger: W,
 		layerId: X,
 		onOpen: (e) => {
-			Z.current = e === "keyboard", M(!0);
+			Z.current = e === "keyboard", N(!0);
 		},
-		onClose: () => M(!1)
+		onClose: () => N(!1)
 	});
-	C.useInsertionEffect(() => {
-		De.current = Q;
+	T.useInsertionEffect(() => {
+		ke.current = Q;
 	}, [Q]);
-	let Ie = ae(K);
-	m({
-		enabled: F,
-		container: W,
-		triggerRef: x ? void 0 : Ie,
-		finalFocusRef: x ? Q : void 0,
-		fallback: Oe,
+	let Le = se(G);
+	h({
+		enabled: P,
+		container: U,
+		triggerRef: y ? void 0 : Le,
+		finalFocusRef: y ? Q : void 0,
+		fallback: Y,
 		onlyIfFocusInside: !0,
-		isHoverClose: N
-	}), C.useLayoutEffect(() => {
-		F && (j.current = !1);
-	}, [F]);
-	let Le = d(K, ye), Re = d(q, ve, Ce);
-	C.useLayoutEffect(() => {
-		Se(Me ? je ?? (G && (b(G) ?? G)) : O ?? G);
+		isHoverClose: le
+	}), v({
+		open: P,
+		surfaceRef: K,
+		captureOpener: () => y ? null : Le.current,
+		candidates: (e) => [
+			y ? Q.current : null,
+			e,
+			Y()
+		]
+	}), T.useLayoutEffect(() => {
+		P && (M.current = !1);
+	}, [P]);
+	let Re = d(G, xe), ze = d(K, be, Te);
+	T.useLayoutEffect(() => {
+		we(Ne ? Me ?? (W && (S(W) ?? W)) : E ?? W);
 	}, [
-		je,
 		Me,
-		O,
-		G,
-		Se
-	]), C.useLayoutEffect(() => {
+		Ne,
+		E,
+		W,
+		we
+	]), T.useLayoutEffect(() => {
 		if (Z.current) {
-			if (!F) {
+			if (!P) {
 				Z.current = !1;
 				return;
 			}
-			W && (Z.current = !1, te(l(W) ?? W, { preventScroll: !0 }));
+			U && (Z.current = !1, te(l(U) ?? U, { preventScroll: !0 }));
 		}
-	}), C.useEffect(() => {
-		h && x && r("Popover:hover-and-context", "Popover: `openOnHover` is ignored with `openOnContext`: a context popover opens on a right click, Shift+F10 or the ContextMenu key, not on hover.");
-	}, [h, x]);
-	let $ = h && !x, ze = o(() => V === "hover" && !y(q.current, X)), { triggerHandlers: Be, surfaceHandlers: Ve, cancel: He } = g({
+	}), T.useEffect(() => {
+		p && y && r("Popover:hover-and-context", "Popover: `openOnHover` is ignored with `openOnContext`: a context popover opens on a right click, Shift+F10 or the ContextMenu key, not on hover.");
+	}, [p, y]);
+	let $ = p && !y, Be = o(() => z === "hover" && !x(K.current, X)), { triggerHandlers: Ve, surfaceHandlers: He, cancel: Ue } = ie({
 		enabled: $,
-		open: F,
-		openDelay: _,
-		closeDelay: v,
-		trigger: G,
-		surface: W,
+		open: P,
+		openDelay: g,
+		closeDelay: _,
+		trigger: W,
+		surface: U,
 		onOpen: () => {
-			R(!0), M(!0);
+			R(!0), N(!0);
 		},
 		onClose: () => {
-			j.current = !0, A(!1);
+			M.current = !0, j(!1);
 		},
-		canClose: ze
-	}), Ue = o(() => {
-		He(), F && V === "hover" ? L("other") : M((e) => !e);
+		canClose: Be
 	}), We = o(() => {
-		let e = K.current, t = x ? Q.current : null;
-		return t && e?.contains(t) ? t : e ?? J.current;
-	}), Ge = C.useMemo(() => ue(We), [We]), Ke = o((e) => {
-		if (e.key !== "Tab" || e.shiftKey || !F) return;
-		if (x) {
-			let t = We();
-			if (!t || e.target !== (b(t) ?? t)) return;
+		Ue(), P && z === "hover" ? I("other") : N((e) => !e);
+	}), Ge = o(() => {
+		let e = G.current, t = y ? Q.current : null;
+		return t && e?.contains(t) ? t : e ?? q.current;
+	}), Ke = T.useMemo(() => fe(Ge), [Ge]), qe = o((e) => {
+		if (e.key !== "Tab" || e.shiftKey || !P) return;
+		if (y) {
+			let t = Ge();
+			if (!t || e.target !== (S(t) ?? t)) return;
 		}
-		let t = q.current, n = t ? l(t) : null;
+		let t = K.current, n = t ? l(t) : null;
 		n && (e.preventDefault(), n.focus());
-	}), qe = ie({
-		enabled: F,
-		surface: W,
-		anchorRef: Ge,
-		getPreviousStop: de
-	}), Je = Me && Ne === "keyboard", Ye = C.useMemo(() => ({
-		open: F,
-		setOpen: M,
-		contentId: U,
-		setCustomContentId: H,
-		triggerId: he,
-		resolvedTriggerId: ge,
-		setResolvedTriggerId: _e,
-		triggerRef: K,
-		triggerElement: G,
-		triggerElementRef: Le,
-		surfaceElementRef: Re,
-		arrowRef: be,
-		onTriggerClick: Ue,
-		onTriggerKeyDown: Ke,
-		hoverTriggerHandlers: $ ? Be : null,
-		hoverSurfaceHandlers: $ ? Ve : null,
-		contextMode: x,
-		contextTriggerHandlers: x ? Pe : null,
-		onContentContextMenu: Fe.onContextMenu,
-		keyboardContext: Je,
-		onContentKeyDown: qe,
+	}), Je = oe({
+		enabled: P,
+		surface: U,
+		anchorRef: Ke,
+		getPreviousStop: pe
+	}), Ye = Ne && Pe === "keyboard", Xe = T.useMemo(() => ({
+		open: P,
+		setOpen: N,
+		contentId: B,
+		setCustomContentId: ve,
+		triggerId: V,
+		resolvedTriggerId: H,
+		setResolvedTriggerId: ye,
+		triggerRef: G,
+		triggerElement: W,
+		triggerElementRef: Re,
+		surfaceElementRef: ze,
+		arrowRef: Se,
+		onTriggerClick: We,
+		onTriggerKeyDown: qe,
+		hoverTriggerHandlers: $ ? Ve : null,
+		hoverSurfaceHandlers: $ ? He : null,
+		contextMode: y,
+		contextTriggerHandlers: y ? Fe : null,
+		onContentContextMenu: Ie.onContextMenu,
+		keyboardContext: Ye,
+		onContentKeyDown: Je,
 		layerId: X,
-		floatingProps: Ee,
-		arrowStyles: we,
-		placedSide: Te,
-		fitViewport: T?.fitViewport === !0
+		floatingProps: Oe,
+		arrowStyles: Ee,
+		placedSide: De,
+		fitViewport: b?.fitViewport === !0
 	}), [
-		F,
-		M,
-		U,
-		he,
-		ge,
-		G,
-		Le,
+		P,
+		N,
+		B,
+		V,
+		H,
+		W,
 		Re,
-		Ue,
-		Ke,
+		ze,
+		We,
+		qe,
 		$,
-		Be,
 		Ve,
-		x,
-		Pe,
+		He,
+		y,
 		Fe,
+		Ie,
+		Ye,
 		Je,
-		qe,
 		X,
+		Oe,
 		Ee,
-		we,
-		Te,
-		T?.fitViewport
+		De,
+		b?.fitViewport
 	]);
-	return /* @__PURE__ */ w(E.Provider, {
-		value: Ye,
-		children: D
+	return /* @__PURE__ */ D(k.Provider, {
+		value: Xe,
+		children: C
 	});
 };
-N.displayName = "Popover";
-var P = ({ children: e, asChild: t, id: n, onClick: r, onKeyDown: ee, onContextMenu: a, onPointerEnter: o, onPointerMove: s, onPointerLeave: c, ref: te, ...l }) => {
-	let { open: u, contentId: f, triggerId: ne, triggerElementRef: re, setResolvedTriggerId: p, onTriggerClick: m, onTriggerKeyDown: h, hoverTriggerHandlers: g, contextMode: _, contextTriggerHandlers: v } = k("Popover.Trigger"), y = d(te, re), ie = {
+F.displayName = "Popover";
+var I = ({ children: e, asChild: t, id: n, onClick: r, onKeyDown: ee, onContextMenu: a, onPointerEnter: o, onPointerMove: s, onPointerLeave: c, ref: te, ...l }) => {
+	let { open: u, contentId: f, triggerId: p, triggerElementRef: ne, setResolvedTriggerId: re, onTriggerClick: m, onTriggerKeyDown: h, hoverTriggerHandlers: g, contextMode: _, contextTriggerHandlers: v } = M("Popover.Trigger"), ie = d(te, ne), y = {
 		...l,
-		id: n ?? ne,
+		id: n ?? p,
 		"aria-haspopup": "dialog",
 		"aria-expanded": !_ && u,
 		"aria-controls": u && !_ ? f : void 0,
@@ -281,93 +294,95 @@ var P = ({ children: e, asChild: t, id: n, onClick: r, onKeyDown: ee, onContextM
 		onPointerEnter: g ? i(o, g.onPointerEnter) : o,
 		onPointerMove: g ? i(s, g.onPointerMove) : s,
 		onPointerLeave: g ? i(c, g.onPointerLeave) : c,
-		ref: y
+		ref: ie
 	};
-	return x(e, ie, {
+	return C(e, y, {
 		componentName: "Popover.Trigger",
 		asChild: t,
-		onResolvedId: p,
+		onResolvedId: re,
 		omitStateAria: _
 	});
 };
-P.displayName = "PopoverTrigger";
-var F = ({ children: n, title: o, id: s, className: te, style: l, "aria-label": u, "aria-labelledby": f, onKeyDown: ne, onContextMenu: re, onPointerEnter: p, onPointerLeave: m, ref: g, ...v }) => {
-	let { open: y, contentId: ie, setCustomContentId: b, resolvedTriggerId: x, triggerRef: ae, triggerElement: S, surfaceElementRef: oe, arrowRef: E, layerId: D, floatingProps: O, arrowStyles: ce, placedSide: le, fitViewport: ue, onContentKeyDown: de, hoverSurfaceHandlers: N, contextMode: P, onContentContextMenu: F, keyboardContext: I } = k("Popover.Content"), L = c("popover-title"), fe = d(g, oe), R = ee(o), z = f === void 0 && !u && !R, B = y && z && !P, V = C.useCallback((e) => {
-		if (!B || !S || typeof MutationObserver > "u") return M();
+I.displayName = "PopoverTrigger";
+var L = ({ children: n, title: o, id: s, className: te, style: l, "aria-label": u, "aria-labelledby": f, onKeyDown: ne, onContextMenu: re, onPointerEnter: m, onPointerLeave: h, motion: v, ref: ie, ...b }) => {
+	let { open: x, contentId: oe, setCustomContentId: S, resolvedTriggerId: C, triggerRef: se, triggerElement: w, surfaceElementRef: ce, arrowRef: k, layerId: A, floatingProps: j, arrowStyles: N, placedSide: de, fitViewport: fe, onContentKeyDown: pe, hoverSurfaceHandlers: F, contextMode: I, onContentContextMenu: L, keyboardContext: R } = M("Popover.Content"), me = c("popover-title"), { isMounted: he, ref: z, presenceProps: ge } = p(x, { appear: !0 }), _e = y(v, _), ve = d(ie, ce, z), B = ee(o), V = f === void 0 && !u && !B, H = x && V && !I, ye = T.useCallback((e) => {
+		if (!H || !w || typeof MutationObserver > "u") return P();
 		let t = new MutationObserver(e);
-		return t.observe(S, {
+		return t.observe(w, {
 			attributes: !0,
 			attributeFilter: ["id", "aria-labelledby"],
 			childList: !0,
 			subtree: !0
 		}), () => t.disconnect();
-	}, [B, S]), pe = C.useSyncExternalStore(V, () => B ? A(S, x) : void 0, () => B ? x : void 0), me = f ?? (u ? void 0 : R ? L : pe), H = s || void 0;
-	if (C.useEffect(() => (b(H), () => b(void 0)), [H, b]), C.useEffect(() => {
-		y && z && P && t && r("Popover.Content:name", "Popover.Content: the popover has no accessible name. A context popover (openOnContext) is not named by its region: pass `title`, `aria-label` or `aria-labelledby`.");
+	}, [H, w]), U = T.useSyncExternalStore(ye, () => H ? le(w, C) : void 0, () => H ? C : void 0), be = f ?? (u ? void 0 : B ? me : U), W = s || void 0;
+	if (T.useEffect(() => (S(W), () => S(void 0)), [W, S]), T.useEffect(() => {
+		x && V && I && t && r("Popover.Content:name", "Popover.Content: the popover has no accessible name. A context popover (openOnContext) is not named by its region: pass `title`, `aria-label` or `aria-labelledby`.");
 	}, [
-		y,
-		z,
-		P
-	]), C.useEffect(() => {
-		if (!B || !t) return;
-		let e = ae.current;
+		x,
+		V,
+		I
+	]), T.useEffect(() => {
+		if (!H || !t) return;
+		let e = se.current;
 		if (!e) {
 			r("Popover.Content:name", "Popover.Content: the popover has no accessible name. Pass `title`, `aria-label` or `aria-labelledby`, or open it from a Popover.Trigger.");
 			return;
 		}
-		let n = A(e, x);
-		n ? j(e.ownerDocument, n) || r("Popover.Content:trigger-name", "Popover.Content: the popover is named by its trigger, but the trigger has no text to name it (an icon-only trigger needs `aria-label`, or `aria-labelledby` pointing at text), so the popover has no accessible name. Name the trigger, or pass `title`, `aria-label` or `aria-labelledby`.") : r("Popover.Content:trigger-id", "Popover.Content: the popover is named by its trigger, but the trigger element has no `id` (a render-prop child of Popover.Trigger must spread the `id` it receives), so the popover has no accessible name. Spread every trigger prop onto the element, or pass `title`, `aria-label` or `aria-labelledby`.");
+		let n = le(e, C);
+		n ? ue(e.ownerDocument, n) || r("Popover.Content:trigger-name", "Popover.Content: the popover is named by its trigger, but the trigger has no text to name it (an icon-only trigger needs `aria-label`, or `aria-labelledby` pointing at text), so the popover has no accessible name. Name the trigger, or pass `title`, `aria-label` or `aria-labelledby`.") : r("Popover.Content:trigger-id", "Popover.Content: the popover is named by its trigger, but the trigger element has no `id` (a render-prop child of Popover.Trigger must spread the `id` it receives), so the popover has no accessible name. Spread every trigger prop onto the element, or pass `title`, `aria-label` or `aria-labelledby`.");
 	}, [
-		B,
-		x,
-		ae,
-		pe
-	]), !y) return null;
-	let U = /* @__PURE__ */ T(se, { children: [R && /* @__PURE__ */ w("h2", {
-		id: L,
+		H,
+		C,
+		se,
+		U
+	]), !he) return null;
+	let xe = /* @__PURE__ */ O(E, { children: [B && /* @__PURE__ */ D("h2", {
+		id: me,
 		className: e(a.title, "mb-2 text-subtitle-2 font-semibold"),
 		children: o
 	}), n] });
-	return /* @__PURE__ */ w(h, {
-		layerId: D,
-		children: /* @__PURE__ */ T("div", {
+	return /* @__PURE__ */ D(g, {
+		layerId: A,
+		children: /* @__PURE__ */ O("div", {
 			role: "dialog",
 			"aria-label": u,
-			"aria-labelledby": me,
-			tabIndex: I ? -1 : void 0,
-			...v,
-			ref: fe,
-			id: H ?? ie,
-			"data-side": O["data-side"],
-			"data-align": O["data-align"],
+			"aria-labelledby": be,
+			tabIndex: R ? -1 : void 0,
+			...b,
+			...ge,
+			ref: ve,
+			id: W ?? oe,
+			"data-state": x ? "open" : "closed",
+			"data-side": j["data-side"],
+			"data-align": j["data-align"],
 			style: {
 				...l,
-				...O.style
+				...j.style
 			},
-			onKeyDown: i(ne, de),
-			onContextMenu: i(re, F),
-			onPointerEnter: N ? i(p, N.onPointerEnter) : p,
-			onPointerLeave: N ? i(m, N.onPointerLeave) : m,
-			className: e(a.root, "w-64 rounded-md border border-border bg-background p-4 text-body-1 font-normal text-foreground normal-case tracking-normal text-start shadow-4", te),
-			children: [/* @__PURE__ */ w(_, {
-				ref: E,
-				side: le,
-				style: ce,
+			onKeyDown: i(ne, pe),
+			onContextMenu: i(re, L),
+			onPointerEnter: F ? i(m, F.onPointerEnter) : m,
+			onPointerLeave: F ? i(h, F.onPointerLeave) : h,
+			className: e(a.root, "w-64 rounded-md border border-border bg-background p-4 text-body-1 font-normal text-foreground normal-case tracking-normal text-start shadow-4", _e, te),
+			children: [/* @__PURE__ */ D(ae, {
+				ref: k,
+				side: de,
+				style: N,
 				"data-wave-popover-arrow": "",
 				className: a.beak
-			}), ue ? /* @__PURE__ */ w("div", {
+			}), fe ? /* @__PURE__ */ D("div", {
 				className: "overflow-y-auto max-h-[calc(var(--wave-popup-available-height)-2rem-2px)]",
-				children: U
-			}) : U]
+				children: xe
+			}) : xe]
 		})
 	});
 };
-F.displayName = "PopoverContent";
-var I = /* @__PURE__ */ Object.assign(N, {
-	Trigger: P,
-	Content: F
+L.displayName = "PopoverContent";
+var R = /* @__PURE__ */ Object.assign(F, {
+	Trigger: I,
+	Content: L
 });
 //#endregion
-export { I as Popover, F as PopoverContent, P as PopoverTrigger };
+export { R as Popover, L as PopoverContent, I as PopoverTrigger };
 
 //# sourceMappingURL=Popover.mjs.map