review-lens-react 0.1.1 → 0.2.0

package/dist/review-lens-react.js

@@ -1,97 +1,119 @@
-import { jsx as a, jsxs as S, Fragment as G } from "react/jsx-runtime";
-import { createContext as q, useMemo as $, useState as N, useCallback as F, useEffect as P, useContext as H } from "react";
-const D = [
+import { jsx as i, jsxs as o, Fragment as ie } from "react/jsx-runtime";
+import { createContext as st, useMemo as re, useState as k, useCallback as W, useEffect as _, useContext as ot, useRef as We, useLayoutEffect as lt } from "react";
+const ct = [
   "https://www.googleapis.com/auth/spreadsheets",
   "https://www.googleapis.com/auth/userinfo.email"
-].join(" "), Q = "https://www.googleapis.com/oauth2/v3/userinfo";
-function X(e) {
-  const o = e.feedbackSheetName ?? "Feedback", t = e.usersSheetName ?? "Users";
-  let n, r;
-  async function i() {
-    return n ?? (n = te(e.googleClientId)), n;
+].join(" "), dt = "https://www.googleapis.com/oauth2/v3/userinfo";
+function ht(e) {
+  const t = e.feedbackSheetName ?? "Feedback", n = e.messagesSheetName ?? "Messages", a = e.usersSheetName ?? "Users";
+  let s, c;
+  async function g() {
+    return s ?? (s = St(e.googleClientId)), s;
   }
-  async function m(d, c) {
-    const s = await i(), l = await fetch(
+  async function f(d, v) {
+    const p = await g(), b = await fetch(
       `https://sheets.googleapis.com/v4/spreadsheets/${e.spreadsheetId}${d}`,
       {
-        ...c,
+        ...v,
         headers: {
-          Authorization: `Bearer ${s}`,
+          Authorization: `Bearer ${p}`,
           "Content-Type": "application/json",
-          ...c == null ? void 0 : c.headers
+          ...v == null ? void 0 : v.headers
         }
       }
     );
-    if (!l.ok)
-      throw new Error(`Google Sheets request failed with ${l.status}`);
-    return l.json();
+    if (!b.ok)
+      throw new Error(`Google Sheets request failed with ${b.status}`);
+    return b.json();
   }
-  async function v(d) {
-    return (await m(
+  async function u(d) {
+    return (await f(
       `/values/${encodeURIComponent(d)}`
     )).values ?? [];
   }
   return {
     async getCurrentUser() {
-      if (!r) {
-        const d = await i(), c = await fetch(Q, {
+      if (!c) {
+        const d = await g(), v = await fetch(dt, {
           headers: { Authorization: `Bearer ${d}` }
         });
-        if (!c.ok)
-          throw new Error(`Google userinfo request failed with ${c.status}`);
-        r = (await c.json()).email;
+        if (!v.ok)
+          throw new Error(`Google userinfo request failed with ${v.status}`);
+        c = (await v.json()).email;
       }
-      if (!r)
+      if (!c)
         throw new Error("Google account did not return an email address");
-      return { email: r };
+      return { email: c };
     },
     async getPermissions(d) {
-      const [{ email: c }, s] = await Promise.all([this.getCurrentUser(), v(t)]), l = W(s), k = c.toLowerCase(), h = l.find(
-        (f) => {
-          var p;
-          return ((p = f.email) == null ? void 0 : p.toLowerCase()) === k && f.active !== "false" && (!f.projectKey || f.projectKey === d);
+      const [{ email: v }, p] = await Promise.all([this.getCurrentUser(), u(a)]), b = ce(p), E = v.toLowerCase(), x = b.find(
+        (A) => {
+          var h;
+          return ((h = A.email) == null ? void 0 : h.toLowerCase()) === E && A.active !== "false" && (!A.projectKey || A.projectKey === d);
         }
       );
-      return ee((h == null ? void 0 : h.role) ?? "designer");
+      return gt((x == null ? void 0 : x.role) ?? "designer");
     },
     async listFeedback(d) {
-      return W(await v(o)).map(j).filter((s) => s !== null).filter(
-        (s) => s.projectKey === d.projectKey && s.contentId === d.contentId && s.normalizedPath === d.normalizedPath
-      ).sort((s, l) => l.createdAt.localeCompare(s.createdAt));
+      return ce(await u(t)).map(Te).filter((p) => p !== null).filter(
+        (p) => p.projectKey === d.projectKey && p.contentId === d.contentId && p.normalizedPath === d.normalizedPath
+      ).sort((p, b) => b.createdAt.localeCompare(p.createdAt));
     },
     async createFeedback(d) {
-      const c = (/* @__PURE__ */ new Date()).toISOString(), s = {
+      const v = (/* @__PURE__ */ new Date()).toISOString(), p = {
         ...d,
         id: crypto.randomUUID(),
-        status: "open",
-        createdAt: c,
-        updatedAt: c
+        attachments: [],
+        createdAt: v,
+        updatedAt: v
       };
-      return await m(`/values/${encodeURIComponent(o)}:append?valueInputOption=RAW`, {
+      return await f(`/values/${encodeURIComponent(t)}:append?valueInputOption=RAW`, {
         method: "POST",
-        body: JSON.stringify({ values: [V(s)] })
-      }), s;
+        body: JSON.stringify({ values: [Ie(p)] })
+      }), p;
     },
-    async resolveFeedback(d, c) {
-      const s = await v(o), l = s[0] ?? Y, k = l.indexOf("id"), h = l.indexOf("status"), f = l.indexOf("updatedAt"), p = l.indexOf("resolvedAt"), w = l.indexOf("resolvedBy"), g = s.findIndex((R, x) => x > 0 && R[k] === d);
-      if (g < 1)
+    async updateFeedback(d, v) {
+      const p = await u(t), b = p[0] ?? Me, E = b.indexOf("id");
+      if (E === -1)
+        throw new Error(`Sheet ${t} is missing an id column`);
+      const x = p.findIndex((w, C) => C > 0 && w[E] === d);
+      if (x < 1)
         throw new Error(`Feedback ${d} was not found`);
-      const b = [...s[g]], L = (/* @__PURE__ */ new Date()).toISOString();
-      b[h] = "resolved", b[f] = L, b[p] = L, b[w] = c, await m(
-        `/values/${encodeURIComponent(o)}!A${g + 1}:Q${g + 1}?valueInputOption=RAW`,
+      const A = (/* @__PURE__ */ new Date()).toISOString(), h = Te(De(b, p[x]));
+      if (!h)
+        throw new Error(`Feedback ${d} could not be parsed before updating`);
+      const R = {
+        ...h,
+        ...v,
+        updatedAt: A
+      }, y = Ie(R);
+      return await f(
+        `/values/${encodeURIComponent(t)}!A${x + 1}:${yt(
+          Me.length
+        )}${x + 1}?valueInputOption=RAW`,
         {
           method: "PUT",
-          body: JSON.stringify({ values: [b] })
+          body: JSON.stringify({ values: [y] })
         }
-      );
-      const I = j(O(l, b));
-      if (!I)
-        throw new Error(`Feedback ${d} could not be parsed after resolving`);
-      return I;
+      ), R;
+    },
+    async listMessages(d) {
+      return ce(await u(n)).map(mt).filter((p) => p !== null).filter((p) => p.feedbackId === d).sort((p, b) => p.createdAt.localeCompare(b.createdAt));
+    },
+    async createMessage(d) {
+      const v = {
+        ...d,
+        id: crypto.randomUUID(),
+        createdAt: (/* @__PURE__ */ new Date()).toISOString()
+      };
+      return await f(`/values/${encodeURIComponent(n)}:append?valueInputOption=RAW`, {
+        method: "POST",
+        body: JSON.stringify({ values: [pt(v)] })
+      }), v;
     }
   };
 }
-const Y = [
+const Me = [
   "id",
   "projectKey",
   "contentId",
@@ -100,16 +122,28 @@ const Y = [
   "selector",
   "selectorStrategy",
   "elementFingerprintJson",
-  "cssSnapshotJson",
+  "createdCssSnapshotJson",
   "comment",
   "status",
+  "severity",
+  "category",
+  "assigneeEmail",
+  "viewportWidth",
+  "viewportHeight",
+  "viewportPreset",
+  "screenshotUrl",
+  "screenshotThumbnailUrl",
+  "attachmentJson",
   "authorEmail",
   "createdAt",
   "updatedAt",
+  "fixedCssSnapshotJson",
+  "fixedAt",
+  "fixedBy",
   "resolvedAt",
   "resolvedBy"
-];
-function V(e) {
+], ut = ["id", "feedbackId", "body", "authorEmail", "createdAt"];
+function Ie(e) {
   return [
     e.id,
     e.projectKey,
@@ -119,24 +153,39 @@ function V(e) {
     e.selector,
     e.selectorStrategy,
     JSON.stringify(e.elementFingerprint),
-    JSON.stringify(e.cssSnapshot),
+    JSON.stringify(e.createdCssSnapshot),
     e.comment,
     e.status,
+    e.severity,
+    e.category,
+    e.assigneeEmail ?? "",
+    String(e.viewportWidth),
+    String(e.viewportHeight),
+    e.viewportPreset,
+    e.screenshotUrl ?? "",
+    e.screenshotThumbnailUrl ?? "",
+    JSON.stringify(e.attachments),
     e.authorEmail,
     e.createdAt,
     e.updatedAt,
+    e.fixedCssSnapshot ? JSON.stringify(e.fixedCssSnapshot) : "",
+    e.fixedAt ?? "",
+    e.fixedBy ?? "",
     e.resolvedAt ?? "",
     e.resolvedBy ?? ""
   ];
 }
-function W(e) {
-  const [o, ...t] = e;
-  return o ? t.map((n) => O(o, n)) : [];
+function pt(e) {
+  return ut.map((t) => e[t]);
 }
-function O(e, o) {
-  return Object.fromEntries(e.map((t, n) => [t, o[n] ?? ""]));
+function ce(e) {
+  const [t, ...n] = e;
+  return t ? n.map((a) => De(t, a)) : [];
 }
-function j(e) {
+function De(e, t) {
+  return Object.fromEntries(e.map((n, a) => [n, t[a] ?? ""]));
+}
+function Te(e) {
   return e.id ? {
     id: e.id,
     projectKey: e.projectKey,
@@ -145,552 +194,1405 @@ function j(e) {
     originalUrl: e.originalUrl,
     selector: e.selector,
     selectorStrategy: e.selectorStrategy === "stable-attribute" ? "stable-attribute" : "css-path",
-    elementFingerprint: K(e.elementFingerprintJson, {
+    elementFingerprint: he(e.elementFingerprintJson, {
       tagName: "",
       width: 0,
       height: 0
     }),
-    cssSnapshot: Z(e.cssSnapshotJson),
+    createdCssSnapshot: Re(e.createdCssSnapshotJson),
+    fixedCssSnapshot: e.fixedCssSnapshotJson ? Re(e.fixedCssSnapshotJson) : void 0,
     comment: e.comment,
-    status: e.status === "resolved" ? "resolved" : "open",
+    status: ft(e.status),
+    severity: bt(e.severity),
+    category: vt(e.category),
+    assigneeEmail: e.assigneeEmail || void 0,
+    viewportWidth: Number(e.viewportWidth) || 0,
+    viewportHeight: Number(e.viewportHeight) || 0,
+    viewportPreset: wt(e.viewportPreset),
+    screenshotUrl: e.screenshotUrl || void 0,
+    screenshotThumbnailUrl: e.screenshotThumbnailUrl || void 0,
+    attachments: he(e.attachmentJson, []),
     authorEmail: e.authorEmail,
     createdAt: e.createdAt,
     updatedAt: e.updatedAt,
+    fixedAt: e.fixedAt || void 0,
+    fixedBy: e.fixedBy || void 0,
     resolvedAt: e.resolvedAt || void 0,
     resolvedBy: e.resolvedBy || void 0
   } : null;
 }
-function K(e, o) {
+function mt(e) {
+  return !e.id || !e.feedbackId ? null : {
+    id: e.id,
+    feedbackId: e.feedbackId,
+    body: e.body,
+    authorEmail: e.authorEmail,
+    createdAt: e.createdAt
+  };
+}
+function he(e, t) {
   try {
-    return e ? JSON.parse(e) : o;
+    return e ? JSON.parse(e) : t;
   } catch {
-    return o;
+    return t;
   }
 }
-function Z(e) {
-  const o = K(e, {});
+function Re(e) {
+  const t = he(e, {});
   return {
-    margin: o.margin ?? "",
-    marginTop: o.marginTop ?? "",
-    marginRight: o.marginRight ?? "",
-    marginBottom: o.marginBottom ?? "",
-    marginLeft: o.marginLeft ?? "",
-    padding: o.padding ?? "",
-    paddingTop: o.paddingTop ?? "",
-    paddingRight: o.paddingRight ?? "",
-    paddingBottom: o.paddingBottom ?? "",
-    paddingLeft: o.paddingLeft ?? "",
-    border: o.border ?? "",
-    borderTopWidth: o.borderTopWidth ?? "",
-    borderRightWidth: o.borderRightWidth ?? "",
-    borderBottomWidth: o.borderBottomWidth ?? "",
-    borderLeftWidth: o.borderLeftWidth ?? "",
-    fontFamily: o.fontFamily ?? "",
-    fontSize: o.fontSize ?? "",
-    lineHeight: o.lineHeight ?? "",
-    color: o.color ?? "",
-    backgroundColor: o.backgroundColor ?? "",
-    width: o.width ?? 0,
-    height: o.height ?? 0
+    margin: t.margin ?? "",
+    marginTop: t.marginTop ?? "",
+    marginRight: t.marginRight ?? "",
+    marginBottom: t.marginBottom ?? "",
+    marginLeft: t.marginLeft ?? "",
+    padding: t.padding ?? "",
+    paddingTop: t.paddingTop ?? "",
+    paddingRight: t.paddingRight ?? "",
+    paddingBottom: t.paddingBottom ?? "",
+    paddingLeft: t.paddingLeft ?? "",
+    border: t.border ?? "",
+    borderTopWidth: t.borderTopWidth ?? "",
+    borderRightWidth: t.borderRightWidth ?? "",
+    borderBottomWidth: t.borderBottomWidth ?? "",
+    borderLeftWidth: t.borderLeftWidth ?? "",
+    fontFamily: t.fontFamily ?? "",
+    fontSize: t.fontSize ?? "",
+    lineHeight: t.lineHeight ?? "",
+    color: t.color ?? "",
+    backgroundColor: t.backgroundColor ?? "",
+    borderRadius: t.borderRadius ?? "",
+    width: t.width ?? 0,
+    height: t.height ?? 0
   };
 }
-function ee(e) {
-  return e === "admin" ? ["create", "read", "resolve"] : e === "developer" ? ["read", "resolve"] : ["create", "read"];
+function gt(e) {
+  return e === "admin" ? ["create", "read", "reply", "update", "assign"] : e === "developer" ? ["read", "reply", "update", "assign"] : ["create", "read", "reply"];
+}
+function ft(e) {
+  return e === "in_progress" || e === "needs_clarification" || e === "fixed" || e === "wontfix" || e === "resolved" ? e : "open";
+}
+function bt(e) {
+  return e === "low" || e === "high" ? e : "medium";
+}
+function vt(e) {
+  return e === "visual" || e === "copy" || e === "accessibility" || e === "responsive" ? e : "bug";
+}
+function wt(e) {
+  return e === "mobile" || e === "tablet" || e === "desktop" ? e : "custom";
 }
-async function te(e) {
-  return await oe(), new Promise((o, t) => {
-    var r;
-    const n = (r = window.google) == null ? void 0 : r.accounts.oauth2.initTokenClient({
+function yt(e) {
+  let t = e, n = "";
+  for (; t > 0; ) {
+    const a = (t - 1) % 26;
+    n = String.fromCharCode(65 + a) + n, t = Math.floor((t - a) / 26);
+  }
+  return n;
+}
+async function St(e) {
+  return await kt(), new Promise((t, n) => {
+    var s;
+    const a = (s = window.google) == null ? void 0 : s.accounts.oauth2.initTokenClient({
       client_id: e,
-      scope: D,
-      callback: (i) => {
-        if (i.error || !i.access_token) {
-          t(new Error(i.error ?? "Google OAuth did not return an access token"));
+      scope: ct,
+      callback: (c) => {
+        if (c.error || !c.access_token) {
+          n(new Error(c.error ?? "Google OAuth did not return an access token"));
           return;
         }
-        o(i.access_token);
+        t(c.access_token);
       }
     });
-    n == null || n.requestAccessToken({ prompt: "" });
+    a == null || a.requestAccessToken({ prompt: "" });
   });
 }
-function oe() {
+function kt() {
   var e;
-  return (e = window.google) != null && e.accounts.oauth2 ? Promise.resolve() : new Promise((o, t) => {
-    const n = document.querySelector(
+  return (e = window.google) != null && e.accounts.oauth2 ? Promise.resolve() : new Promise((t, n) => {
+    const a = document.querySelector(
       'script[src="https://accounts.google.com/gsi/client"]'
     );
-    if (n) {
-      n.addEventListener("load", () => o(), { once: !0 }), n.addEventListener("error", () => t(new Error("Google Identity failed to load")), {
+    if (a) {
+      a.addEventListener("load", () => t(), { once: !0 }), a.addEventListener("error", () => n(new Error("Google Identity failed to load")), {
         once: !0
       });
       return;
     }
-    const r = document.createElement("script");
-    r.src = "https://accounts.google.com/gsi/client", r.async = !0, r.defer = !0, r.onload = () => o(), r.onerror = () => t(new Error("Google Identity failed to load")), document.head.append(r);
+    const s = document.createElement("script");
+    s.src = "https://accounts.google.com/gsi/client", s.async = !0, s.defer = !0, s.onload = () => t(), s.onerror = () => n(new Error("Google Identity failed to load")), document.head.append(s);
   });
 }
-function ne(e) {
+function Ct(e) {
   return new URL(e, window.location.href).pathname.replace(/\/+$/, "") || "/";
 }
-const _ = q(null);
-function we({ config: e, children: o }) {
-  const t = $(() => e.adapter ? e.adapter : X({
-    googleClientId: U(e.googleClientId, "googleClientId"),
-    spreadsheetId: U(e.spreadsheetId, "spreadsheetId"),
+const ze = st(null);
+function Xt({ config: e, children: t }) {
+  const n = re(() => e.adapter ? e.adapter : ht({
+    googleClientId: Be(e.googleClientId, "googleClientId"),
+    spreadsheetId: Be(e.spreadsheetId, "spreadsheetId"),
     feedbackSheetName: e.sheetName ?? "Feedback"
-  }), [e.adapter, e.googleClientId, e.sheetName, e.spreadsheetId]), n = e.currentUrl ?? window.location.href, r = (e.normalizeUrl ?? ne)(n), [i, m] = N(), [v, d] = N([]), [c, s] = N([]), l = F(async () => {
-    const p = await t.listFeedback({
+  }), [e.adapter, e.googleClientId, e.sheetName, e.spreadsheetId]), a = e.currentUrl ?? window.location.href, s = (e.normalizeUrl ?? Ct)(a), [c, g] = k(), [f, u] = k([]), [d, v] = k([]), p = W(async () => {
+    const y = await n.listFeedback({
       projectKey: e.projectKey,
       contentId: e.contentId,
-      normalizedPath: r
+      normalizedPath: s
     });
-    s(p);
-  }, [t, e.contentId, e.projectKey, r]);
-  P(() => {
-    let p = !0;
+    v(y);
+  }, [n, e.contentId, e.projectKey, s]);
+  _(() => {
+    let y = !0;
     async function w() {
-      const [g, b] = await Promise.all([
-        t.getCurrentUser(),
-        t.getPermissions(e.projectKey)
+      const [C, B] = await Promise.all([
+        n.getCurrentUser(),
+        n.getPermissions(e.projectKey)
       ]);
-      p && (m(g), d(b), await l());
+      y && (g(C), u(B), await p());
     }
     return w(), () => {
-      p = !1;
+      y = !1;
     };
-  }, [t, e.projectKey, l]);
-  const k = F(
-    async (p) => {
-      const w = await t.createFeedback(p);
-      return s((g) => [w, ...g]), w;
+  }, [n, e.projectKey, p]);
+  const b = W(
+    async (y) => {
+      const w = await n.createFeedback(y);
+      return v((C) => [w, ...C]), w;
     },
-    [t]
-  ), h = F(
-    async (p) => {
-      const w = await t.resolveFeedback(p, (i == null ? void 0 : i.email) ?? "");
-      return s(
-        (g) => g.map((b) => b.id === p ? w : b)
-      ), w;
+    [n]
+  ), E = W(
+    async (y, w) => {
+      const C = await n.updateFeedback(y, w);
+      return v(
+        (B) => B.map((D) => D.id === y ? C : D)
+      ), C;
     },
-    [t, i == null ? void 0 : i.email]
-  ), f = $(
+    [n]
+  ), x = W(
+    (y) => n.listMessages(y),
+    [n]
+  ), A = W(
+    (y) => n.createMessage(y),
+    [n]
+  ), h = W(
+    async (y, w) => {
+      const C = e.uploadAttachment ?? n.uploadAttachment;
+      if (!C)
+        throw new Error("Review Lens attachment upload is not configured");
+      return C(y, w);
+    },
+    [n, e]
+  ), R = re(
     () => ({
       config: e,
-      adapter: t,
-      currentUser: i,
-      permissions: v,
-      feedback: c,
-      normalizedPath: r,
-      refreshFeedback: l,
-      createFeedback: k,
-      resolveFeedback: h
+      adapter: n,
+      currentUser: c,
+      permissions: f,
+      feedback: d,
+      normalizedPath: s,
+      refreshFeedback: p,
+      createFeedback: b,
+      updateFeedback: E,
+      listMessages: x,
+      createMessage: A,
+      uploadAttachment: h
     }),
     [
-      t,
+      n,
       e,
-      k,
-      i,
+      b,
       c,
-      r,
-      v,
-      l,
+      d,
+      s,
+      f,
+      p,
+      E,
+      x,
+      A,
       h
     ]
   );
-  return /* @__PURE__ */ a(_.Provider, { value: f, children: o });
+  return /* @__PURE__ */ i(ze.Provider, { value: R, children: t });
 }
-function re() {
-  const e = H(_);
+function Nt() {
+  const e = ot(ze);
   if (!e)
     throw new Error("useReviewLens must be used inside ReviewLensProvider");
   return e;
 }
-function U(e, o) {
+function Be(e, t) {
   if (!e)
-    throw new Error(`review-lens-react requires config.${o} when no adapter is provided`);
+    throw new Error(`review-lens-react requires config.${t} when no adapter is provided`);
   return e;
 }
-const ie = [
+const xt = [
   "data-review-id",
   "data-testid",
   "data-test-id",
   "aria-label",
   "name"
 ];
-function M(e) {
-  const o = e.getBoundingClientRect(), t = se(e);
+function X(e) {
+  const t = e.getBoundingClientRect(), n = Et(e);
   return {
-    selector: t.selector,
-    selectorStrategy: t.strategy,
-    fingerprint: de(e, o),
-    cssSnapshot: ce(e, o),
-    rect: o
+    selector: n.selector,
+    selectorStrategy: n.strategy,
+    fingerprint: Lt(e, t),
+    cssSnapshot: Ft(e, t),
+    rect: t
   };
 }
-function se(e) {
-  for (const o of ie) {
-    const t = e.getAttribute(o);
-    if (t)
+function Et(e) {
+  for (const t of xt) {
+    const n = e.getAttribute(t);
+    if (n)
       return {
-        selector: `[${o}="${z(t)}"]`,
+        selector: `[${t}="${$e(n)}"]`,
         strategy: "stable-attribute"
       };
   }
-  return e.id ? { selector: `#${z(e.id)}`, strategy: "stable-attribute" } : { selector: ae(e), strategy: "css-path" };
-}
-function ae(e) {
-  const o = [];
-  let t = e;
-  for (; t && t.nodeType === Node.ELEMENT_NODE && t !== document.body; ) {
-    const n = t.parentElement, r = t.tagName.toLowerCase();
-    if (!n) {
-      o.unshift(r);
+  return e.id ? { selector: `#${$e(e.id)}`, strategy: "stable-attribute" } : { selector: At(e), strategy: "css-path" };
+}
+function At(e) {
+  const t = [];
+  let n = e;
+  for (; n && n.nodeType === Node.ELEMENT_NODE && n !== document.body; ) {
+    const a = n.parentElement, s = n.tagName.toLowerCase();
+    if (!a) {
+      t.unshift(s);
       break;
     }
-    const i = t.tagName, m = Array.from(n.children).filter(
-      (d) => d.tagName === i
-    ), v = m.indexOf(t) + 1;
-    o.unshift(m.length > 1 ? `${r}:nth-of-type(${v})` : r), t = n;
+    const c = n.tagName, g = Array.from(a.children).filter(
+      (u) => u.tagName === c
+    ), f = g.indexOf(n) + 1;
+    t.unshift(g.length > 1 ? `${s}:nth-of-type(${f})` : s), n = a;
   }
-  return o.join(" > ");
+  return t.join(" > ");
 }
-function de(e, o) {
-  var t;
+function Lt(e, t) {
+  var n;
   return {
     tagName: e.tagName.toLowerCase(),
     id: e.id || void 0,
     className: e.getAttribute("class") || void 0,
-    textSnippet: ((t = e.textContent) == null ? void 0 : t.trim().slice(0, 80)) || void 0,
+    textSnippet: ((n = e.textContent) == null ? void 0 : n.trim().slice(0, 80)) || void 0,
     ariaLabel: e.getAttribute("aria-label") || void 0,
-    width: Math.round(o.width),
-    height: Math.round(o.height)
+    width: Math.round(t.width),
+    height: Math.round(t.height)
   };
 }
-function ce(e, o) {
-  const t = window.getComputedStyle(e);
+function Ft(e, t) {
+  const n = window.getComputedStyle(e);
   return {
-    margin: A(t.marginTop, t.marginRight, t.marginBottom, t.marginLeft),
-    marginTop: t.marginTop,
-    marginRight: t.marginRight,
-    marginBottom: t.marginBottom,
-    marginLeft: t.marginLeft,
-    padding: A(
-      t.paddingTop,
-      t.paddingRight,
-      t.paddingBottom,
-      t.paddingLeft
+    margin: de(n.marginTop, n.marginRight, n.marginBottom, n.marginLeft),
+    marginTop: n.marginTop,
+    marginRight: n.marginRight,
+    marginBottom: n.marginBottom,
+    marginLeft: n.marginLeft,
+    padding: de(
+      n.paddingTop,
+      n.paddingRight,
+      n.paddingBottom,
+      n.paddingLeft
     ),
-    paddingTop: t.paddingTop,
-    paddingRight: t.paddingRight,
-    paddingBottom: t.paddingBottom,
-    paddingLeft: t.paddingLeft,
-    border: A(
-      t.borderTopWidth,
-      t.borderRightWidth,
-      t.borderBottomWidth,
-      t.borderLeftWidth
+    paddingTop: n.paddingTop,
+    paddingRight: n.paddingRight,
+    paddingBottom: n.paddingBottom,
+    paddingLeft: n.paddingLeft,
+    border: de(
+      n.borderTopWidth,
+      n.borderRightWidth,
+      n.borderBottomWidth,
+      n.borderLeftWidth
     ),
-    borderTopWidth: t.borderTopWidth,
-    borderRightWidth: t.borderRightWidth,
-    borderBottomWidth: t.borderBottomWidth,
-    borderLeftWidth: t.borderLeftWidth,
-    fontFamily: t.fontFamily,
-    fontSize: t.fontSize,
-    lineHeight: t.lineHeight,
-    color: t.color,
-    backgroundColor: t.backgroundColor,
-    width: Math.round(o.width),
-    height: Math.round(o.height)
+    borderTopWidth: n.borderTopWidth,
+    borderRightWidth: n.borderRightWidth,
+    borderBottomWidth: n.borderBottomWidth,
+    borderLeftWidth: n.borderLeftWidth,
+    fontFamily: n.fontFamily,
+    fontSize: n.fontSize,
+    lineHeight: n.lineHeight,
+    color: n.color,
+    backgroundColor: n.backgroundColor,
+    borderRadius: n.borderRadius,
+    width: Math.round(t.width),
+    height: Math.round(t.height)
   };
 }
-function A(e, o, t, n) {
-  return e === o && o === t && t === n ? e : `${e} ${o} ${t} ${n}`;
+function de(e, t, n, a) {
+  return e === t && t === n && n === a ? e : `${e} ${t} ${n} ${a}`;
 }
-function z(e) {
+function $e(e) {
   return typeof CSS < "u" && typeof CSS.escape == "function" ? CSS.escape(e) : e.replace(/["\\]/g, "\\$&");
 }
-function be({
+const Mt = [
+  { label: "Desktop", value: "desktop" },
+  { label: "Tablet", value: "tablet" },
+  { label: "Mobile", value: "mobile" }
+], He = [
+  "open",
+  "in_progress",
+  "needs_clarification",
+  "fixed",
+  "wontfix",
+  "resolved"
+], je = ["low", "medium", "high"], Oe = ["bug", "visual", "copy", "accessibility", "responsive"], ae = {
+  open: "Open",
+  in_progress: "In progress",
+  needs_clarification: "Needs clarification",
+  fixed: "Fixed",
+  wontfix: "Won't fix",
+  resolved: "Resolved"
+}, Q = {
+  low: "Low",
+  medium: "Medium",
+  high: "High"
+}, Z = {
+  bug: "Bug",
+  visual: "Visual",
+  copy: "Copy",
+  accessibility: "Accessibility",
+  responsive: "Responsive"
+};
+function Qt({
   open: e,
-  onOpenChange: o,
-  placement: t = "top-right",
-  showResolved: n = !1
+  onOpenChange: t,
+  placement: n = "top-right",
+  showResolved: a = !1,
+  syncSelectionToUrl: s = !1,
+  responsivePresets: c = Mt
 }) {
+  var Fe;
   const {
-    config: r,
-    currentUser: i,
-    feedback: m,
+    adapter: g,
+    config: f,
+    currentUser: u,
+    feedback: d,
     normalizedPath: v,
-    permissions: d,
-    createFeedback: c,
-    resolveFeedback: s
-  } = re(), [l, k] = N(), [h, f] = N(), [p, w] = N(""), [g, b] = N(), L = d.includes("create"), I = d.includes("resolve"), R = $(
-    () => m.filter((u) => n || u.status !== "resolved"),
-    [m, n]
-  );
-  P(() => {
-    e || (k(void 0), f(void 0), w(""));
-  }, [e]);
-  const x = F((u) => {
-    const E = u.target instanceof Element ? u.target : null;
-    if (E)
-      return E.closest("[data-review-lens-ui]") ? null : E;
-    const C = document.elementFromPoint(u.clientX, u.clientY);
-    return !C || C.closest("[data-review-lens-ui]") ? null : C;
+    permissions: p,
+    createFeedback: b,
+    updateFeedback: E,
+    listMessages: x,
+    createMessage: A,
+    uploadAttachment: h
+  } = Nt(), [R, y] = k(), [w, C] = k(), [B, D] = k(""), [ue, Je] = k("medium"), [pe, qe] = k("visual"), [me, ge] = k(""), [fe, Ve] = k(
+    ((Fe = c[0]) == null ? void 0 : Fe.value) ?? "desktop"
+  ), [S, H] = k(), [M, $] = k("review"), [Ge, be] = k(!1), [j, ve] = k("all"), [O, we] = k("all"), [K, ye] = k("all"), [J, Se] = k("all"), [q, ke] = k("all"), [Ye, Xe] = k(!1), [Qe, Ce] = k({}), [se, oe] = k(""), ee = We(null), I = !!u, T = p.includes("create"), Ne = p.includes("reply"), xe = p.includes("update"), Ze = p.includes("assign"), P = R ?? w, et = !!w, tt = !!(f.captureScreenshot && (f.uploadAttachment || g.uploadAttachment)), nt = re(() => {
+    const r = d.map((m) => m.assigneeEmail).filter((m) => !!m);
+    return u != null && u.email && r.push(u.email), Array.from(new Set(r)).sort((m, l) => m.localeCompare(l));
+  }, [u == null ? void 0 : u.email, d]), L = re(
+    () => d.filter((r) => a || r.status !== "resolved").filter((r) => j === "all" || r.status === j).filter((r) => O === "all" || r.severity === O).filter((r) => K === "all" || r.category === K).filter((r) => J === "all" || r.assigneeEmail === J).filter((r) => q === "all" || r.viewportPreset === q),
+    [
+      J,
+      K,
+      d,
+      O,
+      a,
+      j,
+      q
+    ]
+  ), it = [
+    j,
+    O,
+    K,
+    J,
+    q
+  ].filter((r) => r !== "all").length;
+  _(() => {
+    e || (y(void 0), C(void 0), D(""), oe(""), $("review"));
+  }, [e]), _(() => {
+    I || (y(void 0), C(void 0));
+  }, [I]), _(() => {
+    !w || M !== "review" || window.requestAnimationFrame(() => {
+      var r, m, l;
+      (m = (r = ee.current) == null ? void 0 : r.scrollIntoView) == null || m.call(r, { block: "nearest" }), (l = ee.current) == null || l.focus();
+    });
+  }, [w, M]), _(() => {
+    if (!S)
+      return;
+    let r = !0;
+    return x(S.id).then((m) => {
+      r && Ce((l) => ({ ...l, [S.id]: m }));
+    }), () => {
+      r = !1;
+    };
+  }, [x, S]), _(() => {
+    if (!e || !s || S || d.length === 0)
+      return;
+    const r = new URL(window.location.href).searchParams.get("reviewLensFeedback"), m = d.find((l) => l.id === r);
+    m && V(m, { syncUrl: !1 });
+  }, [d, e, S, s]), _(() => {
+    if (!e)
+      return;
+    function r(l) {
+      var N;
+      if (l.key === "Shift" && be(!0), l.key === "Escape") {
+        l.preventDefault(), t == null || t(!1);
+        return;
+      }
+      Kt(l.target) || ((l.key === "n" || l.key === "ArrowDown") && (l.preventDefault(), Ee(1)), (l.key === "p" || l.key === "ArrowUp") && (l.preventDefault(), Ee(-1)), l.key === "c" && (l.preventDefault(), $("review"), (N = ee.current) == null || N.focus()), l.key === "f" && S && xe && (l.preventDefault(), Le(S)));
+    }
+    function m(l) {
+      l.key === "Shift" && be(!1);
+    }
+    return window.addEventListener("keydown", r), window.addEventListener("keyup", m), () => {
+      window.removeEventListener("keydown", r), window.removeEventListener("keyup", m);
+    };
+  });
+  const le = W((r) => {
+    const m = r.target instanceof Element ? r.target : null;
+    if (m)
+      return m.closest("[data-review-lens-ui]") ? null : m;
+    const l = document.elementFromPoint(r.clientX, r.clientY);
+    return !l || l.closest("[data-review-lens-ui]") ? null : l;
   }, []);
-  if (P(() => {
-    if (!e || h)
+  if (_(() => {
+    if (!e || !I)
       return;
-    function u(C) {
-      const B = x(C);
-      k(B ? M(B) : void 0);
+    function r(l) {
+      const N = le(l);
+      y(N ? X(N) : void 0);
     }
-    function E(C) {
-      const B = x(C);
-      B && (C.preventDefault(), C.stopPropagation(), f(M(B)));
+    function m(l) {
+      const N = le(l);
+      N && (l.preventDefault(), l.stopPropagation(), C(X(N)), $("review"));
     }
-    return window.addEventListener("mousemove", u, !0), window.addEventListener("click", E, !0), () => {
-      window.removeEventListener("mousemove", u, !0), window.removeEventListener("click", E, !0);
+    return window.addEventListener("mousemove", r, !0), window.addEventListener("click", m, !0), () => {
+      window.removeEventListener("mousemove", r, !0), window.removeEventListener("click", m, !0);
     };
-  }, [x, h, e]), !e)
+  }, [I, le, e]), !e)
     return null;
-  const T = h ?? l;
-  async function J() {
-    !h || !p.trim() || !i || !L || (await c({
-      projectKey: r.projectKey,
-      contentId: r.contentId,
-      normalizedPath: v,
-      originalUrl: r.currentUrl ?? window.location.href,
-      selector: h.selector,
-      selectorStrategy: h.selectorStrategy,
-      elementFingerprint: h.fingerprint,
-      cssSnapshot: h.cssSnapshot,
-      comment: p.trim(),
-      authorEmail: i.email
-    }), w(""), f(void 0));
+  function V(r, m = { syncUrl: !0 }) {
+    var N;
+    if (H(r), C(void 0), $("feedback"), s && m.syncUrl !== !1) {
+      const te = new URL(window.location.href);
+      te.searchParams.set("reviewLensFeedback", r.id), window.history.replaceState({}, "", te);
+    }
+    const l = z(r.selector);
+    if (!l) {
+      y(void 0);
+      return;
+    }
+    (N = l.scrollIntoView) == null || N.call(l, { behavior: "smooth", block: "center", inline: "center" }), window.requestAnimationFrame(() => {
+      y(X(l));
+    });
   }
-  return /* @__PURE__ */ S("div", { className: "review-lens-root", "data-review-lens-ui": !0, children: [
-    T ? /* @__PURE__ */ a(le, { target: T, locked: !!h }) : null,
-    /* @__PURE__ */ a(
-      he,
-      {
-        feedback: R,
-        selectedFeedback: g,
-        onSelect: b
+  function Ee(r) {
+    if (L.length === 0)
+      return;
+    const m = S ? L.findIndex((N) => N.id === S.id) : -1, l = m < 0 ? r > 0 ? 0 : L.length - 1 : (m + r + L.length) % L.length;
+    V(L[l]);
+  }
+  async function Ae() {
+    if (!w || !B.trim() || !u || !T)
+      return;
+    let r = await b({
+      projectKey: f.projectKey,
+      contentId: f.contentId,
+      normalizedPath: v,
+      originalUrl: f.currentUrl ?? window.location.href,
+      selector: w.selector,
+      selectorStrategy: w.selectorStrategy,
+      elementFingerprint: w.fingerprint,
+      createdCssSnapshot: w.cssSnapshot,
+      comment: B.trim(),
+      status: "open",
+      severity: ue,
+      category: pe,
+      assigneeEmail: me.trim() || void 0,
+      viewportWidth: window.innerWidth,
+      viewportHeight: window.innerHeight,
+      viewportPreset: fe,
+      screenshotUrl: void 0,
+      screenshotThumbnailUrl: void 0,
+      authorEmail: u.email
+    });
+    if (f.captureScreenshot)
+      try {
+        const m = await f.captureScreenshot(w), l = await h(r.id, {
+          type: "screenshot",
+          data: m,
+          createdBy: u.email
+        });
+        r = await E(r.id, {
+          attachments: [l],
+          screenshotUrl: l.url,
+          screenshotThumbnailUrl: l.thumbnailUrl
+        });
+      } catch {
       }
-    ),
-    /* @__PURE__ */ S("aside", { className: `review-lens-panel review-lens-panel--${t}`, "data-review-lens-ui": !0, children: [
-      /* @__PURE__ */ S("header", { className: "review-lens-panel__header", children: [
-        /* @__PURE__ */ S("div", { children: [
-          /* @__PURE__ */ a("p", { className: "review-lens-kicker", children: "Review Lens" }),
-          /* @__PURE__ */ a("h2", { children: h ? "Element locked" : "Inspecting" })
+    D(""), ge(""), C(void 0), y(void 0), $("feedback"), H(r);
+  }
+  async function rt(r, m) {
+    const l = (/* @__PURE__ */ new Date()).toISOString(), N = m === "resolved" ? { status: m, resolvedAt: l, resolvedBy: u == null ? void 0 : u.email } : { status: m }, te = await E(r.id, N);
+    H(te);
+  }
+  async function Le(r) {
+    const m = z(r.selector);
+    if (!m || !u)
+      return;
+    const l = X(m), N = await E(r.id, {
+      status: "fixed",
+      fixedCssSnapshot: l.cssSnapshot,
+      fixedAt: (/* @__PURE__ */ new Date()).toISOString(),
+      fixedBy: u.email
+    });
+    H(N);
+  }
+  async function at(r) {
+    if (!se.trim() || !u || !Ne)
+      return;
+    const m = await A({
+      feedbackId: r.id,
+      body: se.trim(),
+      authorEmail: u.email
+    });
+    Ce((l) => ({
+      ...l,
+      [r.id]: [...l[r.id] ?? [], m]
+    })), oe("");
+  }
+  return /* @__PURE__ */ o("div", { className: "review-lens-root", "data-review-lens-ui": !0, children: [
+    I && P ? /* @__PURE__ */ i($t, { target: P, locked: !!w }) : null,
+    I && w && R && Ge ? /* @__PURE__ */ i(_t, { from: w, to: R }) : null,
+    I ? /* @__PURE__ */ o(ie, { children: [
+      /* @__PURE__ */ i(
+        Pt,
+        {
+          feedback: L,
+          selectedFeedback: S,
+          onSelect: V
+        }
+      ),
+      /* @__PURE__ */ i(
+        Wt,
+        {
+          feedback: L,
+          selectedFeedback: S,
+          onSelect: V
+        }
+      )
+    ] }) : null,
+    /* @__PURE__ */ o("aside", { className: `review-lens-panel review-lens-panel--${n}`, "data-review-lens-ui": !0, children: [
+      /* @__PURE__ */ o("header", { className: "review-lens-panel__header", children: [
+        /* @__PURE__ */ o("div", { children: [
+          /* @__PURE__ */ i("p", { className: "review-lens-kicker", children: "Review Lens" }),
+          /* @__PURE__ */ i("h2", { children: M === "summary" ? "Summary" : M === "feedback" ? "Feedback" : w ? "Element locked" : "Inspecting" })
         ] }),
-        /* @__PURE__ */ a("button", { type: "button", onClick: () => o == null ? void 0 : o(!1), children: "Close" })
+        /* @__PURE__ */ i("button", { type: "button", onClick: () => t == null ? void 0 : t(!1), children: "Close" })
       ] }),
-      T ? /* @__PURE__ */ a(ue, { target: T }) : /* @__PURE__ */ a("p", { children: "Move over the app to inspect." }),
-      h ? /* @__PURE__ */ S(
-        "form",
-        {
-          className: "review-lens-feedback-form",
-          onSubmit: (u) => {
-            u.preventDefault(), J();
-          },
-          children: [
-            /* @__PURE__ */ a("label", { htmlFor: "review-lens-comment", children: "Feedback" }),
-            /* @__PURE__ */ a(
-              "textarea",
-              {
-                id: "review-lens-comment",
-                value: p,
-                disabled: !L,
-                onChange: (u) => w(u.target.value),
-                placeholder: L ? "Describe the UX issue..." : "You do not have permission to comment."
+      /* @__PURE__ */ o("div", { className: "review-lens-panel__body", children: [
+        /* @__PURE__ */ o("div", { className: "review-lens-mode-switch", role: "tablist", "aria-label": "Review Lens mode", children: [
+          /* @__PURE__ */ i(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-selected": M === "review",
+              onClick: () => $("review"),
+              children: "Review"
+            }
+          ),
+          /* @__PURE__ */ o(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-selected": M === "feedback",
+              onClick: () => $("feedback"),
+              children: [
+                "Feedback ",
+                /* @__PURE__ */ i("span", { children: L.length })
+              ]
+            }
+          ),
+          /* @__PURE__ */ i(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-selected": M === "summary",
+              onClick: () => $("summary"),
+              children: "Summary"
+            }
+          )
+        ] }),
+        M === "review" ? /* @__PURE__ */ o("div", { className: "review-lens-review-pane", role: "tabpanel", children: [
+          /* @__PURE__ */ o("div", { className: "review-lens-inspection", children: [
+            I ? null : /* @__PURE__ */ i("p", { children: "Authenticate with Google to inspect this page." }),
+            I && P ? /* @__PURE__ */ o(ie, { children: [
+              /* @__PURE__ */ i(Dt, { target: P }),
+              /* @__PURE__ */ i(_e, { title: "Accessibility", items: zt(P) }),
+              /* @__PURE__ */ i(
+                _e,
+                {
+                  title: "Design tokens",
+                  items: Ht(P.cssSnapshot, f.designTokens)
+                }
+              )
+            ] }) : null,
+            I && !P ? /* @__PURE__ */ i("p", { children: "Move over the app to inspect." }) : null
+          ] }),
+          et ? /* @__PURE__ */ i("div", { className: "review-lens-composer-panel", children: /* @__PURE__ */ o(
+            "form",
+            {
+              className: "review-lens-feedback-form",
+              onSubmit: (r) => {
+                r.preventDefault(), Ae();
+              },
+              children: [
+                /* @__PURE__ */ i("label", { htmlFor: "review-lens-comment", children: "New feedback" }),
+                /* @__PURE__ */ i(
+                  "textarea",
+                  {
+                    ref: ee,
+                    id: "review-lens-comment",
+                    value: B,
+                    disabled: !T,
+                    onChange: (r) => D(r.target.value),
+                    onKeyDown: (r) => {
+                      r.key === "Enter" && r.metaKey && (r.preventDefault(), Ae());
+                    },
+                    placeholder: T ? "Describe the UX issue..." : "You do not have permission to comment."
+                  }
+                ),
+                /* @__PURE__ */ o("div", { className: "review-lens-form-grid", children: [
+                  /* @__PURE__ */ o("label", { children: [
+                    "Severity",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: ue,
+                        onChange: (r) => Je(r.target.value),
+                        disabled: !T,
+                        children: je.map((r) => /* @__PURE__ */ i("option", { value: r, children: Q[r] }, r))
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Type",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: pe,
+                        onChange: (r) => qe(r.target.value),
+                        disabled: !T,
+                        children: Oe.map((r) => /* @__PURE__ */ i("option", { value: r, children: Z[r] }, r))
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Assignee",
+                    /* @__PURE__ */ i(
+                      "input",
+                      {
+                        value: me,
+                        onChange: (r) => ge(r.target.value),
+                        disabled: !T,
+                        placeholder: "optional@email.com"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Viewport",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: fe,
+                        onChange: (r) => Ve(r.target.value),
+                        disabled: !T,
+                        children: c.map((r) => /* @__PURE__ */ i("option", { value: r.value, children: r.label }, r.value))
+                      }
+                    )
+                  ] })
+                ] }),
+                T ? /* @__PURE__ */ o("p", { className: "review-lens-feedback-form__hint", children: [
+                  "Press ",
+                  /* @__PURE__ */ i("kbd", { children: "Command" }),
+                  " + ",
+                  /* @__PURE__ */ i("kbd", { children: "Enter" }),
+                  " to submit.",
+                  tt ? " Screenshot capture runs after save." : ""
+                ] }) : null,
+                /* @__PURE__ */ i("div", { className: "review-lens-actions", children: /* @__PURE__ */ i("button", { type: "submit", disabled: !B.trim() || !T, children: "Save feedback" }) })
+              ]
+            }
+          ) }) : null
+        ] }) : null,
+        M === "feedback" ? /* @__PURE__ */ o("div", { className: "review-lens-comments", children: [
+          /* @__PURE__ */ i(
+            It,
+            {
+              open: Ye,
+              activeCount: it,
+              statusFilter: j,
+              severityFilter: O,
+              categoryFilter: K,
+              assigneeFilter: J,
+              viewportFilter: q,
+              assignees: nt,
+              responsivePresets: c,
+              onStatusChange: ve,
+              onSeverityChange: we,
+              onCategoryChange: ye,
+              onAssigneeChange: Se,
+              onViewportChange: ke,
+              onToggle: () => Xe((r) => !r),
+              onClear: () => {
+                ve("all"), we("all"), ye("all"), Se("all"), ke("all");
               }
-            ),
-            /* @__PURE__ */ S("div", { className: "review-lens-actions", children: [
-              /* @__PURE__ */ a("button", { type: "button", onClick: () => f(void 0), children: "Unlock" }),
-              /* @__PURE__ */ a("button", { type: "submit", disabled: !p.trim() || !L, children: "Save feedback" })
+            }
+          ),
+          /* @__PURE__ */ o("div", { className: "review-lens-list-panel", children: [
+            /* @__PURE__ */ o("div", { className: "review-lens-comments__header", children: [
+              /* @__PURE__ */ i("h3", { children: "All feedback" }),
+              /* @__PURE__ */ i("span", { children: L.length })
+            ] }),
+            /* @__PURE__ */ o("div", { className: "review-lens-comments__list", children: [
+              L.length === 0 ? /* @__PURE__ */ i("p", { children: "No feedback for this view." }) : null,
+              L.map((r) => /* @__PURE__ */ i(
+                Tt,
+                {
+                  item: r,
+                  selected: (S == null ? void 0 : S.id) === r.id,
+                  onSelect: V
+                },
+                r.id
+              ))
             ] })
-          ]
-        }
-      ) : null,
-      /* @__PURE__ */ S("section", { className: "review-lens-comments", children: [
-        /* @__PURE__ */ a("h3", { children: "Page feedback" }),
-        R.length === 0 ? /* @__PURE__ */ a("p", { children: "No feedback for this view." }) : null,
-        R.map((u) => /* @__PURE__ */ S(
-          "article",
+          ] }),
+          S ? /* @__PURE__ */ o("div", { className: "review-lens-selected-panel", children: [
+            /* @__PURE__ */ i("div", { className: "review-lens-selected-panel__label", children: "Selected feedback" }),
+            /* @__PURE__ */ i(
+              Rt,
+              {
+                item: S,
+                messages: Qe[S.id] ?? [],
+                messageDraft: se,
+                canReply: Ne,
+                canUpdate: xe,
+                canAssign: Ze,
+                onMessageDraftChange: oe,
+                onSubmitMessage: () => void at(S),
+                onStatusChange: (r) => void rt(S, r),
+                onAssigneeChange: (r) => void E(S.id, {
+                  assigneeEmail: r.trim() || void 0
+                }).then(H),
+                onMarkFixed: () => void Le(S)
+              },
+              S.id
+            )
+          ] }) : /* @__PURE__ */ o("div", { className: "review-lens-selected-panel review-lens-selected-panel--empty", children: [
+            /* @__PURE__ */ i("div", { className: "review-lens-selected-panel__label", children: "Selected feedback" }),
+            /* @__PURE__ */ i("p", { children: "Select a feedback item above to review status, assignment, drift, and replies." })
+          ] })
+        ] }) : null,
+        M === "summary" ? /* @__PURE__ */ i(Bt, { feedback: d }) : null
+      ] })
+    ] })
+  ] });
+}
+function It({
+  open: e,
+  activeCount: t,
+  statusFilter: n,
+  severityFilter: a,
+  categoryFilter: s,
+  assigneeFilter: c,
+  viewportFilter: g,
+  assignees: f,
+  responsivePresets: u,
+  onStatusChange: d,
+  onSeverityChange: v,
+  onCategoryChange: p,
+  onAssigneeChange: b,
+  onViewportChange: E,
+  onToggle: x,
+  onClear: A
+}) {
+  return /* @__PURE__ */ o("div", { className: "review-lens-filter-shell", children: [
+    /* @__PURE__ */ o("div", { className: "review-lens-filter-bar", children: [
+      /* @__PURE__ */ o("button", { type: "button", "aria-expanded": e, onClick: x, children: [
+        "Filters",
+        t > 0 ? /* @__PURE__ */ i("span", { children: t }) : null
+      ] }),
+      t > 0 ? /* @__PURE__ */ i("button", { type: "button", onClick: A, children: "Clear" }) : null
+    ] }),
+    e ? /* @__PURE__ */ o("div", { className: "review-lens-filters", children: [
+      /* @__PURE__ */ o("label", { children: [
+        "Status",
+        /* @__PURE__ */ o(
+          "select",
+          {
+            "aria-label": "Filter status",
+            value: n,
+            onChange: (h) => d(h.target.value),
+            children: [
+              /* @__PURE__ */ i("option", { value: "all", children: "All statuses" }),
+              He.map((h) => /* @__PURE__ */ i("option", { value: h, children: ae[h] }, h))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o("label", { children: [
+        "Priority",
+        /* @__PURE__ */ o(
+          "select",
+          {
+            "aria-label": "Filter severity",
+            value: a,
+            onChange: (h) => v(h.target.value),
+            children: [
+              /* @__PURE__ */ i("option", { value: "all", children: "All priorities" }),
+              je.map((h) => /* @__PURE__ */ i("option", { value: h, children: Q[h] }, h))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o("label", { children: [
+        "Type",
+        /* @__PURE__ */ o(
+          "select",
+          {
+            "aria-label": "Filter type",
+            value: s,
+            onChange: (h) => p(h.target.value),
+            children: [
+              /* @__PURE__ */ i("option", { value: "all", children: "All types" }),
+              Oe.map((h) => /* @__PURE__ */ i("option", { value: h, children: Z[h] }, h))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o("label", { children: [
+        "Assignee",
+        /* @__PURE__ */ o(
+          "select",
+          {
+            "aria-label": "Filter assignee",
+            value: c,
+            onChange: (h) => b(h.target.value),
+            children: [
+              /* @__PURE__ */ i("option", { value: "all", children: "All assignees" }),
+              f.map((h) => /* @__PURE__ */ i("option", { value: h, children: h }, h))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o("label", { children: [
+        "Viewport",
+        /* @__PURE__ */ o(
+          "select",
           {
-            className: (g == null ? void 0 : g.id) === u.id ? "review-lens-comment review-lens-comment--selected" : "review-lens-comment",
+            "aria-label": "Filter viewport",
+            value: g,
+            onChange: (h) => E(h.target.value),
             children: [
-              /* @__PURE__ */ a("p", { children: u.comment }),
-              /* @__PURE__ */ a("span", { children: u.authorEmail }),
-              u.status === "open" && I ? /* @__PURE__ */ a("button", { type: "button", onClick: () => void s(u.id), children: "Resolve" }) : null
+              /* @__PURE__ */ i("option", { value: "all", children: "All viewports" }),
+              u.map((h) => /* @__PURE__ */ i("option", { value: h.value, children: h.label }, h.value))
             ]
-          },
-          u.id
-        ))
+          }
+        )
       ] })
+    ] }) : null
+  ] });
+}
+function Tt({
+  item: e,
+  selected: t,
+  onSelect: n
+}) {
+  const a = Ke(e);
+  return /* @__PURE__ */ o(
+    "article",
+    {
+      tabIndex: 0,
+      className: [
+        "review-lens-comment",
+        `review-lens-comment--${e.severity}`,
+        t ? "review-lens-comment--selected" : ""
+      ].filter(Boolean).join(" "),
+      onClick: () => n(e),
+      onKeyDown: (s) => {
+        (s.key === "Enter" || s.key === " ") && (s.preventDefault(), n(e));
+      },
+      children: [
+        /* @__PURE__ */ o("div", { className: "review-lens-comment__header", children: [
+          /* @__PURE__ */ i("span", { children: ae[e.status] }),
+          /* @__PURE__ */ i("strong", { children: Q[e.severity] })
+        ] }),
+        /* @__PURE__ */ o("div", { className: "review-lens-comment__content", children: [
+          /* @__PURE__ */ i("p", { children: e.comment }),
+          /* @__PURE__ */ o("span", { children: [
+            e.authorEmail,
+            e.assigneeEmail ? ` -> ${e.assigneeEmail}` : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ o("div", { className: "review-lens-tags", children: [
+          /* @__PURE__ */ i("span", { children: Z[e.category] }),
+          /* @__PURE__ */ i("span", { children: e.viewportPreset }),
+          /* @__PURE__ */ i("span", { children: a.label })
+        ] })
+      ]
+    }
+  );
+}
+function Rt({
+  item: e,
+  messages: t,
+  messageDraft: n,
+  canReply: a,
+  canUpdate: s,
+  canAssign: c,
+  onMessageDraftChange: g,
+  onSubmitMessage: f,
+  onStatusChange: u,
+  onAssigneeChange: d,
+  onMarkFixed: v
+}) {
+  const p = Ke(e);
+  return /* @__PURE__ */ o("section", { className: "review-lens-detail", "aria-label": "Selected feedback detail", children: [
+    /* @__PURE__ */ o("div", { className: "review-lens-detail__header", children: [
+      /* @__PURE__ */ o("h3", { children: [
+        Z[e.category],
+        " feedback"
+      ] }),
+      /* @__PURE__ */ i("strong", { children: Q[e.severity] })
+    ] }),
+    /* @__PURE__ */ i("blockquote", { children: e.comment }),
+    /* @__PURE__ */ o("dl", { className: "review-lens-detail-meta", children: [
+      /* @__PURE__ */ o("div", { children: [
+        /* @__PURE__ */ i("dt", { children: "Target" }),
+        /* @__PURE__ */ i("dd", { children: p.label })
+      ] }),
+      /* @__PURE__ */ o("div", { children: [
+        /* @__PURE__ */ i("dt", { children: "Viewport" }),
+        /* @__PURE__ */ i("dd", { children: e.viewportPreset })
+      ] }),
+      e.screenshotUrl ? /* @__PURE__ */ o("div", { children: [
+        /* @__PURE__ */ i("dt", { children: "Evidence" }),
+        /* @__PURE__ */ i("dd", { children: /* @__PURE__ */ i("a", { href: e.screenshotUrl, target: "_blank", rel: "noreferrer", children: "Screenshot" }) })
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ o("div", { className: "review-lens-form-grid", children: [
+      /* @__PURE__ */ o("label", { children: [
+        "Status",
+        /* @__PURE__ */ i(
+          "select",
+          {
+            value: e.status,
+            disabled: !s,
+            onChange: (b) => u(b.target.value),
+            children: He.map((b) => /* @__PURE__ */ i("option", { value: b, children: ae[b] }, b))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ o("label", { children: [
+        "Assignee",
+        /* @__PURE__ */ i(
+          "input",
+          {
+            defaultValue: e.assigneeEmail ?? "",
+            disabled: !c,
+            onBlur: (b) => d(b.target.value),
+            placeholder: "optional@email.com"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ o("div", { className: "review-lens-status-actions", children: [
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          className: "review-lens-button-secondary",
+          disabled: !s,
+          onClick: v,
+          children: "Mark fixed"
+        }
+      ),
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          className: "review-lens-button-primary",
+          disabled: !s,
+          onClick: () => u("resolved"),
+          children: "Resolve"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ o("div", { className: "review-lens-thread", children: [
+      /* @__PURE__ */ o("div", { className: "review-lens-thread__header", children: [
+        /* @__PURE__ */ i("h3", { children: "Thread" }),
+        /* @__PURE__ */ i("span", { children: t.length })
+      ] }),
+      t.length === 0 ? /* @__PURE__ */ i("p", { children: "No replies yet." }) : null,
+      t.map((b) => /* @__PURE__ */ o("div", { className: "review-lens-thread__message", children: [
+        /* @__PURE__ */ i("p", { children: b.body }),
+        /* @__PURE__ */ i("span", { children: b.authorEmail })
+      ] }, b.id)),
+      /* @__PURE__ */ i(
+        "textarea",
+        {
+          "aria-label": "Reply",
+          value: n,
+          disabled: !a,
+          onChange: (b) => g(b.target.value),
+          placeholder: a ? "Reply..." : "You do not have permission to reply."
+        }
+      ),
+      /* @__PURE__ */ i("div", { className: "review-lens-actions", children: /* @__PURE__ */ i("button", { type: "button", disabled: !n.trim() || !a, onClick: f, children: "Reply" }) })
     ] })
   ] });
 }
-function le({ target: e, locked: o }) {
-  const t = me(e);
-  return /* @__PURE__ */ S(
+function Bt({ feedback: e }) {
+  return /* @__PURE__ */ o("div", { className: "review-lens-summary", role: "tabpanel", children: [
+    /* @__PURE__ */ i(G, { title: "Status", values: Y(e, (t) => ae[t.status]) }),
+    /* @__PURE__ */ i(G, { title: "Severity", values: Y(e, (t) => Q[t.severity]) }),
+    /* @__PURE__ */ i(G, { title: "Type", values: Y(e, (t) => Z[t.category]) }),
+    /* @__PURE__ */ i(G, { title: "Assignee", values: Y(e, (t) => t.assigneeEmail ?? "Unassigned") }),
+    /* @__PURE__ */ i(G, { title: "Viewport", values: Y(e, (t) => t.viewportPreset) })
+  ] });
+}
+function G({ title: e, values: t }) {
+  return /* @__PURE__ */ o("section", { children: [
+    /* @__PURE__ */ i("h3", { children: e }),
+    /* @__PURE__ */ i("dl", { children: t.map(([n, a]) => /* @__PURE__ */ o("div", { children: [
+      /* @__PURE__ */ i("dt", { children: n }),
+      /* @__PURE__ */ i("dd", { children: a })
+    ] }, n)) })
+  ] });
+}
+function $t({ target: e, locked: t }) {
+  const n = Vt(e), a = jt(e.fingerprint);
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: o ? "review-lens-highlight review-lens-highlight--locked" : "review-lens-highlight",
+      className: t ? "review-lens-highlight review-lens-highlight--locked" : "review-lens-highlight",
       style: {
-        top: t.margin.top,
-        left: t.margin.left,
-        width: t.margin.width,
-        height: t.margin.height
+        top: n.margin.top,
+        left: n.margin.left,
+        width: n.margin.width,
+        height: n.margin.height
       },
       children: [
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ i(
           "div",
           {
             className: "review-lens-highlight__border",
             style: {
-              top: t.border.top - t.margin.top,
-              left: t.border.left - t.margin.left,
-              width: t.border.width,
-              height: t.border.height
+              top: n.border.top - n.margin.top,
+              left: n.border.left - n.margin.left,
+              width: n.border.width,
+              height: n.border.height
             }
           }
         ),
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ i(
           "div",
           {
             className: "review-lens-highlight__padding",
             style: {
-              top: t.padding.top - t.margin.top,
-              left: t.padding.left - t.margin.left,
-              width: t.padding.width,
-              height: t.padding.height
+              top: n.padding.top - n.margin.top,
+              left: n.padding.left - n.margin.left,
+              width: n.padding.width,
+              height: n.padding.height
             }
           }
         ),
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ i(
           "div",
           {
             className: "review-lens-highlight__content",
             style: {
-              top: t.content.top - t.margin.top,
-              left: t.content.left - t.margin.left,
-              width: t.content.width,
-              height: t.content.height
+              top: n.content.top - n.margin.top,
+              left: n.content.left - n.margin.left,
+              width: n.content.width,
+              height: n.content.height
             }
           }
         ),
-        /* @__PURE__ */ S("div", { className: "review-lens-highlight__label", children: [
-          Math.round(e.rect.width),
-          " x ",
-          Math.round(e.rect.height)
+        /* @__PURE__ */ o("div", { className: "review-lens-highlight__label", children: [
+          /* @__PURE__ */ i("strong", { children: a }),
+          /* @__PURE__ */ o("span", { children: [
+            Math.round(e.rect.width),
+            " x ",
+            Math.round(e.rect.height)
+          ] })
         ] })
       ]
     }
   );
 }
-function he({
+function _t({ from: e, to: t }) {
+  const n = Ot(e.rect, t.rect);
+  return n.length === 0 ? null : /* @__PURE__ */ i(ie, { children: n.map((a) => /* @__PURE__ */ i(
+    "div",
+    {
+      className: `review-lens-distance review-lens-distance--${a.axis}`,
+      style: {
+        top: a.top,
+        left: a.left,
+        width: a.width,
+        height: a.height
+      },
+      children: /* @__PURE__ */ i("span", { children: a.label })
+    },
+    a.key
+  )) });
+}
+function Pt({
+  feedback: e,
+  selectedFeedback: t,
+  onSelect: n
+}) {
+  return /* @__PURE__ */ i(ie, { children: e.map((a) => /* @__PURE__ */ i(
+    Ut,
+    {
+      feedback: a,
+      selected: (t == null ? void 0 : t.id) === a.id,
+      onSelect: n
+    },
+    a.id
+  )) });
+}
+function Ut({
+  feedback: e,
+  selected: t,
+  onSelect: n
+}) {
+  const a = We(null);
+  return lt(() => {
+    let s = 0;
+    const c = () => {
+      s = 0;
+      const f = a.current, u = z(e.selector), d = u == null ? void 0 : u.getBoundingClientRect();
+      !f || !d || (f.style.top = `${d.top}px`, f.style.left = `${d.right}px`, f.hidden = d.bottom < 0 || d.top > window.innerHeight);
+    }, g = () => {
+      s || (s = window.requestAnimationFrame(c));
+    };
+    return c(), window.addEventListener("scroll", g, !0), window.addEventListener("resize", g), () => {
+      s && window.cancelAnimationFrame(s), window.removeEventListener("scroll", g, !0), window.removeEventListener("resize", g);
+    };
+  }, [e.selector]), /* @__PURE__ */ i(
+    "button",
+    {
+      ref: a,
+      type: "button",
+      className: t ? "review-lens-marker review-lens-marker--selected" : "review-lens-marker",
+      onClick: () => n(e),
+      "aria-label": `Open feedback from ${e.authorEmail}`
+    }
+  );
+}
+function Wt({
   feedback: e,
-  selectedFeedback: o,
-  onSelect: t
+  selectedFeedback: t,
+  onSelect: n
 }) {
-  return /* @__PURE__ */ a(G, { children: e.map((n) => {
-    const r = pe(n.selector), i = r == null ? void 0 : r.getBoundingClientRect();
-    return i ? /* @__PURE__ */ a(
-      "button",
-      {
-        type: "button",
-        className: (o == null ? void 0 : o.id) === n.id ? "review-lens-marker review-lens-marker--selected" : "review-lens-marker",
-        style: {
-          top: i.top,
-          left: i.left + i.width
-        },
-        onClick: () => t(n),
-        "aria-label": `Open feedback from ${n.authorEmail}`
-      },
-      n.id
-    ) : null;
-  }) });
+  const a = e.map((s) => {
+    const c = z(s.selector), g = c == null ? void 0 : c.getBoundingClientRect(), f = Math.max(
+      document.documentElement.scrollHeight,
+      document.body.scrollHeight,
+      window.innerHeight
+    );
+    return !g || f <= 0 ? null : {
+      item: s,
+      top: Math.min(100, Math.max(0, (g.top + window.scrollY) / f * 100))
+    };
+  }).filter((s) => s !== null);
+  return a.length === 0 ? null : /* @__PURE__ */ i("div", { className: "review-lens-minimap", "data-review-lens-ui": !0, "aria-label": "Feedback map", children: a.map((s) => /* @__PURE__ */ i(
+    "button",
+    {
+      type: "button",
+      className: (t == null ? void 0 : t.id) === s.item.id ? "review-lens-minimap__point review-lens-minimap__point--selected" : "review-lens-minimap__point",
+      style: { top: `${s.top}%` },
+      onClick: () => n(s.item),
+      "aria-label": `Jump to feedback from ${s.item.authorEmail}`
+    },
+    s.item.id
+  )) });
 }
-function ue({ target: e }) {
-  const o = [
+function Dt({ target: e }) {
+  const t = [
     ["Selector", e.selector],
     ["Size", `${e.cssSnapshot.width} x ${e.cssSnapshot.height}`],
     ["Margin", e.cssSnapshot.margin],
     ["Padding", e.cssSnapshot.padding],
     ["Border", e.cssSnapshot.border],
+    ["Radius", e.cssSnapshot.borderRadius],
     ["Font", `${e.cssSnapshot.fontSize} / ${e.cssSnapshot.lineHeight}`],
     ["Family", e.cssSnapshot.fontFamily],
     ["Color", e.cssSnapshot.color],
     ["Background", e.cssSnapshot.backgroundColor]
   ];
-  return /* @__PURE__ */ a("dl", { className: "review-lens-metrics", children: o.map(([t, n]) => /* @__PURE__ */ S("div", { children: [
-    /* @__PURE__ */ a("dt", { children: t }),
-    /* @__PURE__ */ a("dd", { children: n })
-  ] }, t)) });
+  return /* @__PURE__ */ i("dl", { className: "review-lens-metrics", children: t.map(([n, a]) => /* @__PURE__ */ o("div", { children: [
+    /* @__PURE__ */ i("dt", { children: n }),
+    /* @__PURE__ */ i("dd", { children: a })
+  ] }, n)) });
 }
-function pe(e) {
+function _e({ title: e, items: t }) {
+  return /* @__PURE__ */ o("section", { className: "review-lens-insights", children: [
+    /* @__PURE__ */ i("h3", { children: e }),
+    t.length === 0 ? /* @__PURE__ */ i("p", { children: "No issues detected." }) : null,
+    t.length > 0 ? /* @__PURE__ */ i("ul", { children: t.map((n) => /* @__PURE__ */ i("li", { children: n }, n)) }) : null
+  ] });
+}
+function z(e) {
   try {
     return document.querySelector(e);
   } catch {
     return null;
   }
 }
-function me(e) {
-  const o = {
-    top: y(e.cssSnapshot.marginTop),
-    right: y(e.cssSnapshot.marginRight),
-    bottom: y(e.cssSnapshot.marginBottom),
-    left: y(e.cssSnapshot.marginLeft)
-  }, t = {
-    top: y(e.cssSnapshot.borderTopWidth),
-    right: y(e.cssSnapshot.borderRightWidth),
-    bottom: y(e.cssSnapshot.borderBottomWidth),
-    left: y(e.cssSnapshot.borderLeftWidth)
+function Ke(e) {
+  const t = z(e.selector);
+  if (!t)
+    return { label: "Target missing", level: "warning" };
+  const n = X(t);
+  return n.fingerprint.tagName !== e.elementFingerprint.tagName ? { label: "Element changed", level: "warning" } : Math.abs(n.fingerprint.width - e.elementFingerprint.width) > 2 || Math.abs(n.fingerprint.height - e.elementFingerprint.height) > 2 ? { label: "Size changed", level: "warning" } : n.cssSnapshot.fontSize !== e.createdCssSnapshot.fontSize || n.cssSnapshot.color !== e.createdCssSnapshot.color || n.cssSnapshot.padding !== e.createdCssSnapshot.padding ? { label: "Style changed", level: "warning" } : { label: "Target unchanged", level: "ok" };
+}
+function zt(e) {
+  var u;
+  const t = z(e.selector);
+  if (!t)
+    return ["Selected element is no longer available."];
+  const n = [], a = t.tagName.toLowerCase(), s = t.getAttribute("role"), c = ["button", "a", "input", "select", "textarea"].includes(a) || s === "button" || s === "link", g = t.getAttribute("aria-label") || t.getAttribute("title") || ((u = t.textContent) == null ? void 0 : u.trim());
+  c && !g && n.push("Interactive element has no accessible name."), c && (e.rect.width < 44 || e.rect.height < 44) && n.push("Tap target is smaller than 44 x 44."), a === "img" && !t.getAttribute("alt") && n.push("Image is missing alt text.");
+  const f = /^h[1-6]$/.test(a) ? Number(a.slice(1)) : 0;
+  return f > 1 && !document.querySelector(`h${f - 1}`) && n.push("Heading may skip the previous level."), Jt(e.cssSnapshot.color, e.cssSnapshot.backgroundColor) && n.push("Text contrast may be low."), n;
+}
+function Ht(e, t = {}) {
+  const n = [];
+  return U("Padding", e.padding, t.spacing, n), U("Margin", e.margin, t.spacing, n), U("Font size", e.fontSize, t.fontSize, n), U("Line height", e.lineHeight, t.lineHeight, n), U("Text color", e.color, t.color, n), U("Background", e.backgroundColor, t.color, n), U("Radius", e.borderRadius, t.radius, n), n;
+}
+function U(e, t, n, a) {
+  !n || n.length === 0 || !t || n.includes(t) || a.push(`${e} ${t} is outside configured tokens.`);
+}
+function jt(e) {
+  const t = e.id ? `#${e.id}` : "", n = e.className ? `.${e.className.split(/\s+/).filter(Boolean).slice(0, 2).join(".")}` : "", a = e.ariaLabel ? `[aria-label="${e.ariaLabel}"]` : "";
+  return `${e.tagName}${t}${n}${a}` || e.tagName;
+}
+function Ot(e, t) {
+  const n = [], a = (Math.max(e.left, t.left) + Math.min(e.right, t.right)) / 2, s = (Math.max(e.top, t.top) + Math.min(e.bottom, t.bottom)) / 2;
+  if (e.right <= t.left || t.right <= e.left) {
+    const c = e.right <= t.left ? e.right : t.right, g = e.right <= t.left ? t.left : e.left;
+    n.push({
+      key: "horizontal",
+      axis: "horizontal",
+      top: Pe(s, 0, window.innerHeight),
+      left: c,
+      width: Math.max(g - c, 1),
+      height: 1,
+      label: `${Math.round(g - c)}px`
+    });
+  }
+  if (e.bottom <= t.top || t.bottom <= e.top) {
+    const c = e.bottom <= t.top ? e.bottom : t.bottom, g = e.bottom <= t.top ? t.top : e.top;
+    n.push({
+      key: "vertical",
+      axis: "vertical",
+      top: c,
+      left: Pe(a, 0, window.innerWidth),
+      width: 1,
+      height: Math.max(g - c, 1),
+      label: `${Math.round(g - c)}px`
+    });
+  }
+  return n;
+}
+function Pe(e, t, n) {
+  return Math.min(Math.max(e, t), n);
+}
+function Y(e, t) {
+  const n = /* @__PURE__ */ new Map();
+  for (const a of e) {
+    const s = t(a);
+    n.set(s, (n.get(s) ?? 0) + 1);
+  }
+  return Array.from(n.entries()).sort((a, s) => s[1] - a[1] || a[0].localeCompare(s[0]));
+}
+function Kt(e) {
+  return e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement || e instanceof HTMLSelectElement || e instanceof HTMLElement && e.isContentEditable;
+}
+function Jt(e, t) {
+  const n = Ue(e), a = Ue(t);
+  return !n || !a || a.alpha === 0 ? !1 : qt(n, a) < 4.5;
+}
+function Ue(e) {
+  const t = e.match(/rgba?\(([^)]+)\)/);
+  if (!t)
+    return null;
+  const [n, a, s, c = "1"] = t[1].split(",").map((g) => g.trim());
+  return {
+    red: Number(n),
+    green: Number(a),
+    blue: Number(s),
+    alpha: Number(c)
+  };
+}
+function qt(e, t) {
+  const n = Math.max(ne(e), ne(t)), a = Math.min(ne(e), ne(t));
+  return (n + 0.05) / (a + 0.05);
+}
+function ne(e) {
+  const t = [e.red, e.green, e.blue].map((n) => {
+    const a = n / 255;
+    return a <= 0.03928 ? a / 12.92 : ((a + 0.055) / 1.055) ** 2.4;
+  });
+  return t[0] * 0.2126 + t[1] * 0.7152 + t[2] * 0.0722;
+}
+function Vt(e) {
+  const t = {
+    top: F(e.cssSnapshot.marginTop),
+    right: F(e.cssSnapshot.marginRight),
+    bottom: F(e.cssSnapshot.marginBottom),
+    left: F(e.cssSnapshot.marginLeft)
   }, n = {
-    top: y(e.cssSnapshot.paddingTop),
-    right: y(e.cssSnapshot.paddingRight),
-    bottom: y(e.cssSnapshot.paddingBottom),
-    left: y(e.cssSnapshot.paddingLeft)
-  }, r = {
+    top: F(e.cssSnapshot.borderTopWidth),
+    right: F(e.cssSnapshot.borderRightWidth),
+    bottom: F(e.cssSnapshot.borderBottomWidth),
+    left: F(e.cssSnapshot.borderLeftWidth)
+  }, a = {
+    top: F(e.cssSnapshot.paddingTop),
+    right: F(e.cssSnapshot.paddingRight),
+    bottom: F(e.cssSnapshot.paddingBottom),
+    left: F(e.cssSnapshot.paddingLeft)
+  }, s = {
     top: e.rect.top,
     left: e.rect.left,
     width: Math.max(e.rect.width, 0),
     height: Math.max(e.rect.height, 0)
-  }, i = {
-    top: r.top - o.top,
-    left: r.left - o.left,
-    width: r.width + o.left + o.right,
-    height: r.height + o.top + o.bottom
-  }, m = {
-    top: r.top + t.top,
-    left: r.left + t.left,
-    width: Math.max(r.width - t.left - t.right, 0),
-    height: Math.max(r.height - t.top - t.bottom, 0)
-  }, v = {
-    top: m.top + n.top,
-    left: m.left + n.left,
-    width: Math.max(m.width - n.left - n.right, 0),
-    height: Math.max(m.height - n.top - n.bottom, 0)
+  }, c = {
+    top: s.top - t.top,
+    left: s.left - t.left,
+    width: s.width + t.left + t.right,
+    height: s.height + t.top + t.bottom
+  }, g = {
+    top: s.top + n.top,
+    left: s.left + n.left,
+    width: Math.max(s.width - n.left - n.right, 0),
+    height: Math.max(s.height - n.top - n.bottom, 0)
+  }, f = {
+    top: g.top + a.top,
+    left: g.left + a.left,
+    width: Math.max(g.width - a.left - a.right, 0),
+    height: Math.max(g.height - a.top - a.bottom, 0)
   };
   return {
-    margin: i,
-    border: r,
-    padding: m,
-    content: v
+    margin: c,
+    border: s,
+    padding: g,
+    content: f
   };
 }
-function y(e) {
-  const o = Number.parseFloat(e || "0");
-  return Number.isFinite(o) ? o : 0;
+function F(e) {
+  const t = Number.parseFloat(e);
+  return Number.isFinite(t) ? t : 0;
 }
 export {
-  be as ReviewLensOverlay,
-  we as ReviewLensProvider,
-  M as buildElementTarget,
-  X as createGoogleSheetsAdapter,
-  ne as normalizeReviewUrl,
-  re as useReviewLens
+  Qt as ReviewLensOverlay,
+  Xt as ReviewLensProvider,
+  X as buildElementTarget,
+  ht as createGoogleSheetsAdapter,
+  Ct as normalizeReviewUrl,
+  Nt as useReviewLens
 };