@mortenbrudvik/waveui 0.14.1 → 0.16.0

package/dist/components/feedback/Toaster.mjs

@@ -13,17 +13,19 @@ import { joinIds as m } from "../../lib/aria.mjs";
 import { usePresence as ee } from "../../hooks/usePresence.mjs";
 import { useDirection as h } from "../../hooks/useDirection.mjs";
 import { getOpenLayers as g, isInsideLayerTree as _, subscribeLayers as v } from "../../lib/layers.mjs";
-import { focusRing as te } from "../../lib/styles.mjs";
-import { Portal as y } from "../portal/Portal.mjs";
+import { focusRing as y } from "../../lib/styles.mjs";
+import { Portal as te } from "../portal/Portal.mjs";
 import { isEditableTarget as ne, isOwnEvent as re } from "../../lib/events.mjs";
 import { usePreserveFocus as ie } from "../../hooks/usePreserveFocus.mjs";
-import { StatusText as ae, getStatusLabel as b } from "./MessageBar.status.mjs";
-import { ToastContext as oe, ToasterContext as x } from "./Toast.context.mjs";
-import { ToastRoot as se } from "./Toast.root.mjs";
+import { toastMotion as b, toastStructure as ae } from "../../lib/motion.mjs";
+import { useMotionClasses as x } from "../../hooks/useMotion.mjs";
+import { StatusText as oe, getStatusLabel as se } from "./MessageBar.status.mjs";
+import { ToastContext as ce, ToasterContext as le } from "./Toast.context.mjs";
+import { ToastRoot as ue } from "./Toast.root.mjs";
 import * as S from "react";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import { jsx as C, jsxs as de } from "react/jsx-runtime";
 //#region src/components/feedback/Toaster.tsx
-function ce(e, t) {
+function fe(e, t) {
 	let n = 0, r = !1;
 	for (let t of e) t.shown ? t.dismissed || (n += 1) : r = !0;
 	return !r || n >= t ? e : e.map((e) => e.shown || n >= t ? e : (n += 1, {
@@ -31,7 +33,7 @@ function ce(e, t) {
 		shown: !0
 	}));
 }
-function T(e, t) {
+function w(e, t) {
 	let n = e.findIndex((e) => e.id === t);
 	if (n === -1) return e;
 	let r = e[n];
@@ -43,40 +45,40 @@ function T(e, t) {
 		dismissed: !0
 	}, i;
 }
-function E(e) {
+function T(e) {
 	return e.every((e) => e.shown && e.dismissed) ? e : e.filter((e) => e.shown).map((e) => e.dismissed ? e : {
 		...e,
 		dismissed: !0
 	});
 }
-function D(e) {
+function E(e) {
 	let t;
 	for (let n of e) n.shown && !n.dismissed && (!t || n.seq > t.seq) && (t = n);
 	return t;
 }
-function O(e, t) {
+function D(e, t) {
 	return e.contains(t) ? !0 : g().some((n) => {
 		let r = n.getAnchor();
 		return r !== null && e.contains(r) && _(n.id, t);
 	});
 }
-function le(e, t) {
+function pe(e, t) {
 	let n = t?.getDismissButton() ?? null;
 	return d(e).some((e) => e !== n);
 }
-function k(e) {
+function O(e) {
 	return e === void 0 ? Infinity : e >= 1 ? Math.floor(e) : 1;
 }
-var A = {
+var k = {
 	dispatchToast: (e, t) => (o(e) ? e.toastId : t?.toastId) ?? "",
 	dismissToast: () => {},
 	dismissAllToasts: () => {}
-}, j = "useToastController must be used within <Toaster>. Wrap your app (or the part of it that shows toasts) in <Toaster>: it provides the controller to its children.";
-function M() {
-	return S.useContext(x) || (t("useToastController", "<Toaster>", j), A);
+}, A = "useToastController must be used within <Toaster>. Wrap your app (or the part of it that shows toasts) in <Toaster>: it provides the controller to its children.";
+function j() {
+	return S.useContext(le) || (t("useToastController", "<Toaster>", A), k);
 }
-var ue = 5e3;
-function N(e) {
+var me = 5e3;
+function M(e) {
 	let t = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Map(), i = !1, a = !1, o = (o) => {
 		let s = t.get(o);
 		if (!s) return;
@@ -119,7 +121,7 @@ function N(e) {
 		}
 	};
 }
-var P = {
+var N = {
 	"top-start": "top-4 start-4 ms-(--wave-toaster-offset) mt-(--wave-toaster-offset-block)",
 	"top-end": "top-4 end-4 me-(--wave-toaster-offset) mt-(--wave-toaster-offset-block)",
 	"bottom-start": "bottom-4 start-4 ms-(--wave-toaster-offset) mb-(--wave-toaster-offset-block)",
@@ -128,36 +130,36 @@ var P = {
 	"top-left": "top-4 left-4 ml-(--wave-toaster-offset) mt-(--wave-toaster-offset-block)",
 	"bottom-right": "bottom-4 right-4 mr-(--wave-toaster-offset) mb-(--wave-toaster-offset-block)",
 	"bottom-left": "bottom-4 left-4 ml-(--wave-toaster-offset) mb-(--wave-toaster-offset-block)"
-}, F = 16;
-function I(e, t) {
+}, P = 16;
+function F(e, t) {
 	let n = e.slice(e.indexOf("-") + 1);
 	if (n === "right" || n === "left") return n === "right";
 	let r = l(t) === "rtl";
 	return n === "end" ? !r : r;
 }
-var L = {
+var I = {
 	inline: 0,
 	block: 0
 };
-function R() {
+function L() {
 	return g().filter((e) => e.kind === "modal" || e.kind === "dialog");
 }
-function de() {
+function R() {
 	let e = /* @__PURE__ */ new Set();
-	for (let t of R()) for (let n of t.getElements()) n?.isConnected && e.add(n);
+	for (let t of L()) for (let n of t.getElements()) n?.isConnected && e.add(n);
 	return e;
 }
-function z(e, t) {
-	let n = R();
-	if (n.length === 0) return L;
+function he(e, t) {
+	let n = L();
+	if (n.length === 0) return I;
 	let r = e.ownerDocument, i = r.defaultView;
-	if (!i) return L;
-	let a = r.documentElement.clientWidth || i.innerWidth, o = r.documentElement.clientHeight || i.innerHeight, s = I(t, e), c = t.startsWith("top"), l = (t) => a - t >= e.offsetWidth + 32, u = (t) => o - t >= e.offsetHeight + 32, d = 0, f = 0;
+	if (!i) return I;
+	let a = r.documentElement.clientWidth || i.innerWidth, o = r.documentElement.clientHeight || i.innerHeight, s = F(t, e), c = t.startsWith("top"), l = (t) => a - t >= e.offsetWidth + 32, u = (t) => o - t >= e.offsetHeight + 32, d = 0, f = 0;
 	for (let e of n) for (let t of e.getElements()) {
 		if (!t?.isConnected) continue;
 		let e = t.getBoundingClientRect();
 		if (e.width <= 0 || e.height <= 0) continue;
-		let n = s ? e.right >= a - F : e.left <= F, r = c ? e.top <= F : e.bottom >= o - F;
+		let n = s ? e.right >= a - P : e.left <= P, r = c ? e.top <= P : e.bottom >= o - P;
 		if (!n || !r) continue;
 		let i = s ? a - e.left : e.right, p = c ? e.bottom : o - e.top;
 		l(i) ? d = Math.max(d, i) : u(p) && (f = Math.max(f, p));
@@ -167,30 +169,30 @@ function z(e, t) {
 		block: f > 0 && u(f) ? Math.ceil(f) : 0
 	};
 }
-var B = 2e3;
-function V({ text: e }) {
+var z = 2e3;
+function B({ text: e }) {
 	let [t, n] = S.useState(!0);
 	return S.useEffect(() => {
-		let e = setTimeout(() => n(!1), B);
+		let e = setTimeout(() => n(!1), z);
 		return () => clearTimeout(e);
 	}, []), t ? /* @__PURE__ */ C("div", { children: e }) : null;
 }
-V.displayName = "LiveMessage";
-function H(e) {
+B.displayName = "LiveMessage";
+function V(e) {
 	return e.kind === "title";
 }
-function U(e) {
+function H(e) {
 	return e.kind === "body";
 }
-function W(e) {
+function U(e) {
 	return e.kind === "footer";
 }
-var fe = /* @__PURE__ */ new Set(/* @__PURE__ */ "a.abbr.b.bdi.bdo.cite.code.data.dfn.em.i.kbd.label.mark.q.s.samp.small.span.strong.sub.sup.time.u.var.wbr".split(".")), G = /* @__PURE__ */ new Set([
+var W = /* @__PURE__ */ new Set(/* @__PURE__ */ "a.abbr.b.bdi.bdo.cite.code.data.dfn.em.i.kbd.label.mark.q.s.samp.small.span.strong.sub.sup.time.u.var.wbr".split(".")), G = /* @__PURE__ */ new Set([
 	"noscript",
 	"script",
 	"style",
 	"template"
-]), pe = /* @__PURE__ */ new Set([
+]), ge = /* @__PURE__ */ new Set([
 	"button",
 	"img",
 	"input",
@@ -210,9 +212,9 @@ var fe = /* @__PURE__ */ new Set(/* @__PURE__ */ "a.abbr.b.bdi.bdo.cite.code.dat
 	"tab",
 	"textbox"
 ]);
-function me(e) {
+function _e(e) {
 	let t = e.getAttribute("role")?.trim().split(/\s+/)[0];
-	return t ? K.has(t) || t.startsWith("menuitem") : e.localName === "a" ? e.hasAttribute("href") : pe.has(e.localName);
+	return t ? K.has(t) || t.startsWith("menuitem") : e.localName === "a" ? e.hasAttribute("href") : ge.has(e.localName);
 }
 function q(e) {
 	return e.getAttribute("aria-hidden") === "true" || e.hasAttribute("hidden") || G.has(e.localName);
@@ -228,7 +230,7 @@ function J(e, t) {
 		let a = e;
 		if (!i && t?.(a) || q(a)) return;
 		let o = a.getAttribute("aria-label");
-		if (o && me(a)) {
+		if (o && _e(a)) {
 			n.push(` ${o} `);
 			return;
 		}
@@ -236,7 +238,7 @@ function J(e, t) {
 			n.push(` ${a.getAttribute("alt") ?? ""} `);
 			return;
 		}
-		let s = !fe.has(a.localName);
+		let s = !W.has(a.localName);
 		s && n.push(" ");
 		for (let e of Array.from(a.childNodes)) r(e, !1);
 		s && n.push(" ");
@@ -247,7 +249,7 @@ function Y(e) {
 	return !e || q(e) ? [] : Array.from(e.childNodes, (e) => e.nodeType === Node.TEXT_NODE ? (e.textContent ?? "").replace(/\s+/g, " ").trim() : e.nodeType === Node.ELEMENT_NODE ? J(e) : "").filter(Boolean);
 }
 function X(e, t, n, r) {
-	let i = t.find(H), a = t.find(U);
+	let i = t.find(V), a = t.find(H);
 	if (!i && !a) {
 		let t = n?.getDismissButton() ?? null;
 		return J(e, (e) => e === t || e.id !== "" && (e.id === r || e.id === n?.statusTextId));
@@ -257,43 +259,43 @@ function X(e, t, n, r) {
 		J(o),
 		J(a?.getElement() ?? null),
 		...c,
-		...t.filter(W).flatMap((e) => Y(e.getElement()))
+		...t.filter(U).flatMap((e) => Y(e.getElement()))
 	].filter(Boolean).join(" ");
 }
-function he({ entry: t, timers: r, onDismiss: a, onExited: o, getFocusFallback: l, announce: u, registerContainer: d }) {
-	let { id: f, dismissed: h } = t, { isMounted: g, ref: _, presenceProps: v } = ee(!h, {
+function ve({ entry: t, timers: r, onDismiss: a, onExited: o, getFocusFallback: l, announce: u, registerContainer: d, motionClassName: f }) {
+	let { id: h, dismissed: g } = t, { isMounted: _, ref: v, presenceProps: te } = ee(!g, {
 		appear: !0,
-		onExited: () => o(f)
-	}), y = S.useRef(null), x = S.useRef(null), ce = S.useCallback((e) => {
-		y.current = e, e && (x.current = e), d(f, e);
-	}, [f, d]), T = p(ce, _);
-	ie(y, () => l(x.current), { enabled: !h });
-	let E = c("wave-toast-title"), D = c("wave-toast-status"), [O, k] = S.useState([]), A = S.useRef([]), j = S.useCallback((e) => (A.current = [...A.current, e], k(A.current), () => {
-		A.current = A.current.filter((t) => t !== e), k(A.current);
-	}), []), [M, N] = S.useState(null), P = S.useRef(null), F = S.useCallback((e) => (P.current = e, N(e), () => {
-		P.current === e && (P.current = null, N(null));
-	}), []), I = s(() => {
-		P.current?.onDismiss?.(), a(f);
-	}), L = S.useMemo(() => ({
-		titleId: E,
-		dismiss: I,
-		registerPart: j,
-		registerToast: F
+		onExited: () => o(h)
+	}), b = S.useRef(null), x = S.useRef(null), le = S.useCallback((e) => {
+		b.current = e, e && (x.current = e), d(h, e);
+	}, [h, d]), fe = p(le, v);
+	ie(b, () => l(x.current), { enabled: !g });
+	let w = c("wave-toast-title"), T = c("wave-toast-status"), [E, D] = S.useState([]), O = S.useRef([]), k = S.useCallback((e) => (O.current = [...O.current, e], D(O.current), () => {
+		O.current = O.current.filter((t) => t !== e), D(O.current);
+	}), []), [A, j] = S.useState(null), M = S.useRef(null), N = S.useCallback((e) => (M.current = e, j(e), () => {
+		M.current === e && (M.current = null, j(null));
+	}), []), P = s(() => {
+		M.current?.onDismiss?.(), a(h);
+	}), F = S.useMemo(() => ({
+		titleId: w,
+		dismiss: P,
+		registerPart: k,
+		registerToast: N
 	}), [
-		E,
-		I,
-		j,
-		F
-	]), R = O.find(H), de = O.find(U), z = t.form === "content" && M === null ? b(t.options.status ?? "info", t.options.statusLabel) : "", B = M ? M.statusTextId : z ? D : void 0;
+		w,
+		P,
+		k,
+		N
+	]), I = E.find(V), L = E.find(H), R = t.form === "content" && A === null ? se(t.options.status ?? "info", t.options.statusLabel) : "", he = A ? A.statusTextId : R ? T : void 0;
 	S.useLayoutEffect(() => {
-		let e = y.current;
+		let e = b.current;
 		if (t.dismissed || !e) return;
-		let n = t.options.timeout ?? (le(e, P.current) ? 0 : ue);
+		let n = t.options.timeout ?? (pe(e, M.current) ? 0 : me);
 		r.start(t.id, t.seq, n);
 	}, [t, r]), S.useLayoutEffect(() => {
-		let e = y.current;
+		let e = b.current;
 		if (t.dismissed || !e) return;
-		let n = P.current, r = n?.status ?? t.options.status ?? "info", i = n ? n.statusLabel : b(r, t.options.statusLabel), a = t.form === "content" && t.options.announcement !== void 0 ? t.options.announcement : X(e, A.current, n, D);
+		let n = M.current, r = n?.status ?? t.options.status ?? "info", i = n ? n.statusLabel : se(r, t.options.statusLabel), a = t.form === "content" && t.options.announcement !== void 0 ? t.options.announcement : X(e, O.current, n, T);
 		u(t.id, {
 			seq: t.seq,
 			text: [i, a].filter(Boolean).join(" "),
@@ -302,65 +304,68 @@ function he({ entry: t, timers: r, onDismiss: a, onExited: o, getFocusFallback:
 	}, [
 		t,
 		u,
-		D,
-		M
+		T,
+		A
 	]);
-	let V = t.form === "content" ? t.options.status : void 0;
+	let z = t.form === "content" ? t.options.status : void 0;
 	S.useEffect(() => {
-		let e = P.current?.status;
-		V !== void 0 && e !== void 0 && V !== e && n("Toaster:status-conflict", `Toaster: the dispatched Toast has status "${e}" but the dispatch options pass "${V}"; the Toast's status is used. Remove \`status\` from the options.`);
+		let e = M.current?.status;
+		z !== void 0 && e !== void 0 && z !== e && n("Toaster:status-conflict", `Toaster: the dispatched Toast has status "${e}" but the dispatch options pass "${z}"; the Toast's status is used. Remove \`status\` from the options.`);
 	}, [
 		t,
-		V,
-		M
+		z,
+		A
 	]);
-	let W = (e) => {
-		(e.key === "Delete" || e.key === "Backspace") && (e.defaultPrevented || !re(e) || ne(e.target) || (e.preventDefault(), a(f)));
+	let B = (e) => {
+		(e.key === "Delete" || e.key === "Backspace") && (e.defaultPrevented || !re(e) || ne(e.target) || (e.preventDefault(), a(h)));
 	};
-	return g ? /* @__PURE__ */ w("div", {
-		ref: T,
+	return _ ? /* @__PURE__ */ C("div", {
+		ref: fe,
 		role: "group",
 		tabIndex: -1,
 		"data-wave-toast": "",
-		"aria-labelledby": m(B, R?.id),
-		"aria-describedby": de?.id,
-		className: e(i.toast, "rounded", te),
-		...v,
-		onKeyDown: W,
-		children: [z ? /* @__PURE__ */ C(ae, {
-			label: z,
-			id: D
-		}) : null, /* @__PURE__ */ C(oe.Provider, {
-			value: L,
-			children: t.form === "options" ? /* @__PURE__ */ C(se, {
-				status: t.options.status,
-				statusLabel: t.options.statusLabel,
-				title: t.options.title,
-				dismissLabel: t.options.dismissLabel,
-				children: t.options.body
-			}) : t.content
-		})]
+		"aria-labelledby": m(he, I?.id),
+		"aria-describedby": L?.id,
+		className: e(i.toast, "rounded", y, ae, f),
+		...te,
+		onKeyDown: B,
+		children: /* @__PURE__ */ de("div", {
+			className: i.toastContent,
+			children: [R ? /* @__PURE__ */ C(oe, {
+				label: R,
+				id: T
+			}) : null, /* @__PURE__ */ C(ce.Provider, {
+				value: F,
+				children: t.form === "options" ? /* @__PURE__ */ C(ue, {
+					status: t.options.status,
+					statusLabel: t.options.statusLabel,
+					title: t.options.title,
+					dismissLabel: t.options.dismissLabel,
+					children: t.options.body
+				}) : t.content
+			})]
+		})
 	}) : null;
 }
-he.displayName = "ToastContainer";
-var Z = ({ position: t = "bottom-end", limit: l, shortcuts: d, toaster: m, className: ee, style: _, children: te, onFocus: ne, onBlur: ie, onKeyDown: ae, onPointerEnter: b, onPointerLeave: oe, onPointerOver: se, ref: le, ...A }) => {
-	let [j, M] = S.useState([]), [ue, F] = S.useState(() => /* @__PURE__ */ new Map()), I = S.useCallback((e, t) => {
-		F((n) => {
+ve.displayName = "ToastContainer";
+var Z = ({ position: t = "bottom-end", limit: l, shortcuts: d, toaster: m, motion: ee, className: _, style: y, children: ne, onFocus: ie, onBlur: ae, onKeyDown: oe, onPointerEnter: se, onPointerLeave: ce, onPointerOver: ue, ref: pe, ...k }) => {
+	let [A, j] = S.useState([]), [me, P] = S.useState(() => /* @__PURE__ */ new Map()), F = S.useCallback((e, t) => {
+		P((n) => {
 			let r = n.get(e);
 			if (r && r.seq === t.seq && r.text === t.text && r.assertive === t.assertive) return n;
 			let i = new Map(n);
 			return i.set(e, t), i;
 		});
-	}, []), R = ce(j, k(l));
-	R !== j && M(R);
-	let B = R.filter((e) => e.shown);
+	}, []), L = O(l), z = x(ee, b[t.startsWith("top") ? "top" : "bottom"]), V = fe(A, L);
+	V !== A && j(V);
+	let H = V.filter((e) => e.shown);
 	S.useEffect(() => {
 		l !== void 0 && !(l >= 1) && n("Toaster:limit", `Toaster: \`limit\` must be 1 or more (got ${String(l)}); it counts as 1.`);
 	}, [l]);
-	let H = c("toast"), U = S.useRef(0), W = S.useRef(null), fe = p(le, W), G = S.useRef(null), pe = h(), [K, me] = S.useState(L);
+	let U = c("toast"), W = S.useRef(0), G = S.useRef(null), ge = p(pe, G), K = S.useRef(null), _e = h(), [q, J] = S.useState(I);
 	S.useLayoutEffect(() => {
 		let e = null, n = null, r = null, i = /* @__PURE__ */ new Set(), a = () => {
-			let t = de();
+			let t = R();
 			for (let n of i) t.has(n) || e?.unobserve(n);
 			for (let n of t) i.has(n) || e?.observe(n);
 			let r = t.size !== i.size || [...t].some((e) => !i.has(e));
@@ -372,39 +377,39 @@ var Z = ({ position: t = "bottom-end", limit: l, shortcuts: d, toaster: m, class
 				});
 			}
 		}, o = () => {
-			let n = W.current;
+			let n = G.current;
 			e && n !== r && (r && e.unobserve(r), n && e.observe(n), r = n), a();
-			let i = n ? z(n, t) : L;
-			me((e) => e.inline === i.inline && e.block === i.block ? e : i);
+			let i = n ? he(n, t) : I;
+			J((e) => e.inline === i.inline && e.block === i.block ? e : i);
 		};
 		typeof ResizeObserver < "u" && (e = new ResizeObserver(() => o())), typeof MutationObserver < "u" && (n = new MutationObserver(o)), o();
 		let s = v(o);
 		return window.addEventListener("resize", o), document.addEventListener("transitionend", o, !0), document.addEventListener("animationend", o, !0), () => {
 			s(), e?.disconnect(), n?.disconnect(), window.removeEventListener("resize", o), document.removeEventListener("transitionend", o, !0), document.removeEventListener("animationend", o, !0);
 		};
-	}, [t, pe]);
-	let [q] = S.useState(() => N((e) => M((t) => T(t, e))));
+	}, [t, _e]);
+	let [Y] = S.useState(() => M((e) => j((t) => w(t, e))));
 	S.useEffect(() => {
-		let e = document, t = !1, n = () => q.setInBackground(t || e.visibilityState === "hidden"), r = (e) => {
+		let e = document, t = !1, n = () => Y.setInBackground(t || e.visibilityState === "hidden"), r = (e) => {
 			e.target instanceof Node || (t = !0, n());
 		}, i = (e) => {
 			e.target instanceof Node || (t = !1, n());
 		};
-		return n(), q.setSuspended(!1), window.addEventListener("blur", r), window.addEventListener("focus", i), e.addEventListener("visibilitychange", n), () => {
-			window.removeEventListener("blur", r), window.removeEventListener("focus", i), e.removeEventListener("visibilitychange", n), q.setSuspended(!0);
+		return n(), Y.setSuspended(!1), window.addEventListener("blur", r), window.addEventListener("focus", i), e.addEventListener("visibilitychange", n), () => {
+			window.removeEventListener("blur", r), window.removeEventListener("focus", i), e.removeEventListener("visibilitychange", n), Y.setSuspended(!0);
 		};
-	}, [q]);
-	let J = S.useCallback((e, t) => {
-		U.current += 1;
-		let n = U.current, r = o(e) ? {
+	}, [Y]);
+	let X = S.useCallback((e, t) => {
+		W.current += 1;
+		let n = W.current, r = o(e) ? {
 			form: "options",
 			options: e
 		} : {
 			form: "content",
 			content: e,
 			options: t ?? {}
-		}, i = r.options.toastId ?? `${H}-${n}`;
-		return M((e) => {
+		}, i = r.options.toastId ?? `${U}-${n}`;
+		return j((e) => {
 			let t = e.findIndex((e) => e.id === i), a = t !== -1 && e[t].shown, o = {
 				...r,
 				id: i,
@@ -416,173 +421,174 @@ var Z = ({ position: t = "bottom-end", limit: l, shortcuts: d, toaster: m, class
 			let s = e.slice();
 			return s[t] = o, s;
 		}), i;
-	}, [H]), Y = S.useCallback((e) => {
-		q.remove(e), M((t) => T(t, e));
-	}, [q]), X = S.useCallback(() => {
-		q.clear(), M((e) => E(e));
-	}, [q]), Z = S.useCallback((e) => {
-		M((t) => t.some((t) => t.id === e && t.dismissed) ? t.filter((t) => !(t.id === e && t.dismissed)) : t), F((t) => {
+	}, [U]), Z = S.useCallback((e) => {
+		Y.remove(e), j((t) => w(t, e));
+	}, [Y]), ye = S.useCallback(() => {
+		Y.clear(), j((e) => T(e));
+	}, [Y]), be = S.useCallback((e) => {
+		j((t) => t.some((t) => t.id === e && t.dismissed) ? t.filter((t) => !(t.id === e && t.dismissed)) : t), P((t) => {
 			if (!t.has(e)) return t;
 			let n = new Map(t);
 			return n.delete(e), n;
 		});
-	}, []), Q = S.useMemo(() => ({
-		dispatchToast: J,
-		dismissToast: Y,
-		dismissAllToasts: X
+	}, []), xe = S.useMemo(() => ({
+		dispatchToast: X,
+		dismissToast: Z,
+		dismissAllToasts: ye
 	}), [
-		J,
-		Y,
-		X
-	]), [ge] = S.useState(() => ({}));
+		X,
+		Z,
+		ye
+	]), [Se] = S.useState(() => ({}));
 	S.useLayoutEffect(() => {
 		if (!m) return;
-		let e = a(m, ge, Q);
+		let e = a(m, Se, xe);
 		if (e.status === "bound") return e.unbind;
 		e.status === "taken" ? n("Toaster:handle-bound", "Toaster: this handle is already bound to another Toaster; a handle binds one Toaster. Create one handle per Toaster.") : n("Toaster:handle-unknown", "Toaster: `toaster` is not a handle from createToaster(), so nothing is bound. Pass the value createToaster() returns.");
 	}, [
 		m,
-		ge,
-		Q
+		Se,
+		xe
 	]);
-	let _e = S.useCallback((e) => {
-		let t = W.current, n = t ? Array.from(t.children).filter((e) => e instanceof HTMLElement && e.hasAttribute("data-wave-toast")) : [], r = !!e && e.ownerDocument.activeElement === e, i = e ? n.indexOf(e) : -1, a = (t) => t !== e && t.isConnected && t.getAttribute("data-presence") !== "exiting", o = n.slice(i + 1).find(a), s = i > 0 ? n.slice(0, i).reverse().find(a) : void 0;
+	let Ce = S.useCallback((e) => {
+		let t = G.current, n = t ? Array.from(t.children).filter((e) => e instanceof HTMLElement && e.hasAttribute("data-wave-toast")) : [], r = !!e && e.ownerDocument.activeElement === e, i = e ? n.indexOf(e) : -1, a = (t) => t !== e && t.isConnected && t.getAttribute("data-presence") !== "exiting", o = n.slice(i + 1).find(a), s = i > 0 ? n.slice(0, i).reverse().find(a) : void 0;
 		for (let e of [o, s]) {
 			if (!e) continue;
 			let t = r ? e : u(e);
 			if (t) return t;
 		}
-		let c = G.current;
-		return G.current = null, c?.isConnected ? c : null;
-	}, []), $ = s(() => {
-		let e = W.current;
+		let c = K.current;
+		return K.current = null, c?.isConnected ? c : null;
+	}, []), Q = s(() => {
+		let e = G.current;
 		if (!e) return;
 		let t = e.ownerDocument;
 		if (t.activeElement && t.activeElement !== t.body) return;
-		let n = q.isPaused("focus");
-		q.setPaused("focus", !1);
-		let r = G.current;
-		G.current = null, n && r && f(r) && r.focus({ preventScroll: !0 });
+		let n = Y.isPaused("focus");
+		Y.setPaused("focus", !1);
+		let r = K.current;
+		K.current = null, n && r && f(r) && r.focus({ preventScroll: !0 });
 	});
 	S.useLayoutEffect(() => {
-		$();
-	}, [R, $]), S.useLayoutEffect(() => v(() => queueMicrotask($)), [$]);
-	let ve = S.useRef(null);
+		Q();
+	}, [V, Q]), S.useLayoutEffect(() => v(() => queueMicrotask(Q)), [Q]);
+	let we = S.useRef(null);
 	S.useEffect(() => {
 		let e = (e) => {
-			let t = ve.current === e;
-			if (ve.current = null, t || !q.isPaused("hover")) return;
-			let n = W.current;
-			n && e.target instanceof Node && O(n, e.target) || q.setPaused("hover", !1);
+			let t = we.current === e;
+			if (we.current = null, t || !Y.isPaused("hover")) return;
+			let n = G.current;
+			n && e.target instanceof Node && D(n, e.target) || Y.setPaused("hover", !1);
 		};
 		return document.addEventListener("pointerover", e), () => document.removeEventListener("pointerover", e);
-	}, [q]);
-	let ye = S.useRef(R);
+	}, [Y]);
+	let Te = S.useRef(V);
 	S.useLayoutEffect(() => {
-		ye.current = R;
+		Te.current = V;
 	});
-	let be = S.useRef(/* @__PURE__ */ new Map()), xe = S.useCallback((e, t) => {
-		t ? be.current.set(e, t) : be.current.delete(e);
-	}, []), Se = typeof d?.focus == "function", Ce = s((e) => {
+	let $ = S.useRef(/* @__PURE__ */ new Map()), Ee = S.useCallback((e, t) => {
+		t ? $.current.set(e, t) : $.current.delete(e);
+	}, []), De = typeof d?.focus == "function", Oe = s((e) => {
 		if (e.defaultPrevented || e.isComposing || !d?.focus?.(e)) return;
-		let t = D(ye.current), n = t ? be.current.get(t.id) : void 0;
+		let t = E(Te.current), n = t ? $.current.get(t.id) : void 0;
 		if (!n?.isConnected) return;
 		e.preventDefault();
-		let r = W.current, i = n.ownerDocument.activeElement;
-		i instanceof HTMLElement && i !== n.ownerDocument.body && !(r && O(r, i)) && (G.current = i), n.focus({ preventScroll: !1 });
+		let r = G.current, i = n.ownerDocument.activeElement;
+		i instanceof HTMLElement && i !== n.ownerDocument.body && !(r && D(r, i)) && (K.current = i), n.focus({ preventScroll: !1 });
 	});
 	S.useEffect(() => {
-		if (!Se) return;
-		let e = (e) => Ce(e);
+		if (!De) return;
+		let e = (e) => Oe(e);
 		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-	}, [Se, Ce]);
-	let we = (e) => {
+	}, [De, Oe]);
+	let ke = (e) => {
 		let t = e.relatedTarget;
-		t instanceof HTMLElement && f(t) && (O(e.currentTarget, t) || (G.current = t));
-	}, Te = (e) => {
+		t instanceof HTMLElement && f(t) && (D(e.currentTarget, t) || (K.current = t));
+	}, Ae = (e) => {
 		let t = e.currentTarget, n = e.relatedTarget;
-		if (!(n instanceof Node && O(t, n)) && !e.target.closest("[data-wave-toast][data-presence=\"exiting\"]")) {
+		if (!(n instanceof Node && D(t, n)) && !e.target.closest("[data-wave-toast][data-presence=\"exiting\"]")) {
 			if (n === null) {
 				let n = e.target;
 				if (!n.isConnected) return;
 				let r = n.ownerDocument.activeElement;
-				if (r && O(t, r)) return;
+				if (r && D(t, r)) return;
 			}
-			G.current = null;
+			K.current = null;
 		}
-	}, Ee = (e) => {
+	}, je = (e) => {
 		if (e.key !== "Escape" && e.key !== "Esc" || e.defaultPrevented || e.nativeEvent.isComposing || !re(e)) return;
 		let t = e.currentTarget;
 		if (g().some((e) => e.escape && t.contains(e.getAnchor()))) return;
 		e.preventDefault();
-		let n = G.current;
-		G.current = null, n?.isConnected && n.focus({ preventScroll: !0 }), X();
-	}, De = [], Oe = [];
-	for (let e of B) {
+		let n = K.current;
+		K.current = null, n?.isConnected && n.focus({ preventScroll: !0 }), ye();
+	}, Me = [], Ne = [];
+	for (let e of H) {
 		if (e.dismissed) continue;
-		let t = ue.get(e.id);
+		let t = me.get(e.id);
 		if (!t || t.seq !== e.seq || !t.text) continue;
-		let n = /* @__PURE__ */ C(V, { text: t.text }, t.seq);
-		(t.assertive ? Oe : De).push(n);
+		let n = /* @__PURE__ */ C(B, { text: t.text }, t.seq);
+		(t.assertive ? Ne : Me).push(n);
 	}
-	let ke = K.inline > 0 || K.block > 0 ? {
-		..._,
-		...K.inline > 0 && { "--wave-toaster-offset": `${K.inline}px` },
-		...K.block > 0 && { "--wave-toaster-offset-block": `${K.block}px` }
-	} : _;
-	return /* @__PURE__ */ w(x.Provider, {
-		value: Q,
-		children: [te, /* @__PURE__ */ C(y, {
+	let Pe = q.inline > 0 || q.block > 0 ? {
+		...y,
+		...q.inline > 0 && { "--wave-toaster-offset": `${q.inline}px` },
+		...q.block > 0 && { "--wave-toaster-offset-block": `${q.block}px` }
+	} : y;
+	return /* @__PURE__ */ de(le.Provider, {
+		value: xe,
+		children: [ne, /* @__PURE__ */ C(te, {
 			layer: "toast",
-			children: /* @__PURE__ */ w("div", {
-				ref: fe,
+			children: /* @__PURE__ */ de("div", {
+				ref: ge,
 				role: "region",
 				"aria-label": "Notifications",
 				"data-wave-focus-trap-allow": "",
 				"data-position": t,
-				...A,
-				style: ke,
+				...k,
+				style: Pe,
 				onFocus: (e) => {
-					ne?.(e), we(e), q.setPaused("focus", !0);
+					ie?.(e), ke(e), Y.setPaused("focus", !0);
 				},
 				onBlur: (e) => {
-					ie?.(e), Te(e);
+					ae?.(e), Ae(e);
 					let t = e.relatedTarget;
-					t instanceof Node && O(e.currentTarget, t) || q.setPaused("focus", !1);
+					t instanceof Node && D(e.currentTarget, t) || Y.setPaused("focus", !1);
 				},
 				onPointerEnter: (e) => {
-					b?.(e), q.setPaused("hover", !0);
+					se?.(e), Y.setPaused("hover", !0);
 				},
 				onPointerLeave: (e) => {
-					oe?.(e), q.setPaused("hover", !1);
+					ce?.(e), Y.setPaused("hover", !1);
 				},
 				onPointerOver: (e) => {
-					se?.(e), ve.current = e.nativeEvent;
+					ue?.(e), we.current = e.nativeEvent;
 				},
-				onKeyDown: (e) => r(ae, Ee)(e),
-				className: e(i.root, "fixed flex w-80 max-w-[calc(100vw-2rem)] flex-col gap-2", P[t], ee),
+				onKeyDown: (e) => r(oe, je)(e),
+				className: e(i.root, "fixed flex w-80 max-w-[calc(100vw-2rem)] flex-col gap-2", N[t], _),
 				children: [
 					/* @__PURE__ */ C("div", {
 						role: "status",
 						"aria-live": "polite",
 						"aria-atomic": "false",
 						className: "sr-only",
-						children: De
+						children: Me
 					}),
 					/* @__PURE__ */ C("div", {
 						"aria-live": "assertive",
 						"aria-atomic": "false",
 						className: "sr-only",
-						children: Oe
+						children: Ne
 					}),
-					B.map((e) => /* @__PURE__ */ C(he, {
+					H.map((e) => /* @__PURE__ */ C(ve, {
 						entry: e,
-						timers: q,
-						onDismiss: Y,
-						onExited: Z,
-						getFocusFallback: _e,
-						announce: I,
-						registerContainer: xe
+						timers: Y,
+						onDismiss: Z,
+						onExited: be,
+						getFocusFallback: Ce,
+						announce: F,
+						registerContainer: Ee,
+						motionClassName: z
 					}, e.id))
 				]
 			})
@@ -591,6 +597,6 @@ var Z = ({ position: t = "bottom-end", limit: l, shortcuts: d, toaster: m, class
 };
 Z.displayName = "Toaster";
 //#endregion
-export { Z as Toaster, M as useToastController };
+export { Z as Toaster, j as useToastController };
 
 //# sourceMappingURL=Toaster.mjs.map