@slotted/react 0.1.0-beta.7 → 0.1.0-beta.9

package/dist/popover-DEp8Bf3e.js

@@ -1,495 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { r as n } from "./i18n-DpW8lqJ1.js";
-import { createControllable as r } from "@slotted/core/state";
-import { Children as i, createContext as a, isValidElement as o, useCallback as s, useContext as c, useEffect as l, useId as u, useImperativeHandle as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
-import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { createPresence as v } from "@slotted/core/presence";
-import { createPortalRoot as ee, setPortalContainer as y } from "@slotted/core/portal";
-import { createDismissableLayer as te } from "@slotted/core/dismissable-layer";
-import { createPositioner as ne } from "@slotted/core/positioner";
-import { createPortal as re } from "react-dom";
-import { popoverMessages as b } from "@slotted/core/i18n";
-//#region src/popover/popover-defaults.tsx
-var x = {
-	align: "center",
-	alignOffset: 0,
-	arrow: !0,
-	arrowPadding: 12,
-	autoFocus: !0,
-	closeOnEscape: !0,
-	closeOnOutsidePress: !0,
-	collisionPadding: 8,
-	flip: !0,
-	hideWhenDetached: !1,
-	mount: "active",
-	portal: !0,
-	shift: !0,
-	side: "bottom",
-	sideOffset: 0,
-	size: "md",
-	strategy: "absolute",
-	width: "auto"
-}, S = a(x);
-function C() {
-	return c(S);
-}
-function w({ children: e, container: t, ...n }) {
-	let r = {
-		...C(),
-		...T(n)
-	};
-	return l(() => {
-		if (t !== void 0) return y(t), () => y(null);
-	}, [t]), /* @__PURE__ */ g(S.Provider, {
-		value: r,
-		children: e
-	});
-}
-function T(e) {
-	let t = Object.entries(e).filter(([, e]) => e !== void 0);
-	return Object.fromEntries(t);
-}
-//#endregion
-//#region src/popover/popover.tsx
-var E = a(void 0), D = a({ current: void 0 });
-function ie() {
-	return c(D);
-}
-function O() {
-	let e = c(E);
-	if (e === void 0) throw Error("Every Popover part has to be inside a Popover.");
-	return e;
-}
-function k({ align: e, alignOffset: t, arrow: i, arrowPadding: a, autoFocus: o, children: c, closeOnEscape: l, closeOnOutsidePress: f, collisionPadding: h, defaultOpen: _, disabled: v, finalFocus: ee, flip: y, hideWhenDetached: te, initialFocus: ne, messages: re, mount: x, onOpenChange: S, open: w, portal: T, ref: ie, shift: O, side: k, sideOffset: A, size: j, strategy: M, width: ae }) {
-	let N = C(), P = n(b, re), F = u(), [I, L] = m(_ ?? !1), [R, z] = m(null), [B, V] = m(null), [H, U] = m(null), [W, G] = m(null), [K, q] = m(!1), [J, Y] = m(!1), X = p(void 0), Z = v === !0, Q = (w ?? I) && !Z, oe = p(Q);
-	Q && (oe.current = !0);
-	let se = p({
-		current: Q,
-		onOpenChange: S,
-		open: w
-	});
-	se.current = {
-		current: Q,
-		onOpenChange: S,
-		open: w
-	};
-	let $ = s((e, t, n) => {
-		let i = se.current;
-		if (e === i.current) return;
-		let a = !1, o = r({
-			controlled: i.open,
-			initial: i.current,
-			onRequest: (e) => {
-				a = e.cancelled, i.onOpenChange?.(e.value, e);
-			}
-		}).request(e, t, n);
-		a || o && L(e);
-	}, []);
-	d(ie, () => ({
-		close: () => $(!1, "programmatic"),
-		open: () => $(!0, "programmatic"),
-		reposition: () => X.current?.()
-	}), [$]);
-	let ce = {
-		align: e ?? N.align,
-		alignOffset: t ?? N.alignOffset,
-		anchorNode: B,
-		arrowNode: H,
-		arrowPadding: a ?? N.arrowPadding,
-		autoFocus: o ?? N.autoFocus,
-		closeOnEscape: l ?? N.closeOnEscape,
-		closeOnOutsidePress: f ?? N.closeOnOutsidePress,
-		collisionPadding: h ?? N.collisionPadding,
-		contentId: `${F}panel`,
-		contentNode: W,
-		descriptionId: `${F}description`,
-		disabled: Z,
-		finalFocus: ee,
-		flip: y ?? N.flip,
-		hasDescription: J,
-		hasTitle: K,
-		hideWhenDetached: te ?? N.hideWhenDetached,
-		initialFocus: ne,
-		mount: x ?? N.mount,
-		open: Q,
-		portal: T ?? N.portal,
-		seen: oe.current,
-		setAnchorNode: V,
-		setArrowNode: U,
-		setContentNode: G,
-		setHasDescription: Y,
-		setHasTitle: q,
-		setTriggerNode: z,
-		shift: O ?? N.shift,
-		showArrow: i ?? N.arrow,
-		side: k ?? N.side,
-		sideOffset: A ?? N.sideOffset,
-		size: j ?? N.size,
-		strategy: M ?? N.strategy,
-		t: P,
-		titleId: `${F}title`,
-		toggle: $,
-		triggerNode: R,
-		width: ae ?? N.width
-	};
-	return /* @__PURE__ */ g(E.Provider, {
-		value: ce,
-		children: /* @__PURE__ */ g(D.Provider, {
-			value: X,
-			children: c
-		})
-	});
-}
-//#endregion
-//#region src/popover/popover-parts.tsx
-function A(e, t) {
-	return (n) => {
-		e?.(n), n.defaultPrevented || t(n);
-	};
-}
-function j(e, ...t) {
-	for (let n of t) typeof n == "function" ? n(e) : n != null && (n.current = e);
-}
-function M(e, t) {
-	return e === void 0 ? null : typeof e == "string" ? t?.querySelector(e) ?? null : e instanceof Element ? e : e.current ?? null;
-}
-function ae(e, t, n, r) {
-	if (n === "center" || r === "anchor" && (t === "top" || t === "bottom")) return 0;
-	let i = Number.parseFloat(e.ownerDocument.defaultView?.getComputedStyle(e).paddingTop ?? "") || 0;
-	return n === "start" ? -i : i;
-}
-function N({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), a = (e) => {
-		i.toggle(!i.open, e.detail === 0 ? "keyboard" : "pointer", e.nativeEvent);
-	}, o = {
-		...r,
-		children: e,
-		...i.contentNode === null ? {} : { "aria-controls": i.contentId },
-		"aria-expanded": i.open,
-		"aria-haspopup": "dialog",
-		...i.open ? { "data-open": "" } : {},
-		onClick: A(r.onClick, a)
-	}, c = s((e) => {
-		i.setTriggerNode(e), j(e, t);
-	}, [t, i.setTriggerNode]);
-	return n === void 0 ? /* @__PURE__ */ g("button", {
-		type: "button",
-		...o,
-		ref: c
-	}) : n({
-		...o,
-		ref: c
-	});
-}
-function P({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), a = s((e) => {
-		i.setAnchorNode(e), j(e, t);
-	}, [t, i.setAnchorNode]), o = {
-		...r,
-		children: e
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...o,
-		ref: a
-	}) : n({
-		...o,
-		ref: a
-	});
-}
-function F({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), a = ie(), [o, c] = m(null), [u, d] = m(null), [y, b] = m("unmounted"), [x, S] = m(!1), C = p(null), w = p(i);
-	w.current = i, l(() => {
-		let e = v({
-			present: w.current.open,
-			onStatusChange: b
-		});
-		return C.current = e, b(e.status), () => {
-			e.destroy(), C.current = null;
-		};
-	}, []), l(() => {
-		C.current?.sync(i.open);
-	}, [i.open]), l(() => {
-		C.current?.setNode(o);
-	}, [o]);
-	let T = i.mount === "eager" || i.mount === "lazy" && i.seen || i.open || y !== "unmounted";
-	l(() => {
-		let e = i.triggerNode;
-		if (e === null || x) return;
-		let t = () => S(!0);
-		return e.addEventListener("focusin", t), e.addEventListener("pointerdown", t), () => {
-			e.removeEventListener("focusin", t), e.removeEventListener("pointerdown", t);
-		};
-	}, [i.triggerNode, x]);
-	let E = T || x;
-	f(() => {
-		if (!E) {
-			d(null);
-			return;
-		}
-		let e = ee({
-			origin: i.anchorNode ?? i.triggerNode,
-			disabled: !i.portal
-		});
-		return d(e.container), () => e.release();
-	}, [
-		E,
-		i.anchorNode,
-		i.portal,
-		i.triggerNode
-	]);
-	let { align: D, alignOffset: k, arrowNode: A, arrowPadding: N, collisionPadding: P, flip: F, hideWhenDetached: I, shift: L, side: R, sideOffset: z, strategy: B, width: V } = i, H = i.anchorNode ?? i.triggerNode, U = p(null), W = p(0), G = p(!1), K = s((e, t) => {
-		e.update().then(() => {
-			if (U.current !== e || !w.current.open || (t.setAttribute("data-open", ""), G.current)) return;
-			G.current = !0;
-			let n = t.ownerDocument.defaultView;
-			n !== null && w.current.autoFocus && W.current === 0 && (W.current = n.requestAnimationFrame(() => {
-				W.current = 0;
-				let { contentNode: e, initialFocus: t, open: n } = w.current;
-				n && (M(t, e) ?? e)?.focus();
-			}));
-		});
-	}, []);
-	f(() => {
-		if (o === null || H === null) return;
-		let e = ne(H, o, {
-			align: D,
-			alignOffset: k + ae(o, R, D, V),
-			boundaryPadding: P,
-			flip: F,
-			hideWhenDetached: I,
-			matchWidth: V === "anchor",
-			shift: L,
-			side: R,
-			sideOffset: z,
-			strategy: B,
-			...A ? {
-				arrow: A,
-				arrowPadding: N
-			} : {}
-		});
-		return a.current = () => void e.update(), U.current = e, w.current.open && K(e, o), () => {
-			a.current = void 0, e.destroy(), U.current = null, o.removeAttribute("data-open");
-		};
-	}, [
-		D,
-		k,
-		H,
-		A,
-		N,
-		P,
-		F,
-		I,
-		o,
-		a,
-		L,
-		R,
-		z,
-		B,
-		V,
-		K
-	]), f(() => {
-		let e = U.current;
-		if (e !== null && o !== null) {
-			if (i.open) {
-				K(e, o);
-				return;
-			}
-			o.removeAttribute("data-open"), W.current !== 0 && (o.ownerDocument.defaultView?.cancelAnimationFrame(W.current), W.current = 0);
-		}
-	}, [
-		o,
-		K,
-		i.open
-	]), l(() => {
-		if (o === null || !i.open) return;
-		let e = [i.triggerNode, i.anchorNode].filter((e) => e !== null), t = te(o, {
-			escape: i.closeOnEscape,
-			focusOutside: !1,
-			modal: !1,
-			outsidePress: i.closeOnOutsidePress,
-			scrollLock: !1,
-			...e.length > 0 ? { branches: e } : {},
-			onDismiss: (e) => {
-				w.current.toggle(!1, e.reason === "escape" ? "escape" : "outsidePress", e.source);
-			}
-		});
-		return () => t.destroy();
-	}, [
-		o,
-		i.anchorNode,
-		i.closeOnEscape,
-		i.closeOnOutsidePress,
-		i.open,
-		i.triggerNode
-	]), l(() => {
-		let { contentNode: e, finalFocus: t, open: n, triggerNode: r } = w.current;
-		if (!n && G.current) {
-			G.current = !1;
-			let n = o?.ownerDocument.activeElement ?? null;
-			if (o !== null && n !== null && !o.contains(n)) return;
-			(M(t, e) ?? r)?.focus();
-		}
-	}, [o, i.open]);
-	let q = () => {
-		let { toggle: e, triggerNode: t } = w.current;
-		e(!1, "keyboard"), t?.focus();
-	}, J = s((e) => {
-		c(e), j(e, t);
-	}, [t]);
-	if (!T || i.portal && u === null) return null;
-	let Y = /* @__PURE__ */ g("span", {
-		"aria-hidden": "true",
-		"data-part": "focus-guard",
-		onFocus: q,
-		tabIndex: 0
-	}), X = {
-		...r,
-		children: /* @__PURE__ */ _(h, { children: [
-			Y,
-			e,
-			Y
-		] }),
-		"data-align": D,
-		"data-part": "root",
-		"data-size": i.size,
-		"data-ui": "popover",
-		"data-width": i.width
-	}, Z = n === void 0 ? /* @__PURE__ */ g("div", {
-		...X,
-		ref: J
-	}) : n({
-		...X,
-		ref: J
-	});
-	return u === null ? Z : re(Z, u);
-}
-function I({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), a = s((e) => {
-		i.setContentNode(e), j(e, t);
-	}, [t, i.setContentNode]), o = {
-		...r,
-		children: e,
-		...i.hasTitle ? { "aria-labelledby": i.titleId } : {},
-		...i.hasDescription ? { "aria-describedby": i.descriptionId } : {},
-		"data-part": "content",
-		id: i.contentId,
-		role: r.role ?? "dialog",
-		tabIndex: -1
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...o,
-		ref: a
-	}) : n({
-		...o,
-		ref: a
-	});
-}
-function L({ children: e, ref: t, render: n, ...r }) {
-	let i = {
-		...r,
-		children: e,
-		"data-part": "header"
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...i,
-		ref: t
-	}) : n(i);
-}
-function R({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), { setHasTitle: a } = i;
-	l(() => (a(!0), () => a(!1)), [a]);
-	let o = {
-		...r,
-		children: e,
-		"data-part": "title",
-		id: i.titleId
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...o,
-		ref: t
-	}) : n(o);
-}
-function z({ children: e, ref: t, render: n, ...r }) {
-	let i = O(), { setHasDescription: a } = i;
-	l(() => (a(!0), () => a(!1)), [a]);
-	let o = {
-		...r,
-		children: e,
-		"data-part": "description",
-		id: i.descriptionId
-	};
-	return n === void 0 ? /* @__PURE__ */ g("p", {
-		...o,
-		ref: t
-	}) : n(o);
-}
-function B({ children: e, ref: t, render: n, ...r }) {
-	let i = {
-		...r,
-		children: e,
-		"data-part": "body"
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...i,
-		ref: t
-	}) : n(i);
-}
-function V({ children: e, ref: t, render: n, ...r }) {
-	let i = {
-		...r,
-		children: e,
-		"data-part": "footer"
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...i,
-		ref: t
-	}) : n(i);
-}
-function H({ children: n, ref: r, render: i, ...a }) {
-	let o = O(), c = p(null), [l, u] = m(null);
-	f(() => {
-		c.current !== null && u((c.current.textContent ?? "").trim() !== "");
-	});
-	let d = l ?? U(n), h = (e) => {
-		o.toggle(!1, "dismiss", e.nativeEvent);
-	}, _ = s((e) => {
-		c.current = e, j(e, r);
-	}, [r]), v = {
-		...a,
-		"aria-label": a["aria-label"] ?? (d ? void 0 : o.t("close")),
-		children: n ?? /* @__PURE__ */ g(t, {
-			size: "sm",
-			children: /* @__PURE__ */ g(e, { name: "x" })
-		}),
-		"data-part": "close",
-		onClick: A(a.onClick, h)
-	};
-	return i === void 0 ? /* @__PURE__ */ g("button", {
-		type: "button",
-		...v,
-		ref: _
-	}) : i({
-		...v,
-		ref: _
-	});
-}
-function U(e) {
-	return i.toArray(e).some((e) => typeof e == "string" || typeof e == "number" ? String(e).trim() !== "" : o(e) && U(e.props.children));
-}
-function W({ ref: e, render: t, ...n }) {
-	let r = O(), i = s((t) => {
-		r.setArrowNode(t), j(t, e);
-	}, [e, r.setArrowNode]);
-	if (!r.showArrow) return null;
-	let a = {
-		...n,
-		"aria-hidden": !0,
-		"data-part": "arrow"
-	};
-	return t === void 0 ? /* @__PURE__ */ g("div", {
-		...a,
-		ref: i
-	}) : t(a);
-}
-//#endregion
-export { I as a, L as c, N as d, k as f, C as g, w as h, H as i, F as l, x as m, W as n, z as o, O as p, B as r, V as s, P as t, R as u };