@box-kite/react 2.2.16 → 2.2.17

package/components/menu.mjs

@@ -10,10 +10,11 @@ import { t as u } from "../placement.mjs";
 import { a as d, i as f } from "../reporting.mjs";
 import { t as p } from "../layer.mjs";
 import m from "./overlay.mjs";
-import { createContext as h, useCallback as g, useContext as _, useMemo as v, useRef as y, useState as b } from "react";
-import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+import { t as h } from "../motion.mjs";
+import { createContext as g, useCallback as _, useContext as v, useMemo as y, useRef as b, useState as x } from "react";
+import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
 //#region src/utils/menu/menuUtils.ts
-var w;
+var T;
 (function(e) {
 	let t = e.ITEM_SELECTOR = "[role=\"menuitem\"],[role=\"menuitemcheckbox\"],[role=\"menuitemradio\"]";
 	function n(e, t) {
@@ -41,18 +42,18 @@ var w;
 		return r < 0 ? void 0 : e[r];
 	}
 	e.typeaheadTarget = s;
-})(w ||= {});
-var T = w, E = h(null);
-function D(e) {
-	let t = _(E);
+})(T ||= {});
+var E = T, D = g(null);
+function O(e) {
+	let t = v(D);
 	if (!t) throw Error(`<${e}> must be rendered inside a <Menu>.`);
 	return t;
 }
-function O(e) {
-	let [t, n] = b([]);
+function k(e) {
+	let [t, n] = x([]);
 	return {
 		panels: t,
-		registerLayer: g((t) => {
+		registerLayer: _((t) => {
 			n((e) => [...e, t]);
 			let r = e?.(t);
 			return () => {
@@ -61,12 +62,12 @@ function O(e) {
 		}, [e])
 	};
 }
-var k = h(null);
-function A(e, t) {
-	let { trigger: n, children: r, open: i, defaultOpen: a = !1, onOpenChange: s, label: c, labelledBy: l, side: u = "bottom", align: d = "start", offset: f = 1, flip: m = !0, matchWidth: h = !1, props: g, ..._ } = e, b = y("first"), w = o((e) => {
-		let t = T.items(e), n = b.current === "last" ? t[t.length - 1] : t[0];
-		b.current = "first", (n ?? e).focus();
-	}), { panels: D, registerLayer: k } = O(), A = p({
+var A = g(null);
+function j(e, t) {
+	let { trigger: n, children: r, open: i, defaultOpen: a = !1, onOpenChange: s, label: c, labelledBy: l, side: u = "bottom", align: d = "start", offset: f = 1, flip: m = !0, matchWidth: h = !1, props: g, ..._ } = e, v = b("first"), x = o((e) => {
+		let t = E.items(e), n = v.current === "last" ? t[t.length - 1] : t[0];
+		v.current = "first", (n ?? e).focus();
+	}), { panels: T, registerLayer: O } = k(), A = p({
 		haspopup: "menu",
 		idPrefix: "menu",
 		id: _.id,
@@ -77,31 +78,31 @@ function A(e, t) {
 			component: "menu",
 			type: "openChange"
 		},
-		onOpened: w,
-		inside: D
-	}), M = o((e) => {
-		(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), b.current = e.key === "ArrowUp" ? "last" : "first", A.isOpen && A.panelElement ? w(A.panelElement) : A.setOpen(!0, {
+		onOpened: x,
+		inside: T
+	}), j = o((e) => {
+		(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), v.current = e.key === "ArrowUp" ? "last" : "first", A.isOpen && A.panelElement ? x(A.panelElement) : A.setOpen(!0, {
 			reason: "trigger",
 			event: e
 		}));
-	}), N = v(() => ({
+	}), N = y(() => ({
 		ref: A.trigger.ref,
 		props: {
 			...A.trigger.props,
-			onKeyDown: M
+			onKeyDown: j
 		}
-	}), [M, A.trigger]), P = o((e) => A.setOpen(!1, e)), F = v(() => ({
+	}), [j, A.trigger]), P = o((e) => A.setOpen(!1, e)), F = y(() => ({
 		open: A.isOpen,
 		closeAll: P,
-		registerLayer: k
+		registerLayer: O
 	}), [
 		P,
 		A.isOpen,
-		k
+		O
 	]);
-	return /* @__PURE__ */ C(x, { children: [n(N), /* @__PURE__ */ S(E.Provider, {
+	return /* @__PURE__ */ w(S, { children: [n(N), /* @__PURE__ */ C(D.Provider, {
 		value: F,
-		children: /* @__PURE__ */ S(j, {
+		children: /* @__PURE__ */ C(M, {
 			layer: A,
 			side: u,
 			align: d,
@@ -117,104 +118,104 @@ function A(e, t) {
 		})
 	})] });
 }
-function j(e) {
-	let { layer: r, side: i, align: s, offset: c, flip: d, matchWidth: f, label: p, labelledBy: h, contentProps: _, closeSelf: v, elementRef: b, children: x, ...C } = e, { platform: w, isOpen: E, id: O, triggerElement: k, setPanel: A } = r, j = g((e) => {
-		A(e), t(b, e);
-	}, [A, b]), M = D("Menu"), N = y({
+function M(e) {
+	let { layer: r, side: i, align: s, offset: c, flip: d, matchWidth: f, label: p, labelledBy: g, contentProps: v, closeSelf: y, elementRef: x, children: S, ...w } = e, { platform: T, isOpen: D, id: k, triggerElement: A, setPanel: j } = r, M = _((e) => {
+		j(e), t(x, e);
+	}, [j, x]), N = O("Menu"), P = b({
 		query: "",
 		at: 0
-	}), P = u({
+	}), F = u({
 		side: i,
 		align: s,
 		offset: c,
 		flip: d,
 		matchWidth: f,
-		anchor: k
-	}), F = {
+		anchor: A
+	}), I = h(S, D, r.panelElement), L = {
 		role: "menu",
 		"aria-label": p,
-		"aria-labelledby": h,
+		"aria-labelledby": g,
 		tabIndex: -1,
 		onKeyDown: o((e) => {
 			let t = e.currentTarget;
-			if (!T.owns(t, e.target)) return;
-			let r = T.items(t), i = r.indexOf(document.activeElement), a = (t) => {
+			if (!E.owns(t, e.target)) return;
+			let r = E.items(t), i = r.indexOf(document.activeElement), a = (t) => {
 				t && (e.preventDefault(), t.focus());
 			}, o = n(t) ? "ArrowRight" : "ArrowLeft";
 			switch (e.key) {
-				case "ArrowDown": return a(T.step(r, i, 1));
-				case "ArrowUp": return a(T.step(r, i, -1));
+				case "ArrowDown": return a(E.step(r, i, 1));
+				case "ArrowUp": return a(E.step(r, i, -1));
 				case "Home": return a(r[0]);
 				case "End": return a(r[r.length - 1]);
-				case "Tab": return M.closeAll({
+				case "Tab": return N.closeAll({
 					reason: "tab",
 					event: e
 				});
-				case o: return v ? (e.preventDefault(), v({
+				case o: return y ? (e.preventDefault(), y({
 					reason: "trigger",
 					event: e
 				})) : void 0;
 			}
 			if (l.isPrintable(e)) {
-				let t = l.push(N.current, e.key, e.timeStamp);
-				a(T.typeaheadTarget(r, t, i));
+				let t = l.push(P.current, e.key, e.timeStamp);
+				a(E.typeaheadTarget(r, t, i));
 			}
 		}),
 		onPointerOver: o((e) => {
-			let t = e.currentTarget, n = e.target?.closest(T.ITEM_SELECTOR);
-			!n || !T.owns(t, n) || n === document.activeElement || n.focus();
+			let t = e.currentTarget, n = e.target?.closest(E.ITEM_SELECTOR);
+			!n || !E.owns(t, n) || n === document.activeElement || n.focus();
 		}),
-		..._
+		...v
 	};
-	return w ? /* @__PURE__ */ S(a, {
-		ref: j,
+	return T ? /* @__PURE__ */ C(a, {
+		ref: M,
 		component: "menu",
-		...C,
-		variant: [C.variant, { topLayer: !0 }],
-		...P.layerProps,
-		id: O,
+		...w,
+		variant: [w.variant, { topLayer: !0 }],
+		...F.layerProps,
+		id: k,
 		props: {
 			popover: "auto",
-			...F
+			...L
 		},
-		children: x
-	}) : E ? /* @__PURE__ */ S(m, {
-		contentRef: j,
-		anchor: k,
+		children: I
+	}) : D ? /* @__PURE__ */ C(m, {
+		contentRef: M,
+		anchor: A,
 		side: i,
 		align: s,
 		offset: c,
 		flip: d,
 		matchWidth: f,
 		component: "menu",
-		...C,
-		id: O,
-		props: F,
-		children: x
+		...w,
+		id: k,
+		props: L,
+		children: S
 	}) : null;
 }
-function M(e, t) {
-	let { label: s, children: l, disabled: u, side: d = "end", align: m = "start", offset: h = 0, flip: g = !0, itemProps: _, props: y, ...b } = e, w = D("Menu.Sub"), k = c("menu-sub"), A = o((e) => {
-		(T.items(e)[0] ?? e).focus();
-	}), M = o((e, t) => {
+function N(e, t) {
+	let { label: s, children: l, disabled: u, side: d = "end", align: m = "start", offset: h = 0, flip: g = !0, itemProps: _, props: v, ...b } = e, x = O("Menu.Sub"), T = c("menu-sub"), A = o((e) => {
+		(E.items(e)[0] ?? e).focus();
+	}), j = o((e, t) => {
 		e && t?.focus();
-	}), { panels: P, registerLayer: F } = O(w.registerLayer), I = f("menu.sub"), L = p({
+	}), { panels: N, registerLayer: F } = k(x.registerLayer), I = f("menu.sub"), L = p({
 		haspopup: "menu",
 		idPrefix: "menu-sub",
 		id: b.id,
 		onOpened: A,
-		onClosing: M,
-		inside: P
+		onClosing: j,
+		inside: N
 	});
 	i(() => {
-		if (!(!L.isOpen || !L.panelElement)) return w.registerLayer(L.panelElement);
+		if (!(!L.isOpen || !L.panelElement)) return x.registerLayer(L.panelElement);
 	}, [
 		L.isOpen,
 		L.panelElement,
-		w.registerLayer
+		x.registerLayer
 	]), i(() => {
-		w.open || L.setOpen(!1, { reason: "imperative" });
-	}, [w.open, L.setOpen]), i(() => {
+		x.open || L.setOpen(!1, { reason: "imperative" });
+	}, [x.open, L.setOpen]), i(() => {
 		if (!L.isOpen) return;
 		let e = new AbortController();
 		return document.addEventListener("focusin", (e) => {
@@ -237,28 +238,28 @@ function M(e, t) {
 		}), I("openChange", !0, {
 			reason: "keyboard",
 			event: e,
-			item: N(s)
+			item: P(s)
 		}));
 	}), z = o((e) => {
 		u || L.setOpen(!0, {
 			reason: "trigger",
 			event: e
 		});
-	}), B = v(() => ({
+	}), B = y(() => ({
 		open: L.isOpen,
-		closeAll: w.closeAll,
+		closeAll: x.closeAll,
 		registerLayer: F
 	}), [
 		L.isOpen,
-		w.closeAll,
+		x.closeAll,
 		F
 	]);
-	return /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ C(a, {
+	return /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ w(a, {
 		tag: "button",
 		ref: u ? void 0 : L.trigger.ref,
 		component: "menu.item",
 		variant: { sub: !0 },
-		id: k,
+		id: T,
 		props: {
 			type: "button",
 			role: "menuitem",
@@ -269,18 +270,18 @@ function M(e, t) {
 			onKeyDown: R,
 			onPointerEnter: z
 		},
-		children: [s, /* @__PURE__ */ S(a, { component: "menu.arrow" })]
-	}), !u && /* @__PURE__ */ S(E.Provider, {
+		children: [s, /* @__PURE__ */ C(a, { component: "menu.arrow" })]
+	}), !u && /* @__PURE__ */ C(D.Provider, {
 		value: B,
-		children: /* @__PURE__ */ S(j, {
+		children: /* @__PURE__ */ C(M, {
 			layer: L,
 			side: d,
 			align: m,
 			offset: h,
 			flip: g,
 			matchWidth: !1,
-			labelledBy: k,
-			contentProps: y,
+			labelledBy: T,
+			contentProps: v,
 			closeSelf: (e) => L.setOpen(!1, e),
 			...b,
 			elementRef: t,
@@ -288,10 +289,10 @@ function M(e, t) {
 		})
 	})] });
 }
-var N = (e, t) => t ?? (typeof e == "string" ? e : void 0);
-function P(e) {
-	let { onSelect: t, disabled: n, closeOnSelect: r = !0, value: i, props: s, children: c, ...l } = e, u = D("Menu.Item"), d = f("menu.item"), p = o((e) => {
-		n || (t?.(e), d("select", N(c, i), {
+var P = (e, t) => t ?? (typeof e == "string" ? e : void 0);
+function F(e) {
+	let { onSelect: t, disabled: n, closeOnSelect: r = !0, value: i, props: s, children: c, ...l } = e, u = O("Menu.Item"), d = f("menu.item"), p = o((e) => {
+		n || (t?.(e), d("select", P(c, i), {
 			reason: "select",
 			event: e
 		}), r && u.closeAll({
@@ -299,7 +300,7 @@ function P(e) {
 			event: e
 		}));
 	});
-	return /* @__PURE__ */ S(a, {
+	return /* @__PURE__ */ C(a, {
 		tag: "button",
 		component: "menu.item",
 		...l,
@@ -314,8 +315,8 @@ function P(e) {
 		children: c
 	});
 }
-function F(e) {
-	let { checked: t, defaultChecked: n = !1, onCheckedChange: r, disabled: i, closeOnSelect: c = !1, value: l, props: u, children: d, ...p } = e, m = D("Menu.CheckboxItem"), [h, g] = s({
+function I(e) {
+	let { checked: t, defaultChecked: n = !1, onCheckedChange: r, disabled: i, closeOnSelect: c = !1, value: l, props: u, children: d, ...p } = e, m = O("Menu.CheckboxItem"), [h, g] = s({
 		value: t,
 		defaultValue: n,
 		onChange: r
@@ -326,13 +327,13 @@ function F(e) {
 		}), _("checkedChange", !h, {
 			reason: "select",
 			event: e,
-			item: N(d, l)
+			item: P(d, l)
 		}), c && m.closeAll({
 			reason: "select",
 			event: e
 		}));
 	});
-	return /* @__PURE__ */ C(a, {
+	return /* @__PURE__ */ w(a, {
 		tag: "button",
 		component: "menu.item",
 		...p,
@@ -345,13 +346,13 @@ function F(e) {
 			...u,
 			onClick: v
 		},
-		children: [/* @__PURE__ */ S(a, {
+		children: [/* @__PURE__ */ C(a, {
 			component: "menu.indicator",
-			children: h && /* @__PURE__ */ S(a, { component: "menu.check" })
+			children: h && /* @__PURE__ */ C(a, { component: "menu.check" })
 		}), d]
 	});
 }
-function I(e) {
+function L(e) {
 	let { label: t, value: n, defaultValue: r = "", onValueChange: i, children: a, ...s } = e, [c, l] = d({
 		value: n,
 		defaultValue: r,
@@ -363,21 +364,21 @@ function I(e) {
 	}), u = o((e, t) => l(e, {
 		reason: "select",
 		event: t
-	})), f = v(() => ({
+	})), f = y(() => ({
 		value: c,
 		select: u
 	}), [c, u]);
-	return /* @__PURE__ */ S(k.Provider, {
+	return /* @__PURE__ */ C(A.Provider, {
 		value: f,
-		children: /* @__PURE__ */ S(R, {
+		children: /* @__PURE__ */ C(z, {
 			label: t,
 			...s,
 			children: a
 		})
 	});
 }
-function L(e) {
-	let { value: t, disabled: n, closeOnSelect: r = !1, props: i, children: s, ...c } = e, l = D("Menu.RadioItem"), u = _(k);
+function R(e) {
+	let { value: t, disabled: n, closeOnSelect: r = !1, props: i, children: s, ...c } = e, l = O("Menu.RadioItem"), u = v(A);
 	if (!u) throw Error("<Menu.RadioItem> must be rendered inside a <Menu.RadioGroup>.");
 	let d = u.value === t, f = o((e) => {
 		n || (u.select(t, e), r && l.closeAll({
@@ -385,7 +386,7 @@ function L(e) {
 			event: e
 		}));
 	});
-	return /* @__PURE__ */ C(a, {
+	return /* @__PURE__ */ w(a, {
 		tag: "button",
 		component: "menu.item",
 		...c,
@@ -398,15 +399,15 @@ function L(e) {
 			...i,
 			onClick: f
 		},
-		children: [/* @__PURE__ */ S(a, {
+		children: [/* @__PURE__ */ C(a, {
 			component: "menu.indicator",
-			children: d && /* @__PURE__ */ S(a, { component: "menu.dot" })
+			children: d && /* @__PURE__ */ C(a, { component: "menu.dot" })
 		}), s]
 	});
 }
-function R(e) {
+function z(e) {
 	let { label: t, props: n, children: r, ...i } = e, o = c("menu-group");
-	return /* @__PURE__ */ C(a, {
+	return /* @__PURE__ */ w(a, {
 		component: "menu.group",
 		...i,
 		props: {
@@ -414,7 +415,7 @@ function R(e) {
 			"aria-labelledby": t ? o : void 0,
 			...n
 		},
-		children: [t && /* @__PURE__ */ S(a, {
+		children: [t && /* @__PURE__ */ C(a, {
 			component: "menu.label",
 			id: o,
 			props: { role: "presentation" },
@@ -422,9 +423,9 @@ function R(e) {
 		}), r]
 	});
 }
-function z(e) {
+function B(e) {
 	let { props: t, ...n } = e;
-	return /* @__PURE__ */ S(a, {
+	return /* @__PURE__ */ C(a, {
 		component: "menu.separator",
 		...n,
 		props: {
@@ -433,15 +434,15 @@ function z(e) {
 		}
 	});
 }
-P.displayName = "Menu.Item", F.displayName = "Menu.CheckboxItem", I.displayName = "Menu.RadioGroup", L.displayName = "Menu.RadioItem", R.displayName = "Menu.Group", z.displayName = "Menu.Separator";
-var B = Object.assign(e(A, "Menu"), {
-	Item: P,
-	CheckboxItem: F,
-	RadioGroup: I,
-	RadioItem: L,
-	Group: R,
-	Separator: z,
-	Sub: e(M, "Menu.Sub")
+F.displayName = "Menu.Item", I.displayName = "Menu.CheckboxItem", L.displayName = "Menu.RadioGroup", R.displayName = "Menu.RadioItem", z.displayName = "Menu.Group", B.displayName = "Menu.Separator";
+var V = Object.assign(e(j, "Menu"), {
+	Item: F,
+	CheckboxItem: I,
+	RadioGroup: L,
+	RadioItem: R,
+	Group: z,
+	Separator: B,
+	Sub: e(N, "Menu.Sub")
 });
 //#endregion
-export { B as default };
+export { V as default };

package/components/overlay.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../client.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs");let o=require("react"),s=require("react/jsx-runtime"),c=require("react-dom");function l(l,u){let{side:d=`bottom`,align:f=`center`,offset:p=0,flip:m=!0,onSideChange:h,anchor:g,contentRef:_,matchWidth:v=!0,...y}=l,[b,x]=(0,o.useState)(null),[S,C]=(0,o.useState)(!1),w=(0,o.useRef)(null),T=a.n(),E=(0,o.useRef)(null),D=t.t(!T),O=i.t({side:d,align:f,offset:p,flip:m,matchWidth:v,anchor:g??b,trackSide:!!h});n.n(()=>{let t=E.current;!T||!e.c()||!t||!t.isConnected||t.matches(`:popover-open`)||t.showPopover()}),n.n(()=>{if(T)return;let t=e.f(g)??b;C(!!t&&e.m(t))},[g,b,T]),n.n(()=>{w.current!==O.side&&(w.current=O.side,h?.(O.side))});let k=O.layerProps.ref,A=(0,o.useCallback)(t=>{k?.(t),E.current=t,e.l(u,t)},[k,u]),j=(0,s.jsx)(r.default,{...O.layerProps,ref:A,transition:`none`,props:T?{popover:`manual`}:{dir:S?`rtl`:`ltr`},children:(0,s.jsx)(r.default,{ref:_,...y})});return(0,s.jsxs)(s.Fragment,{children:[!g&&(0,s.jsx)(r.default,{ref:x}),T?j:D&&(0,c.createPortal)(j,D)]})}var u=(0,o.forwardRef)(l);u.displayName=`Overlay`,exports.default=u;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../client.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs");let o=require("react"),s=require("react/jsx-runtime"),c=require("react-dom");function l(l,u){let{side:d=`bottom`,align:f=`center`,offset:p=0,flip:m=!0,onSideChange:h,anchor:g,contentRef:_,matchWidth:v=!0,...y}=l,[b,x]=(0,o.useState)(null),[S,C]=(0,o.useState)(!1),w=(0,o.useRef)(null),T=a.n(),E=(0,o.useRef)(null),D=t.t(!T),O=i.t({side:d,align:f,offset:p,flip:m,matchWidth:v,anchor:g??b,trackSide:!!h});n.n(()=>{let t=E.current;!T||!e.c()||!t||!t.isConnected||t.matches(`:popover-open`)||t.showPopover()}),n.n(()=>{if(T)return;let t=e.f(g)??b;C(!!t&&e.m(t))},[g,b,T]),n.n(()=>{w.current!==O.side&&(w.current=O.side,h?.(O.side))});let k=O.layerProps.ref,A=(0,o.useCallback)(t=>{k?.(t),E.current=t,e.l(u,t)},[k,u]),j=(0,s.jsx)(r.default,{...O.layerProps,ref:A,transition:`none`,overflow:`visible`,props:T?{popover:`manual`}:{dir:S?`rtl`:`ltr`},children:(0,s.jsx)(r.default,{ref:_,...y})});return(0,s.jsxs)(s.Fragment,{children:[!g&&(0,s.jsx)(r.default,{ref:x}),T?j:D&&(0,c.createPortal)(j,D)]})}var u=(0,o.forwardRef)(l);u.displayName=`Overlay`,exports.default=u;

package/components/overlay.mjs

@@ -39,6 +39,7 @@ function _(l, _) {
 		...F.layerProps,
 		ref: L,
 		transition: "none",
+		overflow: "visible",
 		props: M ? { popover: "manual" } : { dir: k ? "rtl" : "ltr" },
 		children: /* @__PURE__ */ m(o, {
 			ref: w,

package/components/popover.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs"),o=require("./overlay.cjs");let s=require("react"),c=require("react/jsx-runtime");function l(e,l){let{trigger:u,children:d,open:f,defaultOpen:p=!1,onOpenChange:m,label:h,labelledBy:g,side:_=`bottom`,align:v=`center`,offset:y=2,flip:b=!0,matchWidth:x=!1,autoFocus:S=!0,props:C,...w}=e,T=r.a(e=>{!S||e.contains(document.activeElement)||e.focus()}),{platform:E,isOpen:D,id:O,trigger:k,triggerElement:A,setPanel:j}=a.t({haspopup:`dialog`,idPrefix:`popover`,id:w.id,interaction:{component:`popover`,type:`openChange`},open:f,defaultOpen:p,onOpenChange:m,onOpened:T}),M=i.t({side:_,align:v,offset:y,flip:b,matchWidth:x,anchor:A}),N=(0,s.useCallback)(e=>{j(e),t.l(l,e)},[j,l]),P={"aria-label":h,"aria-labelledby":g},F=w;return E?(0,c.jsxs)(c.Fragment,{children:[u(k),(0,c.jsx)(n.default,{ref:N,component:`popover`,...F,variant:[F.variant,{topLayer:!0}],...M.layerProps,id:O,props:{popover:`auto`,role:`dialog`,...P,tabIndex:-1,...C},children:d})]}):(0,c.jsxs)(c.Fragment,{children:[u(k),D&&(0,c.jsx)(o.default,{contentRef:N,anchor:A,side:_,align:v,offset:y,flip:b,matchWidth:x,component:`popover`,...F,id:O,props:{role:`dialog`,...P,tabIndex:-1,...C},children:d})]})}var u=e.f(l,`Popover`);exports.default=u;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs"),o=require("./overlay.cjs"),s=require("../motion.cjs");let c=require("react"),l=require("react/jsx-runtime");function u(e,u){let{trigger:d,children:f,open:p,defaultOpen:m=!1,onOpenChange:h,label:g,labelledBy:_,side:v=`bottom`,align:y=`center`,offset:b=2,flip:x=!0,matchWidth:S=!1,autoFocus:C=!0,props:w,...T}=e,E=r.a(e=>{!C||e.contains(document.activeElement)||e.focus()}),{platform:D,isOpen:O,id:k,trigger:A,triggerElement:j,setPanel:M,panelElement:N}=a.t({haspopup:`dialog`,idPrefix:`popover`,id:T.id,interaction:{component:`popover`,type:`openChange`},open:p,defaultOpen:m,onOpenChange:h,onOpened:E}),P=i.t({side:v,align:y,offset:b,flip:x,matchWidth:S,anchor:j}),F=s.t(f,O,N),I=(0,c.useCallback)(e=>{M(e),t.l(u,e)},[M,u]),L={"aria-label":g,"aria-labelledby":_},R=T;return D?(0,l.jsxs)(l.Fragment,{children:[d(A),(0,l.jsx)(n.default,{ref:I,component:`popover`,...R,variant:[R.variant,{topLayer:!0}],...P.layerProps,id:k,props:{popover:`auto`,role:`dialog`,...L,tabIndex:-1,...w},children:F})]}):(0,l.jsxs)(l.Fragment,{children:[d(A),O&&(0,l.jsx)(o.default,{contentRef:I,anchor:j,side:v,align:y,offset:b,flip:x,matchWidth:S,component:`popover`,...R,id:k,props:{role:`dialog`,...L,tabIndex:-1,...w},children:f})]})}var d=e.f(u,`Popover`);exports.default=d;

package/components/popover.mjs

@@ -6,72 +6,73 @@ import { a as r } from "../behavior.mjs";
 import { t as i } from "../placement.mjs";
 import { t as a } from "../layer.mjs";
 import o from "./overlay.mjs";
-import { useCallback as s } from "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { t as s } from "../motion.mjs";
+import { useCallback as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/components/popover.tsx
-function d(e, d) {
-	let { trigger: f, children: p, open: m, defaultOpen: h = !1, onOpenChange: g, label: _, labelledBy: v, side: y = "bottom", align: b = "center", offset: x = 2, flip: S = !0, matchWidth: C = !1, autoFocus: w = !0, props: T, ...E } = e, D = r((e) => {
-		!w || e.contains(document.activeElement) || e.focus();
-	}), { platform: O, isOpen: k, id: A, trigger: j, triggerElement: M, setPanel: N } = a({
+function f(e, f) {
+	let { trigger: p, children: m, open: h, defaultOpen: g = !1, onOpenChange: _, label: v, labelledBy: y, side: b = "bottom", align: x = "center", offset: S = 2, flip: C = !0, matchWidth: w = !1, autoFocus: T = !0, props: E, ...D } = e, O = r((e) => {
+		!T || e.contains(document.activeElement) || e.focus();
+	}), { platform: k, isOpen: A, id: j, trigger: M, triggerElement: N, setPanel: P, panelElement: F } = a({
 		haspopup: "dialog",
 		idPrefix: "popover",
-		id: E.id,
+		id: D.id,
 		interaction: {
 			component: "popover",
 			type: "openChange"
 		},
-		open: m,
-		defaultOpen: h,
-		onOpenChange: g,
-		onOpened: D
-	}), P = i({
-		side: y,
-		align: b,
-		offset: x,
-		flip: S,
-		matchWidth: C,
-		anchor: M
-	}), F = s((e) => {
-		N(e), t(d, e);
-	}, [N, d]), I = {
-		"aria-label": _,
-		"aria-labelledby": v
-	}, L = E;
-	return O ? /* @__PURE__ */ u(c, { children: [f(j), /* @__PURE__ */ l(n, {
-		ref: F,
+		open: h,
+		defaultOpen: g,
+		onOpenChange: _,
+		onOpened: O
+	}), I = i({
+		side: b,
+		align: x,
+		offset: S,
+		flip: C,
+		matchWidth: w,
+		anchor: N
+	}), L = s(m, A, F), R = c((e) => {
+		P(e), t(f, e);
+	}, [P, f]), z = {
+		"aria-label": v,
+		"aria-labelledby": y
+	}, B = D;
+	return k ? /* @__PURE__ */ d(l, { children: [p(M), /* @__PURE__ */ u(n, {
+		ref: R,
 		component: "popover",
-		...L,
-		variant: [L.variant, { topLayer: !0 }],
-		...P.layerProps,
-		id: A,
+		...B,
+		variant: [B.variant, { topLayer: !0 }],
+		...I.layerProps,
+		id: j,
 		props: {
 			popover: "auto",
 			role: "dialog",
-			...I,
+			...z,
 			tabIndex: -1,
-			...T
+			...E
 		},
-		children: p
-	})] }) : /* @__PURE__ */ u(c, { children: [f(j), k && /* @__PURE__ */ l(o, {
-		contentRef: F,
-		anchor: M,
-		side: y,
-		align: b,
-		offset: x,
-		flip: S,
-		matchWidth: C,
+		children: L
+	})] }) : /* @__PURE__ */ d(l, { children: [p(M), A && /* @__PURE__ */ u(o, {
+		contentRef: R,
+		anchor: N,
+		side: b,
+		align: x,
+		offset: S,
+		flip: C,
+		matchWidth: w,
 		component: "popover",
-		...L,
-		id: A,
+		...B,
+		id: j,
 		props: {
 			role: "dialog",
-			...I,
+			...z,
 			tabIndex: -1,
-			...T
+			...E
 		},
-		children: p
+		children: m
 	})] });
 }
-var f = e(d, "Popover");
+var p = e(f, "Popover");
 //#endregion
-export { f as default };
+export { p as default };

package/components/presence.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../motion.cjs");let t=require("react/jsx-runtime");function n(n){let r=e.t({present:n.present});return(0,t.jsx)(t.Fragment,{children:r.mounted?n.children(r):null})}n.displayName=`Presence`,exports.default=n;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../motion.cjs");let t=require("react/jsx-runtime");function n(n){let r=e.r({present:n.present});return(0,t.jsx)(t.Fragment,{children:r.mounted?n.children(r):null})}n.displayName=`Presence`,exports.default=n;

package/components/presence.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "../motion.mjs";
+import { r as e } from "../motion.mjs";
 import { Fragment as t, jsx as n } from "react/jsx-runtime";
 //#region src/components/presence.tsx
 function r(r) {