@pipelex/mthds-form 0.8.0 → 0.9.0

package/dist/react/index.js

@@ -1,2617 +1,11 @@
 "use client";
-import { collectStuffFiles } from '../chunk-4BSBBG2T.js';
-import { isNativeDateNode, isNativeHtmlNode, readHtmlContent, isNativeCompositeNode, readCompositeContent, isViewableUrl, readDateContent, formatDateContent, readImageContent, readDocumentContent } from '../chunk-45C2MKK6.js';
-import { conceptCategory } from '../chunk-25I6JDIK.js';
-import { isAcceptedFile, acceptMapForKind } from '../chunk-2JWRG53S.js';
-import { isFilled } from '../chunk-PM55AHRO.js';
-import { toStoredDateValue, toDateInputValue } from '../chunk-GKV77RAS.js';
-import { ownProp } from '../chunk-V3OV2XQT.js';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { ChevronDown, ChevronUp, Check, List, Braces, ListChecks, ToggleLeft, Hash, Image, FileText, CalendarDays, Type, Loader2, Upload, Link2, ImageOff, EyeOff, Eye, X, Minus, Plus, Trash2, Copy, Download, ChevronRight } from 'lucide-react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import * as React2 from 'react';
-import { createContext, use, useId, useMemo, useContext, useState, useRef, useCallback, useEffect, Fragment as Fragment$1, useLayoutEffect } from 'react';
-import * as SwitchPrimitives from '@radix-ui/react-switch';
-import { useDropzone } from 'react-dropzone';
-import * as SelectPrimitive from '@radix-ui/react-select';
-import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
-import * as TogglePrimitive from '@radix-ui/react-toggle';
-import { cva } from 'class-variance-authority';
-import * as TooltipPrimitive from '@radix-ui/react-tooltip';
-import { marked } from 'marked';
-
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var CATEGORY_ICON = {
-  text: Type,
-  date: CalendarDays,
-  document: FileText,
-  image: Image,
-  number: Hash,
-  boolean: ToggleLeft,
-  choice: ListChecks,
-  structured: Braces,
-  list: List
-};
-function ConceptPill({ conceptRef, category, className }) {
-  const Icon2 = CATEGORY_ICON[category];
-  const label = conceptRef ?? category;
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      className: cn(
-        "inline-flex items-center gap-1 font-mono text-[10.5px] leading-none text-muted-foreground",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx(Icon2, { className: "h-3 w-3 shrink-0 opacity-70", strokeWidth: 1.75, "aria-hidden": true }),
-        /* @__PURE__ */ jsx("span", { className: "truncate", children: label })
-      ]
-    }
-  );
-}
-var FieldPresentationContext = createContext("studio");
-function FieldPresentationProvider({
-  presentation,
-  children
-}) {
-  return /* @__PURE__ */ jsx(FieldPresentationContext, { value: presentation, children });
-}
-function useFieldPresentation() {
-  return use(FieldPresentationContext);
-}
-function humanizeFieldName(name) {
-  const words = name.replace(/[_-]+/g, " ").trim();
-  if (words === "") return name;
-  return words.charAt(0).toUpperCase() + words.slice(1);
-}
-function fieldLabel(title, name, presentation) {
-  if (title !== void 0) return title;
-  return presentation === "app" ? humanizeFieldName(name) : name;
-}
-var Switch = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SwitchPrimitives.Root,
-  {
-    className: cn(
-      "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
-      className
-    ),
-    ...props,
-    ref,
-    children: /* @__PURE__ */ jsx(
-      SwitchPrimitives.Thumb,
-      {
-        className: cn(
-          "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
-        )
-      }
-    )
-  }
-));
-Switch.displayName = SwitchPrimitives.Root.displayName;
-var FieldDomIdContext = createContext(null);
-function FieldDomIdProvider({
-  prefix,
-  children
-}) {
-  const generated = useId();
-  return /* @__PURE__ */ jsx(FieldDomIdContext, { value: prefix ?? generated, children });
-}
-function useFieldDomId(path) {
-  const scoped = use(FieldDomIdContext);
-  const local = useId();
-  const prefix = scoped ?? local;
-  return prefix === "" ? path : `${prefix}-${path}`;
-}
-function BooleanField({ field, value, onChange, id, disabled }) {
-  const presentation = useFieldPresentation();
-  const isApp = presentation === "app";
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "flex items-center justify-between gap-4 rounded-md border border-border bg-input px-3.5 py-3",
-        disabled && "opacity-50"
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-1", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
-            /* @__PURE__ */ jsx(
-              "label",
-              {
-                htmlFor: domId,
-                className: cn(
-                  "text-[13px] font-medium leading-none text-foreground",
-                  isApp ? "text-[13.5px]" : "font-mono"
-                ),
-                children: fieldLabel(field.title, field.name, presentation)
-              }
-            ),
-            !isApp && /* @__PURE__ */ jsx(ConceptPill, { conceptRef: field.conceptRef, category: "boolean" })
-          ] }),
-          field.description && /* @__PURE__ */ jsx("p", { className: "text-[12px] leading-relaxed text-muted-foreground", children: field.description })
-        ] }),
-        /* @__PURE__ */ jsx(
-          Switch,
-          {
-            id: domId,
-            checked: value ?? false,
-            onCheckedChange: onChange,
-            disabled,
-            className: "shrink-0"
-          }
-        )
-      ]
-    }
-  );
-}
-var DEFAULT_FIELD_STRINGS = {
-  optionalBadge: "optional",
-  selectPlaceholder: "Select\u2026",
-  typeValuePlaceholder: "Type a value\u2026",
-  writeHerePlaceholder: "Write here\u2026",
-  jsonHint: "Enter this value as raw JSON.",
-  decrease: "Decrease",
-  increase: "Increase",
-  noItemsYet: "No items yet",
-  addItem: "Add item",
-  removeItemAria: (index) => `Remove item ${index}`,
-  itemsCount: (count) => count === 1 ? "1 item" : `${count} items`,
-  itemsCountOf: (count, total) => `${count} of ${total} ${total === 1 ? "item" : "items"}`,
-  uploading: "Uploading\u2026",
-  dropToUpload: "Drop to upload",
-  dropOrBrowse: "Drop a file or click to browse",
-  pasteUrlInstead: "paste a URL instead",
-  urlPlaceholder: "https://\u2026 or pipelex-storage://\u2026",
-  uploadedFile: "Uploaded file",
-  preview: "Preview",
-  removeFileAria: "Remove file",
-  previewUnavailablePdf: "Preview unavailable - open to view.",
-  // U+002D HYPHEN-MINUS, deliberately: not an en dash, not an em dash.
-  resultAbsent: "-",
-  resultAbsentDescription: "Not provided",
-  resultUndescribed: "No output descriptor for this pipe \u2014 showing the raw value.",
-  toggleRowDetails: (index) => `Show or hide the details of row ${index}`,
-  rowDetailsColumn: "Details",
-  copyUrl: "Copy the URL",
-  copyText: "Copy the text",
-  download: "Download",
-  downloading: "Downloading\u2026",
-  viewRendered: "Result",
-  viewJson: "JSON",
-  copyJson: "Copy the JSON",
-  resultViewGroup: "Result view",
-  yes: "Yes",
-  no: "No",
-  unsupportedFileType: (accept) => `That file type is not supported. Accepted formats: ${accept}.`,
-  hideOptionalFields: "Hide optional fields",
-  hideOptionalInputs: "Hide optional inputs",
-  optionalFieldsCount: (count) => count === 1 ? "1 optional field" : `${count} optional fields`,
-  optionalInputsCount: (count) => count === 1 ? "1 optional input" : `${count} optional inputs`
-};
-var FieldStringsContext = createContext(DEFAULT_FIELD_STRINGS);
-function FieldStringsProvider({
-  strings,
-  children
-}) {
-  const merged = useMemo(() => ({ ...DEFAULT_FIELD_STRINGS, ...strings }), [strings]);
-  return /* @__PURE__ */ jsx(FieldStringsContext.Provider, { value: merged, children });
-}
-function useFieldStrings() {
-  return useContext(FieldStringsContext);
-}
-function FieldShell({
-  name,
-  title,
-  conceptRef,
-  category,
-  description,
-  required,
-  error,
-  htmlFor,
-  children,
-  className
-}) {
-  const s = useFieldStrings();
-  const presentation = useFieldPresentation();
-  const isApp = presentation === "app";
-  const Label3 = htmlFor ? "label" : "div";
-  const labelText = fieldLabel(title, name, presentation);
-  const showLabel = labelText.trim() !== "";
-  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
-      showLabel && /* @__PURE__ */ jsx(
-        Label3,
-        {
-          ...htmlFor ? { htmlFor } : {},
-          className: cn(
-            "text-[13px] font-medium leading-none text-foreground",
-            isApp ? "text-[13.5px]" : "font-mono"
-          ),
-          children: labelText
-        }
-      ),
-      !isApp && /* @__PURE__ */ jsx(ConceptPill, { conceptRef, category }),
-      !required && /* @__PURE__ */ jsx("span", { className: "ml-auto font-mono text-[10px] uppercase tracking-wider text-muted-foreground", children: s.optionalBadge })
-    ] }),
-    description && /* @__PURE__ */ jsx("p", { className: "text-[12px] leading-relaxed text-muted-foreground", children: description }),
-    isApp && error ? /* @__PURE__ */ jsx("div", { className: "rounded-lg ring-1 ring-destructive/70 ring-offset-4 ring-offset-background", children }) : children,
-    error && /* @__PURE__ */ jsx("p", { className: "flex items-center gap-1 text-[11px] text-destructive", role: "alert", children: error })
-  ] });
-}
-
-// src/react/field-styles.ts
-var fieldControlClass = cn(
-  "w-full rounded-md border border-border bg-input text-sm text-foreground",
-  "placeholder:text-muted-foreground/70 transition-colors",
-  "focus-visible:outline-hidden focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/40",
-  "disabled:cursor-not-allowed disabled:opacity-50",
-  "aria-invalid:border-destructive aria-invalid:ring-destructive/30"
-);
-function DateField({ field, value, onChange, id, error, disabled }) {
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "date",
-      description: field.description,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: /* @__PURE__ */ jsx(
-        "input",
-        {
-          id: domId,
-          type: "date",
-          value: toDateInputValue(value),
-          disabled,
-          "aria-invalid": !!error,
-          onChange: (e) => onChange(toStoredDateValue(e.target.value, field.datetime)),
-          className: cn(fieldControlClass, "h-11 px-3 font-mono tabular-nums")
-        }
-      )
-    }
-  );
-}
-var IMAGE_EXT_RE = /\.(jpg|jpeg|png|gif|webp|bmp|svg|avif)(\?|$)/i;
-var PDF_EXT_RE = /\.pdf(\?|$)/i;
-var DATA_URL_MIME_RE = /^data:([^;,]+)/i;
-var isDirectlyViewable = isViewableUrl;
-function dataUrlMime(url) {
-  return DATA_URL_MIME_RE.exec(url)?.[1]?.toLowerCase();
-}
-function DocumentField(props) {
-  return /* @__PURE__ */ jsx(FileField, { ...props, category: "document" });
-}
-function ImageField(props) {
-  return /* @__PURE__ */ jsx(FileField, { ...props, category: "image" });
-}
-function FileField({
-  field,
-  value,
-  onDropFile,
-  onChange,
-  id,
-  uploading,
-  resolveUrl,
-  error,
-  disabled,
-  category
-}) {
-  const s = useFieldStrings();
-  const domId = useFieldDomId(id);
-  const [showUrl, setShowUrl] = useState(false);
-  const [previewOpen, setPreviewOpen] = useState(false);
-  const [localPreview, setLocalPreview] = useState(null);
-  const [resolved, setResolved] = useState(null);
-  const localUrlRef = useRef(null);
-  const setLocal = useCallback((next) => {
-    if (localUrlRef.current) URL.revokeObjectURL(localUrlRef.current);
-    localUrlRef.current = next?.objectUrl ?? null;
-    setLocalPreview(next);
-  }, []);
-  useEffect(() => () => setLocal(null), [setLocal]);
-  const [rejected, setRejected] = useState(null);
-  const handleFile = useCallback(
-    (file) => {
-      if (!isAcceptedFile(field.kind, file)) {
-        setRejected(file.name);
-        return;
-      }
-      setRejected(null);
-      setLocal({ objectUrl: URL.createObjectURL(file), type: file.type });
-      onDropFile(file);
-    },
-    [field.kind, setLocal, onDropFile]
-  );
-  const busy = disabled || uploading;
-  const { getRootProps, getInputProps, isDragActive } = useDropzone({
-    maxFiles: 1,
-    multiple: false,
-    disabled: busy,
-    // Filters the OS picker so a wrong file is hard to choose in the first
-    // place. It is NOT the enforcement: a drag-and-drop bypasses the picker
-    // entirely, and a browser reporting an empty `File.type` slips through
-    // react-dropzone's own matcher. `handleFile` is where the answer is
-    // decided; this is the affordance in front of it.
-    accept: acceptMapForKind(field.kind),
-    // The tab stop belongs on the INPUT, not on this div - see the root element
-    // below. Without this, react-dropzone puts `tabIndex: 0` and its own key
-    // handlers on a `role="presentation"` div, and the element a keyboard or
-    // voice-control user lands on is a generic with no role and no name.
-    noKeyboard: true,
-    onDrop: (files) => {
-      const file = files[0];
-      if (file) handleFile(file);
-    },
-    // react-dropzone rejects a file its own matcher refuses without ever calling
-    // `onDrop`, so without this a wrong drop is silently swallowed - the control
-    // simply does nothing, which reads as a broken dropzone rather than a
-    // refused file.
-    onDropRejected: (rejections) => {
-      const name = rejections[0]?.file.name;
-      if (name) setRejected(name);
-    }
-  });
-  const clear = useCallback(() => {
-    setLocal(null);
-    setResolved(null);
-    setPreviewOpen(false);
-    setRejected(null);
-    onChange(void 0);
-  }, [setLocal, onChange]);
-  const localIsCurrent = !!localPreview && (localPreview.boundUrl === void 0 || localPreview.boundUrl === value?.url);
-  useEffect(() => {
-    if (!localPreview) return;
-    if (localPreview.boundUrl === void 0) {
-      if (uploading || !value?.url) return;
-      setLocalPreview({ ...localPreview, boundUrl: value.url });
-      return;
-    }
-    if (value?.url !== localPreview.boundUrl) setLocal(null);
-  }, [localPreview, value?.url, uploading, setLocal]);
-  const hasFile = !!value?.url;
-  const localType = localIsCurrent ? localPreview?.type : void 0;
-  const filename = value?.filename ?? "";
-  const url = value?.url ?? "";
-  const urlMime = dataUrlMime(url);
-  const isImage = category === "image" || localType?.startsWith("image/") === true || urlMime?.startsWith("image/") === true || IMAGE_EXT_RE.test(filename) || IMAGE_EXT_RE.test(url);
-  const isPdf = localType === "application/pdf" || urlMime === "application/pdf" || PDF_EXT_RE.test(filename) || PDF_EXT_RE.test(url);
-  const canPreview = isImage || isPdf;
-  const storageUri = value?.url && !isDirectlyViewable(value.url) ? value.url : null;
-  useEffect(() => {
-    if (!previewOpen || !storageUri || localIsCurrent || !resolveUrl) return;
-    let cancelled = false;
-    void resolveUrl(storageUri).then((src) => {
-      if (!cancelled) setResolved(src ? { uri: storageUri, src } : null);
-    }).catch(() => {
-      if (!cancelled) setResolved(null);
-    });
-    return () => {
-      cancelled = true;
-    };
-  }, [previewOpen, storageUri, localIsCurrent, resolveUrl]);
-  const resolvedSrc = resolved && resolved.uri === storageUri ? resolved.src : void 0;
-  const previewSrc = (localIsCurrent ? localPreview?.objectUrl : void 0) ?? (isDirectlyViewable(value?.url) ? value.url : resolvedSrc);
-  return /* @__PURE__ */ jsxs(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category,
-      description: field.description,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: [
-        hasFile && !uploading ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ jsx(
-            FileChip,
-            {
-              value,
-              disabled,
-              onClear: clear,
-              canPreview,
-              previewOpen,
-              onTogglePreview: () => setPreviewOpen((v) => !v)
-            }
-          ),
-          previewOpen && (previewSrc && isImage ? /* @__PURE__ */ jsx(ImagePreview, { src: previewSrc, filename: value?.filename }) : previewSrc && isPdf ? /* @__PURE__ */ jsx(PdfPreview, { src: previewSrc }) : /* @__PURE__ */ jsx("div", { className: "flex h-24 items-center justify-center rounded-md border border-border bg-muted", children: /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin text-muted-foreground" }) }))
-        ] }) : (
-          // `role="presentation"` and no tab stop: this div is the drop TARGET and
-          // the visual affordance, and the control inside it is a real
-          // `<input type="file">`, which already has the right role and now has a
-          // name. Giving the div a `role="button"` of its own would put a second
-          // named control in the accessibility tree for one value. The focus ring
-          // is `focus-within` because the element that takes focus is clip-hidden.
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              ...getRootProps(),
-              className: cn(
-                "flex flex-col items-center justify-center gap-2 rounded-lg border border-dashed px-4 py-6 text-center",
-                "cursor-pointer select-none transition-colors",
-                "focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 focus-within:ring-offset-background",
-                isDragActive ? "border-primary/60 bg-primary/5" : "border-border bg-input hover:border-border hover:bg-muted",
-                busy && "cursor-not-allowed opacity-60"
-              ),
-              children: [
-                /* @__PURE__ */ jsx(
-                  "input",
-                  {
-                    ...getInputProps({ tabIndex: 0 }),
-                    id: domId,
-                    disabled: busy,
-                    "aria-invalid": !!error
-                  }
-                ),
-                uploading ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Loader2, { className: "h-5 w-5 animate-spin text-muted-foreground" }),
-                  /* @__PURE__ */ jsx("p", { className: "text-[12px] text-muted-foreground", children: s.uploading })
-                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Upload, { className: "h-5 w-5 text-muted-foreground", strokeWidth: 1.75 }),
-                  /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
-                    /* @__PURE__ */ jsx("p", { className: "text-[13px] text-foreground", children: isDragActive ? s.dropToUpload : s.dropOrBrowse }),
-                    field.accept && /* @__PURE__ */ jsx("p", { className: "font-mono text-[10.5px] text-muted-foreground", children: field.accept })
-                  ] })
-                ] })
-              ]
-            }
-          )
-        ),
-        rejected && !busy && /* @__PURE__ */ jsxs("p", { role: "alert", className: "text-[12px] text-destructive", children: [
-          /* @__PURE__ */ jsx("span", { className: "font-mono", children: rejected }),
-          " \u2014",
-          " ",
-          s.unsupportedFileType(field.accept ?? "")
-        ] }),
-        !showUrl ? /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            disabled: busy,
-            onClick: () => setShowUrl(true),
-            className: "flex w-fit items-center gap-1 font-mono text-[11px] text-muted-foreground transition-colors hover:text-foreground disabled:opacity-50",
-            children: [
-              /* @__PURE__ */ jsx(Link2, { className: "h-3 w-3" }),
-              s.pasteUrlInstead
-            ]
-          }
-        ) : /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "text",
-            autoFocus: true,
-            value: value?.url ?? "",
-            disabled: busy,
-            placeholder: s.urlPlaceholder,
-            onChange: (e) => {
-              setLocal(null);
-              onChange(e.target.value ? { url: e.target.value } : void 0);
-            },
-            className: cn(fieldControlClass, "h-9 px-3 font-mono text-[12px]")
-          }
-        )
-      ]
-    }
-  );
-}
-function ImagePreview({ src, filename }) {
-  const s = useFieldStrings();
-  const [broken, setBroken] = useState(false);
-  if (broken) {
-    return /* @__PURE__ */ jsx("div", { className: "flex h-28 items-center justify-center rounded-md border border-border bg-muted", children: /* @__PURE__ */ jsx(ImageOff, { className: "h-5 w-5 text-muted-foreground" }) });
-  }
-  return /* @__PURE__ */ jsx("div", { className: "flex max-h-[640px] justify-center overflow-auto rounded-md border border-border bg-muted", children: /* @__PURE__ */ jsx(
-    "img",
-    {
-      src,
-      alt: filename ?? s.preview,
-      className: "h-auto w-full max-w-full object-contain",
-      onError: () => setBroken(true)
-    }
-  ) });
-}
-function PdfPreview({ src }) {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsx(
-    "object",
-    {
-      data: `${src}#view=FitH`,
-      type: "application/pdf",
-      className: "h-[78vh] min-h-[520px] w-full rounded-md border border-border bg-muted",
-      children: /* @__PURE__ */ jsxs("div", { className: "flex h-28 flex-col items-center justify-center gap-1.5 text-center", children: [
-        /* @__PURE__ */ jsx(FileText, { className: "h-5 w-5 text-muted-foreground" }),
-        /* @__PURE__ */ jsx("p", { className: "text-[12px] text-muted-foreground", children: s.previewUnavailablePdf })
-      ] })
-    }
-  );
-}
-function FileChip({
-  value,
-  disabled,
-  onClear,
-  canPreview,
-  previewOpen,
-  onTogglePreview
-}) {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-md border border-border bg-input px-3 py-2.5", children: [
-    /* @__PURE__ */ jsx("span", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-muted", children: /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4 text-muted-foreground" }) }),
-    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsx("p", { className: "truncate text-[13px] font-medium text-foreground", children: value?.filename ?? s.uploadedFile }),
-      /* @__PURE__ */ jsx("p", { className: "truncate font-mono text-[10.5px] text-muted-foreground", children: value?.url })
-    ] }),
-    canPreview && /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: onTogglePreview,
-        className: "inline-flex h-7 shrink-0 items-center gap-1 rounded-md border border-border px-2 text-[11px] text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
-        children: [
-          previewOpen ? /* @__PURE__ */ jsx(EyeOff, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx(Eye, { className: "h-3.5 w-3.5" }),
-          s.preview
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(ClearButton, { disabled, onClick: onClear })
-  ] });
-}
-function ClearButton({ disabled, onClick }) {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      onClick,
-      disabled,
-      "aria-label": s.removeFileAria,
-      className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-50",
-      children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
-    }
-  );
-}
-var Select = SelectPrimitive.Root;
-var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
-  SelectPrimitive.Trigger,
-  {
-    ref,
-    className: cn(
-      // Adapted from the registry to DESIGN.md ("Inputs"): the `--input` surface,
-      // a hairline `--border`, and a border-color focus signal instead of the
-      // upstream 2px focus ring ("No focus glow by default").
-      "flex h-10 w-full items-center justify-between rounded-md border border-border bg-input px-3 py-2 text-sm transition-colors data-placeholder:text-muted-foreground focus:border-ring focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive [&>span]:line-clamp-1",
-      className
-    ),
-    ...props,
-    children: [
-      children,
-      /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 opacity-50" }) })
-    ]
-  }
-));
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SelectPrimitive.ScrollUpButton,
-  {
-    ref,
-    className: cn("flex cursor-default items-center justify-center py-1", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4" })
-  }
-));
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SelectPrimitive.ScrollDownButton,
-  {
-    ref,
-    className: cn("flex cursor-default items-center justify-center py-1", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
-  }
-));
-SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React2.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
-  SelectPrimitive.Content,
-  {
-    ref,
-    className: cn(
-      "relative z-50 max-h-(--radix-select-content-available-height) min-w-32 overflow-y-auto overflow-x-hidden rounded-md border border-border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-select-content-transform-origin)",
-      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-      className
-    ),
-    position,
-    ...props,
-    children: [
-      /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
-      /* @__PURE__ */ jsx(
-        SelectPrimitive.Viewport,
-        {
-          className: cn(
-            "p-1",
-            position === "popper" && "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)"
-          ),
-          children
-        }
-      ),
-      /* @__PURE__ */ jsx(SelectScrollDownButton, {})
-    ]
-  }
-) }));
-SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SelectPrimitive.Label,
-  {
-    ref,
-    className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
-    ...props
-  }
-));
-SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
-  SelectPrimitive.Item,
-  {
-    ref,
-    className: cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
-      className
-    ),
-    ...props,
-    children: [
-      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
-    ]
-  }
-));
-SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SelectPrimitive.Separator,
-  {
-    ref,
-    className: cn("-mx-1 my-1 h-px bg-muted", className),
-    ...props
-  }
-));
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
-var toggleVariants = cva(
-  "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        outline: "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground"
-      },
-      size: {
-        default: "h-10 px-3 min-w-10",
-        sm: "h-9 px-2.5 min-w-9",
-        lg: "h-11 px-5 min-w-11"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-var Toggle = React2.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx(
-  TogglePrimitive.Root,
-  {
-    ref,
-    className: cn(toggleVariants({ variant, size, className })),
-    ...props
-  }
-));
-Toggle.displayName = TogglePrimitive.Root.displayName;
-var ToggleGroupContext = React2.createContext({
-  size: "default",
-  variant: "default"
-});
-var ToggleGroup = React2.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  ToggleGroupPrimitive.Root,
-  {
-    ref,
-    className: cn("flex items-center justify-center gap-1", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: { variant, size }, children })
-  }
-));
-ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React2.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React2.useContext(ToggleGroupContext);
-  return /* @__PURE__ */ jsx(
-    ToggleGroupPrimitive.Item,
-    {
-      ref,
-      className: cn(
-        toggleVariants({
-          variant: context.variant || variant,
-          size: context.size || size
-        }),
-        className
-      ),
-      ...props,
-      children
-    }
-  );
-});
-ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
-var CLEAR_VALUE = "__none__";
-function EnumField({ field, value, onChange, id, error, disabled }) {
-  const s = useFieldStrings();
-  const isSegmented = field.options.length <= 4 && field.options.every((o) => o.length <= 16);
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "choice",
-      description: field.description,
-      required: field.required,
-      error,
-      htmlFor: isSegmented ? void 0 : domId,
-      children: isSegmented ? (
-        // `type="single"` gives the roving tabindex and arrow-key navigation a
-        // radiogroup owes its user, and emits `''` when the active item is
-        // pressed again - which is the field's "clear" path.
-        /* @__PURE__ */ jsx(
-          ToggleGroup,
-          {
-            type: "single",
-            value: value ?? "",
-            onValueChange: (next) => onChange(next === "" ? void 0 : next),
-            disabled,
-            "aria-label": field.title ?? field.name,
-            className: "flex flex-wrap justify-start gap-1.5",
-            children: field.options.map((option) => /* @__PURE__ */ jsxs(
-              ToggleGroupItem,
-              {
-                value: option,
-                variant: "outline",
-                className: "h-9 min-w-0 gap-1.5 border-border bg-input px-3 text-[13px] text-muted-foreground hover:bg-muted hover:text-foreground data-[state=on]:border-primary/40 data-[state=on]:bg-primary/10 data-[state=on]:font-medium data-[state=on]:text-foreground",
-                children: [
-                  value === option && /* @__PURE__ */ jsx(Check, { className: "size-3.5 text-primary", strokeWidth: 2.5, "aria-hidden": "true" }),
-                  option
-                ]
-              },
-              option
-            ))
-          }
-        )
-      ) : /* @__PURE__ */ jsxs(
-        Select,
-        {
-          value: value ?? "",
-          disabled,
-          onValueChange: (next) => onChange(next === CLEAR_VALUE ? void 0 : next),
-          children: [
-            /* @__PURE__ */ jsx(SelectTrigger, { id: domId, "aria-invalid": !!error, className: "h-11", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: s.selectPlaceholder }) }),
-            /* @__PURE__ */ jsxs(SelectContent, { children: [
-              /* @__PURE__ */ jsx(SelectItem, { value: CLEAR_VALUE, children: s.selectPlaceholder }),
-              field.options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option, children: option }, option))
-            ] })
-          ]
-        }
-      )
-    }
-  );
-}
-function NumberField({ field, value, onChange, id, error, disabled }) {
-  const s = useFieldStrings();
-  const domId = useFieldDomId(id);
-  const step = field.integer ? 1 : 0.1;
-  const clamp = (n) => {
-    let next = n;
-    if (typeof field.min === "number") next = Math.max(field.min, next);
-    if (typeof field.max === "number") next = Math.min(field.max, next);
-    return field.integer ? Math.round(next) : next;
-  };
-  const nudge = (delta) => onChange(clamp((value ?? 0) + delta));
-  const rangeHint = field.min !== void 0 || field.max !== void 0 ? `${field.min ?? "\u2212\u221E"} \u2013 ${field.max ?? "\u221E"}` : void 0;
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "number",
-      description: field.description ?? rangeHint,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: /* @__PURE__ */ jsxs("div", { className: "flex items-stretch gap-1.5", children: [
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            id: domId,
-            type: "number",
-            inputMode: field.integer ? "numeric" : "decimal",
-            value: value ?? "",
-            step,
-            min: field.min,
-            max: field.max,
-            disabled,
-            "aria-invalid": !!error,
-            placeholder: "0",
-            onChange: (e) => onChange(e.target.value === "" ? void 0 : Number(e.target.value)),
-            className: cn(
-              fieldControlClass,
-              "h-11 px-3 font-mono tabular-nums [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none"
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx(StepButton, { onClick: () => nudge(-step), disabled, label: s.decrease, children: /* @__PURE__ */ jsx(Minus, { className: "h-4 w-4" }) }),
-        /* @__PURE__ */ jsx(StepButton, { onClick: () => nudge(step), disabled, label: s.increase, children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }) })
-      ] })
-    }
-  );
-}
-function StepButton({
-  onClick,
-  disabled,
-  label,
-  children
-}) {
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      onClick,
-      disabled,
-      "aria-label": label,
-      className: cn(
-        "flex h-11 w-11 shrink-0 items-center justify-center rounded-md border border-border bg-input text-muted-foreground transition-colors",
-        "hover:border-border hover:bg-muted hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50"
-      ),
-      children
-    }
-  );
-}
-function TextField({ field, value, onChange, id, error, disabled }) {
-  const s = useFieldStrings();
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "text",
-      description: field.description,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: /* @__PURE__ */ jsx(
-        "input",
-        {
-          id: domId,
-          type: "text",
-          value: value ?? "",
-          disabled,
-          "aria-invalid": !!error,
-          placeholder: field.placeholder ?? s.typeValuePlaceholder,
-          onChange: (e) => onChange(e.target.value === "" ? void 0 : e.target.value),
-          className: cn(fieldControlClass, "h-11 px-3")
-        }
-      )
-    }
-  );
-}
-function ProseField({ field, value, onChange, id, error, disabled }) {
-  const s = useFieldStrings();
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "text",
-      description: field.description,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: /* @__PURE__ */ jsx(
-        "textarea",
-        {
-          id: domId,
-          value: value ?? "",
-          disabled,
-          "aria-invalid": !!error,
-          rows: 3,
-          placeholder: field.placeholder ?? s.writeHerePlaceholder,
-          onChange: (e) => onChange(e.target.value === "" ? void 0 : e.target.value),
-          className: cn(
-            fieldControlClass,
-            "min-h-[88px] resize-y px-3 py-2.5 leading-relaxed field-sizing-content"
-          )
-        }
-      )
-    }
-  );
-}
-function OptionalToggle({ count, expanded, onToggle, noun = "field" }) {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      onClick: onToggle,
-      className: "flex w-fit items-center gap-1.5 text-[11px] text-muted-foreground transition-colors hover:text-foreground",
-      children: [
-        expanded ? /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(Plus, { className: "h-3 w-3" }),
-        expanded ? noun === "field" ? s.hideOptionalFields : s.hideOptionalInputs : noun === "field" ? s.optionalFieldsCount(count) : s.optionalInputsCount(count)
-      ]
-    }
-  );
-}
-function ObjectField({ field, value, onChange, id, error, env }) {
-  const s = useFieldStrings();
-  const [showOptional, setShowOptional] = useState(false);
-  const presentation = useFieldPresentation();
-  const isApp = presentation === "app";
-  const data = value ?? {};
-  const setChild = (name, childValue) => onChange({ ...data, [name]: childValue });
-  const optionalEmpty = field.fields.filter((f) => !f.required && !isFilled(ownProp(data, f.name)));
-  const visible = showOptional ? field.fields : field.fields.filter((f) => f.required || isFilled(ownProp(data, f.name)));
-  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: cn(
-            "text-[13px] font-medium leading-none text-foreground",
-            isApp ? "text-[13.5px]" : "font-mono"
-          ),
-          children: fieldLabel(field.title, field.name, presentation)
-        }
-      ),
-      !isApp && /* @__PURE__ */ jsx(ConceptPill, { conceptRef: field.conceptRef, category: "structured" }),
-      !field.required && /* @__PURE__ */ jsx("span", { className: "ml-auto font-mono text-[10px] uppercase tracking-wider text-muted-foreground", children: s.optionalBadge })
-    ] }),
-    field.description && /* @__PURE__ */ jsx("p", { className: "text-[12px] leading-relaxed text-muted-foreground", children: field.description }),
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "space-y-4 rounded-lg border bg-card/40 p-4",
-          error ? "border-destructive/50" : "border-border"
-        ),
-        children: [
-          visible.map((child) => /* @__PURE__ */ jsx(
-            FieldRenderer,
-            {
-              field: child,
-              value: ownProp(data, child.name),
-              onChange: (v) => setChild(child.name, v),
-              id: `${id}.${child.name}`,
-              env
-            },
-            child.name
-          )),
-          optionalEmpty.length > 0 && /* @__PURE__ */ jsx(
-            OptionalToggle,
-            {
-              count: optionalEmpty.length,
-              expanded: showOptional,
-              onToggle: () => setShowOptional((v) => !v),
-              noun: "field"
-            }
-          )
-        ]
-      }
-    ),
-    error && /* @__PURE__ */ jsx("p", { className: "text-[11px] text-destructive", role: "alert", children: error })
-  ] });
-}
-function ListField({ field, value, onChange, id, error, env }) {
-  const s = useFieldStrings();
-  const presentation = useFieldPresentation();
-  const isApp = presentation === "app";
-  const items = value ?? [];
-  const [rowKeys, setRowKeys] = useRowKeys(items.length);
-  const setItem = (index, itemValue) => {
-    const next = items.slice();
-    next[index] = itemValue;
-    onChange(next);
-  };
-  const removeItem = (index) => {
-    setRowKeys((prev) => prev.filter((_, i) => i !== index));
-    onChange(items.filter((_, i) => i !== index));
-  };
-  const addItem = () => onChange([...items, emptyValue(field.item)]);
-  const busy = listIsBusy(id, env?.uploadingIds);
-  const isFull = field.maxItemCount !== void 0 && items.length >= field.maxItemCount;
-  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: cn(
-            "text-[13px] font-medium leading-none text-foreground",
-            isApp ? "text-[13.5px]" : "font-mono"
-          ),
-          children: fieldLabel(field.title, field.name, presentation)
-        }
-      ),
-      !isApp && /* @__PURE__ */ jsx(ConceptPill, { conceptRef: field.conceptRef, category: "list" }),
-      /* @__PURE__ */ jsx("span", { className: "font-mono text-[10.5px] text-muted-foreground", children: field.itemCount !== void 0 && field.maxItemCount === field.itemCount ? s.itemsCountOf(items.length, field.itemCount) : s.itemsCount(items.length) }),
-      !field.required && /* @__PURE__ */ jsx("span", { className: "ml-auto font-mono text-[10px] uppercase tracking-wider text-muted-foreground", children: s.optionalBadge })
-    ] }),
-    field.description && /* @__PURE__ */ jsx("p", { className: "text-[12px] leading-relaxed text-muted-foreground", children: field.description }),
-    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-      items.length === 0 && /* @__PURE__ */ jsx("p", { className: "rounded-md border border-dashed border-border bg-input/50 px-3 py-4 text-center text-[12px] text-muted-foreground", children: s.noItemsYet }),
-      items.map((item, index) => /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "flex items-start gap-2 rounded-md border border-border bg-card/40 p-3",
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "mt-1 w-5 shrink-0 text-center font-mono text-[11px] text-muted-foreground", children: index + 1 }),
-            /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx(
-              FieldRenderer,
-              {
-                field: { ...field.item, title: "", name: `${field.name}[${index}]` },
-                value: item,
-                onChange: (v) => setItem(index, v),
-                id: `${id}.${index}`,
-                env
-              }
-            ) }),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => removeItem(index),
-                disabled: env?.disabled || busy,
-                "aria-label": s.removeItemAria(index + 1),
-                className: "mt-0.5 flex h-7 w-7 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-destructive disabled:opacity-50",
-                children: /* @__PURE__ */ jsx(Trash2, { className: "h-3.5 w-3.5" })
-              }
-            )
-          ]
-        },
-        rowKeys[index] ?? index
-      )),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: addItem,
-          disabled: env?.disabled || isFull,
-          className: cn(
-            "inline-flex h-9 w-full items-center justify-center gap-1.5 rounded-md border border-dashed border-border text-[13px] text-muted-foreground transition-colors",
-            "hover:border-primary/40 hover:bg-muted hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50"
-          ),
-          children: [
-            /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }),
-            s.addItem
-          ]
-        }
-      )
-    ] }),
-    error && /* @__PURE__ */ jsx("p", { className: "text-[11px] text-destructive", role: "alert", children: error })
-  ] });
-}
-function listIsBusy(id, uploadingIds) {
-  if (!uploadingIds?.size) return false;
-  const prefix = `${id}.`;
-  for (const uploading of uploadingIds) if (uploading.startsWith(prefix)) return true;
-  return false;
-}
-function useRowKeys(length) {
-  const [state, setState] = useState(() => ({
-    keys: Array.from({ length }, (_, i) => i),
-    next: length
-  }));
-  if (state.keys.length !== length) {
-    setState((prev) => {
-      if (length <= prev.keys.length) return { keys: prev.keys.slice(0, length), next: prev.next };
-      const added = length - prev.keys.length;
-      return {
-        keys: [...prev.keys, ...Array.from({ length: added }, (_, i) => prev.next + i)],
-        next: prev.next + added
-      };
-    });
-  }
-  const update = (fn) => setState((prev) => ({ keys: fn(prev.keys), next: prev.next }));
-  return [state.keys, update];
-}
-function emptyValue(field) {
-  switch (field.kind) {
-    case "boolean":
-      return false;
-    case "object":
-      return {};
-    case "list":
-      return [];
-    case "document":
-    case "image":
-      return void 0;
-    default:
-      return void 0;
-  }
-}
-function UnknownField({ field, value, onChange, id, error, disabled }) {
-  const s = useFieldStrings();
-  const domId = useFieldDomId(id);
-  return /* @__PURE__ */ jsx(
-    FieldShell,
-    {
-      name: field.name,
-      title: field.title,
-      conceptRef: field.conceptRef,
-      category: "structured",
-      description: field.description ?? s.jsonHint,
-      required: field.required,
-      error,
-      htmlFor: domId,
-      children: /* @__PURE__ */ jsx(
-        "textarea",
-        {
-          id: domId,
-          value: value ?? "",
-          disabled,
-          "aria-invalid": !!error,
-          rows: 3,
-          spellCheck: false,
-          placeholder: '{\n  "key": "value"\n}',
-          onChange: (e) => onChange(e.target.value === "" ? void 0 : e.target.value),
-          className: cn(fieldControlClass, "min-h-[80px] resize-y px-3 py-2.5 font-mono text-[12px]")
-        }
-      )
-    }
-  );
-}
-function FieldRenderer({ field, value, onChange, id, error, env }) {
-  const disabled = env?.disabled;
-  switch (field.kind) {
-    case "text":
-      return /* @__PURE__ */ jsx(
-        TextField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "prose":
-      return /* @__PURE__ */ jsx(
-        ProseField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "date":
-      return /* @__PURE__ */ jsx(
-        DateField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "number":
-      return /* @__PURE__ */ jsx(
-        NumberField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "boolean":
-      return /* @__PURE__ */ jsx(
-        BooleanField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          disabled
-        }
-      );
-    case "enum":
-      return /* @__PURE__ */ jsx(
-        EnumField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "document":
-      return /* @__PURE__ */ jsx(
-        DocumentField,
-        {
-          field,
-          value,
-          onChange,
-          onDropFile: (file) => env?.onDropFile?.(id, file),
-          uploading: env?.uploadingIds?.has(id),
-          resolveUrl: env?.resolveUrl,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "image":
-      return /* @__PURE__ */ jsx(
-        ImageField,
-        {
-          field,
-          value,
-          onChange,
-          onDropFile: (file) => env?.onDropFile?.(id, file),
-          uploading: env?.uploadingIds?.has(id),
-          resolveUrl: env?.resolveUrl,
-          id,
-          error,
-          disabled
-        }
-      );
-    case "object":
-      return /* @__PURE__ */ jsx(
-        ObjectField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          env
-        }
-      );
-    case "list":
-      return /* @__PURE__ */ jsx(
-        ListField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          env
-        }
-      );
-    default:
-      return /* @__PURE__ */ jsx(
-        UnknownField,
-        {
-          field,
-          value,
-          onChange,
-          id,
-          error,
-          disabled
-        }
-      );
-  }
-}
-var ResultEnvContext = createContext({});
-function ResultEnvProvider({
-  resolveUrl,
-  resolveShareUrl,
-  children
-}) {
-  const env = useMemo(() => ({ resolveUrl, resolveShareUrl }), [resolveUrl, resolveShareUrl]);
-  return /* @__PURE__ */ jsx(ResultEnvContext, { value: env, children });
-}
-function useResolvedUrl(url) {
-  return use(ResultEnvContext).resolveUrl?.(url) ?? url;
-}
-function useResolveUrl() {
-  return use(ResultEnvContext).resolveUrl;
-}
-function useResolveShareUrl() {
-  return use(ResultEnvContext).resolveShareUrl;
-}
-var TooltipProvider = TooltipPrimitive.Provider;
-var TooltipRoot = TooltipPrimitive.Root;
-var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React2.forwardRef(({ className, sideOffset = 6, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
-  TooltipPrimitive.Content,
-  {
-    ref,
-    sideOffset,
-    className: cn(
-      "z-50 max-w-xs rounded-md border border-border bg-popover px-2.5 py-1.5 text-[12px] leading-relaxed text-popover-foreground shadow-md",
-      "animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
-      "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
-    ),
-    ...props
-  }
-) }));
-TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-var DEFAULT_IMG_SRC = "data: https:";
-function frameStyles(color, mutedColor, borderColor, font) {
-  return `
-    :root { color-scheme: inherit; }
-    body {
-      margin: 0;
-      color: ${color};
-      font-family: ${font};
-      font-size: 13px;
-      line-height: 1.55;
-      background: transparent;
-      overflow-wrap: anywhere;
-    }
-    :where(h1, h2, h3, h4, h5, h6) { margin: 0 0 0.4em; line-height: 1.25; }
-    :where(h1) { font-size: 1.4em; }
-    :where(h2) { font-size: 1.2em; }
-    :where(h3) { font-size: 1.05em; }
-    :where(p, ul, ol, table, pre, blockquote) { margin: 0 0 0.75em; }
-    :where(ul, ol) { padding-inline-start: 1.25em; }
-    :where(table) { border-collapse: collapse; width: 100%; }
-    :where(th, td) {
-      border: 1px solid ${borderColor};
-      padding: 4px 8px;
-      text-align: left;
-      vertical-align: top;
-    }
-    :where(th) { font-weight: 600; }
-    :where(caption) { caption-side: top; color: ${mutedColor}; padding-bottom: 4px; text-align: left; }
-    :where(a) { color: inherit; }
-    :where(code, pre) { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.92em; }
-    :where(pre) { white-space: pre-wrap; }
-    :where(blockquote) { border-inline-start: 2px solid ${borderColor}; margin-inline-start: 0; padding-inline-start: 0.75em; color: ${mutedColor}; }
-    :where(img) { max-width: 100%; height: auto; }
-    :where(hr) { border: 0; border-top: 1px solid ${borderColor}; }
-    :where(*:last-child) { margin-bottom: 0; }
-  `;
-}
-function frameDocument(content, styles, imgSrc) {
-  const body = content.cssClass ? (
-    // The class the value states, honoured the way the runtime's own HTML
-    // rendering honours it: as a wrapper, not as something merged into ours.
-    `<div class="${escapeAttribute(content.cssClass)}">${content.innerHtml}</div>`
-  ) : content.innerHtml;
-  return [
-    '<!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}; base-uri 'none'; form-action 'none'">`,
-    `<style>${styles}</style></head><body>${body}</body></html>`
-  ].join("");
-}
-function escapeAttribute(value) {
-  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
-}
-var useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
-function HtmlPreview({
-  content,
-  maxHeight = 1400,
-  imgSrc = DEFAULT_IMG_SRC
-}) {
-  const hostRef = useRef(null);
-  const frameRef = useRef(null);
-  const [doc, setDoc] = useState(null);
-  const [height, setHeight] = useState(0);
-  useIsomorphicLayoutEffect(() => {
-    const host = hostRef.current;
-    if (!host) return;
-    const computed = getComputedStyle(host);
-    setDoc(
-      frameDocument(
-        content,
-        frameStyles(
-          computed.color,
-          computed.getPropertyValue("--muted-foreground").trim() || computed.color,
-          computed.borderColor || computed.color,
-          computed.fontFamily
-        ),
-        imgSrc
-      )
-    );
-  }, [content, imgSrc]);
-  const measure = () => {
-    const body = frameRef.current?.contentDocument?.body;
-    if (body) setHeight(body.scrollHeight);
-  };
-  useEffect(() => {
-    if (!doc || !hostRef.current || typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(measure);
-    observer.observe(hostRef.current);
-    return () => observer.disconnect();
-  }, [doc]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: hostRef,
-      className: "overflow-hidden rounded-lg border border-border bg-card/40 px-3.5 py-3 text-[13px] text-foreground",
-      children: doc === null ? null : /* @__PURE__ */ jsx(
-        "iframe",
-        {
-          ref: frameRef,
-          title: content.cssClass ? `HTML result (${content.cssClass})` : "HTML result",
-          srcDoc: doc,
-          onLoad: measure,
-          sandbox: "allow-same-origin",
-          style: {
-            display: "block",
-            width: "100%",
-            border: 0,
-            height: height === 0 ? void 0 : Math.min(height, maxHeight),
-            maxHeight
-          }
-        }
-      )
-    }
-  );
-}
-var LEX_OPTIONS = { gfm: true, breaks: true };
-function Markdown({ text, className }) {
-  const tokens = React2.useMemo(() => marked.lexer(text, LEX_OPTIONS), [text]);
-  return /* @__PURE__ */ jsx("div", { className: cn("space-y-2 text-[13px] leading-relaxed text-foreground", className), children: /* @__PURE__ */ jsx(Blocks, { tokens }) });
-}
-var HEADING_CLASS = {
-  1: "text-[16px] font-semibold",
-  2: "text-[14.5px] font-semibold",
-  3: "text-[13.5px] font-semibold",
-  4: "text-[13px] font-semibold",
-  5: "text-[13px] font-semibold",
-  6: "text-[13px] font-semibold"
-};
-function Blocks({ tokens }) {
-  return /* @__PURE__ */ jsx(Fragment, { children: tokens.map((token, index) => /* @__PURE__ */ jsx(Block, { token }, index)) });
-}
-function Block({ token }) {
-  switch (token.type) {
-    case "space":
-      return null;
-    case "heading": {
-      const heading = token;
-      const level = Math.min(Math.max(heading.depth, 1), 6);
-      const Tag = `h${level}`;
-      return /* @__PURE__ */ jsx(Tag, { className: cn("mt-3 first:mt-0", HEADING_CLASS[level]), children: /* @__PURE__ */ jsx(Inline, { tokens: heading.tokens }) });
-    }
-    case "paragraph":
-      return /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(Inline, { tokens: token.tokens }) });
-    // A `text` token in BLOCK position, which is what a tight list's items are
-    // made of: the lexer wraps a loose item's content in a paragraph and a
-    // tight one's in a bare `text`. Without this arm it fell through to the raw
-    // fallback below and a bulleted `**Type:** …` rendered with its asterisks
-    // showing - typeset everywhere except inside a list, which is where model
-    // output puts most of its emphasis.
-    case "text":
-      return /* @__PURE__ */ jsx(Inline, { tokens: token.tokens ?? [token] });
-    case "list": {
-      const list = token;
-      const Tag = list.ordered ? "ol" : "ul";
-      return /* @__PURE__ */ jsx(
-        Tag,
-        {
-          className: cn("space-y-1 ps-5", list.ordered ? "list-decimal" : "list-disc"),
-          ...list.ordered && list.start !== 1 ? { start: Number(list.start) } : {},
-          children: list.items.map((item, index) => /* @__PURE__ */ jsxs("li", { className: "marker:text-muted-foreground", children: [
-            item.task ? /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "checkbox",
-                checked: item.checked ?? false,
-                disabled: true,
-                readOnly: true,
-                className: "me-1.5 align-middle"
-              }
-            ) : null,
-            /* @__PURE__ */ jsx(Blocks, { tokens: item.tokens })
-          ] }, index))
-        }
-      );
-    }
-    case "code": {
-      const code = token;
-      return (
-        // WRAPPED, not scrolled. A code block in a side panel is usually not
-        // code at all: it is a model that opened a fence and did not close it,
-        // or closed one it never opened, and the rest of a report ends up
-        // inside it. Scrolling that sideways hides the text behind a scrollbar
-        // for no gain — the lines are prose, and prose wraps. Real code loses
-        // its column alignment and keeps every character, which is the better
-        // half of that trade at this width.
-        /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap wrap-break-word rounded-md border border-border bg-card/40 p-2.5 text-[12px]", children: /* @__PURE__ */ jsx("code", { children: code.text }) })
-      );
-    }
-    case "blockquote":
-      return /* @__PURE__ */ jsx("blockquote", { className: "border-s-2 border-border ps-3 text-muted-foreground", children: /* @__PURE__ */ jsx(Blocks, { tokens: token.tokens }) });
-    case "hr":
-      return /* @__PURE__ */ jsx("hr", { className: "border-border" });
-    case "table": {
-      const table = token;
-      return (
-        // The same overflow rule the result tables follow: a wide table scrolls
-        // inside its own box rather than widening the panel around it.
-        /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-lg border border-border", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full border-collapse text-[12.5px]", children: [
-          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { className: "border-b border-border bg-card/40", children: table.header.map((cell, index) => /* @__PURE__ */ jsx(
-            "th",
-            {
-              scope: "col",
-              className: "px-2.5 py-1.5 text-start font-semibold",
-              style: alignOf(table.align[index]),
-              children: /* @__PURE__ */ jsx(Inline, { tokens: cell.tokens })
-            },
-            index
-          )) }) }),
-          /* @__PURE__ */ jsx("tbody", { children: table.rows.map((row, rowIndex) => /* @__PURE__ */ jsx("tr", { className: "border-b border-border/60 last:border-b-0", children: row.map((cell, cellIndex) => /* @__PURE__ */ jsx(
-            "td",
-            {
-              className: "px-2.5 py-1.5 align-top",
-              style: alignOf(table.align[cellIndex]),
-              children: /* @__PURE__ */ jsx(Inline, { tokens: cell.tokens })
-            },
-            cellIndex
-          )) }, rowIndex)) })
-        ] }) })
-      );
-    }
-    // `html` and anything this version of the lexer grows that we have no arm
-    // for: shown as its own source text. Rendering markup we have decided not to
-    // execute as the characters it is made of is the honest fallback - it never
-    // silently drops content, and it never injects any.
-    default:
-      return /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap", children: rawOf(token) });
-  }
-}
-function Inline({ tokens }) {
-  if (!tokens) return null;
-  return /* @__PURE__ */ jsx(Fragment, { children: tokens.map((token, index) => /* @__PURE__ */ jsx(InlineToken, { token }, index)) });
-}
-function InlineToken({ token }) {
-  switch (token.type) {
-    case "text": {
-      const text = token;
-      return text.tokens ? /* @__PURE__ */ jsx(Inline, { tokens: text.tokens }) : /* @__PURE__ */ jsx(Fragment, { children: decode(text.text) });
-    }
-    case "escape":
-      return /* @__PURE__ */ jsx(Fragment, { children: token.text });
-    case "strong":
-      return /* @__PURE__ */ jsx("strong", { className: "font-semibold", children: /* @__PURE__ */ jsx(Inline, { tokens: token.tokens }) });
-    case "em":
-      return /* @__PURE__ */ jsx("em", { className: "italic", children: /* @__PURE__ */ jsx(Inline, { tokens: token.tokens }) });
-    case "del":
-      return /* @__PURE__ */ jsx("del", { className: "line-through", children: /* @__PURE__ */ jsx(Inline, { tokens: token.tokens }) });
-    case "codespan":
-      return /* @__PURE__ */ jsx("code", { className: "rounded border border-border bg-card/40 px-1 py-0.5 text-[0.92em]", children: decode(token.text) });
-    case "br":
-      return /* @__PURE__ */ jsx("br", {});
-    case "link": {
-      const link = token;
-      const href = safeHref(link.href);
-      if (!href) return /* @__PURE__ */ jsx(Inline, { tokens: link.tokens });
-      return /* @__PURE__ */ jsx(
-        "a",
-        {
-          href,
-          target: "_blank",
-          rel: "noreferrer noopener",
-          className: "underline underline-offset-2",
-          children: /* @__PURE__ */ jsx(Inline, { tokens: link.tokens })
-        }
-      );
-    }
-    case "image": {
-      const image = token;
-      const src = safeHref(image.href);
-      if (!src) return /* @__PURE__ */ jsx(Fragment, { children: image.text });
-      return /* @__PURE__ */ jsx("img", { src, alt: image.text, className: "max-w-full rounded-md" });
-    }
-    default:
-      return /* @__PURE__ */ jsx(Fragment, { children: rawOf(token) });
-  }
-}
-function safeHref(href) {
-  const trimmed = href.trim();
-  if (/^(https?:|mailto:)/i.test(trimmed)) return trimmed;
-  if (/^[#/]/.test(trimmed)) return trimmed;
-  return void 0;
-}
-function alignOf(align) {
-  return align ? { textAlign: align } : void 0;
-}
-function rawOf(token) {
-  return "raw" in token && typeof token.raw === "string" ? token.raw : "";
-}
-var ENTITIES = {
-  "&amp;": "&",
-  "&lt;": "<",
-  "&gt;": ">",
-  "&quot;": '"',
-  "&#39;": "'",
-  "&#x27;": "'"
-};
-function decode(text) {
-  return text.replace(/&(?:amp|lt|gt|quot|#39|#x27);/g, (entity) => ENTITIES[entity] ?? entity);
-}
-function unwrap(field, value) {
-  if (!field.contentKey) return value;
-  if (typeof value !== "object" || value === null || Array.isArray(value)) return value;
-  const unwrapped = ownProp(value, field.contentKey);
-  return unwrapped === void 0 ? value : unwrapped;
-}
-function Described({ description, children }) {
-  if (!description) return /* @__PURE__ */ jsx(Fragment, { children });
-  return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs(TooltipRoot, { children: [
-    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-      "span",
-      {
-        tabIndex: 0,
-        className: "-mx-1 cursor-help rounded px-1 outline-hidden transition-colors hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring",
-        children
-      }
-    ) }),
-    /* @__PURE__ */ jsx(TooltipContent, { children: description })
-  ] }) });
-}
-function ResultHeader({ field }) {
-  return /* @__PURE__ */ jsx(Label2, { field, describe: true });
-}
-function Label2({ field, describe = false }) {
-  const presentation = useFieldPresentation();
-  const isApp = presentation === "app";
-  const labelText = fieldLabel(field.title, field.name, presentation);
-  if (labelText.trim() === "") {
-    return /* @__PURE__ */ jsx(ConceptPill, { conceptRef: field.conceptRef, category: conceptCategory(field) });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2", children: [
-    /* @__PURE__ */ jsx(Described, { description: describe ? field.description : void 0, children: /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn(
-          "text-[13px] font-semibold text-foreground",
-          isApp ? "text-[13.5px]" : "font-mono"
-        ),
-        children: labelText
-      }
-    ) }),
-    !isApp && /* @__PURE__ */ jsx(ConceptPill, { conceptRef: field.conceptRef, category: conceptCategory(field) })
-  ] });
-}
-function Absent() {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsxs("span", { className: "text-[13px] text-muted-foreground", children: [
-    /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: s.resultAbsent }),
-    /* @__PURE__ */ jsx("span", { className: "sr-only", children: s.resultAbsentDescription })
-  ] });
-}
-function stringifyValue(value) {
-  try {
-    const text = JSON.stringify(
-      value,
-      (_key, member) => typeof member === "bigint" ? member.toString() : member
-    );
-    if (text === void 0 || text === "{}" || text === "[]") return void 0;
-    return JSON.stringify(JSON.parse(text), null, 2);
-  } catch {
-    const keys = Array.isArray(value) ? [] : Object.keys(value);
-    return keys.length > 0 ? `{ ${keys.join(", ")} }` : void 0;
-  }
-}
-function RawValue({ value, compact }) {
-  const text = stringifyValue(value);
-  if (text === void 0) return /* @__PURE__ */ jsx(Absent, {});
-  return compact ? /* @__PURE__ */ jsx("span", { title: text, className: "truncate font-mono text-[12px] text-foreground", children: text }) : /* @__PURE__ */ jsx("pre", { className: "overflow-x-auto whitespace-pre-wrap wrap-break-word rounded-md border border-border bg-card/40 px-2.5 py-1.5 font-mono text-[12px] leading-relaxed text-foreground", children: text });
-}
-function Scalar({ value, compact = false }) {
-  if (value === null || value === void 0 || value === "") return /* @__PURE__ */ jsx(Absent, {});
-  if (typeof value === "object") return /* @__PURE__ */ jsx(RawValue, { value, compact });
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn(
-        "text-[13px] leading-relaxed text-foreground",
-        compact ? "whitespace-nowrap" : "whitespace-pre-wrap"
-      ),
-      children: String(value)
-    }
-  );
-}
-function Bool({ value, compact = false }) {
-  const s = useFieldStrings();
-  if (value === null || value === void 0 || value === "") return /* @__PURE__ */ jsx(Absent, {});
-  if (typeof value !== "boolean") return /* @__PURE__ */ jsx(Scalar, { value, compact });
-  return /* @__PURE__ */ jsx("span", { className: "text-[13px] text-foreground", children: value ? s.yes : s.no });
-}
-function DateValue({ value }) {
-  const content = readDateContent(value);
-  if (!content) return /* @__PURE__ */ jsx(Absent, {});
-  return /* @__PURE__ */ jsx("span", { className: "text-[13px] text-foreground", children: formatDateContent(content) });
-}
-function fileLabel(url, filename) {
-  if (filename) return filename;
-  const path = url.split(/[?#]/)[0] ?? url;
-  const segment = path.split("/").filter(Boolean).pop();
-  return segment && segment.length > 0 ? segment : url;
-}
-function CopyButton({
-  value,
-  provide,
-  label,
-  title
-}) {
-  const [copied, setCopied] = useState(false);
-  if (typeof navigator === "undefined" || !navigator.clipboard) return null;
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      onClick: () => {
-        const done = () => {
-          setCopied(true);
-          window.setTimeout(() => setCopied(false), 1500);
-        };
-        if (!provide) {
-          void navigator.clipboard.writeText(value ?? "").then(done);
-          return;
-        }
-        const text = provide();
-        if (typeof ClipboardItem === "function" && "write" in navigator.clipboard) {
-          void navigator.clipboard.write([
-            new ClipboardItem({
-              "text/plain": text.then((t) => new Blob([t], { type: "text/plain" }))
-            })
-          ]).then(done, () => void text.then((t) => navigator.clipboard.writeText(t)).then(done));
-          return;
-        }
-        void text.then((t) => navigator.clipboard.writeText(t)).then(done);
-      },
-      ...title ? { title } : {},
-      "aria-label": label,
-      className: "shrink-0 rounded p-0.5 text-muted-foreground hover:bg-card hover:text-foreground focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1",
-      children: copied ? /* @__PURE__ */ jsx(Check, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(Copy, { "aria-hidden": true, className: "size-3.5" })
-    }
-  );
-}
-function CopyUrlButton({ url, storageUrl }) {
-  const s = useFieldStrings();
-  const resolveShare = useResolveShareUrl();
-  const provide = async () => {
-    if (resolveShare && storageUrl) {
-      const shared = await resolveShare(storageUrl);
-      if (shared) return shared;
-    }
-    return absoluteUrl(url);
-  };
-  return /* @__PURE__ */ jsx(CopyButton, { provide, label: s.copyUrl, title: url });
-}
-function absoluteUrl(url) {
-  if (!/^\/(?!\/)/.test(url) || typeof window === "undefined") return url;
-  return `${window.location.origin}${url}`;
-}
-function FileRef({
-  url,
-  storageUrl,
-  mimeType,
-  filename
-}) {
-  const label = fileLabel(url, filename);
-  const title = mimeType ? `${url} \xB7 ${mimeType}` : url;
-  return /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
-    isViewableUrl(url) ? /* @__PURE__ */ jsx(
-      "a",
-      {
-        href: url,
-        target: "_blank",
-        rel: "noreferrer",
-        title,
-        className: "min-w-0 truncate font-mono text-[12px] text-foreground underline underline-offset-2",
-        children: label
-      }
-    ) : /* @__PURE__ */ jsx(
-      "span",
-      {
-        title,
-        className: "min-w-0 truncate font-mono text-[12px] text-muted-foreground",
-        children: label
-      }
-    ),
-    /* @__PURE__ */ jsx(CopyUrlButton, { url, ...storageUrl ? { storageUrl } : {} })
-  ] });
-}
-function paintableUrl(content, resolve) {
-  const resolved = resolve?.(content.url);
-  if (isViewableUrl(resolved)) return resolved;
-  if (isViewableUrl(content.publicUrl)) return content.publicUrl;
-  return isViewableUrl(content.url) ? content.url : void 0;
-}
-var PREVIEWABLE_EXT_RE = /\.(pdf|png|jpe?g|gif|webp|avif|svg)(\?|#|$)/i;
-var PREVIEWABLE_MIME_RE = /^(application\/pdf|image\/)/i;
-function previewableUrl(content, resolve) {
-  const url = paintableUrl(content, resolve);
-  if (!url) return void 0;
-  const named = content.filename ?? url;
-  const renderable = content.mimeType ? PREVIEWABLE_MIME_RE.test(content.mimeType) : PREVIEWABLE_EXT_RE.test(named);
-  return renderable ? url : void 0;
-}
-function DocumentPreview({ url, name }) {
-  return /* @__PURE__ */ jsx(
-    "iframe",
-    {
-      src: url,
-      title: name,
-      loading: "lazy",
-      referrerPolicy: "no-referrer",
-      className: "h-112 w-full rounded-lg border border-border bg-card/40"
-    }
-  );
-}
-function DocumentValue({ value }) {
-  const s = useFieldStrings();
-  const resolve = useResolveUrl();
-  const [open, setOpen] = useState(false);
-  const content = readDocumentContent(value);
-  if (!content) return /* @__PURE__ */ jsx(Absent, {});
-  const name = content.title ?? content.filename ?? fileLabel(content.url, content.filename);
-  const preview = previewableUrl(content, resolve);
-  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" }),
-      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-0.5", children: [
-        name && /* @__PURE__ */ jsx("span", { className: "block truncate text-[13px] text-foreground", children: name }),
-        /* @__PURE__ */ jsx(
-          FileRef,
-          {
-            url: paintableUrl(content, resolve) ?? content.url,
-            storageUrl: content.url,
-            mimeType: content.mimeType,
-            ...content.filename ? { filename: content.filename } : {}
-          }
-        ),
-        content.snippet && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-[12px] leading-relaxed text-muted-foreground", children: content.snippet })
-      ] }),
-      preview && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: () => setOpen((current) => !current),
-          "aria-expanded": open,
-          className: "flex shrink-0 items-center gap-1.5 rounded-md border border-border px-2 py-1 text-[12px] text-muted-foreground hover:bg-card hover:text-foreground focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1",
-          children: [
-            open ? /* @__PURE__ */ jsx(EyeOff, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(Eye, { "aria-hidden": true, className: "size-3.5" }),
-            s.preview
-          ]
-        }
-      )
-    ] }),
-    preview && open && /* @__PURE__ */ jsx(DocumentPreview, { url: preview, name })
-  ] });
-}
-function ImageValue({
-  value,
-  inGallery = false,
-  inRow = false,
-  compact = false
-}) {
-  const s = useFieldStrings();
-  const resolve = useResolveUrl();
-  const content = readImageContent(value);
-  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.
-      /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: src,
-          target: "_blank",
-          rel: "noreferrer",
-          title: content.url,
-          className: inGallery || compact ? "inline-block" : "block w-full",
-          children: /* @__PURE__ */ jsx(
-            LoadingImage,
-            {
-              src,
-              alt: content.caption ?? s.preview,
-              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.
-                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"
-              )
-            }
-          )
-        }
-      )
-    ) : inRow ? (
-      // The row variant of "nothing to paint": an icon and a name, exactly as
-      // a document row reads, because that is what this has become.
-      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2.5", children: [
-        /* @__PURE__ */ jsx(ImageOff, { "aria-hidden": true, className: "size-4 shrink-0 text-muted-foreground" }),
-        /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx(
-          FileRef,
-          {
-            url: content.url,
-            mimeType: content.mimeType,
-            ...content.filename ? { filename: content.filename } : {}
-          }
-        ) })
-      ] })
-    ) : inGallery ? (
-      // Nothing to paint, so the tile says what it is rather than dumping a
-      // ninety-character storage reference into a 140px box. This is what a
-      // host with no resolver sees, so it has to be a design and not a
-      // fallback.
-      /* @__PURE__ */ jsxs("div", { className: "flex aspect-square w-full flex-col items-center justify-center gap-1.5 px-2 text-center", children: [
-        /* @__PURE__ */ jsx(ImageOff, { "aria-hidden": true, className: "size-5 text-muted-foreground" }),
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            title: content.url,
-            className: "w-full truncate font-mono text-[10.5px] text-muted-foreground",
-            children: fileLabel(content.url, content.filename)
-          }
-        )
-      ] })
-    ) : /* @__PURE__ */ jsx(
-      FileRef,
-      {
-        url: content.url,
-        mimeType: content.mimeType,
-        ...content.filename ? { filename: content.filename } : {}
-      }
-    ),
-    src && !compact && /* @__PURE__ */ jsx("div", { className: inGallery ? "px-2.5" : void 0, children: /* @__PURE__ */ jsx(
-      FileRef,
-      {
-        url: paintableUrl(content, resolve) ?? content.url,
-        storageUrl: content.url,
-        mimeType: content.mimeType,
-        ...content.filename ? { filename: content.filename } : {}
-      }
-    ) }),
-    content.caption && /* @__PURE__ */ jsx(
-      "p",
-      {
-        className: cn(
-          "text-[12px] leading-relaxed text-muted-foreground",
-          inGallery && "px-2.5 pb-1.5"
-        ),
-        children: content.caption
-      }
-    )
-  ] });
-}
-var TABULAR_KINDS = /* @__PURE__ */ new Set(["text", "number", "boolean", "date", "enum"]);
-function LeafValue({
-  field,
-  value: raw,
-  compact = false
-}) {
-  const value = unwrap(field, raw);
-  switch (field.kind) {
-    case "list": {
-      const entries = Array.isArray(value) ? value : [];
-      return TABULAR_KINDS.has(field.item.kind) ? /* @__PURE__ */ jsx(ScalarChips, { field: field.item, items: entries }) : /* @__PURE__ */ jsx(ItemCount, { count: entries.length });
-    }
-    case "prose":
-      return compact ? /* @__PURE__ */ jsx(Scalar, { value, compact: true }) : typeof value === "string" && value !== "" ? /* @__PURE__ */ jsx(Markdown, { text: value }) : /* @__PURE__ */ jsx(Scalar, { value });
-    case "boolean":
-      return /* @__PURE__ */ jsx(Bool, { value, compact });
-    case "date":
-      return /* @__PURE__ */ jsx(DateValue, { value });
-    case "document":
-      return /* @__PURE__ */ jsx(DocumentValue, { value });
-    case "image":
-      return /* @__PURE__ */ jsx(ImageValue, { value, compact });
-    default:
-      return /* @__PURE__ */ jsx(Scalar, { value, compact });
-  }
-}
-function LoadingImage({ src, alt, className }) {
-  const [state, setState] = useState("loading");
-  const [current, setCurrent] = useState(src);
-  if (current !== src) {
-    setCurrent(src);
-    setState("loading");
-  }
-  return /* @__PURE__ */ jsxs("span", { className: "relative block", 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",
-        children: /* @__PURE__ */ jsx(Loader2, { "aria-hidden": true, className: "size-4 animate-spin text-muted-foreground" })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "img",
-      {
-        src,
-        alt,
-        onLoad: () => setState("done"),
-        onError: () => setState("done"),
-        className: cn(className, state === "loading" && "min-h-40 opacity-0")
-      }
-    )
-  ] });
-}
-function ScalarChips({ field, items }) {
-  return (
-    // `data-chips` is the hook the definition grid's value cell reaches through:
-    // `text-right` has no effect on flex children, so a row of tags would keep
-    // starting under its label while every value beside it ended at the right
-    // edge. The attribute keeps that one selector out of this component's own
-    // class list - chips are laid out the same way everywhere, and only the
-    // caller knows which edge they should end on.
-    /* @__PURE__ */ jsx("div", { "data-chips": true, className: "flex flex-wrap gap-1.5", children: items.map((item, index) => /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: "rounded-md border border-border bg-card/40 px-2 py-0.5 text-[12.5px] text-foreground",
-        children: /* @__PURE__ */ jsx(LeafValue, { field, value: item })
-      },
-      index
-    )) })
-  );
-}
-function ItemCount({ count }) {
-  const s = useFieldStrings();
-  return /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-[12.5px] text-muted-foreground", children: s.itemsCount(count) });
-}
-function isInlineColumn(field) {
-  if (field.kind === "list") return TABULAR_KINDS.has(field.item.kind);
-  return TABULAR_KINDS.has(field.kind);
-}
-var CELL_LENGTH_LIMIT = 80;
-var EXPAND_COLUMN = "2rem";
-function fitsACellWhole(field) {
-  switch (field.kind) {
-    case "boolean":
-    case "date":
-    case "number":
-    case "enum":
-      return true;
-    case "text":
-      return field.maxLength !== void 0 && field.maxLength <= CELL_LENGTH_LIMIT;
-    case "list":
-      return fitsACellWhole(field.item);
-    default:
-      return false;
-  }
-}
-function ObjectTable({
-  columns,
-  element,
-  items,
-  label
-}) {
-  const s = useFieldStrings();
-  const presentation = useFieldPresentation();
-  const scrollerRef = useRef(null);
-  const [expanded, setExpanded] = useState(() => /* @__PURE__ */ new Set());
-  const [viewportWidth, setViewportWidth] = useState();
-  const canExpand = columns.some((column) => !fitsACellWhole(column));
-  useEffect(() => {
-    const scroller = scrollerRef.current;
-    if (!scroller) return;
-    const measure = () => setViewportWidth(scroller.clientWidth);
-    measure();
-    if (typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(measure);
-    observer.observe(scroller);
-    return () => observer.disconnect();
-  }, []);
-  const toggle = (index) => setExpanded((current) => {
-    const next = new Set(current);
-    if (!next.delete(index)) next.add(index);
-    return next;
-  });
-  return (
-    // `min-w-full` rather than `w-full`, and a floor under each cell: with
-    // `w-full` the table is pinned to the container's width, so twelve columns
-    // do not overflow - they crush, and a reading's date wraps onto four lines.
-    // A floor makes the table wider than the panel instead, which is what the
-    // scroller is for.
-    //
-    // A scrollable region must be reachable by keyboard. A table of values has
-    // nothing to tab to, so the region itself takes focus; without `tabIndex` the
-    // columns past the fold are reachable with a mouse and by no other means,
-    // which the a11y gate catches as `scrollable-region-focusable`. The name
-    // makes the focus stop announce itself rather than being a silent one.
-    //
-    // `group` rather than `region`, and that is not a detail: `region` is a
-    // LANDMARK, so every table would enter the document's landmark list, and two
-    // of them with the same name - which is what a result rendered twice, or a
-    // structure holding two lists, produces - is `landmark-unique`. A group is
-    // named without claiming to be a section of the page.
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref: scrollerRef,
-        role: "group",
-        "aria-label": label,
-        tabIndex: 0,
-        className: "overflow-x-auto rounded-lg border border-border",
-        children: /* @__PURE__ */ jsxs("table", { className: "w-full min-w-full border-collapse text-[13px]", children: [
-          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-border bg-muted text-left", children: [
-            canExpand && /* @__PURE__ */ jsx("th", { scope: "col", style: { width: EXPAND_COLUMN }, className: "px-1", children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: s.rowDetailsColumn }) }),
-            columns.map((column) => /* @__PURE__ */ jsx(
-              "th",
-              {
-                scope: "col",
-                className: cn(
-                  "whitespace-nowrap px-3 py-2 text-[12px] font-semibold text-foreground",
-                  presentation === "app" ? void 0 : "font-mono"
-                ),
-                children: /* @__PURE__ */ jsx(Described, { description: column.description, children: fieldLabel(column.title, column.name, presentation) })
-              },
-              column.name
-            ))
-          ] }) }),
-          /* @__PURE__ */ jsx("tbody", { children: items.map((item, index) => {
-            const isOpen = expanded.has(index);
-            return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-border/60 last:border-b-0", children: [
-              canExpand && /* @__PURE__ */ jsx("td", { className: "px-1 pt-px align-top", children: /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => toggle(index),
-                  "aria-expanded": isOpen,
-                  "aria-label": s.toggleRowDetails(index + 1),
-                  className: "mt-0.5 flex size-6 items-center justify-center rounded text-muted-foreground hover:bg-card hover:text-foreground focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1",
-                  children: isOpen ? /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5" })
-                }
-              ) }),
-              isOpen ? /* @__PURE__ */ jsx("td", { colSpan: columns.length, className: "bg-card/40 p-0", children: /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: "sticky left-0 px-3.5 py-3",
-                  ...viewportWidth ? {
-                    style: {
-                      // Minus the chevron column: this cell starts
-                      // after it, so pinning it to the FULL visible
-                      // width pushes its right edge that far past the
-                      // scroller. See `EXPAND_COLUMN`.
-                      width: canExpand ? `calc(${viewportWidth}px - ${EXPAND_COLUMN})` : viewportWidth
-                    }
-                  } : {},
-                  children: /* @__PURE__ */ jsx(ResultField, { field: element, value: item, hideLabel: true })
-                }
-              ) }) : columns.map((column) => {
-                const cell = typeof item === "object" && item !== null ? ownProp(item, column.name) : void 0;
-                return /* @__PURE__ */ jsx("td", { className: "px-3 py-1.5 align-top", children: /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "max-w-[44ch]",
-                      column.kind === "list" && isInlineColumn(column) ? "min-w-[16ch]" : "truncate"
-                    ),
-                    ...typeof cell === "string" || typeof cell === "number" ? { title: String(cell) } : {},
-                    children: /* @__PURE__ */ jsx(LeafValue, { field: column, value: cell, compact: true })
-                  }
-                ) }, column.name);
-              })
-            ] }) }, index);
-          }) })
-        ] })
-      }
-    )
-  );
-}
-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)) });
-}
-function NativeValue({ value }) {
-  if (value === null || value === void 0 || value === "") return /* @__PURE__ */ jsx(Absent, {});
-  const html = readHtmlContent(value);
-  if (html) return /* @__PURE__ */ jsx(HtmlPreview, { content: html });
-  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 (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 (isRecord(value)) {
-    const text = value.text;
-    if (typeof text === "string") {
-      return text === "" ? /* @__PURE__ */ jsx(Absent, {}) : /* @__PURE__ */ jsx(Markdown, { text });
-    }
-  }
-  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 });
-}
-function isRecord(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-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 content = readImageContent(item);
-    return content ? isViewableUrl(content.publicUrl) || isViewableUrl(content.url) : false;
-  });
-  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(ImageValue, { value: item, inGallery: true }) }, index)) });
-}
-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: kind === "document" ? /* @__PURE__ */ jsx(DocumentValue, { value: item }) : /* @__PURE__ */ jsx(ImageValue, { value: item, inRow: true }) }, index)) });
-}
-function tableColumns(item) {
-  if (item.kind !== "object" || item.fields.length === 0) return void 0;
-  return item.fields;
-}
-function ResultField({ field, value, depth = 0, hideLabel = false }) {
-  const s = useFieldStrings();
-  const unwrapped = unwrap(field, value);
-  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)) {
-    return /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
-      header,
-      /* @__PURE__ */ jsx(DateValue, { value: unwrapped })
-    ] });
-  }
-  if (isNativeHtmlNode(field)) {
-    const content = readHtmlContent(unwrapped);
-    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-      header,
-      content ? /* @__PURE__ */ jsx(HtmlPreview, { content }) : /* @__PURE__ */ jsx(Absent, {})
-    ] });
-  }
-  if (isNativeCompositeNode(field)) {
-    const members = readCompositeContent(unwrapped);
-    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-      header,
-      members && members.length > 0 ? /* @__PURE__ */ jsx(CompositeValue, { members }) : /* @__PURE__ */ jsx(Absent, {})
-    ] });
-  }
-  switch (field.kind) {
-    case "object": {
-      const memberValue = (child) => typeof unwrapped === "object" && unwrapped !== null ? ownProp(unwrapped, child.name) : void 0;
-      return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        header,
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn(
-              // A definition grid, not a stack. Label above value spends two
-              // lines on every field, so a structure of ten is twenty lines of
-              // alternating label and answer with nothing aligned. Beside each
-              // other they take one line and the values line up, which is what
-              // makes a record scannable.
-              //
-              // The label column is CAPPED at 40%, and that is not cosmetic. A
-              // bare `auto` sizes to the widest label in the grid - label text
-              // plus its concept pill - so one long field name starved every
-              // value beside it, and inside a 400px panel a paragraph came out
-              // as a ten-line ribbon in a 130px column. `min-content` keeps a
-              // short label short; the cap stops any label taking more than its
-              // share, whatever the panel width turns out to be.
-              "grid grid-cols-[minmax(min-content,40%)_minmax(0,1fr)] items-baseline gap-x-3 gap-y-1.5",
-              // A list item already sits in its own bordered row; nesting a
-              // second card inside it draws a box in a box for no information
-              // gained.
-              !hideLabel && "rounded-lg border border-border bg-card/40 px-3.5 py-3"
-            ),
-            children: field.fields.map(
-              (child) => (
-                // Only a SHORT value shares a line. Prose needs the full width, and
-                // 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: [
-                  /* @__PURE__ */ jsx("div", { className: "min-w-0", children: /* @__PURE__ */ jsx(Label2, { field: child, describe: true }) }),
-                  /* @__PURE__ */ jsx("div", { className: "min-w-0 text-right **:data-chips:justify-end", children: /* @__PURE__ */ jsx(LeafValue, { field: child, value: memberValue(child) }) })
-                ] }, child.name) : /* @__PURE__ */ jsx("div", { className: "col-span-2 min-w-0", children: /* @__PURE__ */ jsx(ResultField, { field: child, value: memberValue(child), depth: depth + 1 }) }, child.name)
-              )
-            )
-          }
-        )
-      ] });
-    }
-    case "list": {
-      const items = Array.isArray(unwrapped) ? unwrapped : [];
-      const columns = tableColumns(field.item);
-      return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__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) })
-        ] }),
-        items.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-[13px] italic text-muted-foreground", children: s.noItemsYet }) : columns ? (
-          // Same shape every row: the labels are column headers, not per-row
-          // labels. See `ObjectTable`.
-          /* @__PURE__ */ jsx(
-            ObjectTable,
-            {
-              columns,
-              element: field.item,
-              items,
-              label: field.title ?? humanizeFieldName(field.name)
-            }
-          )
-        ) : TABULAR_KINDS.has(field.item.kind) ? /* @__PURE__ */ jsx(ScalarChips, { field: field.item, items }) : field.item.kind === "prose" || field.item.kind === "unknown" ? (
-          // `unknown` shares the LINES layout, and that is a reading of the
-          // standard rather than a convenience. `unknown` is the deliberate
-          // escape hatch: the producer could not map the node honestly and
-          // said so, which is what an untyped `type = "list"` field derives
-          // to. A card per entry would spend a bordered box and an index on
-          // each value to say nothing extra - the card earns its place around
-          // a STRUCTURE, and this is precisely the node we have been told is
-          // not known to be one. Lines cost nothing and read the same whether
-          // the entries turn out to be words or objects, because `LeafValue`
-          // falls through to `RawValue` either way.
-          /* @__PURE__ */ jsx(ScalarLines, { field: field.item, items })
-        ) : field.item.kind === "image" ? /* @__PURE__ */ jsx(ImageGallery, { items }) : field.item.kind === "document" ? /* @__PURE__ */ jsx(FileRows, { items, kind: "document" }) : (
-          // Nested, or carrying prose: a card per entry is what a table cell
-          // cannot hold. The index label earns its place here, where the
-          // entries are structures rather than values.
-          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: items.map((item, index) => /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "space-y-2 rounded-lg border border-border bg-card/40 px-3.5 py-3",
-              children: [
-                /* @__PURE__ */ jsx("span", { className: "font-mono text-[10px] text-muted-foreground", children: index + 1 }),
-                /* @__PURE__ */ jsx(ResultField, { field: field.item, value: item, depth: depth + 1, hideLabel: true })
-              ]
-            },
-            index
-          )) })
-        )
-      ] });
-    }
-    case "boolean":
-    case "date":
-    case "document":
-    case "image":
-    case "text":
-    case "prose":
-    case "number":
-    case "enum":
-    case "unknown":
-      return /* @__PURE__ */ jsxs("div", { className: field.kind === "image" ? "space-y-1.5" : "space-y-0.5", children: [
-        copyText === void 0 ? header : /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
-          /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: header }),
-          /* @__PURE__ */ jsx(CopyButton, { value: copyText, label: s.copyText })
-        ] }),
-        /* @__PURE__ */ jsx(LeafValue, { field, value })
-      ] });
-  }
-  return null;
-}
-
-// src/react/download-stuff.ts
-function saveBlob(blob, filename) {
-  const href = URL.createObjectURL(blob);
-  const anchor = document.createElement("a");
-  anchor.href = href;
-  anchor.download = filename;
-  document.body.appendChild(anchor);
-  anchor.click();
-  anchor.remove();
-  setTimeout(() => URL.revokeObjectURL(href), 0);
-}
-function mimeForExtension(extension) {
-  return extension === "html" ? "text/html;charset=utf-8" : "text/plain;charset=utf-8";
-}
-function extensionOf(url, filename) {
-  const named = filename?.match(/\.([A-Za-z0-9]{1,8})$/)?.[1];
-  if (named) return named.toLowerCase();
-  const path = url.split(/[?#]/)[0] ?? url;
-  const match = path.match(/\.([A-Za-z0-9]{1,8})$/)?.[1];
-  return match ? match.toLowerCase() : "";
-}
-function fileNameFor(file, base) {
-  if (file.filename) return file.filename;
-  const extension = file.extension ?? extensionOf(file.url ?? "", file.filename);
-  const stem = `${base}-${file.path.replace(/\./g, "-")}`;
-  return extension ? `${stem}.${extension}` : stem;
-}
-async function downloadStuff({
-  field,
-  value,
-  baseName,
-  resolveUrl
-}) {
-  const files = collectStuffFiles(field, value);
-  const isBareFile = files.length === 1 && files[0]?.path === field.name;
-  for (const file of files) {
-    const name = fileNameFor(file, baseName);
-    if (file.text !== void 0) {
-      saveBlob(new Blob([file.text], { type: mimeForExtension(file.extension) }), name);
-      continue;
-    }
-    const href = resolveUrl?.(file.url ?? "") ?? file.publicUrl ?? file.url;
-    if (!href) continue;
-    try {
-      const response = await fetch(href);
-      if (!response.ok) throw new Error(String(response.status));
-      saveBlob(await response.blob(), name);
-    } catch {
-      window.open(href, "_blank", "noopener");
-    }
-  }
-  if (isBareFile) return;
-  saveBlob(
-    new Blob([JSON.stringify(value, null, 2)], { type: "application/json;charset=utf-8" }),
-    `${baseName}.json`
-  );
-}
-var JSON_TOKEN_RE = /("(?:\\.|[^"\\])*"\s*:)|("(?:\\.|[^"\\])*")|(\b(?:true|false|null)\b|-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?)/g;
-function highlight(json) {
-  const out = [];
-  let last = 0;
-  for (const match of json.matchAll(JSON_TOKEN_RE)) {
-    const [token, key, str, literal] = match;
-    const at = match.index;
-    if (at > last) {
-      out.push(
-        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: json.slice(last, at) }, `p${last}`)
-      );
-    }
-    out.push(
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: key ? "text-muted-foreground" : str ? "text-foreground" : "font-semibold text-foreground",
-          children: token
-        },
-        at
-      )
-    );
-    last = at + token.length;
-  }
-  if (last < json.length) {
-    out.push(
-      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: json.slice(last) }, "tail")
-    );
-  }
-  return out;
-}
-function JsonView({ value }) {
-  const s = useFieldStrings();
-  const [copied, setCopied] = useState(false);
-  const text = value === null || value === void 0 ? void 0 : typeof value === "object" ? stringifyValue(value) : JSON.stringify(value);
-  if (text === void 0) {
-    return /* @__PURE__ */ jsx(Absent, {});
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-    typeof navigator !== "undefined" && navigator.clipboard && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => {
-          void navigator.clipboard.writeText(text).then(() => {
-            setCopied(true);
-            window.setTimeout(() => setCopied(false), 1500);
-          });
-        },
-        "aria-label": s.copyJson,
-        className: "absolute right-2 top-2 rounded border border-border bg-card p-1 text-muted-foreground hover:text-foreground focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1",
-        children: copied ? /* @__PURE__ */ jsx(Check, { "aria-hidden": true, className: "size-3.5" }) : /* @__PURE__ */ jsx(Copy, { "aria-hidden": true, className: "size-3.5" })
-      }
-    ),
-    /* @__PURE__ */ jsx("pre", { className: "overflow-x-auto rounded-lg border border-border bg-card/40 px-3.5 py-3 pr-12 font-mono text-[12px] leading-relaxed", children: highlight(text) })
-  ] });
-}
-function StuffViewer({
-  field,
-  value,
-  name,
-  defaultView = "rendered",
-  downloadBaseName,
-  hideDownload = false,
-  className
-}) {
-  const s = useFieldStrings();
-  const named = name ? { ...field, name } : field;
-  const [view, setView] = useState(defaultView);
-  const [saving, setSaving] = useState(false);
-  const resolveUrl = useResolveUrl();
-  const handleDownload = useCallback(async () => {
-    setSaving(true);
-    try {
-      await downloadStuff({
-        field,
-        value,
-        baseName: downloadBaseName ?? named.name ?? "result",
-        resolveUrl
-      });
-    } finally {
-      setSaving(false);
-    }
-  }, [field, named.name, value, downloadBaseName, resolveUrl]);
-  const views = [
-    { id: "rendered", label: s.viewRendered },
-    { id: "json", label: s.viewJson }
-  ];
-  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-start justify-between gap-x-4 gap-y-1", children: [
-      /* @__PURE__ */ jsx("div", { className: "min-w-0 space-y-1", children: /* @__PURE__ */ jsx(ResultHeader, { field: named }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
-        !hideDownload && /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => void handleDownload(),
-            disabled: saving,
-            "aria-label": s.download,
-            className: "inline-flex items-center gap-1.5 rounded-md border border-border px-2 py-1 text-[12px] text-muted-foreground hover:text-foreground focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1 disabled:opacity-60",
-            children: [
-              saving ? /* @__PURE__ */ jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx(Download, { className: "h-3.5 w-3.5" }),
-              saving ? s.downloading : s.download
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            role: "group",
-            "aria-label": s.resultViewGroup,
-            className: "flex rounded-md border border-border p-0.5",
-            children: views.map(({ id, label }) => /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => setView(id),
-                "aria-pressed": view === id,
-                className: cn(
-                  "rounded px-2 py-0.5 text-[12px] focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-offset-1",
-                  view === id ? "bg-card font-medium text-foreground" : "text-muted-foreground hover:text-foreground"
-                ),
-                children: label
-              },
-              id
-            ))
-          }
-        )
-      ] })
-    ] }),
-    view === "json" ? /* @__PURE__ */ jsx(JsonView, { value }) : /* @__PURE__ */ jsx(ResultField, { field, value, hideLabel: true })
-  ] });
-}
-
-export { BooleanField, ConceptPill, DEFAULT_FIELD_STRINGS, DateField, DocumentField, EnumField, FieldDomIdProvider, FieldPresentationProvider, FieldRenderer, FieldShell, FieldStringsProvider, HtmlPreview, ImageField, JsonView, ListField, Markdown, NumberField, ObjectField, OptionalToggle, ProseField, ResultEnvProvider, ResultField, StuffViewer, TextField, UnknownField, downloadStuff, fieldControlClass, humanizeFieldName, useFieldDomId, useFieldPresentation, useFieldStrings, useResolveShareUrl, useResolveUrl, useResolvedUrl };
+export { BooleanField, ConceptPill, DEFAULT_FIELD_STRINGS, DateField, DocumentField, EnumField, FieldDomIdProvider, FieldPresentationProvider, FieldRenderer, FieldShell, FieldStringsProvider, HtmlPreview, ImageField, JsonView, ListField, Markdown, NumberField, ObjectField, OptionalToggle, ProseField, ResultEnvProvider, ResultField, StuffViewer, TextField, UnknownField, downloadStuff, fieldControlClass, humanizeFieldName, useFieldDomId, useFieldPresentation, useFieldStrings, useProseImages, useResolveShareUrl, useResolveUrl, useResolvedUrl } from '../chunk-KG4IYFWI.js';
+import '../chunk-S4CB423P.js';
+import '../chunk-AZZAAGNX.js';
+import '../chunk-25I6JDIK.js';
+import '../chunk-2JWRG53S.js';
+import '../chunk-PM55AHRO.js';
+import '../chunk-GKV77RAS.js';
+import '../chunk-V3OV2XQT.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map