@sakaniui/react 0.11.0 → 0.11.1

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { $ as e, A as t, At as n, B as r, C as i, Ct as a, D as o, Dt as s, E as c, Et as l, F as u, G as d, H as f, I as p, J as m, K as h, L as g, M as _, N as v, O as y, Ot as b, P as x, Q as S, R as C, S as w, St as ee, T, Tt as E, U as te, V as D, W as O, X as ne, Y as k, Z as re, _ as A, _t as ie, a as ae, at as j, b as oe, bt as M, c as se, ct as ce, d as le, dt as ue, et as de, f as fe, ft as pe, g as me, gt as N, h as he, ht as ge, i as _e, it as ve, j as ye, jt as P, k as be, kt as xe, l as Se, lt as Ce, m as we, mt as Te, n as Ee, nt as De, o as Oe, ot as ke, p as Ae, pt as je, q as Me, r as Ne, rt as Pe, s as Fe, st as Ie, t as Le, tt as Re, u as ze, ut as Be, v as Ve, w as He, wt as Ue, x as We, xt as Ge, y as Ke, yt as qe, z as Je } from "./TopBar-O_56x94F.js";
+import { $ as e, A as t, At as n, B as r, C as i, Ct as a, D as o, Dt as s, E as c, Et as l, F as u, G as d, H as f, I as p, J as m, K as h, L as g, M as _, N as v, O as y, Ot as b, P as x, Q as S, R as C, S as w, St as ee, T, Tt as E, U as te, V as D, W as O, X as k, Y as ne, Z as re, _ as A, _t as ie, a as j, at as ae, b as oe, bt as M, c as se, ct as ce, d as le, dt as ue, et as de, f as fe, ft as pe, g as me, gt as N, h as he, ht as ge, i as _e, it as ve, j as ye, jt as P, k as be, kt as xe, l as Se, lt as Ce, m as we, mt as Te, n as Ee, nt as De, o as Oe, ot as ke, p as Ae, pt as je, q as Me, r as Ne, rt as Pe, s as Fe, st as Ie, t as Le, tt as Re, u as ze, ut as Be, v as Ve, w as He, wt as Ue, x as We, xt as Ge, y as Ke, yt as qe, z as Je } from "./TopBar-O_56x94F.js";
 import { A as Ye, D as Xe, E as Ze, F as Qe, I as $e, L as et, T as tt, _ as nt, a as rt, b as it, c as at, j as ot, k as st, p as ct, u as lt, v as ut, x as dt, y as ft } from "./help-circle-B0koiJUs.js";
 import { a as pt, c as mt, i as ht, n as gt, o as _t, r as vt, s as yt, t as bt } from "./logout-BW8ksDGk.js";
 import F, { useCallback as xt, useEffect as St, useLayoutEffect as Ct, useMemo as wt, useRef as Tt, useState as I } from "react";
@@ -390,7 +390,7 @@ var Gt = {
 						onClick: l,
 						children: c
 					})]
-				}), /* @__PURE__ */ L(j, {
+				}), /* @__PURE__ */ L(ae, {
 					data: s,
 					className: B.chart
 				})]
@@ -1664,12 +1664,12 @@ var Gt = {
 		});
 		return e.observe(S.current), () => e.disconnect();
 	}, [h]);
-	let [E, te] = F.useState(t === "multi" ? [] : ""), D = l === void 0 ? E : l, O = Array.isArray(D) ? D : D ? [D] : [], [ne, k] = F.useState(() => O.map((e) => ({
+	let [E, te] = F.useState(t === "multi" ? [] : ""), D = l === void 0 ? E : l, O = Array.isArray(D) ? D : D ? [D] : [], [k, ne] = F.useState(() => O.map((e) => ({
 		value: e,
 		leaving: !1
 	}))), re = O.join("\0");
 	F.useLayoutEffect(() => {
-		k((e) => {
+		ne((e) => {
 			let t = e.map((e) => ({
 				value: e.value,
 				leaving: !O.includes(e.value)
@@ -1681,22 +1681,22 @@ var Gt = {
 			return t;
 		});
 	}, [re]);
-	let A = (e) => k((t) => t.filter((t) => !(t.value === e && t.leaving))), ie = !!a;
+	let A = (e) => ne((t) => t.filter((t) => !(t.value === e && t.leaving))), ie = !!a;
 	F.useEffect(() => {
 		let e = (e) => {
 			y.current && !y.current.contains(e.target) && m(!1);
 		};
 		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
 	}, []);
-	let ae = (e) => {
+	let j = (e) => {
 		l === void 0 && te(e), u?.(e);
-	}, j = (e) => {
+	}, ae = (e) => {
 		if (!e.disabled) if (t === "multi") {
 			let t = new Set(O);
-			t.has(e.value) ? t.delete(e.value) : t.add(e.value), ae([...t]);
-		} else ae(e.value), m(!1);
+			t.has(e.value) ? t.delete(e.value) : t.add(e.value), j([...t]);
+		} else j(e.value), m(!1);
 	}, oe = (t) => e.find((e) => e.value === t)?.label ?? t, M = O.length ? oe(O[0]) : "", se = (e) => {
-		s || (e.key === "ArrowDown" ? (e.preventDefault(), m(!0), v((e) => Math.min(e + 1, b.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), v((e) => Math.max(e - 1, 0))) : e.key === "Enter" ? (e.preventDefault(), p && b[_] ? j(b[_]) : m(!0)) : e.key === "Escape" && m(!1));
+		s || (e.key === "ArrowDown" ? (e.preventDefault(), m(!0), v((e) => Math.min(e + 1, b.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), v((e) => Math.max(e - 1, 0))) : e.key === "Enter" ? (e.preventDefault(), p && b[_] ? ae(b[_]) : m(!0)) : e.key === "Escape" && m(!1));
 	}, ce = s ? "disabled" : ie ? "error" : p ? "open" : "default";
 	return /* @__PURE__ */ R("div", {
 		className: [W.field, d ?? ""].filter(Boolean).join(" "),
@@ -1725,9 +1725,9 @@ var Gt = {
 				onClick: () => !s && m((e) => !e),
 				onKeyDown: se,
 				children: [
-					t === "multi" && ne.length > 0 && /* @__PURE__ */ L("div", {
+					t === "multi" && k.length > 0 && /* @__PURE__ */ L("div", {
 						className: W.chips,
-						children: ne.map(({ value: t, leaving: n }) => /* @__PURE__ */ R("span", {
+						children: k.map(({ value: t, leaving: n }) => /* @__PURE__ */ R("span", {
 							className: [W.chip, n ? W["chip--leaving"] : ""].filter(Boolean).join(" "),
 							"aria-hidden": n || void 0,
 							onAnimationEnd: n ? () => A(t) : void 0,
@@ -1736,14 +1736,14 @@ var Gt = {
 								className: W.chip__remove,
 								tabIndex: n ? -1 : void 0,
 								onClick: (n) => {
-									n.stopPropagation(), j(e.find((e) => e.value === t));
+									n.stopPropagation(), ae(e.find((e) => e.value === t));
 								},
 								"aria-label": `Remove ${oe(t)}`,
 								children: "×"
 							})]
 						}, t))
 					}),
-					!(t === "multi" && ne.length > 0) && /* @__PURE__ */ L("span", {
+					!(t === "multi" && k.length > 0) && /* @__PURE__ */ L("span", {
 						className: [W.control__value, t === "single" && M ? "" : W["control__value--placeholder"]].filter(Boolean).join(" "),
 						children: t === "single" && M ? M : o
 					}),
@@ -1807,7 +1807,7 @@ var Gt = {
 						onMouseEnter: () => {
 							e.disabled || v(n);
 						},
-						onClick: () => j(e),
+						onClick: () => ae(e),
 						children: [
 							t === "multi" && /* @__PURE__ */ L("span", {
 								className: [W.option__box, r ? W["option__box--checked"] : ""].filter(Boolean).join(" "),
@@ -2198,30 +2198,30 @@ var Cr = {
 		})
 	]
 }), J = {
-	map: "_map_eh5dh_2",
-	tiles: "_tiles_eh5dh_26",
-	tile: "_tile_eh5dh_26",
-	overlay: "_overlay_eh5dh_36",
-	controls: "_controls_eh5dh_40",
-	group: "_group_eh5dh_49",
-	button: "_button_eh5dh_58",
-	divider: "_divider_eh5dh_74",
-	attribution: "_attribution_eh5dh_77",
-	marker: "_marker_eh5dh_93",
-	"marker--selected": "_marker--selected_eh5dh_105",
-	"marker--pin": "_marker--pin_eh5dh_109",
-	pin: "_pin_eh5dh_110",
-	pinShadow: "_pinShadow_eh5dh_122",
-	"marker--dot": "_marker--dot_eh5dh_140",
-	"marker--cluster": "_marker--cluster_eh5dh_152",
-	clusterCount: "_clusterCount_eh5dh_165",
-	popup: "_popup_eh5dh_168",
-	"sakani-map-popup-in": "_sakani-map-popup-in_eh5dh_1",
-	popupHeader: "_popupHeader_eh5dh_189",
-	popupTitle: "_popupTitle_eh5dh_190",
-	popupClose: "_popupClose_eh5dh_191",
-	popupDescription: "_popupDescription_eh5dh_206",
-	popupPointer: "_popupPointer_eh5dh_208"
+	map: "_map_1ogus_2",
+	tiles: "_tiles_1ogus_25",
+	tile: "_tile_1ogus_25",
+	overlay: "_overlay_1ogus_37",
+	controls: "_controls_1ogus_41",
+	group: "_group_1ogus_50",
+	button: "_button_1ogus_59",
+	divider: "_divider_1ogus_75",
+	attribution: "_attribution_1ogus_78",
+	marker: "_marker_1ogus_94",
+	"marker--selected": "_marker--selected_1ogus_106",
+	"marker--pin": "_marker--pin_1ogus_110",
+	pin: "_pin_1ogus_111",
+	pinShadow: "_pinShadow_1ogus_123",
+	"marker--dot": "_marker--dot_1ogus_141",
+	"marker--cluster": "_marker--cluster_1ogus_153",
+	clusterCount: "_clusterCount_1ogus_166",
+	popup: "_popup_1ogus_169",
+	"sakani-map-popup-in": "_sakani-map-popup-in_1ogus_1",
+	popupHeader: "_popupHeader_1ogus_190",
+	popupTitle: "_popupTitle_1ogus_191",
+	popupClose: "_popupClose_1ogus_192",
+	popupDescription: "_popupDescription_1ogus_207",
+	popupPointer: "_popupPointer_1ogus_209"
 }, Tr = ({ icon: e, hovered: t, className: n, onClick: r, disabled: i, ...a }) => /* @__PURE__ */ L("button", {
 	type: "button",
 	className: [J.button, n ?? ""].filter(Boolean).join(" "),
@@ -2443,11 +2443,20 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 		zoom: X(t, n, r)
 	}), S = F.useRef(b);
 	S.current = b;
-	let C = F.useRef(0), [w, ee] = F.useState(null), T = Ge(), [E, te] = F.useState(s === "dark");
+	let C = F.useRef(0), [w, ee] = F.useState(null), [T, E] = F.useState(s === "dark");
 	F.useLayoutEffect(() => {
-		te(s === "dark" || !!_.current?.closest(".dark"));
-	}, [s, T]);
-	let D = E && !!o, O = D ? o : a;
+		let e = _.current;
+		if (!e) return;
+		let t = () => E(s === "dark" || !!e.closest(".dark"));
+		t();
+		let n = new MutationObserver(t);
+		for (let t = e; t; t = t.parentElement) n.observe(t, {
+			attributes: !0,
+			attributeFilter: ["class"]
+		});
+		return () => n.disconnect();
+	}, [s]);
+	let te = T && !!o, D = te ? o : a;
 	F.useLayoutEffect(() => {
 		let e = _.current;
 		if (!e) return;
@@ -2457,7 +2466,7 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 		}));
 		return t.observe(e), () => t.disconnect();
 	}, []);
-	let ne = F.useCallback((e) => {
+	let O = F.useCallback((e) => {
 		let t = {
 			center: e.center,
 			zoom: X(e.zoom, n, r)
@@ -2474,32 +2483,32 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 			zoom: X(e.zoom, n, r)
 		};
 		if (qr()) {
-			ne(a);
+			O(a);
 			return;
 		}
 		let o = performance.now(), s = (e) => {
 			let n = Math.min(1, (e - o) / Kr), r = 1 - (1 - n) ** 3, c = i.zoom + (a.zoom - i.zoom) * r, l;
-			if (t) l = ie(A(t, i), t, c);
+			if (t) l = A(re(t, i), t, c);
 			else {
 				let e = Z(i.center, c), t = Z(a.center, c);
 				l = Ar(e.x + (t.x - e.x) * r, e.y + (t.y - e.y) * r, c);
 			}
-			ne({
+			O({
 				center: l,
 				zoom: c
 			}), n < 1 && (C.current = requestAnimationFrame(s));
 		};
 		C.current = requestAnimationFrame(s);
 	}, [
-		ne,
+		O,
 		n,
 		r,
 		v.w,
 		v.h
-	]), re = F.useRef(!0);
+	]), ne = F.useRef(!0);
 	F.useEffect(() => {
-		if (re.current) {
-			re.current = !1;
+		if (ne.current) {
+			ne.current = !1;
 			return;
 		}
 		k({
@@ -2511,20 +2520,20 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 		e[1],
 		t
 	]), F.useEffect(() => () => cancelAnimationFrame(C.current), []);
-	let A = (e, t) => {
+	let re = (e, t) => {
 		let n = Z(t.center, t.zoom);
 		return Ar(n.x + e.x - v.w / 2, n.y + e.y - v.h / 2, t.zoom);
-	}, ie = (e, t, n) => {
+	}, A = (e, t, n) => {
 		let r = Z(e, n);
 		return Ar(r.x - (t.x - v.w / 2), r.y - (t.y - v.h / 2), n);
-	}, ae = F.useRef(null), j = (e, t) => {
+	}, ie = F.useRef(null), j = (e, t) => {
 		let n = S.current, r = Z(n.center, n.zoom);
-		ne({
+		O({
 			center: Ar(r.x - e, r.y - t, n.zoom),
 			zoom: n.zoom
 		});
-	}, oe = (e) => {
-		e.button !== 0 || e.target.closest("[data-map-ui]") || (cancelAnimationFrame(C.current), ae.current = {
+	}, ae = (e) => {
+		e.button !== 0 || e.target.closest("[data-map-ui]") || (cancelAnimationFrame(C.current), ie.current = {
 			id: e.pointerId,
 			x: e.clientX,
 			y: e.clientY,
@@ -2535,8 +2544,8 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 				t: performance.now()
 			}]
 		});
-	}, M = (e) => {
-		let t = ae.current;
+	}, oe = (e) => {
+		let t = ie.current;
 		if (!t || t.id !== e.pointerId) return;
 		let n = e.clientX - t.x, r = e.clientY - t.y;
 		!t.moved && Math.hypot(n, r) < 3 || (t.moved || (t.moved = !0, _.current?.setPointerCapture(e.pointerId)), t.x = e.clientX, t.y = e.clientY, t.samples.push({
@@ -2544,9 +2553,9 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 			y: e.clientY,
 			t: performance.now()
 		}), t.samples.length > 5 && t.samples.shift(), j(n, r));
-	}, se = () => {
-		let e = ae.current;
-		if (ae.current = null, !e || !e.moved || qr()) return;
+	}, M = () => {
+		let e = ie.current;
+		if (ie.current = null, !e || !e.moved || qr()) return;
 		let t = e.samples[0], n = e.samples[e.samples.length - 1], r = Math.max(1, n.t - t.t);
 		if (performance.now() - n.t > 80) return;
 		let i = (n.x - t.x) / r * 16, a = (n.y - t.y) / r * 16, o = () => {
@@ -2563,18 +2572,18 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 				x: t.clientX - i.left,
 				y: t.clientY - i.top
 			}, o = S.current, s = X(-t.deltaY * (t.ctrlKey ? .01 : .002), -.5, .5), c = X(o.zoom + s, n, r), l = Z(o.center, o.zoom), u = Z(Ar(l.x + a.x - i.width / 2, l.y + a.y - i.height / 2, o.zoom), c);
-			ne({
+			O({
 				center: Ar(u.x - (a.x - i.width / 2), u.y - (a.y - i.height / 2), c),
 				zoom: c
 			});
 		};
 		return e.addEventListener("wheel", t, { passive: !1 }), () => e.removeEventListener("wheel", t);
 	}, [
-		ne,
+		O,
 		n,
 		r
 	]);
-	let ce = (e) => {
+	let se = (e) => {
 		if (e.target.closest("[data-map-ui]")) return;
 		let t = _.current.getBoundingClientRect();
 		k({
@@ -2584,7 +2593,7 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 			x: e.clientX - t.left,
 			y: e.clientY - t.top
 		});
-	}, le = (e) => {
+	}, ce = (e) => {
 		if (e.target !== e.currentTarget) return;
 		let t = e.key;
 		if (t === "ArrowLeft") j(80, 0);
@@ -2601,7 +2610,7 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 		});
 		else return;
 		e.preventDefault();
-	}, ue = () => {
+	}, le = () => {
 		if (!navigator.geolocation) {
 			f?.(/* @__PURE__ */ Error("Geolocation is not supported in this browser."));
 			return;
@@ -2613,51 +2622,52 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 				zoom: Math.max(b.zoom, 14)
 			}), d?.(t);
 		}, (e) => f?.(e));
-	}, de = F.useRef(v);
-	de.current = v;
-	let fe = F.useRef(k);
-	fe.current = k;
-	let pe = F.useCallback((e, t) => {
-		fe.current({
+	}, ue = F.useRef(v);
+	ue.current = v;
+	let de = F.useRef(k);
+	de.current = k;
+	let fe = F.useCallback((e, t) => {
+		de.current({
 			center: e,
 			zoom: t ?? S.current.zoom
 		});
-	}, []), me = F.useCallback((e, t = 48) => {
+	}, []), pe = F.useCallback((e, t = 48) => {
 		if (!e.length) return;
-		let { w: n, h: r } = de.current, i = e.map((e) => e[0]), a = e.map((t) => e[0][1] + ((t[1] - e[0][1] + 540) % 360 - 180)), [o, s, c, l] = [
+		let { w: n, h: r } = ue.current, i = e.map((e) => e[0]), a = e.map((t) => e[0][1] + ((t[1] - e[0][1] + 540) % 360 - 180)), [o, s, c, l] = [
 			Math.min(...i),
 			Math.max(...i),
 			Math.min(...a),
 			Math.max(...a)
 		], u = [(o + s) / 2, kr((c + l) / 2)], d = Z([s, c], 0), f = Z([o, l], 0), p = Math.max(1e-6, Math.abs(f.x - d.x)), m = Math.max(1e-6, Math.abs(f.y - d.y)), h = Math.min(Math.log2(Math.max(1, n - t * 2) / p), Math.log2(Math.max(1, r - t * 2) / m));
-		fe.current({
+		de.current({
 			center: u,
 			zoom: e.length === 1 || !Number.isFinite(h) ? Math.max(S.current.zoom, 14) : Math.floor(h * 4) / 4
 		});
-	}, []), N = X(Math.round(b.zoom), 0, r), he = 2 ** (b.zoom - N), ge = [];
+	}, []), me = X(Math.round(b.zoom), 0, r), N = 2 ** (b.zoom - me), he = [];
 	if (v.w && v.h) {
-		let e = Z(b.center, N), t = {
-			x: v.w / 2 / he,
-			y: v.h / 2 / he
-		}, n = 2 ** N, r = Math.floor((e.x - t.x) / 256), i = Math.floor((e.x + t.x) / 256), a = Math.max(0, Math.floor((e.y - t.y) / 256)), o = Math.min(n - 1, Math.floor((e.y + t.y) / 256));
+		let e = Z(b.center, me), t = {
+			x: v.w / 2 / N,
+			y: v.h / 2 / N
+		}, n = 2 ** me, r = Math.floor((e.x - t.x) / 256), i = Math.floor((e.x + t.x) / 256), a = Math.max(0, Math.floor((e.y - t.y) / 256)), o = Math.min(n - 1, Math.floor((e.y + t.y) / 256));
 		for (let t = a; t <= o; t++) for (let a = r; a <= i; a++) {
 			let r = (a % n + n) % n;
-			ge.push({
-				key: `${N}/${a}/${t}`,
-				src: O.replace("{z}", String(N)).replace("{x}", String(r)).replace("{y}", String(t)),
-				left: (a * 256 - e.x) * he + v.w / 2,
-				top: (t * 256 - e.y) * he + v.h / 2
+			he.push({
+				key: `${me}/${a}/${t}`,
+				src: D.replace("{z}", String(me)).replace("{x}", String(r)).replace("{y}", String(t)),
+				left: (a * 256 - e.x) * N + v.w / 2,
+				top: (t * 256 - e.y) * N + v.h / 2
 			});
 		}
 	}
-	let _e = 256 * he, ve = F.useMemo(() => {
+	let ge = 256 * N, _e = F.useMemo(() => {
 		let e = Z(b.center, b.zoom), t = 256 * 2 ** b.zoom;
 		return {
 			zoom: b.zoom,
-			flyTo: pe,
-			fitBounds: me,
+			flyTo: fe,
+			fitBounds: pe,
 			maxZoom: r,
 			project: (n) => {
+				if (!v.w || !v.h) return null;
 				let r = Z(n, b.zoom), i = r.x - e.x;
 				i -= Math.round(i / t) * t;
 				let a = i + v.w / 2, o = r.y - e.y + v.h / 2;
@@ -2671,8 +2681,8 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 		b,
 		v.w,
 		v.h,
+		fe,
 		pe,
-		me,
 		r
 	]);
 	return /* @__PURE__ */ R("div", {
@@ -2682,23 +2692,23 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 			s === "dark" ? "dark" : "",
 			h ?? ""
 		].filter(Boolean).join(" "),
-		"data-own-dark-tiles": D ? "" : void 0,
+		"data-own-dark-tiles": te ? "" : void 0,
 		style: { height: p },
 		role: "region",
 		"aria-roledescription": "map",
 		"aria-label": m,
 		tabIndex: 0,
-		onPointerDown: oe,
-		onPointerMove: M,
-		onPointerUp: se,
-		onPointerCancel: se,
-		onDoubleClick: ce,
-		onKeyDown: le,
+		onPointerDown: ae,
+		onPointerMove: oe,
+		onPointerUp: M,
+		onPointerCancel: M,
+		onDoubleClick: se,
+		onKeyDown: ce,
 		children: [
 			/* @__PURE__ */ L("div", {
 				className: J.tiles,
 				"aria-hidden": "true",
-				children: ge.map((e) => /* @__PURE__ */ L("img", {
+				children: he.map((e) => /* @__PURE__ */ L("img", {
 					src: e.src,
 					alt: "",
 					draggable: !1,
@@ -2706,14 +2716,14 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 					style: {
 						left: e.left,
 						top: e.top,
-						width: _e + .5,
-						height: _e + .5
+						width: ge + .5,
+						height: ge + .5
 					},
 					onLoad: (e) => e.currentTarget.setAttribute("data-loaded", "")
 				}, e.key))
 			}),
 			/* @__PURE__ */ L(Rr.Provider, {
-				value: ve,
+				value: _e,
 				children: /* @__PURE__ */ R("div", {
 					className: J.overlay,
 					children: [g, w && /* @__PURE__ */ L(Ur, {
@@ -2726,7 +2736,7 @@ var Wr = "https://tile.openstreetmap.org/{z}/{x}/{y}.png", Gr = /* @__PURE__ */
 			(l || u) && /* @__PURE__ */ L(Er, {
 				zoom: l,
 				locate: u,
-				onLocate: ue,
+				onLocate: le,
 				zoomInDisabled: b.zoom >= r,
 				zoomOutDisabled: b.zoom <= n,
 				onZoomIn: () => k({
@@ -4027,7 +4037,7 @@ var $i = () => /* @__PURE__ */ L("svg", {
 	children: /* @__PURE__ */ L("path", { d: "M9 3L3 9M3 3l6 6" })
 });
 function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, paused: a, heights: o, setHeights: s, removeToast: c, gap: l, visibleToasts: u, yPosition: d, xPosition: f, closeButton: p, richColors: m, duration: h }) {
-	let [g, _] = I(!1), [v, y] = I(!1), [b, x] = I(!1), [S, C] = I(!1), [w, ee] = I(!1), [T, E] = I(null), [te, D] = I(0), [O, ne] = I(0), k = Tt(null), re = Tt(null), A = Tt(null), ie = Tt(0), ae = Tt(0), j = t === 0, oe = t + 1 <= u, M = e.dismissible !== !1, se = e.duration ?? h, ce = e.richColors ?? m, le = (e.closeButton ?? p) && e.type !== "loading", ue = o.findIndex((t) => t.id === e.id), de = wt(() => {
+	let [g, _] = I(!1), [v, y] = I(!1), [b, x] = I(!1), [S, C] = I(!1), [w, ee] = I(!1), [T, E] = I(null), [te, D] = I(0), [O, k] = I(0), ne = Tt(null), re = Tt(null), A = Tt(null), ie = Tt(0), j = Tt(0), ae = t === 0, oe = t + 1 <= u, M = e.dismissible !== !1, se = e.duration ?? h, ce = e.richColors ?? m, le = (e.closeButton ?? p) && e.type !== "loading", ue = o.findIndex((t) => t.id === e.id), de = wt(() => {
 		let e = o.reduce((e, t, n) => n >= ue ? e : e + t.height, 0);
 		return Math.max(0, ue) * l + e;
 	}, [
@@ -4036,12 +4046,12 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 		l
 	]), fe = Tt(de);
 	fe.current = de, Ct(() => {
-		let t = k.current;
+		let t = ne.current;
 		if (!t) return;
 		let n = t.style.height;
 		t.style.height = "auto";
 		let r = t.offsetHeight;
-		t.style.height = n, ne(r), s((t) => t.some((t) => t.id === e.id) ? t.map((t) => t.id === e.id ? {
+		t.style.height = n, k(r), s((t) => t.some((t) => t.id === e.id) ? t.map((t) => t.id === e.id ? {
 			...t,
 			height: r
 		} : t) : [{
@@ -4069,14 +4079,14 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 		v,
 		pe
 	]), St(() => {
-		ae.current = se;
+		j.current = se;
 	}, [e.version, se]), St(() => {
 		if (v || a || e.type === "loading" || se === Infinity) return;
 		let t = Date.now(), n = window.setTimeout(() => {
 			e.onAutoClose?.(e), pe();
-		}, ae.current);
+		}, j.current);
 		return () => {
-			window.clearTimeout(n), ae.current -= Date.now() - t;
+			window.clearTimeout(n), j.current -= Date.now() - t;
 		};
 	}, [
 		v,
@@ -4091,7 +4101,7 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 		let e = [d];
 		return f !== "center" && e.push(f), e;
 	}, [d, f]), he = (e, t) => {
-		k.current?.style.setProperty("--swipe-amount-x", `${e}px`), k.current?.style.setProperty("--swipe-amount-y", `${t}px`);
+		ne.current?.style.setProperty("--swipe-amount-x", `${e}px`), ne.current?.style.setProperty("--swipe-amount-y", `${t}px`);
 	}, ge = (e) => {
 		if (!(e.button === 2 || !M || v) && !e.target.closest("button")) {
 			ie.current = Date.now(), D(fe.current);
@@ -4112,7 +4122,7 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 	}, ve = () => {
 		if (w || !M || !re.current) return;
 		re.current = null;
-		let t = k.current?.style, n = parseFloat(t?.getPropertyValue("--swipe-amount-x") || "0") || 0, r = parseFloat(t?.getPropertyValue("--swipe-amount-y") || "0") || 0, i = A.current === "x" ? n : r, a = Math.abs(i) / Math.max(1, Date.now() - ie.current);
+		let t = ne.current?.style, n = parseFloat(t?.getPropertyValue("--swipe-amount-x") || "0") || 0, r = parseFloat(t?.getPropertyValue("--swipe-amount-y") || "0") || 0, i = A.current === "x" ? n : r, a = Math.abs(i) / Math.max(1, Date.now() - ie.current);
 		if ((A.current === "x" ? i < 0 && N.includes("left") || i > 0 && N.includes("right") : i < 0 && N.includes("top") || i > 0 && N.includes("bottom")) && (Math.abs(i) >= qi || a > .11)) {
 			D(fe.current), e.onDismiss?.(e), E(A.current === "x" ? n > 0 ? "right" : "left" : r > 0 ? "down" : "up"), pe(), ee(!0);
 			return;
@@ -4120,7 +4130,7 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 		he(0, 0), C(!1), x(!1), A.current = null;
 	}, ye = r || i && g, P = e.icon === null ? null : e.icon ?? /* @__PURE__ */ L(Qi, { type: e.type }), be = P !== null && (e.icon !== void 0 || e.type !== "default");
 	return /* @__PURE__ */ R("li", {
-		ref: k,
+		ref: ne,
 		tabIndex: 0,
 		role: "status",
 		"aria-live": e.important || e.type === "error" ? "assertive" : "polite",
@@ -4129,7 +4139,7 @@ function ea({ toast: e, index: t, count: n, expanded: r, expandByDefault: i, pau
 		"data-mounted": g,
 		"data-removed": v,
 		"data-visible": oe,
-		"data-front": j,
+		"data-front": ae,
 		"data-expanded": ye,
 		"data-y-position": d,
 		"data-x-position": f,
@@ -4677,4 +4687,4 @@ var va = {
 	]
 });
 //#endregion
-export { xe as Accordion, n as AccordionItem, l as ActivityFeed, s as ActivityFeedHighlight, u as Alert, Kt as Announcement, $n as AreaChart, b as Avatar, D as AvatarGroup, ee as AvatarUpload, ve as Badge, M as Balance, j as BarChart, yn as BlogBlockquote, xn as BlogFeatureText, Cn as BlogImage, O as BlogListingCard, te as BlogListingFeaturedCard, x as BoardCard, tr as BoardColumn, ye as Breadcrumb, a as Button, or as Calendar, cr as Card, t as CardMetaItem, De as CartItem, be as ChatComposer, y as Checkbox, de as CheckoutSteps, Zt as CodeSnippet, S as ColorSwatch, lr as Combobox, o as ConversationItem, Re as DEFAULT_CHECKOUT_STEPS, je as Divider, c as DonutChart, T as EmptyState, en as Expenses, Yn as FacebookIcon, f as FeaturedIcon, ur as FileUpload, He as FilterChip, Tn as FirstPageHeading, hr as FunnelChart, Vn as GithubIcon, vr as HeatmapChart, _ as HoverGroup, Ue as IconButton, rn as InlineHint, i as Input, Jn as InstagramIcon, Je as JobListing, br as Kbd, Sr as Label, w as LineChart, E as Link, Xn as LinkedinIcon, Te as LiquidBackdrop, ge as LiquidGlass, Dn as List, wr as ListItem, r as LocationDot, Jr as Map, ti as MapClusterLayer, Tr as MapControlButton, Er as MapControls, ei as MapGlobe, Ur as MapMarker, Yr as MapPopup, An as Marquee, oe as Menu, We as MenuDivider, Ke as MenuItem, Ve as MessageBubble, Mn as Metric, Pn as MobileNavigationMenu, pe as Modal, ue as NotificationItem, A as Pagination, li as PieChart, Ln as PlaceholderLogo, di as Popover, re as PriceDisplay, k as ProductCard, m as ProductGallery, zn as ProfileCard, qe as Progress, an as ProgressItem, Be as ProgressStat, Pe as QuantitySelector, xi as RadarChart, Ai as RadialChart, Mi as Radio, sn as RichSeparator, Un as RichTextHeading, Gn as RichTextParagraph, g as SectionHeading, me as SegmentedControl, he as Select, we as Sidebar, Ae as SidebarDivider, Pi as SidebarFooter, fe as SidebarGroupLabel, le as SidebarHeader, ze as SidebarItem, Se as SidebarPromo, Ii as SidebarSearch, se as SidebarSubItem, Me as SizeSelector, Fe as Skeleton, Oe as Slider, Ce as SpendingBalance, ra as Spinner, h as StarRating, ae as StatCard, oa as Stepper, ia as StepperStep, ln as StockMarket, d as StockStatus, qn as SubFeature, ha as Switch, _e as Table, Ne as Tabs, fn as Tags, p as TeamCard, _a as Textarea, gn as Ticker, ba as Toast, ta as Toaster, Ee as Tooltip, Le as TopBar, Sa as TopBarMobile, vn as Transactions, ne as WishlistButton, Bn as XIcon, e as getContrastColor, P as iconStrokeWidth, N as syncLiquidBackdrop, Gi as toast, v as useHoverHighlight, ie as useLiquidGlass, zr as useMapContext };
+export { xe as Accordion, n as AccordionItem, l as ActivityFeed, s as ActivityFeedHighlight, u as Alert, Kt as Announcement, $n as AreaChart, b as Avatar, D as AvatarGroup, ee as AvatarUpload, ve as Badge, M as Balance, ae as BarChart, yn as BlogBlockquote, xn as BlogFeatureText, Cn as BlogImage, O as BlogListingCard, te as BlogListingFeaturedCard, x as BoardCard, tr as BoardColumn, ye as Breadcrumb, a as Button, or as Calendar, cr as Card, t as CardMetaItem, De as CartItem, be as ChatComposer, y as Checkbox, de as CheckoutSteps, Zt as CodeSnippet, S as ColorSwatch, lr as Combobox, o as ConversationItem, Re as DEFAULT_CHECKOUT_STEPS, je as Divider, c as DonutChart, T as EmptyState, en as Expenses, Yn as FacebookIcon, f as FeaturedIcon, ur as FileUpload, He as FilterChip, Tn as FirstPageHeading, hr as FunnelChart, Vn as GithubIcon, vr as HeatmapChart, _ as HoverGroup, Ue as IconButton, rn as InlineHint, i as Input, Jn as InstagramIcon, Je as JobListing, br as Kbd, Sr as Label, w as LineChart, E as Link, Xn as LinkedinIcon, Te as LiquidBackdrop, ge as LiquidGlass, Dn as List, wr as ListItem, r as LocationDot, Jr as Map, ti as MapClusterLayer, Tr as MapControlButton, Er as MapControls, ei as MapGlobe, Ur as MapMarker, Yr as MapPopup, An as Marquee, oe as Menu, We as MenuDivider, Ke as MenuItem, Ve as MessageBubble, Mn as Metric, Pn as MobileNavigationMenu, pe as Modal, ue as NotificationItem, A as Pagination, li as PieChart, Ln as PlaceholderLogo, di as Popover, re as PriceDisplay, ne as ProductCard, m as ProductGallery, zn as ProfileCard, qe as Progress, an as ProgressItem, Be as ProgressStat, Pe as QuantitySelector, xi as RadarChart, Ai as RadialChart, Mi as Radio, sn as RichSeparator, Un as RichTextHeading, Gn as RichTextParagraph, g as SectionHeading, me as SegmentedControl, he as Select, we as Sidebar, Ae as SidebarDivider, Pi as SidebarFooter, fe as SidebarGroupLabel, le as SidebarHeader, ze as SidebarItem, Se as SidebarPromo, Ii as SidebarSearch, se as SidebarSubItem, Me as SizeSelector, Fe as Skeleton, Oe as Slider, Ce as SpendingBalance, ra as Spinner, h as StarRating, j as StatCard, oa as Stepper, ia as StepperStep, ln as StockMarket, d as StockStatus, qn as SubFeature, ha as Switch, _e as Table, Ne as Tabs, fn as Tags, p as TeamCard, _a as Textarea, gn as Ticker, ba as Toast, ta as Toaster, Ee as Tooltip, Le as TopBar, Sa as TopBarMobile, vn as Transactions, k as WishlistButton, Bn as XIcon, e as getContrastColor, P as iconStrokeWidth, N as syncLiquidBackdrop, Gi as toast, v as useHoverHighlight, ie as useLiquidGlass, zr as useMapContext };

package/dist/manifest.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": 6,
   "name": "@sakaniui/react",
-  "version": "0.11.0",
+  "version": "0.11.1",
   "description": "Machine-readable contract of the SakaniUI React library, generated from its TypeScript source.",
   "docs": "https://www.sakaniui.com",
   "guide": "https://www.sakaniui.com/llms-full.txt",
@@ -24,7 +24,7 @@
     "@sakaniui/react/emoji": "Fluent Emoji (full colour): EmojiName, one module each (1594 emoji, 311 with skin tones)."
   },
   "conventions": {
-    "version": "This manifest describes @sakaniui/react@0.11.0. Each component has `since`, the first release that contained it; a prop added later has its own `since`, and a value added later is listed in the prop's `valuesSince`. If the project has an older version installed, anything newer than that does not exist there.",
+    "version": "This manifest describes @sakaniui/react@0.11.1. Each component has `since`, the first release that contained it; a prop added later has its own `since`, and a value added later is listed in the prop's `valuesSince`. If the project has an older version installed, anything newer than that does not exist there.",
     "acceptsNativeProps": "Components forward native HTML attributes (className, style, aria-*, event handlers) to their root element unless a prop says otherwise; only the props that are specific to SakaniUI are listed here.",
     "accessibleName": "When `contract.requiresAccessibleName` is true, a required prop (aria-label, aria-labelledby or an alt text) is the only thing that names the control or image. Do not omit it.",
     "tokens": "Use only the token names listed under `tokens`. Colour tokens follow the theme (the `.dark` class flips them); do not hard-code colours.",
@@ -4290,7 +4290,8 @@
           "name": "tileUrlDark",
           "type": "string",
           "required": false,
-          "description": "Tiles to use in dark mode, from a provider that has a dark style. Without it the same tiles are darkened with `--map-tile-filter` (flat dark land, blue water, roads darker than the land)."
+          "description": "Tiles to use in dark mode, from a provider that has a dark style. Without it the same tiles are darkened with `--map-tile-filter` (flat dark land, blue water, roads darker than the land).",
+          "since": "0.11.1"
         },
         {
           "name": "theme",
@@ -4301,7 +4302,8 @@
             "dark"
           ],
           "default": "auto",
-          "description": "\"auto\" follows the surrounding theme (a `.dark` class on <html> or any ancestor)."
+          "description": "\"auto\" follows the surrounding theme (a `.dark` class on <html> or any ancestor).",
+          "since": "0.11.1"
         },
         {
           "name": "attribution",
@@ -4513,7 +4515,7 @@
         ],
         "requiresAccessibleName": true
       },
-      "since": "0.11.0",
+      "since": "0.11.1",
       "example": "import { MapControlButton } from '@sakaniui/react';\nimport { IconStar } from '@sakaniui/react/icons';\n\n<MapControlButton icon={IconStar} aria-label=\"Describe the action\" />",
       "aliases": [
         "map button",
@@ -4577,7 +4579,7 @@
         "requiredProps": [],
         "requiresAccessibleName": false
       },
-      "since": "0.11.0",
+      "since": "0.11.1",
       "example": "import { MapControls } from '@sakaniui/react';\n\n<MapControls />",
       "aliases": [
         "zoom controls",
@@ -4944,19 +4946,22 @@
             "dark"
           ],
           "default": "auto",
-          "description": "\"auto\" follows the surrounding theme. \"dark\" draws light dots wherever the globe sits, for a globe on a dark surface inside a light page. (The globe has no background of its own; it takes the colour behind it.)"
+          "description": "\"auto\" follows the surrounding theme. \"dark\" draws light dots wherever the globe sits, for a globe on a dark surface inside a light page. (The globe has no background of its own; it takes the colour behind it.)",
+          "since": "0.11.1"
         },
         {
           "name": "onMarkerClick",
           "type": "((index: number, marker: MapGlobeMarker) => void)",
           "required": false,
-          "description": "Called when a marker is clicked or activated from the keyboard (markers with a `label` get a hidden button)."
+          "description": "Called when a marker is clicked or activated from the keyboard (markers with a `label` get a hidden button).",
+          "since": "0.11.1"
         },
         {
           "name": "onMarkerHover",
           "type": "((index: number | null) => void)",
           "required": false,
-          "description": "Called when the pointer or keyboard focus moves onto a marker, and with null when it leaves."
+          "description": "Called when the pointer or keyboard focus moves onto a marker, and with null when it leaves.",
+          "since": "0.11.1"
         },
         {
           "name": "aria-label",
@@ -5252,7 +5257,8 @@
           "name": "hovered",
           "type": "boolean",
           "required": false,
-          "description": "Shows the hover appearance without a pointer (documentation and visual tests). Real hover works on its own."
+          "description": "Shows the hover appearance without a pointer (documentation and visual tests). Real hover works on its own.",
+          "since": "0.11.1"
         },
         {
           "name": "glide",
@@ -5560,7 +5566,8 @@
           "name": "pointer",
           "type": "boolean",
           "required": false,
-          "default": true
+          "default": true,
+          "since": "0.11.1"
         },
         {
           "name": "glide",