review-lens-react 0.1.2 → 0.2.1

package/dist/review-lens-react.js

@@ -1,97 +1,119 @@
-import { jsx as i, jsxs as f, Fragment as Y } from "react/jsx-runtime";
-import { createContext as V, useMemo as M, useState as R, useCallback as P, useEffect as T, useContext as Z, useRef as ee, useLayoutEffect as te } from "react";
-const ne = [
+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(" "), oe = "https://www.googleapis.com/oauth2/v3/userinfo";
-function re(e) {
-  const n = e.feedbackSheetName ?? "Feedback", t = e.usersSheetName ?? "Users";
-  let r, o;
-  async function c() {
-    return r ?? (r = ce(e.googleClientId)), r;
+].join(" "), dt = "https://www.googleapis.com/oauth2/v3/userinfo";
+function ht(e) {
+  const t = e.feedbackSheetName ?? "Feedback", n = e.messagesSheetName ?? "Messages", r = e.usersSheetName ?? "Users";
+  let s, c;
+  async function g() {
+    return s ?? (s = St(e.googleClientId)), s;
   }
-  async function h(a, d) {
-    const l = await c(), u = await fetch(
-      `https://sheets.googleapis.com/v4/spreadsheets/${e.spreadsheetId}${a}`,
+  async function f(d, v) {
+    const p = await g(), b = await fetch(
+      `https://sheets.googleapis.com/v4/spreadsheets/${e.spreadsheetId}${d}`,
       {
-        ...d,
+        ...v,
         headers: {
-          Authorization: `Bearer ${l}`,
+          Authorization: `Bearer ${p}`,
           "Content-Type": "application/json",
-          ...d == null ? void 0 : d.headers
+          ...v == null ? void 0 : v.headers
         }
       }
     );
-    if (!u.ok)
-      throw new Error(`Google Sheets request failed with ${u.status}`);
-    return u.json();
+    if (!b.ok)
+      throw new Error(`Google Sheets request failed with ${b.status}`);
+    return b.json();
   }
-  async function w(a) {
-    return (await h(
-      `/values/${encodeURIComponent(a)}`
+  async function u(d) {
+    return (await f(
+      `/values/${encodeURIComponent(d)}`
     )).values ?? [];
   }
   return {
     async getCurrentUser() {
-      if (!o) {
-        const a = await c(), d = await fetch(oe, {
-          headers: { Authorization: `Bearer ${a}` }
+      if (!c) {
+        const d = await g(), v = await fetch(dt, {
+          headers: { Authorization: `Bearer ${d}` }
         });
-        if (!d.ok)
-          throw new Error(`Google userinfo request failed with ${d.status}`);
-        o = (await d.json()).email;
+        if (!v.ok)
+          throw new Error(`Google userinfo request failed with ${v.status}`);
+        c = (await v.json()).email;
       }
-      if (!o)
+      if (!c)
         throw new Error("Google account did not return an email address");
-      return { email: o };
+      return { email: c };
     },
-    async getPermissions(a) {
-      const [{ email: d }, l] = await Promise.all([this.getCurrentUser(), w(t)]), u = z(l), y = d.toLowerCase(), p = u.find(
-        (b) => {
-          var m;
-          return ((m = b.email) == null ? void 0 : m.toLowerCase()) === y && b.active !== "false" && (!b.projectKey || b.projectKey === a);
+    async getPermissions(d) {
+      const [{ email: v }, p] = await Promise.all([this.getCurrentUser(), u(r)]), 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 de((p == null ? void 0 : p.role) ?? "designer");
+      return gt((x == null ? void 0 : x.role) ?? "designer");
     },
-    async listFeedback(a) {
-      return z(await w(n)).map(K).filter((l) => l !== null).filter(
-        (l) => l.projectKey === a.projectKey && l.contentId === a.contentId && l.normalizedPath === a.normalizedPath
-      ).sort((l, u) => u.createdAt.localeCompare(l.createdAt));
+    async listFeedback(d) {
+      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(a) {
-      const d = (/* @__PURE__ */ new Date()).toISOString(), l = {
-        ...a,
+    async createFeedback(d) {
+      const v = (/* @__PURE__ */ new Date()).toISOString(), p = {
+        ...d,
         id: crypto.randomUUID(),
-        status: "open",
-        createdAt: d,
-        updatedAt: d
+        attachments: [],
+        createdAt: v,
+        updatedAt: v
       };
-      return await h(`/values/${encodeURIComponent(n)}:append?valueInputOption=RAW`, {
+      return await f(`/values/${encodeURIComponent(t)}:append?valueInputOption=RAW`, {
         method: "POST",
-        body: JSON.stringify({ values: [se(l)] })
-      }), l;
+        body: JSON.stringify({ values: [Ie(p)] })
+      }), p;
     },
-    async resolveFeedback(a, d) {
-      const l = await w(n), u = l[0] ?? ie, y = u.indexOf("id"), p = u.indexOf("status"), b = u.indexOf("updatedAt"), m = u.indexOf("resolvedAt"), k = u.indexOf("resolvedBy"), v = l.findIndex((N, x) => x > 0 && N[y] === a);
-      if (v < 1)
-        throw new Error(`Feedback ${a} was not found`);
-      const S = [...l[v]], F = (/* @__PURE__ */ new Date()).toISOString();
-      S[p] = "resolved", S[b] = F, S[m] = F, S[k] = d, await h(
-        `/values/${encodeURIComponent(n)}!A${v + 1}:Q${v + 1}?valueInputOption=RAW`,
+    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 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: [S] })
+          body: JSON.stringify({ values: [y] })
         }
-      );
-      const C = K(q(u, S));
-      if (!C)
-        throw new Error(`Feedback ${a} could not be parsed after resolving`);
-      return C;
+      ), 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 ie = [
+const Me = [
   "id",
   "projectKey",
   "contentId",
@@ -100,16 +122,28 @@ const ie = [
   "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 se(e) {
+], ut = ["id", "feedbackId", "body", "authorEmail", "createdAt"];
+function Ie(e) {
   return [
     e.id,
     e.projectKey,
@@ -119,24 +153,39 @@ function se(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 z(e) {
-  const [n, ...t] = e;
-  return n ? t.map((r) => q(n, r)) : [];
+function pt(e) {
+  return ut.map((t) => e[t]);
 }
-function q(e, n) {
-  return Object.fromEntries(e.map((t, r) => [t, n[r] ?? ""]));
+function ce(e) {
+  const [t, ...n] = e;
+  return t ? n.map((r) => De(t, r)) : [];
 }
-function K(e) {
+function De(e, t) {
+  return Object.fromEntries(e.map((n, r) => [n, t[r] ?? ""]));
+}
+function Te(e) {
   return e.id ? {
     id: e.id,
     projectKey: e.projectKey,
@@ -145,483 +194,1084 @@ function K(e) {
     originalUrl: e.originalUrl,
     selector: e.selector,
     selectorStrategy: e.selectorStrategy === "stable-attribute" ? "stable-attribute" : "css-path",
-    elementFingerprint: G(e.elementFingerprintJson, {
+    elementFingerprint: he(e.elementFingerprintJson, {
       tagName: "",
       width: 0,
       height: 0
     }),
-    cssSnapshot: ae(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 G(e, n) {
+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) : n;
+    return e ? JSON.parse(e) : t;
   } catch {
-    return n;
+    return t;
   }
 }
-function ae(e) {
-  const n = G(e, {});
+function Re(e) {
+  const t = he(e, {});
   return {
-    margin: n.margin ?? "",
-    marginTop: n.marginTop ?? "",
-    marginRight: n.marginRight ?? "",
-    marginBottom: n.marginBottom ?? "",
-    marginLeft: n.marginLeft ?? "",
-    padding: n.padding ?? "",
-    paddingTop: n.paddingTop ?? "",
-    paddingRight: n.paddingRight ?? "",
-    paddingBottom: n.paddingBottom ?? "",
-    paddingLeft: n.paddingLeft ?? "",
-    border: n.border ?? "",
-    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 ?? "",
-    width: n.width ?? 0,
-    height: n.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 de(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";
+}
+function yt(e) {
+  let t = e, n = "";
+  for (; t > 0; ) {
+    const r = (t - 1) % 26;
+    n = String.fromCharCode(65 + r) + n, t = Math.floor((t - r) / 26);
+  }
+  return n;
 }
-async function ce(e) {
-  return await le(), new Promise((n, t) => {
-    var o;
-    const r = (o = window.google) == null ? void 0 : o.accounts.oauth2.initTokenClient({
+async function St(e) {
+  return await kt(), new Promise((t, n) => {
+    var s;
+    const r = (s = window.google) == null ? void 0 : s.accounts.oauth2.initTokenClient({
       client_id: e,
-      scope: ne,
+      scope: ct,
       callback: (c) => {
         if (c.error || !c.access_token) {
-          t(new Error(c.error ?? "Google OAuth did not return an access token"));
+          n(new Error(c.error ?? "Google OAuth did not return an access token"));
           return;
         }
-        n(c.access_token);
+        t(c.access_token);
       }
     });
     r == null || r.requestAccessToken({ prompt: "" });
   });
 }
-function le() {
+function kt() {
   var e;
-  return (e = window.google) != null && e.accounts.oauth2 ? Promise.resolve() : new Promise((n, t) => {
+  return (e = window.google) != null && e.accounts.oauth2 ? Promise.resolve() : new Promise((t, n) => {
     const r = document.querySelector(
       'script[src="https://accounts.google.com/gsi/client"]'
     );
     if (r) {
-      r.addEventListener("load", () => n(), { once: !0 }), r.addEventListener("error", () => t(new Error("Google Identity failed to load")), {
+      r.addEventListener("load", () => t(), { once: !0 }), r.addEventListener("error", () => n(new Error("Google Identity failed to load")), {
         once: !0
       });
       return;
     }
-    const o = document.createElement("script");
-    o.src = "https://accounts.google.com/gsi/client", o.async = !0, o.defer = !0, o.onload = () => n(), o.onerror = () => t(new Error("Google Identity failed to load")), document.head.append(o);
+    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 he(e) {
+function Ct(e) {
   return new URL(e, window.location.href).pathname.replace(/\/+$/, "") || "/";
 }
-const J = V(null);
-function Ce({ config: e, children: n }) {
-  const t = M(() => e.adapter ? e.adapter : re({
-    googleClientId: D(e.googleClientId, "googleClientId"),
-    spreadsheetId: D(e.spreadsheetId, "spreadsheetId"),
+const ze = st(null);
+function Qt({ 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]), r = e.currentUrl ?? window.location.href, o = (e.normalizeUrl ?? he)(r), [c, h] = R(), [w, a] = R([]), [d, l] = R([]), u = P(async () => {
-    const m = await t.listFeedback({
+  }), [e.adapter, e.googleClientId, e.sheetName, e.spreadsheetId]), r = e.currentUrl ?? window.location.href, s = (e.normalizeUrl ?? Ct)(r), [c, g] = k(), [f, u] = k([]), [d, v] = k([]), p = W(async () => {
+    const y = await n.listFeedback({
       projectKey: e.projectKey,
       contentId: e.contentId,
-      normalizedPath: o
+      normalizedPath: s
     });
-    l(m);
-  }, [t, e.contentId, e.projectKey, o]);
-  T(() => {
-    let m = !0;
-    async function k() {
-      const [v, S] = await Promise.all([
-        t.getCurrentUser(),
-        t.getPermissions(e.projectKey)
+    v(y);
+  }, [n, e.contentId, e.projectKey, s]);
+  _(() => {
+    let y = !0;
+    async function w() {
+      const [C, B] = await Promise.all([
+        n.getCurrentUser(),
+        n.getPermissions(e.projectKey)
       ]);
-      m && (h(v), a(S), await u());
+      y && (g(C), u(B), await p());
     }
-    return k(), () => {
-      m = !1;
+    return w(), () => {
+      y = !1;
     };
-  }, [t, e.projectKey, u]);
-  const y = P(
-    async (m) => {
-      const k = await t.createFeedback(m);
-      return l((v) => [k, ...v]), k;
+  }, [n, e.projectKey, p]);
+  const b = W(
+    async (y) => {
+      const w = await n.createFeedback(y);
+      return v((C) => [w, ...C]), w;
     },
-    [t]
-  ), p = P(
-    async (m) => {
-      const k = await t.resolveFeedback(m, (c == null ? void 0 : c.email) ?? "");
-      return l(
-        (v) => v.map((S) => S.id === m ? k : S)
-      ), k;
+    [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, c == null ? void 0 : c.email]
-  ), b = M(
+    [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,
+      adapter: n,
       currentUser: c,
-      permissions: w,
+      permissions: f,
       feedback: d,
-      normalizedPath: o,
-      refreshFeedback: u,
-      createFeedback: y,
-      resolveFeedback: p
+      normalizedPath: s,
+      refreshFeedback: p,
+      createFeedback: b,
+      updateFeedback: E,
+      listMessages: x,
+      createMessage: A,
+      uploadAttachment: h
     }),
     [
-      t,
+      n,
       e,
-      y,
+      b,
       c,
       d,
-      o,
-      w,
-      u,
-      p
+      s,
+      f,
+      p,
+      E,
+      x,
+      A,
+      h
     ]
   );
-  return /* @__PURE__ */ i(J.Provider, { value: b, children: n });
+  return /* @__PURE__ */ i(ze.Provider, { value: R, children: t });
 }
-function ue() {
-  const e = Z(J);
+function Nt() {
+  const e = ot(ze);
   if (!e)
     throw new Error("useReviewLens must be used inside ReviewLensProvider");
   return e;
 }
-function D(e, n) {
+function Be(e, t) {
   if (!e)
-    throw new Error(`review-lens-react requires config.${n} when no adapter is provided`);
+    throw new Error(`review-lens-react requires config.${t} when no adapter is provided`);
   return e;
 }
-const pe = [
+const xt = [
   "data-review-id",
   "data-testid",
   "data-test-id",
   "aria-label",
   "name"
 ];
-function _(e) {
-  const n = e.getBoundingClientRect(), t = me(e);
+function X(e) {
+  const t = e.getBoundingClientRect(), n = Et(e);
   return {
-    selector: t.selector,
-    selectorStrategy: t.strategy,
-    fingerprint: fe(e, n),
-    cssSnapshot: we(e, n),
-    rect: n
+    selector: n.selector,
+    selectorStrategy: n.strategy,
+    fingerprint: Lt(e, t),
+    cssSnapshot: Ft(e, t),
+    rect: t
   };
 }
-function me(e) {
-  for (const n of pe) {
-    const t = e.getAttribute(n);
-    if (t)
+function Et(e) {
+  for (const t of xt) {
+    const n = e.getAttribute(t);
+    if (n)
       return {
-        selector: `[${n}="${O(t)}"]`,
+        selector: `[${t}="${$e(n)}"]`,
         strategy: "stable-attribute"
       };
   }
-  return e.id ? { selector: `#${O(e.id)}`, strategy: "stable-attribute" } : { selector: ge(e), strategy: "css-path" };
+  return e.id ? { selector: `#${$e(e.id)}`, strategy: "stable-attribute" } : { selector: At(e), strategy: "css-path" };
 }
-function ge(e) {
-  const n = [];
-  let t = e;
-  for (; t && t.nodeType === Node.ELEMENT_NODE && t !== document.body; ) {
-    const r = t.parentElement, o = t.tagName.toLowerCase();
+function At(e) {
+  const t = [];
+  let n = e;
+  for (; n && n.nodeType === Node.ELEMENT_NODE && n !== document.body; ) {
+    const r = n.parentElement, s = n.tagName.toLowerCase();
     if (!r) {
-      n.unshift(o);
+      t.unshift(s);
       break;
     }
-    const c = t.tagName, h = Array.from(r.children).filter(
-      (a) => a.tagName === c
-    ), w = h.indexOf(t) + 1;
-    n.unshift(h.length > 1 ? `${o}:nth-of-type(${w})` : o), t = r;
+    const c = n.tagName, g = Array.from(r.children).filter(
+      (u) => u.tagName === c
+    ), f = g.indexOf(n) + 1;
+    t.unshift(g.length > 1 ? `${s}:nth-of-type(${f})` : s), n = r;
   }
-  return n.join(" > ");
+  return t.join(" > ");
 }
-function fe(e, n) {
-  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(n.width),
-    height: Math.round(n.height)
+    width: Math.round(t.width),
+    height: Math.round(t.height)
   };
 }
-function we(e, n) {
-  const t = window.getComputedStyle(e);
+function Ft(e, t) {
+  const n = window.getComputedStyle(e);
   return {
-    margin: j(t.marginTop, t.marginRight, t.marginBottom, t.marginLeft),
-    marginTop: t.marginTop,
-    marginRight: t.marginRight,
-    marginBottom: t.marginBottom,
-    marginLeft: t.marginLeft,
-    padding: j(
-      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: j(
-      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(n.width),
-    height: Math.round(n.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 j(e, n, t, r) {
-  return e === n && n === t && t === r ? e : `${e} ${n} ${t} ${r}`;
+function de(e, t, n, r) {
+  return e === t && t === n && n === r ? e : `${e} ${t} ${n} ${r}`;
 }
-function O(e) {
+function $e(e) {
   return typeof CSS < "u" && typeof CSS.escape == "function" ? CSS.escape(e) : e.replace(/["\\]/g, "\\$&");
 }
-function Le({
+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 Zt({
   open: e,
-  onOpenChange: n,
-  placement: t = "top-right",
-  showResolved: r = !1
+  onOpenChange: t,
+  placement: n = "top-right",
+  showResolved: r = !1,
+  syncSelectionToUrl: s = !1,
+  responsivePresets: c = Mt
 }) {
+  var Fe;
   const {
-    config: o,
-    currentUser: c,
-    feedback: h,
-    normalizedPath: w,
-    permissions: a,
-    createFeedback: d,
-    resolveFeedback: l
-  } = ue(), [u, y] = R(), [p, b] = R(), [m, k] = R(""), [v, S] = R(), [F, C] = R("review"), N = !!c, x = a.includes("create"), Q = a.includes("resolve"), B = M(
-    () => h.filter((s) => r || s.status !== "resolved"),
-    [h, r]
-  );
-  T(() => {
-    e || (y(void 0), b(void 0), k(""), C("review"));
-  }, [e]), T(() => {
-    N || (y(void 0), b(void 0));
-  }, [N]), T(() => {
+    adapter: g,
+    config: f,
+    currentUser: u,
+    feedback: d,
+    normalizedPath: v,
+    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, Ve] = k("visual"), [me, ge] = k(""), [fe, qe] = 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"), [V, 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 a = d.map((m) => m.assigneeEmail).filter((m) => !!m);
+    return u != null && u.email && a.push(u.email), Array.from(new Set(a)).sort((m, l) => m.localeCompare(l));
+  }, [u == null ? void 0 : u.email, d]), L = re(
+    () => d.filter((a) => r || a.status !== "resolved").filter((a) => j === "all" || a.status === j).filter((a) => O === "all" || a.severity === O).filter((a) => K === "all" || a.category === K).filter((a) => J === "all" || a.assigneeEmail === J).filter((a) => V === "all" || a.viewportPreset === V),
+    [
+      J,
+      K,
+      d,
+      O,
+      r,
+      j,
+      V
+    ]
+  ), it = [
+    j,
+    O,
+    K,
+    J,
+    V
+  ].filter((a) => a !== "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 a, m, l;
+      (m = (a = ee.current) == null ? void 0 : a.scrollIntoView) == null || m.call(a, { block: "nearest" }), (l = ee.current) == null || l.focus();
+    });
+  }, [w, M]), _(() => {
+    if (!S)
+      return;
+    let a = !0;
+    return x(S.id).then((m) => {
+      a && Ce((l) => ({ ...l, [S.id]: m }));
+    }), () => {
+      a = !1;
+    };
+  }, [x, S]), _(() => {
+    if (!e || !s || S || d.length === 0)
+      return;
+    const a = new URL(window.location.href).searchParams.get("reviewLensFeedback"), m = d.find((l) => l.id === a);
+    m && q(m, { syncUrl: !1 });
+  }, [d, e, S, s]), _(() => {
     if (!e)
       return;
-    function s(g) {
-      g.key === "Escape" && (g.preventDefault(), n == null || n(!1));
+    function a(l) {
+      var N;
+      if (l.key === "Shift" && be(!0), l.key === "Escape") {
+        l.preventDefault(), t == null || t(!1);
+        return;
+      }
+      Jt(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", s), () => {
-      window.removeEventListener("keydown", s);
+    return window.addEventListener("keydown", a), window.addEventListener("keyup", m), () => {
+      window.removeEventListener("keydown", a), window.removeEventListener("keyup", m);
     };
-  }, [n, e]);
-  const $ = P((s) => {
-    const g = s.target instanceof Element ? s.target : null;
-    if (g)
-      return g.closest("[data-review-lens-ui]") ? null : g;
-    const L = document.elementFromPoint(s.clientX, s.clientY);
-    return !L || L.closest("[data-review-lens-ui]") ? null : L;
+  });
+  const le = W((a) => {
+    const m = a.target instanceof Element ? a.target : null;
+    if (m)
+      return m.closest("[data-review-lens-ui]") ? null : m;
+    const l = document.elementFromPoint(a.clientX, a.clientY);
+    return !l || l.closest("[data-review-lens-ui]") ? null : l;
   }, []);
-  if (T(() => {
-    if (!e || !N)
+  if (_(() => {
+    if (!e || !I)
       return;
-    function s(L) {
-      const A = $(L);
-      y(A ? _(A) : void 0);
+    function a(l) {
+      const N = le(l);
+      y(N ? X(N) : void 0);
     }
-    function g(L) {
-      const A = $(L);
-      A && (L.preventDefault(), L.stopPropagation(), b(_(A)), C("review"));
+    function m(l) {
+      const N = le(l);
+      N && (l.preventDefault(), l.stopPropagation(), C(X(N)), $("review"));
     }
-    return window.addEventListener("mousemove", s, !0), window.addEventListener("click", g, !0), () => {
-      window.removeEventListener("mousemove", s, !0), window.removeEventListener("click", g, !0);
+    return window.addEventListener("mousemove", a, !0), window.addEventListener("click", m, !0), () => {
+      window.removeEventListener("mousemove", a, !0), window.removeEventListener("click", m, !0);
     };
-  }, [N, $, p, e]), !e)
+  }, [I, le, e]), !e)
     return null;
-  const I = u ?? p, X = !!p;
-  function W(s) {
-    S(s), b(void 0), C("feedback");
-    const g = H(s.selector);
-    g && (g.scrollIntoView({ behavior: "smooth", block: "center", inline: "center" }), window.requestAnimationFrame(() => {
-      y(_(g));
-    }));
+  function q(a, m = { syncUrl: !0 }) {
+    var N;
+    if (H(a), C(void 0), $("feedback"), s && m.syncUrl !== !1) {
+      const te = new URL(window.location.href);
+      te.searchParams.set("reviewLensFeedback", a.id), window.history.replaceState({}, "", te);
+    }
+    const l = z(a.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));
+    });
   }
-  async function U() {
-    !p || !m.trim() || !c || !x || (await d({
-      projectKey: o.projectKey,
-      contentId: o.contentId,
-      normalizedPath: w,
-      originalUrl: o.currentUrl ?? window.location.href,
-      selector: p.selector,
-      selectorStrategy: p.selectorStrategy,
-      elementFingerprint: p.fingerprint,
-      cssSnapshot: p.cssSnapshot,
-      comment: m.trim(),
-      authorEmail: c.email
-    }), k(""), b(void 0), y(void 0), C("feedback"));
+  function Ee(a) {
+    if (L.length === 0)
+      return;
+    const m = S ? L.findIndex((N) => N.id === S.id) : -1, l = m < 0 ? a > 0 ? 0 : L.length - 1 : (m + a + L.length) % L.length;
+    q(L[l]);
   }
-  return /* @__PURE__ */ f("div", { className: "review-lens-root", "data-review-lens-ui": !0, children: [
-    N && I ? /* @__PURE__ */ i(ve, { target: I, locked: !!p }) : null,
-    N ? /* @__PURE__ */ i(
-      be,
-      {
-        feedback: B,
-        selectedFeedback: v,
-        onSelect: W
+  async function Ae() {
+    if (!w || !B.trim() || !u || !T)
+      return;
+    let a = 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(a.id, {
+          type: "screenshot",
+          data: m,
+          createdBy: u.email
+        });
+        a = await E(a.id, {
+          attachments: [l],
+          screenshotUrl: l.url,
+          screenshotThumbnailUrl: l.thumbnailUrl
+        });
+      } catch {
       }
-    ) : null,
-    /* @__PURE__ */ f("aside", { className: `review-lens-panel review-lens-panel--${t}`, "data-review-lens-ui": !0, children: [
-      /* @__PURE__ */ f("header", { className: "review-lens-panel__header", children: [
-        /* @__PURE__ */ f("div", { children: [
+    D(""), ge(""), C(void 0), y(void 0), $("feedback"), H(a);
+  }
+  async function rt(a, 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(a.id, N);
+    H(te);
+  }
+  async function Le(a) {
+    const m = z(a.selector);
+    if (!m || !u)
+      return;
+    const l = X(m), N = await E(a.id, {
+      status: "fixed",
+      fixedCssSnapshot: l.cssSnapshot,
+      fixedAt: (/* @__PURE__ */ new Date()).toISOString(),
+      fixedBy: u.email
+    });
+    H(N);
+  }
+  async function at(a) {
+    if (!se.trim() || !u || !Ne)
+      return;
+    const m = await A({
+      feedbackId: a.id,
+      body: se.trim(),
+      authorEmail: u.email
+    });
+    Ce((l) => ({
+      ...l,
+      [a.id]: [...l[a.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: q
+        }
+      ),
+      /* @__PURE__ */ i(
+        Wt,
+        {
+          feedback: L,
+          selectedFeedback: S,
+          onSelect: q
+        }
+      )
+    ] }) : 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: F === "feedback" ? "Feedback" : p ? "Element locked" : "Inspecting" })
+          /* @__PURE__ */ i("h2", { children: M === "summary" ? "Summary" : M === "feedback" ? "Feedback" : w ? "Element locked" : "Inspecting" })
         ] }),
-        /* @__PURE__ */ i("button", { type: "button", onClick: () => n == null ? void 0 : n(!1), children: "Close" })
+        /* @__PURE__ */ i("button", { type: "button", onClick: () => t == null ? void 0 : t(!1), children: "Close" })
       ] }),
-      /* @__PURE__ */ f("div", { className: "review-lens-panel__body", children: [
-        /* @__PURE__ */ f("div", { className: "review-lens-mode-switch", role: "tablist", "aria-label": "Review Lens mode", children: [
+      /* @__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": F === "review",
-              onClick: () => C("review"),
+              "aria-selected": M === "review",
+              onClick: () => $("review"),
               children: "Review"
             }
           ),
-          /* @__PURE__ */ f(
+          /* @__PURE__ */ o(
             "button",
             {
               type: "button",
               role: "tab",
-              "aria-selected": F === "feedback",
-              onClick: () => C("feedback"),
+              "aria-selected": M === "feedback",
+              onClick: () => $("feedback"),
               children: [
                 "Feedback ",
-                /* @__PURE__ */ i("span", { children: B.length })
+                /* @__PURE__ */ i("span", { children: L.length })
               ]
             }
+          ),
+          /* @__PURE__ */ i(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-selected": M === "summary",
+              onClick: () => $("summary"),
+              children: "Summary"
+            }
           )
         ] }),
-        F === "review" ? /* @__PURE__ */ f("div", { className: "review-lens-review-pane", role: "tabpanel", children: [
-          /* @__PURE__ */ f("div", { className: "review-lens-inspection", children: [
-            N ? null : /* @__PURE__ */ i("p", { children: "Authenticate with Google to inspect this page." }),
-            N && I ? /* @__PURE__ */ i(ke, { target: I }) : null,
-            N && !I ? /* @__PURE__ */ i("p", { children: "Move over the app to inspect." }) : null
+        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
           ] }),
-          X ? /* @__PURE__ */ f(
+          et ? /* @__PURE__ */ i("div", { className: "review-lens-composer-panel", children: /* @__PURE__ */ o(
             "form",
             {
               className: "review-lens-feedback-form",
-              onSubmit: (s) => {
-                s.preventDefault(), U();
+              onSubmit: (a) => {
+                a.preventDefault(), Ae();
               },
               children: [
                 /* @__PURE__ */ i("label", { htmlFor: "review-lens-comment", children: "New feedback" }),
                 /* @__PURE__ */ i(
                   "textarea",
                   {
+                    ref: ee,
                     id: "review-lens-comment",
-                    value: m,
-                    disabled: !x,
-                    onChange: (s) => k(s.target.value),
-                    onKeyDown: (s) => {
-                      s.key === "Enter" && s.metaKey && (s.preventDefault(), U());
+                    value: B,
+                    disabled: !T,
+                    onChange: (a) => D(a.target.value),
+                    onKeyDown: (a) => {
+                      a.key === "Enter" && a.metaKey && (a.preventDefault(), Ae());
                     },
-                    placeholder: x ? "Describe the UX issue..." : "You do not have permission to comment."
+                    placeholder: T ? "Describe the UX issue..." : "You do not have permission to comment."
                   }
                 ),
-                x ? /* @__PURE__ */ f("p", { className: "review-lens-feedback-form__hint", children: [
+                /* @__PURE__ */ o("div", { className: "review-lens-form-grid", children: [
+                  /* @__PURE__ */ o("label", { children: [
+                    "Severity",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: ue,
+                        onChange: (a) => Je(a.target.value),
+                        disabled: !T,
+                        children: je.map((a) => /* @__PURE__ */ i("option", { value: a, children: Q[a] }, a))
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Type",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: pe,
+                        onChange: (a) => Ve(a.target.value),
+                        disabled: !T,
+                        children: Oe.map((a) => /* @__PURE__ */ i("option", { value: a, children: Z[a] }, a))
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Assignee",
+                    /* @__PURE__ */ i(
+                      "input",
+                      {
+                        value: me,
+                        onChange: (a) => ge(a.target.value),
+                        disabled: !T,
+                        placeholder: "optional@email.com"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ o("label", { children: [
+                    "Viewport",
+                    /* @__PURE__ */ i(
+                      "select",
+                      {
+                        value: fe,
+                        onChange: (a) => qe(a.target.value),
+                        disabled: !T,
+                        children: c.map((a) => /* @__PURE__ */ i("option", { value: a.value, children: a.label }, a.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."
+                  " to submit.",
+                  tt ? " Screenshot capture runs after save." : ""
                 ] }) : null,
-                /* @__PURE__ */ i("div", { className: "review-lens-actions", children: /* @__PURE__ */ i("button", { type: "submit", disabled: !m.trim() || !x, children: "Save feedback" }) })
+                /* @__PURE__ */ i("div", { className: "review-lens-actions", children: /* @__PURE__ */ i("button", { type: "submit", disabled: !B.trim() || !T, children: "Save feedback" }) })
               ]
             }
-          ) : null
-        ] }) : /* @__PURE__ */ f("div", { className: "review-lens-comments", children: [
-          /* @__PURE__ */ f("div", { className: "review-lens-comments__header", children: [
-            /* @__PURE__ */ i("h3", { children: "Page feedback" }),
-            /* @__PURE__ */ i("span", { children: B.length })
+          ) }) : 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: V,
+              assignees: nt,
+              responsivePresets: c,
+              onStatusChange: ve,
+              onSeverityChange: we,
+              onCategoryChange: ye,
+              onAssigneeChange: Se,
+              onViewportChange: ke,
+              onToggle: () => Xe((a) => !a),
+              onClear: () => {
+                ve("all"), we("all"), ye("all"), Se("all"), ke("all");
+              }
+            }
+          ),
+          /* @__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((a) => /* @__PURE__ */ i(
+                Tt,
+                {
+                  item: a,
+                  selected: (S == null ? void 0 : S.id) === a.id,
+                  onSelect: q
+                },
+                a.id
+              ))
+            ] })
           ] }),
-          /* @__PURE__ */ f("div", { className: "review-lens-comments__list", children: [
-            B.length === 0 ? /* @__PURE__ */ i("p", { children: "No feedback for this view." }) : null,
-            B.map((s) => /* @__PURE__ */ f(
-              "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,
               {
-                tabIndex: 0,
-                className: (v == null ? void 0 : v.id) === s.id ? "review-lens-comment review-lens-comment--selected" : "review-lens-comment",
-                onClick: () => W(s),
-                onKeyDown: (g) => {
-                  (g.key === "Enter" || g.key === " ") && (g.preventDefault(), W(s));
-                },
-                children: [
-                  /* @__PURE__ */ f("div", { className: "review-lens-comment__content", children: [
-                    /* @__PURE__ */ i("p", { children: s.comment }),
-                    /* @__PURE__ */ i("span", { children: s.authorEmail })
-                  ] }),
-                  s.status === "open" && Q ? /* @__PURE__ */ i("div", { className: "review-lens-comment__actions", children: /* @__PURE__ */ i(
-                    "button",
-                    {
-                      type: "button",
-                      onClick: (g) => {
-                        g.stopPropagation(), l(s.id);
-                      },
-                      children: "Resolve"
-                    }
-                  ) }) : null
-                ]
+                item: S,
+                messages: Qe[S.id] ?? [],
+                messageDraft: se,
+                canReply: Ne,
+                canUpdate: xe,
+                canAssign: Ze,
+                onMessageDraftChange: oe,
+                onSubmitMessage: () => void at(S),
+                onStatusChange: (a) => void rt(S, a),
+                onAssigneeChange: (a) => void E(S.id, {
+                  assigneeEmail: a.trim() || void 0
+                }).then(H),
+                onMarkFixed: () => void Le(S)
               },
-              s.id
-            ))
+              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: r,
+  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: r,
+            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",
+          {
+            "aria-label": "Filter viewport",
+            value: g,
+            onChange: (h) => E(h.target.value),
+            children: [
+              /* @__PURE__ */ i("option", { value: "all", children: "All viewports" }),
+              u.map((h) => /* @__PURE__ */ i("option", { value: h.value, children: h.label }, h.value))
+            ]
+          }
+        )
+      ] })
+    ] }) : null
+  ] });
+}
+function Tt({
+  item: e,
+  selected: t,
+  onSelect: n
+}) {
+  const r = 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: r.label })
         ] })
+      ]
+    }
+  );
+}
+function Rt({
+  item: e,
+  messages: t,
+  messageDraft: n,
+  canReply: r,
+  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: !r,
+          onChange: (b) => g(b.target.value),
+          placeholder: r ? "Reply..." : "You do not have permission to reply."
+        }
+      ),
+      /* @__PURE__ */ i("div", { className: "review-lens-actions", children: /* @__PURE__ */ i("button", { type: "button", disabled: !n.trim() || !r, onClick: f, children: "Reply" }) })
     ] })
   ] });
 }
-function ve({ target: e, locked: n }) {
-  const t = Se(e);
-  return /* @__PURE__ */ f(
+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, r]) => /* @__PURE__ */ o("div", { children: [
+      /* @__PURE__ */ i("dt", { children: n }),
+      /* @__PURE__ */ i("dd", { children: r })
+    ] }, n)) })
+  ] });
+}
+function $t({ target: e, locked: t }) {
+  const n = Gt(e), r = Ot(e.fingerprint);
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: n ? "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__ */ i(
@@ -629,10 +1279,10 @@ function ve({ target: e, locked: n }) {
           {
             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
             }
           }
         ),
@@ -641,10 +1291,10 @@ function ve({ target: e, locked: n }) {
           {
             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
             }
           }
         ),
@@ -653,143 +1303,304 @@ function ve({ target: e, locked: n }) {
           {
             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__ */ f("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: r }),
+          /* @__PURE__ */ o("span", { children: [
+            Math.round(e.rect.width),
+            " x ",
+            Math.round(e.rect.height)
+          ] })
         ] })
       ]
     }
   );
 }
-function be({
+function _t({ from: e, to: t }) {
+  const n = Kt(e.rect, t.rect);
+  return n.length === 0 ? null : /* @__PURE__ */ i(ie, { children: n.map((r) => /* @__PURE__ */ i(
+    "div",
+    {
+      className: `review-lens-distance review-lens-distance--${r.axis}`,
+      style: {
+        top: r.top,
+        left: r.left,
+        width: r.width,
+        height: r.height
+      },
+      children: /* @__PURE__ */ i("span", { children: r.label })
+    },
+    r.key
+  )) });
+}
+function Pt({
   feedback: e,
-  selectedFeedback: n,
-  onSelect: t
+  selectedFeedback: t,
+  onSelect: n
 }) {
-  return /* @__PURE__ */ i(Y, { children: e.map((r) => /* @__PURE__ */ i(
-    ye,
+  return /* @__PURE__ */ i(ie, { children: e.map((r) => /* @__PURE__ */ i(
+    Ut,
     {
       feedback: r,
-      selected: (n == null ? void 0 : n.id) === r.id,
-      onSelect: t
+      selected: (t == null ? void 0 : t.id) === r.id,
+      onSelect: n
     },
     r.id
   )) });
 }
-function ye({
+function Ut({
   feedback: e,
-  selected: n,
-  onSelect: t
+  selected: t,
+  onSelect: n
 }) {
-  const r = ee(null);
-  return te(() => {
-    let o = 0;
+  const r = We(null);
+  return lt(() => {
+    let s = 0;
     const c = () => {
-      o = 0;
-      const w = r.current, a = H(e.selector), d = a == null ? void 0 : a.getBoundingClientRect();
-      !w || !d || (w.style.top = `${d.top}px`, w.style.left = `${d.right}px`, w.hidden = d.bottom < 0 || d.top > window.innerHeight);
-    }, h = () => {
-      o || (o = window.requestAnimationFrame(c));
+      s = 0;
+      const f = r.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", h, !0), window.addEventListener("resize", h), () => {
-      o && window.cancelAnimationFrame(o), window.removeEventListener("scroll", h, !0), window.removeEventListener("resize", h);
+    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: r,
       type: "button",
-      className: n ? "review-lens-marker review-lens-marker--selected" : "review-lens-marker",
-      onClick: () => t(e),
+      className: t ? "review-lens-marker review-lens-marker--selected" : "review-lens-marker",
+      onClick: () => n(e),
       "aria-label": `Open feedback from ${e.authorEmail}`
     }
   );
 }
-function ke({ target: e }) {
-  const n = [
+function Wt({
+  feedback: e,
+  selectedFeedback: t,
+  onSelect: n
+}) {
+  const r = 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 r.length === 0 ? null : /* @__PURE__ */ i("div", { className: "review-lens-minimap", "data-review-lens-ui": !0, "aria-label": "Feedback map", children: r.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 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__ */ i("dl", { className: "review-lens-metrics", children: n.map(([t, r]) => /* @__PURE__ */ f("div", { children: [
-    /* @__PURE__ */ i("dt", { children: t }),
+  return /* @__PURE__ */ i("dl", { className: "review-lens-metrics", children: t.map(([n, r]) => /* @__PURE__ */ o("div", { children: [
+    /* @__PURE__ */ i("dt", { children: n }),
     /* @__PURE__ */ i("dd", { children: r })
-  ] }, t)) });
+  ] }, n)) });
 }
-function H(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 Se(e) {
-  const n = {
-    top: E(e.cssSnapshot.marginTop),
-    right: E(e.cssSnapshot.marginRight),
-    bottom: E(e.cssSnapshot.marginBottom),
-    left: E(e.cssSnapshot.marginLeft)
-  }, t = {
-    top: E(e.cssSnapshot.borderTopWidth),
-    right: E(e.cssSnapshot.borderRightWidth),
-    bottom: E(e.cssSnapshot.borderBottomWidth),
-    left: E(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 = [], r = t.tagName.toLowerCase(), s = t.getAttribute("role"), c = ["button", "a", "input", "select", "textarea"].includes(r) || 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."), r === "img" && !t.getAttribute("alt") && n.push("Image is missing alt text.");
+  const f = /^h[1-6]$/.test(r) ? Number(r.slice(1)) : 0;
+  return f > 1 && !document.querySelector(`h${f - 1}`) && n.push("Heading may skip the previous level."), Vt(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, { allowComposite: !0 }), U("Margin", e.margin, t.spacing, n, { allowComposite: !0 }), 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, { allowComposite: !0 }), n;
+}
+function U(e, t, n, r, s = {}) {
+  !n || n.length === 0 || !t || jt(t, n, s) || r.push(`${e} ${t} is outside configured tokens.`);
+}
+function jt(e, t, n = {}) {
+  if (t.includes(e))
+    return !0;
+  if (!n.allowComposite)
+    return !1;
+  const r = e.trim().split(/\s+/);
+  return r.length > 1 && r.every((s) => t.includes(s));
+}
+function Ot(e) {
+  const t = e.id ? `#${e.id}` : "", n = e.className ? `.${e.className.split(/\s+/).filter(Boolean).slice(0, 2).join(".")}` : "", r = e.ariaLabel ? `[aria-label="${e.ariaLabel}"]` : "";
+  return `${e.tagName}${t}${n}${r}` || e.tagName;
+}
+function Kt(e, t) {
+  const n = [], r = (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(r, 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 r of e) {
+    const s = t(r);
+    n.set(s, (n.get(s) ?? 0) + 1);
+  }
+  return Array.from(n.entries()).sort((r, s) => s[1] - r[1] || r[0].localeCompare(s[0]));
+}
+function Jt(e) {
+  return e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement || e instanceof HTMLSelectElement || e instanceof HTMLElement && e.isContentEditable;
+}
+function Vt(e, t) {
+  const n = Ue(e), r = Ue(t);
+  return !n || !r || r.alpha === 0 ? !1 : qt(n, r) < 4.5;
+}
+function Ue(e) {
+  const t = e.match(/rgba?\(([^)]+)\)/);
+  if (!t)
+    return null;
+  const [n, r, s, c = "1"] = t[1].split(",").map((g) => g.trim());
+  return {
+    red: Number(n),
+    green: Number(r),
+    blue: Number(s),
+    alpha: Number(c)
+  };
+}
+function qt(e, t) {
+  const n = Math.max(ne(e), ne(t)), r = Math.min(ne(e), ne(t));
+  return (n + 0.05) / (r + 0.05);
+}
+function ne(e) {
+  const t = [e.red, e.green, e.blue].map((n) => {
+    const r = n / 255;
+    return r <= 0.03928 ? r / 12.92 : ((r + 0.055) / 1.055) ** 2.4;
+  });
+  return t[0] * 0.2126 + t[1] * 0.7152 + t[2] * 0.0722;
+}
+function Gt(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: F(e.cssSnapshot.borderTopWidth),
+    right: F(e.cssSnapshot.borderRightWidth),
+    bottom: F(e.cssSnapshot.borderBottomWidth),
+    left: F(e.cssSnapshot.borderLeftWidth)
   }, r = {
-    top: E(e.cssSnapshot.paddingTop),
-    right: E(e.cssSnapshot.paddingRight),
-    bottom: E(e.cssSnapshot.paddingBottom),
-    left: E(e.cssSnapshot.paddingLeft)
-  }, o = {
+    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)
   }, c = {
-    top: o.top - n.top,
-    left: o.left - n.left,
-    width: o.width + n.left + n.right,
-    height: o.height + n.top + n.bottom
-  }, h = {
-    top: o.top + t.top,
-    left: o.left + t.left,
-    width: Math.max(o.width - t.left - t.right, 0),
-    height: Math.max(o.height - t.top - t.bottom, 0)
-  }, w = {
-    top: h.top + r.top,
-    left: h.left + r.left,
-    width: Math.max(h.width - r.left - r.right, 0),
-    height: Math.max(h.height - r.top - r.bottom, 0)
+    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 + r.top,
+    left: g.left + r.left,
+    width: Math.max(g.width - r.left - r.right, 0),
+    height: Math.max(g.height - r.top - r.bottom, 0)
   };
   return {
     margin: c,
-    border: o,
-    padding: h,
-    content: w
+    border: s,
+    padding: g,
+    content: f
   };
 }
-function E(e) {
-  const n = Number.parseFloat(e || "0");
-  return Number.isFinite(n) ? n : 0;
+function F(e) {
+  const t = Number.parseFloat(e);
+  return Number.isFinite(t) ? t : 0;
 }
 export {
-  Le as ReviewLensOverlay,
-  Ce as ReviewLensProvider,
-  _ as buildElementTarget,
-  re as createGoogleSheetsAdapter,
-  he as normalizeReviewUrl,
-  ue as useReviewLens
+  Zt as ReviewLensOverlay,
+  Qt as ReviewLensProvider,
+  X as buildElementTarget,
+  ht as createGoogleSheetsAdapter,
+  Ct as normalizeReviewUrl,
+  Nt as useReviewLens
 };