qapture2 0.9.0 → 0.9.1

package/dist/{chunk-5EWNGJ2N.cjs → chunk-J77SGE5E.cjs}

@@ -177,6 +177,7 @@ var DEFAULTS = {
   loginField: { en: "Username", ar: "\u0627\u0633\u0645 \u0627\u0644\u0645\u0633\u062A\u062E\u062F\u0645" },
   rtl: false,
   beta: false,
+  collector: null,
   visible: void 0,
   alwaysVisible: false,
   hotkey: "shift+alt+q",
@@ -349,6 +350,7 @@ function validateConfig(input) {
         preamble: null,
         rtl: DEFAULTS.rtl,
         beta: DEFAULTS.beta,
+        collector: null,
         visible: DEFAULTS.visible,
         alwaysVisible: DEFAULTS.alwaysVisible,
         hotkey: DEFAULTS.hotkey,
@@ -370,6 +372,7 @@ function validateConfig(input) {
         preamble: null,
         rtl: DEFAULTS.rtl,
         beta: DEFAULTS.beta,
+        collector: null,
         visible: DEFAULTS.visible,
         alwaysVisible: DEFAULTS.alwaysVisible,
         hotkey: DEFAULTS.hotkey,
@@ -406,6 +409,14 @@ function validateConfig(input) {
   const preamble = raw["preamble"] !== void 0 ? coercePreamble(raw["preamble"]) : null;
   const rtl = typeof raw["rtl"] === "boolean" ? raw["rtl"] : DEFAULTS.rtl;
   const beta = typeof raw["beta"] === "boolean" ? raw["beta"] : DEFAULTS.beta;
+  const rawCol = raw["collector"];
+  const collector = rawCol && typeof rawCol["url"] === "string" && typeof rawCol["token"] === "string" && typeof rawCol["project"] === "string" ? {
+    url: rawCol["url"],
+    token: rawCol["token"],
+    project: rawCol["project"],
+    campaign: typeof rawCol["campaign"] === "string" ? rawCol["campaign"] : void 0,
+    tester: typeof rawCol["tester"] === "string" ? rawCol["tester"] : void 0
+  } : DEFAULTS.collector;
   const alwaysVisible = typeof raw["alwaysVisible"] === "boolean" ? raw["alwaysVisible"] : DEFAULTS.alwaysVisible;
   const hotkey = isNonEmptyString(raw["hotkey"]) ? raw["hotkey"].trim() : DEFAULTS.hotkey;
   const captureHotkey = isNonEmptyString(raw["captureHotkey"]) ? raw["captureHotkey"].trim() : DEFAULTS.captureHotkey;
@@ -429,6 +440,7 @@ function validateConfig(input) {
       preamble,
       rtl,
       beta,
+      collector,
       visible,
       alwaysVisible,
       hotkey,
@@ -1706,6 +1718,98 @@ function createStorage(namespace) {
   return { getItem, setItem, getJSON, setJSON };
 }
 
+// src/lib/faultLog.ts
+var LIMIT = 40;
+var faults = [];
+function recordFault(where, err) {
+  const what = err instanceof Error ? `${err.name}: ${err.message}` : typeof err === "string" ? err : (() => {
+    try {
+      return JSON.stringify(err);
+    } catch {
+      return String(err);
+    }
+  })();
+  faults.push({ at: Date.now(), where, what: what.slice(0, 500) });
+  if (faults.length > LIMIT) faults.splice(0, faults.length - LIMIT);
+  console.warn(`[QA] ${where}:`, err);
+}
+function readFaults() {
+  return [...faults].reverse();
+}
+function clearFaults() {
+  faults.length = 0;
+}
+function faultsAsText(version) {
+  if (!faults.length) return "No faults recorded.";
+  const head = [
+    `qapture ${version}`,
+    typeof navigator !== "undefined" ? navigator.userAgent : "",
+    typeof location !== "undefined" ? location.href.split("?")[0] : "",
+    ""
+  ].filter(Boolean).join("\n");
+  return head + readFaults().map((f) => `${new Date(f.at).toISOString()}  [${f.where}] ${f.what}`).join("\n");
+}
+
+// src/lib/collector.ts
+var TIMEOUT_MS = 8e3;
+var MAX_SHOT_BYTES = 6 * 1024 * 1024;
+function blobToDataUrl(blob) {
+  return new Promise((resolve) => {
+    try {
+      const reader = new FileReader();
+      reader.onload = () => resolve(typeof reader.result === "string" ? reader.result : null);
+      reader.onerror = () => resolve(null);
+      reader.readAsDataURL(blob);
+    } catch {
+      resolve(null);
+    }
+  });
+}
+async function sendToCollector(note, cfg) {
+  if (typeof fetch === "undefined" || !cfg?.url || !cfg.token || !cfg.project) return false;
+  let shot;
+  if (note.screenshot && note.screenshot.size <= MAX_SHOT_BYTES) {
+    shot = await blobToDataUrl(note.screenshot) ?? void 0;
+  }
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), TIMEOUT_MS);
+  try {
+    const res = await fetch(`${cfg.url.replace(/\/$/, "")}/notes`, {
+      method: "POST",
+      signal: controller.signal,
+      headers: {
+        "content-type": "application/json",
+        authorization: `Bearer ${cfg.token}`
+      },
+      body: JSON.stringify({
+        project: cfg.project,
+        // A campaign per day is the shape that matches how testing actually
+        // happens, and it means nobody has to name anything.
+        campaign: cfg.campaign || (/* @__PURE__ */ new Date()).toISOString().slice(0, 10),
+        tester: cfg.tester,
+        id: note.id,
+        route: note.route,
+        description: note.description,
+        wanted: note.wanted,
+        why: note.why,
+        severity: note.severity,
+        origin: note.origin,
+        shot
+      })
+    });
+    if (!res.ok) {
+      recordFault("collector", `server answered ${res.status}`);
+      return false;
+    }
+    return true;
+  } catch (err) {
+    recordFault("collector", err);
+    return false;
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
 // src/lib/strings.ts
 var STR = {
   en: {
@@ -2881,38 +2985,6 @@ function neutralizeDocumentColors(doc, aggressive = false) {
   return touched;
 }
 
-// src/lib/faultLog.ts
-var LIMIT = 40;
-var faults = [];
-function recordFault(where, err) {
-  const what = err instanceof Error ? `${err.name}: ${err.message}` : typeof err === "string" ? err : (() => {
-    try {
-      return JSON.stringify(err);
-    } catch {
-      return String(err);
-    }
-  })();
-  faults.push({ at: Date.now(), where, what: what.slice(0, 500) });
-  if (faults.length > LIMIT) faults.splice(0, faults.length - LIMIT);
-  console.warn(`[QA] ${where}:`, err);
-}
-function readFaults() {
-  return [...faults].reverse();
-}
-function clearFaults() {
-  faults.length = 0;
-}
-function faultsAsText(version) {
-  if (!faults.length) return "No faults recorded.";
-  const head = [
-    `qapture ${version}`,
-    typeof navigator !== "undefined" ? navigator.userAgent : "",
-    typeof location !== "undefined" ? location.href.split("?")[0] : "",
-    ""
-  ].filter(Boolean).join("\n");
-  return head + readFaults().map((f) => `${new Date(f.at).toISOString()}  [${f.where}] ${f.what}`).join("\n");
-}
-
 // src/lib/capture.ts
 var HTML2CANVAS_TIMEOUT_MS = 1e4;
 var CHUNK_TIMEOUT_MS = 8e3;
@@ -3355,7 +3427,7 @@ function noteCheckLine(note, index) {
   const where = oneLine(note.route) || "/";
   const wanted = oneLine(note.wanted);
   const seen = oneLine(note.description) || "(not described)";
-  const claim = wanted || `${seen} \u2014 _no expectation was given; ask before assuming one_`;
+  const claim = wanted || seen;
   const trimmed = claim.length > 180 ? `${claim.slice(0, 177)}...` : claim;
   return `- [ ] **check-${index}** (\`${where}\`) \u2014 ${trimmed}`;
 }
@@ -3405,12 +3477,12 @@ function noteToMarkdown(note, opts) {
   lines.push("### Observed");
   lines.push("");
   lines.push(oneLine(note.description) ? note.description.trim() : "_(not described)_");
-  lines.push("");
-  lines.push("### Expected");
-  lines.push("");
-  lines.push(
-    note.wanted && oneLine(note.wanted) ? note.wanted.trim() : "_(the tester did not say what they expected instead -- ask rather than assume)_"
-  );
+  if (note.wanted && oneLine(note.wanted)) {
+    lines.push("");
+    lines.push("### Expected");
+    lines.push("");
+    lines.push(note.wanted.trim());
+  }
   if (note.why && oneLine(note.why)) {
     lines.push("");
     lines.push("### Why it matters");
@@ -3700,7 +3772,8 @@ Hand \`verify.md\` back with the work.
 
 ### What is in this archive
 
-- \`notes.md\` \u2014 the points themselves. Each one carries **Observed** and **Expected** under those exact headings. They are separate on purpose: where a report leaves the expectation out, agents do not stop and ask, they pick a reading and commit to it. Where you see Expected marked as not given, **ask rather than assume**.
+- \`notes.md\` \u2014 the points themselves, under an **Observed** heading. Most carry only that: the tester writes one sentence about what is wrong, which is the right amount to ask of somebody who is not an engineer. An **Expected** heading appears where somebody stated one.
+  Where a point is ambiguous, **ask \u2014 do not pick a reading and commit to it.** That failure mode is specific to you: a person would stop and check, and an agent tends to fill the gap in and carry on. One question costs a message. A confident fix to the wrong problem costs the round.
 - \`verify.md\` \u2014 the checklist, one unticked box per point.
 - \`screenshots/\` \u2014 one per point. A point marked with a screenshot caveat was re-drawn rather than photographed, so canvases, charts and maps may be blank in it; trust the words over the picture there.
 - \`context/\` \u2014 console, network, environment and element forensics, one file per point. Deliberately **not** in \`notes.md\`: a longer report measurably lowers the chance of the right thing getting fixed, because the two sentences that matter get buried. Open these only when something is genuinely unresolved.
@@ -4525,18 +4598,6 @@ async function requestPersistentStorage() {
     return false;
   }
 }
-function formatBytes(bytes) {
-  if (!Number.isFinite(bytes) || bytes <= 0) return "0 KB";
-  const units = ["B", "KB", "MB", "GB", "TB"];
-  let value = bytes;
-  let i = 0;
-  while (value >= 1024 && i < units.length - 1) {
-    value /= 1024;
-    i++;
-  }
-  const decimals = value < 10 && i > 1 ? 1 : 0;
-  return `${value.toFixed(decimals)} ${units[i]}`;
-}
 function estimateOwnBytes(notes) {
   let total = 0;
   for (const n of notes) {
@@ -5038,8 +5099,11 @@ function QaProvider({
         });
       }
       await syncNoteThrough(note);
+      if (config.collector) {
+        void sendToCollector(note, config.collector);
+      }
     },
-    [idb, config.journey, config.captureContext, testAlong, testAlongSteps, notify, t, syncNoteThrough, applyNotes]
+    [idb, config.journey, config.captureContext, config.collector, testAlong, testAlongSteps, notify, t, syncNoteThrough, applyNotes]
   );
   const updateNote = React.useCallback(
     async (id, patch) => {
@@ -8150,7 +8214,7 @@ function upgradeHint(latest) {
 }
 
 // src/version.ts
-var QA_VERSION = "0.9.0" ;
+var QA_VERSION = "0.9.1" ;
 function Section({
   icon,
   title,
@@ -8256,8 +8320,8 @@ function SettingsSheet({ onClose }) {
   const syncing = sync.state === "syncing";
   const viaZip = sync.engine === "download";
   const quotaKnown = storageHealth.supported && storageHealth.quotaBytes > 0;
-  const usedPct = quotaKnown ? Math.min(100, Math.round(storageHealth.ratio * 100)) : 0;
-  const meterColor = storageHealth.level === "critical" ? "var(--qa-danger)" : storageHealth.level === "warn" ? "var(--qa-warn)" : "var(--qa-accent)";
+  quotaKnown ? Math.min(100, Math.round(storageHealth.ratio * 100)) : 0;
+  storageHealth.level === "critical" ? "var(--qa-danger)" : storageHealth.level === "warn" ? "var(--qa-warn)" : "var(--qa-accent)";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -8386,77 +8450,6 @@ function SettingsSheet({ onClose }) {
             )
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "qa-h-px qa-bg-3 qa-mt-3 qa-mb-4" }),
-          /* @__PURE__ */ jsxRuntime.jsxs(Section, { icon: "HardDrive", title: t("storage_title"), children: [
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "qa-m-0 qa-text-10 qa-text-lo qa-leading-relaxed", children: t("storage_explain") }),
-            quotaKnown && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: "qa-w-full qa-rounded-full qa-overflow-hidden qa-bg-3",
-                  role: "img",
-                  "aria-label": t("storage_used", {
-                    used: formatBytes(storageHealth.usageBytes),
-                    quota: formatBytes(storageHealth.quotaBytes)
-                  }),
-                  style: { height: 6 },
-                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: `${usedPct}%`, height: "100%", background: meterColor } })
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "qa-m-0 qa-text-10 qa-text-mid", children: [
-                t("storage_used", {
-                  used: formatBytes(storageHealth.usageBytes),
-                  quota: formatBytes(storageHealth.quotaBytes)
-                }),
-                " \xB7 ",
-                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-text-lo", children: [
-                  "Qapture ",
-                  formatBytes(storageHealth.ownBytes)
-                ] })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-items-start qa-gap-2 qa-text-xs qa-text-hi", style: { cursor: "pointer" }, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "input",
-                {
-                  type: "checkbox",
-                  checked: autoBackup,
-                  onChange: (e) => setAutoBackup(e.target.checked),
-                  style: { marginTop: 2 }
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-                t("autosave_label"),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-block qa-text-10 qa-text-lo qa-leading-relaxed", children: t("autosave_hint", { n: autoBackupEvery }) })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "qa-flex qa-flex-wrap qa-gap-2", children: [
-              storageHealth.persisted ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-inline-flex qa-items-center qa-gap-1 qa-rounded-full qa-bg-success-tint qa-text-success qa-px-2 qa-py-0.5 qa-text-10", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "CheckCircle2", size: 11 }),
-                t("persist_on")
-              ] }) : /* @__PURE__ */ jsxRuntime.jsx(
-                "button",
-                {
-                  type: "button",
-                  disabled: busy,
-                  onClick: () => void run2(requestPersistentStorage2),
-                  className: "qa-tap qa-rounded-lg qa-border qa-border-subtle qa-px-2 qa-py-1 qa-text-10 qa-text-mid",
-                  style: { background: "transparent", cursor: "pointer" },
-                  children: t("persist_keep")
-                }
-              ),
-              notes.some((n) => n.screenshot) && /* @__PURE__ */ jsxRuntime.jsx(
-                "button",
-                {
-                  type: "button",
-                  disabled: busy,
-                  onClick: () => void run2(dropAllScreenshots),
-                  className: "qa-tap qa-rounded-lg qa-border qa-border-subtle qa-px-2 qa-py-1 qa-text-10 qa-text-mid",
-                  style: { background: "transparent", cursor: "pointer" },
-                  children: t("drop_shots")
-                }
-              )
-            ] })
-          ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "qa-h-px qa-bg-3 qa-mt-3 qa-mb-4" }),
           /* @__PURE__ */ jsxRuntime.jsxs(Section, { icon: "Camera", title: t("exact_label"), children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "qa-m-0 qa-text-10 qa-text-lo qa-leading-relaxed", children: t("exact_hint") }),
@@ -10021,98 +10014,6 @@ function findDuplicate(text, selector, existing) {
   }
   return null;
 }
-function recogniser() {
-  if (typeof window === "undefined") return null;
-  const w = window;
-  return w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;
-}
-function VoiceButton({
-  onText,
-  onInterim
-}) {
-  const { lang, t } = useQa();
-  const [listening, setListening] = React.useState(false);
-  const [failed, setFailed] = React.useState(null);
-  const ref = React.useRef(null);
-  React.useEffect(() => () => {
-    ref.current?.abort();
-    ref.current = null;
-  }, []);
-  const Ctor = recogniser();
-  if (!Ctor) return null;
-  const stop = () => {
-    ref.current?.stop();
-    ref.current = null;
-    setListening(false);
-    onInterim?.("");
-  };
-  const start = () => {
-    if (listening) {
-      stop();
-      return;
-    }
-    setFailed(null);
-    let rec;
-    try {
-      rec = new Ctor();
-    } catch {
-      setFailed(t("voice_failed"));
-      return;
-    }
-    rec.lang = lang === "ar" ? "ar-IQ" : "en-US";
-    rec.continuous = true;
-    rec.interimResults = true;
-    rec.onresult = (e) => {
-      let done = "";
-      let partial = "";
-      for (let i = e.resultIndex; i < e.results.length; i++) {
-        const r = e.results[i];
-        const text = r[0]?.transcript ?? "";
-        if (r.isFinal) done += text;
-        else partial += text;
-      }
-      if (done.trim()) onText(done.trim());
-      onInterim?.(partial);
-    };
-    rec.onerror = (e) => {
-      if (e.error && e.error !== "no-speech" && e.error !== "aborted") {
-        setFailed(e.error === "not-allowed" ? t("voice_denied") : t("voice_failed"));
-      }
-      setListening(false);
-      onInterim?.("");
-    };
-    rec.onend = () => {
-      setListening(false);
-      onInterim?.("");
-    };
-    try {
-      rec.start();
-      ref.current = rec;
-      setListening(true);
-    } catch {
-      setFailed(t("voice_failed"));
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-inline-flex qa-items-center qa-gap-1.5", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: start,
-        "aria-pressed": listening,
-        title: listening ? t("voice_stop") : t("voice_start"),
-        "data-qa-voice": listening ? "listening" : "idle",
-        className: `qa-tap qa-inline-flex qa-items-center qa-gap-1 qa-rounded-full qa-border qa-border-subtle qa-px-2 qa-py-1 qa-text-11 qa-focus-ring ${listening ? "qa-bg-danger-tint qa-text-danger" : "qa-bg-2 qa-text-mid"}`,
-        style: { cursor: "pointer" },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: listening ? "Square" : "Mic", size: 12 }),
-          listening ? t("voice_stop") : t("voice_start")
-        ]
-      }
-    ),
-    failed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-10 qa-text-danger", children: failed })
-  ] });
-}
 var DRAG_THRESHOLD2 = 6;
 var TOUCH_DRAG_THRESHOLD = 12;
 var MIN_REGION_SIZE = 8;
@@ -10184,11 +10085,7 @@ function CaptureMode() {
   const [shot, setShot] = React.useState(null);
   const stillRef = React.useRef(null);
   const [notesFromThisShot, setNotesFromThisShot] = React.useState(0);
-  const [wanted, setWanted] = React.useState("");
-  const [why, setWhy] = React.useState("");
-  const [fixHint, setFixHint] = React.useState("");
   const [origin, setOrigin] = React.useState(void 0);
-  const [spoken, setSpoken] = React.useState("");
   const [shotEngine, setShotEngine] = React.useState(null);
   const [shotUrl, setShotUrl] = React.useState(null);
   const [capturing, setCapturing] = React.useState(false);
@@ -10508,9 +10405,6 @@ function CaptureMode() {
     setShot(null);
     setShotEngine(null);
     setDescription("");
-    setWanted("");
-    setWhy("");
-    setFixHint("");
     setSeverity("bug");
     setTargetForensics(void 0);
     setOrigin(void 0);
@@ -10533,9 +10427,6 @@ function CaptureMode() {
     };
     await addNote({
       description,
-      wanted,
-      why,
-      fixHint,
       screenshot: shot ?? void 0,
       shotEngine: shotEngine ?? void 0,
       target,
@@ -11208,87 +11099,24 @@ function CaptureMode() {
               twin.description.length > 70 ? "\u2026" : "",
               "\u201D"
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-font-semibold qa-text-hi", children: t("q_observed") }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  VoiceButton,
-                  {
-                    onText: (text) => setDescription((d) => d ? `${d} ${text}` : text),
-                    onInterim: setSpoken
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "textarea",
+              {
+                ref: taRef,
+                value: description,
+                onChange: (e) => setDescription(e.target.value),
+                onKeyDown: (e) => {
+                  if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
+                  if ((e.altKey || e.metaKey || e.ctrlKey) && SEVERITIES2[Number(e.key) - 1]) {
+                    e.preventDefault();
+                    setSeverity(SEVERITIES2[Number(e.key) - 1]);
                   }
-                )
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "textarea",
-                {
-                  ref: taRef,
-                  value: description + (spoken ? ` ${spoken}` : ""),
-                  onChange: (e) => setDescription(e.target.value),
-                  onKeyDown: (e) => {
-                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
-                    if ((e.altKey || e.metaKey || e.ctrlKey) && SEVERITIES2[Number(e.key) - 1]) {
-                      e.preventDefault();
-                      setSeverity(SEVERITIES2[Number(e.key) - 1]);
-                    }
-                  },
-                  rows: 2,
-                  placeholder: t("q_observed_hint"),
-                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-font-semibold qa-text-hi", children: t("q_wanted") }),
-                /* @__PURE__ */ jsxRuntime.jsx(VoiceButton, { onText: (x) => setWanted((d) => d ? `${d} ${x}` : x) })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "textarea",
-                {
-                  value: wanted,
-                  onChange: (e) => setWanted(e.target.value),
-                  onKeyDown: (e) => {
-                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
-                  },
-                  rows: 2,
-                  placeholder: t("q_wanted_hint"),
-                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-text-mid", children: t("q_why") }),
-                /* @__PURE__ */ jsxRuntime.jsx(VoiceButton, { onText: (x) => setWhy((d) => d ? `${d} ${x}` : x) })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "textarea",
-                {
-                  value: why,
-                  onChange: (e) => setWhy(e.target.value),
-                  onKeyDown: (e) => {
-                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
-                  },
-                  rows: 1,
-                  placeholder: t("q_why_hint"),
-                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
-                }
-              )
-            ] }),
-            developerMode && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-text-mid", children: t("q_fix") }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "textarea",
-                {
-                  value: fixHint,
-                  onChange: (e) => setFixHint(e.target.value),
-                  rows: 1,
-                  placeholder: t("q_fix_hint"),
-                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
-                }
-              )
-            ] }),
+                },
+                rows: 3,
+                placeholder: t("annotate_placeholder"),
+                className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
+              }
+            ),
             developerMode && origin && (origin.component || origin.file) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "qa-text-10 qa-text-mid", "data-qa-origin": "true", children: [
               origin.component ?? "\u2014",
               origin.file ? ` \xB7 ${origin.file}${origin.line ? `:${origin.line}` : ""}` : ""
@@ -11542,5 +11370,5 @@ function Qapture({ config }) {
 exports.Qapture = Qapture;
 exports.deleteQaDatabase = deleteQaDatabase;
 exports.initQaStudio = initQaStudio;
-//# sourceMappingURL=chunk-5EWNGJ2N.cjs.map
-//# sourceMappingURL=chunk-5EWNGJ2N.cjs.map
+//# sourceMappingURL=chunk-J77SGE5E.cjs.map
+//# sourceMappingURL=chunk-J77SGE5E.cjs.map

package/dist/index.cjs

@@ -1,24 +1,24 @@
 'use strict';
 
-var chunk5EWNGJ2N_cjs = require('./chunk-5EWNGJ2N.cjs');
+var chunkJ77SGE5E_cjs = require('./chunk-J77SGE5E.cjs');
 
 
 
 Object.defineProperty(exports, "QaStudio", {
   enumerable: true,
-  get: function () { return chunk5EWNGJ2N_cjs.Qapture; }
+  get: function () { return chunkJ77SGE5E_cjs.Qapture; }
 });
 Object.defineProperty(exports, "Qapture", {
   enumerable: true,
-  get: function () { return chunk5EWNGJ2N_cjs.Qapture; }
+  get: function () { return chunkJ77SGE5E_cjs.Qapture; }
 });
 Object.defineProperty(exports, "deleteQaDatabase", {
   enumerable: true,
-  get: function () { return chunk5EWNGJ2N_cjs.deleteQaDatabase; }
+  get: function () { return chunkJ77SGE5E_cjs.deleteQaDatabase; }
 });
 Object.defineProperty(exports, "initQaStudio", {
   enumerable: true,
-  get: function () { return chunk5EWNGJ2N_cjs.initQaStudio; }
+  get: function () { return chunkJ77SGE5E_cjs.initQaStudio; }
 });
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.cts

@@ -125,6 +125,24 @@ type QaConfig = {
      * no interruption. It is a label, not an announcement.
      */
     beta?: boolean;
+    /**
+     * Post each note to a collector as it is written, so the client never has to
+     * remember to export and send anything.
+     *
+     * Purely additive: notes are saved locally first and the export is unchanged,
+     * so a collector that is down or unreachable costs nothing at all.
+     *
+     * The token here is WRITE-ONLY and ships to the browser, which is fine by
+     * design: it can add notes to one project and cannot read anything back.
+     * Never put the collector's admin token in a page.
+     */
+    collector?: {
+        url: string;
+        token: string;
+        project: string;
+        campaign?: string;
+        tester?: string;
+    };
     /**
      * Whether the panel is visible.
      * - true / false: always show / always hide
@@ -169,6 +187,13 @@ type ResolvedConfig = {
     preamble: QaPreamble | null;
     rtl: boolean;
     beta: boolean;
+    collector: {
+        url: string;
+        token: string;
+        project: string;
+        campaign?: string;
+        tester?: string;
+    } | null;
     /**
      * Visibility sentinel.
      * - true: always show