@arcadeai/design-system 5.0.0 → 5.0.2

package/dist/popover-Cne_hQUh.js

@@ -0,0 +1,489 @@
+"use client";
+import { t as e } from "./useIsoLayoutEffect-4LGv3HzC.js";
+import { o as t, r as n, t as r, u as i } from "./useRenderElement-BToElZ97.js";
+import { t as a } from "./useStableCallback-CrM0Nb2q.js";
+import { t as o } from "./useBaseUiId-voePHgyX.js";
+import { l as s, t as c, x as l } from "./createBaseUIEventDetails-C_dwdqj4.js";
+import { a as u, n as d, t as f } from "./useOpenChangeComplete-Bs6gnxd9.js";
+import { f as p } from "./floating-ui.utils.dom-5U5b4xPf.js";
+import { t as m } from "./useButton-DjF6Owsn.js";
+import { cn as h } from "./lib/utils.js";
+import { $ as g, A as _, D as v, F as y, M as b, O as x, R as S, S as C, V as w, _ as T, a as E, d as D, f as O, g as k, h as A, i as j, j as M, k as N, l as P, m as F, o as I, p as L, r as R, s as z, u as B, v as ee } from "./popupStateMapping-C8W76brO.js";
+import { t as V } from "./useTimeout-B0afjWAz.js";
+import { a as H, i as te, n as ne, r as U } from "./useOpenInteractionType-DQhvPqO3.js";
+import { n as re, r as ie, t as ae } from "./safePolygon-os2F06tc.js";
+import { i as oe, n as W, r as se, t as ce } from "./usePositioner-DkeyI5Le.js";
+import { n as le, r as ue, t as de } from "./store-C-KXBzZ0.js";
+import { o as fe } from "./composite-COXvAbcT.js";
+import { t as pe } from "./inertValue-BhczR0H5.js";
+import { t as me } from "./useTriggerFocusGuards-Qi8iK-AK.js";
+import { t as he } from "./useAnchoredPopupScrollLock-a2b_Frjv.js";
+import { t as ge } from "./ToolbarRootContext-CDm74ob9.js";
+import * as G from "react";
+import { jsx as K, jsxs as q } from "react/jsx-runtime";
+import * as _e from "react-dom";
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/root/PopoverRootContext.mjs
+var J = /*#__PURE__*/ G.createContext(void 0);
+process.env.NODE_ENV !== "production" && (J.displayName = "PopoverRootContext");
+function Y(e) {
+	let t = G.useContext(J);
+	if (t === void 0 && !e) throw Error(process.env.NODE_ENV === "production" ? i(47) : "Base UI: PopoverRootContext is missing. Popover parts must be placed within <Popover.Root>.");
+	return t;
+}
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/store/PopoverStore.mjs
+function ve() {
+	return {
+		...de(),
+		disabled: !1,
+		modal: !1,
+		focusManagerModal: !1,
+		instantType: void 0,
+		openMethod: null,
+		openChangeReason: null,
+		titleElementId: void 0,
+		descriptionElementId: void 0,
+		stickIfOpen: !0,
+		nested: !1,
+		openOnHover: !1,
+		closeDelay: 0,
+		hasViewport: !1
+	};
+}
+var ye = {
+	...ue,
+	disabled: v((e) => e.disabled),
+	instantType: v((e) => e.instantType),
+	openMethod: v((e) => e.openMethod),
+	openChangeReason: v((e) => e.openChangeReason),
+	modal: v((e) => e.modal),
+	focusManagerModal: v((e) => e.focusManagerModal),
+	stickIfOpen: v((e) => e.stickIfOpen),
+	titleElementId: v((e) => e.titleElementId),
+	descriptionElementId: v((e) => e.descriptionElementId),
+	openOnHover: v((e) => e.openOnHover),
+	closeDelay: v((e) => e.closeDelay),
+	hasViewport: v((e) => e.hasViewport)
+}, be = class e extends C {
+	constructor(e, t, n = !1) {
+		let r = {
+			...ve(),
+			...e
+		}, i = new I();
+		r.open && e?.mounted === void 0 && (r.mounted = !0), r.floatingRootContext = le(i, t, n), super(r, {
+			popupRef: /*#__PURE__*/ G.createRef(),
+			backdropRef: /*#__PURE__*/ G.createRef(),
+			internalBackdropRef: /*#__PURE__*/ G.createRef(),
+			onOpenChange: void 0,
+			onOpenChangeComplete: void 0,
+			triggerFocusTargetRef: /*#__PURE__*/ G.createRef(),
+			beforeContentFocusGuardRef: /*#__PURE__*/ G.createRef(),
+			stickIfOpenTimeout: new V(),
+			triggerElements: i
+		}, ye);
+	}
+	setOpen = (e, t) => {
+		let n = t.reason === l, r = t.reason === "trigger-press" && t.event.detail === 0, i = !e && (t.reason === "escape-key" || t.reason == null), a = P(t), o = this.select("activeTriggerId");
+		if (!e && t.reason === "close-press" && t.trigger == null && o != null && (t.trigger = this.context.triggerElements.getById(o) ?? this.select("activeTriggerElement") ?? void 0), this.context.onOpenChange?.(e, t), t.isCanceled) return;
+		this.state.floatingRootContext.dispatchOpenChange(e, t);
+		let s = () => {
+			let n = {
+				open: e,
+				openChangeReason: t.reason
+			};
+			D(n, e, t.trigger, a()), this.update(n);
+		};
+		n ? (this.set("stickIfOpen", !0), this.context.stickIfOpenTimeout.start(500, () => {
+			this.set("stickIfOpen", !1);
+		}), _e.flushSync(s)) : s(), r || i ? this.set("instantType", r ? "click" : "dismiss") : t.reason === "focus-out" ? this.set("instantType", "focus") : this.set("instantType", void 0);
+	};
+	static useStore(t, n) {
+		let { store: r, internalStore: i } = T(t, (t, r) => new e(n, t, r));
+		return G.useEffect(() => i?.disposeEffect(), [i]), r;
+	}
+	disposeEffect = () => this.context.stickIfOpenTimeout.disposeEffect();
+};
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/root/PopoverRoot.mjs
+function xe({ props: e }) {
+	let { children: t, open: n, defaultOpen: r = !1, onOpenChange: i, onOpenChangeComplete: a, modal: o = !1, handle: l, triggerId: u, defaultTriggerId: d = null } = e, f = be.useStore(l?.store, {
+		modal: o,
+		open: r,
+		openProp: n,
+		activeTriggerId: d,
+		triggerIdProp: u
+	});
+	L(f, n, r, d), f.useControlledProp("openProp", n), f.useControlledProp("triggerIdProp", u);
+	let p = f.useState("open"), m = f.useState("mounted"), h = f.useState("payload"), g = b() != null;
+	f.useContextCallback("onOpenChange", i), f.useContextCallback("onOpenChangeComplete", a), k(f, p), O(f);
+	let { forceUnmount: _ } = F(p, f, () => {
+		f.update({
+			stickIfOpen: !0,
+			openChangeReason: null
+		});
+	});
+	f.useSyncedValues({
+		modal: o,
+		nested: g
+	}), G.useEffect(() => {
+		p || f.context.stickIfOpenTimeout.clear();
+	}, [f, p]);
+	let v = G.useCallback(() => {
+		f.setOpen(!1, c(s));
+	}, [f]);
+	G.useImperativeHandle(e.actionsRef, () => ({
+		unmount: _,
+		close: v
+	}), [_, v]);
+	let y = p || m, x = G.useMemo(() => ({ store: f }), [f]);
+	return /*#__PURE__*/ q(J.Provider, {
+		value: x,
+		children: [y && /*#__PURE__*/ K(Ce, {
+			store: f,
+			modal: o
+		}), typeof t == "function" ? t({ payload: h }) : t]
+	});
+}
+function Se(e) {
+	return Y(!0) ? /*#__PURE__*/ K(xe, { props: e }) : /*#__PURE__*/ K(_, { children: /*#__PURE__*/ K(xe, { props: e }) });
+}
+function Ce({ store: e, modal: r }) {
+	let i = x(e.useState("floatingRootContext"), { outsidePressEvent: {
+		mouse: r === "trap-focus" ? "sloppy" : "intentional",
+		touch: "sloppy"
+	} });
+	return A(e, {
+		activeTriggerProps: i.reference ?? t,
+		inactiveTriggerProps: i.trigger ?? t,
+		popupProps: G.useMemo(() => n(z, i.floating), [i.floating])
+	}), null;
+}
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/trigger/PopoverTrigger.mjs
+var we = /*#__PURE__*/ G.forwardRef(function(e, t) {
+	let { render: n, className: a, style: s, disabled: c = !1, nativeButton: l = !0, handle: u, payload: d, openOnHover: f = !1, delay: p = 300, closeDelay: h = 0, id: _, ...v } = e, y = Y(!0), b = u?.store ?? y?.store;
+	if (!b) throw Error(process.env.NODE_ENV === "production" ? i(74) : "Base UI: <Popover.Trigger> must be either used within a <Popover.Root> component or provided with a handle.");
+	let x = o(_), C = b.useState("isTriggerActive", x), w = b.useState("floatingRootContext"), T = b.useState("isOpenedByTrigger", x), D = b.useState("triggerPopupId", x), O = G.useRef(null), { registerTrigger: k, isMountedByThisTrigger: A } = ee(x, O, b, {
+		payload: d,
+		disabled: c,
+		openOnHover: f,
+		closeDelay: h
+	}), M = b.useState("openChangeReason"), N = b.useState("stickIfOpen"), P = b.useState("openMethod"), F = b.useState("focusManagerModal"), I = re(w, {
+		enabled: !c && w != null && f && (P !== "touch" || M !== "trigger-press"),
+		mouseOnly: !0,
+		move: !1,
+		handleClose: ae(),
+		restMs: p,
+		delay: { close: h },
+		triggerElementRef: O,
+		isActiveTrigger: C,
+		isClosing: () => b.select("transitionStatus") === "ending"
+	}), L = te(w, {
+		enabled: w != null,
+		stickIfOpen: N
+	}), R = ne(() => b.select("open"), (e) => {
+		b.set("openMethod", e);
+	}), z = b.useState("triggerProps", A), { getButtonProps: B, buttonRef: V } = m({
+		disabled: c,
+		native: l
+	}), H = { open(e) {
+		return e && M === "trigger-press" ? j.open(e) : E.open(e);
+	} }, { preFocusGuardRef: U, handlePreFocusGuardFocus: ie, handleFocusTargetFocus: oe } = me(b, O), W = r("button", e, {
+		state: {
+			disabled: c,
+			open: T
+		},
+		ref: [
+			V,
+			t,
+			k,
+			O
+		],
+		props: [
+			L.reference,
+			I,
+			z,
+			R,
+			{
+				[S]: "",
+				id: x,
+				"aria-haspopup": "dialog",
+				"aria-expanded": T,
+				"aria-controls": D
+			},
+			v,
+			B
+		],
+		stateAttributesMapping: H
+	});
+	return A && !F ? /*#__PURE__*/ q(G.Fragment, { children: [
+		/*#__PURE__*/ K(g, {
+			ref: U,
+			onFocus: ie
+		}),
+		/*#__PURE__*/ K(G.Fragment, { children: W }, x),
+		/*#__PURE__*/ K(g, {
+			ref: b.context.triggerFocusTargetRef,
+			onFocus: oe
+		})
+	] }) : /*#__PURE__*/ K(G.Fragment, { children: W }, x);
+});
+process.env.NODE_ENV !== "production" && (we.displayName = "PopoverTrigger");
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/portal/PopoverPortalContext.mjs
+var X = /*#__PURE__*/ G.createContext(void 0);
+process.env.NODE_ENV !== "production" && (X.displayName = "PopoverPortalContext");
+function Te() {
+	let e = G.useContext(X);
+	if (e === void 0) throw Error(process.env.NODE_ENV === "production" ? i(45) : "Base UI: <Popover.Portal> is missing.");
+	return e;
+}
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/portal/PopoverPortal.mjs
+var Z = /*#__PURE__*/ G.forwardRef(function(e, t) {
+	let { keepMounted: n = !1, ...r } = e, { store: i } = Y();
+	return i.useState("mounted") || n ? /*#__PURE__*/ K(X.Provider, {
+		value: n,
+		children: /*#__PURE__*/ K(y, {
+			ref: t,
+			...r
+		})
+	}) : null;
+});
+process.env.NODE_ENV !== "production" && (Z.displayName = "PopoverPortal");
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/positioner/PopoverPositionerContext.mjs
+var Q = /*#__PURE__*/ G.createContext(void 0);
+process.env.NODE_ENV !== "production" && (Q.displayName = "PopoverPositionerContext");
+function Ee() {
+	let e = G.useContext(Q);
+	if (!e) throw Error(process.env.NODE_ENV === "production" ? i(46) : "Base UI: PopoverPositionerContext is missing. PopoverPositioner parts must be placed within <Popover.Positioner>.");
+	return e;
+}
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/positioner/PopoverPositioner.mjs
+var De = /*#__PURE__*/ G.forwardRef(function(t, n) {
+	let { render: r, className: i, style: a, anchor: o, positionMethod: s = "absolute", side: c = "bottom", align: l = "center", sideOffset: u = 0, alignOffset: f = 0, collisionBoundary: p = "clipping-ancestors", collisionPadding: m = 5, arrowPadding: h = 5, sticky: g = !1, disableAnchorTracking: _ = !1, collisionAvoidance: v = w, ...y } = t, { store: b } = Y(), x = Te(), S = M(), C = b.useState("floatingRootContext"), T = b.useState("mounted"), E = b.useState("open"), D = b.useState("openChangeReason"), O = b.useState("activeTriggerElement"), k = b.useState("modal"), A = b.useState("openMethod"), j = b.useState("positionerElement"), P = b.useState("instantType"), F = b.useState("transitionStatus"), I = b.useState("hasViewport"), L = G.useRef(null), R = d(j, !1, !1), z = se({
+		anchor: o,
+		floatingRootContext: C,
+		positionMethod: s,
+		mounted: T,
+		side: c,
+		sideOffset: u,
+		align: l,
+		alignOffset: f,
+		arrowPadding: h,
+		collisionBoundary: p,
+		collisionPadding: m,
+		sticky: g,
+		disableAnchorTracking: _,
+		keepMounted: x,
+		nodeId: S,
+		collisionAvoidance: v,
+		adaptiveOrigin: I ? oe : void 0
+	}), B = C.useState("domReferenceElement");
+	e(() => {
+		let e = B, t = L.current;
+		if (e && (L.current = e), t && e && e !== t) {
+			b.set("instantType", void 0);
+			let e = new AbortController();
+			return R(() => {
+				b.set("instantType", "trigger-change");
+			}, e.signal), () => {
+				e.abort();
+			};
+		}
+	}, [
+		B,
+		R,
+		b
+	]), he(E && k === !0 && D !== "trigger-hover", A === "touch", j, O);
+	let ee = G.useCallback((e) => {
+		b.set("positionerElement", e);
+	}, [b]), V = ce(t, {
+		open: E,
+		side: z.side,
+		align: z.align,
+		anchorHidden: z.anchorHidden,
+		instant: P
+	}, {
+		styles: z.positionerStyles,
+		transitionStatus: F,
+		props: y,
+		refs: [n, ee],
+		hidden: !T,
+		inert: !E
+	});
+	return /*#__PURE__*/ q(Q.Provider, {
+		value: z,
+		children: [T && k === !0 && D !== "trigger-hover" && /*#__PURE__*/ K(U, {
+			ref: b.context.internalBackdropRef,
+			inert: pe(!E),
+			cutout: O
+		}), /*#__PURE__*/ K(N, {
+			id: S,
+			children: V
+		})]
+	});
+});
+process.env.NODE_ENV !== "production" && (De.displayName = "PopoverPositioner");
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/utils/closePart.mjs
+var Oe = /*#__PURE__*/ G.createContext(void 0);
+process.env.NODE_ENV !== "production" && (Oe.displayName = "ClosePartContext");
+function ke() {
+	let [e, t] = G.useState(0), n = a(() => (t((e) => e + 1), () => {
+		t((e) => Math.max(0, e - 1));
+	}));
+	return {
+		context: G.useMemo(() => ({ register: n }), [n]),
+		hasClosePart: e > 0
+	};
+}
+function Ae(e) {
+	let { value: t, children: n } = e;
+	return /*#__PURE__*/ K(Oe.Provider, {
+		value: t,
+		children: n
+	});
+}
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/popup/PopoverPopup.mjs
+var je = {
+	...R,
+	...u
+}, Me = /*#__PURE__*/ G.forwardRef(function(e, t) {
+	let { render: n, className: i, style: a, initialFocus: o, finalFocus: s, ...c } = e, { store: l } = Y(), u = Ee(), d = ge(!0) != null, { context: m, hasClosePart: h } = ke(), g = l.useState("open"), _ = l.useState("openMethod"), v = l.useState("instantType"), y = l.useState("transitionStatus"), b = l.useState("popupProps"), x = l.useState("titleElementId"), S = l.useState("descriptionElementId"), C = l.useState("modal"), w = l.useState("mounted"), T = l.useState("openChangeReason"), E = l.useState("activeTriggerElement"), D = l.useState("floatingRootContext"), O = D.useState("floatingId"), k = l.useState("disabled"), A = l.useState("openOnHover"), j = l.useState("closeDelay"), M = c.id ?? O;
+	f({
+		open: g,
+		ref: l.context.popupRef,
+		onComplete() {
+			g && l.context.onOpenChangeComplete?.(!0);
+		}
+	}), ie(D, {
+		enabled: A && !k,
+		closeDelay: j
+	});
+	let N = o === void 0 ? B(l.context.popupRef) : o, P = C !== !1 && h;
+	l.useSyncedValue("focusManagerModal", P);
+	let F = G.useCallback((e) => {
+		l.set("popupElement", e);
+	}, [l]), I = r("div", e, {
+		state: {
+			open: g,
+			side: u.side,
+			align: u.align,
+			instant: v,
+			transitionStatus: y
+		},
+		ref: [
+			t,
+			l.context.popupRef,
+			F
+		],
+		props: [
+			b,
+			{
+				id: M,
+				role: "dialog",
+				...z,
+				"aria-labelledby": x,
+				"aria-describedby": S,
+				onKeyDown(e) {
+					d && fe.has(e.key) && e.stopPropagation();
+				}
+			},
+			W(y),
+			c
+		],
+		stateAttributesMapping: je
+	});
+	return /*#__PURE__*/ K(H, {
+		context: D,
+		openInteractionType: _,
+		modal: P,
+		disabled: !w || T === "trigger-hover",
+		initialFocus: N,
+		returnFocus: s,
+		restoreFocus: "popup",
+		previousFocusableElement: p(E) ? E : void 0,
+		nextFocusableElement: l.context.triggerFocusTargetRef,
+		beforeContentFocusGuardRef: l.context.beforeContentFocusGuardRef,
+		children: /*#__PURE__*/ K(Ae, {
+			value: m,
+			children: I
+		})
+	});
+});
+process.env.NODE_ENV !== "production" && (Me.displayName = "PopoverPopup");
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/title/PopoverTitle.mjs
+var Ne = /*#__PURE__*/ G.forwardRef(function(e, t) {
+	let { render: n, className: i, style: a, ...s } = e, { store: c } = Y(), l = o(s.id);
+	return c.useSyncedValueWithCleanup("titleElementId", l), r("h2", e, {
+		ref: t,
+		props: [{ id: l }, s]
+	});
+});
+process.env.NODE_ENV !== "production" && (Ne.displayName = "PopoverTitle");
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.6.0+df7f6a806acd27ca/node_modules/@base-ui/react/popover/description/PopoverDescription.mjs
+var $ = /*#__PURE__*/ G.forwardRef(function(e, t) {
+	let { render: n, className: i, style: a, ...s } = e, { store: c } = Y(), l = o(s.id);
+	return c.useSyncedValueWithCleanup("descriptionElementId", l), r("p", e, {
+		ref: t,
+		props: [{ id: l }, s]
+	});
+});
+process.env.NODE_ENV !== "production" && ($.displayName = "PopoverDescription");
+//#endregion
+//#region lib/components/ui/atoms/popover.tsx
+function Pe({ ...e }) {
+	return /* @__PURE__ */ K(Se, {
+		"data-slot": "popover",
+		...e
+	});
+}
+function Fe({ ...e }) {
+	return /* @__PURE__ */ K(we, {
+		"data-slot": "popover-trigger",
+		...e
+	});
+}
+function Ie({ className: e, align: t = "center", alignOffset: n = 0, side: r = "bottom", sideOffset: i = 4, ...a }) {
+	return /* @__PURE__ */ K(Z, { children: /* @__PURE__ */ K(De, {
+		align: t,
+		alignOffset: n,
+		className: "isolate z-50",
+		side: r,
+		sideOffset: i,
+		children: /* @__PURE__ */ K(Me, {
+			className: h("data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:fade-in-0 data-open:zoom-in-95 data-closed:fade-out-0 data-closed:zoom-out-95 z-50 flex w-72 origin-(--transform-origin) flex-col gap-4 rounded-md bg-popover p-4 text-popover-foreground text-sm shadow-md outline-hidden ring-1 ring-foreground/10 duration-100 data-closed:animate-out data-open:animate-in", e),
+			"data-slot": "popover-content",
+			...a
+		})
+	}) });
+}
+function Le({ className: e, ...t }) {
+	return /* @__PURE__ */ K("div", {
+		className: h("flex flex-col gap-1 text-sm", e),
+		"data-slot": "popover-header",
+		...t
+	});
+}
+function Re({ className: e, ...t }) {
+	return /* @__PURE__ */ K(Ne, {
+		className: h("font-medium", e),
+		"data-slot": "popover-title",
+		...t
+	});
+}
+function ze({ className: e, ...t }) {
+	return /* @__PURE__ */ K($, {
+		className: h("text-muted-foreground", e),
+		"data-slot": "popover-description",
+		...t
+	});
+}
+//#endregion
+export { Re as a, Le as i, Ie as n, Fe as o, ze as r, Pe as t };