@slotted/react 0.1.0-beta.2 → 0.1.0-beta.4

package/dist/popover-DE22lSpV.js

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