@pipelex/mthds-form 0.24.0 → 0.26.0

package/dist/{chunk-UGKFWX7L.js → chunk-RSYOZZZF.js}

@@ -1,9 +1,9 @@
-import { planFileSave, planStuffSave, splitFileName, typedFileStem } from './chunk-ICUEHNEH.js';
+import { planFileSave, planStuffSave, splitFileName, typedFileStem } from './chunk-QWHUUMSB.js';
 import { seedInputs, closeOptionalStructures, openOptionalStructures } from './chunk-VH5CDQDR.js';
 import { sourceFileValue, roomForChosenFiles, roomForDroppedFiles, addChosenFiles, placeDroppedFiles, chosenFilesAdded } from './chunk-NSHGLM6A.js';
-import { readStuffFile } from './chunk-RRTI7AIR.js';
+import { readStuffFile } from './chunk-QINLJ5RM.js';
 import { apiInputsFromRunValues, sameRunValues, runValuesFromInputs, setValueAtPath } from './chunk-ZX52CQJ4.js';
-import { viewableUrl, isNativeDateNode, isNativeHtmlNode, readHtmlContent, isNativeCompositeNode, readCompositeContent, isNativeValueNode, readDateContent, formatDateContent, readImageContent, readDataUrl, readDocumentContent } from './chunk-CM4KVG53.js';
+import { TYPED_SCALAR_MARKERS, viewableUrl, isNativeDateNode, isNativeHtmlNode, readHtmlContent, isNativeCompositeNode, readCompositeContent, isNativePageNode, nativeVerdictOf, isNativeValueNode, readDateContent, formatDateContent, readPageContent, readYesNoContent, readRatingContent, readChoiceContent, readDocumentContent, readImageContent, readDataUrl } from './chunk-JSPF4BQP.js';
 import { buildRunFields } from './chunk-ZB4RYUKV.js';
 import { conceptCategory } from './chunk-FABY3DEY.js';
 import { acceptLabel, acceptMap, isAcceptedFile, normalizeMimeType, formatOfFilename, DOCUMENT_FORMATS, IMAGE_FORMATS } from './chunk-XCO6GTEC.js';
@@ -12,10 +12,10 @@ import { ownProp } from './chunk-V3OV2XQT.js';
 import { toStoredDateValue, toDateInputValue } from './chunk-GKV77RAS.js';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { ChevronDown, ChevronUp, Check, List, Braces, ListChecks, ToggleLeft, Hash, Image as Image$1, FileText, CalendarDays, Type, Folder, Search, X, ImageIcon, Loader2, ImageOff, Upload, Link2, EyeOff, Eye, Minus, Plus, Trash2, Sparkles, MoreHorizontal, TriangleAlert, FileDown, Copy, Download, ChevronRight } from 'lucide-react';
+import { ChevronDown, ChevronUp, Check, List, Braces, ListChecks, ToggleLeft, Hash, Image as Image$1, FileText, CalendarDays, Type, Folder, Search, X, ImageIcon, Loader2, ImageOff, Upload, Link2, EyeOff, Eye, Minus, Plus, Trash2, Sparkles, MoreHorizontal, TriangleAlert, FileDown, Copy, Download, ChevronRight, ExternalLink, ChevronLeft } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React5 from 'react';
-import { createContext, use, useId, useMemo, useContext, useState, useEffect, useRef, useLayoutEffect, useCallback, Fragment as Fragment$1 } from 'react';
+import { createContext, use, useId, useMemo, useContext, useState, useEffect, useRef, useLayoutEffect, useCallback, Fragment as Fragment$1, useSyncExternalStore } from 'react';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
 import { useDropzone } from 'react-dropzone';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
@@ -25,6 +25,7 @@ import { cva } from 'class-variance-authority';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { createPortal } from 'react-dom';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { marked } from 'marked';
 
@@ -219,6 +220,7 @@ var DAY_YEAR = new Intl.DateTimeFormat("en-GB", {
   month: "short",
   year: "numeric"
 });
+var PERCENT = new Intl.NumberFormat("en-GB", { style: "percent", maximumFractionDigits: 0 });
 function formatFileDate(date) {
   const days = calendarDaysBefore(date);
   if (days === 0) return `Today, ${TIME.format(date)}`;
@@ -254,6 +256,8 @@ var EN_FIELD_STRINGS = {
   preview: "Preview",
   removeFileAria: "Remove file",
   previewUnavailablePdf: "Preview unavailable - open to view.",
+  pdfViewerUnavailable: "This browser cannot show the PDF here.",
+  openInNewTab: "Open in a new tab",
   // U+002D HYPHEN-MINUS, deliberately: not an en dash, not an em dash.
   resultAbsent: "-",
   resultAbsentDescription: "Not provided",
@@ -281,6 +285,16 @@ var EN_FIELD_STRINGS = {
   resultViewGroup: "Result view",
   yes: "Yes",
   no: "No",
+  yesProbability: (share) => `Probability of yes: ${PERCENT.format(share)}`,
+  verdictConfidence: (share) => `Confidence: ${PERCENT.format(share)}`,
+  ratingLevel: (position) => `Level ${position}`,
+  pageNumber: (position) => `Page ${position}`,
+  extractedTable: "Table",
+  viewImage: (name) => `View ${name}`,
+  imagePosition: (position, count) => `${position} of ${count}`,
+  previousImage: "Previous picture",
+  nextImage: "Next picture",
+  openOriginal: "Open the original",
   unsupportedFileType: (formats) => `That file type is not supported. Accepted formats: ${formats}.`,
   dropFilesOrBrowse: "Drop files or click to browse",
   dropFilesToAdd: "Drop to add the files",
@@ -381,6 +395,7 @@ var DAY_YEAR2 = new Intl.DateTimeFormat("fr-FR", {
   month: "short",
   year: "numeric"
 });
+var PERCENT2 = new Intl.NumberFormat("fr-FR", { style: "percent", maximumFractionDigits: 0 });
 function formatFileDate2(date) {
   const days = calendarDaysBefore(date);
   if (days === 0) return `Aujourd\u2019hui, ${TIME2.format(date)}`;
@@ -424,6 +439,8 @@ var FR_FIELD_STRINGS = {
   preview: "Aper\xE7u",
   removeFileAria: "Retirer le fichier",
   previewUnavailablePdf: "Aper\xE7u indisponible - ouvrez le fichier pour le consulter.",
+  pdfViewerUnavailable: "Ce navigateur ne peut pas afficher le PDF ici.",
+  openInNewTab: "Ouvrir dans un nouvel onglet",
   // U+002D HYPHEN-MINUS, as in the English defaults.
   resultAbsent: "-",
   resultAbsentDescription: "Non renseign\xE9",
@@ -451,6 +468,16 @@ var FR_FIELD_STRINGS = {
   resultViewGroup: "Affichage du r\xE9sultat",
   yes: "Oui",
   no: "Non",
+  yesProbability: (share) => `Probabilit\xE9 du oui\xA0: ${PERCENT2.format(share)}`,
+  verdictConfidence: (share) => `Confiance\xA0: ${PERCENT2.format(share)}`,
+  ratingLevel: (position) => `Niveau ${position}`,
+  pageNumber: (position) => `Page ${position}`,
+  extractedTable: "Tableau",
+  viewImage: (name) => `Voir ${name}`,
+  imagePosition: (position, count) => `${position} sur ${count}`,
+  previousImage: "Image pr\xE9c\xE9dente",
+  nextImage: "Image suivante",
+  openOriginal: "Ouvrir l\u2019original",
   unsupportedFileType: (formats) => `Ce type de fichier n\u2019est pas pris en charge. Formats accept\xE9s\xA0: ${formats}.`,
   dropFilesOrBrowse: "D\xE9posez des fichiers ou cliquez pour parcourir",
   dropFilesToAdd: "D\xE9posez pour ajouter les fichiers",
@@ -829,6 +856,10 @@ function closeAutoFocus(onCloseAutoFocus, returnFocus) {
     target.focus();
   };
 }
+var keepPress = (event) => event.stopPropagation();
+function DialogSurface({ children }) {
+  return /* @__PURE__ */ jsx("div", { className: "contents", onClick: keepPress, onMouseDown: keepPress, children });
+}
 var DialogOverlay = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DialogPrimitive.Overlay,
   {
@@ -838,7 +869,7 @@ var DialogOverlay = React5.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React5.forwardRef(({ className, layout = "dialog", returnFocus, onCloseAutoFocus, children, ...props }, ref) => /* @__PURE__ */ jsxs(Fragment, { children: [
+var DialogContent = React5.forwardRef(({ className, layout = "dialog", returnFocus, onCloseAutoFocus, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogSurface, { children: [
   /* @__PURE__ */ jsx(DialogOverlay, {}),
   /* @__PURE__ */ jsx(
     DialogPrimitive.Content,
@@ -993,7 +1024,6 @@ function FilePicker({
       onCloseAutoFocus,
       returnFocus: () => returnFocusTo?.current ?? heldFocus.current,
       style: drag > 0 ? { transform: `translateY(${drag}px)` } : void 0,
-      onClick: (event) => event.stopPropagation(),
       children: /* @__PURE__ */ jsx(FilePickerBody, { ...props, onDrag: setDrag, onClose: () => onOpenChange(false) })
     }
   ) });
@@ -1034,7 +1064,7 @@ function FilePickerBody({
     return next;
   });
   const choices = [...chosen.values()];
-  const use6 = () => {
+  const use8 = () => {
     if (choices.length === 0) return;
     onUse(choices);
     onClose();
@@ -1139,7 +1169,7 @@ function FilePickerBody({
       "button",
       {
         type: "button",
-        onClick: use6,
+        onClick: use8,
         disabled: choices.length === 0,
         className: cn(
           "flex h-12 w-full items-center justify-center rounded-md bg-primary px-4 text-[16px] font-medium text-primary-foreground transition-colors hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-50",
@@ -2250,9 +2280,9 @@ function followingFocusable(from, skip) {
   }
   return null;
 }
-function firstFocusable(within) {
-  if (!within) return null;
-  for (const element of within.querySelectorAll(FOCUSABLE)) {
+function firstFocusable(within2) {
+  if (!within2) return null;
+  for (const element of within2.querySelectorAll(FOCUSABLE)) {
     if (takesFocus(element)) return element;
   }
   return null;
@@ -2897,7 +2927,7 @@ function FieldRenderer({ field, value, onChange, id, error, env }) {
   }
 }
 var AlertDialog = AlertDialogPrimitive.Root;
-var AlertDialogContent = React5.forwardRef(({ className, returnFocus, onCloseAutoFocus, ...props }, ref) => /* @__PURE__ */ jsxs(Fragment, { children: [
+var AlertDialogContent = React5.forwardRef(({ className, returnFocus, onCloseAutoFocus, ...props }, ref) => /* @__PURE__ */ jsxs(DialogSurface, { children: [
   /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, { className: "fixed inset-0 z-50 bg-black/50" }),
   /* @__PURE__ */ jsx(
     AlertDialogPrimitive.Content,
@@ -3079,7 +3109,6 @@ function FillWithExample({
             className: "top-auto max-h-[calc(100dvh-1.5rem)]",
             ref: sheet,
             returnFocus: () => control.current ?? afterControl.current,
-            onClick: (event) => event.stopPropagation(),
             children: [
               /* @__PURE__ */ jsx("div", { className: "px-4 pt-4 pb-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
                 /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1 pt-1", children: [
@@ -3164,7 +3193,6 @@ function FillWithExample({
               const row = rows.current.get(replacing.id);
               return row?.isConnected ? row : control.current;
             },
-            onClick: (event) => event.stopPropagation(),
             children: [
               /* @__PURE__ */ jsx(AlertDialogTitle, { children: s.replaceEnteredTitle }),
               /* @__PURE__ */ jsx(AlertDialogDescription, { children: s.replaceEnteredDescription(replacing.name) }),
@@ -3255,7 +3283,7 @@ function RenameExampleDialog({
       onOpenChange: (next) => {
         if (!next && state !== "busy") onCancel();
       },
-      children: /* @__PURE__ */ jsxs(DialogContent, { returnFocus, onClick: (event) => event.stopPropagation(), children: [
+      children: /* @__PURE__ */ jsxs(DialogContent, { returnFocus, children: [
         /* @__PURE__ */ jsx(DialogTitle, { children: s.renameExampleTitle }),
         /* @__PURE__ */ jsx(DialogDescription, { className: "sr-only", children: example.name }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
@@ -3334,7 +3362,7 @@ function DeleteExampleDialog({
       onOpenChange: (next) => {
         if (!next && state !== "busy") onCancel();
       },
-      children: /* @__PURE__ */ jsxs(AlertDialogContent, { returnFocus, onClick: (event) => event.stopPropagation(), children: [
+      children: /* @__PURE__ */ jsxs(AlertDialogContent, { returnFocus, children: [
         /* @__PURE__ */ jsx(AlertDialogTitle, { children: s.deleteExampleTitle(example.name) }),
         /* @__PURE__ */ jsx(AlertDialogDescription, { children: s.deleteExampleDescription }),
         state === "failed" && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[13px] text-destructive", children: s.deleteFailed }),
@@ -3805,6 +3833,7 @@ function frameDocument(content, { styles, imgSrc, fontSrc }) {
   const head = [
     '<!doctype html><html><head><meta charset="utf-8">',
     `<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src 'unsafe-inline'; img-src ${imgSrc}; font-src ${fontSrc}; base-uri 'none'; form-action 'none'">`,
+    '<meta name="referrer" content="no-referrer">',
     `<style>${styles}</style></head>`
   ].join("");
   if (isWholeDocument(content.innerHtml)) return head + content.innerHtml;
@@ -4085,6 +4114,7 @@ var ResultEnvContext = createContext({});
 function ResultEnvProvider({
   resolveUrl,
   resolveUrls,
+  resolveRendition,
   resolveShareUrl,
   proseImages,
   tableColumns,
@@ -4098,6 +4128,7 @@ function ResultEnvProvider({
     () => ({
       resolveUrl,
       resolveUrls,
+      resolveRendition,
       resolveShareUrl,
       proseImages,
       tableColumns,
@@ -4109,6 +4140,7 @@ function ResultEnvProvider({
     [
       resolveUrl,
       resolveUrls,
+      resolveRendition,
       resolveShareUrl,
       proseImages,
       tableColumns,
@@ -4158,6 +4190,9 @@ function useMarkupResolvers() {
   const { resolveUrl, resolveUrls } = use(ResultEnvContext);
   return useMemo(() => ({ resolveUrl, resolveUrls }), [resolveUrl, resolveUrls]);
 }
+function useResolveRendition() {
+  return use(ResultEnvContext).resolveRendition;
+}
 function useResolveShareUrl() {
   return use(ResultEnvContext).resolveShareUrl;
 }
@@ -4213,6 +4248,34 @@ function useTableColumns() {
 function useTableLayout() {
   return use(ResultEnvContext).tableLayout ?? "scroll";
 }
+var OverlayLayerContext = createContext(null);
+function OverlayLayer({ children }) {
+  const outer = use(OverlayLayerContext);
+  const [holders, setHolders] = useState(0);
+  const [target, setTarget] = useState(null);
+  const acquire = useCallback(() => {
+    setHolders((count) => count + 1);
+    let released = false;
+    return () => {
+      if (released) return;
+      released = true;
+      setHolders((count) => count - 1);
+    };
+  }, []);
+  const layer = useMemo(() => ({ target, acquire }), [target, acquire]);
+  if (outer) return children;
+  return /* @__PURE__ */ jsxs(OverlayLayerContext, { value: layer, children: [
+    holders > 0 && /* @__PURE__ */ jsx("span", { ref: setTarget, "data-overlay-layer": true, className: "absolute size-0" }),
+    children
+  ] });
+}
+function InOverlayLayer({ children }) {
+  const layer = use(OverlayLayerContext);
+  const acquire = layer?.acquire;
+  useEffect(() => acquire?.(), [acquire]);
+  if (!layer) return children;
+  return layer.target ? createPortal(children, layer.target) : null;
+}
 var ResultLocationContext = createContext(void 0);
 function useResultLocation() {
   return use(ResultLocationContext);
@@ -4224,7 +4287,7 @@ function ResultRoot({
 }) {
   const key = path.join("\0");
   const location = useMemo(() => ({ baseName, path: key.split("\0") }), [baseName, key]);
-  return /* @__PURE__ */ jsx(ResultLocationContext, { value: location, children });
+  return /* @__PURE__ */ jsx(ResultLocationContext, { value: location, children: /* @__PURE__ */ jsx(OverlayLayer, { children }) });
 }
 function ResultAt({ segment, children }) {
   const parent = use(ResultLocationContext);
@@ -4311,6 +4374,17 @@ function useFrameFocus(frame) {
   }, [frame]);
   return focused;
 }
+var subscribe = () => () => {
+};
+function browserViewer() {
+  return navigator.pdfViewerEnabled === false ? "no" : "yes";
+}
+function serverViewer() {
+  return "unknown";
+}
+function usePdfViewer() {
+  return useSyncExternalStore(subscribe, browserViewer, serverViewer);
+}
 var TooltipProvider = TooltipPrimitive.Provider;
 var TooltipRoot = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
@@ -4523,26 +4597,26 @@ function measureFlow(doc) {
       fixed.push(el);
       return;
     }
-    const span = spanOf(el);
+    const span2 = spanOf(el);
     const display = style.display;
     if (FORCED.has(style.breakBefore) || FORCED.has(style.getPropertyValue("page-break-before"))) {
-      forced.push(span.top);
+      forced.push(span2.top);
     }
     if (FORCED.has(style.breakAfter) || FORCED.has(style.getPropertyValue("page-break-after"))) {
-      forced.push(span.bottom);
+      forced.push(span2.bottom);
     }
-    if (AVOIDED.has(style.breakAfter) || HEADING_TAGS.has(el.tagName)) keepAfter.push(span);
-    if (AVOIDED.has(style.breakBefore)) keepBefore.push(span);
+    if (AVOIDED.has(style.breakAfter) || HEADING_TAGS.has(el.tagName)) keepAfter.push(span2);
+    if (AVOIDED.has(style.breakBefore)) keepBefore.push(span2);
     const atomic = ATOMIC_TAGS.has(el.tagName) || display.startsWith("inline-");
     if (atomic) {
-      if (span.bottom > span.top) hard.push(span);
+      if (span2.bottom > span2.top) hard.push(span2);
       return;
     }
     if (AVOIDED.has(style.breakInside) || AVOIDED.has(style.getPropertyValue("page-break-inside")) || display === "table-row") {
-      avoid.push(span);
+      avoid.push(span2);
     }
     if (display === "table" || display === "inline-table") {
-      tables.push(tableBox(el, span));
+      tables.push(tableBox(el, span2));
     }
     for (const child of Array.from(el.childNodes)) {
       if (child.nodeType === 1) walk(child);
@@ -4551,8 +4625,8 @@ function measureFlow(doc) {
       }
     }
   };
-  const tableBox = (table, span) => {
-    const box = { ...span };
+  const tableBox = (table, span2) => {
+    const box = { ...span2 };
     for (const part of Array.from(table.children)) {
       const display = win.getComputedStyle(part).display;
       if (display === "table-header-group" && !box.head) box.head = spanOf(part);
@@ -4565,13 +4639,13 @@ function measureFlow(doc) {
   const lines = [...hard].sort((a, b) => a.top - b.top);
   const firstLineFrom = (at) => lines.find((line) => line.top >= at - 0.5);
   const lastLineBefore = (at) => [...lines].reverse().find((line) => line.bottom <= at + 0.5);
-  for (const span of keepAfter) {
-    const next = firstLineFrom(span.bottom);
-    if (next) avoid.push({ top: span.top, bottom: next.bottom });
+  for (const span2 of keepAfter) {
+    const next = firstLineFrom(span2.bottom);
+    if (next) avoid.push({ top: span2.top, bottom: next.bottom });
   }
-  for (const span of keepBefore) {
-    const previous = lastLineBefore(span.top);
-    const first = firstLineFrom(span.top);
+  for (const span2 of keepBefore) {
+    const previous = lastLineBefore(span2.top);
+    const first = firstLineFrom(span2.top);
     if (previous && first) avoid.push({ top: previous.top, bottom: first.bottom });
   }
   for (const table of tables) {
@@ -4589,17 +4663,17 @@ function measureFlow(doc) {
 function lineSpans(doc, text, y) {
   const range = doc.createRange();
   range.selectNodeContents(text);
-  const spans = [];
+  const spans2 = [];
   for (const rect of Array.from(range.getClientRects())) {
     if (rect.height === 0) continue;
-    const span = { top: y(rect.top), bottom: y(rect.bottom) };
-    const same = spans.find((line) => span.top < line.bottom && span.bottom > line.top);
+    const span2 = { top: y(rect.top), bottom: y(rect.bottom) };
+    const same = spans2.find((line) => span2.top < line.bottom && span2.bottom > line.top);
     if (same) {
-      same.top = Math.min(same.top, span.top);
-      same.bottom = Math.max(same.bottom, span.bottom);
-    } else spans.push(span);
+      same.top = Math.min(same.top, span2.top);
+      same.bottom = Math.max(same.bottom, span2.bottom);
+    } else spans2.push(span2);
   }
-  return spans;
+  return spans2;
 }
 
 // src/react/paginate.ts
@@ -4607,7 +4681,7 @@ var EPSILON = 0.5;
 function paginate(layout, pageHeight) {
   const pages = [];
   const end = layout.height;
-  const inkBottom = Math.max(0, ...layout.hard.map((span) => span.bottom));
+  const inkBottom = Math.max(0, ...layout.hard.map((span2) => span2.bottom));
   const forced = [...layout.forced].sort((a, b) => a - b);
   let start = 0;
   for (let guard = 0; start < end - EPSILON && guard < 1e4; guard++) {
@@ -4638,12 +4712,12 @@ function paginate(layout, pageHeight) {
 }
 function bestCut(layout, start, limit) {
   const room = limit - start;
-  const hard = layout.hard.filter((span) => span.bottom - span.top <= room);
-  const avoid = layout.avoid.filter((span) => span.bottom - span.top <= room);
+  const hard = layout.hard.filter((span2) => span2.bottom - span2.top <= room);
+  const avoid = layout.avoid.filter((span2) => span2.bottom - span2.top <= room);
   const candidates = /* @__PURE__ */ new Set([limit]);
-  for (const span of [...hard, ...avoid]) {
-    candidates.add(span.top);
-    candidates.add(span.bottom);
+  for (const span2 of [...hard, ...avoid]) {
+    candidates.add(span2.top);
+    candidates.add(span2.bottom);
   }
   for (const table of layout.tables) {
     candidates.add(table.top);
@@ -4651,19 +4725,19 @@ function bestCut(layout, start, limit) {
   }
   const sorted = [...candidates].filter((at) => at > start + EPSILON && at <= limit + EPSILON).sort((a, b) => b - a);
   for (const constraints of [[...hard, ...avoid], hard]) {
-    const cut = sorted.find((at) => !constraints.some((span) => inside(span, at)));
+    const cut = sorted.find((at) => !constraints.some((span2) => inside(span2, at)));
     if (cut !== void 0) return Math.min(cut, limit);
   }
   return limit;
 }
-function inside(span, at) {
-  return at > span.top + EPSILON && at < span.bottom - EPSILON;
+function inside(span2, at) {
+  return at > span2.top + EPSILON && at < span2.bottom - EPSILON;
 }
 function openAt(tables, at) {
   return tables.filter((table) => at > table.top + EPSILON && at < (table.foot?.top ?? table.bottom) - EPSILON).sort((a, b) => a.top - b.top);
 }
-function total(spans) {
-  return spans.reduce((sum, span) => sum + (span.bottom - span.top), 0);
+function total(spans2) {
+  return spans2.reduce((sum, span2) => sum + (span2.bottom - span2.top), 0);
 }
 
 // src/react/print-media.ts
@@ -4929,10 +5003,10 @@ async function paintPage(slice, page, area, scale, quality, flow, overlay) {
   context.fillStyle = "#fff";
   context.fillRect(0, 0, canvas.width, canvas.height);
   let y = page.margin.top;
-  for (const span of [...slice.heads, slice.body, ...slice.feet]) {
-    const height = span.bottom - span.top;
+  for (const span2 of [...slice.heads, slice.body, ...slice.feet]) {
+    const height = span2.bottom - span2.top;
     if (height <= 0) continue;
-    const image = await svgImage(flow, { top: span.top, width: area.width, height }, scale);
+    const image = await svgImage(flow, { top: span2.top, width: area.width, height }, scale);
     context.drawImage(
       image,
       page.margin.left * scale,
@@ -5304,6 +5378,231 @@ function useResolvedMarkup(markup) {
   if (!needed) return markup;
   return shown?.source === markup ? shown.html : void 0;
 }
+var SWIPE_DISTANCE = 40;
+function ImageViewer({
+  pictures,
+  index,
+  onIndexChange,
+  onClose,
+  returnFocus
+}) {
+  const s = useFieldStrings();
+  const panel = useRef(null);
+  const swipe = useRef(null);
+  const count = pictures.length;
+  const at = Math.min(Math.max(index, 0), count - 1);
+  const picture = pictures[at];
+  if (!picture) return null;
+  const several = count > 1;
+  const go = (step) => {
+    const next = at + step;
+    if (next >= 0 && next < count) onIndexChange(next);
+  };
+  const onPointerDown = (event) => {
+    swipe.current = event.pointerType === "touch" && event.isPrimary ? { id: event.pointerId, x: event.clientX, y: event.clientY } : null;
+  };
+  const onPointerUp = (event) => {
+    const start = swipe.current;
+    swipe.current = null;
+    if (!start || start.id !== event.pointerId) return;
+    const across = event.clientX - start.x;
+    const down = event.clientY - start.y;
+    if (Math.abs(across) < SWIPE_DISTANCE || Math.abs(across) < Math.abs(down) * 1.5) return;
+    go(across < 0 ? 1 : -1);
+  };
+  return /* @__PURE__ */ jsx(InOverlayLayer, { children: /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(
+        DialogContent,
+        {
+          ref: panel,
+          returnFocus,
+          onOpenAutoFocus: (event) => {
+            event.preventDefault();
+            panel.current?.focus();
+          },
+          onEscapeKeyDown: (event) => {
+            if (event.target instanceof Element && event.target.closest("[data-file-name-backdrop]")) {
+              event.preventDefault();
+            }
+          },
+          onKeyDown: (event) => {
+            if (event.defaultPrevented || event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) {
+              return;
+            }
+            if (isTextEntry(event.target)) return;
+            if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+            event.preventDefault();
+            event.stopPropagation();
+            go(event.key === "ArrowLeft" ? -1 : 1);
+          },
+          ...picture.caption ? {} : { "aria-describedby": void 0 },
+          className: cn(
+            "m-0 h-dvh w-full max-w-none gap-0 rounded-none border-0 p-0",
+            "sm:m-auto sm:h-[calc(100dvh-4rem)] sm:w-[calc(100%-4rem)] sm:max-w-6xl sm:rounded-xl sm:border"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-border py-1.5 pr-1.5 pl-4", children: [
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsx(DialogTitle, { className: "truncate text-[14px] font-medium", children: picture.name }),
+                several && // A live region from the moment the viewer opens, so each move
+                // is announced: one inserted with its text already in it is not.
+                /* @__PURE__ */ jsx(
+                  "p",
+                  {
+                    "aria-live": "polite",
+                    "aria-atomic": "true",
+                    className: "text-[12px] text-muted-foreground",
+                    children: s.imagePosition(at + 1, count)
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [
+                /* @__PURE__ */ jsxs(
+                  "a",
+                  {
+                    href: picture.src,
+                    target: "_blank",
+                    rel: "noreferrer",
+                    className: cn(
+                      "inline-flex items-center gap-1.5 rounded-md px-2 py-1 text-[12px] text-muted-foreground hover:bg-muted hover:text-foreground max-sm:size-11 max-sm:justify-center max-sm:p-0",
+                      focusOutlineClass
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(ExternalLink, { "aria-hidden": true, className: "size-3.5" }),
+                      /* @__PURE__ */ jsx("span", { className: "max-sm:sr-only", children: s.openOriginal })
+                    ]
+                  }
+                ),
+                picture.actions,
+                /* @__PURE__ */ jsx(
+                  DialogClose,
+                  {
+                    "aria-label": s.close,
+                    className: cn(
+                      "flex size-9 items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground max-sm:size-11",
+                      focusOutlineClass
+                    ),
+                    children: /* @__PURE__ */ jsx(X, { "aria-hidden": true, className: "size-4" })
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                "data-viewer-stage": true,
+                onPointerDown,
+                onPointerUp,
+                onPointerCancel: () => {
+                  swipe.current = null;
+                },
+                className: "relative min-h-0 flex-1 touch-pan-y touch-pinch-zoom",
+                children: [
+                  /* @__PURE__ */ jsx(
+                    ViewerImage,
+                    {
+                      src: picture.src,
+                      alt: picture.caption ?? picture.name
+                    },
+                    picture.src
+                  ),
+                  several && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(
+                      StepButton2,
+                      {
+                        label: s.previousImage,
+                        unavailable: at === 0,
+                        onStep: () => go(-1),
+                        className: "left-2",
+                        children: /* @__PURE__ */ jsx(ChevronLeft, { "aria-hidden": true, className: "size-5" })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      StepButton2,
+                      {
+                        label: s.nextImage,
+                        unavailable: at === count - 1,
+                        onStep: () => go(1),
+                        className: "right-2",
+                        children: /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-5" })
+                      }
+                    )
+                  ] })
+                ]
+              }
+            ),
+            picture.caption && /* @__PURE__ */ jsx(DialogDescription, { className: "max-h-24 shrink-0 overflow-y-auto border-t border-border px-4 py-2 text-[13px]", children: picture.caption })
+          ]
+        }
+      )
+    }
+  ) });
+}
+function ViewerImage({ src, alt }) {
+  const [loading, setLoading] = useState(true);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    loading && /* @__PURE__ */ jsx(
+      "span",
+      {
+        role: "status",
+        "aria-label": alt,
+        className: "absolute inset-0 flex items-center justify-center",
+        children: /* @__PURE__ */ jsx(Loader2, { "aria-hidden": true, className: "size-5 animate-spin text-muted-foreground" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src,
+        alt,
+        referrerPolicy: "no-referrer",
+        decoding: "async",
+        draggable: false,
+        onLoad: () => setLoading(false),
+        onError: () => setLoading(false),
+        className: cn(
+          "absolute inset-0 size-full object-contain p-2 sm:p-4",
+          loading && "opacity-0"
+        )
+      }
+    )
+  ] });
+}
+function StepButton2({
+  label,
+  unavailable,
+  onStep,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      "aria-disabled": unavailable,
+      onClick: () => {
+        if (!unavailable) onStep();
+      },
+      className: cn(
+        "absolute top-1/2 flex size-11 -translate-y-1/2 items-center justify-center rounded-full border border-border bg-popover/90 text-foreground shadow-sm hover:bg-muted aria-disabled:opacity-40 aria-disabled:hover:bg-popover/90",
+        focusOutlineClass,
+        className
+      ),
+      children
+    }
+  );
+}
+function isTextEntry(target) {
+  if (!(target instanceof HTMLElement)) return false;
+  return target.isContentEditable || target.closest("input, textarea, select") !== null;
+}
 var LEX_OPTIONS = { gfm: true, breaks: true };
 function Markdown({ text, className, proseImages }) {
   const tokens = React5.useMemo(() => marked.lexer(text, LEX_OPTIONS), [text]);
@@ -5524,6 +5823,710 @@ var ENTITIES = {
 function decode(text) {
   return text.replace(/&(?:amp|lt|gt|quot|#39|#x27);/g, (entity) => ENTITIES[entity] ?? entity);
 }
+function ExtractedPageText({ segments }) {
+  return /* @__PURE__ */ jsx("div", { className: "space-y-2", children: segments.map(
+    (segment, index) => segment.kind === "markdown" ? /* @__PURE__ */ jsx(Markdown, { text: segment.text }, index) : /* @__PURE__ */ jsx(ExtractedTableView, { table: segment.table }, index)
+  ) });
+}
+function ExtractedTableView({ table }) {
+  const s = useFieldStrings();
+  const headRows = leadingHeaderRows(table);
+  const head = table.rows.slice(0, headRows);
+  const body = table.rows.slice(headRows);
+  return /* @__PURE__ */ jsxs("figure", { className: "space-y-1.5", children: [
+    table.caption && /* @__PURE__ */ jsx("figcaption", { className: "text-[12.5px] text-muted-foreground", children: table.caption }),
+    table.rows.length > 0 && /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "group",
+        "aria-label": table.caption ?? s.extractedTable,
+        tabIndex: 0,
+        className: cn("overflow-x-auto rounded-lg border border-border", focusOutlineClass),
+        children: /* @__PURE__ */ jsxs("table", { className: "min-w-full border-collapse text-[12.5px] text-foreground", children: [
+          head.length > 0 && /* @__PURE__ */ jsx("thead", { children: head.map((row, rowIndex) => /* @__PURE__ */ jsx("tr", { className: "border-b border-border bg-card/40", children: row.map((cell, cellIndex) => /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "col",
+              ...spans(cell),
+              className: "whitespace-pre-line px-2.5 py-1.5 text-start align-bottom font-semibold",
+              children: cell.text
+            },
+            cellIndex
+          )) }, rowIndex)) }),
+          /* @__PURE__ */ jsx("tbody", { children: body.map((row, rowIndex) => /* @__PURE__ */ jsx("tr", { className: "border-b border-border/60 last:border-b-0", children: row.map(
+            (cell, cellIndex) => cell.header ? /* @__PURE__ */ jsx(
+              "th",
+              {
+                scope: "row",
+                ...spans(cell),
+                className: "whitespace-pre-line px-2.5 py-1.5 text-start align-top font-semibold",
+                children: cell.text
+              },
+              cellIndex
+            ) : /* @__PURE__ */ jsx(
+              "td",
+              {
+                ...spans(cell),
+                className: "whitespace-pre-line px-2.5 py-1.5 align-top",
+                children: cell.text
+              },
+              cellIndex
+            )
+          ) }, rowIndex)) })
+        ] })
+      }
+    )
+  ] });
+}
+function leadingHeaderRows(table) {
+  let count = 0;
+  for (const row of table.rows) {
+    if (!row.every((cell) => cell.header)) break;
+    count += 1;
+  }
+  return count === table.rows.length ? 0 : count;
+}
+function spans(cell) {
+  return {
+    ...cell.colSpan !== void 0 ? { colSpan: cell.colSpan } : {},
+    ...cell.rowSpan !== void 0 ? { rowSpan: cell.rowSpan } : {}
+  };
+}
+
+// src/react/html-entities.ts
+var HTML_NAMED_ENTITIES = {
+  // The XML marks, their legacy uppercase spellings, and the special marks.
+  apos: 39,
+  AMP: 38,
+  LT: 60,
+  GT: 62,
+  QUOT: 34,
+  COPY: 169,
+  REG: 174,
+  quot: 34,
+  amp: 38,
+  lt: 60,
+  gt: 62,
+  OElig: 338,
+  oelig: 339,
+  Scaron: 352,
+  scaron: 353,
+  Yuml: 376,
+  circ: 710,
+  tilde: 732,
+  ensp: 8194,
+  emsp: 8195,
+  thinsp: 8201,
+  zwnj: 8204,
+  zwj: 8205,
+  lrm: 8206,
+  rlm: 8207,
+  ndash: 8211,
+  mdash: 8212,
+  lsquo: 8216,
+  rsquo: 8217,
+  sbquo: 8218,
+  ldquo: 8220,
+  rdquo: 8221,
+  bdquo: 8222,
+  dagger: 8224,
+  Dagger: 8225,
+  permil: 8240,
+  lsaquo: 8249,
+  rsaquo: 8250,
+  euro: 8364,
+  // Latin-1.
+  nbsp: 160,
+  iexcl: 161,
+  cent: 162,
+  pound: 163,
+  curren: 164,
+  yen: 165,
+  brvbar: 166,
+  sect: 167,
+  uml: 168,
+  copy: 169,
+  ordf: 170,
+  laquo: 171,
+  not: 172,
+  shy: 173,
+  reg: 174,
+  macr: 175,
+  deg: 176,
+  plusmn: 177,
+  sup2: 178,
+  sup3: 179,
+  acute: 180,
+  micro: 181,
+  para: 182,
+  middot: 183,
+  cedil: 184,
+  sup1: 185,
+  ordm: 186,
+  raquo: 187,
+  frac14: 188,
+  frac12: 189,
+  frac34: 190,
+  iquest: 191,
+  Agrave: 192,
+  Aacute: 193,
+  Acirc: 194,
+  Atilde: 195,
+  Auml: 196,
+  Aring: 197,
+  AElig: 198,
+  Ccedil: 199,
+  Egrave: 200,
+  Eacute: 201,
+  Ecirc: 202,
+  Euml: 203,
+  Igrave: 204,
+  Iacute: 205,
+  Icirc: 206,
+  Iuml: 207,
+  ETH: 208,
+  Ntilde: 209,
+  Ograve: 210,
+  Oacute: 211,
+  Ocirc: 212,
+  Otilde: 213,
+  Ouml: 214,
+  times: 215,
+  Oslash: 216,
+  Ugrave: 217,
+  Uacute: 218,
+  Ucirc: 219,
+  Uuml: 220,
+  Yacute: 221,
+  THORN: 222,
+  szlig: 223,
+  agrave: 224,
+  aacute: 225,
+  acirc: 226,
+  atilde: 227,
+  auml: 228,
+  aring: 229,
+  aelig: 230,
+  ccedil: 231,
+  egrave: 232,
+  eacute: 233,
+  ecirc: 234,
+  euml: 235,
+  igrave: 236,
+  iacute: 237,
+  icirc: 238,
+  iuml: 239,
+  eth: 240,
+  ntilde: 241,
+  ograve: 242,
+  oacute: 243,
+  ocirc: 244,
+  otilde: 245,
+  ouml: 246,
+  divide: 247,
+  oslash: 248,
+  ugrave: 249,
+  uacute: 250,
+  ucirc: 251,
+  uuml: 252,
+  yacute: 253,
+  thorn: 254,
+  yuml: 255,
+  // Symbols, mathematical marks and Greek letters.
+  fnof: 402,
+  Alpha: 913,
+  Beta: 914,
+  Gamma: 915,
+  Delta: 916,
+  Epsilon: 917,
+  Zeta: 918,
+  Eta: 919,
+  Theta: 920,
+  Iota: 921,
+  Kappa: 922,
+  Lambda: 923,
+  Mu: 924,
+  Nu: 925,
+  Xi: 926,
+  Omicron: 927,
+  Pi: 928,
+  Rho: 929,
+  Sigma: 931,
+  Tau: 932,
+  Upsilon: 933,
+  Phi: 934,
+  Chi: 935,
+  Psi: 936,
+  Omega: 937,
+  alpha: 945,
+  beta: 946,
+  gamma: 947,
+  delta: 948,
+  epsilon: 949,
+  zeta: 950,
+  eta: 951,
+  theta: 952,
+  iota: 953,
+  kappa: 954,
+  lambda: 955,
+  mu: 956,
+  nu: 957,
+  xi: 958,
+  omicron: 959,
+  pi: 960,
+  rho: 961,
+  sigmaf: 962,
+  sigma: 963,
+  tau: 964,
+  upsilon: 965,
+  phi: 966,
+  chi: 967,
+  psi: 968,
+  omega: 969,
+  thetasym: 977,
+  upsih: 978,
+  piv: 982,
+  bull: 8226,
+  hellip: 8230,
+  prime: 8242,
+  Prime: 8243,
+  oline: 8254,
+  frasl: 8260,
+  image: 8465,
+  weierp: 8472,
+  real: 8476,
+  trade: 8482,
+  alefsym: 8501,
+  larr: 8592,
+  uarr: 8593,
+  rarr: 8594,
+  darr: 8595,
+  harr: 8596,
+  crarr: 8629,
+  lArr: 8656,
+  uArr: 8657,
+  rArr: 8658,
+  dArr: 8659,
+  hArr: 8660,
+  forall: 8704,
+  part: 8706,
+  exist: 8707,
+  empty: 8709,
+  nabla: 8711,
+  isin: 8712,
+  notin: 8713,
+  ni: 8715,
+  prod: 8719,
+  sum: 8721,
+  minus: 8722,
+  lowast: 8727,
+  radic: 8730,
+  prop: 8733,
+  infin: 8734,
+  ang: 8736,
+  and: 8743,
+  or: 8744,
+  cap: 8745,
+  cup: 8746,
+  int: 8747,
+  there4: 8756,
+  sim: 8764,
+  cong: 8773,
+  asymp: 8776,
+  ne: 8800,
+  equiv: 8801,
+  le: 8804,
+  ge: 8805,
+  sub: 8834,
+  sup: 8835,
+  nsub: 8836,
+  sube: 8838,
+  supe: 8839,
+  oplus: 8853,
+  otimes: 8855,
+  perp: 8869,
+  sdot: 8901,
+  lceil: 8968,
+  rceil: 8969,
+  lfloor: 8970,
+  rfloor: 8971,
+  lang: 9001,
+  rang: 9002,
+  loz: 9674,
+  spades: 9824,
+  clubs: 9827,
+  hearts: 9829,
+  diams: 9830
+};
+var ENTITY = /&(#x[0-9a-f]+|#\d+|[a-z][a-z0-9]*);/gi;
+function decodeHtmlEntities(text) {
+  return text.replace(ENTITY, (entity, body) => {
+    if (body.startsWith("#")) {
+      const code2 = body[1] === "x" || body[1] === "X" ? parseInt(body.slice(2), 16) : Number(body.slice(1));
+      return Number.isInteger(code2) && code2 > 0 && code2 <= 1114111 ? String.fromCodePoint(code2) : entity;
+    }
+    const code = ownProp(HTML_NAMED_ENTITIES, body);
+    return typeof code === "number" ? String.fromCodePoint(code) : entity;
+  });
+}
+
+// src/react/extracted-text.ts
+function splitExtractedText(text) {
+  const segments = [];
+  const tableRows = text.includes("|") ? pipeTableRows(text) : [];
+  let markdown = "";
+  let index = 0;
+  while (index < text.length) {
+    if (index === 0 || text[index - 1] === "\n") {
+      const fenceEnd = fencedBlockEnd(text, index);
+      if (fenceEnd !== void 0) {
+        markdown += text.slice(index, fenceEnd);
+        index = fenceEnd;
+        continue;
+      }
+    }
+    const char = text.charAt(index);
+    if (char === "\\" && ESCAPABLE.test(text.charAt(index + 1))) {
+      markdown += text.slice(index, index + 2);
+      index += 2;
+      continue;
+    }
+    if (char === "`") {
+      const end = codeSpanEnd(text, index);
+      markdown += text.slice(index, end);
+      index = end;
+      continue;
+    }
+    if (char === "<") {
+      const markup = readMarkup(text, index);
+      if (markup) {
+        if ("table" in markup) {
+          pushMarkdown(segments, markdown);
+          markdown = "";
+          if (markup.table) segments.push({ kind: "table", table: markup.table });
+        } else if (markup.text === "\n" && within(tableRows, index)) {
+          markdown += " ";
+        } else {
+          markdown += markup.text;
+        }
+        index = markup.end;
+        continue;
+      }
+    }
+    markdown += char;
+    index += 1;
+  }
+  pushMarkdown(segments, markdown);
+  return segments;
+}
+function pushMarkdown(segments, text) {
+  if (text.trim() !== "") segments.push({ kind: "markdown", text });
+}
+function within(spans2, index) {
+  return spans2.some(([start, end]) => index >= start && index < end);
+}
+function pipeTableRows(text) {
+  const lines = [];
+  for (let start = 0; ; ) {
+    const newline = text.indexOf("\n", start);
+    lines.push([start, newline === -1 ? text.length : newline]);
+    if (newline === -1) break;
+    start = newline + 1;
+  }
+  const lineAt = (at) => {
+    const [start, end] = lines[at] ?? [0, 0];
+    return text.slice(start, end);
+  };
+  const rows = [];
+  for (let at = 1; at < lines.length; at += 1) {
+    const header = lineAt(at - 1);
+    const delimiter = lineAt(at);
+    if (!header.includes("|") || !isDelimiterRow(delimiter)) continue;
+    if (rowCells(header).length !== rowCells(delimiter).length) continue;
+    let last = at;
+    while (last + 1 < lines.length && lineAt(last + 1).includes("|")) last += 1;
+    rows.push([lines[at - 1]?.[0] ?? 0, lines[last]?.[1] ?? text.length]);
+    at = last;
+  }
+  return rows;
+}
+function rowCells(line) {
+  let row = line.trim();
+  if (row.startsWith("|")) row = row.slice(1);
+  if (row.endsWith("|") && !row.endsWith("\\|")) row = row.slice(0, -1);
+  const cells = [];
+  let cell = "";
+  for (let at = 0; at < row.length; at += 1) {
+    const char = row.charAt(at);
+    if (char === "\\") {
+      cell += row.slice(at, at + 2);
+      at += 1;
+    } else if (char === "|") {
+      cells.push(cell);
+      cell = "";
+    } else {
+      cell += char;
+    }
+  }
+  cells.push(cell);
+  return cells;
+}
+function isDelimiterRow(line) {
+  return line.includes("|") && rowCells(line).every((cell) => /^\s*:?-+:?\s*$/.test(cell));
+}
+var ESCAPABLE = /^[\x21-\x2f\x3a-\x40\x5b-\x60\x7b-\x7e]$/;
+var FENCE_OPEN = /[ \t]*(`{3,}|~{3,})([^\n]*)/y;
+var FENCE_LINE = /^[ \t]*(?:`{3,}|~{3,})/gm;
+function fencedBlockEnd(text, start) {
+  FENCE_OPEN.lastIndex = start;
+  const open = FENCE_OPEN.exec(text);
+  if (!open) return void 0;
+  const marker = open[1] ?? "";
+  const fenceChar = marker.charAt(0);
+  if (fenceChar === "`" && (open[2] ?? "").includes("`")) return void 0;
+  let lineEnd = text.indexOf("\n", start);
+  while (lineEnd !== -1) {
+    const next = text.indexOf("\n", lineEnd + 1);
+    const end = next === -1 ? text.length : next;
+    const line = text.slice(lineEnd + 1, end).trim();
+    if (line.length >= marker.length && [...line].every((c) => c === fenceChar)) return end;
+    lineEnd = next;
+  }
+  return text.length;
+}
+var BLANK_LINE = /\n[ \t]*\n/g;
+function codeSpanEnd(text, start) {
+  const open = backtickRun(text, start);
+  BLANK_LINE.lastIndex = start;
+  const blank = BLANK_LINE.exec(text);
+  const limit = blank ? blank.index : text.length;
+  let cursor = start + open;
+  for (; ; ) {
+    const next = text.indexOf("`", cursor);
+    if (next === -1 || next >= limit) return start + open;
+    const length = backtickRun(text, next);
+    if (length === open) return next + length;
+    cursor = next + length;
+  }
+}
+function backtickRun(text, start) {
+  let end = start;
+  while (text.charAt(end) === "`") end += 1;
+  return end - start;
+}
+function nextOutsideFences(text, from, pattern) {
+  let cursor = from;
+  for (; ; ) {
+    pattern.lastIndex = cursor;
+    const match = pattern.exec(text);
+    if (!match) return null;
+    FENCE_LINE.lastIndex = cursor;
+    const fence = FENCE_LINE.exec(text);
+    if (!fence || fence.index >= match.index) return match;
+    cursor = fencedBlockEnd(text, fence.index) ?? fence.index + fence[0].length;
+  }
+}
+var COMMENT = /<!--[\s\S]*?-->/g;
+var COMMENT_END = /-->/g;
+var TABLE_OPEN = /<table\b[^>]*>/iy;
+var TABLE_TAG = /<(\/?)table\b[^>]*>/gi;
+var HTML_TAG = /<(\/?)([a-z][a-z0-9]*)(?=[\s/>])[^<>]*>/iy;
+var BLOCK_ELEMENTS = /* @__PURE__ */ new Set([
+  "address",
+  "article",
+  "aside",
+  "blockquote",
+  "body",
+  "br",
+  "center",
+  "dd",
+  "details",
+  "dialog",
+  "div",
+  "dl",
+  "dt",
+  "fieldset",
+  "figcaption",
+  "figure",
+  "footer",
+  "form",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "head",
+  "header",
+  "hgroup",
+  "hr",
+  "html",
+  "legend",
+  "li",
+  "main",
+  "nav",
+  "ol",
+  "option",
+  "p",
+  "pre",
+  "section",
+  "summary",
+  "title",
+  "ul"
+]);
+var INLINE_ELEMENTS = /* @__PURE__ */ new Set([
+  "a",
+  "abbr",
+  "b",
+  "bdi",
+  "bdo",
+  "big",
+  "cite",
+  "code",
+  "data",
+  "del",
+  "dfn",
+  "em",
+  "font",
+  "i",
+  "img",
+  "ins",
+  "kbd",
+  "label",
+  "mark",
+  "picture",
+  "q",
+  "s",
+  "samp",
+  "small",
+  "source",
+  "span",
+  "strike",
+  "strong",
+  "sub",
+  "sup",
+  "time",
+  "tt",
+  "u",
+  "var",
+  "wbr"
+]);
+var RAW_TEXT_ENDS = /* @__PURE__ */ new Map([
+  ["script", /<\/script\s*>/gi],
+  ["style", /<\/style\s*>/gi]
+]);
+function readMarkup(text, start) {
+  if (text.startsWith("<!--", start)) {
+    const close = nextOutsideFences(text, start + 4, COMMENT_END);
+    return close ? { end: close.index + close[0].length, text: "" } : void 0;
+  }
+  TABLE_OPEN.lastIndex = start;
+  if (TABLE_OPEN.test(text)) {
+    const end2 = tableEnd(text, start);
+    if (end2 === void 0) return void 0;
+    return { end: end2, table: readTable(text.slice(start, end2).replace(COMMENT, "")) };
+  }
+  HTML_TAG.lastIndex = start;
+  const tag = HTML_TAG.exec(text);
+  if (!tag) return void 0;
+  const closing = tag[1] === "/";
+  const name = (tag[2] ?? "").toLowerCase();
+  const end = start + tag[0].length;
+  const rawTextEnd = closing ? void 0 : RAW_TEXT_ENDS.get(name);
+  if (rawTextEnd) {
+    rawTextEnd.lastIndex = end;
+    const close = rawTextEnd.exec(text);
+    return { end: close ? close.index + close[0].length : end, text: "\n" };
+  }
+  if (RAW_TEXT_ENDS.has(name) || BLOCK_ELEMENTS.has(name)) return { end, text: "\n" };
+  if (INLINE_ELEMENTS.has(name)) return { end, text: "" };
+  return void 0;
+}
+function tableEnd(text, start) {
+  let depth = 0;
+  let cursor = start;
+  for (; ; ) {
+    const tag = nextOutsideFences(text, cursor, TABLE_TAG);
+    if (!tag) return void 0;
+    depth += tag[1] === "/" ? -1 : 1;
+    cursor = tag.index + tag[0].length;
+    if (depth === 0) return cursor;
+  }
+}
+var TABLE_STRUCTURE = /<(\/?)(table|caption|tr|td|th)\b([^>]*)>/gi;
+function readTable(markup) {
+  let caption = "";
+  let captionStart;
+  const rows = [];
+  let row;
+  let cell;
+  let depth = 0;
+  const endCell = (at) => {
+    if (cell && row) {
+      const colSpan = span(cell.attributes, COLSPAN);
+      const rowSpan = span(cell.attributes, ROWSPAN);
+      row.push({
+        text: cellText(markup.slice(cell.start, at)),
+        header: cell.header,
+        ...colSpan !== void 0 ? { colSpan } : {},
+        ...rowSpan !== void 0 ? { rowSpan } : {}
+      });
+    }
+    cell = void 0;
+  };
+  const endRow = (at) => {
+    endCell(at);
+    if (row && row.length > 0) rows.push(row);
+    row = void 0;
+  };
+  for (const tag of markup.matchAll(TABLE_STRUCTURE)) {
+    const closing = tag[1] === "/";
+    const name = (tag[2] ?? "").toLowerCase();
+    if (name === "table") {
+      depth += closing ? -1 : 1;
+      if (depth === 0) break;
+      continue;
+    }
+    if (depth !== 1) continue;
+    if (name === "caption") {
+      if (!closing && caption === "" && captionStart === void 0) {
+        captionStart = tag.index + tag[0].length;
+      } else if (closing && captionStart !== void 0) {
+        caption = cellText(markup.slice(captionStart, tag.index));
+        captionStart = void 0;
+      }
+      continue;
+    }
+    if (name === "tr") {
+      endRow(tag.index);
+      if (!closing) row = [];
+      continue;
+    }
+    endCell(tag.index);
+    if (!closing && row) {
+      cell = {
+        header: name === "th",
+        attributes: tag[3] ?? "",
+        start: tag.index + tag[0].length
+      };
+    }
+  }
+  endRow(markup.length);
+  if (rows.length === 0 && caption === "") return void 0;
+  return { ...caption !== "" ? { caption } : {}, rows };
+}
+var COLSPAN = /\bcolspan\s*=\s*["']?(\d+)/i;
+var ROWSPAN = /\browspan\s*=\s*["']?(\d+)/i;
+function span(attributes, pattern) {
+  const match = pattern.exec(attributes);
+  const value = match ? Number(match[1]) : void 0;
+  return value !== void 0 && value > 1 && value <= 1e3 ? value : void 0;
+}
+function cellText(markup) {
+  return decodeHtmlEntities(
+    markup.replace(/<br\s*\/?>/gi, "\n").replace(/<\/?(?:table|caption|tr|td|th)\b[^>]*>/gi, "\n").replace(/<[^>]*>/g, "")
+  ).split("\n").map((line) => line.replace(/\s+/g, " ").trim()).filter((line) => line !== "").join("\n");
+}
 function unwrap(field, value) {
   if (!field.contentKey) return value;
   if (typeof value !== "object" || value === null || Array.isArray(value)) return value;
@@ -5642,6 +6645,7 @@ function pathLabel(url) {
   return segment && segment.length > 0 ? segment : url;
 }
 var FILE_BUTTON_ON_A_PHONE = "max-sm:grid max-sm:size-11 max-sm:place-items-center";
+var CARD_ACTION = "inline-flex shrink-0 items-center gap-1.5 rounded-md border border-border px-2 py-1 text-[12px] hover:bg-card max-sm:min-h-11 max-sm:px-3";
 function CopyButton({
   value,
   provide,
@@ -5756,7 +6760,7 @@ function useStuffFile(kind, value) {
   const location = useResultLocation();
   return location ? readStuffFile(kind, value, location.path.join(".")) : void 0;
 }
-function FileDownloadButton({ file }) {
+function FileDownloadButton({ file, labelled = false }) {
   const s = useFieldStrings();
   const location = useResultLocation();
   const resolve = useResolveUrl();
@@ -5785,7 +6789,7 @@ ${planned.url ?? planned.text}`;
   const failed = state === "failed";
   const label = s.downloadFile(planned.name);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(
       "button",
       {
         type: "button",
@@ -5804,12 +6808,17 @@ ${planned.url ?? planned.text}`;
         title: failed ? s.downloadFileFailed : label,
         ...failed ? { "aria-describedby": statusId } : {},
         className: cn(
-          "shrink-0 rounded p-0.5 hover:bg-card disabled:opacity-60",
+          labelled ? cn(CARD_ACTION, "disabled:opacity-60") : cn(
+            "shrink-0 rounded p-0.5 hover:bg-card disabled:opacity-60",
+            FILE_BUTTON_ON_A_PHONE
+          ),
           focusOutlineClass,
-          FILE_BUTTON_ON_A_PHONE,
           failed ? "text-destructive" : "text-muted-foreground hover:text-foreground"
         ),
-        children: state === "saving" ? /* @__PURE__ */ jsx(Loader2, { "aria-hidden": true, className: "size-3.5 animate-spin" }) : state === "saved" ? /* @__PURE__ */ jsx(Check, { "aria-hidden": true, className: "size-3.5" }) : failed ? /* @__PURE__ */ jsx(TriangleAlert, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(Download, { "aria-hidden": true, className: "size-3.5" })
+        children: [
+          state === "saving" ? /* @__PURE__ */ jsx(Loader2, { "aria-hidden": true, className: "size-3.5 animate-spin" }) : state === "saved" ? /* @__PURE__ */ jsx(Check, { "aria-hidden": true, className: "size-3.5" }) : failed ? /* @__PURE__ */ jsx(TriangleAlert, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(Download, { "aria-hidden": true, className: "size-3.5" }),
+          labelled && s.download
+        ]
       }
     ),
     /* @__PURE__ */ jsx("span", { id: statusId, role: "status", className: "sr-only", children: failed ? s.downloadFileFailed : "" }),
@@ -5839,7 +6848,32 @@ function previewableUrl(content, resolve) {
   const renderable = content.mimeType ? PREVIEWABLE_MIME_RE.test(content.mimeType) : PREVIEWABLE_EXT_RE.test(named);
   return renderable ? url : void 0;
 }
-function DocumentPreview({ url, name }) {
+function isPdfDocument(content, url) {
+  return content.mimeType ? /^application\/pdf\s*(;|$)/i.test(content.mimeType) : /\.pdf(\?|#|$)/i.test(content.filename ?? url);
+}
+function DocumentPreview({
+  url,
+  name,
+  pdf,
+  file,
+  whole
+}) {
+  const viewer = usePdfViewer();
+  const size = whole ? WHOLE_RESULT_FRAME : NESTED_FRAME;
+  if (pdf && viewer === "no") return /* @__PURE__ */ jsx(PdfUnavailable, { url, name, file });
+  if (pdf && viewer === "unknown") {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": true,
+        className: cn(
+          size,
+          "flex items-center justify-center rounded-lg border border-border bg-card/40"
+        ),
+        children: /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin text-muted-foreground" })
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
     FocusFrame,
     {
@@ -5847,19 +6881,56 @@ function DocumentPreview({ url, name }) {
       title: name,
       loading: "lazy",
       referrerPolicy: "no-referrer",
-      className: "h-112 w-full rounded-lg border border-border bg-card/40"
+      className: cn(size, "rounded-lg border border-border bg-card/40")
     }
   );
 }
-function DocumentValue({ value }) {
+var NESTED_FRAME = "h-112 w-full";
+var WHOLE_RESULT_FRAME = "aspect-[1/1.414] max-h-[80vh] min-h-80 w-full";
+function PdfUnavailable({
+  url,
+  name,
+  file
+}) {
+  const s = useFieldStrings();
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 rounded-lg border border-border bg-card/40 px-3.5 py-3 sm:flex-row sm:items-center", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-start gap-2.5", children: [
+      /* @__PURE__ */ jsx(FileText, { "aria-hidden": true, className: "mt-0.5 size-4 shrink-0 text-muted-foreground" }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-0.5", children: [
+        /* @__PURE__ */ jsx("p", { title: name, className: "truncate text-[13px] font-medium text-foreground", children: name }),
+        /* @__PURE__ */ jsx("p", { className: "text-[12.5px] leading-relaxed text-muted-foreground", children: s.pdfViewerUnavailable })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ jsxs(
+        "a",
+        {
+          href: url,
+          target: "_blank",
+          rel: "noreferrer",
+          className: cn(CARD_ACTION, "text-foreground", focusOutlineClass),
+          children: [
+            /* @__PURE__ */ jsx(ExternalLink, { "aria-hidden": true, className: "size-3.5" }),
+            s.openInNewTab
+          ]
+        }
+      ),
+      file && /* @__PURE__ */ jsx(FileDownloadButton, { file, labelled: true })
+    ] })
+  ] });
+}
+function DocumentValue({ value, whole = false }) {
   const s = useFieldStrings();
   const resolve = useResolveUrl();
+  const isApp = useFieldPresentation() === "app";
   const [open, setOpen] = useState(false);
   const file = useStuffFile("document", value);
   const content = readDocumentContent(value);
   if (!content) return /* @__PURE__ */ jsx(Absent, {});
   const name = content.title ?? content.filename ?? fileLabel(content.url, content.filename, s);
   const preview = previewableUrl(content, resolve);
+  const pdf = preview !== void 0 && isPdfDocument(content, preview);
+  const opened = whole && isApp && pdf;
   return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-start gap-2.5", children: [
       /* @__PURE__ */ jsx(FileText, { "aria-hidden": true, className: "mt-0.5 size-4 shrink-0 text-muted-foreground" }),
@@ -5877,7 +6948,7 @@ function DocumentValue({ value }) {
         ),
         content.snippet && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-[12px] leading-relaxed text-muted-foreground", children: content.snippet })
       ] }),
-      preview && /* @__PURE__ */ jsxs(
+      preview && !opened && /* @__PURE__ */ jsxs(
         "button",
         {
           type: "button",
@@ -5894,56 +6965,98 @@ function DocumentValue({ value }) {
         }
       )
     ] }),
-    preview && open && /* @__PURE__ */ jsx(DocumentPreview, { url: preview, name })
+    preview && (opened || open) && /* @__PURE__ */ jsx(DocumentPreview, { url: preview, name, pdf, file, whole: opened })
   ] });
 }
+var TILE_RENDITION_SIDE = 576;
+var CELL_RENDITION_HEIGHT = 80;
+var CELL_RENDITION_WIDTH = 256;
+function renditionWidth(place, content) {
+  const { width, height } = content;
+  const ratio = width !== void 0 && height !== void 0 && width > 0 && height > 0 ? width / height : void 0;
+  if (place === "tile") {
+    return ratio === void 0 ? TILE_RENDITION_SIDE : Math.ceil(TILE_RENDITION_SIDE * Math.max(1, ratio));
+  }
+  return ratio === void 0 ? CELL_RENDITION_WIDTH : Math.max(CELL_RENDITION_WIDTH, Math.ceil(CELL_RENDITION_HEIGHT * ratio));
+}
+function renditionUrl(content, whole, resolveRendition, width) {
+  return viewableUrl(resolveRendition?.(content.url, { width })) ?? whole;
+}
 function ImageValue({
   value,
   inGallery = false,
   inRow = false,
-  compact = false
+  compact = false,
+  downloadable = true,
+  opener
 }) {
   const s = useFieldStrings();
+  const presentation = useFieldPresentation();
   const resolve = useResolveUrl();
-  const file = useStuffFile("image", value);
+  const resolveRendition = useResolveRendition();
+  const stuffFile = useStuffFile("image", value);
+  const file = downloadable ? stuffFile : void 0;
+  const [viewing, setViewing] = useState(false);
+  const ownButton = useRef(null);
+  const frame = useRef(null);
   const content = readImageContent(value);
+  const src = content ? paintableUrl(content, resolve) : void 0;
+  if (viewing && src === void 0) setViewing(false);
   if (!content) return /* @__PURE__ */ jsx(Absent, {});
-  const src = paintableUrl(content, resolve);
-  return /* @__PURE__ */ jsxs("div", { className: inGallery ? "space-y-1" : "space-y-1.5", children: [
-    src ? (
-      // Wrapped in a link: the picture is a PREVIEW of a file, and clicking a
-      // preview to see the thing it previews is what a reader expects. The
-      // reference underneath is the other half - a picture with no URL beside
-      // it is a result you can look at and cannot use.
+  const place = inGallery ? "tile" : compact ? "cell" : void 0;
+  const drawn = src !== void 0 && place !== void 0 ? renditionUrl(content, src, resolveRendition, renditionWidth(place, content)) : src;
+  const name = src === void 0 ? "" : fileLabel(src, content.filename, s);
+  const fileLine = src !== void 0 && !compact && !(inGallery && presentation === "app");
+  const size = !inGallery && !compact && content.width && content.height ? { width: content.width, height: content.height } : void 0;
+  return /* @__PURE__ */ jsxs("div", { ref: frame, className: inGallery ? "space-y-1" : "space-y-1.5", children: [
+    src !== void 0 && drawn !== void 0 ? (
+      // A button, not a link: the picture opens in the viewer over the
+      // result. Enter and Space open it as a click does.
       /* @__PURE__ */ jsx(
-        "a",
+        "button",
         {
-          href: src,
-          target: "_blank",
-          rel: "noreferrer",
-          title: content.url,
+          ref: opener ? opener.ref : ownButton,
+          type: "button",
+          onClick: opener ? opener.open : () => setViewing(true),
+          "aria-label": s.viewImage(name),
+          "aria-haspopup": "dialog",
           className: cn(
-            inGallery || compact ? "inline-block" : "block w-full",
+            // BLOCK when the picture fills its column. A table cell's
+            // thumbnail sizes itself, and is 44px square at the least below
+            // `sm`, where it is tapped.
+            compact ? "inline-flex items-center justify-center align-top max-sm:min-h-11 max-sm:min-w-11" : "block w-full",
+            "cursor-zoom-in",
             focusOutlineInsetClass
           ),
           children: /* @__PURE__ */ jsx(
             LoadingImage,
             {
-              src,
+              src: drawn,
+              ...drawn !== src ? { fallbackSrc: src } : {},
               alt: content.caption ?? s.preview,
+              lazy: inGallery || compact,
+              ...size ? { size } : {},
+              ...inGallery ? (
+                // The tile's box is square before anything arrives, and the
+                // picture covers it once it does: tiles of one size, whatever
+                // the pictures' shapes, and nothing moves when one lands.
+                { box: "aspect-square w-full overflow-hidden" }
+              ) : compact ? { box: "h-10 min-w-10" } : {},
               className: cn(
-                inGallery && "block aspect-square w-full object-cover",
-                // A cell is one line tall. An image column rendered at the standalone
-                // height turns every row into a picture and the table into a
-                // slideshow, so a cell gets a thumbnail and the row's expansion gets
-                // the picture.
+                inGallery && "absolute inset-0 size-full object-cover",
+                // A cell is one line tall. An image column rendered at the
+                // standalone height turns every row into a picture and the
+                // table into a slideshow, so a cell gets a thumbnail and the
+                // row's expansion gets the picture.
                 compact && "h-10 w-auto rounded border border-border object-cover",
                 // On its own: the full width it is given, capped generously in
                 // height. `max-h-64` was a 256px thumbnail in a panel several
                 // times that tall — a generated report image is the RESULT here,
-                // not a decoration beside one, and it was unreadable at that size.
-                // `object-contain` keeps the aspect ratio when the cap bites.
-                !inGallery && !compact && "max-h-176 w-full rounded-lg border border-border object-contain"
+                // not a decoration beside one, and it was unreadable at that
+                // size. `object-contain` keeps the aspect ratio when the cap
+                // bites, and the payload's own width and height, when it states
+                // them, reserve the box before the picture arrives.
+                !inGallery && !compact && "h-auto max-h-176 w-full rounded-lg border border-border object-contain"
               )
             }
           )
@@ -5989,7 +7102,7 @@ function ImageValue({
         file
       }
     ),
-    src && !compact && /* @__PURE__ */ jsx("div", { className: inGallery ? "px-2.5" : void 0, children: /* @__PURE__ */ jsx(
+    fileLine && /* @__PURE__ */ jsx("div", { className: inGallery ? "px-2.5" : void 0, children: /* @__PURE__ */ jsx(
       FileRef,
       {
         url: src,
@@ -6008,6 +7121,24 @@ function ImageValue({
         ),
         children: content.caption
       }
+    ),
+    viewing && src !== void 0 && /* @__PURE__ */ jsx(
+      ImageViewer,
+      {
+        pictures: [
+          {
+            src,
+            name,
+            ...content.caption ? { caption: content.caption } : {},
+            actions: /* @__PURE__ */ jsx(FileActions, { copy: { url: src, storageUrl: content.url }, file })
+          }
+        ],
+        index: 0,
+        onIndexChange: () => {
+        },
+        onClose: () => setViewing(false),
+        returnFocus: () => ownButton.current ?? frame.current?.querySelector("a[href], button")
+      }
     )
   ] });
 }
@@ -6043,7 +7174,13 @@ function LeafValue({
 }
 function RecordSummary({ field, value }) {
   const s = useFieldStrings();
+  const presentation = useFieldPresentation();
   if (isNativeDateNode(field)) return /* @__PURE__ */ jsx(DateValue, { value });
+  const verdict = presentation === "app" ? nativeVerdictOf(field) : void 0;
+  const reading = verdict ? readVerdict(verdict, value, s) : void 0;
+  if (reading) {
+    return /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-[13px] text-foreground", children: reading.answer });
+  }
   if (!isRecord(value) || Object.keys(value).length === 0) return /* @__PURE__ */ jsx(Absent, {});
   const naming = isNativeHtmlNode(field) ? void 0 : recordNameField(field.fields) ?? field.fields.find((member) => member.kind === "prose");
   if (naming === void 0) {
@@ -6051,32 +7188,59 @@ function RecordSummary({ field, value }) {
   }
   return /* @__PURE__ */ jsx(LeafValue, { field: naming, value: ownProp(value, naming.name), compact: true });
 }
-function LoadingImage({ src, alt, className }) {
+function LoadingImage({
+  src,
+  fallbackSrc,
+  alt,
+  className,
+  box,
+  size,
+  lazy = false
+}) {
   const [state, setState] = useState("loading");
-  const [current, setCurrent] = useState(src);
-  if (current !== src) {
-    setCurrent(src);
-    setState("loading");
+  const [current, setCurrent] = useState({ src, fallbackSrc });
+  const [shown, setShown] = useState(src);
+  if (current.src !== src || current.fallbackSrc !== fallbackSrc) {
+    const next = current.src !== src ? src : shown === current.fallbackSrc ? fallbackSrc ?? src : shown;
+    setCurrent({ src, fallbackSrc });
+    if (next !== shown) {
+      setShown(next);
+      setState("loading");
+    }
   }
-  return /* @__PURE__ */ jsxs("span", { className: "relative block", children: [
+  const reserved = box !== void 0 || size !== void 0;
+  return /* @__PURE__ */ jsxs("span", { className: cn("relative block", box), children: [
     state === "loading" && /* @__PURE__ */ jsx(
       "span",
       {
         role: "status",
         "aria-label": alt,
-        className: "absolute inset-0 flex items-center justify-center rounded-lg border border-border bg-card/40",
+        className: cn(
+          "absolute inset-0 flex items-center justify-center",
+          // A box the caller drew is the frame; anything else gets one.
+          box ? "bg-muted/40" : "rounded-lg border border-border bg-card/40"
+        ),
         children: /* @__PURE__ */ jsx(Loader2, { "aria-hidden": true, className: "size-4 animate-spin text-muted-foreground" })
       }
     ),
     /* @__PURE__ */ jsx(
       "img",
       {
-        src,
+        src: shown,
         alt,
         referrerPolicy: "no-referrer",
+        decoding: "async",
+        ...lazy ? { loading: "lazy" } : {},
+        ...size ? { width: size.width, height: size.height } : {},
         onLoad: () => setState("done"),
-        onError: () => setState("done"),
-        className: cn(className, state === "loading" && "min-h-40 opacity-0")
+        onError: () => {
+          if (fallbackSrc !== void 0 && shown !== fallbackSrc) setShown(fallbackSrc);
+          else setState("done");
+        },
+        className: cn(
+          className,
+          state === "loading" && (reserved ? "opacity-0" : "min-h-40 opacity-0")
+        )
       }
     )
   ] });
@@ -6380,42 +7544,157 @@ function ObjectTable({
   );
 }
 function CompositeValue({ members }) {
-  return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: members.map((member) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-    /* @__PURE__ */ jsx("span", { className: "font-mono text-[12px] font-semibold text-foreground", children: member.name }),
-    /* @__PURE__ */ jsx(NativeValue, { value: member.value })
-  ] }, member.name)) });
+  const presentation = useFieldPresentation();
+  const isApp = presentation === "app";
+  return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: members.map((member) => {
+    const label = isApp ? humanizeFieldName(member.name) : member.name;
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "font-semibold text-foreground",
+            isApp ? "text-[13.5px]" : "font-mono text-[12px]"
+          ),
+          children: label
+        }
+      ),
+      /* @__PURE__ */ jsx(NativeValue, { value: member.value, label })
+    ] }, member.name);
+  }) });
 }
-function NativeValue({ value }) {
+function NativeValue({ value, label }) {
   if (value === null || value === void 0 || value === "") return /* @__PURE__ */ jsx(Absent, {});
-  const html = readHtmlContent(value);
-  if (html) return /* @__PURE__ */ jsx(HtmlPreview, { content: html, downloadPdf: false });
-  const date = readDateContent(value);
-  if (date) return /* @__PURE__ */ jsx("span", { className: "text-[13px] text-foreground", children: formatDateContent(date) });
-  const document2 = readDocumentContent(value);
-  if (document2?.url !== void 0) {
-    return /* @__PURE__ */ jsx(
-      FileRef,
-      {
-        url: document2.url,
-        ...document2.mimeType !== void 0 ? { mimeType: document2.mimeType } : {},
-        ...document2.filename !== void 0 ? { filename: document2.filename } : {}
-      }
-    );
+  if (typeof value === "string") return /* @__PURE__ */ jsx(Markdown, { text: value });
+  if (Array.isArray(value)) return /* @__PURE__ */ jsx(NativeList, { items: value, label });
+  if (!isRecord(value)) return /* @__PURE__ */ jsx(Scalar, { value });
+  const content = readMemberContent(value);
+  switch (content?.model) {
+    case "html":
+      return /* @__PURE__ */ jsx(HtmlPreview, { content: content.html, downloadPdf: false });
+    case "date":
+      return /* @__PURE__ */ jsx("span", { className: "text-[13px] text-foreground", children: formatDateContent(content.date) });
+    case "image":
+      return /* @__PURE__ */ jsx(ImageValue, { value, downloadable: false });
+    case "document":
+      return /* @__PURE__ */ jsx(
+        FileRef,
+        {
+          url: content.document.url,
+          ...content.document.mimeType !== void 0 ? { mimeType: content.document.mimeType } : {},
+          ...content.document.filename !== void 0 ? { filename: content.document.filename } : {}
+        }
+      );
+    case "list":
+      return /* @__PURE__ */ jsx(NativeList, { items: content.items, label });
+    case "text":
+      return content.text === "" ? /* @__PURE__ */ jsx(Absent, {}) : /* @__PURE__ */ jsx(Markdown, { text: content.text });
+    case void 0:
+      return /* @__PURE__ */ jsx(RawValue, { value, compact: false });
+  }
+}
+function NativeList({ items, label }) {
+  if (items.length === 0) return /* @__PURE__ */ jsx(Absent, {});
+  if (items.every(isPlainRecord)) return /* @__PURE__ */ jsx(RecordsTable, { items, label });
+  return /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60 overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3 py-1.5", children: /* @__PURE__ */ jsx(NativeValue, { value: item, label }) }, index)) });
+}
+var TEXT_MEMBERS = /* @__PURE__ */ new Set(["text"]);
+var DATE_MEMBERS = /* @__PURE__ */ new Set(["date", "time", ...TYPED_SCALAR_MARKERS]);
+var HTML_MEMBERS = /* @__PURE__ */ new Set(["inner_html", "css_class"]);
+var DOCUMENT_MEMBERS = /* @__PURE__ */ new Set([
+  "url",
+  "public_url",
+  "mime_type",
+  "filename",
+  "title",
+  "snippet"
+]);
+var IMAGE_MEMBERS = /* @__PURE__ */ new Set([
+  "url",
+  "public_url",
+  "source_prompt",
+  "source_negative_prompt",
+  "caption",
+  "mime_type",
+  "width",
+  "height",
+  "filename"
+]);
+var LIST_MEMBERS = /* @__PURE__ */ new Set(["items"]);
+function holdsOnly(record, members) {
+  return Object.keys(record).every((key) => members.has(key));
+}
+function readMemberContent(record) {
+  if (holdsOnly(record, HTML_MEMBERS)) {
+    const html = readHtmlContent(record);
+    if (html) return { model: "html", html };
   }
-  if (isRecord(value) && Array.isArray(value.items)) {
-    const items = value.items;
-    if (items.length === 0) return /* @__PURE__ */ jsx(Absent, {});
-    return /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60 overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3 py-1.5", children: /* @__PURE__ */ jsx(NativeValue, { value: item }) }, index)) });
+  if (holdsOnly(record, DATE_MEMBERS)) {
+    const date = readDateContent(record);
+    if (date) return { model: "date", date };
   }
-  if (isRecord(value)) {
-    const text = value.text;
-    if (typeof text === "string") {
-      return text === "" ? /* @__PURE__ */ jsx(Absent, {}) : /* @__PURE__ */ jsx(Markdown, { text });
+  if (holdsOnly(record, IMAGE_MEMBERS)) {
+    const image = readImageContent(record);
+    if (image && (!holdsOnly(record, DOCUMENT_MEMBERS) || image.mimeType?.toLowerCase().startsWith("image/") === true)) {
+      return { model: "image" };
     }
   }
-  if (typeof value === "string") return /* @__PURE__ */ jsx(Markdown, { text: value });
-  if (typeof value !== "object") return /* @__PURE__ */ jsx(Scalar, { value });
-  return /* @__PURE__ */ jsx(RawValue, { value, compact: false });
+  if (holdsOnly(record, DOCUMENT_MEMBERS)) {
+    const document2 = readDocumentContent(record);
+    if (document2) return { model: "document", document: document2 };
+  }
+  if (holdsOnly(record, LIST_MEMBERS)) {
+    const items = ownProp(record, "items");
+    if (Array.isArray(items)) return { model: "list", items };
+  }
+  if (holdsOnly(record, TEXT_MEMBERS)) {
+    const text = ownProp(record, "text");
+    if (typeof text === "string") return { model: "text", text };
+  }
+  return void 0;
+}
+function isPlainRecord(value) {
+  if (!isRecord(value) || Object.keys(value).length === 0) return false;
+  return readMemberContent(value) === void 0;
+}
+function RecordsTable({
+  items,
+  label
+}) {
+  const presentation = useFieldPresentation();
+  const isApp = presentation === "app";
+  const columns = [];
+  for (const item of items) {
+    for (const key of Object.keys(item)) if (!columns.includes(key)) columns.push(key);
+  }
+  const columnLabel = (column) => isApp ? humanizeFieldName(column) : column;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "group",
+      "aria-label": label,
+      tabIndex: 0,
+      className: cn("overflow-x-auto rounded-lg border border-border", focusOutlineClass),
+      children: /* @__PURE__ */ jsxs("table", { className: "min-w-full border-collapse text-[12.5px] text-foreground", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { className: "border-b border-border bg-card/40", children: columns.map((column) => /* @__PURE__ */ jsx(
+          "th",
+          {
+            scope: "col",
+            className: cn(
+              "px-2.5 py-1.5 text-start align-bottom font-semibold",
+              !isApp && "font-mono text-[12px]"
+            ),
+            children: columnLabel(column)
+          },
+          column
+        )) }) }),
+        /* @__PURE__ */ jsx("tbody", { children: items.map((item, index) => /* @__PURE__ */ jsx("tr", { className: "border-b border-border/60 last:border-b-0", children: columns.map((column) => {
+          const cell = ownProp(item, column);
+          return /* @__PURE__ */ jsx("td", { className: "px-2.5 py-1.5 align-top", children: typeof cell === "boolean" ? /* @__PURE__ */ jsx(Bool, { value: cell }) : typeof cell === "object" && cell !== null ? /* @__PURE__ */ jsx(NativeValue, { value: cell, label: columnLabel(column) }) : /* @__PURE__ */ jsx(Scalar, { value: cell }) }, column);
+        }) }, index)) })
+      ] })
+    }
+  );
 }
 function isRecord(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
@@ -6424,12 +7703,65 @@ function ScalarLines({ field, items }) {
   return /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60 overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3 py-1.5", children: /* @__PURE__ */ jsx(LeafValue, { field, value: item }) }, index)) });
 }
 function ImageGallery({ items }) {
-  const anyViewable = items.some((item) => {
+  const s = useFieldStrings();
+  const resolve = useResolveUrl();
+  const [viewing, setViewing] = useState(null);
+  const tiles = useRef(/* @__PURE__ */ new Map());
+  const gallery = useRef(null);
+  const pictures = items.flatMap((item, entry) => {
     const content = readImageContent(item);
-    return content ? !!(viewableUrl(content.publicUrl) ?? viewableUrl(content.url)) : false;
+    const src = content ? paintableUrl(content, resolve) : void 0;
+    return content && src !== void 0 ? [{ entry, item, content, src }] : [];
   });
-  if (!anyViewable) return /* @__PURE__ */ jsx(FileRows, { items, kind: "image" });
-  return /* @__PURE__ */ jsx("div", { className: "grid grid-cols-[repeat(auto-fill,minmax(140px,1fr))] gap-2", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-lg border border-border bg-card/40", children: /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: /* @__PURE__ */ jsx(ImageValue, { value: item, inGallery: true }) }) }, index)) });
+  const shown = viewing ? pictures.findIndex((picture) => picture.entry === viewing.entry) : -1;
+  if (viewing && shown === -1) setViewing(null);
+  const returnFocus = (opener) => () => {
+    const first = [...tiles.current.entries()].sort(([a], [b]) => a - b)[0]?.[1];
+    return tiles.current.get(opener) ?? first ?? gallery.current;
+  };
+  const frame = (children) => /* @__PURE__ */ jsx("div", { ref: gallery, tabIndex: -1, className: "outline-none", children });
+  if (pictures.length === 0) return frame(/* @__PURE__ */ jsx(FileRows, { items, kind: "image" }));
+  return frame(
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-[repeat(auto-fill,minmax(140px,1fr))] gap-2", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-lg border border-border bg-card/40", children: /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: /* @__PURE__ */ jsx(
+        ImageValue,
+        {
+          value: item,
+          inGallery: true,
+          opener: {
+            open: () => setViewing({ entry: index, opener: index }),
+            ref: (button) => {
+              if (button) tiles.current.set(index, button);
+              else tiles.current.delete(index);
+            }
+          }
+        }
+      ) }) }, index)) }),
+      viewing && shown !== -1 && /* @__PURE__ */ jsx(
+        ImageViewer,
+        {
+          pictures: pictures.map(({ entry, item, content, src }) => ({
+            src,
+            name: fileLabel(src, content.filename, s),
+            ...content.caption ? { caption: content.caption } : {},
+            actions: /* @__PURE__ */ jsx(ResultAt, { segment: String(entry), children: /* @__PURE__ */ jsx(ViewerFileActions, { value: item, src }) })
+          })),
+          index: shown,
+          onIndexChange: (position) => {
+            const picture = pictures[position];
+            if (picture) setViewing({ entry: picture.entry, opener: viewing.opener });
+          },
+          onClose: () => setViewing(null),
+          returnFocus: returnFocus(viewing.opener)
+        }
+      )
+    ] })
+  );
+}
+function ViewerFileActions({ value, src }) {
+  const file = useStuffFile("image", value);
+  const content = readImageContent(value);
+  return /* @__PURE__ */ jsx(FileActions, { copy: { url: src, ...content ? { storageUrl: content.url } : {} }, file });
 }
 function FileRows({ items, kind }) {
   return /* @__PURE__ */ jsx("div", { className: "divide-y divide-border overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3.5 py-2", children: /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: kind === "document" ? /* @__PURE__ */ jsx(DocumentValue, { value: item }) : /* @__PURE__ */ jsx(ImageValue, { value: item, inRow: true }) }) }, index)) });
@@ -6459,17 +7791,112 @@ function chooseColumns(fields, budget) {
     ...name ? { name } : {}
   };
 }
+var RAW_PAGE_SOURCES = "data:";
+function PageValue({ field, value, depth }) {
+  const presentation = useFieldPresentation();
+  const content = readPageContent(value);
+  const text = content?.text;
+  const segments = useMemo(() => text === void 0 ? [] : splitExtractedText(text), [text]);
+  const hasText = segments.length > 0;
+  const rawHtml = hasText ? void 0 : content?.rawHtml;
+  const rawPage = useMemo(
+    () => rawHtml === void 0 ? void 0 : { innerHtml: rawHtml },
+    [rawHtml]
+  );
+  if (!content) return /* @__PURE__ */ jsx(Absent, {});
+  const extracted = hasText || rawPage !== void 0 || content.images.length > 0;
+  const showView = content.pageView !== void 0 && (presentation === "studio" || !extracted);
+  if (!extracted && !showView) return /* @__PURE__ */ jsx(Absent, {});
+  const viewField = field.kind === "object" ? field.fields.find((member) => member.name === "page_view") : void 0;
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    hasText && /* @__PURE__ */ jsx(ExtractedPageText, { segments }),
+    rawPage && /* @__PURE__ */ jsx(
+      HtmlPreview,
+      {
+        content: rawPage,
+        downloadPdf: false,
+        imgSrc: RAW_PAGE_SOURCES,
+        fontSrc: RAW_PAGE_SOURCES
+      }
+    ),
+    content.images.length > 0 && /* @__PURE__ */ jsx(ResultAt, { segment: "text_and_images", children: /* @__PURE__ */ jsx(ResultAt, { segment: "images", children: /* @__PURE__ */ jsx(ImageGallery, { items: content.images }) }) }),
+    showView && /* @__PURE__ */ jsx(ResultAt, { segment: "page_view", children: presentation === "studio" && viewField ? /* @__PURE__ */ jsx(ResultField, { field: viewField, value: content.pageView, depth: depth + 1 }) : /* @__PURE__ */ jsx(ImageValue, { value: content.pageView }) })
+  ] });
+}
+function readVerdict(verdict, value, s) {
+  if (verdict === "yes_no") {
+    const content2 = readYesNoContent(value);
+    if (!content2) return void 0;
+    return {
+      answer: content2.yesNo ? s.yes : s.no,
+      ...content2.probability !== void 0 ? { measure: s.yesProbability(content2.probability) } : {}
+    };
+  }
+  if (verdict === "rating") {
+    const content2 = readRatingContent(value);
+    if (!content2) return void 0;
+    return {
+      // A scale that names its levels says which one in words; one that does
+      // not is counted from one, as a reader counts.
+      answer: content2.label ?? s.ratingLevel(content2.level + 1),
+      ...content2.confidence !== void 0 ? { measure: s.verdictConfidence(content2.confidence) } : {}
+    };
+  }
+  const content = readChoiceContent(value);
+  if (!content) return void 0;
+  return {
+    answer: humanizeEnumValue(content.choice),
+    ...content.confidence !== void 0 ? { measure: s.verdictConfidence(content.confidence) } : {}
+  };
+}
+function VerdictValue({ reading, prominent }) {
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
+    /* @__PURE__ */ jsx(
+      "p",
+      {
+        className: cn(
+          "font-semibold text-foreground",
+          prominent ? "text-[22px] leading-tight" : "text-[15px] leading-snug"
+        ),
+        children: reading.answer
+      }
+    ),
+    reading.measure !== void 0 && /* @__PURE__ */ jsx("p", { className: "text-[12.5px] text-muted-foreground", children: reading.measure })
+  ] });
+}
+function isLongText(value) {
+  return typeof value === "string" && (value.includes("\n") || value.length > CELL_LENGTH_LIMIT);
+}
+var PanelResultContext = createContext(null);
+var TITLED_PANEL = { hostHeaded: false };
+var HOST_HEADED_PANEL = { hostHeaded: true };
+function PanelResult({
+  hostHeaded,
+  children
+}) {
+  return /* @__PURE__ */ jsx(PanelResultContext, { value: hostHeaded ? HOST_HEADED_PANEL : TITLED_PANEL, children });
+}
 function ResultField(props) {
   const location = useResultLocation();
-  if (location) return /* @__PURE__ */ jsx(ResultNode, { ...props });
-  return /* @__PURE__ */ jsx(ResultRoot, { baseName: props.field.name, path: [props.field.name], children: /* @__PURE__ */ jsx(ResultNode, { ...props }) });
+  const panel = use(PanelResultContext);
+  const node = panel ? /* @__PURE__ */ jsx(PanelResultContext, { value: null, children: /* @__PURE__ */ jsx(ResultNode, { ...props, whole: true, hostHeaded: panel.hostHeaded }) }) : /* @__PURE__ */ jsx(ResultNode, { ...props });
+  if (location) return node;
+  return /* @__PURE__ */ jsx(ResultRoot, { baseName: props.field.name, path: [props.field.name], children: node });
 }
-function ResultNode({ field, value, depth = 0, hideLabel = false }) {
+function ResultNode({
+  field,
+  value,
+  depth = 0,
+  hideLabel = false,
+  whole = false,
+  hostHeaded = false
+}) {
   const s = useFieldStrings();
   const unwrapped = unwrap(field, value);
   const pageDownloadShown = useFileDownloadShown("markup");
   const pdfShown = usePdfSaveShown();
   const location = useResultLocation();
+  const isApp = useFieldPresentation() === "app";
   const header = hideLabel ? null : /* @__PURE__ */ jsx(Label2, { field, describe: true });
   const copyText = (field.kind === "text" || field.kind === "prose") && typeof unwrapped === "string" && unwrapped !== "" ? unwrapped : void 0;
   if (isNativeDateNode(field)) {
@@ -6507,9 +7934,24 @@ function ResultNode({ field, value, depth = 0, hideLabel = false }) {
       members && members.length > 0 ? /* @__PURE__ */ jsx(CompositeValue, { members }) : /* @__PURE__ */ jsx(Absent, {})
     ] });
   }
+  if (isNativePageNode(field)) {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      header,
+      /* @__PURE__ */ jsx(PageValue, { field, value: unwrapped, depth })
+    ] });
+  }
+  const verdict = isApp ? nativeVerdictOf(field) : void 0;
+  const reading = verdict ? readVerdict(verdict, unwrapped, s) : void 0;
+  if (reading) {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      header,
+      /* @__PURE__ */ jsx(VerdictValue, { reading, prominent: whole })
+    ] });
+  }
   switch (field.kind) {
     case "object": {
       const memberValue = (child) => typeof unwrapped === "object" && unwrapped !== null ? ownProp(unwrapped, child.name) : void 0;
+      const sharesALine = (child) => isInlineColumn(child) && !(isApp && child.kind === "text" && isLongText(unwrap(child, memberValue(child))));
       return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         header,
         /* @__PURE__ */ jsx(
@@ -6541,7 +7983,7 @@ function ResultNode({ field, value, depth = 0, hideLabel = false }) {
                 // so does anything with chrome of its own - a table, a gallery, a
                 // frame - which beside a label would be squeezed into whatever the
                 // longest label left over.
-                isInlineColumn(child) ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+                sharesALine(child) ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
                   /* @__PURE__ */ jsx("div", { className: "min-w-0", children: /* @__PURE__ */ jsx(Label2, { field: child, describe: true }) }),
                   /* @__PURE__ */ jsx("div", { className: "flex min-w-0 justify-end **:data-chips:justify-end", children: /* @__PURE__ */ jsx("div", { className: "min-w-0 text-left wrap-break-word", children: /* @__PURE__ */ jsx(LeafValue, { field: child, value: memberValue(child) }) }) })
                 ] }, child.name) : /* @__PURE__ */ jsx("div", { className: "col-span-2 min-w-0", children: /* @__PURE__ */ jsx(ResultAt, { segment: child.name, children: /* @__PURE__ */ jsx(ResultField, { field: child, value: memberValue(child), depth: depth + 1 }) }) }, child.name)
@@ -6555,7 +7997,7 @@ function ResultNode({ field, value, depth = 0, hideLabel = false }) {
       const items = Array.isArray(unwrapped) ? unwrapped : [];
       const columns = recordColumns(field.item);
       return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
+        isApp && hostHeaded ? null : /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
           header,
           /* @__PURE__ */ jsx("span", { className: "font-mono text-[10.5px] text-muted-foreground", children: s.itemsCount(items.length) })
         ] }),
@@ -6567,6 +8009,30 @@ function ResultNode({ field, value, depth = 0, hideLabel = false }) {
           // column named by it, and show a composite as JSON. The arm keyed by
           // concept is the one that knows what each entry is.
           /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60 overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3 py-1.5", children: /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: /* @__PURE__ */ jsx(ResultField, { field: field.item, value: item, depth: depth + 1, hideLabel: true }) }) }, index)) })
+        ) : isNativePageNode(field.item) ? (
+          // A document's pages, one after the other, each drawn by the page
+          // arm and captioned with its number: a page is a document's unit,
+          // and a table of pages had a row per page and the text nowhere.
+          /* @__PURE__ */ jsx("div", { className: "space-y-3", children: items.map((item, index) => (
+            // An article, not a section: a named section is a landmark,
+            // and a landmark's name must be unique on the page, which
+            // "Page 1" is not once a host shows two results.
+            /* @__PURE__ */ jsxs(
+              "article",
+              {
+                "aria-label": s.pageNumber(index + 1),
+                className: "space-y-2 rounded-lg border border-border bg-card/40 px-3.5 py-3",
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-[12px] font-medium text-muted-foreground", children: s.pageNumber(index + 1) }),
+                  /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: /* @__PURE__ */ jsx(ResultField, { field: field.item, value: item, depth: depth + 1, hideLabel: true }) })
+                ]
+              },
+              index
+            )
+          )) })
+        ) : isApp && nativeVerdictOf(field.item) ? (
+          // Verdicts in `app`, one per line, each drawn by the verdict arm.
+          /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60 overflow-hidden rounded-lg border border-border", children: items.map((item, index) => /* @__PURE__ */ jsx("div", { className: "bg-card/40 px-3 py-1.5", children: /* @__PURE__ */ jsx(ResultAt, { segment: String(index), children: /* @__PURE__ */ jsx(ResultField, { field: field.item, value: item, depth: depth + 1, hideLabel: true }) }) }, index)) })
         ) : columns ? (
           // Same shape every row: the labels are column headers, not per-row
           // labels. See `ObjectTable`.
@@ -6623,7 +8089,7 @@ function ResultNode({ field, value, depth = 0, hideLabel = false }) {
           /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: header }),
           /* @__PURE__ */ jsx(CopyButton, { value: copyText, label: s.copyText })
         ] }),
-        /* @__PURE__ */ jsx(LeafValue, { field, value })
+        isApp && field.kind === "text" && isLongText(unwrapped) ? /* @__PURE__ */ jsx(Markdown, { text: unwrapped }) : field.kind === "document" && whole ? /* @__PURE__ */ jsx(DocumentValue, { value: unwrapped, whole: true }) : /* @__PURE__ */ jsx(LeafValue, { field, value })
       ] });
   }
   return null;
@@ -6785,6 +8251,9 @@ function StuffPanel({
   const labels = { rendered: s.viewRendered, json: s.viewJson };
   const pdfName = page && pdfShown ? pdfFileName(field, value, baseName) : void 0;
   const pageView = page !== void 0 && view !== "json";
+  const titled = presentation !== "app" || name !== void 0 && name !== "" && !page;
+  const switchShown = offered.length > 1;
+  const headerShown = titled || downloadShown || switchShown || page && pdfName !== void 0;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -6799,8 +8268,9 @@ function StuffPanel({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center justify-between gap-x-4 gap-y-1", children: [
-          page && presentation === "app" ? /* @__PURE__ */ jsx("div", {}) : /* @__PURE__ */ jsx("div", { className: "min-w-0 space-y-1", children: /* @__PURE__ */ jsx(ResultHeader, { field: named }) }),
+        dialog,
+        headerShown && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center justify-between gap-x-4 gap-y-1", children: [
+          titled ? /* @__PURE__ */ jsx("div", { className: "min-w-0 space-y-1", children: /* @__PURE__ */ jsx(ResultHeader, { field: named }) }) : /* @__PURE__ */ jsx("div", {}),
           /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
             page && pdfName !== void 0 && /* @__PURE__ */ jsx(
               PdfDownloadButton,
@@ -6828,8 +8298,7 @@ function StuffPanel({
                 ]
               }
             ),
-            dialog,
-            offered.length > 1 && /* @__PURE__ */ jsx(
+            switchShown && /* @__PURE__ */ jsx(
               "div",
               {
                 role: "group",
@@ -6870,7 +8339,7 @@ function StuffPanel({
           // `ResultField`, whose page arm would add a second control row saving
           // the same file, and with no box around it.
           /* @__PURE__ */ jsx(HtmlPreview, { content: page, downloadPdf: false, bare: true, fill: true })
-        ) : /* @__PURE__ */ jsx(ResultRoot, { baseName, path: [field.name], children: /* @__PURE__ */ jsx(ResultField, { field, value, hideLabel: true }) })
+        ) : /* @__PURE__ */ jsx(ResultRoot, { baseName, path: [field.name], children: /* @__PURE__ */ jsx(PanelResult, { hostHeaded: !titled, children: /* @__PURE__ */ jsx(ResultField, { field, value, hideLabel: true }) }) })
       ]
     }
   );
@@ -6881,6 +8350,6 @@ function pdfFileName(field, value, baseName) {
   return name === void 0 ? "" : name.replace(/\.[^.]+$/, "");
 }
 
-export { BooleanField, ConceptPill, DEFAULT_FIELD_STRINGS, DateField, DocumentField, EN_FIELD_STRINGS, EnumField, FIELD_STRINGS_BY_LOCALE, FR_FIELD_STRINGS, FieldDomIdProvider, FieldPresentationProvider, FieldRenderer, FieldShell, FieldStringsProvider, FilePicker, FilePickerEntry, FillWithExample, HtmlPreview, ImageField, JsonView, ListField, Markdown, MethodForm, NumberField, ObjectField, OptionalToggle, PdfDownloadButton, ProseField, ResultEnvProvider, ResultField, ResultRoot, SUPPORTED_LOCALES, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, StuffViewer, Switch, TextField, ToggleGroup, ToggleGroupItem, UnknownField, checkedAccentClass, cn, fieldControlClass, fieldStringsFor, focusOutlineClass, humanizeFieldName, linkTextClass, renderHtmlPdf, resolveHtmlStorageUrls, saveInBrowser, selectedBorderClass, selectedFillClass, selectedFillStrongClass, useFieldDomId, useFieldPresentation, useFieldStrings, useMethodForm, useProseImages, useResolveShareUrl, useResolveUrl, useResolvedUrl };
-//# sourceMappingURL=chunk-UGKFWX7L.js.map
-//# sourceMappingURL=chunk-UGKFWX7L.js.map
+export { BooleanField, ConceptPill, DEFAULT_FIELD_STRINGS, DateField, DocumentField, EN_FIELD_STRINGS, EnumField, FIELD_STRINGS_BY_LOCALE, FR_FIELD_STRINGS, FieldDomIdProvider, FieldPresentationProvider, FieldRenderer, FieldShell, FieldStringsProvider, FilePicker, FilePickerEntry, FillWithExample, HtmlPreview, ImageField, JsonView, ListField, Markdown, MethodForm, NumberField, ObjectField, OptionalToggle, PdfDownloadButton, ProseField, ResultEnvProvider, ResultField, ResultRoot, SUPPORTED_LOCALES, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, StuffViewer, Switch, TextField, ToggleGroup, ToggleGroupItem, UnknownField, checkedAccentClass, cn, fieldControlClass, fieldStringsFor, focusOutlineClass, humanizeFieldName, linkTextClass, renderHtmlPdf, resolveHtmlStorageUrls, saveInBrowser, selectedBorderClass, selectedFillClass, selectedFillStrongClass, useFieldDomId, useFieldPresentation, useFieldStrings, useMethodForm, useProseImages, useResolveRendition, useResolveShareUrl, useResolveUrl, useResolvedUrl };
+//# sourceMappingURL=chunk-RSYOZZZF.js.map
+//# sourceMappingURL=chunk-RSYOZZZF.js.map