@bendyline/docblocks-react 2.7.6 → 2.7.8

package/dist/{AiEditorAssistant-2MW6UYNI.js → AiEditorAssistant-ANYGVG7P.js}

@@ -1,6 +1,6 @@
 import {
   AiDiagramDialog
-} from "./chunk-45YTIVYS.js";
+} from "./chunk-A7BK6QFL.js";
 import {
   AiGenerationStatus,
   STUDY_AID_KINDS,
@@ -13,14 +13,16 @@ import {
   factsNeedReview,
   useAiKnowledge,
   useFactCheck
-} from "./chunk-NOYDVL6M.js";
+} from "./chunk-6QHZNL6C.js";
+import "./chunk-HIKMOKBQ.js";
 import {
   useConfirmDialog
-} from "./chunk-KBUHWZCF.js";
+} from "./chunk-YX275NPE.js";
 import "./chunk-KHQ44ZFA.js";
 import {
   useMenuKeyboard
 } from "./chunk-GMA4KGGO.js";
+import "./chunk-OW6JWRAA.js";
 import {
   AI_INSTRUCTION_CHARACTERS,
   AI_REVIEW_DOCUMENT_CHARACTERS,
@@ -37,14 +39,14 @@ import {
   reviewDocumentCharacters,
   sanitizeGeneratedMarkdown,
   withoutPictureFindings
-} from "./chunk-T42BH6YX.js";
+} from "./chunk-CXLXGFG2.js";
 import {
   unavailableSentence,
   useAiStatus
 } from "./chunk-K4I3NJFL.js";
 import {
   Dialog
-} from "./chunk-VJPGZCFS.js";
+} from "./chunk-UYJCL6OW.js";
 
 // src/Ai/AiEditorAssistant.tsx
 import {
@@ -59,9 +61,79 @@ import {
 import { createPortal } from "react-dom";
 import {
   useEditorContext,
-  useEditorContextMenuItems
+  useEditorContextMenuItems,
+  useEditorInsertMenuItems
 } from "@bendyline/squisq-editor-react";
 
+// src/Ai/knowledge-citations.ts
+var MARKER = /[ \t]?(?<![\]\\\p{L}_])\[(\d{1,3}(?:\s*(?:[-–]|,)\s*\d{1,3})*)\](?![(:[])/gu;
+function citationNumbers(inner) {
+  const numbers = [];
+  for (const part of inner.split(",")) {
+    const range = /^\s*(\d{1,3})\s*[-–]\s*(\d{1,3})\s*$/u.exec(part);
+    if (range) {
+      const from = Number(range[1]);
+      const to = Number(range[2]);
+      for (let n = Math.min(from, to); n <= Math.max(from, to) && numbers.length < 50; n++) {
+        numbers.push(n);
+      }
+    } else if (/^\s*\d{1,3}\s*$/u.test(part)) numbers.push(Number(part));
+  }
+  return [...new Set(numbers)];
+}
+function mapProse(markdown, transform) {
+  let fence = null;
+  return markdown.split("\n").map((line) => {
+    const opener = /^\s{0,3}(`{3,}|~{3,})/u.exec(line)?.[1];
+    if (fence !== null) {
+      if (opener && opener[0] === fence[0] && opener.length >= fence.length) fence = null;
+      return line;
+    }
+    if (opener) {
+      fence = opener;
+      return line;
+    }
+    return transform(line);
+  }).join("\n");
+}
+function stripCitationMarkers(markdown) {
+  return mapProse(markdown, (line) => line.replace(MARKER, ""));
+}
+function citationsToFootnotes(markdown, evidence, catalogNames, document2) {
+  const taken = new Set([...document2.matchAll(/\[\^([^\]\s]+)\]/gu)].map((match) => match[1]));
+  const labels = /* @__PURE__ */ new Map();
+  let next = 1;
+  const labelFor = (n) => {
+    const passage = evidence[n - 1];
+    const article = passage.title ? `${passage.catalogId}\0${passage.title}` : `#${n}`;
+    const known = labels.get(article);
+    if (known) return known.label;
+    let label = `source-${next++}`;
+    while (taken.has(label)) label = `source-${next++}`;
+    labels.set(article, { label, passage });
+    return label;
+  };
+  const body = mapProse(
+    markdown,
+    (line) => line.replace(
+      MARKER,
+      (_marker, inner) => [
+        ...new Set(
+          citationNumbers(inner).filter((n) => n >= 1 && n <= evidence.length).map(labelFor)
+        )
+      ].map((label) => `[^${label}]`).join("")
+    )
+  );
+  if (labels.size === 0) return body;
+  const notes = [...labels.values()].map(({ label, passage }) => {
+    const catalog = catalogNames.get(passage.catalogId) ?? passage.catalogId;
+    return `[^${label}]: ${passage.title || "Untitled article"}, from the ${catalog} knowledge catalog.`;
+  });
+  return `${body.trimEnd()}
+
+${notes.join("\n")}`;
+}
+
 // src/Ai/draft-capacity.ts
 import { AI_WIRE_LIMITS } from "@bendyline/docblocks/host";
 function estimateTokens(text) {
@@ -92,7 +164,7 @@ function draftCapacityNotice(request, model, expectedOutput = "") {
 // src/Ai/AiEditorAssistant.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var AiStudyDialog = lazy(
-  () => import("./AiStudyDialog-DQZVTBI7.js").then((module) => ({ default: module.AiStudyDialog }))
+  () => import("./AiStudyDialog-T3FY74HY.js").then((module) => ({ default: module.AiStudyDialog }))
 );
 function AiToolbarControl({
   ai,
@@ -133,6 +205,21 @@ function AiToolbarControl({
   }, [menuOpen]);
   useEffect(() => setStudyKind(null), [workspaceContainer]);
   const ready = status?.kind === "ready" && status.model !== null;
+  const imagesOffered = ai.images !== void 0 && status?.kind === "ready" && !readOnly && editorMode === "markdown";
+  const openImages = () => {
+    closeMenu(false);
+    onOpenPanel("images");
+  };
+  useEditorInsertMenuItems(
+    imagesOffered ? [
+      {
+        id: "docblocks-ai-image",
+        label: "Image from a description\u2026",
+        icon: /* @__PURE__ */ jsx(SparklesGlyph, {}),
+        onSelect: openImages
+      }
+    ] : []
+  );
   const openDiagram = () => {
     const current = getSelection();
     if (!current) return;
@@ -149,6 +236,16 @@ function AiToolbarControl({
       onSelect: openDiagram
     }
   ] : [];
+  if (imagesOffered) {
+    contextMenuItems.push({
+      id: "docblocks-ai-image",
+      label: "Generate image from selection\u2026",
+      group: "ai",
+      when: "selection",
+      disabled: (context) => !context.editable,
+      onSelect: openImages
+    });
+  }
   useEditorContextMenuItems(contextMenuItems);
   if (editorMode !== "markdown" || status?.kind === "unavailable" && status.reason === "opt-out") {
     return null;
@@ -261,6 +358,18 @@ function AiToolbarControl({
                 children: "Insert diagram\u2026"
               }
             ),
+            ai.images && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                tabIndex: -1,
+                className: "db-toolbar-menu-item",
+                disabled: !imagesOffered,
+                onClick: openImages,
+                children: openPanel === "images" ? "Show image generation" : "Generate image\u2026"
+              }
+            ),
             /* @__PURE__ */ jsx("div", { className: "db-toolbar-menu-divider", role: "separator" }),
             STUDY_AID_KINDS.map((kind) => /* @__PURE__ */ jsx(
               "button",
@@ -349,13 +458,13 @@ function AiDraftDialog({
   const handleRef = useRef(null);
   const requestRef = useRef(0);
   const { confirm: confirmAction, confirmDialog } = useConfirmDialog();
-  const { knowledge, ai: knowledgeAi, reset: resetKnowledge } = useAiKnowledge(ai);
+  const { knowledge, citable, ai: knowledgeAi, reset: resetKnowledge } = useAiKnowledge(ai);
   const selectedMarkdown = capturedSelection.markdown ?? capturedSelection.text;
   const factsGiven = useMemo(
     () => originalRequest?.messages.filter((message) => message.role === "user").map((message) => message.content).join("\n\n") ?? "",
     [originalRequest]
   );
-  const facts = useFactCheck(ai, running ? null : draft, knowledge, factsGiven);
+  const facts = useFactCheck(ai, running ? null : draft, knowledge, factsGiven, citable);
   const draftRequest = useMemo(
     () => ({
       ...buildDraftRequest({
@@ -479,7 +588,7 @@ function AiDraftDialog({
     if (running) return;
     const replacement = sanitizeGeneratedMarkdown(draft ?? "", documentSource);
     if (!replacement) return;
-    const factCheck = !incomplete && ai.checkFacts && factCheckRequest(replacement, knowledge, factsGiven);
+    const factCheck = !incomplete && ai.checkFacts && factCheckRequest(replacement, knowledge, factsGiven, citable);
     if (factCheck) {
       const previousRequest = requestRef.current;
       const checked = await ai.checkFacts?.(factCheck);
@@ -518,7 +627,13 @@ function AiDraftDialog({
       setError("The selected text changed. Close this dialog and select it again.");
       return;
     }
-    if (!replaceSelection(replacement)) {
+    const inserted = knowledge?.outcome !== "used" ? replacement : mode === "compose" && citable ? citationsToFootnotes(
+      replacement,
+      knowledge.evidence,
+      new Map(knowledge.sources.map((source) => [source.catalogId, source.name])),
+      documentSource
+    ) : stripCitationMarkers(replacement);
+    if (!replaceSelection(inserted)) {
       setError("DocBlocks could not apply the draft in the current editor view.");
       return;
     }
@@ -537,7 +652,8 @@ function AiDraftDialog({
     confirmAction,
     ai,
     knowledge,
-    factsGiven
+    factsGiven,
+    citable
   ]);
   const dialog = /* @__PURE__ */ jsxs(
     Dialog,

package/dist/AiImagePanel-OXWEFOBC.js

@@ -0,0 +1,314 @@
+import {
+  imageAltText,
+  imageMarkdown,
+  saveGeneratedImage
+} from "./chunk-HIKMOKBQ.js";
+import {
+  imageAccessSentence,
+  imageProgressFraction,
+  imageProgressText,
+  useImageAccess
+} from "./chunk-OW6JWRAA.js";
+
+// src/Ai/AiImagePanel.tsx
+import { useCallback, useEffect, useRef, useState } from "react";
+import { useEditorContext } from "@bendyline/squisq-editor-react";
+import { AI_IMAGE_ASPECTS } from "@bendyline/docblocks/host";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var ASPECT_LABELS = {
+  "1:1": "Square",
+  "4:3": "Landscape",
+  "3:4": "Portrait",
+  "16:9": "Wide",
+  "9:16": "Tall"
+};
+var PREFILL_CHARACTERS = 600;
+function imagesOf(ai) {
+  return ai.images;
+}
+function AiImagePanel({ ai, onClose }) {
+  const images = imagesOf(ai);
+  const access = useImageAccess(images);
+  const { getSelection, insertBlockAfterCursor, mediaProvider, bumpMediaRevision } = useEditorContext();
+  const [prompt, setPrompt] = useState(() => {
+    const selection = getSelection();
+    const text = selection && !selection.empty ? selection.text.trim() : "";
+    return text.slice(0, PREFILL_CHARACTERS);
+  });
+  const [aspect, setAspect] = useState("1:1");
+  const [model, setModel] = useState(null);
+  const [models, setModels] = useState(null);
+  const [modelsError, setModelsError] = useState(null);
+  const [results, setResults] = useState([]);
+  const [notice, setNotice] = useState(null);
+  const [allowing, setAllowing] = useState(false);
+  const handle = useRef(null);
+  const urls = useRef(/* @__PURE__ */ new Set());
+  const counter = useRef(0);
+  const ready = access?.kind === "ready";
+  useEffect(() => {
+    if (!images) return;
+    let live = true;
+    void images.getPreferences().then((preferences) => {
+      if (!live) return;
+      setAspect(preferences.aspect);
+      setModel(preferences.model);
+    }).catch(() => void 0);
+    return () => {
+      live = false;
+    };
+  }, [images]);
+  useEffect(() => {
+    if (!images || !ready) return;
+    let live = true;
+    void images.models().then((result) => {
+      if (!live) return;
+      if (result.ok) {
+        setModels(result.value);
+        setModelsError(null);
+      } else {
+        setModelsError(result.error.message);
+      }
+    });
+    return () => {
+      live = false;
+    };
+  }, [images, ready]);
+  useEffect(() => {
+    const owned = urls.current;
+    return () => {
+      handle.current?.cancel();
+      for (const url of owned) URL.revokeObjectURL(url);
+      owned.clear();
+    };
+  }, []);
+  const installed = (models ?? []).filter((entry) => entry.state === "installed");
+  const chosen = installed.find((entry) => entry.id === model) ?? installed[0] ?? null;
+  const rendering = results.some((result) => result.status === "rendering");
+  const update = useCallback((key, change) => {
+    setResults(
+      (current) => current.map((result) => result.key === key ? { ...result, ...change } : result)
+    );
+  }, []);
+  const render = (text, shape) => {
+    if (!images || !chosen || !text.trim() || handle.current) return;
+    counter.current += 1;
+    const key = `image-${String(counter.current)}`;
+    setNotice(null);
+    setResults((current) => [
+      {
+        key,
+        prompt: text.trim(),
+        aspect: shape,
+        model: chosen.id,
+        status: "rendering",
+        progress: null,
+        image: null,
+        url: null,
+        alt: imageAltText(text),
+        error: null,
+        inserted: false
+      },
+      ...current
+    ]);
+    const started = images.generate(
+      { prompt: text.trim(), aspect: shape, model: chosen.id },
+      (event) => {
+        if (event.kind === "progress") update(key, { progress: event.progress });
+      }
+    );
+    handle.current = started;
+    void started.done.then((outcome) => {
+      if (handle.current === started) handle.current = null;
+      if (outcome.ok) {
+        const url = URL.createObjectURL(new Blob([outcome.value.data], { type: "image/png" }));
+        urls.current.add(url);
+        update(key, { status: "done", image: outcome.value, url, progress: null });
+      } else {
+        update(key, {
+          status: outcome.error.code === "cancelled" ? "stopped" : "failed",
+          error: outcome.error.code === "cancelled" ? null : outcome.error.message,
+          progress: null
+        });
+      }
+    });
+  };
+  const chooseAspect = (next) => {
+    setAspect(next);
+    void images?.setPreferences({ aspect: next }).catch(() => void 0);
+  };
+  const chooseModel = (next) => {
+    setModel(next);
+    void images?.setPreferences({ model: next }).catch(() => void 0);
+  };
+  const insert = async (result) => {
+    if (!result.image) return;
+    if (!mediaProvider) {
+      setNotice("Save the document in a folder to insert images.");
+      return;
+    }
+    try {
+      const path = await saveGeneratedImage(mediaProvider, result.image, result.prompt);
+      bumpMediaRevision?.();
+      if (!insertBlockAfterCursor(imageMarkdown(path, result.alt || result.prompt))) {
+        setNotice("Switch to Write or Source view, place the cursor, then insert again.");
+        return;
+      }
+      update(result.key, { inserted: true });
+    } catch (error) {
+      setNotice(
+        `DocBlocks could not save the image beside the document. ${error instanceof Error ? error.message : ""}`.trim()
+      );
+    }
+  };
+  const discard = (result) => {
+    if (result.url) {
+      URL.revokeObjectURL(result.url);
+      urls.current.delete(result.url);
+    }
+    setResults((current) => current.filter((entry) => entry.key !== result.key));
+  };
+  const allow = async () => {
+    if (!images) return;
+    setAllowing(true);
+    const outcome = await images.requestAccess();
+    setAllowing(false);
+    if (!outcome.ok) setNotice(outcome.error.message);
+  };
+  const blocked = imageAccessSentence(access);
+  const modelLabel = (id) => (models ?? []).find((entry) => entry.id === id)?.label ?? "the image model";
+  return /* @__PURE__ */ jsxs("aside", { className: "db-ai-review-panel db-ai-image-panel", "aria-label": "Generate image", children: [
+    /* @__PURE__ */ jsxs("div", { className: "db-ai-review-header", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h2", { children: "Generate image" }),
+        chosen && /* @__PURE__ */ jsx("span", { className: "db-ai-review-count", children: chosen.label })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "db-ai-review-close",
+          onClick: onClose,
+          "aria-label": "Close Generate image",
+          children: "\xD7"
+        }
+      )
+    ] }),
+    blocked && /* @__PURE__ */ jsxs("div", { className: "db-ai-review-empty", role: "status", children: [
+      access?.kind === "awaiting-approval" && access.verificationCode ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        "In Gezel, approve DocBlocks and enter this code:",
+        /* @__PURE__ */ jsx("span", { className: "db-ai-image-code", children: access.verificationCode })
+      ] }) : blocked,
+      access?.kind === "needs-approval" && /* @__PURE__ */ jsx("div", { className: "db-ai-illustrate-bar db-ai-image-allow", children: /* @__PURE__ */ jsx("button", { type: "button", disabled: allowing, onClick: () => void allow(), children: "Allow image generation\u2026" }) })
+    ] }),
+    ready && models !== null && installed.length === 0 && /* @__PURE__ */ jsx("div", { className: "db-ai-review-empty", role: "status", children: "No image model is installed yet. Download one under Settings, AI assistance." }),
+    ready && modelsError && /* @__PURE__ */ jsx("div", { className: "db-ai-review-empty db-ai-error", role: "alert", children: modelsError }),
+    ready && installed.length > 0 && /* @__PURE__ */ jsxs("section", { className: "db-ai-image-form", "aria-label": "Describe the image", children: [
+      /* @__PURE__ */ jsxs("label", { className: "db-ai-field", children: [
+        "Description",
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            value: prompt,
+            onChange: (event) => setPrompt(event.target.value),
+            placeholder: "A watercolor lighthouse on a cliff at dusk",
+            maxLength: 4e3
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "db-ai-image-aspects", role: "radiogroup", "aria-label": "Shape", children: AI_IMAGE_ASPECTS.map((shape) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          role: "radio",
+          "aria-checked": aspect === shape,
+          onClick: () => chooseAspect(shape),
+          children: ASPECT_LABELS[shape]
+        },
+        shape
+      )) }),
+      installed.length > 1 && /* @__PURE__ */ jsxs("label", { className: "db-ai-field db-ai-field--inline", children: [
+        "Model",
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            value: chosen?.id ?? "",
+            onChange: (event) => chooseModel(event.target.value),
+            children: installed.map((entry) => /* @__PURE__ */ jsx("option", { value: entry.id, children: entry.label }, entry.id))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "db-ai-illustrate-bar db-ai-image-actions", children: rendering ? /* @__PURE__ */ jsx("button", { type: "button", onClick: () => handle.current?.cancel(), children: "Stop" }) : /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "db-ai-image-generate",
+          disabled: !prompt.trim(),
+          onClick: () => render(prompt, aspect),
+          children: "Generate"
+        }
+      ) })
+    ] }),
+    notice && /* @__PURE__ */ jsx("div", { className: "db-ai-review-empty db-ai-error", role: "alert", children: notice }),
+    results.length > 0 && /* @__PURE__ */ jsx("ol", { className: "db-ai-review-list db-ai-image-results", children: results.map((result) => {
+      const fraction = imageProgressFraction(result.progress);
+      return /* @__PURE__ */ jsxs("li", { className: "db-ai-review-finding db-ai-image-result", children: [
+        /* @__PURE__ */ jsx("p", { className: "db-ai-image-prompt", children: result.prompt }),
+        result.status === "rendering" && /* @__PURE__ */ jsxs("div", { className: "db-ai-illustrate-progress", role: "status", children: [
+          /* @__PURE__ */ jsx("span", { className: "db-ai-spinner", "aria-hidden": "true" }),
+          imageProgressText(result.progress, modelLabel(result.model)),
+          fraction !== null && /* @__PURE__ */ jsx("progress", { max: 1, value: fraction })
+        ] }),
+        result.status === "failed" && /* @__PURE__ */ jsx("p", { className: "db-ai-error", role: "alert", children: result.error }),
+        result.status === "stopped" && /* @__PURE__ */ jsx("p", { className: "db-ai-note", children: "Stopped." }),
+        result.status === "done" && result.url && result.image && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              className: "db-ai-image-preview",
+              src: result.url,
+              alt: result.alt,
+              width: result.image.width,
+              height: result.image.height
+            }
+          ),
+          /* @__PURE__ */ jsxs("label", { className: "db-ai-field db-ai-image-alt", children: [
+            "Description for readers",
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                value: result.alt,
+                onChange: (event) => update(result.key, { alt: event.target.value }),
+                maxLength: 160
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "db-ai-illustrate-bar db-ai-image-result-actions", children: [
+          result.status === "done" && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              disabled: result.inserted,
+              onClick: () => void insert(result),
+              children: result.inserted ? "Inserted" : "Insert"
+            }
+          ),
+          result.status !== "rendering" && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              disabled: rendering || !chosen,
+              onClick: () => render(result.prompt, result.aspect),
+              children: result.status === "done" ? "Regenerate" : "Try again"
+            }
+          ),
+          result.status !== "rendering" && /* @__PURE__ */ jsx("button", { type: "button", onClick: () => discard(result), children: "Discard" })
+        ] })
+      ] }, result.key);
+    }) })
+  ] });
+}
+export {
+  AiImagePanel
+};

package/dist/{AiStudyDialog-DQZVTBI7.js → AiStudyDialog-T3FY74HY.js}

@@ -12,7 +12,7 @@ import {
 import {
   AiKnowledgeIndicator,
   useAiKnowledge
-} from "./chunk-NOYDVL6M.js";
+} from "./chunk-6QHZNL6C.js";
 import "./chunk-KHQ44ZFA.js";
 import {
   AiReportButton,
@@ -30,14 +30,14 @@ import {
   extractNumbers,
   sanitizeGeneratedMarkdown,
   stripReasoning
-} from "./chunk-T42BH6YX.js";
+} from "./chunk-CXLXGFG2.js";
 import {
   unavailableSentence,
   useAiStatus
 } from "./chunk-K4I3NJFL.js";
 import {
   Dialog
-} from "./chunk-VJPGZCFS.js";
+} from "./chunk-UYJCL6OW.js";
 
 // src/Ai/AiStudyDialog.tsx
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";

package/dist/{AudioExportDialog-EICCBSSE.js → AudioExportDialog-CBMSLQBS.js}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-RP3DVNTI.js";
 import {
   Dialog
-} from "./chunk-VJPGZCFS.js";
+} from "./chunk-UYJCL6OW.js";
 
 // src/Speech/AudioExportDialog.tsx
 import { useEffect, useId, useRef, useState } from "react";