@mhosaic/feedback 0.13.0 → 0.15.0

package/dist/{chunk-64HXWJCH.mjs → chunk-67JM6XVT.mjs}

@@ -1,6 +1,6 @@
 import {
   scrubCredentials
-} from "./chunk-DKE6ELJ4.mjs";
+} from "./chunk-FGA63IEZ.mjs";
 
 // src/api/client.ts
 var SCALAR_FIELDS = [
@@ -12,6 +12,23 @@ var SCALAR_FIELDS = [
   "user_agent",
   "capture_method"
 ];
+function assertSafeEndpoint(endpoint) {
+  let parsed;
+  try {
+    parsed = new URL(endpoint);
+  } catch {
+    throw new Error(
+      `[mhosaic-feedback] \`endpoint\` is not a valid URL: ${endpoint}`
+    );
+  }
+  if (parsed.protocol === "https:") return;
+  if (parsed.protocol === "http:" && (parsed.hostname === "localhost" || parsed.hostname === "127.0.0.1" || parsed.hostname === "[::1]")) {
+    return;
+  }
+  throw new Error(
+    `[mhosaic-feedback] \`endpoint\` must use https:// (got ${parsed.protocol}//${parsed.hostname}). http:// is only allowed for localhost in dev.`
+  );
+}
 function createApiClient(options) {
   const endpoint = (options.endpoint ?? "").replace(/\/+$/, "");
   if (!endpoint) {
@@ -19,6 +36,7 @@ function createApiClient(options) {
       '[mhosaic-feedback] `endpoint` is required (e.g. "https://feedback.example.com").'
     );
   }
+  assertSafeEndpoint(endpoint);
   const fetcher = options.fetch ?? globalThis.fetch;
   async function submitReport(input) {
     let payload = input;
@@ -551,10 +569,6 @@ var DEFAULT_STRINGS = {
   "form.screenshot.annotate": "Annotate",
   "form.screenshot.error_type": "Unsupported file type. Use PNG, JPEG or WebP.",
   "form.screenshot.error_size": "File too large (max {max} MB).",
-  "form.screenshot.or": "or",
-  "form.screenshot.capture_page": "Capture this page",
-  "form.screenshot.capture_page_hint": "Pick a tab or window to share",
-  "form.screenshot.capture_error": "Couldn\u2019t capture the page. Try uploading a screenshot instead.",
   "form.context.label": "Page",
   "type.bug": "Bug",
   "type.feature": "Feature request",
@@ -688,10 +702,6 @@ var FRENCH_STRINGS = {
   "form.screenshot.annotate": "Annoter",
   "form.screenshot.error_type": "Format non support\xE9. Utilisez PNG, JPEG ou WebP.",
   "form.screenshot.error_size": "Fichier trop volumineux (max {max} Mo).",
-  "form.screenshot.or": "ou",
-  "form.screenshot.capture_page": "Capturer la page",
-  "form.screenshot.capture_page_hint": "Choisissez un onglet ou une fen\xEAtre \xE0 partager",
-  "form.screenshot.capture_error": "Impossible de capturer la page. T\xE9l\xE9versez une capture \xE0 la place.",
   "form.context.label": "Page",
   "type.bug": "Bogue",
   "type.feature": "Suggestion",
@@ -880,64 +890,19 @@ function truncateUrl(url, maxLength = 80) {
   const keepEnd = maxLength - 1 - keepStart;
   return `${url.slice(0, keepStart)}\u2026${url.slice(url.length - keepEnd)}`;
 }
-async function captureWithDisplayMedia() {
-  if (typeof navigator === "undefined" || !navigator.mediaDevices?.getDisplayMedia) {
-    return null;
-  }
-  let stream = null;
+function safeExternalHref(url) {
+  if (!url) return void 0;
+  let parsed;
   try {
-    stream = await navigator.mediaDevices.getDisplayMedia({
-      video: { displaySurface: "browser" },
-      audio: false
-      // Hint that audio isn't needed; not all browsers honor this but it
-      // avoids the audio-share toggle being defaulted on in some.
-    });
+    parsed = new URL(url);
   } catch {
-    return null;
+    return void 0;
   }
-  try {
-    const track = stream.getVideoTracks()[0];
-    if (!track) return null;
-    const ImageCaptureCtor = window.ImageCapture;
-    let bitmap = null;
-    if (ImageCaptureCtor) {
-      try {
-        const ic = new ImageCaptureCtor(track);
-        bitmap = await ic.grabFrame();
-      } catch {
-        bitmap = null;
-      }
-    }
-    if (!bitmap) {
-      bitmap = await grabFrameViaVideo(stream);
-    }
-    if (!bitmap) return null;
-    const canvas = document.createElement("canvas");
-    canvas.width = bitmap.width;
-    canvas.height = bitmap.height;
-    const ctx = canvas.getContext("2d");
-    if (!ctx) return null;
-    ctx.drawImage(bitmap, 0, 0);
-    return await new Promise(
-      (resolve) => canvas.toBlob(resolve, "image/png")
-    );
-  } finally {
-    stream.getTracks().forEach((t) => t.stop());
-  }
-}
-async function grabFrameViaVideo(stream) {
-  const video = document.createElement("video");
-  video.muted = true;
-  video.playsInline = true;
-  video.srcObject = stream;
-  try {
-    await video.play();
-    await new Promise((r) => requestAnimationFrame(() => r()));
-    if (!video.videoWidth || !video.videoHeight) return null;
-    return await createImageBitmap(video);
-  } catch {
-    return null;
+  if (parsed.protocol === "https:") return parsed.toString();
+  if (parsed.protocol === "http:" && (parsed.hostname === "localhost" || parsed.hostname === "127.0.0.1" || parsed.hostname === "[::1]")) {
+    return parsed.toString();
   }
+  return void 0;
 }
 
 // src/widget/ReportDetailView.tsx
@@ -1047,16 +1012,19 @@ function ReportDetailView({
     /* @__PURE__ */ jsxs2("div", { class: "report-detail-body", children: [
       /* @__PURE__ */ jsx2(ContextBlock, { detail, strings }),
       /* @__PURE__ */ jsx2("p", { class: "report-detail-description", children: detail.description }),
-      detail.screenshot_url && /* @__PURE__ */ jsx2(
-        "a",
-        {
-          class: "report-detail-screenshot",
-          href: detail.screenshot_url,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: /* @__PURE__ */ jsx2("img", { src: detail.screenshot_url, alt: "", loading: "lazy" })
-        }
-      ),
+      detail.screenshot_url && (() => {
+        const safeHref = safeExternalHref(detail.screenshot_url);
+        return safeHref ? /* @__PURE__ */ jsx2(
+          "a",
+          {
+            class: "report-detail-screenshot",
+            href: safeHref,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            children: /* @__PURE__ */ jsx2("img", { src: detail.screenshot_url, alt: "", loading: "lazy" })
+          }
+        ) : /* @__PURE__ */ jsx2("div", { class: "report-detail-screenshot", children: /* @__PURE__ */ jsx2("img", { src: detail.screenshot_url, alt: "", loading: "lazy" }) });
+      })(),
       /* @__PURE__ */ jsx2("h3", { class: "report-detail-section", children: strings["detail.thread"] }),
       detail.comments.length === 0 ? /* @__PURE__ */ jsx2("p", { class: "report-detail-empty", children: strings["detail.no_replies"] }) : /* @__PURE__ */ jsx2("ul", { class: "report-comments", children: detail.comments.map((c) => /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsx2(CommentBubble, { comment: c, strings }) })) }),
       detail.status_history && detail.status_history.length > 0 && /* @__PURE__ */ jsx2(StatusHistorySection, { rows: detail.status_history, strings }),
@@ -1115,19 +1083,22 @@ function ContextBlock({ detail, strings }) {
       /* @__PURE__ */ jsx2("span", { class: "report-detail-context-label", children: strings["detail.context.submitted_at"] }),
       /* @__PURE__ */ jsx2("span", { children: formatSubmittedAt(detail.created_at) })
     ] }),
-    detail.page_url && /* @__PURE__ */ jsxs2("div", { class: "report-detail-context-line", title: detail.page_url, children: [
-      /* @__PURE__ */ jsx2("span", { class: "report-detail-context-label", children: strings["detail.context.page"] }),
-      /* @__PURE__ */ jsx2(
-        "a",
-        {
-          class: "report-detail-context-url",
-          href: detail.page_url,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: truncateUrl(detail.page_url, 64)
-        }
-      )
-    ] })
+    detail.page_url && (() => {
+      const safeHref = safeExternalHref(detail.page_url);
+      return /* @__PURE__ */ jsxs2("div", { class: "report-detail-context-line", title: detail.page_url, children: [
+        /* @__PURE__ */ jsx2("span", { class: "report-detail-context-label", children: strings["detail.context.page"] }),
+        safeHref ? /* @__PURE__ */ jsx2(
+          "a",
+          {
+            class: "report-detail-context-url",
+            href: safeHref,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            children: truncateUrl(detail.page_url, 64)
+          }
+        ) : /* @__PURE__ */ jsx2("span", { class: "report-detail-context-url", children: truncateUrl(detail.page_url, 64) })
+      ] });
+    })()
   ] });
 }
 function formatSubmittedAt(iso) {
@@ -2347,10 +2318,8 @@ function Form({ strings, onSubmit, onCancel, status, errorMessage }) {
   const [localError, setLocalError] = useState5("");
   const [screenshotBlob, setScreenshotBlob] = useState5(null);
   const [screenshotPreview, setScreenshotPreview] = useState5(null);
-  const [screenshotMethod, setScreenshotMethod] = useState5("manual");
   const [isDragOver, setIsDragOver] = useState5(false);
   const [annotatorOpen, setAnnotatorOpen] = useState5(false);
-  const [capturing, setCapturing] = useState5(false);
   const fileInputRef = useRef4(null);
   const dropZoneRef = useRef4(null);
   const submitting = status === "submitting";
@@ -2361,7 +2330,7 @@ function Form({ strings, onSubmit, onCancel, status, errorMessage }) {
       if (screenshotPreview) URL.revokeObjectURL(screenshotPreview);
     };
   }, [screenshotPreview]);
-  const acceptFile = (file, method = "manual") => {
+  const acceptFile = (file) => {
     setLocalError("");
     if (file instanceof File) {
       const err = validateScreenshotFile(file);
@@ -2375,41 +2344,14 @@ function Form({ strings, onSubmit, onCancel, status, errorMessage }) {
     if (screenshotPreview) URL.revokeObjectURL(screenshotPreview);
     setScreenshotBlob(file);
     setScreenshotPreview(URL.createObjectURL(file));
-    setScreenshotMethod(method);
   };
   const clearScreenshot = () => {
     if (screenshotPreview) URL.revokeObjectURL(screenshotPreview);
     setScreenshotPreview(null);
     setScreenshotBlob(null);
-    setScreenshotMethod("manual");
     setLocalError("");
     if (fileInputRef.current) fileInputRef.current.value = "";
   };
-  const handleCapturePage = async () => {
-    if (capturing) return;
-    setLocalError("");
-    setCapturing(true);
-    try {
-      const blob = await captureWithDisplayMedia();
-      if (!blob) {
-        if (typeof navigator === "undefined" || !navigator.mediaDevices?.getDisplayMedia) {
-          setLocalError(strings["form.screenshot.capture_error"]);
-        }
-        return;
-      }
-      if (blob.size > 10 * 1024 * 1024) {
-        setLocalError(
-          strings["form.screenshot.error_size"].replace("{max}", "10")
-        );
-        return;
-      }
-      acceptFile(blob, "display_media");
-    } catch {
-      setLocalError(strings["form.screenshot.capture_error"]);
-    } finally {
-      setCapturing(false);
-    }
-  };
   const handleFileInputChange = (e) => {
     const file = e.target.files?.[0];
     if (file) acceptFile(file);
@@ -2471,7 +2413,7 @@ function Form({ strings, onSubmit, onCancel, status, errorMessage }) {
     };
     if (screenshotBlob) {
       values.screenshot = screenshotBlob;
-      values.capture_method = screenshotMethod;
+      values.capture_method = "manual";
     }
     onSubmit(values);
   };
@@ -2584,43 +2526,7 @@ function Form({ strings, onSubmit, onCancel, status, errorMessage }) {
             /* @__PURE__ */ jsx8("div", { class: "screenshot-formats", children: strings["form.screenshot.formats"] })
           ]
         }
-      ),
-      !screenshotPreview && /* @__PURE__ */ jsxs7("div", { class: "screenshot-alt", children: [
-        /* @__PURE__ */ jsx8("span", { class: "screenshot-or", children: strings["form.screenshot.or"] }),
-        /* @__PURE__ */ jsxs7(
-          "button",
-          {
-            type: "button",
-            class: "btn btn--ghost screenshot-capture-page",
-            onClick: handleCapturePage,
-            disabled: capturing || submitting,
-            "aria-label": strings["form.screenshot.capture_page"],
-            children: [
-              /* @__PURE__ */ jsxs7(
-                "svg",
-                {
-                  width: "14",
-                  height: "14",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  "stroke-width": "2",
-                  "stroke-linecap": "round",
-                  "stroke-linejoin": "round",
-                  "aria-hidden": "true",
-                  children: [
-                    /* @__PURE__ */ jsx8("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", ry: "2" }),
-                    /* @__PURE__ */ jsx8("line", { x1: "8", y1: "21", x2: "16", y2: "21" }),
-                    /* @__PURE__ */ jsx8("line", { x1: "12", y1: "17", x2: "12", y2: "21" })
-                  ]
-                }
-              ),
-              capturing ? strings["form.submitting"] : strings["form.screenshot.capture_page"]
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx8("span", { class: "screenshot-capture-hint", children: strings["form.screenshot.capture_page_hint"] })
-      ] })
+      )
     ] }),
     pageUrl && /* @__PURE__ */ jsxs7("div", { class: "page-context", title: pageUrl, children: [
       /* @__PURE__ */ jsx8("span", { class: "page-context-label", children: strings["form.context.label"] }),
@@ -3261,40 +3167,6 @@ var WIDGET_STYLES = `
 .screenshot-cta strong { color: var(--mfb-accent); font-weight: 600; }
 .screenshot-formats { font-size: var(--mfb-text-xs); color: var(--mfb-text-muted); }
 
-/* "or \u2014 Capture this page" row sits below the dropzone. The thin "or"
- * separator borrows the pattern from auth forms so the second option
- * reads as an alternative, not a follow-up step. v0.12. */
-.screenshot-alt {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  margin-top: 8px;
-  flex-wrap: wrap;
-}
-.screenshot-or {
-  position: relative;
-  font-size: var(--mfb-text-xs);
-  color: var(--mfb-text-muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  padding: 0 4px;
-}
-.screenshot-capture-page {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-}
-.screenshot-capture-page:disabled {
-  opacity: 0.55;
-  cursor: progress;
-}
-.screenshot-capture-hint {
-  font-size: var(--mfb-text-xs);
-  color: var(--mfb-text-muted);
-  flex: 1 1 100%;
-  margin-top: 4px;
-}
-
 .screenshot-preview {
   position: relative;
   border: 1px solid var(--mfb-border);
@@ -4530,6 +4402,7 @@ function mountWidget(options) {
   const mountPoint = document.createElement("div");
   shadow.appendChild(mountPoint);
   let currentState = { open: false, status: "idle", tab: "send" };
+  let postSubmitTimer = null;
   function rerender(state) {
     currentState = state;
     render(h(Root, { state }), mountPoint);
@@ -4545,8 +4418,10 @@ function mountWidget(options) {
       try {
         await options.onSubmit(values);
         rerender({ ...currentState, status: "success" });
-        setTimeout(
-          () => rerender({
+        if (postSubmitTimer !== null) clearTimeout(postSubmitTimer);
+        postSubmitTimer = setTimeout(() => {
+          postSubmitTimer = null;
+          rerender({
             ...currentState,
             open: false,
             status: "idle",
@@ -4554,9 +4429,8 @@ function mountWidget(options) {
             // they immediately see their just-filed report in the list
             // (and the conversation that's about to start).
             tab: options.api ? "mine" : "send"
-          }),
-          1200
-        );
+          });
+        }, 1200);
       } catch (err) {
         rerender({
           ...currentState,
@@ -4691,6 +4565,10 @@ function mountWidget(options) {
       rerender({ ...currentState, open: false, status: "idle" });
     },
     dispose() {
+      if (postSubmitTimer !== null) {
+        clearTimeout(postSubmitTimer);
+        postSubmitTimer = null;
+      }
       render(null, mountPoint);
       options.host.innerHTML = "";
     },
@@ -4743,7 +4621,10 @@ function createFeedback(config) {
   async function buildAndSubmit(values) {
     const manualScreenshot = values.synthetic ? void 0 : values.screenshot;
     const technical_context = capture.snapshot();
-    if (user) technical_context.user = user;
+    if (user) {
+      const { userHash: _hash, exp: _exp, ...safeUser } = user;
+      technical_context.user = safeUser;
+    }
     if (metadata && Object.keys(metadata).length > 0) {
       technical_context.metadata = { ...metadata };
     }
@@ -4758,8 +4639,8 @@ function createFeedback(config) {
       capture_method: captureMethod,
       technical_context
     };
-    if ("0.13.0") {
-      payload.widget_version = "0.13.0";
+    if ("0.15.0") {
+      payload.widget_version = "0.15.0";
     }
     if (manualScreenshot) payload.screenshot = manualScreenshot;
     if (values.synthetic) payload.synthetic = true;
@@ -4845,4 +4726,4 @@ function createFeedback(config) {
 export {
   createFeedback
 };
-//# sourceMappingURL=chunk-64HXWJCH.mjs.map
+//# sourceMappingURL=chunk-67JM6XVT.mjs.map