@scalemule/news-publication 0.0.25 → 0.0.27

package/dist/story-review.cjs

@@ -0,0 +1,980 @@
+"use client";
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/story-diff.ts
+function proseDiff(before, after) {
+  const tokens = (s) => s.match(/\s+|[\p{L}\p{N}\p{M}]+|[^\s]/gu) ?? [];
+  const a = tokens(before), b = tokens(after), out = [];
+  const emit = (kind, text) => {
+    if (!text) return;
+    const last = out.at(-1);
+    if (last?.kind === kind) last.text += text;
+    else out.push({ kind, text });
+  };
+  let start = 0, endA = a.length, endB = b.length;
+  while (start < endA && start < endB && a[start] === b[start]) {
+    emit("same", a[start]);
+    start++;
+  }
+  while (endA > start && endB > start && a[endA - 1] === b[endB - 1]) {
+    endA--;
+    endB--;
+  }
+  if ((endA - start) * (endB - start) > 25e4) {
+    emit("removed", a.slice(start, endA).join(""));
+    emit("added", b.slice(start, endB).join(""));
+  } else {
+    const n = endA - start, m = endB - start, grid = Array.from({ length: n + 1 }, () => new Uint32Array(m + 1));
+    for (let i2 = n - 1; i2 >= 0; i2--)
+      for (let j2 = m - 1; j2 >= 0; j2--)
+        grid[i2][j2] = a[start + i2] === b[start + j2] ? grid[i2 + 1][j2 + 1] + 1 : Math.max(grid[i2 + 1][j2], grid[i2][j2 + 1]);
+    let i = 0, j = 0;
+    while (i < n || j < m) {
+      if (i < n && j < m && a[start + i] === b[start + j]) {
+        emit("same", a[start + i]);
+        i++;
+        j++;
+      } else if (i < n && (j === m || grid[i + 1][j] >= grid[i][j + 1])) {
+        emit("removed", a[start + i]);
+        i++;
+      } else {
+        emit("added", b[start + j]);
+        j++;
+      }
+    }
+  }
+  emit("same", a.slice(endA).join(""));
+  return out;
+}
+function EditorialNotices({ editorial }) {
+  return editorial ? /* @__PURE__ */ jsxRuntime.jsxs("aside", { "aria-label": "Editorial notices", children: [
+    editorial.content_kind && editorial.content_kind !== "EDITORIAL" && /* @__PURE__ */ jsxRuntime.jsx("p", { children: human(editorial.content_kind) }),
+    editorial.disclosure && /* @__PURE__ */ jsxRuntime.jsx("p", { children: editorial.disclosure }),
+    editorial.notices?.map((n, i) => /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+        n.kind,
+        ": "
+      ] }),
+      n.text
+    ] }, i))
+  ] }) : null;
+}
+var human = (s) => s.toLowerCase().replaceAll("_", " ");
+function StoryReview({
+  sessionId,
+  publicationName,
+  nameplateUrl
+}) {
+  const base = `/api/news/review/${encodeURIComponent(sessionId)}`;
+  const [review, setReview] = react.useState(null), [error, setError] = react.useState(""), [notice, setNotice] = react.useState(""), [busy, setBusy] = react.useState(false), [panel, setPanel] = react.useState("article"), [verification, setVerification] = react.useState(false), [code, setCode] = react.useState("");
+  const [message, setMessage] = react.useState(""), [document, setDocument] = react.useState(null), [answers, setAnswers] = react.useState({}), [file, setFile] = react.useState(null), [rights, setRights] = react.useState(false), [compare, setCompare] = react.useState(""), [compareTo, setCompareTo] = react.useState(""), [editingMedia, setEditingMedia] = react.useState(""), [commentTarget, setCommentTarget] = react.useState("STORY");
+  const responseRef = react.useRef(null);
+  const thanksRef = react.useRef(null);
+  const [moreQuestions, setMoreQuestions] = react.useState(false);
+  const [correctionKind, setCorrectionKind] = react.useState("Correct a detail");
+  react.useEffect(() => {
+    if (panel !== "article") {
+      responseRef.current?.scrollIntoView({
+        block: "start",
+        behavior: window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth"
+      });
+      responseRef.current?.focus({ preventScroll: true });
+    }
+  }, [panel]);
+  const [mediaInfo, setMediaInfo] = react.useState({
+    caption: "",
+    who_is_pictured: "",
+    creator: "",
+    when_taken: "",
+    where_taken: "",
+    credit: "",
+    alt: ""
+  });
+  async function request(path = "", body) {
+    const form = body instanceof FormData;
+    const r = await fetch(base + path, {
+      method: body === void 0 ? "GET" : "POST",
+      credentials: "same-origin",
+      cache: "no-store",
+      headers: body === void 0 || form ? {} : { "content-type": "application/json" },
+      body: body === void 0 ? void 0 : form ? body : JSON.stringify(body)
+    });
+    const result = await r.json();
+    if (!r.ok || result.success === false)
+      throw new Error(
+        result.error?.message || "This private review is unavailable. Please contact the newsroom."
+      );
+    return result.data ?? result;
+  }
+  async function load() {
+    const data = await request();
+    if (data.verification_required) {
+      setVerification(true);
+      setReview(null);
+    } else {
+      setVerification(false);
+      setReview(data);
+      setDocument(data.revision.document);
+    }
+  }
+  react.useEffect(() => {
+    let active = true;
+    void (async () => {
+      try {
+        const token = window.location.hash.slice(1);
+        if (token) {
+          await request("/session", { token });
+          window.history.replaceState(null, "", window.location.pathname);
+        }
+        const data = await request();
+        if (active) {
+          if (data.verification_required) {
+            setVerification(true);
+            setReview(null);
+          } else {
+            setVerification(false);
+            setReview(data);
+            setDocument(data.revision.document);
+          }
+        }
+      } catch (e) {
+        if (active)
+          setError(e instanceof Error ? e.message : "Unable to open review.");
+      }
+    })();
+    return () => {
+      active = false;
+    };
+  }, [sessionId]);
+  async function send(action, success) {
+    if (!review) return;
+    setBusy(true);
+    setError("");
+    setNotice("");
+    try {
+      await request("", { revision_id: review.revision.id, ...action });
+      await load();
+      setNotice(success);
+      setPanel("article");
+      setMessage("");
+    } catch (e) {
+      setError(
+        e instanceof Error ? e.message : "Could not save your response."
+      );
+    } finally {
+      setBusy(false);
+    }
+  }
+  const can = (p) => review?.permissions.includes(p);
+  const celebration = !!review?.celebration_type;
+  const approved = review?.decision === "APPROVED";
+  const finalEditor = review?.review_policy === "SUBJECT_APPROVAL_PLUS_EDITOR";
+  const approvalThanks = `Thank you. We're glad to help commemorate this special occasion. This version has been sent to the ${review?.publication.name || publicationName} newsroom for final editorial review. It has not been published yet.`;
+  react.useEffect(() => {
+    if (approved && finalEditor && thanksRef.current) {
+      thanksRef.current.scrollIntoView({ block: "start" });
+      thanksRef.current.focus({ preventScroll: true });
+    }
+  }, [approved, finalEditor]);
+  const approve = () => {
+    if (celebration && finalEditor && !review?.questions.some((q) => q.required))
+      void send({ action: "APPROVE", message: null }, approvalThanks);
+    else setPanel("approve");
+  };
+  async function upload() {
+    if (!review || !file || !rights) return;
+    setBusy(true);
+    setError("");
+    try {
+      const form = new FormData();
+      form.set("file", file);
+      form.set(
+        "metadata",
+        JSON.stringify({ ...mediaInfo, rights_confirmed: true })
+      );
+      await request("/media", form);
+      await load();
+      setFile(null);
+      setRights(false);
+      setNotice(
+        "Media received privately. The newsroom will review it before publication."
+      );
+      setPanel("article");
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Upload failed.");
+    } finally {
+      setBusy(false);
+    }
+  }
+  const revisions = review ? [
+    review.revision,
+    ...review.history.filter((r) => r.id !== review.revision.id)
+  ] : [];
+  const selected = revisions.find((r) => r.id === compare), selectedAfter = revisions.find(
+    (r) => r.id === (compareTo || review?.revision.id)
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "main",
+    {
+      className: `sm-story-review${celebration ? " sm-review-celebration" : ""}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-private", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("strong", { children: review?.published ? "Private review" : "Private preview \xB7 Not published" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: review?.published ? "This revision has been published. This review link remains private." : `Prepared by ${publicationName} for ${celebration ? "family " : ""}review.` })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "sm-review-masthead", children: [
+          nameplateUrl && /* @__PURE__ */ jsxRuntime.jsx("img", { src: nameplateUrl, alt: "", width: 80, height: 80 }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: review?.publication.name || publicationName })
+        ] }),
+        error && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "sm-review-alert", children: error }),
+        notice && !(approved && finalEditor && notice === approvalThanks) && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", className: "sm-review-notice", children: notice }),
+        verification && /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "sm-review-form", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { children: "Verify your email" }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { children: "The editor requires verification using the email address on your invitation. Your story remains private until verified." }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              disabled: busy,
+              onClick: async () => {
+                setBusy(true);
+                setError("");
+                try {
+                  await request("/verify", {});
+                  setNotice(
+                    "A code was sent to the email address chosen by the editor. It expires in ten minutes."
+                  );
+                } catch (e) {
+                  setError(
+                    e instanceof Error ? e.message : "Could not send code."
+                  );
+                } finally {
+                  setBusy(false);
+                }
+              },
+              children: "Email me a verification code"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "form",
+            {
+              onSubmit: async (e) => {
+                e.preventDefault();
+                setBusy(true);
+                setError("");
+                try {
+                  await request("/verify", { code });
+                  await load();
+                  setCode("");
+                  setNotice("Email verified.");
+                } catch (e2) {
+                  setError(
+                    e2 instanceof Error ? e2.message : "Verification failed."
+                  );
+                } finally {
+                  setBusy(false);
+                }
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  "Eight-digit code",
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "input",
+                    {
+                      inputMode: "numeric",
+                      autoComplete: "one-time-code",
+                      pattern: "[0-9]{8}",
+                      required: true,
+                      value: code,
+                      onChange: (e) => setCode(e.target.value)
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, children: "Verify and open preview" })
+              ]
+            }
+          )
+        ] }),
+        !review && !error && !verification && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", children: "Opening your private preview\u2026" }),
+        review && document && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          celebration ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-intro", children: [
+            review.revision.number > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Updated preview" }),
+              " \u2014 We incorporated the information you sent us."
+            ] }) : /* @__PURE__ */ jsxRuntime.jsx("p", { children: "A special occasion, thoughtfully told. Read your announcement below." }),
+            /* @__PURE__ */ jsxRuntime.jsx("a", { href: "#review-options", children: "Review options" })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-intro", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+              "Prepared for ",
+              review.reviewer,
+              " \xB7 Version",
+              " ",
+              review.revision.number
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: ["FACT_CHECK", "CONTRIBUTOR_REVIEW"].includes(
+              review.review_policy
+            ) ? "Please help us check the facts and represent your contribution accurately. The newsroom retains the final editorial decision." : "Please review this announcement. You may suggest changes or decline participation." })
+          ] }),
+          approved && finalEditor && !review.published && /* @__PURE__ */ jsxRuntime.jsxs("section", { ref: thanksRef, tabIndex: -1, className: "sm-review-thanks", role: "status", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { children: "Thank you." }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "We're glad to help commemorate this special occasion." }),
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+              "This version has been sent to the ",
+              review.publication.name,
+              " ",
+              "newsroom for final editorial review. It has not been published yet."
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("article", { className: "sm-review-article", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "sm-review-category", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: review.revision.document.section }),
+              celebration && /* @__PURE__ */ jsxRuntime.jsx("span", { children: human(review.celebration_type || "") })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("h1", { children: review.revision.document.title }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "sm-review-dek", children: review.revision.document.subtitle }),
+            /* @__PURE__ */ jsxRuntime.jsx(EditorialNotices, { editorial: review.revision.editorial }),
+            review.revision.document.media.filter((m) => m.position === "hero").map((m) => /* @__PURE__ */ jsxRuntime.jsx(PrivatePhoto, { media: m, base }, m.file_id)),
+            celebration && !review.revision.document.media.some(
+              (m) => m.position === "hero"
+            ) && can("UPLOAD_MEDIA") && /* @__PURE__ */ jsxRuntime.jsxs(
+              "aside",
+              {
+                className: "sm-review-photo-invitation",
+                "aria-label": "Family photograph",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "A photograph makes it yours." }),
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Family photograph may be added before publication." })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setPanel("media"), children: "+ Add a photograph" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "sm-review-prose",
+                dangerouslySetInnerHTML: { __html: review.revision.content_html }
+              }
+            ),
+            review.revision.document.media.filter((m) => m.position !== "hero").map((m) => /* @__PURE__ */ jsxRuntime.jsx(PrivatePhoto, { media: m, base }, m.file_id))
+          ] }),
+          celebration && /* @__PURE__ */ jsxRuntime.jsxs("section", { id: "review-options", className: "sm-review-welcome", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { children: "Help us make this just right" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "We prepared this announcement as a starting point so you don't have to write anything yourself. If everything looks right, you can simply approve it." }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { children: "If you'd like, you can also correct a detail, add photographs, or tell us a little more about the couple. We'll take care of turning any additional information into the next draft." }),
+            can("ANSWER_QUESTIONS") && review.questions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                onClick: () => {
+                  setMoreQuestions(false);
+                  setPanel("questions");
+                },
+                children: "Tell Us More"
+              }
+            ),
+            can("DECLINE") && !review.published && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                className: "sm-review-quiet",
+                onClick: () => setPanel("decline"),
+                children: "Prefer Not to Publish"
+              }
+            ),
+            can("COMMENT") && /* @__PURE__ */ jsxRuntime.jsx("button", { className: "sm-review-quiet", onClick: () => setPanel("comment"), children: "Leave a Comment" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "nav",
+            {
+              className: `sm-review-actions${celebration ? " sm-review-concierge-actions" : ""}${panel !== "article" ? " sm-review-actions-editing" : ""}`,
+              "aria-label": "Review actions",
+              children: [
+                can("APPROVE") && !review.published && /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    className: "sm-review-primary",
+                    disabled: busy || approved || review.decision === "DECLINED",
+                    onClick: approve,
+                    children: approved ? "Thank you \u2014 Approved" : review.review_policy === "FACT_CHECK" ? "Confirm fact check" : celebration ? "Looks Good \u2014 Approve" : "Approve draft"
+                  }
+                ),
+                can("REQUEST_CHANGES") && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("changes"), children: celebration ? "Suggest a Change" : "Request changes" }),
+                celebration && can("PROPOSE_EDITS") && !can("REQUEST_CHANGES") && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("edits"), children: "Suggest a Change" }),
+                can("UPLOAD_MEDIA") && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("media"), children: celebration ? "Add Photos" : "Add photos" }),
+                !celebration && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  can("PROPOSE_EDITS") && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("edits"), children: "Suggest edits" }),
+                  can("ANSWER_QUESTIONS") && review.questions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("questions"), children: "Answer questions" }),
+                  can("COMMENT") && /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("comment"), children: "Leave a comment" })
+                ] })
+              ]
+            }
+          ),
+          (can("VIEW_SELECTED_HISTORY") && review.history.length > 0 || can("DOWNLOAD_PREVIEW")) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-utilities", children: [
+            can("VIEW_SELECTED_HISTORY") && review.history.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setPanel("history"), children: "See previous previews" }),
+            can("DOWNLOAD_PREVIEW") && /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => window.print(), children: "Print / save preview" })
+          ] }),
+          panel !== "article" && /* @__PURE__ */ jsxRuntime.jsxs(
+            "section",
+            {
+              ref: responseRef,
+              tabIndex: -1,
+              className: "sm-review-form",
+              "aria-label": "Your response",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-form-heading", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("h2", { children: panel === "approve" ? "Approve this exact draft" : panel === "edits" ? "Propose changes" : panel === "media" ? "Contribute a photograph" : panel === "questions" ? "Tell us a little more" : panel === "history" ? "Selected revision history" : panel === "decline" ? "Prefer not to publish" : panel === "changes" ? "Suggest a change" : "Message the newsroom" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("article"), children: "Close" })
+                ] }),
+                panel === "edits" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Your suggestions will be reviewed by an editor. They do not replace the newsroom\u2019s draft." }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Headline",
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "input",
+                      {
+                        value: document.title,
+                        onChange: (e) => setDocument({ ...document, title: e.target.value })
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Short introduction",
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "input",
+                      {
+                        value: document.subtitle,
+                        onChange: (e) => setDocument({ ...document, subtitle: e.target.value })
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Suggested article text",
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "textarea",
+                      {
+                        rows: 16,
+                        value: document.content_markdown,
+                        onChange: (e) => setDocument({
+                          ...document,
+                          content_markdown: e.target.value
+                        })
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      disabled: busy,
+                      onClick: () => void send(
+                        {
+                          action: "PROPOSE_EDITS",
+                          title: document.title,
+                          subtitle: document.subtitle,
+                          content_markdown: document.content_markdown,
+                          message
+                        },
+                        "Your proposed changes have been sent to the newsroom."
+                      ),
+                      children: "Send proposed changes"
+                    }
+                  )
+                ] }),
+                panel === "questions" && /* @__PURE__ */ jsxRuntime.jsxs(
+                  "form",
+                  {
+                    onSubmit: (e) => {
+                      e.preventDefault();
+                      void send(
+                        { action: "ANSWER_QUESTIONS", answers },
+                        "Thank you for sharing. We'll take care of turning your answers into an updated draft."
+                      );
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("p", { children: review.questions.some((q) => q.required) ? "Only questions marked required must be answered. Share what you would like considered for publication." : "Completely optional. Even one answer can help us make the announcement more personal." }),
+                      review.questions.filter((q, i) => moreQuestions || i < 5 || q.required).map((q) => /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                        q.prompt,
+                        q.required ? " (required)" : " (optional)",
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "textarea",
+                          {
+                            required: q.required,
+                            rows: 3,
+                            value: answers[q.id] || "",
+                            onChange: (e) => setAnswers({ ...answers, [q.id]: e.target.value })
+                          }
+                        )
+                      ] }, q.id)),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "button",
+                        {
+                          className: "sm-review-primary",
+                          disabled: busy || !Object.values(answers).some((a) => a.trim()),
+                          children: "Send These Answers"
+                        }
+                      ),
+                      !moreQuestions && review.questions.length > 5 && /* @__PURE__ */ jsxRuntime.jsx(
+                        "button",
+                        {
+                          type: "button",
+                          onClick: () => setMoreQuestions(true),
+                          children: "Answer More Questions"
+                        }
+                      )
+                    ]
+                  }
+                ),
+                panel === "metadata" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Caption and credit changes are proposals for the newsroom; historical captions remain intact." }),
+                  ["caption", "credit", "alt"].map((key) => /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    key,
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "input",
+                      {
+                        value: mediaInfo[key],
+                        onChange: (e) => setMediaInfo({ ...mediaInfo, [key]: e.target.value })
+                      }
+                    )
+                  ] }, key)),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      disabled: busy,
+                      onClick: () => void send(
+                        {
+                          action: "EDIT_MEDIA_METADATA",
+                          contribution_id: editingMedia,
+                          caption: mediaInfo.caption,
+                          credit: mediaInfo.credit,
+                          alt: mediaInfo.alt
+                        },
+                        "Your proposed media descriptions have been sent to the newsroom."
+                      ),
+                      children: "Propose caption / credit changes"
+                    }
+                  )
+                ] }),
+                panel === "media" && /* @__PURE__ */ jsxRuntime.jsxs(
+                  "form",
+                  {
+                    onSubmit: (e) => {
+                      e.preventDefault();
+                      void upload();
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("p", { children: "JPEG, PNG or WebP photos up to 12 MB; MP4 or WebM videos up to 25 MB. Media remain private until selected and approved by the newsroom." }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                        "Photograph or video",
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "input",
+                          {
+                            type: "file",
+                            accept: "image/jpeg,image/png,image/webp,video/mp4,video/webm",
+                            required: true,
+                            onChange: (e) => setFile(e.target.files?.[0] || null)
+                          }
+                        )
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "sm-review-help", children: "Choose a photograph and confirm permission below. All descriptions are optional; we can help with the caption." }),
+                      Object.entries({
+                        caption: "Caption (optional)",
+                        credit: "Photographer / credit (optional)"
+                      }).map(([key, label]) => /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                        label,
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "input",
+                          {
+                            value: mediaInfo[key],
+                            onChange: (e) => setMediaInfo({ ...mediaInfo, [key]: e.target.value })
+                          }
+                        )
+                      ] }, key)),
+                      /* @__PURE__ */ jsxRuntime.jsxs("details", { className: "sm-review-media-details", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("summary", { children: "Add more photograph details (optional)" }),
+                        Object.entries({
+                          who_is_pictured: "Who is pictured?",
+                          creator: "Photographer / creator",
+                          when_taken: "When was it taken?",
+                          where_taken: "Where was it taken?",
+                          alt: "Describe the photograph for readers who cannot see it"
+                        }).map(([key, label]) => /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                          label,
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "input",
+                            {
+                              value: mediaInfo[key],
+                              onChange: (e) => setMediaInfo({
+                                ...mediaInfo,
+                                [key]: e.target.value
+                              })
+                            }
+                          )
+                        ] }, key))
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "sm-review-check", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "input",
+                          {
+                            type: "checkbox",
+                            required: true,
+                            checked: rights,
+                            onChange: (e) => setRights(e.target.checked)
+                          }
+                        ),
+                        "I confirm that I have the right or permission to provide this media to ",
+                        review.publication.name,
+                        " for editorial publication."
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy || !rights || !file, children: "Upload privately" })
+                    ]
+                  }
+                ),
+                ["approve", "changes", "comment", "decline"].includes(panel) && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  panel === "approve" && /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+                    "You are approving version ",
+                    review.revision.number,
+                    ". Changes to the article require a new approval.",
+                    review.review_policy === "SUBJECT_APPROVAL_AUTO_PUBLISH" ? " The editor has configured this version to publish or schedule after the required approvals are received." : " The newsroom will complete its editorial workflow before publication."
+                  ] }),
+                  panel === "decline" && /* @__PURE__ */ jsxRuntime.jsx("p", { children: ["FACT_CHECK", "CONTRIBUTOR_REVIEW"].includes(
+                    review.review_policy
+                  ) ? "You can decline this review. The newsroom may still publish its reporting." : "Declining participation prevents publication of this voluntary announcement." }),
+                  panel === "comment" && /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Comment on",
+                    /* @__PURE__ */ jsxRuntime.jsxs(
+                      "select",
+                      {
+                        value: commentTarget,
+                        onChange: (e) => setCommentTarget(e.target.value),
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "STORY", children: "Entire story" }),
+                          review.revision.document.content_markdown.split(/\n\s*\n/).slice(0, 200).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: `PARAGRAPH:${i + 1}`, children: [
+                            "Paragraph ",
+                            i + 1
+                          ] }, i)),
+                          review.revision.document.media.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+                            "option",
+                            {
+                              value: `MEDIA:${m.contribution_id}`,
+                              children: [
+                                "Photo / caption ",
+                                i + 1
+                              ]
+                            },
+                            m.contribution_id
+                          )),
+                          review.questions.map((q) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: `QUESTION:${q.id}`, children: q.prompt }, q.id))
+                        ]
+                      }
+                    )
+                  ] }),
+                  panel === "changes" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                      "What would you like to change?",
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "select",
+                        {
+                          value: correctionKind,
+                          onChange: (e) => setCorrectionKind(e.target.value),
+                          children: [
+                            "Correct a detail",
+                            "Correct a name",
+                            "Correct a professional / education detail",
+                            "Remove something",
+                            "Rewrite something",
+                            "Add something",
+                            "General comment"
+                          ].map((kind) => /* @__PURE__ */ jsxRuntime.jsx("option", { children: kind }, kind))
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { children: "A sentence or two is enough. We'll take care of the wording." }),
+                    can("PROPOSE_EDITS") && /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setPanel("edits"), children: "Or edit the wording directly" })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    panel === "changes" ? "What should change?" : "Message (optional)",
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "textarea",
+                      {
+                        rows: 5,
+                        value: message,
+                        onChange: (e) => setMessage(e.target.value)
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      disabled: busy || panel === "changes" && !message.trim() || panel === "comment" && !message.trim(),
+                      onClick: () => void send(
+                        {
+                          action: panel === "approve" ? "APPROVE" : panel === "changes" ? "REQUEST_CHANGES" : panel === "decline" ? "DECLINE" : "COMMENT",
+                          message: panel === "changes" ? `${correctionKind}: ${message}` : message || null,
+                          ...panel === "comment" ? {
+                            target: {
+                              kind: commentTarget.split(":")[0],
+                              reference: commentTarget.split(":")[1] || null
+                            }
+                          } : {}
+                        },
+                        panel === "approve" ? celebration && finalEditor ? approvalThanks : "Your approval has been recorded for this version." : panel === "decline" ? "Thank you for letting us know. The newsroom has received your decision." : "Your message has been sent to the newsroom."
+                      ),
+                      children: panel === "approve" ? `Approve version ${review.revision.number}` : panel === "changes" ? "Send change request" : panel === "decline" ? "Prefer not to publish" : "Send comment"
+                    }
+                  )
+                ] }),
+                panel === "history" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Only revisions selected by the editor are visible here." }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Compare from",
+                    /* @__PURE__ */ jsxRuntime.jsxs(
+                      "select",
+                      {
+                        value: compare,
+                        onChange: (e) => setCompare(e.target.value),
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Choose a shared revision" }),
+                          revisions.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: r.id, children: [
+                            "Version ",
+                            r.number
+                          ] }, r.id))
+                        ]
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                    "Compare to",
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "select",
+                      {
+                        value: compareTo || review.revision.id,
+                        onChange: (e) => setCompareTo(e.target.value),
+                        children: revisions.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: r.id, children: [
+                          "Version ",
+                          r.number
+                        ] }, r.id))
+                      }
+                    )
+                  ] }),
+                  selected && selectedAfter && /* @__PURE__ */ jsxRuntime.jsx(ReviewDiff, { before: selected, after: selectedAfter }),
+                  /* @__PURE__ */ jsxRuntime.jsxs("details", { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("summary", { children: "Read selected revision" }),
+                    /* @__PURE__ */ jsxRuntime.jsx("h3", { children: selected?.document.title }),
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { children: selected?.document.subtitle }),
+                    /* @__PURE__ */ jsxRuntime.jsx(EditorialNotices, { editorial: selected?.editorial }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "div",
+                      {
+                        className: "sm-review-prose",
+                        dangerouslySetInnerHTML: {
+                          __html: selected?.content_html || ""
+                        }
+                      }
+                    ),
+                    selected?.document.media.map((m) => /* @__PURE__ */ jsxRuntime.jsx(PrivatePhoto, { media: m, base }, m.file_id))
+                  ] })
+                ] })
+              ]
+            }
+          ),
+          review.contributions.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "sm-review-contributions", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { children: "Your contributions and newsroom messages" }),
+            review.contributions.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+                /* @__PURE__ */ jsxRuntime.jsx("strong", { children: human(c.kind) }),
+                " \xB7 ",
+                human(c.state)
+              ] }),
+              c.payload.target && /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+                "Regarding ",
+                human(c.payload.target.kind),
+                " ",
+                c.payload.target.reference
+              ] }),
+              c.payload.message && /* @__PURE__ */ jsxRuntime.jsx("p", { children: c.payload.message }),
+              c.payload.answers && Object.entries(c.payload.answers).map(([q, a]) => /* @__PURE__ */ jsxRuntime.jsx("p", { children: a }, q)),
+              c.kind === "MEDIA" && c.payload.file_id && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  PrivatePhoto,
+                  {
+                    base,
+                    media: {
+                      file_id: c.payload.file_id,
+                      caption: c.payload.caption || "",
+                      credit: c.payload.credit || "",
+                      alt: c.payload.caption || "",
+                      position: "gallery",
+                      contribution_id: c.id
+                    }
+                  }
+                ),
+                c.state !== "WITHDRAWN" && can("EDIT_MEDIA_METADATA") && /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    onClick: () => {
+                      setEditingMedia(c.id);
+                      setMediaInfo({
+                        ...mediaInfo,
+                        caption: c.payload.caption || "",
+                        credit: c.payload.credit || "",
+                        alt: c.payload.caption || ""
+                      });
+                      setPanel("metadata");
+                    },
+                    children: "Suggest caption / credit changes"
+                  }
+                ),
+                c.state !== "WITHDRAWN" && can("UPLOAD_MEDIA") && /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    disabled: busy,
+                    onClick: () => void send(
+                      {
+                        action: "WITHDRAW_MEDIA",
+                        contribution_id: c.id
+                      },
+                      "Your media has been withdrawn from consideration."
+                    ),
+                    children: "Withdraw this media"
+                  }
+                )
+              ] })
+            ] }, c.id))
+          ] }),
+          !celebration && can("DECLINE") && !review.published && /* @__PURE__ */ jsxRuntime.jsx("footer", { className: "sm-review-decline", children: /* @__PURE__ */ jsxRuntime.jsx("button", { disabled: busy, onClick: () => setPanel("decline"), children: "Decline participation / please don\u2019t publish this announcement" }) })
+        ] })
+      ]
+    }
+  );
+}
+function PrivatePhoto({ base, media }) {
+  const [url, setUrl] = react.useState("");
+  const [video, setVideo] = react.useState(false);
+  react.useEffect(() => {
+    let active = true, object = "";
+    void fetch(`${base}/media/${encodeURIComponent(media.file_id)}`, {
+      cache: "no-store",
+      credentials: "same-origin"
+    }).then((r) => {
+      if (!r.ok) throw new Error("unavailable");
+      return r.blob();
+    }).then((blob) => {
+      object = URL.createObjectURL(blob);
+      if (active) {
+        setUrl(object);
+        setVideo(blob.type.startsWith("video/"));
+      } else URL.revokeObjectURL(object);
+    }).catch(() => setUrl(""));
+    return () => {
+      active = false;
+      if (object) URL.revokeObjectURL(object);
+    };
+  }, [base, media.file_id]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { children: [
+    url ? video ? /* @__PURE__ */ jsxRuntime.jsx(
+      "video",
+      {
+        src: url,
+        controls: true,
+        playsInline: true,
+        preload: "metadata",
+        "aria-label": media.alt
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt: media.alt, referrerPolicy: "no-referrer" }) : /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Media unavailable." }),
+    /* @__PURE__ */ jsxRuntime.jsxs("figcaption", { children: [
+      media.caption,
+      media.credit && ` Photo: ${media.credit}`
+    ] })
+  ] });
+}
+function ReviewDiff({
+  before,
+  after
+}) {
+  const [side, setSide] = react.useState(false);
+  const fields = [
+    ["title", "Headline"],
+    ["subtitle", "Dek"],
+    ["content_markdown", "Article"],
+    ["section", "Section"],
+    ["community", "Community"]
+  ];
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-diff", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("h3", { children: [
+      "Version ",
+      before.number,
+      " compared with version ",
+      after.number
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "sm-review-check", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "checkbox",
+          checked: side,
+          onChange: (e) => setSide(e.target.checked)
+        }
+      ),
+      "Side-by-side"
+    ] }),
+    fields.filter(([k]) => before.document[k] !== after.document[k]).map(([k, label]) => /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h4", { children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: side ? "sm-review-diff-columns" : "", children: side ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("del", { children: String(before.document[k]) }),
+        /* @__PURE__ */ jsxRuntime.jsx("ins", { children: String(after.document[k]) })
+      ] }) : proseDiff(
+        String(before.document[k]),
+        String(after.document[k])
+      ).map(
+        (run, i) => run.kind === "added" ? /* @__PURE__ */ jsxRuntime.jsx("ins", { children: run.text }, i) : run.kind === "removed" ? /* @__PURE__ */ jsxRuntime.jsx("del", { children: run.text }, i) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: run.text }, i)
+      ) })
+    ] }, k)),
+    JSON.stringify(before.editorial) !== JSON.stringify(after.editorial) && /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h4", { children: "Editorial notices and disclosures" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sm-review-diff-columns", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+            "Version ",
+            before.number
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(EditorialNotices, { editorial: before.editorial })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+            "Version ",
+            after.number
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(EditorialNotices, { editorial: after.editorial })
+        ] })
+      ] })
+    ] }),
+    JSON.stringify(before.document.media) !== JSON.stringify(after.document.media) && /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h4", { children: "Photographs and captions" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sm-review-diff-columns", children: [before, after].map((r) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+          "Version ",
+          r.number
+        ] }),
+        r.document.media.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
+          "Photo ",
+          i + 1,
+          " (",
+          m.position,
+          "): ",
+          m.caption,
+          " \u2014 ",
+          m.credit,
+          " \xB7 Alt: ",
+          m.alt,
+          !before.document.media.some(
+            (previous) => previous.file_id === m.file_id
+          ) ? " \xB7 Added photograph" : ""
+        ] }, m.contribution_id))
+      ] }, r.id)) })
+    ] })
+  ] });
+}
+
+exports.ReviewDiff = ReviewDiff;
+exports.StoryReview = StoryReview;