@pixelmatters/markup 1.6.1 → 1.7.0

package/dist/widget.js

@@ -2943,19 +2943,31 @@ function Wr() {
 		name: e?.name,
 		email: e?.email
 	};
-	return e ? e.isVerified && typeof e.clientId == "string" && typeof e.token == "string" && typeof e.tokenExpiresAt == "number" && typeof e.name == "string" && e.tokenExpiresAt > Date.now() ? {
-		state: {
-			kind: "verified",
-			identity: {
-				clientId: e.clientId,
-				token: e.token,
-				tokenExpiresAt: e.tokenExpiresAt,
-				name: e.name,
-				email: e.email
-			}
-		},
+	if (!e) return {
+		state: { kind: "unresolved" },
 		preserved: t
-	} : typeof e.clientId == "string" && typeof e.anonToken == "string" ? {
+	};
+	if (e.isVerified && typeof e.clientId == "string" && typeof e.token == "string" && typeof e.tokenExpiresAt == "number" && typeof e.name == "string") {
+		let n = e.tokenExpiresAt > Date.now(), r = typeof e.refreshToken == "string" && typeof e.refreshTokenExpiresAt == "number" && e.refreshTokenExpiresAt > Date.now();
+		if (n || r) return {
+			state: {
+				kind: "verified",
+				identity: {
+					clientId: e.clientId,
+					token: e.token,
+					tokenExpiresAt: e.tokenExpiresAt,
+					...r ? {
+						refreshToken: e.refreshToken,
+						refreshTokenExpiresAt: e.refreshTokenExpiresAt
+					} : {},
+					name: e.name,
+					email: e.email
+				}
+			},
+			preserved: t
+		};
+	}
+	return typeof e.clientId == "string" && typeof e.anonToken == "string" ? {
 		state: {
 			kind: "anon",
 			identity: {
@@ -2969,9 +2981,6 @@ function Wr() {
 	} : {
 		state: { kind: "unresolved" },
 		preserved: t
-	} : {
-		state: { kind: "unresolved" },
-		preserved: t
 	};
 }
 function Gr(e) {
@@ -2981,6 +2990,8 @@ function Gr(e) {
 				clientId: e.identity.clientId,
 				token: e.identity.token,
 				tokenExpiresAt: e.identity.tokenExpiresAt,
+				refreshToken: e.identity.refreshToken,
+				refreshTokenExpiresAt: e.identity.refreshTokenExpiresAt,
 				isVerified: !0,
 				name: e.identity.name,
 				email: e.identity.email
@@ -3039,7 +3050,7 @@ async function Yr(e, t) {
 		});
 		if (!n.ok) throw Error(`popup-exchange responded with ${n.status}`);
 		let { code: i } = await n.json(), a = new URL("/widget/auth", e);
-		a.searchParams.set("code", i), r = a.toString();
+		a.searchParams.set("code", i), a.searchParams.set("capabilities", "refresh"), r = a.toString();
 	} catch (e) {
 		return Promise.reject(e instanceof Error ? e : /* @__PURE__ */ Error("Failed to start popup exchange"));
 	}
@@ -3054,7 +3065,9 @@ async function Yr(e, t) {
 			a?.type === "MARKUP_AUTH_RESULT" && (r(), a.identity?.id && a.identity?.name ? e({
 				identity: a.identity,
 				token: typeof a.token == "string" ? a.token : null,
-				tokenExpiresAt: typeof a.tokenExpiresAt == "number" ? a.tokenExpiresAt : null
+				tokenExpiresAt: typeof a.tokenExpiresAt == "number" ? a.tokenExpiresAt : null,
+				refreshToken: typeof a.refreshToken == "string" ? a.refreshToken : null,
+				refreshTokenExpiresAt: typeof a.refreshTokenExpiresAt == "number" ? a.refreshTokenExpiresAt : null
 			}) : t(/* @__PURE__ */ Error("Sign-in cancelled")));
 		}
 		let a = window.setInterval(() => {
@@ -3652,13 +3665,83 @@ function Oa(e) {
 	}, [e, n]), t.kind === "active" ? t.token : null;
 }
 //#endregion
+//#region src/runtime/refresh-token.ts
+async function ka(e) {
+	try {
+		let t = await fetch(`${e.apiUrl.replace(/\/+$/, "")}/widget/refresh`, {
+			method: "POST",
+			headers: {
+				"content-type": "application/json",
+				"x-markup-api-key": e.apiKey
+			},
+			body: JSON.stringify({ refreshToken: e.refreshToken }),
+			signal: e.signal
+		});
+		if (!t.ok) return null;
+		let n = await t.json();
+		return typeof n.accessToken != "string" || typeof n.accessTokenExpiresAt != "number" || typeof n.refreshToken != "string" || typeof n.refreshTokenExpiresAt != "number" ? null : {
+			accessToken: n.accessToken,
+			accessTokenExpiresAt: n.accessTokenExpiresAt,
+			refreshToken: n.refreshToken,
+			refreshTokenExpiresAt: n.refreshTokenExpiresAt
+		};
+	} catch {
+		return null;
+	}
+}
+//#endregion
+//#region src/runtime/use-token-refresh.ts
+var Aa = 6e4, ja = 500;
+function Ma(e, t, n, r, i) {
+	let a = e.kind === "verified", o = a ? e.identity.refreshToken : void 0, s = a ? e.identity.refreshTokenExpiresAt : void 0, c = a ? e.identity.tokenExpiresAt : void 0;
+	z(() => {
+		if (!a || o == null || s == null || c == null) return;
+		let l = Date.now();
+		if (s <= l) {
+			i();
+			return;
+		}
+		let u = Math.max(ja, c - Aa - l), d = new AbortController(), f = window.setTimeout(async () => {
+			let a = await ka({
+				apiUrl: t,
+				apiKey: n,
+				refreshToken: o,
+				signal: d.signal
+			});
+			if (!d.signal.aborted) {
+				if (!a) {
+					i();
+					return;
+				}
+				e.kind === "verified" && r({
+					...e.identity,
+					token: a.accessToken,
+					tokenExpiresAt: a.accessTokenExpiresAt,
+					refreshToken: a.refreshToken,
+					refreshTokenExpiresAt: a.refreshTokenExpiresAt
+				});
+			}
+		}, u);
+		return () => {
+			window.clearTimeout(f), d.abort();
+		};
+	}, [
+		a,
+		o,
+		s,
+		c,
+		t,
+		n
+	]);
+}
+//#endregion
 //#region src/runtime/utils.ts
 function Z(...e) {
 	return e.filter(Boolean).join(" ");
 }
 //#endregion
 //#region src/runtime/use-drag.ts
-function ka(e) {
+function Na(e) {
 	let t = B(e);
 	t.current = e;
 	let [n, r] = R(!1), i = B(!1);
@@ -3687,8 +3770,8 @@ function ka(e) {
 					g = !0, i.current = !0, r(!0), t.current.onStart?.();
 				}
 				let o = Math.max(m, window.innerWidth - d - m), v = Math.max(m, window.innerHeight - f - m), y = {
-					left: Aa(l + n, m, o),
-					top: Aa(u + a, m, v)
+					left: Pa(l + n, m, o),
+					top: Pa(u + a, m, v)
 				};
 				_ = y, t.current.onMove(y);
 			}
@@ -3704,12 +3787,12 @@ function ka(e) {
 		consumeClickIfDragged: V(() => i.current ? (i.current = !1, !0) : !1, [])
 	};
 }
-function Aa(e, t, n) {
+function Pa(e, t, n) {
 	return Math.max(t, Math.min(n, e));
 }
 //#endregion
 //#region ../../node_modules/.pnpm/preact@10.29.1/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js
-var ja = 0;
+var Fa = 0;
 Array.isArray;
 function Q(e, n, r, i, a, o) {
 	n ||= {};
@@ -3726,7 +3809,7 @@ function Q(e, n, r, i, a, o) {
 		__e: null,
 		__c: null,
 		constructor: void 0,
-		__v: --ja,
+		__v: --Fa,
 		__i: -1,
 		__u: 0,
 		__source: a,
@@ -3737,7 +3820,7 @@ function Q(e, n, r, i, a, o) {
 }
 //#endregion
 //#region src/runtime/ui/icons.tsx
-function Ma({ size: e = 16 }) {
+function Ia({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3747,7 +3830,7 @@ function Ma({ size: e = 16 }) {
 		children: /* @__PURE__ */ Q("path", { d: "M63.4561 0.00557731C70.6277 -0.0175584 76.9025 1.04088 83.5898 3.71066C97.7952 9.43043 109.186 20.5001 115.311 34.5359C119.708 44.8002 120.746 54.7869 119.156 65.8171C116.857 82.7956 105.129 98.8382 90.0566 106.846C83.4394 110.362 74.7336 113.029 67.2051 113.271C62.4204 113.425 61.1274 113.32 56.6807 115.204C50.2035 117.858 43.6874 120.417 37.1348 122.879C34.8442 123.763 32.3203 124.902 29.9404 125.51C29.4023 125.648 28.1978 125.009 27.7598 124.646C26.9046 123.951 27.0582 122.505 27.0264 121.484C26.8123 114.646 27.3302 107.458 26.8604 100.656C25.1578 98.6714 22.4026 96.603 20.3086 94.1989C12.1853 84.8731 7.05334 73.9949 6.18164 61.6101C4.95583 46.292 9.97176 31.1285 20.0908 19.5632C29.989 8.13202 44.0369 1.11921 59.1221 0.0788195C60.2694 -0.0356049 62.2637 0.00944821 63.4561 0.00557731ZM92.2676 55.7497C91.5754 39.5314 77.8207 26.9725 61.6064 27.7536C45.5175 28.5287 33.0758 42.1537 33.7627 58.2468C34.4496 74.3398 48.007 86.8553 64.1035 86.2566C80.3254 85.6533 92.9599 71.968 92.2676 55.7497Z" })
 	});
 }
-function Na({ size: e = 16 }) {
+function La({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3756,7 +3839,7 @@ function Na({ size: e = 16 }) {
 		children: /* @__PURE__ */ Q("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
 	});
 }
-function Pa({ size: e = 16 }) {
+function Ra({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3765,7 +3848,7 @@ function Pa({ size: e = 16 }) {
 		children: /* @__PURE__ */ Q("path", { d: "M3 10a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0ZM8.5 10a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0ZM15.5 8.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z" })
 	});
 }
-function Fa({ size: e = 16 }) {
+function za({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3778,7 +3861,7 @@ function Fa({ size: e = 16 }) {
 		})
 	});
 }
-function Ia({ size: e = 16 }) {
+function Ba({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3792,7 +3875,7 @@ function Ia({ size: e = 16 }) {
 		})
 	});
 }
-function La({ size: e = 16 }) {
+function Va({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3801,7 +3884,7 @@ function La({ size: e = 16 }) {
 		children: /* @__PURE__ */ Q("path", { d: "M2.87 2.298a.75.75 0 0 0-.812 1.021L3.39 6.624a1 1 0 0 0 .928.626H8.25a.75.75 0 0 1 0 1.5H4.318a1 1 0 0 0-.927.626l-1.333 3.305a.75.75 0 0 0 .811 1.022 24.89 24.89 0 0 0 11.668-5.115.75.75 0 0 0 0-1.175A24.89 24.89 0 0 0 2.869 2.298Z" })
 	});
 }
-function Ra({ size: e = 16 }) {
+function Ha({ size: e = 16 }) {
 	return /* @__PURE__ */ Q("svg", {
 		width: e,
 		height: e,
@@ -3813,8 +3896,8 @@ function Ra({ size: e = 16 }) {
 }
 //#endregion
 //#region src/runtime/ui/fab.tsx
-function za({ isActive: e, onToggle: t, onHide: n, position: r = "bottom-right", onPositionChange: i, variant: a = "default" }) {
-	let o = a === "icon-only", s = r === "bottom-left" ? "markup-fab-left" : r === "bottom-center" ? "markup-fab-center" : "markup-fab-right", [c, l] = R(null), { onPointerDown: u, isDragging: d, consumeClickIfDragged: f } = ka({
+function Ua({ isActive: e, onToggle: t, onHide: n, position: r = "bottom-right", onPositionChange: i, variant: a = "default" }) {
+	let o = a === "icon-only", s = r === "bottom-left" ? "markup-fab-left" : r === "bottom-center" ? "markup-fab-center" : "markup-fab-right", [c, l] = R(null), { onPointerDown: u, isDragging: d, consumeClickIfDragged: f } = Na({
 		preventDefault: !0,
 		stopPropagation: !0,
 		onMove: l,
@@ -3846,7 +3929,7 @@ function za({ isActive: e, onToggle: t, onHide: n, position: r = "bottom-right",
 		"aria-pressed": e,
 		children: [/* @__PURE__ */ Q("span", {
 			class: "markup-fab-icon",
-			children: Q(e ? Na : Ma, { size: 16 })
+			children: Q(e ? La : Ia, { size: 16 })
 		}), o ? null : /* @__PURE__ */ Q("span", {
 			class: "markup-fab-label",
 			children: e ? "Cancel" : "Markup"
@@ -3855,7 +3938,7 @@ function za({ isActive: e, onToggle: t, onHide: n, position: r = "bottom-right",
 }
 //#endregion
 //#region src/runtime/use-focus-trap.ts
-var Ba = [
+var Wa = [
 	"a[href]",
 	"button:not([disabled])",
 	"input:not([disabled])",
@@ -3863,14 +3946,14 @@ var Ba = [
 	"textarea:not([disabled])",
 	"[tabindex]:not([tabindex=\"-1\"])"
 ].join(",");
-function Va(e, t) {
+function Ga(e, t) {
 	z(() => {
 		if (!t) return;
 		let n = e.current;
 		if (!n) return;
 		function r(e) {
 			if (e.key !== "Tab") return;
-			let t = Array.from(n.querySelectorAll(Ba)), r = t[0], i = t[t.length - 1];
+			let t = Array.from(n.querySelectorAll(Wa)), r = t[0], i = t[t.length - 1];
 			if (!r || !i) return;
 			let a = n.getRootNode(), o = a instanceof ShadowRoot ? a.activeElement : document.activeElement;
 			(e.shiftKey ? o === r : o === i) && (e.preventDefault(), (e.shiftKey ? i : r).focus());
@@ -3880,7 +3963,7 @@ function Va(e, t) {
 }
 //#endregion
 //#region src/runtime/use-object-url.ts
-function Ha(e) {
+function Ka(e) {
 	let [t, n] = R(null);
 	return z(() => {
 		if (!e) {
@@ -3893,7 +3976,7 @@ function Ha(e) {
 }
 //#endregion
 //#region src/runtime/ui/author-prompt.tsx
-function Ua({ isPending: e, isConnecting: t = !1, isSigningIn: n = !1, onSubmit: r, onCancel: i, onSignIn: a }) {
+function qa({ isPending: e, isConnecting: t = !1, isSigningIn: n = !1, onSubmit: r, onCancel: i, onSignIn: a }) {
 	let [o, s] = R(""), [c, l] = R(""), u = B(null);
 	z(() => {
 		u.current?.focus();
@@ -3972,8 +4055,8 @@ function Ua({ isPending: e, isConnecting: t = !1, isSigningIn: n = !1, onSubmit:
 }
 //#endregion
 //#region src/runtime/ui/composer.tsx
-var Wa = 4e3;
-function Ga({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "Post", initialFocus: r = !0, isPending: i, error: a, onSubmit: o }) {
+var Ja = 4e3;
+function Ya({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "Post", initialFocus: r = !0, isPending: i, error: a, onSubmit: o }) {
 	let [s, c] = R(""), l = B(null), u = B(!1);
 	z(() => {
 		r && l.current?.focus();
@@ -3983,7 +4066,7 @@ function Ga({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "
 	}, [s]), z(() => {
 		u.current && !i && !a && (c(""), l.current?.focus()), u.current = i;
 	}, [i, a]);
-	let d = Wa - s.length, f = d < 0;
+	let d = Ja - s.length, f = d < 0;
 	function p(e) {
 		e?.preventDefault();
 		let t = s.trim();
@@ -4001,7 +4084,7 @@ function Ga({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "
 			"aria-label": i ? "Sending…" : n,
 			title: i ? "Sending…" : n,
 			tabIndex: e,
-			children: /* @__PURE__ */ Q(La, { size: 14 })
+			children: /* @__PURE__ */ Q(Va, { size: 14 })
 		});
 	}
 	return /* @__PURE__ */ Q("form", {
@@ -4014,7 +4097,7 @@ function Ga({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "
 				class: "markup-composer-input",
 				placeholder: t,
 				rows: h ? 2 : 1,
-				maxLength: Wa + 100,
+				maxLength: Ja + 100,
 				value: s,
 				onInput: (e) => c(e.currentTarget.value),
 				onKeyDown: m,
@@ -4050,10 +4133,10 @@ function Ga({ label: e, placeholder: t = "Leave feedback…", submitLabel: n = "
 }
 //#endregion
 //#region src/runtime/ui/new-thread-popover.tsx
-function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolving: i, isSigningIn: a, isPending: o, error: s, screenshot: c, isScreenshotCapturing: l, screenshotRedactedCount: u, screenshotRedactedSelectors: d, onAuthor: f, onSignIn: p, onSubmit: m, onClose: h }) {
+function Xa({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolving: i, isSigningIn: a, isPending: o, error: s, screenshot: c, isScreenshotCapturing: l, screenshotRedactedCount: u, screenshotRedactedSelectors: d, onAuthor: f, onSignIn: p, onSubmit: m, onClose: h }) {
 	let g = B(null);
-	Va(g, !0);
-	let [_, v] = R(!1), [y, b] = R(!1), x = Ha(c), [C, w] = R(null), { onPointerDown: T, isDragging: E } = ka({
+	Ga(g, !0);
+	let [_, v] = R(!1), [y, b] = R(!1), x = Ka(c), [C, w] = R(null), { onPointerDown: T, isDragging: E } = Na({
 		targetRef: g,
 		shouldStart: (e) => !e.target?.closest("button, a, input, textarea, select"),
 		onMove: w
@@ -4069,7 +4152,7 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 		}
 		return e.addEventListener("toggle", t), () => e.removeEventListener("toggle", t);
 	}, [h]);
-	let D = qa(e - window.scrollX + 16, 12, window.innerWidth - 320 - 12), O = qa(t - window.scrollY - 16, 12, window.innerHeight - 220), k = c != null, A = l || k;
+	let D = Za(e - window.scrollX + 16, 12, window.innerWidth - 320 - 12), O = Za(t - window.scrollY - 16, 12, window.innerHeight - 220), k = c != null, A = l || k;
 	return /* @__PURE__ */ Q("div", {
 		ref: g,
 		class: Z("markup-popover", C && "is-floating", E && "is-dragging"),
@@ -4091,9 +4174,9 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 				class: "markup-icon-btn",
 				"aria-label": "Discard pin",
 				onClick: h,
-				children: /* @__PURE__ */ Q(Na, { size: 16 })
+				children: /* @__PURE__ */ Q(La, { size: 16 })
 			})]
-		}), n == null ? /* @__PURE__ */ Q(Ua, {
+		}), n == null ? /* @__PURE__ */ Q(qa, {
 			isPending: o,
 			isConnecting: i,
 			isSigningIn: a,
@@ -4117,7 +4200,7 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 						}) : null
 					]
 				}),
-				/* @__PURE__ */ Q(Ga, {
+				/* @__PURE__ */ Q(Ya, {
 					label: "Feedback",
 					placeholder: "What's wrong, missing, or worth noting?",
 					submitLabel: "Post markup",
@@ -4135,7 +4218,7 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 								class: "markup-screenshot-checkbox",
 								disabled: !0
 							}),
-							/* @__PURE__ */ Q(Ia, { size: 12 }),
+							/* @__PURE__ */ Q(Ba, { size: 12 }),
 							/* @__PURE__ */ Q("span", { children: "Capturing…" })
 						]
 					}) : /* @__PURE__ */ Q("label", {
@@ -4147,7 +4230,7 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 								checked: _,
 								onChange: (e) => v(e.currentTarget.checked)
 							}),
-							/* @__PURE__ */ Q(Ia, { size: 12 }),
+							/* @__PURE__ */ Q(Ba, { size: 12 }),
 							/* @__PURE__ */ Q("span", { children: "Attach screenshot" }),
 							x && _ ? /* @__PURE__ */ Q("img", {
 								class: "markup-screenshot-thumb",
@@ -4195,12 +4278,12 @@ function Ka({ pageX: e, pageY: t, authorName: n, isVerified: r, isIdentityResolv
 		})]
 	});
 }
-function qa(e, t, n) {
+function Za(e, t, n) {
 	return Math.max(t, Math.min(n, e));
 }
 //#endregion
 //#region src/runtime/ui/pin.tsx
-function Ja({ pageX: e, pageY: t, count: n, isActive: r, isUnresolved: i, onClick: a }) {
+function Qa({ pageX: e, pageY: t, count: n, isActive: r, isUnresolved: i, onClick: a }) {
 	let o = t - window.scrollY, s = e - window.scrollX;
 	return /* @__PURE__ */ Q("button", {
 		type: "button",
@@ -4223,7 +4306,7 @@ function Ja({ pageX: e, pageY: t, count: n, isActive: r, isUnresolved: i, onClic
 		}) : null]
 	});
 }
-function Ya({ pageX: e, pageY: t }) {
+function $a({ pageX: e, pageY: t }) {
 	let n = t - window.scrollY, r = e - window.scrollX;
 	return /* @__PURE__ */ Q("div", {
 		class: "markup-pin markup-pin-ghost is-anchor",
@@ -4239,7 +4322,7 @@ function Ya({ pageX: e, pageY: t }) {
 }
 //#endregion
 //#region src/runtime/ui/placement-overlay.tsx
-function Xa({ onPlace: e, onCancel: t }) {
+function eo({ onPlace: e, onCancel: t }) {
 	z(() => {
 		function e(e) {
 			e.key === "Escape" && t();
@@ -4265,14 +4348,14 @@ function Xa({ onPlace: e, onCancel: t }) {
 }
 //#endregion
 //#region src/runtime/ui/thread-popover.tsx
-var Za = [
+var to = [
 	"👍",
 	"❤️",
 	"🎉",
 	"😮",
 	"😄",
 	"❓"
-], Qa = ar({
+], no = ar({
 	none: {
 		"toggle-thread-menu": () => ({
 			kind: "thread-menu",
@@ -4328,13 +4411,13 @@ var Za = [
 		dismiss: () => ({ kind: "none" })
 	}
 });
-function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIdentityResolving: i, isSigningIn: a, canDelete: o, isPending: s, error: c, isHidden: l = !1, onAuthor: u, onSignIn: d, onClose: f, onReply: p, onEditComment: m, onDeleteComment: h, onToggleReaction: g, onResolve: _, onDelete: v }) {
-	let y = B(null), b = B(null), x = B(null), S = B(null), [C, w] = or(Qa, { kind: "none" }), [T, E] = R(null), { onPointerDown: D, isDragging: O } = ka({
+function ro({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIdentityResolving: i, isSigningIn: a, canDelete: o, isPending: s, error: c, isHidden: l = !1, onAuthor: u, onSignIn: d, onClose: f, onReply: p, onEditComment: m, onDeleteComment: h, onToggleReaction: g, onResolve: _, onDelete: v }) {
+	let y = B(null), b = B(null), x = B(null), S = B(null), [C, w] = or(no, { kind: "none" }), [T, E] = R(null), { onPointerDown: D, isDragging: O } = Na({
 		targetRef: y,
 		shouldStart: (e) => !e.target?.closest("button, a, input, textarea, select"),
 		onMove: E
 	});
-	Va(y, !0);
+	Ga(y, !0);
 	let k = e.resolvedAt != null, A = Ce(() => e.comments.filter((e) => !e.deleted), [e.comments]);
 	z(() => {
 		if (C.kind === "none" || C.kind === "editing") return;
@@ -4380,8 +4463,8 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 			anchorSelector: e.anchorSelector
 		});
 		return {
-			left: ro(t.pageX - window.scrollX + 16, 12, window.innerWidth - 320 - 12),
-			top: ro(t.pageY - window.scrollY - 16, 12, window.innerHeight - 200)
+			left: so(t.pageX - window.scrollX + 16, 12, window.innerWidth - 320 - 12),
+			top: so(t.pageY - window.scrollY - 16, 12, window.innerHeight - 200)
 		};
 	}, [
 		e.anchorX,
@@ -4425,7 +4508,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 								class: Z("markup-icon-btn", C.kind === "thread-menu" && "is-open"),
 								title: "More options",
 								onClick: () => w({ type: "toggle-thread-menu" }),
-								children: /* @__PURE__ */ Q(Pa, { size: 16 })
+								children: /* @__PURE__ */ Q(Ra, { size: 16 })
 							}), C.kind === "thread-menu" ? /* @__PURE__ */ Q("div", {
 								class: "markup-thread-menu-list",
 								children: [/* @__PURE__ */ Q("button", {
@@ -4453,14 +4536,14 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 							title: "Mark as resolved",
 							disabled: s,
 							onClick: _,
-							children: /* @__PURE__ */ Q(Fa, { size: 16 })
+							children: /* @__PURE__ */ Q(za, { size: 16 })
 						}) : null,
 						/* @__PURE__ */ Q("button", {
 							type: "button",
 							class: "markup-icon-btn",
 							title: "Close thread",
 							onClick: f,
-							children: /* @__PURE__ */ Q(Na, { size: 16 })
+							children: /* @__PURE__ */ Q(La, { size: 16 })
 						})
 					]
 				})]
@@ -4487,12 +4570,12 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 									/* @__PURE__ */ Q("time", {
 										class: "markup-comment-time",
 										datetime: new Date(t.createdAt).toISOString(),
-										title: ao(t.createdAt),
-										children: io(t.createdAt)
+										title: lo(t.createdAt),
+										children: co(t.createdAt)
 									}),
 									/* @__PURE__ */ Q("div", {
 										class: "markup-thread-actions",
-										children: [!k && !l ? /* @__PURE__ */ Q(eo, {
+										children: [!k && !l ? /* @__PURE__ */ Q(io, {
 											comment: t,
 											pickerOpen: p,
 											pickerDirection: _,
@@ -4560,7 +4643,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 														direction: a < i ? "up" : "down"
 													});
 												},
-												children: /* @__PURE__ */ Q(Pa, { size: 16 })
+												children: /* @__PURE__ */ Q(Ra, { size: 16 })
 											}), d ? /* @__PURE__ */ Q("div", {
 												class: "markup-thread-menu-list",
 												children: [o ? /* @__PURE__ */ Q("button", {
@@ -4632,7 +4715,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 								children: [t.body, t.editedAt == null ? null : /* @__PURE__ */ Q("time", {
 									class: "markup-comment-edited",
 									datetime: new Date(t.editedAt).toISOString(),
-									title: ao(t.editedAt),
+									title: lo(t.editedAt),
 									children: [" ", "(edited)"]
 								})]
 							}),
@@ -4645,7 +4728,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 									alt: "Screenshot"
 								})
 							}) : null,
-							!l && t.reactions.length > 0 ? /* @__PURE__ */ Q(to, {
+							!l && t.reactions.length > 0 ? /* @__PURE__ */ Q(ao, {
 								comment: t,
 								isResolved: k,
 								onToggle: (e) => g(t._id, e)
@@ -4665,7 +4748,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 					onClick: (e) => {
 						e.stopPropagation(), x.current?.close();
 					},
-					children: /* @__PURE__ */ Q(Na, { size: 16 })
+					children: /* @__PURE__ */ Q(La, { size: 16 })
 				}), /* @__PURE__ */ Q("img", {
 					class: "markup-lightbox-img",
 					src: e.screenshotUrl,
@@ -4673,7 +4756,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 					onClick: (e) => e.stopPropagation()
 				})]
 			}) : null,
-			t == null ? /* @__PURE__ */ Q(Ua, {
+			t == null ? /* @__PURE__ */ Q(qa, {
 				isPending: s,
 				isConnecting: i,
 				isSigningIn: a,
@@ -4695,7 +4778,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 							children: "team"
 						}) : null
 					]
-				}), /* @__PURE__ */ Q(Ga, {
+				}), /* @__PURE__ */ Q(Ya, {
 					label: "Reply",
 					placeholder: "Write a reply…",
 					submitLabel: "Reply",
@@ -4708,7 +4791,7 @@ function $a({ thread: e, authorName: t, currentClientId: n, isVerified: r, isIde
 		]
 	});
 }
-function eo({ comment: e, pickerOpen: t, pickerDirection: n, pickerSide: r, pickerRef: i, onPickerClick: a, onPickerSelect: o }) {
+function io({ comment: e, pickerOpen: t, pickerDirection: n, pickerSide: r, pickerRef: i, onPickerClick: a, onPickerSelect: o }) {
 	return /* @__PURE__ */ Q("div", {
 		class: Z("markup-reaction-picker-wrap", t && "is-open", t && n === "up" && "is-up", r && "is-side"),
 		ref: i,
@@ -4718,11 +4801,11 @@ function eo({ comment: e, pickerOpen: t, pickerDirection: n, pickerSide: r, pick
 			title: "Add reaction",
 			"aria-label": "Add reaction",
 			onClick: a,
-			children: /* @__PURE__ */ Q(Ra, { size: 16 })
+			children: /* @__PURE__ */ Q(Ha, { size: 16 })
 		}), t ? /* @__PURE__ */ Q("div", {
 			class: "markup-reaction-picker",
 			role: "menu",
-			children: Za.map((t) => /* @__PURE__ */ Q("button", {
+			children: to.map((t) => /* @__PURE__ */ Q("button", {
 				type: "button",
 				role: "menuitem",
 				class: Z("markup-reaction-picker-item", (e.reactions.find((e) => e.emoji === t)?.mine ?? !1) && "is-mine"),
@@ -4732,11 +4815,11 @@ function eo({ comment: e, pickerOpen: t, pickerDirection: n, pickerSide: r, pick
 		}) : null]
 	});
 }
-function to({ comment: e, isResolved: t, onToggle: n }) {
+function ao({ comment: e, isResolved: t, onToggle: n }) {
 	return /* @__PURE__ */ Q("div", {
 		class: "markup-reactions",
 		children: e.reactions.map((e) => {
-			let r = no(e.reactors, e.mine, e.count, e.emoji);
+			let r = oo(e.reactors, e.mine, e.count, e.emoji);
 			return /* @__PURE__ */ Q("button", {
 				type: "button",
 				class: Z("markup-reaction-chip", e.mine && "is-mine"),
@@ -4757,14 +4840,14 @@ function to({ comment: e, isResolved: t, onToggle: n }) {
 		})
 	});
 }
-function no(e, t, n, r) {
+function oo(e, t, n, r) {
 	let i = e.slice(), a = i.length + +!!t, o = Math.max(0, n - a);
 	return o > 0 && i.push(`${o} other${o === 1 ? "" : "s"}`), t && i.push("you"), i.length === 0 ? `${n} reacted with ${r}` : `${i.length === 1 ? i[0] : `${i.slice(0, -1).join(", ")} and ${i[i.length - 1]}`} reacted with ${r}`;
 }
-function ro(e, t, n) {
+function so(e, t, n) {
 	return Math.max(t, Math.min(n, e));
 }
-function io(e) {
+function co(e) {
 	let t = Date.now() - e, n = Math.floor(t / 1e3);
 	if (n < 60) return "just now";
 	let r = Math.floor(n / 60);
@@ -4781,7 +4864,7 @@ function io(e) {
 		year: "numeric"
 	});
 }
-function ao(e) {
+function lo(e) {
 	return new Date(e).toLocaleDateString([], {
 		month: "long",
 		day: "numeric",
@@ -4792,19 +4875,25 @@ function ao(e) {
 }
 //#endregion
 //#region src/runtime/ui/app.tsx
-function oo(e) {
-	return !e.token || e.tokenExpiresAt == null ? null : {
+function uo(e) {
+	if (!e.token || e.tokenExpiresAt == null) return null;
+	let t = typeof e.refreshToken == "string" && typeof e.refreshTokenExpiresAt == "number";
+	return {
 		clientId: `markup_user_${e.identity.id}`,
 		token: e.token,
 		tokenExpiresAt: e.tokenExpiresAt,
+		...t ? {
+			refreshToken: e.refreshToken,
+			refreshTokenExpiresAt: e.refreshTokenExpiresAt
+		} : {},
 		name: e.identity.name,
 		email: e.identity.email
 	};
 }
-function so() {
+function fo() {
 	return window.location.host + window.location.pathname;
 }
-var co = ar({
+var po = ar({
 	visible: {
 		"hide-with-toast": () => ({ kind: "hidden-with-toast" }),
 		toggle: () => ({ kind: "hidden" })
@@ -4818,7 +4907,7 @@ var co = ar({
 function $(e) {
 	return Gr(e), e;
 }
-var lo = ar({
+var mo = ar({
 	unresolved: {
 		"mint-success": (e, t) => $({
 			kind: "anon",
@@ -4867,9 +4956,12 @@ var lo = ar({
 		})
 	}
 });
-function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "default", screenshots: i }) {
-	let [a, o] = R(so), [s, c] = R([]), [l, u] = R(!1), d = Ce(() => Wr(), []), [f, p] = or(lo, d.state), [m, h] = R(n), g = B(f);
-	g.current = f;
+function ho({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "default", screenshots: i }) {
+	let [a, o] = R(fo), [s, c] = R([]), [l, u] = R(!1), d = Ce(() => Wr(), []), [f, p] = or(mo, d.state), [m, h] = R(n), g = B(f);
+	g.current = f, Ma(f, e, t, (e) => p({
+		type: "signed-in",
+		identity: e
+	}), () => p({ type: "unauthorized" }));
 	let _ = Ce(() => Nr({
 		apiUrl: e,
 		apiKey: t,
@@ -4891,7 +4983,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 		e,
 		t,
 		p
-	]), [v, y] = R({ kind: "idle" }), b = cr(), x = cr(), S = cr(), { run: C, reset: w } = b, { run: T } = x, { run: E, reset: D } = S, O = b.isPending, k = b.error ?? x.error ?? S.error, [A, j] = or(co, { kind: "visible" }), M = A.kind !== "visible", [N, ee] = R(0), te = B(null), ne = qr(f), re = f.kind === "verified", ie = f.kind === "unresolved" || f.kind === "recovering", P = Kr(f);
+	]), [v, y] = R({ kind: "idle" }), b = cr(), x = cr(), S = cr(), { run: C, reset: w } = b, { run: T } = x, { run: E, reset: D } = S, O = b.isPending, k = b.error ?? x.error ?? S.error, [A, j] = or(po, { kind: "visible" }), M = A.kind !== "visible", [N, ee] = R(0), te = B(null), ne = qr(f), re = f.kind === "verified", ie = f.kind === "unresolved" || f.kind === "recovering", P = Kr(f);
 	z(() => {
 		if (f.kind !== "unresolved" && f.kind !== "recovering") return;
 		let e = f.kind === "recovering" ? f.preserved : d.preserved, t = !1, n = null, r = 1e3;
@@ -4953,7 +5045,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 			}), history.replaceState(null, "", window.location.pathname + window.location.search);
 		}
 		ce.current = !0;
-	}, [s, l]), z(() => Br(() => o(so())), []), z(() => {
+	}, [s, l]), z(() => Br(() => o(fo())), []), z(() => {
 		function e(e) {
 			e.key === "." && (e.metaKey || e.ctrlKey) && (e.altKey || e.shiftKey || (e.preventDefault(), j({ type: "toggle" })));
 		}
@@ -5030,7 +5122,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 		});
 	}, [p]), pe = x.isPending, me = V(async () => {
 		await T(async () => {
-			let n = oo(await Yr(e, t));
+			let n = uo(await Yr(e, t));
 			if (!n) throw Error("Sign-in did not return a verified token");
 			p({
 				type: "signed-in",
@@ -5203,7 +5295,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 				class: "markup-pins-layer",
 				children: [M ? null : Se.map(({ thread: e, point: t }) => {
 					let n = v.kind === "thread" && v.threadId === e._id, r = e.comments.reduce((e, t) => e + +!t.deleted, 0);
-					return /* @__PURE__ */ Q(Ja, {
+					return /* @__PURE__ */ Q(Qa, {
 						pageX: t.pageX,
 						pageY: t.pageY,
 						count: r,
@@ -5214,16 +5306,16 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 							threadId: e._id
 						})
 					}, e._id);
-				}), v.kind === "composing-new" ? /* @__PURE__ */ Q(Ya, {
+				}), v.kind === "composing-new" ? /* @__PURE__ */ Q($a, {
 					pageX: v.pageX,
 					pageY: v.pageY
 				}) : null]
 			}),
-			v.kind === "placing" ? /* @__PURE__ */ Q(Xa, {
+			v.kind === "placing" ? /* @__PURE__ */ Q(eo, {
 				onPlace: F,
 				onCancel: ue
 			}) : null,
-			v.kind === "thread" && L ? /* @__PURE__ */ Q($a, {
+			v.kind === "thread" && L ? /* @__PURE__ */ Q(ro, {
 				thread: L,
 				authorName: ne,
 				currentClientId: P ?? null,
@@ -5244,7 +5336,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 				onDelete: I,
 				onResolve: ge
 			}, L._id) : null,
-			v.kind === "composing-new" ? /* @__PURE__ */ Q(Ka, {
+			v.kind === "composing-new" ? /* @__PURE__ */ Q(Xa, {
 				pageX: v.pageX,
 				pageY: v.pageY,
 				authorName: ne,
@@ -5262,7 +5354,7 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 				onSubmit: he,
 				onClose: ue
 			}) : null,
-			!M || v.kind === "placing" || v.kind === "composing-new" ? /* @__PURE__ */ Q(za, {
+			!M || v.kind === "placing" || v.kind === "composing-new" ? /* @__PURE__ */ Q(Ua, {
 				isActive: v.kind === "placing",
 				onToggle: () => v.kind === "placing" ? ue() : le(),
 				onHide: () => j({ type: "hide-with-toast" }),
@@ -5270,11 +5362,11 @@ function uo({ apiUrl: e, apiKey: t, position: n = "bottom-right", fab: r = "defa
 				onPositionChange: h,
 				variant: r
 			}) : null,
-			A.kind === "hidden-with-toast" ? /* @__PURE__ */ Q(fo, { position: m }) : null
+			A.kind === "hidden-with-toast" ? /* @__PURE__ */ Q(go, { position: m }) : null
 		]
 	});
 }
-function fo({ position: e }) {
+function go({ position: e }) {
 	let t = /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent) ? "⌘" : "Ctrl";
 	return /* @__PURE__ */ Q("div", {
 		class: Z("markup-hud-hidden-toast", e === "bottom-left" ? "markup-hud-hidden-toast-left" : e === "bottom-center" ? "markup-hud-hidden-toast-center" : "markup-hud-hidden-toast-right"),
@@ -5296,7 +5388,7 @@ function fo({ position: e }) {
 }
 //#endregion
 //#region src/runtime/mount.tsx
-function po(e, t) {
+function _o(e, t) {
 	e.style.position = "fixed", e.style.inset = "0", e.style.zIndex = "2147483647", e.style.pointerEvents = "none";
 	let n = t.theme ?? "auto";
 	n !== "auto" && (e.dataset.theme = n);
@@ -5305,24 +5397,32 @@ function po(e, t) {
 	let a = document.createElement("div");
 	a.className = "markup-shadow-root", r.appendChild(a);
 	let { theme: o, ...s } = t;
-	return le(/* @__PURE__ */ Q(uo, { ...s }), a), () => le(null, a);
+	return le(/* @__PURE__ */ Q(ho, { ...s }), a), () => le(null, a);
 }
 //#endregion
 //#region src/widget.ts
-var mo = null, ho = null;
-function go(e) {
+var vo = null, yo = null, bo = null;
+function xo(e) {
 	if (!e.apiUrl || !e.apiKey) return console.warn("[markup] init() requires both apiUrl and apiKey — widget not mounted"), () => {};
-	_o();
-	let t = document.createElement("div");
-	return t.id = "markup-widget", document.body.appendChild(t), ho = t, mo = po(t, e), _o;
+	So();
+	let t = () => {
+		if (bo = null, !document.body) return;
+		let t = document.createElement("div");
+		t.id = "markup-widget", document.body.appendChild(t), yo = t, vo = _o(t, e);
+	};
+	if (document.readyState === "loading" || !document.body) {
+		let e = () => t();
+		bo = () => document.removeEventListener("DOMContentLoaded", e), document.addEventListener("DOMContentLoaded", e, { once: !0 });
+	} else t();
+	return So;
 }
-function _o() {
-	mo &&= (mo(), null), ho?.parentNode && ho.parentNode.removeChild(ho), ho = null;
+function So() {
+	bo &&= (bo(), null), vo &&= (vo(), null), yo?.parentNode && yo.parentNode.removeChild(yo), yo = null;
 }
 if (typeof document < "u") {
 	let e = document.currentScript ?? document.querySelector("script[data-markup-widget=\"true\"]"), t = e?.dataset.apiUrl, n = e?.dataset.apiKey;
 	if (t && n) {
-		let r = e?.dataset.position, i = e?.dataset.theme, a = e?.dataset.fab, o = () => go({
+		let r = e?.dataset.position, i = e?.dataset.theme, a = e?.dataset.fab, o = () => xo({
 			apiUrl: t,
 			apiKey: n,
 			position: r,
@@ -5333,4 +5433,6 @@ if (typeof document < "u") {
 	}
 }
 //#endregion
-export { _o as destroy, go as init };
+export { So as destroy, xo as init };
+
+//# sourceMappingURL=widget.js.map